/* Ecosystem Trading public Homepage V1.1 — implementation of the frozen Cloud Design
   (docs/design/homepage-v1.1/). Self-contained: no workspace CSS, no CDN, no inline styles.

   Tiers, from the frozen responsive notes (V1 1g, carried unchanged into V1.1):
     >=1280  desktop composition (2a, 1440 canvas, 64px margins)
     960-1279  margins 40, hero copy single column, H1 60, hero frame 520 re-anchored on the DOM,
               capability sections single column with frames below copy
     640-959   H1 48, layer strips 96, Spot/Futures stack, integrity drops its third column
     <640      the dedicated mobile composition (2b, 390 canvas, 20px margins)
   Screenshots are never scaled below 1:1; narrower frames re-crop instead. */

@font-face{font-family:"Exo 2";src:url("../fonts/exo2-latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("../fonts/jetbrains-mono-latin.woff2") format("woff2");font-weight:100 800;font-style:normal;font-display:swap}

:root{
  color-scheme:dark;
  /* design-system tokens (colors.css, dataviz.css, typography.css) — only those this page uses */
  --brand-cyan:#18B7E8;
  --surface-1:#080B10;--surface-2:#0C1118;--surface-3:#111821;--surface-4:#171F2B;--surface-5:#1E2836;--surface-inverse:#F3F6FA;
  --line-soft:#141B25;--line:#232E3D;--line-strong:#334052;
  --text-strong:#FFFFFF;--text:#ECF1F7;--text-body:#C9D2DE;--text-muted:#8E9BAD;--text-faint:#5E6A7A;--text-disabled:#3F4A58;--text-inverse:#0B1F33;
  --status-caution:#E8B86D;--status-caution-soft:#2A2314;--status-critical:#E2559A;--status-critical-soft:#2A1226;
  --status-synthetic:#8E9BAD;--status-snapshot:#8E9BAD;
  --hover-overlay:rgba(255,255,255,.04);--active-overlay:rgba(255,255,255,.07);
  --control-line:#2A3646;--control-line-hover:#3A4859;
  --mkt-up:#4CC38A;--mkt-down:#EF5F64;--mkt-poc:#E5B567;--mkt-vah-val:#C9D2DE;--mkt-value-area:#12394A;
  --mkt-profile:#334052;--mkt-profile-va:#1C6B87;--mkt-absorption:#E5B567;
  --font-display:"Exo 2",system-ui,sans-serif;--font-ui:"Exo 2",system-ui,sans-serif;--font-body:"Exo 2",system-ui,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --numeric:tabular-nums slashed-zero;
  --radius-xs:2px;--radius-sm:4px;--radius-full:9999px;
  --duration-fast:80ms;--duration-base:160ms;--duration-slow:240ms;--ease:cubic-bezier(.2,0,0,1);
  /* V2 amber operational accent: the design overrides the DS accent tokens on the page root.
     Cyan stays on the brand mark only. */
  --accent:oklch(0.80 0.14 85);--accent-hover:oklch(0.85 0.13 85);--accent-active:oklch(0.74 0.14 85);
  --accent-text:oklch(0.82 0.13 85);--accent-line:oklch(0.46 0.09 85);--accent-alpha-24:oklch(0.80 0.14 85 / .24);
  --text-on-accent:#080B10;
  --focus-ring:0 0 0 2px var(--surface-1),0 0 0 4px var(--accent);
  /* page geometry */
  --m:64px;            /* side margin */
  --sec:128px;         /* section spacing */
  /* inline padding for full-bleed sections: the side margin, centred on a 1440 canvas */
  --gutter:max(var(--m),calc((100% - 1440px) / 2 + var(--m)));
}

html{background:var(--surface-1);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-1);color:var(--text);font:400 13px/1.4 var(--font-ui);font-variant-numeric:var(--numeric);overflow-x:clip}
h1,h2,h3,p,dl,dd,ol,ul,figure{margin:0}
ol,ul{padding:0;list-style:none}
img{display:block}
a{color:var(--text-body);text-decoration:none}
a:hover{color:var(--text)}
::selection{background:var(--accent-alpha-24);color:var(--text-strong)}
:focus-visible{outline:none;box-shadow:var(--focus-ring)}
a:focus-visible,summary:focus-visible{border-radius:var(--radius-sm)}

/* composition variants: .d = desktop/tablet copy and structure, .m = the dedicated mobile composition */
.m,.m-inline-flex{display:none!important}
.d-inline{display:inline}
.d-inline-flex{display:inline-flex}

.skip{position:absolute;left:16px;top:-64px;z-index:10;padding:8px 12px;background:var(--surface-4);color:var(--text);border-radius:var(--radius-sm);font:500 13px/1 var(--font-ui)}
.skip:focus{top:12px}

.t-text{color:var(--text)}.t-faint{color:var(--text-faint)}.t-poc{color:var(--mkt-poc)!important}
.t-up{color:var(--mkt-up)!important}.t-down{color:var(--mkt-down)!important}.t-absorption{color:var(--mkt-absorption)!important}
.t-mono{font-family:var(--font-mono)}

/* ---------- design-system components (from the frozen DS bundle) ---------- */
.et-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid transparent;border-radius:var(--radius-sm);font:500 13px/1 var(--font-ui);cursor:pointer;white-space:nowrap;transition:color var(--duration-fast) var(--ease),background-color var(--duration-fast) var(--ease),border-color var(--duration-fast) var(--ease);user-select:none;box-sizing:border-box;text-decoration:none}
.et-btn:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.et-btn[data-size=sm]{height:28px;padding:0 10px;font-size:12px}
.et-btn[data-size=lg]{height:40px;padding:0 16px;font-size:14px}
.et-btn[data-variant=primary]{background:var(--accent);color:var(--text-on-accent);border-color:var(--accent)}
.et-btn[data-variant=primary]:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:var(--text-on-accent)}
.et-btn[data-variant=primary]:active{background:var(--accent-active);border-color:var(--accent-active)}
.et-btn[data-variant=secondary]{background:var(--surface-3);color:var(--text);border-color:var(--control-line)}
.et-btn[data-variant=secondary]:hover{background:var(--surface-4);border-color:var(--control-line-hover);color:var(--text)}
.et-btn[data-variant=secondary]:active{background:var(--surface-5)}
.et-btn[data-variant=ghost]{background:transparent;color:var(--text-body)}
.et-btn[data-variant=ghost]:hover{background:var(--hover-overlay);color:var(--text)}
.et-btn[data-variant=ghost]:active{background:var(--active-overlay)}
.et-btn[data-block=true]{width:100%}

