:root{
  --surface:#FFFFFF; --raised:#F5F6F3; --line:#D9DDD9; --ink:#111816; --muted:#56625D;
  --brand:#1F5C45; --on-brand:#FFFFFF; --soft:#DCEAE2; --gold:#C9A227; --gold-ink:#80600A; --capital:#56625D; --risk:#A63D2A;
  --sans:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --surface:#0E1412; --raised:#16201C; --line:#2A3531; --ink:#EEF2EF; --muted:#9AA8A2;
    --brand:#5FB38E; --on-brand:#0E1412; --soft:#1C3A2E; --gold:#E0B84A; --gold-ink:#E0B84A; --capital:#9AA8A2; --risk:#E38A76;
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --surface:#0E1412; --raised:#16201C; --line:#2A3531; --ink:#EEF2EF; --muted:#9AA8A2;
  --brand:#5FB38E; --on-brand:#0E1412; --soft:#1C3A2E; --gold:#E0B84A; --gold-ink:#E0B84A; --capital:#9AA8A2; --risk:#E38A76;
  color-scheme: dark;
}
*{box-sizing:border-box}
body{background:var(--surface); color:var(--ink); font-family:var(--sans); font-size:17px; line-height:1.55; padding-inline:clamp(16px,4vw,48px); -webkit-font-smoothing:antialiased}
.wrap{max-width:1160px; margin-inline:auto}
a{color:var(--brand)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--brand); outline-offset:3px}
h1,h2,h3{margin:0; font-weight:600; text-wrap:balance; letter-spacing:-.01em}
p{margin:0}
.eyebrow{font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--brand)}
.mono{font-family:var(--mono); font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}

/* header */
header.top{position:sticky; top:env(safe-area-inset-top,0px); z-index:5; background:var(--surface); border-bottom:1px solid var(--line)}
header.top .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; padding-block:14px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--ink)}
.brand svg{width:28px; height:28px; flex:none}
.brand b{font-weight:600; letter-spacing:.06em; font-size:15px}
.brand span{display:block; font-size:9.5px; letter-spacing:.42em; color:var(--muted); margin-top:-2px}
nav{display:flex; gap:22px; font-size:14px}
nav a{color:var(--muted); text-decoration:none}
nav a:hover{color:var(--ink)}
.btn{display:inline-flex; align-items:center; gap:8px; background:var(--brand); color:var(--on-brand); text-decoration:none; font-weight:600; font-size:14px; padding:10px 16px; border-radius:4px; border:0; cursor:pointer}
@media (max-width:760px){ nav a:not(.keep){display:none} nav{gap:0} }

section{padding-block:clamp(56px,8vw,96px); border-bottom:1px solid var(--line)}
section:last-of-type{border-bottom:0}
.sec-head{display:grid; gap:12px; max-width:760px; margin-bottom:36px}
.sec-head h2{font-size:clamp(28px,3.6vw,40px); line-height:1.12}
.sec-head p{color:var(--muted); max-width:64ch}

/* hero */
.hero{padding-block:clamp(40px,6vw,72px) clamp(48px,6vw,80px)}
.hero-grid{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(24px,4vw,56px); align-items:start}
@media (max-width:900px){ .hero-grid{grid-template-columns:1fr} }
.hero h1{font-size:clamp(36px,5.2vw,62px); line-height:1.04; margin-top:14px}
.hero .lede{font-size:19px; color:var(--muted); margin-top:20px; max-width:44ch}
.hero .cta{display:flex; gap:12px; flex-wrap:wrap; margin-top:28px; align-items:center}
.ghost{color:var(--ink); background:transparent; border:1px solid var(--line)}

