/* =====================================================================
   AMOS//OS  — retro-futurist portfolio
   Phosphor-amber CRT skin · modern motion engine
   ===================================================================== */

:root{
  --bg:        #0a0a0c;
  --bg-2:      #0e0e12;
  --surface:   #121218;
  --line:      rgba(255,176,0,.14);
  --line-soft: rgba(255,255,255,.07);

  --ink:       #ece8df;   /* platinum text */
  --ink-dim:   #8c887e;
  --ink-faint: #5b5750;

  --amber:     #ffb000;   /* primary phosphor */
  --amber-2:   #ff8a2b;
  --cyan:      #2ee6ff;    /* cold accent */
  --glow:      rgba(255,176,0,.55);

  --mono: 'JetBrains Mono', ui-monospace, monospace;
  --disp: 'Space Grotesk', system-ui, sans-serif;
  --pix:  'VT323', monospace;

  --ease: cubic-bezier(.2,.7,.2,1);
  --maxw: 1240px;
}

/* theme accent swap handled via --amber for now (single restrained accent) */

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  background:
    radial-gradient(120vw 80vh at 80% -10%, rgba(255,138,43,.06), transparent 60%),
    radial-gradient(90vw 60vh at 10% 110%, rgba(46,230,255,.05), transparent 55%),
    var(--bg);
  color:var(--ink);
  font-family:var(--mono);
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
  cursor:none;
}
@media (pointer:coarse){ body{ cursor:auto; } }

a{ color:inherit; text-decoration:none; }
strong{ color:var(--amber); font-weight:700; }
em{ font-style:normal; color:var(--cyan); }
::selection{ background:var(--amber); color:#0a0a0c; }

.accent{ color:var(--amber); }
.accent2{ color:var(--cyan); }

/* ===================== CRT OVERLAY ===================== */
.crt{ position:fixed; inset:0; z-index:9000; pointer-events:none; mix-blend-mode:normal; }
.crt__scan{
  position:absolute; inset:0;
  background:repeating-linear-gradient(to bottom,
    rgba(0,0,0,0) 0px, rgba(0,0,0,0) 2px,
    rgba(0,0,0,.18) 3px, rgba(0,0,0,.18) 3px);
  background-size:100% 3px; opacity:.55;
}
.crt__vignette{
  position:absolute; inset:0;
  background:radial-gradient(120% 120% at 50% 50%, transparent 58%, rgba(0,0,0,.55) 100%);
}
.crt__flicker{
  position:absolute; inset:0; background:rgba(255,176,0,.012);
  animation:flicker 5s steps(60) infinite;
}
@keyframes flicker{ 0%,100%{opacity:.10} 50%{opacity:.02} 73%{opacity:.16} }
body.no-crt .crt{ display:none; }

/* ===================== CUSTOM CURSOR ===================== */
.cursor{ position:fixed; top:0; left:0; z-index:9999; pointer-events:none; transform:translate(-50%,-50%); will-change:transform; }
.cursor--dot{ width:5px; height:5px; background:var(--amber); border-radius:50%; box-shadow:0 0 8px var(--glow); }
.cursor--ring{
  width:30px; height:30px; border:1px solid rgba(255,176,0,.6); border-radius:50%;
  transition:width .2s var(--ease), height .2s var(--ease), border-color .2s, background .2s;
}
.cursor--ring::before, .cursor--ring::after{
  content:''; position:absolute; background:rgba(255,176,0,.5);
}
.cursor--ring::before{ left:50%; top:-5px; width:1px; height:6px; transform:translateX(-50%); }
.cursor--ring::after{ top:50%; left:-5px; height:1px; width:6px; transform:translateY(-50%); }
body.cursor-hot .cursor--ring{ width:48px; height:48px; border-color:var(--cyan); background:rgba(46,230,255,.06); }
@media (pointer:coarse){ .cursor{ display:none; } }

/* ===================== BOOT ===================== */
.boot{
  position:fixed; inset:0; z-index:9800; background:var(--bg);
  display:flex; align-items:center; justify-content:center;
  transition:opacity .6s var(--ease), visibility .6s;
}
.boot.done{ opacity:0; visibility:hidden; }
.boot__inner{ width:min(680px,90vw); }
.boot__logo{
  font-family:var(--mono); color:var(--amber); font-size:clamp(8px,1.6vw,13px);
  line-height:1.05; text-shadow:0 0 12px var(--glow); margin-bottom:22px; white-space:pre;
}
.boot__log{ font-size:13px; color:var(--ink-dim); min-height:150px; white-space:pre-wrap; }
.boot__log .ok{ color:var(--amber); }
.boot__bar{ margin-top:18px; height:6px; background:rgba(255,255,255,.07); border:1px solid var(--line); }
.boot__bar span{ display:block; height:100%; width:0; background:var(--amber); box-shadow:0 0 10px var(--glow); }
.boot__skip{
  margin-top:18px; background:none; border:none; color:var(--ink-faint);
  font-family:var(--mono); font-size:12px; cursor:pointer; letter-spacing:.05em;
}
.boot__skip:hover{ color:var(--amber); }

/* ===================== NAV ===================== */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:600;
  display:flex; align-items:center; justify-content:space-between;
  padding:17px clamp(18px,4vw,46px);
  background:transparent; border-bottom:1px solid transparent;
  transition:transform .45s var(--ease), background .35s var(--ease), border-color .35s, padding .35s var(--ease);
}
.nav.scrolled{ background:rgba(10,10,12,.66); backdrop-filter:blur(13px) saturate(1.15);
  border-bottom-color:var(--line); padding-top:12px; padding-bottom:12px; }
.nav.hide{ transform:translateY(-110%); }
@keyframes pulse{ 0%,100%{opacity:1} 50%{opacity:.3} }

/* scroll-progress hairline */
.nav__progress{ position:fixed; top:0; left:0; z-index:700; height:2px; width:0; background:var(--amber); box-shadow:0 0 10px var(--glow); transition:width .12s linear; }

/* brand / monogram */
.nav__brand{ display:flex; align-items:center; gap:11px; font-family:var(--mono); }
.nav__mark{ display:grid; place-items:center; width:28px; height:28px; border:1px solid rgba(255,176,0,.45);
  color:var(--amber); font-weight:700; font-size:12px; box-shadow:inset 0 0 12px rgba(255,176,0,.08); transition:.25s var(--ease); }