.et-badge{display:inline-flex;align-items:center;gap:5px;height:18px;padding:0 6px;border-radius:var(--radius-xs);border:1px solid var(--line);background:transparent;color:var(--text-muted);font:500 10px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;font-variant-numeric:var(--numeric)}
.et-badge i{width:6px;height:6px;border-radius:var(--radius-full);background:currentColor;flex:none}
.et-badge[data-tone=caution]{color:var(--status-caution);border-color:color-mix(in srgb,var(--status-caution) 40%,transparent);background:var(--status-caution-soft)}
.et-badge[data-tone=critical]{color:var(--status-critical);border-color:color-mix(in srgb,var(--status-critical) 40%,transparent);background:var(--status-critical-soft)}
.et-badge[data-tone=unavailable]{color:var(--text-faint);border-style:dashed}
.et-badge[data-tone=synthetic]{color:var(--status-synthetic);border-style:dashed;border-color:var(--line-strong)}
.et-badge[data-tone=snapshot]{color:var(--status-snapshot);border-color:var(--line-strong)}

.et-prov{display:inline-flex;align-items:center;gap:0;font:400 10px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);font-variant-numeric:var(--numeric);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;direction:ltr;unicode-bidi:isolate}
.et-prov[data-size=md]{font-size:11px}
.et-prov .et-sep{margin:0 6px;opacity:.6}
.et-prov .et-inst{color:var(--text-muted)}
.et-prov .et-tag{padding:1px 4px;border-radius:var(--radius-xs);margin-inline-start:8px;border:1px solid transparent}
.et-prov .et-tag[data-kind=synthetic]{color:var(--status-synthetic);border-color:var(--line-strong);border-style:dashed}
.et-prov .et-tag[data-kind=snapshot]{color:var(--status-snapshot);border-color:var(--line-strong)}

