:root{
  --ink:#060B14; --panel:#0C1421; --panel-2:#111C2C; --line:#1B2635;
  --gold:#D4AF37; --gold-dim:#8C742A; --paper:#EEF2F7; --muted:#8695AA;
  --measure:64ch; --shell:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--paper);
  font-family:"IBM Plex Sans",system-ui,-apple-system,sans-serif;
  font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:Archivo,"IBM Plex Sans",system-ui,sans-serif;
  font-weight:800;line-height:1.05;letter-spacing:-.022em;margin:0}
p{margin:0 0 1rem}
a{color:inherit}
img,svg{display:block;max-width:100%}
.shell{max-width:var(--shell);margin:0 auto;padding:0 28px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:16px;top:12px;z-index:99;background:var(--gold);color:#000;padding:10px 16px}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* masthead */
.masthead{position:sticky;top:0;z-index:50;background:rgba(6,11,20,.94);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.masthead-in{display:flex;align-items:center;gap:28px;height:70px}
.brand{margin-right:auto;flex:0 0 auto}
.nav{display:flex;gap:22px}
.nav a{font-size:.9rem;color:var(--muted);text-decoration:none;padding:4px 0;
  border-bottom:1px solid transparent}
.nav a:hover,.nav a.is-active{color:var(--paper);border-bottom-color:var(--gold)}
.menu{display:none;background:none;border:1px solid var(--line);width:40px;height:36px;
  flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer}
.menu span{display:block;width:16px;height:1.5px;background:var(--paper)}
.mnav{display:none;flex-direction:column;border-top:1px solid var(--line);padding:8px 28px 18px}
.mnav a{padding:11px 0;text-decoration:none;color:var(--paper);font-size:1rem;
  border-bottom:1px solid var(--line)}
.mnav.open{display:flex}

/* buttons */
.btn{display:inline-block;background:var(--gold);color:#0A0F17;text-decoration:none;
  font-family:Archivo,sans-serif;font-weight:600;font-size:.92rem;padding:13px 22px;
  border:1px solid var(--gold);transition:background .18s ease,color .18s ease}
.btn:hover{background:#E5C458;border-color:#E5C458}
.btn-sm{padding:9px 16px;font-size:.85rem}
.btn-ghost{background:transparent;color:var(--paper);border-color:var(--line)}
.btn-ghost:hover{background:transparent;border-color:var(--gold);color:var(--gold)}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}

/* hero */
.hero{border-bottom:1px solid var(--line);padding:86px 0 78px;
  background:linear-gradient(180deg,#080E19 0%,var(--ink) 70%)}
.hero-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:56px;align-items:center}
.hero-copy{max-width:none}
.eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 20px;
  font-size:.86rem;color:var(--gold);letter-spacing:.01em}
.eyebrow::before{content:"";width:34px;height:2px;background:var(--gold);flex:0 0 auto}
.hero h1{font-size:clamp(2.3rem,4.5vw,3.4rem);max-width:19ch;text-wrap:balance}
.lede{margin-top:22px;font-size:1.12rem;color:#B9C6D6;max-width:52ch}
.hero-art{display:flex;justify-content:center}
.sys{width:100%;max-width:400px;overflow:visible}
.sys .nodes circle{fill:var(--gold)}
.sys .nodes text{fill:#C3D0E0;font-family:"IBM Plex Sans",sans-serif;font-size:13px;
  text-anchor:middle;letter-spacing:.01em}
.sys .core{fill:none;stroke:var(--gold);stroke-width:1.5}
.sys .wires path{stroke-dasharray:1;stroke-dashoffset:1;
  animation:draw .95s ease forwards}
.sys .wires path:nth-child(2){animation-delay:.08s}
.sys .wires path:nth-child(3){animation-delay:.16s}
.sys .wires path:nth-child(4){animation-delay:.24s}
.sys .wires path:nth-child(5){animation-delay:.34s}
.sys .wires path:nth-child(6){animation-delay:.42s}
@keyframes draw{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){
  .sys .wires path{animation:none;stroke-dashoffset:0}
  html{scroll-behavior:auto}
}

/* bands */
.band{padding:74px 0;border-bottom:1px solid var(--line)}
.band-alt{background:var(--panel)}
.band-lead p{font-size:1.06rem;color:#B9C6D6;max-width:var(--measure)}
.sect-h{font-size:clamp(1.55rem,2.9vw,2.15rem);max-width:22ch;margin-bottom:26px}
.band p{max-width:var(--measure)}

/* deck */
.deck{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line)}
.deck li{background:var(--ink);padding:30px 28px;position:relative}
.band-alt .deck li{background:var(--panel)}
.deck .idx{display:block;font-family:Archivo,sans-serif;font-size:.78rem;font-weight:600;
  color:var(--gold-dim);margin-bottom:14px}
.deck h3{font-size:1.12rem;margin-bottom:9px}
.deck p{color:#A8B6C8;font-size:.96rem;margin:0;max-width:46ch}
.deck a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(212,175,55,.35);
  white-space:nowrap}
.deck a:hover{border-bottom-color:var(--gold)}
.band-steps .deck{grid-template-columns:repeat(4,minmax(0,1fr))}
.band-steps .deck p{max-width:none}

/* checklist */
.checks{list-style:none;margin:0;padding:0;max-width:78ch}
.checks li{position:relative;padding:15px 0 15px 30px;border-top:1px solid var(--line);
  color:#B9C6D6;font-size:1rem}
.checks li:last-child{border-bottom:1px solid var(--line)}
.checks li::before{content:"";position:absolute;left:0;top:24px;width:12px;height:1.5px;
  background:var(--gold)}
.checks a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(212,175,55,.35)}

/* ownership */
.band-own{background:var(--panel)}
.own{border-left:3px solid var(--gold);padding-left:30px;max-width:74ch}
.own h2{font-size:clamp(1.5rem,2.7vw,2rem);margin-bottom:16px}
.own p{color:#B9C6D6;font-size:1.06rem;max-width:none}

/* demo */
.band-demo{background:var(--panel-2)}
.demo{border-left:3px solid var(--gold);padding-left:30px;max-width:70ch}
.demo h2{font-size:clamp(1.4rem,2.6vw,1.9rem);margin-bottom:14px}
.demo p{color:#B9C6D6;max-width:none}

/* cases */
.band-cases{padding-top:0}
.case{padding:52px 0;border-bottom:1px solid var(--line)}
.case:last-child{border-bottom:0;padding-bottom:0}
.case h2{font-size:clamp(1.35rem,2.5vw,1.8rem);max-width:28ch;margin-bottom:26px}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px}
.case-grid h3{font-size:.82rem;font-weight:600;color:var(--gold);letter-spacing:.02em;
  margin-bottom:10px}
.case-grid p{color:#A8B6C8;font-size:.95rem;margin:0;max-width:none}

/* exit + end cta */
.band-exit{background:var(--panel)}
.exit{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,auto);gap:36px;
  align-items:center;border-left:3px solid var(--gold-dim);padding-left:30px}
.exit h2{font-size:clamp(1.3rem,2.4vw,1.7rem);max-width:26ch;margin-bottom:12px}
.exit p{color:#A8B6C8;font-size:.98rem;margin:0}
.band-end{border-bottom:0}
.endcta{text-align:left;max-width:60ch}
.endcta h2{font-size:clamp(1.7rem,3.2vw,2.4rem);margin-bottom:14px}
.endcta p{color:#B9C6D6;margin-bottom:28px}

/* contact */
.band-contact{border-bottom:0}
.contact-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px}
.contact-copy .lead-p{font-size:1.05rem;color:#B9C6D6}
.contact-copy h2{font-size:1.2rem;margin:32px 0 10px}
.contact-copy p{color:#A8B6C8;font-size:.98rem}
.contact-copy a{color:var(--gold)}
.form label{display:block;font-size:.86rem;color:#B9C6D6;margin-bottom:16px}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form input,.form select,.form textarea{width:100%;margin-top:7px;background:var(--panel);
  border:1px solid var(--line);color:var(--paper);padding:11px 13px;font:inherit;font-size:.95rem;
  border-radius:0}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--gold);outline:none}
.form fieldset{border:1px solid var(--line);padding:16px 18px;margin:0 0 16px}
.form legend{font-size:.86rem;color:#B9C6D6;padding:0 6px}
.form .opts{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.form .opts label{display:flex;align-items:center;gap:9px;margin:0;font-size:.93rem}
.form .opts input{width:auto;margin:0}
.form textarea{resize:vertical}
.form button{margin-top:8px;cursor:pointer}
.hp{position:absolute;left:-9999px}

/* legal */
.band-legal h2{font-size:1.25rem;margin:34px 0 12px}
.band-legal h2:first-child{margin-top:0}
.band-legal p{color:#B9C6D6}
.band-legal a{color:var(--gold)}

/* footer */
.foot{background:#04080F;padding:56px 0 0;border-top:1px solid var(--line)}
.foot-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:48px;
  padding-bottom:44px}
.foot-line{color:var(--gold);font-family:Archivo,sans-serif;font-weight:600;font-size:.9rem;
  margin-top:16px}
.foot-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.foot-cols h2{font-size:.8rem;font-weight:600;color:var(--gold);letter-spacing:.03em;
  margin-bottom:14px}
.foot-cols a{display:block;color:var(--muted);text-decoration:none;font-size:.92rem;
  padding:5px 0}
.foot-cols a:hover{color:var(--paper)}
.foot-base{border-top:1px solid var(--line);padding-top:22px;padding-bottom:30px;
  display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.foot-base p{color:#63748A;font-size:.8rem;margin:0;max-width:74ch}


/* split band: sticky heading left, content right. Uses the full width. */
.split{display:grid;grid-template-columns:minmax(0,.36fr) minmax(0,.64fr);gap:52px;align-items:start}
.split-h{position:sticky;top:100px}
.split-h h2{font-size:clamp(1.45rem,2.5vw,1.95rem);max-width:18ch}
.split-k{margin:14px 0 0;font-size:.78rem;color:var(--gold);letter-spacing:.04em}
.split-b > p{max-width:60ch}
.split-b > :first-child{margin-top:0}
.split-b .deck{grid-template-columns:repeat(2,minmax(0,1fr))}
.split-b .deck-1{grid-template-columns:1fr}
.split-b .checks{max-width:none}

/* spec list */
.spec{margin:0;display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.spec > div{background:var(--ink);padding:20px 24px}
.band-alt .spec > div{background:var(--panel)}
.spec dt{font-family:Archivo,sans-serif;font-weight:600;font-size:.95rem;margin-bottom:6px}
.spec dd{margin:0;color:#A8B6C8;font-size:.94rem;max-width:62ch}

/* faq */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:17px 34px 17px 0;position:relative;
  font-family:Archivo,sans-serif;font-weight:600;font-size:1rem;color:var(--paper)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:26px;width:11px;height:11px;
  border-right:1.5px solid var(--gold);border-bottom:1.5px solid var(--gold);
  transform:rotate(45deg);transition:transform .18s ease}
.faq details[open] summary::after{transform:rotate(225deg);top:29px}
.faq summary:hover{color:var(--gold)}
.faq details p{margin:0 0 20px;color:#A8B6C8;font-size:.97rem;max-width:66ch}

/* contact next steps */
.next{margin:0 0 8px;padding-left:20px;color:#A8B6C8;font-size:.97rem}
.next li{margin-bottom:7px}

@media (max-width:900px){
  .split{grid-template-columns:1fr;gap:24px}
  .split-h{position:static}
  .split-b .deck{grid-template-columns:1fr}
}

@media (max-width:900px){
  .hero-in,.contact-grid,.foot-in{grid-template-columns:1fr;gap:30px}
  .hero-art{order:-1;max-width:250px;margin:0 auto}
  .hero h1{max-width:none;text-wrap:pretty}
  .deck,.band-steps .deck{grid-template-columns:1fr}
  .case-grid{grid-template-columns:1fr;gap:22px}
  .exit{grid-template-columns:1fr}
  .nav{display:none}
  .masthead-in .btn-sm{display:none}
  .menu{display:flex}
  .hero{padding:56px 0 50px}
  .band{padding:52px 0}
}
@media (max-width:560px){
  .form .row,.form .opts{grid-template-columns:1fr}
  body{font-size:16px}
}