/* ============================================================
   NIZOV.AI — base + primitives
   Terminal-instrument aesthetic: hairlines, mono eyebrows,
   numbers-in-text, one orange signal. No cards-with-shadows.
   ============================================================ */

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

html{ -webkit-text-size-adjust:100%; }
body{
  background:var(--bg-0);
  color:var(--ink-0);
  font-family:var(--display);
  font-size:var(--t-body);
  line-height:1.55;
  letter-spacing:var(--tight);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.is-boot{ overflow:hidden; }            /* lock scroll during boot */

::selection{ background:var(--accent); color:var(--accent-ink); }

img,svg,video{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:none; cursor:pointer; }

/* ---- ambient background: drifting deep glows (Linear-style depth) + faint texture ---- */
.bg{ position:fixed; inset:0; z-index:var(--z-bg); pointer-events:none; overflow:hidden; background:var(--bg-0);
  transform:translate3d(var(--mx,0px), var(--my,0px), 0); will-change:transform; }
.bg::before{
  content:""; position:absolute; inset:-25%;
  background:
    radial-gradient(36% 30% at 20% 12%, rgba(255,92,0,.11), transparent 60%),
    radial-gradient(42% 34% at 84% 28%, rgba(255,110,30,.06), transparent 62%),
    radial-gradient(64% 52% at 50% 112%, rgba(255,120,40,.06), transparent 60%);
  animation:bgdrift 28s var(--ease) infinite alternate;
}
.bg::after{
  content:""; position:absolute; inset:0;
  background:
    repeating-linear-gradient(0deg, var(--scan) 0 1px, transparent 1px 3px),
    linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px) 0 0/100% 82px,
    linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px) 0 0/82px 100%;
  -webkit-mask-image:radial-gradient(135% 95% at 50% 6%, #000 28%, transparent 86%);
          mask-image:radial-gradient(135% 95% at 50% 6%, #000 28%, transparent 86%);
}
@keyframes bgdrift{ 0%{ transform:translate3d(0,0,0) scale(1); } 100%{ transform:translate3d(-3%,2.5%,0) scale(1.09); } }

/* ---- layout ---- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
section{ position:relative; z-index:var(--z-content); padding-block:var(--section); }
.stack > * + *{ margin-top:var(--gap); }

/* ---- engraved hairline (DESIGN doctrine: gradient, never flat) ---- */
.rule{ height:1px; border:0; background:linear-gradient(90deg,transparent,var(--line-1) 18%,var(--line-1) 82%,transparent); }

/* ---- mono eyebrow / terminal label ---- */
.eyebrow{
  font-family:var(--mono); font-size:var(--t-mono); font-weight:500;
  letter-spacing:var(--wide); text-transform:uppercase; color:var(--ink-1);
  display:inline-flex; align-items:center; gap:.6em;
}
.eyebrow::before{ content:">"; color:var(--accent); }
.eyebrow--plain::before{ content:none; }
.tag{
  font-family:var(--mono); font-size:var(--t-micro); letter-spacing:var(--wide);
  text-transform:uppercase; color:var(--accent); border:1px solid var(--accent-dim);
  padding:.35em .7em; border-radius:999px; background:var(--accent-dim);
}

/* ---- type ---- */
.display{ font-weight:700; line-height:1.02; letter-spacing:-0.03em; }
h1,h2,h3{ font-weight:700; line-height:1.05; letter-spacing:-0.025em; }
.h-hero{ font-size:var(--t-hero); }
.h1{ font-size:var(--t-h1); }
.h2{ font-size:var(--t-h2); }
.h3{ font-size:var(--t-h3); }
.dim{ color:var(--ink-1); }
.dimmer{ color:var(--ink-2); }
.accent{ color:var(--accent); }
.mono{ font-family:var(--mono); }
.num{ font-family:var(--mono); font-variant-numeric:tabular-nums; letter-spacing:0; }
.lede{ font-size:clamp(1.1rem,1.6vw,1.4rem); color:var(--ink-1); max-width:54ch; line-height:1.5; }

/* second word of a title dimmed — free contrast (DESIGN rule) */
.title-split em{ font-style:normal; color:var(--ink-2); }

/* ---- buttons ---- */
.btn{
  display:inline-flex; align-items:center; gap:.6em;
  font-family:var(--mono); font-size:var(--t-sm); font-weight:500; letter-spacing:.02em;
  padding:.85em 1.4em; border-radius:var(--radius-s);
  border:1px solid var(--line-1); color:var(--ink-0);
  transition:border-color var(--dur-1) var(--ease), background var(--dur-1) var(--ease), transform var(--dur-1) var(--ease);
}
.btn:hover{ border-color:var(--ink-1); background:var(--bg-2); transform:translateY(-1px); }
/* liquid-glass primary CTA (Apple-ish): translucent fill + inner highlight + sheen sweep */
.btn--accent{
  position:relative; overflow:hidden; color:var(--accent-ink); font-weight:600;
  border:1px solid rgba(255,160,90,.55);
  background:linear-gradient(135deg, rgba(255,142,62,.96), rgba(255,92,0,.96));
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  box-shadow:inset 0 1px 0 rgba(255,224,196,.6), inset 0 -3px 10px rgba(120,40,0,.32), 0 10px 30px -12px var(--glow);
}
.btn--accent::after{
  content:""; position:absolute; top:0; left:0; width:65%; height:100%; pointer-events:none;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.5), transparent);
  transform:translateX(-185%) skewX(-18deg); transition:transform .7s var(--ease-out);
}
.btn--accent:hover{ transform:translateY(-1px); border-color:rgba(255,190,140,.85);
  box-shadow:inset 0 1px 0 rgba(255,232,206,.65), inset 0 -3px 10px rgba(120,40,0,.3), 0 16px 40px -12px var(--glow); }