.et-vp{display:flex;flex-direction:column;gap:0;font:400 10px/1 var(--font-mono);font-variant-numeric:var(--numeric);color:var(--text-muted);min-width:0;direction:ltr;unicode-bidi:isolate}
.et-vp .et-vprow{display:grid;grid-template-columns:1fr;align-items:center;height:var(--vp-row,10px);position:relative}
.et-vp .et-vpbar{height:calc(100% - 2px);background:var(--mkt-profile);border-radius:1px;min-width:1px;position:relative}
.et-vp .et-vprow[data-va=true] .et-vpbar{background:var(--mkt-profile-va)}
.et-vp .et-vprow[data-poc=true] .et-vpbar{background:var(--mkt-poc)}
.et-vp .et-vprow[data-poc=true]::after{content:"POC";position:absolute;right:0;color:var(--mkt-poc);font-size:10px;letter-spacing:.06em}
.et-vp .et-vprow[data-edge=vah]::after{content:"VAH";position:absolute;right:0;color:var(--text-body);letter-spacing:.06em}
.et-vp .et-vprow[data-edge=val]::after{content:"VAL";position:absolute;right:0;color:var(--text-body);letter-spacing:.06em}
.et-vp .et-vprow[data-va=true]{background:rgba(18,57,74,.35)}
.et-vp[data-profile=short]{--vp-row:6px}
.et-vp[data-profile=levels]{--vp-row:12px}
.et-vp[data-profile=tiny]{--vp-row:4px}
/* vp:start — generated by tools/gen_volume_profile.mjs; sample data only */
.et-vp[data-profile=levels] .et-vprow:nth-child(1) .et-vpbar{width:5.4867%}
.et-vp[data-profile=levels] .et-vprow:nth-child(2) .et-vpbar{width:8.7611%}
.et-vp[data-profile=levels] .et-vprow:nth-child(3) .et-vpbar{width:12.3009%}
.et-vp[data-profile=levels] .et-vprow:nth-child(4) .et-vpbar{width:6.9027%}
.et-vp[data-profile=levels] .et-vprow:nth-child(5) .et-vpbar{width:11.6814%}
.et-vp[data-profile=levels] .et-vprow:nth-child(6) .et-vpbar{width:17.6106%}
.et-vp[data-profile=levels] .et-vprow:nth-child(7) .et-vpbar{width:16.0177%}
.et-vp[data-profile=levels] .et-vprow:nth-child(8) .et-vpbar{width:25.9292%}
.et-vp[data-profile=levels] .et-vprow:nth-child(9) .et-vpbar{width:38.4071%}
.et-vp[data-profile=levels] .et-vprow:nth-child(10) .et-vpbar{width:44.0708%}
.et-vp[data-profile=levels] .et-vprow:nth-child(11) .et-vpbar{width:60.531%}
.et-vp[data-profile=levels] .et-vprow:nth-child(12) .et-vpbar{width:77.2566%}
.et-vp[data-profile=levels] .et-vprow:nth-child(13) .et-vpbar{width:82.8319%}
.et-vp[data-profile=levels] .et-vprow:nth-child(14) .et-vpbar{width:93.9823%}
.et-vp[data-profile=levels] .et-vprow:nth-child(15) .et-vpbar{width:100%}
.et-vp[data-profile=levels] .et-vprow:nth-child(16) .et-vpbar{width:90.885%}
.et-vp[data-profile=levels] .et-vprow:nth-child(17) .et-vpbar{width:85.9292%}
.et-vp[data-profile=levels] .et-vprow:nth-child(18) .et-vpbar{width:77.2566%}
.et-vp[data-profile=levels] .et-vprow:nth-child(19) .et-vpbar{width:57.4336%}
.et-vp[data-profile=levels] .et-vprow:nth-child(20) .et-vpbar{width:47.1681%}
.et-vp[data-profile=levels] .et-vprow:nth-child(21) .et-vpbar{width:38.4071%}
.et-vp[data-profile=levels] .et-vprow:nth-child(22) .et-vpbar{width:22.8319%}
.et-vp[data-profile=levels] .et-vprow:nth-child(23) .et-vpbar{width:19.115%}
.et-vp[data-profile=levels] .et-vprow:nth-child(24) .et-vpbar{width:17.6106%}
.et-vp[data-profile=levels] .et-vprow:nth-child(25) .et-vpbar{width:8.5841%}
.et-vp[data-profile=levels] .et-vprow:nth-child(26) .et-vpbar{width:10%}
.et-vp[data-profile=levels] .et-vprow:nth-child(27) .et-vpbar{width:12.3009%}
.et-vp[data-profile=levels] .et-vprow:nth-child(28) .et-vpbar{width:5.6637%}
.et-vp[data-profile=short] .et-vprow:nth-child(1) .et-vpbar{width:5.8447%}
.et-vp[data-profile=short] .et-vprow:nth-child(2) .et-vpbar{width:9.7717%}
.et-vp[data-profile=short] .et-vprow:nth-child(3) .et-vpbar{width:14.7032%}
.et-vp[data-profile=short] .et-vprow:nth-child(4) .et-vpbar{width:11.7808%}
.et-vp[data-profile=short] .et-vprow:nth-child(5) .et-vpbar{width:21.5525%}
.et-vp[data-profile=short] .et-vprow:nth-child(6) .et-vpbar{width:35.2511%}
.et-vp[data-profile=short] .et-vprow:nth-child(7) .et-vpbar{width:43.653%}
.et-vp[data-profile=short] .et-vprow:nth-child(8) .et-vpbar{width:64.6575%}
.et-vp[data-profile=short] .et-vprow:nth-child(9) .et-vpbar{width:85.2968%}
.et-vp[data-profile=short] .et-vprow:nth-child(10) .et-vpbar{width:91.9635%}
.et-vp[data-profile=short] .et-vprow:nth-child(11) .et-vpbar{width:100%}
.et-vp[data-profile=short] .et-vprow:nth-child(12) .et-vpbar{width:98.3562%}
.et-vp[data-profile=short] .et-vprow:nth-child(13) .et-vpbar{width:78.9041%}
.et-vp[data-profile=short] .et-vprow:nth-child(14) .et-vpbar{width:64.6575%}
.et-vp[data-profile=short] .et-vprow:nth-child(15) .et-vpbar{width:50.0457%}
.et-vp[data-profile=short] .et-vprow:nth-child(16) .et-vpbar{width:28.8584%}
.et-vp[data-profile=short] .et-vprow:nth-child(17) .et-vpbar{width:21.5525%}
.et-vp[data-profile=short] .et-vprow:nth-child(18) .et-vpbar{width:18.1735%}
.et-vp[data-profile=short] .et-vprow:nth-child(19) .et-vpbar{width:8.3105%}
.et-vp[data-profile=short] .et-vprow:nth-child(20) .et-vpbar{width:9.7717%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(1) .et-vpbar{width:7.1889%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(2) .et-vpbar{width:14.9309%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(3) .et-vpbar{width:29.5853%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(4) .et-vpbar{width:44.424%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(5) .et-vpbar{width:75.2074%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(6) .et-vpbar{width:100%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(7) .et-vpbar{width:95.8525%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(8) .et-vpbar{width:80.553%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(9) .et-vpbar{width:56.2212%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(10) .et-vpbar{width:26.6359%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(11) .et-vpbar{width:16.5899%}
.et-vp[data-profile=tiny] .et-vprow:nth-child(12) .et-vpbar{width:14.1935%}
/* vp:end */

/* ---------- shared page patterns ---------- */
.eyebrow{font:500 11px/1.2 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
h2{font:700 44px/1.08 var(--font-display);letter-spacing:-.015em;color:var(--text-strong);text-wrap:balance}
h2.nobalance{text-wrap:wrap}
.body{font:400 16px/1.55 var(--font-body);color:var(--text-muted);text-wrap:pretty}
.note{font:400 11px/1.4 var(--font-mono);color:var(--text-faint)}
.card{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface-2)}

.sec{box-sizing:border-box;max-width:1440px;margin:0 auto;padding:var(--sec) var(--m) 0;display:flex;flex-direction:column;gap:48px}
.sec--bleed{max-width:none;padding-left:0;padding-right:0}
.split{display:grid;gap:48px;align-items:end}
.split--7-5{grid-template-columns:7fr 5fr}
.split--5-7{grid-template-columns:5fr 7fr;gap:64px}
.split__head{display:flex;flex-direction:column;gap:16px}

/* screenshot windows: a fixed-height viewport onto a native-resolution production screenshot */
.crop{position:relative;overflow:hidden}
.crop img{position:absolute;max-width:none;height:auto}
.crop--hero{height:720px}
.crop--hero img{left:min(-323px,calc(100% - 1697px));top:-185px}
.crop--l1,.crop--l3,.crop--l4{height:140px}
.crop--l1 img{left:-60px;top:-560px}
.crop--l3 img{left:0;top:-150px}           /* footprint crop origin (0,440): design 0,-590 */
.crop--l4 img{left:0;top:-20px}            /* heatmap crop origin (130,400): design -130,-420 */
.crop--fpwide{height:520px;border-bottom:1px solid var(--line)}
.crop--fpwide img{left:-90px;top:0}        /* design -90,-440 */
.crop--fpmacro{height:280px}
.crop--fpmacro img{left:-625px;top:-330px} /* design -625,-770 */
.crop--prints{height:280px}
.crop--prints img{left:0;top:0}            /* large-prints crop origin (581,641), native 1:1 */
.crop--heat{height:640px}
.crop--heat img{left:min(0px,calc(100% - 1440px));top:0} /* design -130,-400; narrower frames keep the DOM edge */

/* ---------- header ---------- */
.hdr{position:relative;z-index:5;height:64px;display:flex;align-items:center;gap:48px;padding:0 var(--m);border-bottom:1px solid var(--line-soft);background:var(--surface-1)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.brand__mark{height:30px;width:auto}
.brand__word{display:flex;flex-direction:column;gap:4px}
.brand__eco{font:800 16px/1 var(--font-display);letter-spacing:.055em;text-transform:uppercase;color:var(--text-strong)}
.brand__trd{font:700 9px/1 var(--font-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--brand-cyan)}
.hdr__nav{display:flex;gap:32px}
.hdr__nav a,.ftr__nav a{font:500 13px/1 var(--font-ui);color:var(--text-muted);transition:color var(--duration-fast) var(--ease)}
.hdr__nav a:hover,.ftr__nav a:hover{color:var(--text)}
.hdr__fill{flex:1}
.hdr__end{display:flex;align-items:center;gap:20px}
.hdr__alpha{font:500 11px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.menu{display:none}

/* ---------- hero ---------- */
.hero{box-sizing:border-box;max-width:1440px;margin:0 auto;padding:56px 32px 0;display:flex;flex-direction:column;gap:40px}
.hero__copy{display:grid;grid-template-columns:8fr 4fr;gap:48px;align-items:end;padding:0 32px}
.hero__title{display:flex;flex-direction:column;gap:18px}
h1{font:800 72px/1 var(--font-display);letter-spacing:-.022em;color:var(--text-strong);text-wrap:balance;max-width:820px}
.hero__lead{display:flex;flex-direction:column;gap:22px;padding-bottom:4px}
.lead{font:400 17px/1.5 var(--font-body);color:var(--text-body);text-wrap:pretty}
.hero__cta{display:flex;gap:10px}
.hero__frame{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface-2)}
.panelhead{height:36px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 16px;border-bottom:1px solid var(--line);background:var(--surface-3)}
.panelhead__meta{display:flex;gap:20px;min-width:0;overflow:hidden;white-space:nowrap;font:500 11px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}

/* ---------- 01 four layers ---------- */
.ledgerbox{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface-2)}
.ledger__row{display:grid;grid-template-columns:280px 1fr;border-bottom:1px solid var(--line)}
.ledger__row:last-child{border-bottom:0}
.ledger__label{padding:24px;display:flex;flex-direction:column;gap:8px;border-right:1px solid var(--line)}
.ledger__label h3{font:500 13px/1.2 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text)}
.ledger__label p{font:400 13px/1.5 var(--font-ui);color:var(--text-muted)}
.ledger__tag{margin-top:auto;font:500 10px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}
.ledger__value{height:140px;display:flex;align-items:center;gap:40px;padding:0 24px;overflow:hidden}
.ledger__vp.d{flex:0 1 520px;min-width:0}  /* 520 at 1440; yields before the sample-data badge is clipped */
.ledger__stats{display:flex;gap:32px}
.ledger__stats dt{font:500 10px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}
.ledger__stats dd{font:500 16px/1.2 var(--font-mono);color:var(--text);margin-top:6px}
.ledger__fill{flex:1}
.ledger__foot{padding:10px 24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;font:500 10px/1.3 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint)}

/* ---------- 02 value ---------- */
.value{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:start}
.value__copy{display:flex;flex-direction:column;gap:20px}
.value h2{font-size:40px;line-height:1.1}
.stats{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line)}
.stats>div{padding:20px 24px;border-right:1px solid var(--line-soft)}
.stats>div:last-child{border-right:0}
.stats dt{font:500 10px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}
.stats dd{font:500 32px/1.1 var(--font-mono);font-variant-numeric:var(--numeric);color:var(--text);margin-top:10px}
.value__chart{padding:32px 24px;display:flex;gap:40px;align-items:flex-start}
.value__levels{flex:1;min-width:0;height:336px;position:relative}
.lv{position:absolute;left:0;right:0}
.lv--band{top:96px;height:160px;background:var(--mkt-value-area);opacity:.35}
.lv--vah{top:96px;border-top:1px dashed var(--mkt-vah-val)}
.lv--poc{top:168px;border-top:1px solid var(--mkt-poc)}
.lv--val{top:256px;border-top:1px dashed var(--mkt-vah-val)}
.lvl{position:absolute;left:0;font:500 10px/1 var(--font-mono);letter-spacing:.06em;color:var(--mkt-vah-val)}
.lvl--vah{top:78px}.lvl--poc{top:152px;color:var(--mkt-poc)}.lvl--val{top:262px}
.lvl--area{left:auto;right:0;top:176px;line-height:1.6;text-transform:uppercase;color:var(--text-faint);text-align:right}
.value__vp{width:280px;flex:none}
.capline{display:flex;justify-content:space-between;align-items:center;gap:8px}
.capline--card{padding:10px 24px;border-top:1px solid var(--line)}
.capline__note{font:500 10px/1.3 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint);white-space:nowrap}

/* ---------- 03 executed flow ---------- */
.flow{gap:40px}
.flow__head{padding:0 var(--gutter)}
.flow h2{font-size:40px;line-height:1.1}
.flow__lead{max-width:600px}
.band{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface-2)}
.band__inner{max-width:1440px;margin:0 auto}
.strip{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;background:var(--line)}
.strip__cell{background:var(--surface-2);display:flex;flex-direction:column;min-width:0}
.strip__head{padding:10px 24px;display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line-soft);font:500 11px/1.2 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.readcell{padding:8px 24px;display:flex;flex-direction:column;flex:1}
.readcell>div{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line-soft);font:500 12px/1.4 var(--font-mono)}
.readcell>div:last-child{border-bottom:0}
.readcell dd{color:var(--text-muted)}
.band__foot{padding:10px var(--gutter);border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:16px}

/* ---------- 04 resting liquidity ---------- */
.rest{gap:48px}
.rest__head{padding:0 var(--gutter);display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px}
.rest__head h2{max-width:760px}
.rest__head .body{max-width:640px}
.legend{display:flex;gap:24px;font:500 11px/1.2 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);white-space:nowrap}
.notes{padding:0 var(--gutter);display:grid;grid-template-columns:repeat(3,1fr);gap:48px}
.notes>div{display:flex;flex-direction:column;gap:10px;padding-top:20px;border-top:1px solid var(--line)}
.notes h3{font:500 12px/1.2 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text)}
.notes p{font:400 14px/1.55 var(--font-ui);color:var(--text-muted)}

/* ---------- 05 markets ---------- */
.mkt__inst{display:flex;align-items:center;justify-content:center;gap:20px;padding:28px 24px;border-bottom:1px solid var(--line)}
.mkt__sym{font:600 40px/1 var(--font-mono);letter-spacing:.02em;color:var(--text-strong)}
.mkt__sub{font:500 11px/1.2 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}
.mkt__venues{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}
.venue{background:var(--surface-2);padding:24px;display:flex;flex-direction:column;min-width:0}
.venue__head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.venue__head h3{font:600 18px/1.2 var(--font-ui);color:var(--text-strong)}
.venue__rows>div{display:grid;grid-template-columns:160px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line-soft);font:400 13px/1.5 var(--font-ui)}
.venue__rows>div:last-child{border-bottom:0}
.venue__rows dt{font:500 10px/1.5 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}
.venue__rows dd{color:var(--text-body)}
.venue__rows .venue__cont{align-items:center}
.venue__cont dd{display:flex;align-items:center;gap:10px}
.venue__why{color:var(--text-muted)}
.universe--in{border-top:1px solid var(--line);padding:24px;display:flex;flex-direction:column;gap:16px}
.universe__head{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.universe__head h3{font:500 11px/1.2 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.universe__head span{font:500 11px/1.2 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint)}
.universe__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line-soft);border:1px solid var(--line-soft)}
.universe__grid li{background:var(--surface-2);padding:20px 24px;display:flex;flex-direction:column;gap:10px;min-width:0}
.universe__sym{font:500 36px/1 var(--font-mono);letter-spacing:-.01em;color:var(--text)}
.universe__ven{font:500 10px/1.4 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint)}
.universe--in>p{font:400 13px/1.5 var(--font-ui);color:var(--text-muted)}

