/* =====================================================================
   AI LAB — spoločná kostra verejných podstránok (0.7.92 NOC)
   ---------------------------------------------------------------------
   Hlavička, pätička, tlačidlá a základná typografia pre lander, stránku
   404 a právne dokumenty. Hlavná stránka nesie tie isté hodnoty vo svojom
   hárku (je to referencia), podstránky ich majú odtiaľto -- jedna firma na
   každej adrese, a jedno miesto, kde sa kostra mení.

   Tokeny (`:root`) sú tie isté ako na landingu a v appke (spec §3a,
   Graphite & Lime). Každá stránka ich smie zopakovať vo vlastnom `:root`,
   aby stála aj bez tohto súboru; hodnoty sa nesmú líšiť.
   Pohyb: len transform a opacity; `prefers-reduced-motion` ho vypína.
   ===================================================================== */
  /* 0.7.92: záložné písma s mierkou nameranou v prehliadači (šírka vety
     v Geist ≈ 102 % Arialu, Instrument Sans v zúženom reze ≈ 84 %). Kým
     dorazia webové písma, text zaberá skoro to isté miesto -- výmena
     písma potom nepreloží riadky a nepohne stránkou (CLS 0,18 na
     právnych stránkach pred touto úpravou). */
  @font-face{font-family:"Geist Fallback";src:local("Arial");size-adjust:102%}
  @font-face{font-family:"Instrument Sans Fallback";src:local("Arial");size-adjust:84%}
  @font-face{font-family:"Geist Mono Fallback";src:local("Courier New");size-adjust:100%}
:root{
  --bg:#0B0D10; --bg2:#0F1216; --sur:#111419; --sur2:#171B21; --sur3:#1F242B;
  --ink:#ECEEF0; --ink2:#A4AAB2; --ink3:#7A818A;
  --hair:rgba(236,238,240,.07); --hair2:rgba(236,238,240,.13); --hair3:rgba(236,238,240,.24);
  --acc:#C6FF00; --acc2:#D4FF4D; --on-acc:#0B0D10; --acc-soft:rgba(198,255,0,.12);
  --display:"Instrument Sans","Instrument Sans Fallback","Geist","Segoe UI",system-ui,sans-serif;
  --sans:"Geist","Geist Fallback","Segoe UI",system-ui,-apple-system,sans-serif;
  --mono:"Geist Mono","Geist Mono Fallback",ui-monospace,"Cascadia Mono",Menlo,Consolas,monospace;
  --ez:cubic-bezier(.23,1,.32,1); --drawer:cubic-bezier(.32,.72,0,1);
  --r:20px; --r-in:16px; --wrap:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;
     -webkit-font-smoothing:antialiased;overflow-x:hidden}
[hidden]{display:none!important}
a{color:inherit}
::selection{background:var(--acc);color:var(--on-acc)}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(18px,4vw,40px)}
.skip{position:absolute;left:-999px;top:12px;background:var(--acc);color:var(--on-acc);padding:10px 14px;
      border-radius:999px;z-index:200;text-decoration:none;font-weight:600}
.skip:focus{left:12px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;
         text-transform:uppercase;color:var(--ink3)}
.eyebrow::before{content:"";width:18px;height:1px;background:var(--acc)}

/* ---- tlačidlá: tie isté ako na landingu ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--sans);font-weight:700;
     font-size:15px;padding:12px 22px;border-radius:999px;border:1px solid transparent;cursor:pointer;white-space:nowrap;
     text-decoration:none;transition:transform .16s var(--ez),background .12s ease,border-color .12s ease,color .12s ease}
.btn:active{transform:scale(.98)}
.btn-a{background:var(--acc);color:var(--on-acc)}
.btn-a:hover{background:var(--acc2)}
.btn-b{background:rgba(236,238,240,.04);color:var(--ink);border-color:var(--hair2)}
.btn-b:hover{border-color:var(--hair3);background:rgba(236,238,240,.07)}
.btn-sm{padding:8px 16px;font-size:13.5px}
.btn-lg{padding:15px 26px;font-size:16px}
.bic{flex:none;width:24px;height:24px;margin-right:-8px;border-radius:50%;display:inline-flex;align-items:center;
     justify-content:center;font-size:12px;line-height:1;background:rgba(11,13,16,.16);transition:transform .28s var(--ez)}
@media (hover:hover) and (pointer:fine){ .btn:hover .bic{transform:translate(3px,-2px)} }
.lnk{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--ink);text-decoration:none;
     border-bottom:1px solid var(--hair3);padding-bottom:2px;transition:border-color .12s ease,color .12s ease}
.lnk:hover{border-color:var(--acc);color:var(--acc2)}

/* ---- hlavička: tá istá pilulka ako na landingu, lepivá namiesto fixnej ---- */
.hdr{position:sticky;top:0;z-index:60;display:flex;justify-content:center;padding:14px 12px 0;pointer-events:none}
.nv{pointer-events:auto;display:flex;align-items:center;gap:14px;padding:6px 6px 6px 16px;border-radius:999px;
    background:rgba(23,26,31,.82);border:1px solid var(--hair2);
    box-shadow:inset 0 1px 0 rgba(236,238,240,.08),0 20px 60px -30px rgba(0,0,0,.8);
    -webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
    max-width:calc(100vw - 24px)}
