@font-face{
  font-family:'Orbitron';
  src:url('/assets/orbitron-latin.woff2') format('woff2');
  font-weight:400 700; font-style:normal; font-display:swap;
}
:root{
  --ink:#07080b;
  --ink2:#0c0e13;
  --paper:#f4f5f7;
  --dim:#b3b7c0;
  --grey:#7d828d;
  --line:rgba(244,245,247,.13);
  --rule:rgba(244,245,247,.07);
  --violet:#9f61ff;
  --blue:#628cff;
  --cyan:#2fd8e6;
  --warn:#ff6b7a;
  --mono:'Orbitron',ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  --num:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  --sans:"Helvetica Neue",Helvetica,Arial,system-ui,-apple-system,"Segoe UI",sans-serif;
  --bar:68px;
  --gut:clamp(20px,5vw,72px);
  --max:1180px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:calc(var(--bar) + 12px)}
body{
  margin:0; background:var(--ink); color:var(--paper);
  font-family:var(--sans); font-size:16px; line-height:1.62;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a{color:inherit}
p,li,dd{text-wrap:pretty} h1,h2{text-wrap:balance}
::selection{background:rgba(47,216,230,.3)}
:focus-visible{outline:2px solid var(--cyan); outline-offset:3px}

/* ── masthead ── */
#bar{
  position:fixed; inset:0 0 auto 0; height:var(--bar); z-index:40;
  display:flex; align-items:center; gap:18px;
  padding:0 max(var(--gut), calc((100% - var(--max)) / 2 + var(--gut)));
  background:rgba(7,8,11,.72); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--rule);
}
#bar .mark{display:flex; align-items:center; gap:14px; text-decoration:none}
#bar .mark img{display:block; height:22px; width:auto}
#bar .mark span{font-family:var(--mono); font-size:11px; letter-spacing:.34em; text-transform:uppercase}
#bar nav{margin-left:auto; display:flex; align-items:center; gap:clamp(12px,2vw,28px)}
#bar nav a{
  font-family:var(--mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--grey); text-decoration:none; transition:color .2s;
}
#bar nav a:hover{color:var(--paper)}
#bar nav a{white-space:nowrap}
#bar nav a.pill{color:var(--ink); background:var(--paper); border-radius:999px; padding:9px 15px}
#bar nav a.pill:hover{background:var(--cyan); color:var(--ink)}
@media (max-width:1080px){ #bar nav a:not(.pill){display:none} }

/* ── hero ── */
.hero{
  position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end;
  padding:calc(var(--bar) + 40px) max(var(--gut), calc((100% - var(--max)) / 2 + var(--gut))) clamp(34px,6vh,64px);
  overflow:hidden; isolation:isolate;
}
#field{position:absolute; inset:0; width:100%; height:100%; z-index:-2; display:block}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(7,8,11,.5) 0%, rgba(7,8,11,0) 20%, rgba(7,8,11,0) 66%, rgba(7,8,11,.8) 90%, var(--ink) 100%),
    linear-gradient(90deg, rgba(7,8,11,.82) 0%, rgba(7,8,11,.5) 34%, rgba(7,8,11,0) 58%);
}
.hero .logo{display:block; height:clamp(52px,6.4vw,84px); width:auto; margin:0 0 clamp(28px,5vh,52px)}
.eyebrow{
  font-family:var(--mono); font-size:10px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--grey); margin:0 0 1.5em; display:flex; align-items:center; gap:.9em; flex-wrap:wrap;
}
.eyebrow i{width:24px; height:1px; background:var(--line)}
.eyebrow b{font-weight:400; color:var(--cyan)}
h1{
  font-size:clamp(2.1rem,5.2vw,4.2rem); line-height:1.02; letter-spacing:-.035em; font-weight:500;
  margin:0 0 .5em; max-width:22ch;
}
h1 em{font-style:normal; background:linear-gradient(90deg,var(--violet),var(--blue) 45%,var(--cyan)); -webkit-background-clip:text; background-clip:text; color:transparent}
.lead{font-size:clamp(1.02rem,1.5vw,1.25rem); color:#dcdfe5; max-width:58ch; margin:0 0 2em}
.cta{display:flex; flex-wrap:wrap; gap:12px; margin:0 0 clamp(34px,6vh,60px)}
.btn{
  display:inline-flex; align-items:center; gap:.8em; cursor:pointer;
  font-family:var(--mono); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  text-decoration:none; border-radius:999px; padding:14px 22px; border:1px solid var(--line);
  color:var(--paper); background:transparent; transition:border-color .2s, background .2s, color .2s;
}
.btn:hover{border-color:var(--cyan)}
.btn.solid{background:var(--paper); color:var(--ink); border-color:var(--paper)}
.btn.solid:hover{background:var(--cyan); border-color:var(--cyan)}
.btn[disabled]{opacity:.5; cursor:default}

.strip{
  display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--rule);
  border:1px solid var(--rule); margin:0; padding:0; list-style:none;
}
@media (min-width:760px){ .strip{grid-template-columns:repeat(4,1fr)} }
.strip li{background:rgba(7,8,11,.8); padding:16px 18px; backdrop-filter:blur(6px)}
.strip span{display:block; font-family:var(--mono); font-size:9px; letter-spacing:.24em; text-transform:uppercase; color:var(--grey); margin-bottom:.6em}
.strip b{font-weight:500; font-size:.95rem}