.btn--accent:hover::after{ transform:translateX(220%) skewX(-18deg); }
.btn .ar{ transition:transform var(--dur-1) var(--ease); }
.btn:hover .ar{ transform:translateX(3px); }

/* ---- nav ---- */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:var(--z-nav);
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem var(--pad);
  font-family:var(--mono); font-size:var(--t-mono);
  transition:background var(--dur-2) var(--ease), border-color var(--dur-2) var(--ease), backdrop-filter var(--dur-2) var(--ease);
  border-bottom:1px solid transparent;
}
.nav.is-stuck{ background:rgba(7,8,9,.72); backdrop-filter:blur(12px); border-bottom-color:var(--line); }
.nav__brand{ display:flex; align-items:center; gap:.55em; font-weight:600; letter-spacing:.02em; }
.nav__brand .dot{ width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 8px var(--accent); animation:pulse 2.4s var(--ease) infinite; }
.nav__links{ display:flex; gap:1.4rem; color:var(--ink-1); }
.nav__links a{ position:relative; transition:color var(--dur-1) var(--ease); }
.nav__links a:hover{ color:var(--ink-0); }
.nav__links a::after{ content:""; position:absolute; left:0; bottom:-4px; width:0; height:1px; background:var(--accent); transition:width var(--dur-1) var(--ease); }
.nav__links a:hover::after{ width:100%; }
@media(max-width:820px){ .nav__links{ display:none; } }

@keyframes pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.35; } }

/* ---- terminal nav menu (signature; replaces inline links) ---- */
.nav__links{ display:none !important; }
.nav__menu{ display:inline-flex; align-items:center; gap:.6rem; font-family:var(--mono); font-size:var(--t-mono);
  letter-spacing:.14em; text-transform:uppercase; color:var(--ink-1); background:none; border:0; cursor:pointer; padding:.3rem 0; transition:color .3s var(--ease); }
.nav__menu:hover{ color:var(--ink-0); }
.nav__menu-ico{ display:inline-flex; flex-direction:column; justify-content:center; gap:5px; width:22px; height:13px; }
.nav__menu-ico i{ display:block; height:1.5px; width:100%; background:currentColor; transition:transform .32s var(--ease), opacity .25s; }
.nav__menu.is-active{ color:var(--accent); }
.nav__menu.is-active .nav__menu-ico i:first-child{ transform:translateY(3.25px) rotate(45deg); }
.nav__menu.is-active .nav__menu-ico i:last-child{ transform:translateY(-3.25px) rotate(-45deg); }

.navmenu{ position:fixed; inset:0; z-index:1000; background:rgba(7,8,9,.95);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  display:flex; flex-direction:column; justify-content:center; padding:var(--pad);
  opacity:0; visibility:hidden; transform:translateY(-1.5%);
  transition:opacity .4s var(--ease), transform .4s var(--ease), visibility .4s; }
.navmenu.is-open{ opacity:1; visibility:visible; transform:none; }
.navmenu__top{ position:absolute; top:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between;
  padding:1.4rem var(--pad); font-family:var(--mono); font-size:var(--t-mono); }