/* ---------- 06 data integrity ---------- */
.integrity{margin-top:var(--sec);background:var(--surface-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.integrity__inner{max-width:1312px;margin:0 auto;padding:96px var(--m);display:grid;grid-template-columns:5fr 7fr;gap:64px}
.integrity__copy{display:flex;flex-direction:column;gap:20px}
.integrity h2{font-size:40px;line-height:1.1}
.principles{display:flex;flex-direction:column;margin-top:8px;border-top:1px solid var(--line)}
.principles li{padding:12px 0;border-bottom:1px solid var(--line);font:500 15px/1.3 var(--font-ui);color:var(--text)}
.trust{border:1px solid var(--line);border-radius:10px;background:var(--surface-3);overflow:hidden}
.trust__head{height:32px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid var(--line);font:500 11px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-faint)}
.trust__head h3{font:inherit;color:var(--text-muted)}
.trust__rows>div{display:grid;grid-template-columns:200px 1fr 1fr;gap:16px;padding:20px 16px;border-bottom:1px solid var(--line-soft);align-items:start}
.trust__rows>div:last-child{border-bottom:0}
.trust__rows dt{display:grid}
.trust__rows dd{font:400 14px/1.5 var(--font-ui);color:var(--text-body)}
.trust__rows dd.trust__then{font-size:13px;color:var(--text-muted)}

/* ---------- private alpha ---------- */
.alpha__card{border:1px solid var(--line);border-radius:16px;background:var(--surface-2);display:grid;grid-template-columns:7fr 5fr;gap:1px;overflow:hidden}
.alpha__main{padding:56px;display:flex;flex-direction:column;align-items:flex-start;gap:22px;border-right:1px solid var(--line)}
.alpha h2{font:800 56px/1.02 var(--font-display);letter-spacing:-.022em}
.alpha__main p{font:400 17px/1.55 var(--font-body);color:var(--text-muted);max-width:560px;text-wrap:pretty}
.alpha__side{padding:56px 48px;display:flex;flex-direction:column;justify-content:space-between;gap:32px}
.access{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.access>div{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line-soft)}
.access>div:last-child{border-bottom-color:var(--line)}
.access dt{font:500 10px/1.6 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}
.access dd{font:500 14px/1.5 var(--font-ui);color:var(--text)}
.access dd.t-mono{font-family:var(--font-mono)}
.alpha__cta{display:flex;flex-direction:column;gap:10px}
.alpha__note{font:400 12px/1.5 var(--font-ui);color:var(--text-faint);text-align:center}

/* ---------- footer ---------- */
.ftr{max-width:1440px;margin:96px auto 0;box-sizing:border-box;padding:40px var(--m) 48px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:28px}
.ftr__top{display:flex;justify-content:space-between;align-items:center;gap:24px}
.brand--ftr .brand__mark{height:26px}
.brand--ftr .brand__eco{font-size:14px}
.brand--ftr .brand__trd{font-size:8px}
.ftr__nav{display:flex;gap:28px;align-items:center}
.ftr__nav .ftr__app{color:var(--text)}
.ftr__bottom{display:flex;justify-content:space-between;gap:48px;align-items:flex-end}
.ftr__bottom p{font:400 12px/1.6 var(--font-ui);color:var(--text-faint);max-width:640px}
.ftr__copy{font:400 12px/1 var(--font-mono);color:var(--text-faint);white-space:nowrap}

/* ---------- motion (V1 1g motion notes) ---------- */
@keyframes hp-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:no-preference){
  .hero__frame{animation:hp-fade var(--duration-slow) var(--ease) var(--duration-base) both}
  .js [data-reveal]{opacity:0;transform:translateY(4px);transition:opacity var(--duration-slow) var(--ease),transform var(--duration-slow) var(--ease)}
  .js [data-reveal].is-in{opacity:1;transform:none}
  .js [data-stagger]>*{opacity:0;transition:opacity var(--duration-base) var(--ease)}
  .js .is-in [data-stagger]>*{opacity:1}
  .js .is-in [data-stagger]>:nth-child(2){transition-delay:60ms}
  .js .is-in [data-stagger]>:nth-child(3){transition-delay:120ms}
  .js .is-in [data-stagger]>:nth-child(4){transition-delay:180ms}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* =================== 960-1279 =================== */
@media (max-width:1279px){
  :root{--m:40px;--sec:96px}
  .hdr{height:60px;gap:28px}
  .hdr__nav{gap:20px}
  .brand{gap:10px}
  .brand__mark{height:28px}
  .brand__word{gap:3px}
  .brand__eco{font-size:15px}
  .brand__trd{font-size:8px}
  .hero{padding:56px var(--m) 0;gap:36px}
  .hero__copy{grid-template-columns:1fr;gap:18px;padding:0;max-width:720px}
  h1{font-size:60px;line-height:1.02;letter-spacing:-.02em}
  .hero__lead{gap:22px;padding-bottom:0}
  .lead{max-width:560px;line-height:1.55}
  .crop--hero{height:520px}
  .crop--hero img{top:-380px}
  .split--7-5,.split--5-7{grid-template-columns:1fr;gap:18px;align-items:start}
  .split .body{max-width:720px}
  .value{grid-template-columns:1fr;gap:32px}
  .value__copy{max-width:720px}
  .integrity__inner{grid-template-columns:1fr;gap:40px;padding:80px var(--m)}
  .integrity__copy{max-width:720px}
  .alpha__main{padding:40px}
  .alpha__side{padding:40px}
  .ledger__value{gap:24px}
  .notes{gap:32px}
  .readcell>div{grid-template-columns:100px 1fr}
  .venue__rows>div{grid-template-columns:120px 1fr}
  .venue__cont dd{flex-wrap:wrap;row-gap:6px}
}

/* =================== 640-959 =================== */
@media (max-width:959px){
  .hdr__alpha{display:none}
  .panelhead__meta span:nth-child(3){display:none}  /* no mid-word truncation beside the provenance badge */
  h1{font-size:48px;line-height:1.02}
  .ledger__row{grid-template-columns:200px 1fr}
  .crop--l1,.crop--l3,.crop--l4,.ledger__value{height:96px}
  .ledger__label{padding:16px 20px}
  .ledger__label p{display:none}
  .ledger__stats{display:none}
  .et-vp[data-profile=short]{--vp-row:4px}
  .strip{grid-template-columns:1fr 1fr}
  .strip__cell--read{grid-column:1/-1}
  .band__foot{flex-wrap:wrap}
  .band__foot .et-prov{white-space:normal;flex-wrap:wrap;row-gap:4px}
  .crop--heat{height:480px}
  .crop--heat img{top:-120px}
  .notes{grid-template-columns:1fr;gap:24px}
  .mkt__venues{grid-template-columns:1fr}
  .universe__sym{font-size:28px}
  .universe__grid li{padding:16px}
  .universe__head{flex-direction:column;gap:6px}
  .trust__rows>div{grid-template-columns:180px 1fr;row-gap:6px}
  .trust__rows dd.trust__then{grid-column:2}
  .alpha__card{grid-template-columns:1fr}
  .alpha__main{border-right:0;border-bottom:1px solid var(--line)}
  .alpha h2{font-size:44px}
  .ftr__bottom{flex-direction:column;align-items:flex-start;gap:20px}
}

/* =================== <640: the dedicated mobile composition (2b) =================== */
@media (max-width:639px){
  :root{--m:20px;--sec:64px}
  .d,.d-inline,.d-inline-flex{display:none!important}
  .m{display:revert!important}
  span.m,.m-inline-flex{display:inline-flex!important}
  .body{font-size:14px;line-height:1.5}
  h2{font-size:28px;line-height:1.1;letter-spacing:-.01em}
  h2:not(.markets h2):not(.integrity h2){text-wrap:wrap}  /* the mobile design balances only these two */
  .eyebrow{font-size:10px;line-height:1.3}

  .hdr{height:56px;gap:12px;padding:0 16px}
  .hdr__nav{display:none}
  .brand{gap:12px}
  .brand__mark{height:26px}
  .brand__eco{font-size:14px}
  .hdr__end{gap:12px}
  .menu{display:block}
  .menu__btn{width:44px;height:44px;margin-right:-10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;list-style:none}
  .menu__btn::-webkit-details-marker{display:none}
  .menu__btn span{width:18px;height:1.5px;background:var(--text)}
  .menu__panel{position:absolute;left:0;right:0;top:57px;display:flex;flex-direction:column;padding:4px 20px 12px;background:var(--surface-1);border-bottom:1px solid var(--line)}
  .menu__panel a{padding:14px 0;border-bottom:1px solid var(--line-soft);font:500 15px/1.2 var(--font-ui);color:var(--text-body)}
  .menu__panel a:last-child{border-bottom:0}

  .hero{padding:36px 0 0;gap:28px}
  .hero__copy{padding:0 20px;gap:16px;max-width:none}
  .hero__title{gap:16px}
  h1{font-size:42px;line-height:1;letter-spacing:-.022em}
  .hero__lead{gap:20px}
  .lead{font-size:16px;line-height:1.5}
  .hero__cta{gap:8px}
  .hero__cta .et-btn{flex:1}
  .hero__signin[data-variant=ghost]{background:var(--surface-3);color:var(--text);border-color:var(--control-line)}
  .hero__signin[data-variant=ghost]:hover{background:var(--surface-4);border-color:var(--control-line-hover)}
  .hero__dom{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface-2)}
  .panelhead--m{height:32px;font:500 10px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
  .crop--mdom{height:400px}
  .crop--mdom img{width:2020px;left:calc(50% - 1867px);top:-96px} /* design: 2020px wide, -1672px -96px at 390 */
  .capline{padding:8px 16px;border-top:1px solid var(--line)}

  .sec{gap:16px}
  .split{gap:16px}
  .split__head{gap:16px}
  .layers,.layers .split,.layers .split__head{gap:18px}
  .ledgerbox{border-radius:6px}
  .ledger__row{grid-template-columns:120px 1fr}
  .ledger__label{padding:12px}
  .ledger__label h3{font-size:11px;line-height:1.3}
  .crop--l1,.crop--l3,.crop--l4{height:64px}
  .crop--l1 img{left:-640px;top:-800px}
  .crop--l3 img{left:-630px;top:-320px}   /* design -630,-760 */
  .crop--l4 img{left:-270px;top:-300px}   /* design -400,-700 */
  .ledger__value{height:64px;padding:8px 12px;display:block}  /* content-box, as the design: an 80px strip */
  .ledger__vp.m{display:block!important;width:100%}
  .ledger__mfoot{font:400 10px/1.4 var(--font-mono);color:var(--text-faint)}

  .value{gap:16px}
  .value__copy{gap:16px}
  .value h2,.flow h2,.integrity h2{font-size:28px;line-height:1.1}
  .stats>div{padding:14px 16px}
  .stats dd{font-size:17px;line-height:1.1;margin-top:8px}
  .value__chart{padding:16px;gap:16px;align-items:center}
  .value__levels{height:196px}
  .lv--band{top:56px;height:92px}
  .lv--vah{top:56px}.lv--poc{top:98px}.lv--val{top:148px}
  .lvl{font-size:9px}
  .lvl--vah{top:40px}.lvl--poc{top:84px}.lvl--val{top:154px}
  .value__vp{width:150px}
  .et-vp[data-profile=levels]{--vp-row:7px}
  .capline--card{padding:8px 16px}

  .flow,.rest{gap:16px}
  .flow__head{gap:16px}
  .mfig{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--surface-2)}
  .panelhead--flat{padding:0 20px;background:none}
  .crop--mfp{height:360px}
  .crop--mfp img{left:-622px;top:-292px}  /* design -622,-732: native 1:1, two bars */
  .mlegend{padding:8px 20px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:6px 14px;font:500 10px/1.3 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
  .mprov{padding:0 20px}

  .rest__head{align-items:stretch;text-align:left;gap:16px}
  .crop--mheat{height:300px;display:block!important}
  .crop--mheat img{left:-390px;top:-320px} /* design -520,-720 */
  .rest .band__foot{padding:8px 20px;flex-wrap:nowrap}

  .mkt{border-radius:10px}
  .mkt__inst{justify-content:space-between;align-items:baseline;padding:16px}
  .mkt__sym{font-size:24px;letter-spacing:0}
  .mkt__sub{font-size:10px;line-height:1.3;letter-spacing:.06em}
  .mkt__venues{grid-template-columns:1fr}
  .venue{padding:16px;gap:10px}
  .venue__head{padding-bottom:0;border-bottom:0}
  .venue__head h3{font-size:15px}
  .venue__own{font:400 13px/1.5 var(--font-ui);color:var(--text-muted)}
  .venue__mcont{display:flex!important;align-items:center;gap:8px}
  .venue__mlabel{font:500 10px/1.5 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}
  .universe--out{display:flex!important;flex-direction:column;gap:10px;margin-top:8px}
  .universe__mhead{font:500 10px/1.3 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
  .universe__grid li{background:var(--surface-1);padding:12px 8px;gap:6px;align-items:center}
  .universe__sym{font-size:16px;letter-spacing:0}
  .universe__ven{font-size:8px;line-height:1.3;letter-spacing:.04em}

  .integrity{margin-top:64px}
  .integrity__inner{padding:48px 20px;gap:16px}
  .integrity__copy{gap:16px}
  .trust{border:0;border-radius:0;background:none;border-top:1px solid var(--line);margin-top:4px;overflow:visible}
  .trust__rows>div{grid-template-columns:150px 1fr;gap:12px;padding:14px 0}
  .trust__rows>div:last-child{border-bottom:1px solid var(--line)}
  .trust__rows dd{font-size:13px}

  .alpha__card{border-radius:10px;display:block;padding:28px 20px}
  .alpha__main{padding:0;border:0;gap:16px;align-items:stretch}
  .alpha__main .et-badge{align-self:flex-start}
  .alpha h2{font-size:34px;line-height:1.05;letter-spacing:-.02em}
  .alpha__main p{font-size:14px;line-height:1.5}
  .alpha__side{padding:0;margin-top:16px;gap:16px}
  .access>div{grid-template-columns:90px 1fr;gap:12px;padding:10px 0}
  .access dt{font-size:9px}
  .access dd{font-size:13px}
  .access dd.t-mono{font-size:12px}
  .alpha__cta{gap:8px;margin-top:4px}

  .ftr{margin-top:56px;padding:28px 20px 32px;gap:18px}
  .brand--ftr{gap:10px}
  .brand--ftr .brand__mark{height:22px}
  .brand--ftr .brand__word{gap:3px}
  .brand--ftr .brand__eco{font-size:12px}
  .brand--ftr .brand__trd{font-size:7px}
  .ftr__bottom{gap:18px}
  .ftr__bottom p{font-size:11px;line-height:1.55}
  .ftr__copy{font-size:11px}
}