.nav__brand:hover .nav__mark{ background:var(--amber); color:#0a0a0c; box-shadow:0 0 18px rgba(255,176,0,.4); }
.nav__word{ font-weight:700; letter-spacing:.09em; font-size:14px; color:var(--ink); }
.nav__slash{ color:var(--cyan); opacity:.85; }

.nav__links{ display:flex; gap:30px; font-size:13px; }
@media (max-width:1180px){ .nav__links{ gap:20px; font-size:12px; } }
.nav__links a{ position:relative; color:var(--ink-faint); transition:color .2s; padding:4px 0; }
.nav__links a span{ color:var(--amber); opacity:.5; margin-right:5px; font-size:10.5px; transition:opacity .2s; }
.nav__links a::after{ content:''; position:absolute; left:0; right:0; bottom:-3px; height:1px; background:var(--amber);
  box-shadow:0 0 8px var(--glow); transform:scaleX(0); transform-origin:left; transition:transform .28s var(--ease); }
.nav__links a:hover{ color:var(--ink); }
.nav__links a:hover::after{ transform:scaleX(1); }
.nav__links a.active{ color:var(--ink); }
.nav__links a.active span{ opacity:1; }
.nav__links a.active::after{ transform:scaleX(1); }

/* tools + live status */
.nav__tools{ display:flex; align-items:center; gap:13px; }
.nav__status{ display:inline-flex; align-items:center; gap:7px; font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; color:var(--ink-faint); }
.nav__status b{ color:var(--amber); font-weight:400; }
.nav__status .rec{ width:7px; height:7px; border-radius:50%; background:#ff4d4d; box-shadow:0 0 8px #ff4d4d; animation:pulse 1.4s infinite; }
@media (max-width:1180px){ .nav__status{ display:none; } }
.nav__crt{ font-family:var(--mono); font-size:11px; letter-spacing:.06em; background:none; border:1px solid var(--line);
  color:var(--amber); padding:6px 10px; cursor:pointer; transition:.2s; }
.nav__crt:hover{ background:rgba(255,176,0,.08); }
@media (max-width:820px){ .nav__links{ display:none; } }
@media (max-width:460px){ #crt-toggle{ display:none; } }

/* ===================== HERO ===================== */
.hero{ position:relative; height:100svh; min-height:600px; display:flex; flex-direction:column; justify-content:center;
  padding:84px clamp(18px,5vw,80px) 0; overflow:hidden; }
.hero__canvas{ position:absolute; inset:0; width:100%; height:100%; z-index:0; opacity:.85; }
/* "neural mesh synced" toast (collect all nodes) */
.mesh-toast{ position:absolute; top:96px; left:50%; transform:translateX(-50%) translateY(-8px); z-index:6;
  font-family:var(--mono); font-size:12.5px; letter-spacing:.16em; text-transform:uppercase; color:#06121a;
  background:var(--cyan); padding:9px 18px; border-radius:8px; box-shadow:0 0 34px rgba(46,230,255,.55);
  opacity:0; pointer-events:none; transition:opacity .4s var(--ease), transform .4s var(--ease); white-space:nowrap; }
.mesh-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }
.hero__inner{ position:relative; z-index:2; max-width:var(--maxw); margin:0 auto; width:100%;
  display:grid; grid-template-columns:1.05fr .9fr; gap:clamp(40px,6vw,96px); align-items:center; }
@media (max-width:880px){ .hero__inner{ grid-template-columns:1fr; gap:34px; } }

/* retro perspective grid floor */
.hero__floor{ position:absolute; left:0; right:0; bottom:0; height:42vh; z-index:1; pointer-events:none;
  background-image:linear-gradient(rgba(255,176,0,.14) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(255,176,0,.14) 1px, transparent 1px);
  background-size:46px 46px; background-position:center bottom;
  transform:perspective(340px) rotateX(74deg); transform-origin:bottom center;
  -webkit-mask:linear-gradient(to top, #000, transparent 85%); mask:linear-gradient(to top, #000, transparent 85%);
  opacity:.6; }

/* HUD corner brackets */
.hud{ position:absolute; width:26px; height:26px; z-index:3; border:1.5px solid rgba(255,176,0,.45); pointer-events:none; }
.hud--tl{ top:84px; left:26px; border-right:0; border-bottom:0; }
.hud--tr{ top:84px; right:26px; border-left:0; border-bottom:0; }
.hud--bl{ bottom:26px; left:26px; border-right:0; border-top:0; }
.hud--br{ bottom:26px; right:26px; border-left:0; border-top:0; }
.hero__side{ position:absolute; left:30px; top:50%; z-index:3; transform:rotate(-90deg) translateX(50%); transform-origin:left center;
  font-size:10.5px; letter-spacing:.28em; color:var(--ink-faint); white-space:nowrap; text-transform:uppercase; }
@media (max-width:980px){ .hero__side{ display:none; } }

/* live multi-agent reasoning console */
.hero__art{ position:relative; z-index:2; display:flex; justify-content:center; }
.agent{ width:min(100%,440px); font-family:var(--mono); border:1px solid var(--line); border-radius:14px;
  background:#0a0a0c; overflow:hidden; box-shadow:0 0 50px rgba(255,176,0,.09), inset 0 0 70px rgba(0,0,0,.6); }
.agent__bar{ display:flex; align-items:center; justify-content:space-between; padding:11px 15px;
  border-bottom:1px solid var(--line); background:rgba(255,176,0,.04); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-dim); }
.agent__live{ display:inline-flex; align-items:center; gap:6px; color:var(--amber); }
.agent__live i{ width:7px; height:7px; border-radius:50%; background:#43e07a; box-shadow:0 0 8px #43e07a; animation:pulse 1.3s infinite; }
.agent__agents{ display:flex; flex-wrap:wrap; gap:8px; padding:13px 15px; border-bottom:1px solid var(--line-soft); }
.ag{ font-size:10.5px; letter-spacing:.05em; color:var(--ink-faint); border:1px solid var(--line-soft); padding:4px 9px; transition:.25s var(--ease); }
.ag.active{ color:#0a0a0c; background:var(--amber); border-color:var(--amber); box-shadow:0 0 14px rgba(255,176,0,.45); }
.agent__feed{ height:188px; overflow:hidden; padding:13px 15px; font-size:12.5px; line-height:1.72;
  background:repeating-linear-gradient(to bottom, transparent 0 2px, rgba(0,0,0,.16) 3px 3px); background-size:100% 3px; }
.agent__feed{ font-size:12px; }
.agent__feed .ln{ white-space:pre-wrap; overflow-wrap:anywhere; color:var(--ink); }
.agent__feed .ln.sub{ color:var(--ink-faint); }
.agent__feed .pt{ color:var(--amber); }
.agent__feed .a{ color:var(--cyan); }
.agent__feed .ok{ color:#43e07a; }
.agent__cursor{ color:var(--amber); animation:blink 1s steps(1) infinite; }
.agent__foot{ display:flex; align-items:center; justify-content:space-between; padding:9px 15px;
  border-top:1px solid var(--line); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint); }
.agent__tok{ color:var(--amber); }
.agent__dots::after{ content:''; animation:agdots 1.4s steps(4) infinite; }
@keyframes agdots{ 0%{content:''} 25%{content:'.'} 50%{content:'..'} 75%{content:'...'} }
@media (prefers-reduced-motion:reduce){ .agent__dots::after{ content:'...'; } }

/* ---- hero panel: SYSTEM diagram ⇄ SHELL toggle ---- */
/* frameless — the brain floats in the hero; only the tabs + shell carry chrome */
.hpanel{ width:min(100%,460px); }
.hpanel__tabs{ display:flex; justify-content:flex-end; gap:8px; margin-bottom:10px; }
.hptab{ flex:0 0 auto; font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  background:rgba(255,255,255,.02); border:1px solid var(--line); border-radius:7px; color:var(--ink-faint); padding:6px 14px; cursor:pointer; transition:.2s; }
.hptab:hover{ color:var(--ink); border-color:rgba(255,176,0,.4); }
.hptab.is-active{ color:#0a0a0c; background:var(--amber); border-color:var(--amber); }
.hpanel__stage{ position:relative; }
.hpview.is-hidden{ display:none; }

/* architecture diagram */
.archsvg{ display:block; width:100%; height:auto; }
.archsvg .cap{ fill:var(--ink-faint); font-family:var(--mono); font-size:11px; letter-spacing:1px; }
.archsvg .metric{ fill:var(--amber); font-family:var(--mono); font-size:10px; letter-spacing:.5px; }
.archsvg .node rect{ fill:rgba(255,176,0,.05); stroke:rgba(255,176,0,.4); stroke-width:1.2; }
.archsvg .node.hot rect{ fill:rgba(255,176,0,.12); stroke:var(--amber); }
.archsvg .node .lbl{ fill:#ece8df; font-family:var(--mono); font-size:12px; text-anchor:middle; }
.archsvg .node .sub{ fill:var(--ink-faint); font-family:var(--mono); font-size:8.5px; text-anchor:middle; }
.archsvg .flow{ stroke-dasharray:5 6; stroke-opacity:.5; animation:flowdash 1s linear infinite; }
@keyframes flowdash{ to{ stroke-dashoffset:-22; } }
.archsvg .packet{ filter:drop-shadow(0 0 5px #2ee6ff); }
@media (prefers-reduced-motion:reduce){ .archsvg .flow{ animation:none; } .archsvg .packet{ display:none; } }

/* the relocated terminal fills the shell view cleanly */
#hero-shell-slot .terminal{ border:1px solid var(--line); border-radius:12px; box-shadow:0 0 40px rgba(255,176,0,.06), inset 0 0 60px rgba(0,0,0,.5); }
/* match the SHELL card height to the JARVIS view (brain clamp + ask ~ chrome) */
#hero-shell-slot .terminal__body{ height:clamp(255px, calc(42vh - 25px), 395px); min-height:0; }

/* ---- JARVIS neural core ---- */
.jarvis{ display:flex; flex-direction:column; }
.jarvis__brain{ position:relative; height:clamp(280px, 42vh, 420px); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.jarvis__brain canvas{ width:100%; height:100%; display:block; }
/* hologram scanlines + flicker */
.jarvis__brain::before{ content:''; position:absolute; inset:0; z-index:2; pointer-events:none; mix-blend-mode:screen;
  background:repeating-linear-gradient(to bottom, rgba(46,230,255,.05) 0 1px, transparent 1px 3px);
  animation:holoflicker 3.6s steps(30) infinite; }
/* hologram scan sweep */
.jarvis__brain::after{ content:''; position:absolute; left:0; right:0; top:0; height:46px; z-index:2; pointer-events:none;
  background:linear-gradient(to bottom, transparent, rgba(46,230,255,.10), transparent); animation:holoscan 5s linear infinite; }
@keyframes holoflicker{ 0%,100%{opacity:.55} 47%{opacity:.85} 49%{opacity:.35} 51%{opacity:.75} 53%{opacity:.5} }
@keyframes holoscan{ 0%{ transform:translateY(-46px); } 100%{ transform:translateY(330px); } }
@media (prefers-reduced-motion:reduce){ .jarvis__brain::before{ animation:none; } .jarvis__brain::after{ display:none; } }
.jarvis__tag{ position:absolute; top:12px; left:14px; z-index:4; font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; color:var(--ink-faint); text-transform:uppercase; }
.jarvis__status{ position:absolute; top:12px; right:14px; z-index:4; font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; color:var(--amber); text-transform:uppercase; }
.jarvis__status::before{ content:'● '; color:#43e07a; }
.jarvis__status.thinking{ color:var(--cyan); }
.jarvis__status.thinking::before{ color:var(--cyan); }
.jarvis__ask{ display:flex; align-items:center; gap:10px; padding:13px 16px; margin-top:8px; border:1px solid var(--line); border-radius:10px; background:rgba(255,176,0,.03); }
.jarvis__ask:focus-within{ border-color:rgba(255,176,0,.5); }
.jarvis__mic{ flex:0 0 auto; width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--line); border-radius:8px; background:rgba(255,255,255,.02); color:var(--ink-dim); cursor:pointer; transition:.2s; }
.jarvis__mic svg{ width:17px; height:17px; }
.jarvis__mic:hover{ color:var(--amber); border-color:rgba(255,176,0,.4); }
.jarvis__mic:disabled{ opacity:.4; cursor:not-allowed; }
.jarvis__mic.listening{ color:#0a0a0c; background:var(--amber); border-color:var(--amber); animation:micpulse 1s infinite; }
@keyframes micpulse{ 50%{ box-shadow:0 0 0 6px rgba(255,176,0,.18); } }
.jarvis__chev{ color:var(--amber); font-family:var(--mono); }
.jarvis__ask input{ flex:1; background:none; border:0; outline:0; color:var(--ink); font-family:var(--mono); font-size:14px; caret-color:var(--amber); }
.jarvis__ask input::placeholder{ color:var(--ink-faint); }

/* ---- floating answer cards ---- */
.jarvis__cards{ position:absolute; inset:0; z-index:5; pointer-events:none; overflow:hidden; }
.jcard{ position:absolute; width:min(280px,42vw); pointer-events:auto;
  background:rgba(14,14,18,.72); backdrop-filter:blur(10px) saturate(1.1);
  border:1px solid rgba(255,176,0,.35); border-radius:10px; padding:13px 15px 14px;
  box-shadow:0 10px 40px rgba(0,0,0,.5), 0 0 22px rgba(255,176,0,.08);
  font-family:var(--mono); opacity:0; transform:translateY(14px) scale(.98);
  transition:opacity .45s var(--ease), transform .45s var(--ease); }
.jcard.in{ opacity:1; transform:none; }
.jcard.out{ opacity:0; transform:translateY(-10px) scale(.98); }
.jcard__bar{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; }
.jcard__q{ font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--cyan); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.jcard__x{ color:var(--ink-faint); cursor:pointer; font-size:13px; line-height:1; background:none; border:0; }
.jcard__x:hover{ color:var(--amber); }
.jcard__body{ font-size:12.5px; line-height:1.62; color:var(--ink-dim); white-space:pre-wrap; max-height:200px; overflow:auto; }
.jcard__body .acc{ color:var(--amber); } .jcard__body a{ color:var(--cyan); text-decoration:underline; }
.jcard__body strong{ color:var(--amber); }
.jthink{ color:var(--cyan); letter-spacing:.06em; }
.jthink i{ font-style:normal; opacity:.25; animation:jdot 1.05s infinite; }
.jthink i:nth-child(2){ animation-delay:.18s; } .jthink i:nth-child(3){ animation-delay:.36s; }
@keyframes jdot{ 0%,60%,100%{ opacity:.2; } 30%{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ .jcard{ transition:opacity .2s; transform:none; } .jcard.in{ transform:none; } }
@media (max-width:880px){ .jarvis__cards{ display:none; } }

/* Integral Mass — two child products inside the highlight card */
.card__children{ display:flex; flex-direction:column; gap:9px; margin:14px 0 4px; }
.card__children .child{ font-size:12.5px; line-height:1.5; color:var(--ink-dim); padding-left:12px; border-left:1px solid rgba(255,176,0,.4); }
.card__children .child b{ color:var(--amber); font-weight:700; }

/* ---- project modal ---- */
.pmodal[hidden]{ display:none; }
.pmodal{ position:fixed; inset:0; z-index:9700; display:flex; align-items:center; justify-content:center; padding:24px; }
.pmodal__backdrop{ position:absolute; inset:0; background:rgba(6,6,8,.72); backdrop-filter:blur(4px); }
.pmodal__dialog{ position:relative; z-index:1; width:min(880px,100%); max-height:86vh; overflow:hidden;
  display:grid; grid-template-columns:340px 1fr;
  background:#0d0d11; border:1px solid var(--line); border-radius:14px;
  box-shadow:0 30px 80px rgba(0,0,0,.6), 0 0 50px rgba(255,176,0,.08);
  transform:translateY(16px) scale(.98); opacity:0; transition:transform .35s var(--ease), opacity .35s var(--ease); }
.pmodal.in .pmodal__dialog{ transform:none; opacity:1; }
.pmodal__x{ position:absolute; top:12px; right:12px; z-index:3; width:30px; height:30px; border:1px solid var(--line);
  background:rgba(10,10,12,.6); color:var(--ink-dim); border-radius:7px; cursor:pointer; font-size:14px; }
.pmodal__x:hover{ color:var(--amber); border-color:var(--amber); }
/* media column — left */
.pmodal__media{ position:relative; height:100%; min-height:280px; overflow:hidden; border-right:1px solid var(--line);
  background:radial-gradient(120% 120% at 30% 20%, rgba(255,176,0,.16), transparent 60%), linear-gradient(135deg,#161620,#0a0a0c);
  display:flex; align-items:center; justify-content:center; }
.pmodal__media .glyph{ font-family:var(--disp); font-weight:700; font-size:64px; color:rgba(255,176,0,.25); letter-spacing:.04em; }
.pmodal__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .4s; }
.pmodal__img.loaded{ opacity:1; }
/* content column — right (scrolls) */
.pmodal__inner{ padding:26px 28px; overflow-y:auto; max-height:86vh; scrollbar-width:none; -ms-overflow-style:none; }
.pmodal__inner::-webkit-scrollbar{ width:0; height:0; display:none; }
@media (max-width:640px){
  .pmodal__dialog{ grid-template-columns:1fr; max-height:88vh; overflow-y:auto; }
  .pmodal__media{ height:170px; min-height:0; border-right:0; border-bottom:1px solid var(--line); }
  .pmodal__inner{ max-height:none; overflow:visible; }
}
.pmodal__head{ display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.pmodal__logo{ flex:0 0 auto; width:46px; height:46px; display:grid; place-items:center; border:1px solid rgba(255,176,0,.45);
  border-radius:10px; font-family:var(--mono); font-weight:700; color:var(--amber); font-size:15px; }
.pmodal__title{ font-family:var(--disp); font-weight:700; font-size:1.5rem; letter-spacing:-.01em; }
.pmodal__tag{ font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--cyan); }
.pmodal__desc{ color:var(--ink-dim); font-size:14.5px; line-height:1.65; margin-bottom:16px; }
.pmodal__children{ display:flex; flex-direction:column; gap:12px; margin-bottom:18px; }
.pmodal__child{ border:1px solid var(--line-soft); border-radius:9px; padding:13px 15px; }
.pmodal__child b{ color:var(--amber); font-family:var(--disp); }
.pmodal__child span{ display:block; margin-top:4px; font-size:13px; color:var(--ink-dim); line-height:1.55; }
.pmodal__stack{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; }
.pmodal__stack li{ font-family:var(--mono); font-size:11px; color:var(--ink-faint); border:1px solid var(--line-soft); padding:4px 10px; border-radius:6px; }
.pmodal__links{ display:flex; flex-wrap:wrap; gap:12px; }
.pmodal__links a{ font-family:var(--mono); font-size:12.5px; color:var(--amber); border:1px solid rgba(255,176,0,.4); border-radius:8px; padding:10px 16px; transition:.2s; }
.pmodal__links a:hover{ background:rgba(255,176,0,.08); }

.hero__eyebrow{ font-family:var(--mono); font-size:11.5px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--ink-dim); margin-bottom:clamp(16px,2.6vh,30px); display:flex; align-items:center; gap:10px; }
.hero__eyebrow-mark{ color:var(--amber); }
.prm{ color:var(--amber); }
.pth{ color:var(--cyan); }
.caret{ color:var(--amber); animation:blink 1s steps(1) infinite; }
@keyframes blink{ 50%{opacity:0} }

.hero__title{
  font-family:var(--disp); font-weight:700; color:#f4f1ea;
  font-size:clamp(1.85rem,4.4vw,4rem); line-height:1.07; letter-spacing:-.03em;
  text-transform:none; margin-bottom:clamp(18px,3vh,32px);
}
.hero__title .line{ display:block; overflow:hidden; }
.hero__title .w{ display:inline-block; transform:translateY(110%); }
/* subtle top-light sheen per word (robust — survives the reveal transform) */
.hero__title .w{ text-shadow:0 1px 0 rgba(255,255,255,.06); }
.hero__title .dim2{ color:var(--ink-dim); }
.hero__title .accent{ color:var(--amber); text-shadow:0 0 38px rgba(255,176,0,.4); }
.hero__title .accent2{ color:var(--cyan); text-shadow:0 0 38px rgba(46,230,255,.32); }
body.booted .hero__title .w{ transform:translateY(0); transition:transform .9s var(--ease); }
/* per-word stagger */
body.booted .line:nth-child(1) .w:nth-child(1){transition-delay:.05s}
body.booted .line:nth-child(1) .w:nth-child(2){transition-delay:.11s}
body.booted .line:nth-child(1) .w:nth-child(3){transition-delay:.17s}
body.booted .line:nth-child(2) .w:nth-child(1){transition-delay:.23s}
body.booted .line:nth-child(2) .w:nth-child(2){transition-delay:.29s}
body.booted .line:nth-child(3) .w{transition-delay:.4s}

.hero__sub{ max-width:520px; color:var(--ink-dim); font-size:clamp(.95rem,1.5vw,1.08rem); line-height:1.6; margin-bottom:clamp(16px,2.6vh,28px); }
.hero__metaline{ display:flex; flex-wrap:wrap; align-items:center; gap:18px; margin-bottom:clamp(24px,3.6vh,40px);
  font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; color:var(--ink-faint); text-transform:uppercase; }
.hero__metaline > span{ position:relative; }
.hero__metaline > span:not(:last-child)::after{ content:''; position:absolute; right:-10px; top:50%; width:3px; height:3px; transform:translateY(-50%); border-radius:50%; background:var(--ink-faint); }
.hero__chip{ color:var(--amber); border:1px solid var(--line); padding:5px 10px; }
.hero__chip::after{ display:none !important; }
.hero__cta{ display:flex; gap:16px; flex-wrap:wrap; }

.btn{
  position:relative; font-family:var(--mono); font-size:14px; letter-spacing:.03em;
  padding:15px 26px; border:1px solid var(--line); color:var(--ink);
  background:rgba(255,255,255,.015); transition:.25s var(--ease); overflow:hidden;
}
.btn span{ position:relative; z-index:2; }
.btn::after{ content:''; position:absolute; inset:0; background:var(--amber); transform:translateY(101%); transition:transform .35s var(--ease); z-index:1; }
.btn:hover{ color:#0a0a0c; border-color:var(--amber); }
.btn:hover::after{ transform:translateY(0); }
.btn--primary{ border-color:rgba(255,176,0,.5); box-shadow:0 0 0 0 var(--glow); }
.btn--primary span{ color:var(--amber); }
.btn--primary:hover span{ color:#0a0a0c; }

/* stats */
/* stats live in their own band below the hero */
.statsband{ max-width:var(--maxw); margin:0 auto; padding:clamp(36px,6vh,64px) clamp(18px,5vw,80px); }
.stats{ position:relative; z-index:2; max-width:var(--maxw); margin:0 auto;
  width:100%; display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  border:1px solid var(--line); background:var(--line); }
.stat{ background:var(--bg-2); padding:22px 18px; }
.stat b{ display:block; font-family:var(--disp); font-weight:700; font-size:clamp(1.6rem,3.6vw,2.7rem); color:var(--amber); line-height:1; text-shadow:0 0 24px rgba(255,176,0,.25); }
.stat span{ font-size:11.5px; color:var(--ink-faint); letter-spacing:.04em; text-transform:uppercase; }
@media (max-width:680px){ .stats{ grid-template-columns:repeat(2,1fr); } }


/* ===================== SECTIONS ===================== */
.section{ max-width:var(--maxw); margin:0 auto; padding:clamp(80px,12vh,140px) clamp(18px,5vw,80px); }
.section__head{ display:flex; align-items:center; gap:18px; margin-bottom:54px; }
.section__no{ font-family:var(--mono); color:var(--amber); font-size:14px; opacity:.7; }
.section__title{ font-family:var(--disp); font-weight:600; font-size:clamp(1.6rem,4vw,2.7rem); letter-spacing:-.01em; }
.section__rule{ flex:1; height:1px; background:linear-gradient(to right,var(--line),transparent); }

/* reveal animation — disabled: content is visible immediately (no scroll delay) */
.reveal{ opacity:1; transform:none; }

/* ===================== WHOAMI ===================== */
.whoami__grid{ display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(30px,5vw,70px); align-items:start; }
.whoami__lede p{ font-family:var(--disp); font-size:clamp(1.15rem,2.4vw,1.7rem); line-height:1.45; color:var(--ink); margin-bottom:20px; font-weight:400; }
.whoami__lede .hl{ color:var(--amber); }
.whoami__lede p:last-child{ font-family:var(--mono); font-size:1rem; color:var(--ink-dim); line-height:1.7; }
.threads{ list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); }
.thread{ background:var(--bg-2); padding:24px 22px; transition:background .3s; }
.thread:hover{ background:var(--surface); }
.thread__k{ font-size:12px; color:var(--cyan); letter-spacing:.03em; }
.thread h3{ font-family:var(--disp); font-weight:600; font-size:1.15rem; margin:8px 0 8px; }
.thread p{ font-size:13.5px; color:var(--ink-dim); line-height:1.6; }
@media (max-width:900px){ .whoami__grid{ grid-template-columns:1fr; } }
@media (max-width:520px){ .threads{ grid-template-columns:1fr; } }

/* ===================== WORK / BENTO ===================== */
.bento{ display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:1fr; gap:14px; }
.card{
  position:relative; background:var(--surface); border:1px solid var(--line-soft);
  padding:26px 24px; display:flex; flex-direction:column; min-height:230px; overflow:hidden;
  cursor:pointer;
  transition:border-color .3s, transform .4s var(--ease);
}
.card::before{ /* pointer glow */
  content:''; position:absolute; width:340px; height:340px; border-radius:50%;
  background:radial-gradient(circle, rgba(255,176,0,.16), transparent 65%);
  left:var(--mx,50%); top:var(--my,50%); transform:translate(-50%,-50%) scale(0);
  transition:transform .35s var(--ease); pointer-events:none; z-index:0;
}
.card:hover{ border-color:rgba(255,176,0,.4); }
.card:hover::before{ transform:translate(-50%,-50%) scale(1); }
.card > *{ position:relative; z-index:1; }
.card--xl{ grid-column:span 2; grid-row:span 2; min-height:476px; }
.card__top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:auto; }
.card__tag{ font-size:11px; color:var(--cyan); letter-spacing:.06em; text-transform:uppercase; border:1px solid var(--line); padding:3px 9px; }
.card__lock{ font-size:11px; color:var(--ink-faint); letter-spacing:.04em; }
.card__lock.open{ color:var(--amber); }
.card__title{ font-family:var(--disp); font-weight:700; font-size:clamp(1.3rem,2.6vw,2rem); margin:26px 0 12px; letter-spacing:-.01em; }
.card--xl .card__title{ font-size:clamp(2rem,5vw,3.4rem); }
.card__desc{ font-size:14px; color:var(--ink-dim); line-height:1.62; }
.card--xl .card__desc{ font-size:15.5px; max-width:46ch; }
.card__meta{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.card__meta li{ font-size:11px; color:var(--ink-faint); border:1px solid var(--line-soft); padding:4px 9px; }
.work__more{ margin-top:30px; font-size:13.5px; color:var(--ink-dim); }
.work__more a{ color:var(--amber); }
@media (max-width:900px){ .bento{ grid-template-columns:repeat(2,1fr); } .card--xl{ grid-column:span 2; grid-row:auto; min-height:300px; } }
@media (max-width:600px){ .bento{ grid-template-columns:1fr; } .card--xl{ grid-column:auto; } }

/* ===================== STACK ===================== */
.marquee{ overflow:hidden; border-block:1px solid var(--line); padding:18px 0; margin-bottom:50px; -webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.marquee__track{ display:flex; gap:26px; white-space:nowrap; width:max-content; animation:scroll 32s linear infinite; }
.marquee__track span{ font-family:var(--disp); font-size:clamp(1.3rem,3vw,2.2rem); font-weight:500; color:var(--ink-faint); }
.marquee__track span:nth-child(2n){ color:var(--amber); opacity:.5; }
@keyframes scroll{ to{ transform:translateX(-50%); } }
.stack__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.stack__col{ background:var(--bg-2); padding:24px 22px; }
.stack__col h4{ font-size:12px; color:var(--cyan); letter-spacing:.05em; margin-bottom:8px; font-weight:500; }
.stack__col p{ font-size:14px; color:var(--ink); line-height:1.6; }
@media (max-width:760px){ .stack__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:480px){ .stack__grid{ grid-template-columns:1fr; } }

/* ===================== SERVICES ===================== */
.svc-intro{ color:var(--ink-dim); max-width:60ch; margin:-30px 0 36px; font-size:15px; }
.services__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
@media (max-width:900px){ .services__grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .services__grid{ grid-template-columns:1fr; } }
.svc{ background:var(--bg-2); padding:30px 24px; display:flex; flex-direction:column; gap:14px; transition:background .3s, transform .3s var(--ease); }
.svc:hover{ background:var(--surface); }
.svc__icon{ width:48px; height:48px; color:var(--amber); }
.svc__icon svg{ width:100%; height:100%; display:block; }
.svc__no{ font-family:var(--mono); font-size:11px; color:var(--cyan); letter-spacing:.08em; }
.svc h3{ font-family:var(--disp); font-weight:600; font-size:1.18rem; letter-spacing:-.01em; }
.svc p{ font-size:13.5px; color:var(--ink-dim); line-height:1.62; }
.svc__tag{ margin-top:auto; padding-top:8px; font-family:var(--mono); font-size:11px; color:var(--ink-faint); letter-spacing:.04em; }

/* ===================== LOG / TIMELINE ===================== */
.log__list{ list-style:none; border-left:1px dashed var(--line); margin-left:6px; }
.log__item{ position:relative; padding:0 0 30px 32px; }
.log__item:last-child{ padding-bottom:0; }
.log__item::before{ content:''; position:absolute; left:-5px; top:5px; width:9px; height:9px; border-radius:50%;
  background:var(--amber); box-shadow:0 0 10px var(--glow); }
.log__item:hover::before{ background:var(--cyan); box-shadow:0 0 12px rgba(46,230,255,.7); }
.log__year{ font-family:var(--mono); font-size:13px; color:var(--amber); letter-spacing:.06em; }
.log__title{ font-family:var(--disp); font-weight:600; font-size:1.1rem; margin:4px 0 5px; }
.log__desc{ font-size:13.5px; color:var(--ink-dim); line-height:1.65; max-width:62ch; }
.log__desc b{ color:var(--ink); }

/* ===================== TERMINAL ===================== */
.term-sec__hint{ color:var(--ink-dim); margin:-30px 0 28px; font-size:14px; }
.term-sec__hint code{ color:var(--amber); border:1px solid var(--line); padding:2px 7px; }
.terminal{ position:relative; overflow:hidden; background:#08080a; border:1px solid var(--line); box-shadow:0 0 60px rgba(255,176,0,.06), inset 0 0 80px rgba(0,0,0,.6); }

/* nano editor overlay */
.nano{ position:absolute; inset:0; z-index:6; display:flex; flex-direction:column; background:#0a0a0c; font-family:var(--mono); }
.nano__top{ display:flex; justify-content:space-between; gap:12px; background:var(--amber); color:#0a0a0c; font-weight:700; font-size:12.5px; padding:7px 14px; }
.nano__file{ flex:1; text-align:center; }
.nano__mod{ font-style:italic; }
.nano__area{ flex:1; resize:none; border:0; outline:0; background:transparent; color:var(--ink); font-family:var(--mono); font-size:13.5px; line-height:1.65; padding:12px 14px; caret-color:var(--amber); }
.nano__area::selection{ background:var(--amber); color:#0a0a0c; }
.nano__msg{ min-height:21px; text-align:center; font-size:12px; color:#0a0a0c; background:rgba(255,176,0,.9); padding:2px; }
.nano__msg:empty{ background:transparent; }
.nano__keys{ display:grid; grid-template-columns:1fr 1fr; gap:3px 18px; padding:9px 14px; font-size:12px; color:var(--ink-dim); border-top:1px solid var(--line); }
.nano__keys b{ background:var(--amber); color:#0a0a0c; padding:1px 5px; margin-right:6px; font-weight:700; }
@media (max-width:560px){ .nano__keys{ grid-template-columns:1fr; } }
.terminal__bar{ display:flex; align-items:center; gap:12px; padding:11px 16px; border-bottom:1px solid var(--line); background:rgba(255,255,255,.02); }
.terminal__dots{ display:flex; gap:7px; }
.terminal__dots i{ width:11px; height:11px; border-radius:50%; background:#2a2a2e; }
.terminal__dots i:first-child{ background:var(--amber-2); }
.terminal__name{ font-size:12px; color:var(--ink-faint); }
.terminal__body{ padding:18px 18px 6px; min-height:230px; max-height:340px; overflow-y:auto; font-size:13.5px; line-height:1.7; }
.term-line{ white-space:pre-wrap; word-break:break-word; }
.term-cmd{ color:var(--ink); }
.term-cmd .prm{ color:var(--amber); } .term-cmd .pth{ color:var(--cyan); }
.term-out{ color:var(--ink-dim); }
.term-out a{ color:var(--cyan); text-decoration:underline; }
.term-out .acc{ color:var(--amber); }
.term-out .term-err, .term-err{ color:#ff6b6b; }
.terminal__input{ display:flex; align-items:center; padding:12px 18px 16px; border-top:1px solid var(--line-soft); font-size:13.5px; }
.terminal__input input{ flex:1; background:none; border:none; outline:none; color:var(--ink); font-family:var(--mono); font-size:13.5px; caret-color:var(--amber); }
.terminal__body::-webkit-scrollbar{ width:8px; } .terminal__body::-webkit-scrollbar-thumb{ background:var(--line); }

/* ===================== CONTACT — VINTAGE TELEX / FAX UNIT ===================== */
.contact{ position:relative; }
.telex{ border:1px solid var(--line); background:linear-gradient(180deg, rgba(255,176,0,.035), transparent 24%), #0d0c0a;
  box-shadow:inset 0 0 110px rgba(0,0,0,.6), 0 0 50px rgba(255,176,0,.05); }
.telex__head{ display:flex; align-items:center; gap:11px; padding:13px 18px; border-bottom:1px solid var(--line);
  font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-dim); background:rgba(255,176,0,.04); }
.telex__dot{ width:9px; height:9px; border-radius:50%; background:#43e07a; box-shadow:0 0 10px #43e07a; animation:pulse 1.6s infinite; }
.telex__body{ display:grid; grid-template-columns:.82fr 1.18fr; }
@media (max-width:820px){ .telex__body{ grid-template-columns:1fr; } }

.telex__left{ padding:32px 30px; border-right:1px solid var(--line); display:flex; flex-direction:column; gap:26px; }
@media (max-width:820px){ .telex__left{ border-right:0; border-bottom:1px solid var(--line); } }
.fax-art{ width:100%; max-width:240px; height:auto; align-self:center; filter:drop-shadow(0 0 26px rgba(255,176,0,.14)); }
.fax-paper{ animation:faxfeed 4s ease-in-out infinite; transform-origin:center top; }
@keyframes faxfeed{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-3px); } }
.guide h4{ font-family:var(--mono); color:var(--amber); font-size:12.5px; letter-spacing:.14em; margin-bottom:13px; }
.guide ol{ margin:0 0 16px 16px; color:var(--ink-dim); font-size:13.5px; line-height:1.95; }
.guide ol b{ color:var(--ink); }
.guide__alt{ font-size:13px; color:var(--ink-faint); margin-top:4px; }
.guide__alt a{ color:var(--amber); }

/* quick-contact channels */
.channels{ display:flex; flex-direction:column; gap:12px; }
.channels h4{ font-family:var(--mono); color:var(--amber); font-size:12.5px; letter-spacing:.14em; margin-bottom:4px; }
.chan{ display:flex; flex-direction:column; gap:4px; padding:14px 16px; border:1px solid var(--line-soft); transition:.2s var(--ease); }
.chan:hover{ border-color:var(--amber); background:rgba(255,176,0,.05); transform:translateY(-2px); }
.chan__k{ font-family:var(--mono); font-weight:700; font-size:13.5px; letter-spacing:.04em; color:var(--ink); }
.chan__d{ font-size:12px; color:var(--ink-faint); }
.chan--primary{ border-color:rgba(255,176,0,.5); background:rgba(255,176,0,.07); box-shadow:0 0 24px rgba(255,176,0,.1); }
.chan--primary .chan__k{ color:var(--amber); }
.chan--primary:hover{ background:rgba(255,176,0,.12); box-shadow:0 0 32px rgba(255,176,0,.22); }
.telex__formhead{ font-family:var(--mono); color:var(--amber); font-size:12.5px; letter-spacing:.14em; }

.telex__form{ padding:32px 30px; display:flex; flex-direction:column; gap:19px; }
.telex__row{ display:grid; grid-template-columns:1fr 1fr; gap:19px; }
@media (max-width:520px){ .telex__row{ grid-template-columns:1fr; } }
.field{ display:flex; flex-direction:column; gap:7px; }
.field > span{ font-family:var(--mono); font-size:10.5px; letter-spacing:.16em; color:var(--amber); text-transform:uppercase; }
.field input, .field textarea{ font-family:var(--mono); font-size:15px; color:var(--ink); background:transparent;
  border:0; border-bottom:1px dashed rgba(255,176,0,.42); padding:8px 2px; outline:none; resize:vertical; width:100%; }
.field input::placeholder, .field textarea::placeholder{ color:var(--ink-faint); }
.field input:focus, .field textarea:focus{ border-bottom-style:solid; border-bottom-color:var(--amber); box-shadow:0 1px 0 var(--amber); }
.hire-btn{ align-self:flex-start; margin-top:4px; font-family:var(--mono); font-weight:700; font-size:14px; letter-spacing:.08em;
  text-transform:uppercase; color:#0a0a0c; background:var(--amber); border:0; padding:16px 30px; cursor:pointer;
  box-shadow:0 4px 0 #a86f00, 0 0 26px rgba(255,176,0,.4); transition:transform .1s, box-shadow .2s; }
.hire-btn:hover{ box-shadow:0 4px 0 #a86f00, 0 0 38px rgba(255,176,0,.65); }
.hire-btn:active{ transform:translateY(3px); box-shadow:0 1px 0 #a86f00, 0 0 20px rgba(255,176,0,.4); }
.telex__receipt{ border-top:1px solid var(--line); margin:0; padding:20px 22px; font-family:var(--mono); font-size:12.5px; line-height:1.7;
  color:var(--amber); white-space:pre-wrap; background:repeating-linear-gradient(to bottom, rgba(255,176,0,.025) 0 1px, transparent 1px 4px); }

/* ===================== FOOTER ===================== */
.footer{ border-top:1px solid var(--line); padding:40px clamp(18px,5vw,80px); max-width:var(--maxw); margin:0 auto; }
.footer__sig{ font-family:var(--mono); color:var(--ink-faint); font-size:clamp(9px,1.6vw,12px); white-space:pre-wrap; margin-bottom:20px; }
.footer__row{ display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; font-size:12px; color:var(--ink-faint); }

/* ===================== RETRO SYSTEM (page-wide) ===================== */

/* reusable HUD corner accents (top-left + bottom-right diagonal) */
.hud-box{ position:relative; }
.hud-box::before, .hud-box::after{ content:''; position:absolute; width:15px; height:15px; z-index:4; pointer-events:none; border:1.5px solid var(--amber); }
.hud-box::before{ top:-1px; left:-1px;  border-right:0; border-bottom:0; }
.hud-box::after{ bottom:-1px; right:-1px; border-left:0;  border-top:0; }

/* terminal-style section headers */
.section__no{ position:relative; }
.section__no::before{ content:'['; margin-right:3px; opacity:.55; }
.section__no::after{ content:']'; margin-left:3px; opacity:.55; }
.section__title{ position:relative; }
.section__rule{ height:1px; background:repeating-linear-gradient(90deg, var(--line) 0 7px, transparent 7px 14px); }

/* indexed project cards: [01] offensive-ai ... */
.bento{ counter-reset:card; }
.card{ counter-increment:card; }
.card__tag::before{ content:'[' counter(card, decimal-leading-zero) '] '; color:var(--amber); opacity:.8; }
/* faint scanline texture per card */
.card::after{ content:''; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5;
  background:repeating-linear-gradient(to bottom, transparent 0 2px, rgba(0,0,0,.22) 3px 3px); background-size:100% 3px; }
body.no-crt .card::after{ display:none; }

/* echo the terminal prompt on the stack header rows */
.stack__col h4::before{ content:'> '; color:var(--amber); }

/* ===================== SOUND UNLOCK HINT ===================== */
.snd-hint{ position:fixed; left:50%; bottom:18px; transform:translateX(-50%); z-index:8600;
  font-family:var(--mono); font-size:11.5px; letter-spacing:.1em; color:var(--ink-dim);
  background:rgba(10,10,12,.82); border:1px solid var(--line); padding:8px 15px; pointer-events:none;
  animation:hintpulse 1.8s ease-in-out infinite; }
.snd-hint.gone{ opacity:0; transition:opacity .4s var(--ease); }
@keyframes hintpulse{ 50%{ color:var(--amber); } }

/* ===================== MOBILE / RESPONSIVE ===================== */
.nav__burger{ display:none; }
.jarvis__answers{ display:none; }
.jans{ border:1px solid var(--line); border-radius:10px; background:rgba(14,14,18,.7); padding:12px 15px;
  opacity:0; transform:translateY(8px); transition:opacity .35s var(--ease), transform .35s var(--ease); }
.jans.in{ opacity:1; transform:none; }
.jans .jcard__q{ color:var(--cyan); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; }
.jans .jcard__body{ color:var(--ink-dim); font-size:13px; line-height:1.6; white-space:pre-wrap; margin-top:6px; }
.jans .jcard__body .acc{ color:var(--amber); } .jans .jcard__body a{ color:var(--cyan); text-decoration:underline; }

@media (max-width:880px){
  /* hero flows (no fixed 100vh that clips on short phones); JARVIS stacks below the headline */
  .hero{ height:auto; min-height:100svh; padding-top:94px; padding-bottom:48px; overflow:hidden; }
  .hpanel{ width:100%; }
  .jarvis__answers{ display:flex; flex-direction:column; gap:10px; margin-top:14px; }
  .hud--tl,.hud--tr,.hud--bl,.hud--br{ display:none; }
}

@media (max-width:820px){
  /* nav → hamburger */
  .nav{ padding:12px clamp(16px,4vw,24px); }
  .nav__burger{ display:grid; place-items:center; width:36px; height:36px; background:none; border:1px solid var(--line); border-radius:8px; cursor:pointer; }
  .nav__burger span{ display:block; width:17px; height:1.6px; background:var(--amber); margin:2.2px 0; transition:transform .25s var(--ease), opacity .2s; }
  .nav.menu-open .nav__burger span:nth-child(1){ transform:translateY(5.8px) rotate(45deg); }
  .nav.menu-open .nav__burger span:nth-child(2){ opacity:0; }
  .nav.menu-open .nav__burger span:nth-child(3){ transform:translateY(-5.8px) rotate(-45deg); }
  .nav__links{ position:fixed; top:55px; left:0; right:0; display:flex; flex-direction:column; gap:0;
    background:rgba(10,10,12,.97); backdrop-filter:blur(16px); border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    padding:4px 22px 14px; transform:translateY(-135%); opacity:0; pointer-events:none;
    transition:transform .32s var(--ease), opacity .32s; z-index:580; }
  .nav.menu-open .nav__links{ transform:translateY(0); opacity:1; pointer-events:auto; }
  .nav__links a{ padding:15px 2px; font-size:15px; letter-spacing:.08em; color:var(--ink-dim); border-bottom:1px solid var(--line-soft); }
  .nav__links a:last-child{ border-bottom:0; }
  .nav__links a::after{ display:none; }
  #snd-toggle, #crt-toggle{ display:none; }   /* keep only VOICE in the bar on mobile */
  .nav__tools{ gap:10px; }
}

@media (max-width:600px){
  .section{ padding:60px clamp(16px,5vw,26px); }
  .telex__head{ font-size:9.5px; letter-spacing:.06em; }
  .jcard, .jans{ width:auto; }
}

/* ===================== REDUCED MOTION ===================== */
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .hero__title .w{ transform:none !important; }
  .reveal{ opacity:1 !important; transform:none !important; }
  .crt__flicker{ display:none; }
}
