/* Meridian — shared design system. "Vault at night": ink-black, brass accent, serif display. */
:root{
  --ground:#0A0C0F; --surface:#12161C; --surface2:#171C24;
  --ink:#E8EAED; --muted:#7C8896; --faint:#4A535E;
  --brass:#C9A54E; --brass-dim:#8A7433; --brass-lo:#5f5227; --pos:#3DDC84; --neg:#E5674F;
  --line:#20262F; --line2:#2A3038;
  --serif:'Fraunces', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  --sans:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --maxw:840px;
}
:root[data-theme="light"]{
  --ground:#F5F3EE; --surface:#FFFFFF; --surface2:#FAF8F3;
  --ink:#161A20; --muted:#5A6470; --faint:#96A0AC;
  --brass:#9A7C2E; --brass-dim:#B99A48; --brass-lo:#D8C79A;
  --line:#E4E0D6; --line2:#D6D1C4;
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --ground:#F5F3EE; --surface:#FFFFFF; --surface2:#FAF8F3;
    --ink:#161A20; --muted:#5A6470; --faint:#96A0AC;
    --brass:#9A7C2E; --brass-dim:#B99A48; --brass-lo:#D8C79A;
    --line:#E4E0D6; --line2:#D6D1C4;
  }
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--ground); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  background-image:radial-gradient(ellipse 90% 50% at 50% -6%, rgba(201,165,78,.06), transparent 68%);
  min-height:100vh;
}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 28px}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}

/* ---- shared type primitives ---- */
.eyebrow{font-family:var(--mono); font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--brass); font-weight:500}
.serif-it{font-family:var(--serif); font-style:italic; color:var(--brass)}
.mono{font-family:var(--mono); font-variant-numeric:tabular-nums}
h1,h2,h3{text-wrap:balance}

/* ---- top nav ---- */
.nav{display:flex; align-items:center; justify-content:space-between; padding:22px 0; gap:20px}
.brand{display:flex; align-items:center; gap:11px; font-family:var(--serif); font-weight:600; font-size:20px; letter-spacing:.02em}
.brand img{width:32px; height:32px; filter:drop-shadow(0 0 10px rgba(201,165,78,.25))}
.navlinks{display:flex; gap:26px; align-items:center; font-size:14px}
.navlinks a{color:var(--muted); transition:color .16s}
.navlinks a:hover, .navlinks a.on{color:var(--ink)}
.navlinks a.on{color:var(--brass)}
.nav-cta{font-family:var(--sans); font-weight:600; font-size:13.5px; color:var(--brass)!important; border:1px solid var(--brass-dim); border-radius:100px; padding:8px 16px}
.nav-cta:hover{background:rgba(201,165,78,.08)}
.status-chip{font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; color:var(--brass); border:1px solid var(--brass-dim); border-radius:100px; padding:5px 12px; display:inline-flex; align-items:center; gap:7px; white-space:nowrap}
.dot{width:6px; height:6px; border-radius:50%; background:var(--brass); box-shadow:0 0 8px var(--brass)}