/* ── shell ── */
main{max-width:var(--max); margin:0 auto; padding:0 var(--gut)}
section{padding:clamp(56px,10vh,120px) 0; border-top:1px solid var(--rule)}
h2{font-size:clamp(1.55rem,3.4vw,2.7rem); line-height:1.08; letter-spacing:-.028em; font-weight:500; margin:0 0 .6em; max-width:22ch}
h3{font-size:1.08rem; font-weight:500; letter-spacing:-.01em; margin:0 0 .5em}
p{margin:0 0 1.05em; max-width:66ch; color:var(--dim)}
p strong{color:var(--paper); font-weight:500}
.kicker{font-size:clamp(1rem,1.4vw,1.18rem); color:#d6d9df; max-width:62ch}
.split{display:grid; gap:clamp(24px,4vw,64px)}
@media (min-width:900px){ .split{grid-template-columns:5fr 6fr; align-items:start} }

/* cards */
.grid{display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule); margin-top:clamp(26px,4vh,44px)}
.grid.g2{grid-template-columns:1fr}
.grid.g3{grid-template-columns:1fr}
.grid.g4{grid-template-columns:1fr}
@media (min-width:640px){ .grid.g2,.grid.g4{grid-template-columns:1fr 1fr} }
@media (min-width:900px){ .grid.g3{grid-template-columns:repeat(3,1fr)} .grid.g4{grid-template-columns:repeat(4,1fr)} }
.card{background:var(--ink); padding:clamp(20px,2.6vw,30px); position:relative; transition:background .3s}
.card:hover{background:var(--ink2)}
.card .n{font-family:var(--mono); font-size:9px; letter-spacing:.26em; text-transform:uppercase; color:var(--grey); display:block; margin-bottom:1.4em}
.card p{font-size:.93rem; margin:0; color:var(--dim)}
.card.v .n{color:var(--violet)} .card.b .n{color:var(--blue)} .card.c .n{color:var(--cyan)}
.card.big h3{font-size:clamp(1.3rem,2.2vw,1.8rem); letter-spacing:-.02em}

/* the statement */
.statement{
  font-size:clamp(1.5rem,3.6vw,2.9rem); line-height:1.12; letter-spacing:-.03em; font-weight:500;
  max-width:20ch; margin:0 0 .7em; color:var(--paper);
}
.outcome{display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule); margin-top:1px}
@media (min-width:640px){ .outcome{grid-template-columns:1fr 1fr} }
.outcome div{background:var(--ink); padding:18px clamp(20px,2.6vw,30px); font-size:.95rem; color:var(--dim)}
.outcome b{font-weight:500; color:var(--cyan)}
.outcome div + div b{color:var(--warn)}