.navmenu__home{ color:var(--ink-2); letter-spacing:.12em; transition:color .3s var(--ease); }
.navmenu__home:hover{ color:var(--accent); }
.navmenu__close{ display:inline-flex; align-items:center; gap:.5em; background:none; border:0; cursor:pointer;
  color:var(--ink-1); font-family:var(--mono); font-size:var(--t-mono); letter-spacing:.14em; text-transform:uppercase; transition:color .3s var(--ease); }
.navmenu__close:hover{ color:var(--accent); }
.navmenu__esc{ color:var(--ink-2); }
.navmenu__list{ width:100%; max-width:var(--maxw); margin-inline:auto; display:flex; flex-direction:column; gap:clamp(.2rem,1vw,.7rem); }
.navmenu__item{ display:flex; align-items:baseline; gap:clamp(1rem,3vw,2.6rem); padding:.45rem 0; border-bottom:1px solid transparent;
  opacity:0; transform:translateY(16px); }
.navmenu.is-open .navmenu__item{ opacity:1; transform:none;
  transition:opacity .55s var(--ease) calc(var(--d,0s) + .12s), transform .55s var(--ease-out) calc(var(--d,0s) + .12s); }
.navmenu__cmd{ font-family:var(--mono); font-size:var(--t-mono); color:var(--accent); letter-spacing:.05em; min-width:10ch; opacity:.85; }
.navmenu__lbl{ font-family:var(--display); font-weight:700; font-size:clamp(2.2rem,7vw,4.4rem); line-height:1.04; letter-spacing:-0.025em; color:var(--ink-1); transition:color .3s var(--ease); }
.navmenu__item:hover{ border-bottom-color:var(--line); }
.navmenu__item:hover .navmenu__lbl{ color:var(--ink-0); }
.navmenu__item.is-accent .navmenu__lbl{ color:var(--accent); }
@media(max-width:560px){ .navmenu__item{ flex-direction:column; gap:.1rem; } .navmenu__cmd{ min-width:0; } }
body.nav-open{ overflow:hidden; }

/* ---- HUD cursor-coords (homage to original X:Y readout) ---- */
.hud{
  position:fixed; left:var(--pad); bottom:1rem; z-index:var(--z-hud);
  font-family:var(--mono); font-size:var(--t-micro); letter-spacing:.1em;
  color:var(--ink-2); pointer-events:none; text-transform:uppercase;
  display:flex; gap:1.2rem;
}
.hud b{ color:var(--ink-1); font-weight:500; }
@media(max-width:820px){ .hud{ display:none; } }

