/* ════════════════════════════════════════════════════════════
   QUANTO INTELLIGENCE — brand stylesheet (light / bílo-šedá)
   ════════════════════════════════════════════════════════════ */
@font-face{font-family:'Avenir Next';src:url('/static/fonts/AvenirNext-UltraLight.woff2') format('woff2');font-weight:200;font-style:normal;font-display:swap}
@font-face{font-family:'Avenir Next';src:url('/static/fonts/AvenirNext-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Avenir Next';src:url('/static/fonts/AvenirNext-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Avenir Next';src:url('/static/fonts/AvenirNext-DemiBold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Avenir Next';src:url('/static/fonts/AvenirNext-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

:root{
  /* QUANTO brand grayscale (dle manuálu) */
  --q-black:#000000; --q-g1:#4d4d4d; --q-g2:#585858; --q-g3:#606060;
  --q-g4:#9c9c9c; --q-g5:#a4a4a4; --q-g6:#b3b3b3; --q-g7:#bababa; --q-g8:#c7c7c7; --q-g9:#f0efef;
  --q-bg:#ffffff;
  --q-bg-soft:#f6f6f7;        /* odvozeno od #f0efef */
  --q-bg-tint:#eeeeef;
  --q-card:#fcfcfd;
  --q-ink:#000000;            /* brand black */
  --q-ink-soft:#404040;
  --q-muted:#606060;          /* brand gray */
  --q-faint:#9c9c9c;          /* brand gray */
  --q-line:rgba(0,0,0,.11);
  --q-line-soft:rgba(0,0,0,.06);
  /* metalická šeď z loga — brand odstíny, čitelná na bílé */
  --q-metal:linear-gradient(135deg,#4d4d4d 0%,#9c9c9c 36%,#585858 52%,#c7c7c7 74%,#606060 100%);
  --q-metal-soft:linear-gradient(135deg,#606060,#b3b3b3);
  --q-shadow:0 1px 2px rgba(0,0,0,.05),0 10px 30px rgba(0,0,0,.06);
  --q-shadow-lg:0 18px 50px rgba(0,0,0,.13);
  --q-radius:16px; --q-font:'Avenir Next','Helvetica Neue',Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--q-bg);color:var(--q-ink);font-family:var(--q-font);font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.q-metal{background:var(--q-metal);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.q-btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--q-font);font-weight:600;font-size:15px;padding:13px 26px;border-radius:40px;border:none;cursor:pointer;background:linear-gradient(135deg,#404040,#000000);color:#fff;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease;box-shadow:var(--q-shadow)}
.q-btn:hover{transform:translateY(-2px);box-shadow:var(--q-shadow-lg)}
.q-btn.ghost{background:#fff;color:var(--q-ink);border:1px solid var(--q-line);box-shadow:none}
.q-btn.ghost:hover{border-color:rgba(20,24,28,.28);background:var(--q-bg-soft)}
.q-track{letter-spacing:.22em}

/* ════════ TMAVÝ REŽIM — brand (landing, login) ════════ */
html[data-theme="dark"]{
  color-scheme:dark;
  --q-bg:#0f1215; --q-bg-soft:#161a1f; --q-bg-tint:#1a1f25; --q-card:#171b21;
  --q-ink:#eceef1; --q-ink-soft:#d3d7dc; --q-muted:#a2a8b0; --q-faint:#7a8189;
  --q-line:rgba(255,255,255,.14); --q-line-soft:rgba(255,255,255,.07);
  --q-metal:linear-gradient(135deg,#b9b9b9 0%,#6f6f6f 36%,#cfcfcf 52%,#8a8a8a 74%,#c2c2c2 100%);
  --q-metal-soft:linear-gradient(135deg,#9c9c9c,#5f5f5f);
  --q-shadow:0 1px 2px rgba(0,0,0,.5),0 10px 30px rgba(0,0,0,.45);
  --q-shadow-lg:0 18px 50px rgba(0,0,0,.65);
}
html[data-theme="dark"] body{background:var(--q-bg);color:var(--q-ink)}
html[data-theme="dark"] .q-btn{background:linear-gradient(135deg,#e8eaed,#c6cad0);color:#14171b}
html[data-theme="dark"] .q-btn.ghost{background:none;color:var(--q-ink);border:1px solid var(--q-line)}
/* přepínač režimu (kruhové tlačítko) */
.q-theme-toggle{width:36px;height:36px;border-radius:50%;border:1px solid var(--q-line);background:var(--q-bg);color:var(--q-muted);font-size:15px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:.15s;padding:0}
.q-theme-toggle:hover{color:var(--q-ink);transform:translateY(-1px);box-shadow:var(--q-shadow)}