/* ---- buttons ---- */
.btn{font-family:var(--sans); font-weight:600; font-size:15px; padding:14px 26px; border-radius:9px; cursor:pointer; border:1px solid transparent; transition:.18s; display:inline-block}
.btn-primary{background:var(--brass); color:#1a1400; border-color:var(--brass)}
.btn-primary:hover{background:#d9b869; transform:translateY(-1px)}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line2)}
.btn-ghost:hover{border-color:var(--muted)}

/* ---- section scaffolding ---- */
section{padding:0 0 92px}
.sec-head{margin-bottom:40px}
.sec-head h2{font-family:var(--serif); font-weight:400; font-size:clamp(26px,4vw,34px); letter-spacing:-.01em; margin-top:16px}
.sec-head p{color:var(--muted); font-size:17px; margin-top:14px; max-width:54ch}
.rule{height:1px; background:linear-gradient(90deg, transparent, var(--brass-dim), transparent); border:0}

/* ---- proof strip ---- */
.proof{display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.proof .cell{padding:30px 20px; text-align:center; border-right:1px solid var(--line)}
.proof .cell:last-child{border-right:0}
.proof .fig{font-family:var(--serif); font-size:clamp(34px,6vw,44px); font-weight:400; line-height:1; letter-spacing:-.01em}
.proof .fig.pos{color:var(--pos)}
.proof .fig small{font-size:.55em}
.proof .lbl{font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); margin-top:12px}
.proof .note{font-size:12px; color:var(--faint); margin-top:5px}
.proof-note{text-align:center; font-family:var(--mono); font-size:11px; letter-spacing:.04em; color:var(--faint); margin:18px auto 0; max-width:58ch; line-height:1.6}

/* ---- thesis quote ---- */
.thesis{border-left:2px solid var(--brass-dim); padding:6px 0 6px 28px}
.thesis p{font-family:var(--serif); font-size:23px; font-weight:340; line-height:1.5; color:var(--ink)}
.thesis p em{font-style:italic; color:var(--brass)}
.thesis cite{display:block; font-family:var(--mono); font-size:12px; letter-spacing:.1em; color:var(--muted); margin-top:20px; font-style:normal}

/* ---- terms grid ---- */
.terms{display:flex; flex-direction:column; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:12px; overflow:hidden}
.term{background:var(--surface); padding:24px 26px; display:grid; grid-template-columns:170px 1fr; gap:22px; align-items:baseline}
.term .k{font-family:var(--mono); font-size:11.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--brass); padding-top:2px}
.term .v{color:var(--ink); font-size:15.5px}
.term .v b{font-weight:600}
.term .v span{color:var(--muted); display:block; font-size:13.5px; margin-top:5px; line-height:1.55}

/* ---- numbered steps ---- */
.steps{display:flex; flex-direction:column}
.step{display:grid; grid-template-columns:auto 1fr; gap:24px; padding:26px 0; border-top:1px solid var(--line); align-items:start}
.step:first-child{border-top:0}
.step .n{font-family:var(--mono); font-size:13px; color:var(--brass); border:1px solid var(--brass-dim); border-radius:50%; width:34px; height:34px; display:grid; place-items:center; flex-shrink:0}
.step h3{font-size:16.5px; font-weight:600; margin-bottom:5px}
.step p{color:var(--muted); font-size:14.5px}

/* ---- market cards (results) ---- */
.mkts{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
.mkt{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:22px 20px}
.mkt .top{display:flex; justify-content:space-between; align-items:baseline}
.mkt .name{font-family:var(--serif); font-size:19px}
.mkt .tag{font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--faint)}
.mkt .roi{font-family:var(--serif); font-size:34px; font-weight:400; margin-top:14px; line-height:1}
.mkt .roi.pos{color:var(--pos)} .mkt .roi.neg{color:var(--neg)} .mkt .roi.flat{color:var(--muted)}
.mkt .meta{font-family:var(--mono); font-size:12px; color:var(--muted); margin-top:8px}

/* ---- data table (leagues, slates) ---- */
.tbl{width:100%; border-collapse:collapse; font-size:14px}
.tbl th{text-align:left; font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:500; padding:0 12px 12px; border-bottom:1px solid var(--line)}
.tbl td{padding:12px; border-bottom:1px solid var(--line); font-variant-numeric:tabular-nums}
.tbl tr:last-child td{border-bottom:0}
.tbl .pos{color:var(--pos)} .tbl .neg{color:var(--neg)} .tbl .b{font-weight:600}
.tbl .book{font-size:11px; color:var(--brass)}
.tblwrap{overflow-x:auto; border:1px solid var(--line); border-radius:12px; padding:8px 14px 4px; background:var(--surface)}

/* ---- callout / honesty box ---- */
.callout{background:var(--surface); border:1px solid var(--line); border-left:2px solid var(--brass-dim); border-radius:10px; padding:22px 26px}
.callout h3{font-family:var(--serif); font-weight:400; font-size:20px; margin-bottom:8px}
.callout p{color:var(--muted); font-size:14.5px}
.callout p + p{margin-top:10px}

/* ---- waitlist gate ---- */
.gate{background:var(--surface); border:1px solid var(--line2); border-radius:16px; padding:48px 40px; text-align:center; position:relative; overflow:hidden}
.gate::before{content:""; position:absolute; inset:0; background:radial-gradient(ellipse 70% 60% at 50% 0%, rgba(201,165,78,.09), transparent 70%); pointer-events:none}
.gate .full{font-family:var(--mono); font-size:12px; letter-spacing:.2em; color:var(--brass); border:1px solid var(--brass-dim); border-radius:100px; padding:7px 16px; display:inline-block; margin-bottom:22px}
.gate h2{font-family:var(--serif); font-weight:400; font-size:30px; letter-spacing:-.01em; margin-bottom:12px}
.gate > p{color:var(--muted); max-width:42ch; margin:0 auto 8px}
.gate .building{font-family:var(--mono); font-size:12px; letter-spacing:.05em; color:var(--muted); margin:14px auto 26px}
.gate .building b{color:var(--brass); font-weight:400}
.form{display:flex; gap:10px; max-width:440px; margin:0 auto; flex-wrap:wrap; position:relative}
.form input{flex:1; min-width:200px; background:var(--ground); border:1px solid var(--line2); border-radius:9px; padding:14px 16px; color:var(--ink); font-family:var(--sans); font-size:15px}
.form input:focus{outline:none; border-color:var(--brass-dim)}
.form input::placeholder{color:var(--faint)}
.form button{background:var(--brass); color:#1a1400; border:0; border-radius:9px; padding:14px 22px; font-weight:600; font-size:15px; cursor:pointer; font-family:var(--sans)}
.form button:hover{background:#d9b869}
.thanks{color:var(--pos); font-family:var(--mono); font-size:14px; letter-spacing:.03em; margin-top:8px; display:none}
.gate .fine{font-size:12px; color:var(--faint); margin-top:20px}
/* qualifying form */
.qform{max-width:460px; margin:0 auto; text-align:left; display:flex; flex-direction:column; gap:16px}
.qform .fld{display:flex; flex-direction:column; gap:7px}
.qform label{font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted)}
.qform input[type=email], .qform select, .qform textarea{background:var(--ground); border:1px solid var(--line2); border-radius:9px; padding:12px 14px; color:var(--ink); font-family:var(--sans); font-size:15px; width:100%}
.qform input:focus, .qform select:focus, .qform textarea:focus{outline:none; border-color:var(--brass-dim)}
.qform select{appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%237C8896' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:34px}
.qform textarea{resize:vertical; min-height:60px}
.qform .segs{display:flex; gap:8px; flex-wrap:wrap}
.qform .seg{flex:1; min-width:88px; text-align:center; padding:11px 8px; border:1px solid var(--line2); border-radius:9px; cursor:pointer; font-size:13.5px; color:var(--muted); transition:.14s; background:var(--ground)}
.qform .seg:hover{border-color:var(--muted)}
.qform .seg.on{border-color:var(--brass); color:var(--brass); background:rgba(201,165,78,.06)}
.qform .hint{font-size:12px; color:var(--faint); line-height:1.5; margin-top:-4px; display:none; padding:10px 12px; background:var(--ground); border:1px solid var(--line); border-left:2px solid var(--brass-dim); border-radius:8px}
.qform .hint.show{display:block}
.qform .submit{background:var(--brass); color:#1a1400; border:0; border-radius:9px; padding:15px; font-weight:600; font-size:15px; cursor:pointer; font-family:var(--sans); margin-top:4px}
.qform .submit:hover{background:#d9b869}

/* ---- faq ---- */
.faq{display:flex; flex-direction:column; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:12px; overflow:hidden}
.faq details{background:var(--surface)}
.faq summary{padding:20px 24px; cursor:pointer; font-weight:600; font-size:15.5px; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; color:var(--brass); font-family:var(--mono); font-size:18px; flex-shrink:0}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 24px 22px; color:var(--muted); font-size:14.5px; max-width:60ch}

/* ---- footer ---- */
footer{border-top:1px solid var(--line); padding:36px 0 48px; color:var(--faint); font-size:12.5px; line-height:1.7}
footer .frow{display:flex; justify-content:space-between; align-items:flex-start; gap:30px; flex-wrap:wrap; margin-bottom:20px}
footer .brand{font-size:17px; margin-bottom:0}
footer .brand img{width:26px; height:26px}
footer .flinks{display:flex; gap:20px; font-size:13px}
footer .flinks a{color:var(--muted)}
footer .flinks a:hover{color:var(--ink)}
footer .disc{max-width:66ch}
footer a.help{color:var(--muted); text-decoration:underline}

/* ---- theme toggle ---- */
.themetoggle{background:transparent; border:1px solid var(--line2); color:var(--muted); border-radius:8px; width:34px; height:34px; cursor:pointer; font-size:15px; display:grid; place-items:center}
.themetoggle:hover{border-color:var(--muted); color:var(--ink)}

:focus-visible{outline:2px solid var(--brass); outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation:none!important; transition:none!important; scroll-behavior:auto!important}}

@media(max-width:640px){
  .navlinks{display:none}
  .proof{grid-template-columns:1fr}
  .proof .cell{border-right:0; border-bottom:1px solid var(--line)}
  .proof .cell:last-child{border-bottom:0}
  .mkts{grid-template-columns:1fr}
  .term{grid-template-columns:1fr; gap:8px}
  .gate{padding:36px 22px}
}