:root{--bg:#0b121c;--bg2:#0f1826;--line:#1b2a3d;--text:#f3f6fa;--muted:#8a9bb0;--accent:#38bdf8;--max:1120px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
header.nav{position:sticky;top:0;z-index:10;background:rgba(11,18,28,.88);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header.nav .wrap{display:flex;justify-content:space-between;align-items:center;height:64px}
.logo{font-weight:700;letter-spacing:.05em}
nav a{margin-left:28px;color:var(--muted);font-size:.85rem;transition:color .2s}
nav a:hover{color:var(--accent)}
.label{color:var(--accent);font-size:.78rem;letter-spacing:.35em;text-transform:uppercase;margin:0 0 32px}
section{padding:96px 0;border-bottom:1px solid var(--line)}
.hero{min-height:82vh;display:flex;align-items:center;border-bottom:1px solid var(--line)}
.eyebrow{color:var(--muted);letter-spacing:.4em;font-size:.8rem;text-transform:uppercase;margin-bottom:28px}
h1{font-size:clamp(2.4rem,6vw,4.6rem);line-height:1.1;margin:0 0 32px;font-weight:700}
.lede{color:var(--muted);max-width:640px;font-size:1.05rem}
.btn{display:inline-block;margin-top:40px;border:1px solid var(--text);padding:14px 26px;letter-spacing:.3em;font-size:.78rem;text-transform:uppercase;transition:all .2s}
.btn:hover{background:var(--accent);border-color:var(--accent);color:var(--bg)}
h2{font-size:clamp(1.6rem,3.5vw,2.3rem);margin:0 0 40px}
.grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.card{background:var(--bg2);border:1px solid var(--line);padding:28px;transition:border-color .2s,transform .2s;display:block}
a.card:hover{border-color:var(--accent);transform:translateY(-3px)}
.card h3{margin:0 0 6px;font-size:1.05rem}
.card .tag{color:var(--accent);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase}
.card p{color:var(--muted);font-size:.9rem;margin:12px 0 0}
.card p.impact{color:var(--accent)}
.sector{margin-bottom:48px}
.sector h3{color:var(--muted);font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;margin:0 0 16px;font-weight:400}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));column-gap:56px}
.kv div{display:flex;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.kv span:first-child{color:var(--muted);text-transform:uppercase;letter-spacing:.15em;font-size:.75rem}
.kv span:last-child{text-align:right}
.timeline{border-left:1px solid var(--line);margin-left:6px;padding-left:32px;max-width:760px}
.step{position:relative;margin-bottom:40px}
.step::before{content:"";position:absolute;left:-39px;top:6px;width:11px;height:11px;border:1px solid var(--muted);background:var(--bg)}
.step.now::before{background:var(--accent);border-color:var(--accent)}
.step small{color:var(--muted);letter-spacing:.2em;text-transform:uppercase;font-size:.72rem}
.step h3{margin:4px 0 6px;font-size:1.1rem}
.step p{margin:0;color:var(--muted);font-size:.92rem}
.media{aspect-ratio:16/9;background:var(--bg2);border:1px dashed var(--line);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:.85rem;margin:32px 0}
.media img,.media video{width:100%;height:100%;object-fit:cover}
footer{padding:36px 0;color:var(--muted);font-size:.8rem}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .7s,transform .7s}
.reveal.in{opacity:1;transform:none}
.back{display:inline-block;margin:48px 0 0;color:var(--muted);font-size:.85rem}
.back:hover{color:var(--accent)}
.prose p{color:var(--muted);max-width:720px}
.prose h3{margin:40px 0 8px;color:var(--accent);font-size:.8rem;letter-spacing:.3em;text-transform:uppercase}
@media(max-width:640px){nav a{margin-left:16px}section{padding:64px 0}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
.hero .wrap{width:100%}
@media(max-width:640px){nav a{margin-left:12px;font-size:.75rem}.btn{letter-spacing:.2em}}
a.reg{border-bottom:1px solid var(--accent);color:var(--accent)}a.reg:hover{color:var(--text)}
dialog.modal{border:1px solid var(--line);background:var(--bg2);color:var(--text);padding:0;width:min(760px,92vw);max-height:88vh;overflow:auto;font-family:inherit}
dialog.modal::backdrop{background:rgba(5,9,15,.78);backdrop-filter:blur(3px)}
.modal-box{padding:40px;position:relative}
.modal-box h3{font-size:1.6rem;margin:0 0 12px}
.modal-box h4{color:var(--accent);font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;margin:28px 0 6px}
.modal-box p{color:var(--muted);margin:0}
.modal-box p.impact{color:var(--accent)}
.modal-box .label{margin-bottom:12px}
.modal-box .media{aspect-ratio:21/9;margin:24px 0}
.modal-close{position:absolute;top:12px;right:16px;background:none;border:0;color:var(--muted);font-size:2rem;line-height:1;cursor:pointer;font-family:inherit}
.modal-close:hover{color:var(--accent)}
.modal-back{background:none;color:var(--text);font-family:inherit;cursor:pointer}
body:has(dialog[open]){overflow:hidden}
@media(max-width:640px){.modal-box{padding:28px 20px}}
.editing .reveal{opacity:1;transform:none}
.editing [contenteditable]{outline:1px dashed transparent;outline-offset:3px;cursor:text}
.editing [contenteditable]:hover{outline-color:var(--muted)}
.editing [contenteditable]:focus{outline:1px solid var(--accent)}
.edit-bar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:16px;align-items:center;justify-content:center;padding:12px 16px;background:var(--accent);color:var(--bg);font-size:.85rem}
.edit-save{background:var(--bg);color:var(--text);border:0;padding:10px 18px;font-family:inherit;cursor:pointer;letter-spacing:.1em}
.stairs{display:flex;flex-direction:column}
.stair{display:grid;grid-template-columns:190px 1fr;gap:20px;align-items:center;padding:14px 18px;margin-left:calc(var(--i)*6%);background:linear-gradient(90deg,color-mix(in srgb,var(--accent) calc(var(--i)*5%),transparent),transparent);border-left:2px solid color-mix(in srgb,var(--accent) calc(var(--i)*25%),var(--line));border-bottom:1px solid var(--line)}
.stair-lvl small{display:block;color:var(--accent);letter-spacing:.2em;text-transform:uppercase;font-size:.68rem}
.stair-lvl p{margin:2px 0 0;font-size:.95rem}
.stair-chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{background:var(--bg2);border:1px solid var(--line);padding:8px 14px}
.chip p{margin:0;font-size:.9rem;color:var(--text)}
.chip small{color:var(--muted);font-size:.72rem}
@media(max-width:760px){.stair{grid-template-columns:1fr;margin-left:calc(var(--i)*3%);gap:8px}}
button.chip{font-family:inherit;color:inherit;text-align:left;cursor:pointer;transition:border-color .2s,background .2s}
button.chip:hover,button.chip.on{border-color:var(--accent)}
button.chip.on{background:color-mix(in srgb,var(--accent) 14%,var(--bg2))}
.plus{color:var(--accent);margin-left:8px;display:inline-block;transition:transform .3s}
.chip.on .plus{transform:rotate(45deg)}
.stair{transition:opacity .4s,transform .5s}
.stair-detail{grid-column:2;display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease}
.stair.open .stair-detail{grid-template-rows:1fr}
.stair-detail-in{overflow:hidden;min-height:0}
.stair-detail-in .d-title{margin:6px 0 8px;color:var(--accent);font-size:.78rem;letter-spacing:.2em;text-transform:uppercase}
.stair-detail-in ul{margin:0 0 6px;padding-left:18px;color:var(--muted);font-size:.9rem}
.stair-detail-in li{margin:4px 0}
.stairs.has-open .stair:not(.open){opacity:.5}
@media(max-width:760px){.stair-detail{grid-column:1}}
@media(prefers-reduced-motion:reduce){.stair,.stair-detail{transition:none}}
.stairs{position:relative}
.stair{position:relative;isolation:isolate;background:none;border-left:0;border-bottom:0;padding-left:20px}
.stair::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) calc(var(--i)*5%),transparent),transparent);border-left:2px solid color-mix(in srgb,var(--accent) calc(var(--i)*25%),var(--line));border-bottom:1px solid var(--line)}
.stairs.stage .stair{position:static}
.stairs.stage .stair::before{display:none}
.stairs.stage .stair-lvl{opacity:0}
.stairs.stage .stair-detail{display:none}
.stairs.stage .chip{position:absolute;left:0;top:0;margin:0;pointer-events:none;z-index:2}
.disc-label{position:absolute;top:0;opacity:0;pointer-events:none;color:var(--accent);letter-spacing:.25em;text-transform:uppercase;font-size:.72rem;transition:opacity 1.2s;transform:translateX(-50%);white-space:nowrap}
@keyframes arrive{from{opacity:0}to{opacity:1}}
.stairs.arrive .stair::before,.stairs.arrive .stair-lvl{animation:arrive 2.4s}
.region{position:relative;padding-right:44px}
.region::after{content:attr(data-label);position:absolute;right:0;top:0;bottom:0;width:32px;display:flex;align-items:center;justify-content:center;writing-mode:vertical-rl;text-transform:uppercase;letter-spacing:.35em;font-size:.72rem;color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,transparent);border-left:2px solid var(--accent)}
.region.ph::after{color:var(--muted);background:color-mix(in srgb,var(--muted) 10%,transparent);border-left-color:var(--muted)}
.region.ph .stair{min-height:150px}
.stairs.stage .region{position:static}
.stairs.stage .region::after{display:none}
.stairs.arrive .region::after{animation:arrive 2.4s}
.tree{padding:10px 0 6px;overflow-x:auto}
.tree ul{list-style:none;margin:0;padding:0;font-size:inherit;color:inherit}
.tree li{position:relative;display:flex;align-items:center;margin:0}
.tree li>ul{margin-left:44px;position:relative}
.tree li>ul::before{content:"";position:absolute;left:-44px;top:50%;width:44px;border-top:1px solid var(--accent)}
.tree li>ul>li{padding:5px 0 5px 22px}
.tree li>ul>li::before{content:"";position:absolute;left:0;top:50%;width:22px;border-top:1px solid var(--accent)}
.tree li>ul>li::after{content:"";position:absolute;left:0;top:0;bottom:0;border-left:1px solid var(--accent)}
.tree li>ul>li:first-child::after{top:50%}
.tree li>ul>li:last-child::after{bottom:50%}
.tree li>ul>li:only-child::after{display:none}
.node{border:1px solid var(--line);background:var(--bg2);padding:8px 12px;font-size:.82rem;max-width:260px;animation:pop .5s both}
.node b{display:block;font-size:.85rem}
.node small{display:block;color:var(--accent);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;margin-top:2px}
.node.root{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--bg2))}
.node.proj{border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
.node.leaf{background:none;border:0;color:var(--muted);padding:4px 8px;font-size:.8rem;max-width:300px}
@keyframes pop{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
@media(max-width:760px){
 .tree li{display:block}
 .tree li>ul{margin-left:12px;padding-left:12px;border-left:1px solid var(--accent)}
 .tree li>ul::before,.tree li>ul>li::before,.tree li>ul>li::after{display:none}
 .tree li>ul>li{padding:5px 0}
 .node,.node.leaf{max-width:none}
}
@media(prefers-reduced-motion:reduce){.node{animation:none}}
.stair-detail{grid-column:1/-1}
.node.root{max-width:230px}.node.proj{max-width:270px}.node.leaf{max-width:360px}
.stairs.stage.grouped .chip.has{pointer-events:auto;cursor:pointer}
.pop{position:absolute;left:8px;right:8px;top:8px;max-height:calc(100% - 16px);overflow:auto;z-index:5;background:var(--bg2);border:1px solid var(--accent);padding:18px 18px 12px;box-shadow:0 12px 40px rgba(0,0,0,.5)}
.pop-close{position:sticky;float:right;top:0;background:none;border:0;color:var(--muted);font-size:1.8rem;line-height:1;cursor:pointer;font-family:inherit}
.pop-close:hover{color:var(--accent)}
.pop .tree{clear:both;padding-top:0}
/* region-wide */
.region{padding-right:76px}
.region::after{width:64px;font-size:.85rem}
.rot .lt{display:inline-block}
.rot .lt.in{animation:ltIn .7s cubic-bezier(.2,.7,.2,1) both}
.rot .lt.out{animation:ltOut .4s ease-in both}
@keyframes ltIn{from{opacity:0;transform:translateY(.45em);filter:blur(5px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes ltOut{to{opacity:0;transform:translateY(-.35em);filter:blur(4px)}}
.rot .caret{display:inline-block;width:.07em;height:.85em;background:var(--accent);margin-left:.08em;vertical-align:-.06em;animation:blink 1s steps(1) infinite}
.rot .caret.typing{animation:none;opacity:1}
@keyframes blink{50%{opacity:0}}
.bigtree{position:fixed;inset:0;z-index:100;background:rgba(5,9,15,.82);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:3vh 3vw}
.bigtree-box{position:relative;width:min(960px,100%);height:auto;max-height:100%;background:var(--bg);border:1px solid var(--accent);padding:22px 26px;overflow:auto;box-shadow:0 20px 80px rgba(0,0,0,.6)}
.bigtree-box .tree{clear:both;overflow:visible;padding:8px 0 20px;min-width:max-content;max-width:none}
.bigtree-box .node.root{max-width:200px}.bigtree-box .node.proj{max-width:240px}.bigtree-box .node.leaf{max-width:300px}
.bigtree-open{overflow:hidden}
.lede-list{list-style:none;margin:14px 0 0;padding:0;color:var(--muted);font-size:1.05rem;line-height:1.7}
.lede-list li::before{content:"\2192";color:var(--accent);margin-right:12px}
.rot .scr{color:var(--accent);opacity:.75}
.rot{position:relative;display:inline-block}
.rot .bar{position:absolute;left:0;right:0;bottom:-.06em;height:2px;background:var(--accent);transform-origin:left;transform:scaleX(0);opacity:0;transition:opacity .4s ease}
.ttable{border:1px solid var(--line);background:var(--bg2)}
.trow{display:grid;grid-template-columns:1.1fr 1.3fr 1.2fr;gap:28px;padding:24px 28px;border-top:1px solid var(--line);align-items:start;transition:background .2s}
.trow:first-child{border-top:0}
.thead{padding-top:14px;padding-bottom:14px;color:var(--accent);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase}
a.trow:hover{background:color-mix(in srgb,var(--accent) 8%,var(--bg2))}
.trow h3{margin:0;font-size:1.05rem}
.trow .go{color:var(--accent);margin-left:6px;transition:margin .2s}
a.trow:hover .go{margin-left:12px}
.trow p{margin:0;color:var(--muted);font-size:.9rem}
.trow p.impact{color:var(--accent)}
@media(max-width:760px){.thead{display:none}.trow{grid-template-columns:1fr;gap:8px;padding:20px}}
nav a:first-child{margin-left:0}
nav a,nav a:first-child{font-size:.85rem}
@media(min-width:900px){
body{padding-left:190px}
header.nav{position:fixed;left:0;top:0;bottom:0;width:190px;border-bottom:0;border-right:1px solid var(--line);backdrop-filter:none;background:var(--bg)}
header.nav .wrap{max-width:none;width:100%;margin:0;height:100%;flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:56px 28px}
nav{display:flex;flex-direction:column;gap:20px}
nav a,nav a:first-child{margin-left:0}
}
@media(min-width:900px){
.wrap{margin-left:0;margin-right:auto;padding-left:56px;padding-right:56px}
header.nav .wrap{padding:56px 28px}
section{scroll-margin-top:0}
}
@media(min-width:900px){#contact{min-height:100vh}}
.ttable{background:var(--bg2);border:1px solid var(--line)}
.trow{grid-template-columns:1.2fr 1.3fr 1.3fr;gap:40px;padding:26px 36px;align-items:baseline}
.thead{padding-top:16px;padding-bottom:16px;color:var(--muted);font-size:.7rem;letter-spacing:.22em;background:rgba(255,255,255,.02);border-bottom:1px solid var(--line)}
.trow h3,.trow p{line-height:1.55}
.trow h3{font-size:1rem;font-weight:700;color:var(--text)}
.trow p{font-size:.92rem}
.trow p.impact{color:var(--accent);font-size:.95rem}
.trow .go{font-weight:400}
@media(max-width:760px){.trow{padding:20px;gap:6px}.trow p:nth-of-type(1)::before{content:"Problem: ";color:var(--text);opacity:.6}.trow p.impact::before{content:"Impact: ";color:var(--text);opacity:.6}}
@media(max-width:760px){.trow{grid-template-columns:1fr}}
@media(min-width:900px){
section{padding-top:56px}
.hero{align-items:flex-start;padding-top:56px}
header.nav .wrap{padding-top:56px}
nav a{line-height:1.6}
.eyebrow,.label{line-height:1.6}
}
@media(min-width:900px){.eyebrow,.label{margin-top:0}}
.media:not(:has(img,video,iframe)){display:none}
.facts{list-style:none;display:flex;flex-wrap:wrap;gap:8px 28px;margin:28px 0 0;padding:0;color:var(--muted);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase}
.facts li::before{content:"";display:inline-block;width:6px;height:6px;background:var(--accent);margin-right:10px;vertical-align:1px}
.eyebrow .nm{color:var(--text);font-weight:700}
.eyebrow .rl{color:var(--accent)}
.eyebrow .rl::before{content:"\00b7";margin:0 .9em;color:var(--muted)}
.tool-count{color:var(--accent);font-weight:700;font-size:1.3em;margin-right:.15em;display:inline-block;min-width:.6em;text-align:right;vertical-align:-.04em}
.tool-count{margin:0 0 0 .4em;text-align:left}
.facts{align-items:baseline}
.tool-count{line-height:1}
.stair-chips{align-items:flex-start}
.trow{grid-template-columns:44px 1.2fr 1.3fr 1.3fr;gap:32px}
.trow .num{color:var(--accent);font-size:.8rem;letter-spacing:.12em}
.trow p.soon{color:var(--muted);opacity:.7;font-style:italic}
@media(max-width:760px){.trow{grid-template-columns:1fr}.trow .num{font-size:.75rem}}
@media(min-width:900px){
.hero .lede{max-width:52rem;font-size:1.15rem;line-height:1.75}
.facts{max-width:none}
}
.kv div{display:grid;grid-template-columns:130px 1fr;gap:16px;align-items:baseline}
.kv span:last-child{text-align:left}
@media(min-width:900px){#contact{min-height:80vh}}
@media(max-width:640px){nav{display:flex;gap:12px}nav a,nav a:first-child{margin-left:0;font-size:.72rem}}
@media(max-width:640px){.eyebrow{letter-spacing:.25em}.eyebrow .nm{display:block}.eyebrow .rl{display:block;margin-top:6px}.eyebrow .rl::before{display:none}}
nav a.active{color:var(--accent)}
.cform{max-width:640px;margin-top:36px;display:grid;gap:20px}
.cform label{display:block;color:var(--muted);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase}
.cform input,.cform textarea{display:block;width:100%;box-sizing:border-box;margin-top:8px;background:var(--bg2);border:1px solid var(--line);color:var(--text);padding:14px 16px;font:inherit;font-size:.95rem;letter-spacing:0;text-transform:none;border-radius:0;transition:border-color .2s}
.cform input:focus,.cform textarea:focus{outline:0;border-color:var(--accent)}
.cform textarea{resize:vertical;min-height:140px}
.crow{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cform .btn{margin-top:0;justify-self:start;background:none;color:var(--text);cursor:pointer;font-family:inherit}
.cform .btn:disabled{opacity:.5;cursor:default}
.cstatus{margin:0;min-height:1.4em;font-size:.88rem;color:var(--muted)}
.cstatus.ok{color:var(--accent)}.cstatus.err{color:#f0a0a0}
.calt{margin-top:28px}.calt a{color:var(--muted);font-size:.85rem;letter-spacing:.08em}.calt a:hover{color:var(--accent)}
@media(max-width:640px){.crow{grid-template-columns:1fr}}
@media(max-width:760px){.stair{margin-left:calc(var(--i)*14%);padding:14px 10px 14px 14px}.region{padding-right:34px}.region::after{width:26px;letter-spacing:.3em}}
.region::after{transform:rotate(180deg)}