/* MCP console */
.console{
  border:1px solid var(--line); border-radius:6px; background:linear-gradient(160deg,rgba(159,97,255,.07),rgba(47,216,230,.03) 60%), var(--ink2);
  overflow:hidden;
}
.console header{
  display:flex; align-items:center; gap:8px; padding:11px 16px; border-bottom:1px solid var(--rule);
  font-family:var(--mono); font-size:9px; letter-spacing:.22em; text-transform:uppercase; color:var(--grey);
}
.console header i{width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px var(--cyan)}
.console header span{margin-left:auto; color:var(--violet)}
.console pre{
  margin:0; padding:18px 18px 22px; font-family:var(--num); font-size:12.5px; line-height:1.7;
  color:#cfd3da; overflow-x:auto; white-space:pre;
}
.console .k{color:var(--cyan)} .console .s{color:#c9b3ff} .console .c{color:var(--grey)}
.tools{list-style:none; margin:1.6em 0 0; padding:0; border-top:1px solid var(--rule)}
.tools li{display:grid; grid-template-columns:minmax(120px,11em) 1fr; gap:1em; padding:11px 0; border-bottom:1px solid var(--rule); font-size:.9rem; color:var(--dim)}
.tools code{font-family:var(--num); font-size:.82rem; color:var(--cyan)}

/* is / is not */
.pair{display:grid; gap:clamp(22px,3vw,48px); margin-top:clamp(26px,4vh,44px)}
@media (min-width:800px){ .pair{grid-template-columns:1fr 1fr} }
.pair h3{font-family:var(--mono); font-size:10px; letter-spacing:.26em; text-transform:uppercase; color:var(--grey); font-weight:400; margin:0 0 1.2em}
.pair ul{margin:0; padding:0; list-style:none}
.pair li{position:relative; padding-left:1.5em; margin:0 0 .8em; color:var(--dim); font-size:.95rem}
.pair li strong{color:var(--paper); font-weight:500}
.pair li::before{position:absolute; left:0; font-family:var(--num)}
.pair .is li::before{content:"+"; color:var(--cyan)}
.pair .not li::before{content:"–"; color:var(--violet)}

/* surplus bar */
.bar4{display:flex; gap:3px; height:44px; margin:clamp(26px,4vh,40px) 0 12px}
.bar4 i{display:block; height:100%; transform-origin:left; transform:scaleX(0); transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.in .bar4 i{transform:none}
.bar4 .s1{flex:40; background:var(--cyan)}
.bar4 .s2{flex:35; background:var(--blue); transition-delay:.1s}
.bar4 .s3{flex:15; background:var(--violet); transition-delay:.2s}
.bar4 .s4{flex:10; background:#4d5361; transition-delay:.3s}
.legend{display:flex; flex-wrap:wrap; gap:8px 26px; list-style:none; margin:0; padding:0; font-family:var(--num); font-size:11.5px; color:var(--dim)}
.legend b{font-weight:400; color:var(--paper); margin-right:.5em}
.note{border-left:2px solid var(--line); padding:2px 0 2px 18px; margin:1.8em 0 0; color:var(--grey); font-size:.88rem; max-width:64ch}
.tag{
  font-family:var(--num); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--cyan);
  border:1px solid rgba(47,216,230,.35); border-radius:3px; padding:1px 6px; margin-left:8px; vertical-align:middle; white-space:nowrap;
}

/* roadmap */
.road{list-style:none; margin:clamp(26px,4vh,44px) 0 0; padding:0; display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule)}
@media (min-width:980px){ .road{grid-template-columns:repeat(5,1fr)} }
.road li{background:var(--ink); padding:22px 20px 24px; display:flex; flex-direction:column}
.road .ph{font-family:var(--mono); font-size:10px; letter-spacing:.26em; color:var(--cyan); margin-bottom:1.1em}
.road h3{margin-bottom:.6em}
.road p{font-size:.88rem; margin:0 0 1.4em}
.road .gate{margin-top:auto; padding-top:14px; border-top:1px dashed var(--line); font-size:.84rem; color:var(--paper)}
.road .gate span{display:block; font-family:var(--mono); font-size:8.5px; letter-spacing:.26em; color:var(--violet); margin-bottom:.6em}

/* form */
form.early{display:grid; gap:14px; margin:0}
@media (min-width:640px){ form.early{grid-template-columns:1fr 1fr} form.early .full{grid-column:1 / -1} }
label{display:block; font-family:var(--mono); font-size:9px; letter-spacing:.24em; text-transform:uppercase; color:var(--grey)}
label > span{display:block; margin-bottom:.8em}
input[type=text],input[type=email],input[type=password],select,textarea{
  width:100%; background:rgba(244,245,247,.035); border:1px solid var(--line); border-radius:4px;
  color:var(--paper); font:inherit; font-family:var(--sans); font-size:.96rem; letter-spacing:0; text-transform:none;
  padding:13px 14px; transition:border-color .2s, background .2s;
}
select{appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--grey) 50%),linear-gradient(135deg,var(--grey) 50%,transparent 50%); background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%; background-size:5px 5px; background-repeat:no-repeat}
select option{background:var(--ink2); color:var(--paper)}
textarea{min-height:120px; resize:vertical}
input:focus,select:focus,textarea:focus{outline:0; border-color:var(--cyan); background:rgba(47,216,230,.04)}
.consent{display:flex; gap:12px; align-items:flex-start; font-family:var(--sans); font-size:.86rem; letter-spacing:0; text-transform:none; color:var(--dim)}
.consent input{margin-top:.25em; accent-color:var(--cyan)}
.consent a{color:var(--paper)}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.formmsg{font-size:.92rem; margin:0; min-height:1.5em}
.formmsg.ok{color:var(--cyan)} .formmsg.err{color:var(--warn)}
.seek{list-style:none; margin:1.6em 0 0; padding:0}
.seek li{padding:12px 0; border-top:1px solid var(--rule); color:var(--dim); font-size:.95rem}
.seek li b{color:var(--paper); font-weight:500}