.model{background:var(--raised); border-radius:4px; padding:clamp(16px,2.4vw,28px)}
.model-top{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; align-items:baseline}
.model-top h3{font-size:15px}
.legend{display:flex; gap:16px; font-size:13px; color:var(--muted); flex-wrap:wrap}
.legend i{display:inline-block; width:18px; height:4px; border-radius:2px; vertical-align:middle; margin-right:6px}
.chart{width:100%; height:auto; display:block; margin-top:12px}
.chart text{font-family:var(--mono); font-size:11px; fill:var(--muted)}
.chart .ph{font-family:var(--sans); font-weight:600}
.chart .gap-label{font-family:var(--sans); font-weight:600; font-size:15px; fill:var(--brand)}
.stats{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--line); margin-top:16px; border:1px solid var(--line)}
.stats div{background:var(--raised); padding:12px 14px}
.stats small{display:block; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.stats b{font-family:var(--mono); font-weight:500; font-size:clamp(18px,2.2vw,24px); font-variant-numeric:tabular-nums}
.stats .hi b{color:var(--brand)}
.stats .gold b{color:var(--gold-ink)}
@media (max-width:560px){ .stats{grid-template-columns:repeat(2,minmax(0,1fr))} }
.controls{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:18px}
@media (max-width:560px){ .controls{grid-template-columns:1fr} }
.controls label{display:flex; justify-content:space-between; font-size:13px; color:var(--muted); gap:8px}
.controls output{font-family:var(--mono); color:var(--ink)}
input[type=range]{width:100%; accent-color:var(--brand); margin-top:6px}
.fine{font-size:12.5px; color:var(--muted); margin-top:14px; max-width:80ch}

/* market figures */
.figs{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
@media (max-width:760px){ .figs{grid-template-columns:1fr} }
.fig{border-top:2px solid var(--ink); padding-top:16px; display:grid; gap:8px; align-content:start}
.fig.us{border-top-color:var(--brand)}
.fig small{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:600}
.fig b{font-family:var(--mono); font-weight:500; font-size:clamp(40px,5vw,56px); line-height:1}
.fig.us b{color:var(--brand)}
.fig p{color:var(--muted); font-size:15px}

/* offer */
.offer{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 48px}
@media (max-width:760px){ .offer{grid-template-columns:1fr} }
.offer h3{font-size:19px; margin-bottom:6px}
.offer p{color:var(--muted)}

/* process */
.phases{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; border:1px solid var(--line); border-radius:4px; overflow:hidden}
@media (max-width:960px){ .phases{grid-template-columns:1fr} }
.phase{padding:20px; display:flex; flex-direction:column; gap:10px; border-right:1px solid var(--line)}
.phase:last-child{border-right:0}
@media (max-width:960px){ .phase{border-right:0; border-bottom:1px solid var(--line)} .phase:last-child{border-bottom:0} }
.phase.wait{background:var(--soft)}
.exits{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
@media (max-width:900px){ .exits{grid-template-columns:1fr} }
.exit{border:1px solid var(--line); border-radius:4px; padding:24px; display:grid; gap:10px; align-content:start}
.exit.pick{border-color:var(--brand); background:var(--soft)}
.exit .when{font-family:var(--mono); font-size:13px; color:var(--gold-ink)}
.exit h3{font-size:21px}
.exit .px{font-family:var(--mono); font-size:26px; color:var(--brand); font-weight:500}
.exit p{color:var(--muted); font-size:15px}
.exit dl{display:grid; grid-template-columns:1fr auto; gap:6px 16px; margin:6px 0 0; font-size:14.5px; border-top:1px solid var(--line); padding-top:12px}
.exit dt{color:var(--muted)}
.exit dd{margin:0; font-family:var(--mono); text-align:right}
.phase .n{font-family:var(--mono); color:var(--brand); font-size:13px}
.phase h3{font-size:20px}
.phase .mo{font-family:var(--mono); font-size:13px; color:var(--gold-ink)}
.phase ol{list-style:none; margin:4px 0 0; padding:0; display:grid; gap:6px; font-size:15px}
.phase ol span{font-family:var(--mono); color:var(--muted); margin-right:8px; font-size:12px}
.phase .gate{margin-top:auto; padding-top:12px; border-top:1px solid var(--line); font-size:13.5px; color:var(--brand); font-weight:500}
.caps{display:flex; gap:6px; margin-top:4px}
.caps i{width:10px; height:18px; border-radius:5px; border:2px solid var(--brand)}
.caps i.on{background:var(--brand)}
.note{margin-top:18px; color:var(--muted); font-size:15px}

/* tables */
.tbl{overflow-x:auto; border:1px solid var(--line); border-radius:4px}
table{border-collapse:collapse; width:100%; min-width:720px; font-size:15px}
th,td{text-align:left; padding:12px 16px; border-bottom:1px solid var(--line); vertical-align:top}
th{font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); font-weight:600; background:var(--raised)}
td.num,th.num{text-align:right; font-family:var(--mono); font-variant-numeric:tabular-nums}
tr.total td{background:var(--soft); font-weight:600; border-bottom:0}

/* projects */
.projects{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px}
@media (max-width:820px){ .projects{grid-template-columns:1fr} }
.proj{border:1px solid var(--line); border-radius:4px; padding:24px; display:grid; gap:18px; align-content:start}
.proj-head{display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap}
.proj-head h3{font-size:22px}
.proj-head .mw{font-family:var(--mono); font-size:34px; color:var(--brand); font-weight:500}
.proj dl{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 20px; margin:0; font-size:15px}
.proj dt{color:var(--muted)}
.proj dd{margin:0; text-align:right; font-family:var(--mono); font-variant-numeric:tabular-nums}
.proj dd.txt{font-family:var(--sans)}
.stage{display:flex; align-items:center; gap:12px; font-size:13px; color:var(--muted); flex-wrap:wrap}
.stage .caps i{width:9px; height:16px}

/* structure */
.tree{display:grid; gap:14px}
.tier{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
@media (max-width:760px){ .tier{grid-template-columns:1fr} }
.node{border:1px solid var(--line); background:var(--raised); border-radius:4px; padding:14px 16px}
.node b{display:block; font-size:16px}
.node span{font-size:13.5px; color:var(--muted)}
.node.gp{background:var(--brand); border-color:var(--brand)}
.node.gp b,.node.gp span{color:var(--on-brand)}
.node.spv{background:var(--soft); border-color:var(--brand)}
.link{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; font-size:12.5px; color:var(--muted); font-family:var(--mono)}
.link div{text-align:center; position:relative; padding-block:4px}
.link div::before{content:""; display:block; width:2px; height:18px; background:var(--line); margin:0 auto 4px}
@media (max-width:760px){ .link{grid-template-columns:1fr} .link div:empty{display:none} }
.two{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:48px; margin-top:48px}
@media (max-width:860px){ .two{grid-template-columns:1fr} }
.terms{display:grid; grid-template-columns:auto 1fr; gap:10px 24px; font-size:15px; margin:12px 0 0}
.terms dt{color:var(--muted)}
.terms dd{margin:0}
.fall{list-style:none; padding:0; margin:12px 0 0; display:grid; gap:14px}
.fall li{display:grid; grid-template-columns:34px 1fr; gap:12px; align-items:start}
.fall .k{font-family:var(--mono); background:var(--brand); color:var(--on-brand); border-radius:999px; text-align:center; font-size:13px; padding:2px 0}
.fall p{color:var(--muted); font-size:14.5px}
.ex{background:var(--soft); padding:16px 18px; border-radius:4px; margin-top:18px; font-family:var(--mono); font-size:14px; display:grid; gap:4px}
.ex strong{font-family:var(--sans); color:var(--brand); font-size:13px}

/* risks */
.risks{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; border-top:1px solid var(--line)}
@media (max-width:860px){ .risks{grid-template-columns:1fr} }
.risk{padding:18px 18px 18px 0; border-bottom:1px solid var(--line); display:grid; gap:6px}
.risk h3{font-size:16px}
.risk p{color:var(--muted); font-size:14.5px}

/* decide */
.decide{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
@media (max-width:820px){ .decide{grid-template-columns:1fr} }
.opt{border:1px solid var(--line); border-radius:4px; padding:22px; display:grid; gap:8px; align-content:start}
.opt.pick{border-color:var(--brand); background:var(--soft)}
.opt b{font-family:var(--mono); font-size:28px; font-weight:500; color:var(--brand)}
.opt p{color:var(--muted); font-size:15px}
.steps{display:flex; flex-wrap:wrap; gap:10px 28px; margin-top:28px; font-weight:500}
.steps span{font-family:var(--mono); color:var(--brand); margin-right:8px}
.contact{margin-top:32px; display:flex; flex-wrap:wrap; gap:14px 28px; align-items:center}
footer{padding-block:28px; font-size:12.5px; color:var(--muted); border-top:1px solid var(--line)}
footer .wrap{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap}
@media (prefers-reduced-motion: reduce){ *{transition:none!important} }

html,body{margin:0}
nav a.on{color:var(--ink)}