.brand{display:flex;align-items:center;gap:9px;font-family:var(--display);font-weight:700;font-size:16px;
       letter-spacing:-.02em;white-space:nowrap;text-decoration:none;color:var(--ink)}
.mark{width:26px;height:26px;color:var(--acc);flex:none}
.nv-links{display:flex;gap:2px}
.nv-links a{padding:8px 12px;border-radius:999px;font-size:14px;font-weight:600;color:var(--ink2);text-decoration:none;
            transition:color .12s ease,background .12s ease}
.nv-links a:hover,.nv-links a[aria-current="page"]{color:var(--ink);background:rgba(236,238,240,.07)}
.nv-act{display:flex;align-items:center;gap:8px;margin-left:auto}
.lang{display:flex;border:1px solid var(--hair2);border-radius:999px;overflow:hidden}
.lang button{font-family:var(--mono);font-size:11px;padding:6px 10px;border:0;background:transparent;color:var(--ink3);
             cursor:pointer;transition:background .12s ease,color .12s ease}
.lang button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.nv-login{font-size:14px;font-weight:600;color:var(--ink2);padding:8px 12px;border-radius:999px;text-decoration:none}
.nv-login:hover{color:var(--ink)}
/* 0.7.92 kontrola: menu podstránok na telefóne. `<details>` sa otvára bez
   skriptu; zatvorený obsah skryje prehliadač sám, takže .nv-sheet smie
   mať display. Na počítači je menu preč -- odkazy sú v pilulke. */
.nv-menu{display:none;position:relative}
.nv-menu summary{list-style:none;width:38px;height:38px;border-radius:50%;border:1px solid var(--hair2);cursor:pointer;position:relative}
.nv-menu summary::-webkit-details-marker{display:none}
.nv-menu summary i{position:absolute;left:11px;right:11px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s var(--ez)}
.nv-menu summary i:first-child{top:14px}.nv-menu summary i:last-child{top:22px}
.nv-menu[open] summary i:first-child{transform:translateY(4px) rotate(45deg)}
.nv-menu[open] summary i:last-child{transform:translateY(-4px) rotate(-45deg)}
.nv-sheet{position:absolute;right:0;top:calc(100% + 12px);min-width:220px;display:flex;flex-direction:column;padding:8px;
          border-radius:20px;background:rgba(23,26,31,.97);border:1px solid var(--hair2);
          box-shadow:inset 0 1px 0 rgba(236,238,240,.08),0 24px 60px -24px rgba(0,0,0,.9);animation:nvSheet .22s var(--ez)}
.nv-sheet a{padding:12px 14px;border-radius:12px;font-weight:600;font-size:16px;color:var(--ink);text-decoration:none}
.nv-sheet a:hover{background:rgba(236,238,240,.07)}
@keyframes nvSheet{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ .nv-sheet{animation:none} .nv-menu summary i{transition:none} }
@media (max-width:860px){ .nv-links,.nv-login{display:none} .nv-menu{display:block} }
@media (max-width:420px){ .nv .lang{display:none} }

/* ---- pätička: tá istá na každej verejnej stránke ---- */
.ft{border-top:1px solid var(--hair);padding:clamp(48px,6vw,72px) 0 28px;margin-top:clamp(64px,8vw,120px);
    background:linear-gradient(180deg,transparent,rgba(236,238,240,.015))}
.ft-in{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px}
.ft-brand{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.ft-brand .brand{font-size:17px}
.ft-brand p{margin:0;color:var(--ink3);font-size:14px;max-width:34ch}
.ft-col{display:flex;flex-direction:column;gap:9px}
.ft-col b{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);
          margin-bottom:6px;font-weight:500}
.ft-col a,.ft-col span{color:var(--ink2);font-size:14.5px;width:fit-content;text-decoration:none}
.ft-col a{border-bottom:1px solid transparent;transition:color .12s ease,border-color .12s ease}
.ft-col a:hover{color:var(--ink);border-color:var(--hair3)}
.ft-base{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;
         margin-top:clamp(36px,5vw,56px);padding-top:20px;border-top:1px solid var(--hair);
         font-family:var(--mono);font-size:11.5px;letter-spacing:.02em;color:var(--ink3)}
.ft-base a{color:var(--ink2);text-decoration:none}
.ft-base a:hover{color:var(--ink)}
@media (max-width:860px){ .ft-in{grid-template-columns:1fr 1fr} .ft-brand{grid-column:1/-1} }

/* ---- odhalenie pri príchode: len priehľadnosť a posun ---- */
.rise{animation:site-rise .8s var(--ez) both}
.rise.d1{animation-delay:.08s}.rise.d2{animation-delay:.16s}.rise.d3{animation-delay:.24s}
@keyframes site-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rise{animation:none}
  .btn,.bic,.lnk{transition:none}
}