/* footer */
footer{border-top:1px solid var(--line)}
footer .in{max-width:var(--max); margin:0 auto; padding:clamp(34px,6vh,64px) var(--gut) clamp(44px,8vh,84px)}
footer img.logo{display:block; height:54px; width:auto; margin-bottom:28px; opacity:.9}
footer p{font-size:.84rem; color:#8f949e; max-width:78ch; line-height:1.72}
footer .links{display:flex; flex-wrap:wrap; gap:8px 26px; margin-top:2.2em; font-family:var(--mono); font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--grey)}
footer .links a{color:var(--dim); text-decoration:none; border-bottom:1px solid var(--line)}
footer .links a:hover{color:var(--paper)}
footer .links a.quiet{border:0; color:#565b66; margin-left:auto}
footer .links a.quiet:hover{color:var(--dim)}

/* small pages (access, privacy, room) */
.solo{min-height:100svh; display:flex; flex-direction:column; justify-content:center; padding:calc(var(--bar) + 40px) var(--gut) 60px; max-width:calc(440px + 2 * var(--gut)); margin:0 auto}
.solo h1{font-size:clamp(1.7rem,4vw,2.3rem); max-width:none}
.solo form{display:grid; gap:14px; margin-top:1.4em}
.doc{max-width:calc(760px + 2 * var(--gut)); margin:0 auto; padding:calc(var(--bar) + clamp(40px,8vh,90px)) var(--gut) 80px}
.doc h1{font-size:clamp(1.8rem,4.4vw,3rem); max-width:none}
.doc h2{font-size:1.25rem; margin-top:2em; max-width:none}
table{width:100%; border-collapse:collapse; font-size:.86rem; margin-top:1.4em}
th,td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--rule); vertical-align:top; color:var(--dim)}
thead th{font-family:var(--mono); font-size:9px; letter-spacing:.2em; text-transform:uppercase; color:var(--grey); font-weight:400; border-bottom:1px solid var(--line)}
td:first-child{color:var(--paper); white-space:nowrap}
.scroll{overflow-x:auto}

/* reveal */
.rev{opacity:0; transform:translateY(16px); transition:opacity .8s ease, transform .8s ease}
.rev.in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rev{opacity:1; transform:none; transition:none}
  .bar4 i{transform:none; transition:none}
}

/* five-up */
.grid.g5{grid-template-columns:1fr}
@media (min-width:640px){ .grid.g5{grid-template-columns:1fr 1fr} }
@media (min-width:1000px){ .grid.g5{grid-template-columns:repeat(5,1fr)} }
.scope{margin-top:clamp(30px,5vh,56px); padding-top:clamp(26px,4vh,44px); border-top:1px solid var(--rule)}
.scope h3{font-size:clamp(1.2rem,2.2vw,1.7rem); letter-spacing:-.02em; max-width:18ch}