/* ---- boot overlay: 3D warp-tunnel + terminal + dive ---- */
.boot{
  position:fixed; inset:0; z-index:var(--z-boot); overflow:hidden;
  background:radial-gradient(125% 95% at 50% 50%, #0b0c11, var(--bg-0) 68%);
  display:grid; place-items:center;
  font-family:var(--mono); font-size:clamp(.8rem,1.1vw,.95rem); color:var(--ink-1);
  perspective:520px; perspective-origin:50% 50%;
}
.boot__fx{ position:absolute; inset:0; z-index:0; }
.boot::before{ content:""; position:absolute; left:50%; top:50%; width:34vmin; height:34vmin;
  transform:translate(-50%,-50%); border-radius:50%; z-index:0; pointer-events:none;
  background:radial-gradient(circle, rgba(255,130,50,.22), transparent 66%);
  animation:vanish 3.2s var(--ease) infinite alternate; }
@keyframes vanish{ from{ opacity:.45; transform:translate(-50%,-50%) scale(.75); } to{ opacity:.85; transform:translate(-50%,-50%) scale(1.2); } }
.boot.is-warp::before{ opacity:1; transform:translate(-50%,-50%) scale(3.2); transition:transform .55s var(--ease-out), opacity .55s; animation:none; }
.boot__warp{ position:absolute; inset:0; z-index:1; transform-style:preserve-3d; pointer-events:none; }
.boot__warp .ring{
  position:absolute; left:50%; top:50%; width:76vmin; height:76vmin; margin:-38vmin 0 0 -38vmin;
  border:1px solid var(--accent); border-radius:10px; opacity:0;
  box-shadow:inset 0 0 30px -8px var(--glow);
  animation:fly 4.8s linear infinite;
}
@keyframes fly{
  0%{ transform:translateZ(-2700px) rotate(0deg); opacity:0; }
  10%{ opacity:.32; }
  80%{ opacity:.24; }
  100%{ transform:translateZ(600px) rotate(7deg); opacity:0; }
}
.boot__flash{ position:absolute; inset:0; pointer-events:none; opacity:0;
  background:radial-gradient(circle at 50% 50%, var(--accent), transparent 62%); }
.boot.is-warp{ perspective:300px; }
.boot.is-warp .boot__warp .ring{ animation-duration:.5s; border-color:var(--accent-2); }
.boot.is-warp .boot__flash{ animation:bootflash .5s var(--ease) forwards; }
@keyframes bootflash{ 0%{ opacity:0; } 55%{ opacity:.55; } 100%{ opacity:0; } }
.boot__inner{ position:relative; z-index:2; width:min(560px,86vw); padding:1.5rem;
  background:radial-gradient(125% 170% at 50% 50%, rgba(7,8,9,.85), transparent 76%); }
.boot__line{ white-space:pre-wrap; opacity:.92; text-shadow:0 0 14px rgba(0,0,0,.85); }
.boot__line .ok{ color:var(--accent); }
.boot__bar{ height:2px; background:var(--bg-2); margin-top:1.3rem; overflow:hidden; border-radius:2px; }
.boot__bar i{ display:block; height:100%; width:0; background:var(--accent); box-shadow:0 0 10px var(--accent); }
.boot.is-warp .boot__inner{ opacity:0; transition:opacity .3s var(--ease); }
.boot.is-done{ opacity:0; visibility:hidden; transition:opacity .55s var(--ease), visibility .55s; }
.boot__skip{ position:absolute; left:50%; bottom:clamp(1.4rem,5vh,3rem); transform:translateX(-50%); z-index:3;
  font-family:var(--mono); font-size:var(--t-micro); letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-2); background:none; border:0; cursor:pointer; opacity:0;
  animation:skipIn .5s var(--ease) 1.4s forwards; transition:color .3s var(--ease); }
.boot__skip:hover{ color:var(--accent); }
@keyframes skipIn{ to{ opacity:.7; } }
.boot.is-quick .boot__inner,
.boot.is-quick .boot__skip{ display:none; }
.boot.is-warp .boot__skip{ opacity:0; }

/* ---- reveal (hidden ONLY when JS flagged reveal-ready → no-JS shows content) ---- */
.reveal-ready [data-reveal]{ opacity:0; transform:translateY(22px); will-change:opacity,transform; }
.reveal-ready [data-reveal].is-in{ opacity:1; transform:none; transition:opacity var(--dur-2) var(--ease-out), transform var(--dur-2) var(--ease-out); }

/* ---- footer ---- */
.foot{ border-top:1px solid var(--line); padding-block:clamp(3rem,7vh,5rem); position:relative; z-index:var(--z-content); }
.foot__grid{ display:flex; flex-wrap:wrap; gap:2rem; justify-content:space-between; align-items:flex-start; }
.foot a:hover{ color:var(--accent); }

/* ---- FX: split-reveal word units ---- */
.sw{ display:inline-block; overflow:hidden; vertical-align:top; padding-bottom:.08em; margin-bottom:-.08em; }
.swi{ display:inline-block; will-change:transform; }

/* ---- FX: terminal page-transition wipe ---- */
.pgwipe{ position:fixed; inset:0; z-index:9999; background:var(--bg-0); display:grid; place-items:center;
  pointer-events:none; transform:translateY(100%); }
.pgwipe.is-cover{ transform:translateY(0); }
.pgwipe.is-out{ transform:translateY(-100%); transition:transform .43s var(--ease-io); }
.pgwipe.is-in{ pointer-events:all; transform:translateY(0); transition:transform .32s var(--ease-io); }
.pgwipe__txt{ font-family:var(--mono); font-size:var(--t-mono); letter-spacing:.16em; text-transform:uppercase; color:var(--accent); opacity:.9; }
.pgwipe .dots{ display:inline-block; width:1.4em; overflow:hidden; vertical-align:bottom; animation:wipedots 1.1s steps(4) infinite; }
@keyframes wipedots{ 0%{ width:0; } 100%{ width:1.4em; } }

/* ---- reduced motion: kill all transforms/animations, show everything ---- */
@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; scroll-behavior:auto !important; }
  [data-reveal]{ opacity:1 !important; transform:none !important; }
  .boot{ display:none !important; }
  .bg::after{ display:none; }
}