/* due-diligence flow */
.flow{display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule); margin-top:clamp(26px,4vh,44px)}
@media (min-width:940px){ .flow{grid-template-columns:4fr 6fr 5fr} }
.flow .col{background:var(--ink); padding:clamp(20px,2.6vw,30px)}
.flow h3{font-family:var(--mono); font-size:9.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--grey); font-weight:400; margin:0 0 1.6em; line-height:1.9}
.inputs{list-style:none; margin:0; padding:0}
.inputs li{padding:9px 0; border-bottom:1px solid var(--rule); font-size:.92rem; color:var(--dim); display:flex; justify-content:space-between}
.inputs li::after{content:"\2192"; color:var(--grey); font-family:var(--num)}
.desk{border-left:2px solid var(--line); padding:2px 0 2px 16px; margin:0 0 1.3em}
.desk.v{border-color:var(--violet)} .desk.b{border-color:var(--blue)} .desk.c{border-color:var(--cyan)}
.desk b{display:block; font-weight:500; margin-bottom:.25em}
.desk span{font-size:.9rem; color:var(--dim)}
.matrix{list-style:none; margin:0; padding:0}
.matrix li{display:grid; grid-template-columns:10.5em 1fr 1.2em; align-items:center; gap:12px; padding:8px 0; font-size:.88rem; color:var(--dim)}
.matrix i{display:block; height:6px; border-radius:3px; background:linear-gradient(90deg,var(--violet),var(--cyan)); transform-origin:left; transform:scaleX(0); transition:transform 1s cubic-bezier(.2,.7,.2,1) .2s}
.in .matrix i{transform:none}
.matrix .w1{width:33%} .matrix .w2{width:66%} .matrix .w3{width:100%}
.matrix b{font-family:var(--num); font-weight:400; color:var(--paper); text-align:right}
.outcome.one{grid-template-columns:1fr}
.outcome.one b{color:var(--cyan)}

/* dashboard preview */
.dash{border:1px solid var(--line); border-radius:6px; background:var(--ink2); margin-top:clamp(26px,4vh,44px); overflow:hidden}
.dash header{display:flex; align-items:center; gap:8px; padding:12px 16px; border-bottom:1px solid var(--rule); font-family:var(--mono); font-size:9px; letter-spacing:.22em; text-transform:uppercase; color:var(--dim)}
.dash header i{width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px var(--cyan)}
.dash header span{margin-left:auto; color:var(--violet); text-align:right}
.dgrid{display:grid; gap:1px; background:var(--rule); grid-template-columns:1fr}
@media (min-width:700px){ .dgrid{grid-template-columns:1fr 1fr} .dgrid .wide{grid-column:span 2} }
@media (min-width:1000px){ .dgrid{grid-template-columns:1.25fr 1fr 1fr 1fr} .dgrid .terms{grid-row:span 2} .dgrid .wide{grid-column:span 2} .dgrid .agents{grid-column:4; grid-row:1 / span 2} }
.panel{background:var(--ink); padding:18px 18px 16px; min-width:0}
.panel h4{font-family:var(--mono); font-size:9px; letter-spacing:.24em; text-transform:uppercase; color:var(--grey); font-weight:400; margin:0 0 1.3em}
.panel svg{display:block; width:100%; height:90px; overflow:visible}
.panel polyline{fill:none; stroke-width:1.6; vector-effect:non-scaling-stroke; stroke-linejoin:round}
.panel .l1{stroke:var(--cyan)} .panel .l2{stroke:#4d5361}
.panel .cap{font-family:var(--num); font-size:10.5px; color:var(--grey); margin:12px 0 0}
.panel dl{display:grid; grid-template-columns:auto 1fr; gap:.7em 1.4em; margin:0; font-size:.88rem}
.panel dt{font-family:var(--num); font-size:.78rem; color:var(--grey)}
.panel dd{margin:0; text-align:right; color:var(--paper)}
.panel dd.ok{color:var(--cyan)}
.donut{width:90px; height:90px; border-radius:50%; background:conic-gradient(var(--cyan) 0 46%, var(--blue) 46% 71%, var(--violet) 71% 88%, #4d5361 88% 100%); -webkit-mask:radial-gradient(circle, transparent 30px, #000 31px); mask:radial-gradient(circle, transparent 30px, #000 31px)}
.panel.agents ul{list-style:none; margin:0; padding:0}
.panel.agents li{display:flex; align-items:center; gap:10px; padding:7px 0; font-size:.88rem; color:var(--dim); border-bottom:1px solid var(--rule)}
.panel.agents li i{width:6px; height:6px; border-radius:50%; background:var(--cyan); flex:none}
@media (prefers-reduced-motion:reduce){ .matrix i{transform:none; transition:none} }

/* phones: the mark alone in the bar, and the field steps back behind the copy */
@media (max-width:520px){
  #bar .mark span{display:none}
  #field{opacity:.42}
}
