/* FlowState Ladder — shared styles. Tokens from the FlowState system (orb board / marketing):
   dark navy field, house violet, working shade #6D54C9, Mother Marble accents.
   One font throughout: Exo 2. Bordered panels, muted interiors. */
:root{
  --bg:#0a0a1a; --panel:#14142c; --panel2:#101024; --line:#2e2e52;
  --ink:#e8eaf2; --muted:#9aa3b8; --faint:#6f7794;
  --violet:#8b6fe8; --violet-deep:#6d54c9; --violet-lt:#b9a7ff; --green:#7fb069;
  --amber:#d9a441; --radius:16px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg) radial-gradient(1400px 900px at 50% 0%, #191936 0%, #0e0e24 52%, var(--bg) 100%);
  color:var(--ink);
  font-family:"Exo 2","Segoe UI",system-ui,-apple-system,Helvetica,Arial,sans-serif;
  line-height:1.55; font-size:17px;
}
a{color:var(--violet-lt)}
img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding:0 22px}

/* ---------- top bar ---------- */
.topbar{position:sticky;top:0;z-index:50;background:rgba(10,10,26,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.topbar-in{display:flex;align-items:center;gap:18px;padding:12px 0}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}
.brand img{width:32px;height:32px}
.brand .bt{font-weight:700;letter-spacing:.14em;font-size:15px;text-transform:uppercase}
.brand .bt span{color:var(--violet-lt)}
nav.main{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
nav.main a{color:var(--muted);text-decoration:none;font-size:14.5px;font-weight:600;padding:8px 13px;border-radius:10px;border:1px solid transparent}
nav.main a:hover{color:var(--ink);border-color:var(--line);background:var(--panel2)}
nav.main a.here{color:var(--ink);border-color:var(--violet-deep);background:var(--panel)}
.chip{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  padding:5px 11px;border-radius:999px;border:1px solid var(--line);color:var(--muted);background:var(--panel2);white-space:nowrap}
.chip .dot{width:7px;height:7px;border-radius:50%;background:var(--amber)}
.chip.green{color:#cfe6c2;border-color:#3d5a34}.chip.green .dot{background:var(--green)}
.chip.violet{color:var(--violet-lt);border-color:var(--violet-deep)}.chip.violet .dot{background:var(--violet)}
.chip.amber{color:#ecd3a0;border-color:#6b5320}.chip.amber .dot{background:var(--amber)}

/* ---------- hero ---------- */
.hero{padding:64px 0 30px;text-align:center}
.eyebrow{color:var(--violet-lt);font-size:13px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;text-align:center}
.hero h1{font-size:clamp(38px,6vw,64px);line-height:1.06;font-weight:800;letter-spacing:-.01em;margin:18px auto 16px;max-width:900px}
.hero h1 .grad{background:linear-gradient(92deg,var(--violet-lt),var(--violet) 55%,var(--green));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .sub{color:var(--muted);font-size:19px;max-width:760px;margin:0 auto}
.hero .sub b{color:var(--ink);font-weight:600}
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-block;text-decoration:none;font-weight:700;font-size:15.5px;padding:13px 24px;border-radius:12px;border:1px solid var(--violet-deep);
  background:linear-gradient(180deg,#7a63d8,var(--violet-deep));color:#fff;box-shadow:0 6px 22px rgba(109,84,201,.35)}
.btn:hover{filter:brightness(1.1)}
.btn.ghost{background:var(--panel);color:var(--ink);border-color:var(--line);box-shadow:none}
.btn.ghost:hover{border-color:var(--violet-deep)}
.hero-marble{margin:40px auto 0;max-width:520px;border-radius:50%;overflow:hidden;border:1px solid var(--line);
  box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 10px rgba(139,111,232,.06)}
.hero-marble img{width:100%}

/* ---------- sections & panels ---------- */
section{padding:44px 0}
.sec-head{text-align:center;max-width:760px;margin:0 auto 30px}
.sec-head h2{font-size:clamp(27px,4vw,38px);font-weight:800;margin:12px 0 10px}
.sec-head p{color:var(--muted)}
.panel{background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid var(--line);border-radius:var(--radius);padding:26px}
.panel h3{font-size:20px;font-weight:700;margin-bottom:8px}
.panel p{color:var(--muted)}
.grid{display:grid;gap:18px}
.grid.c2{grid-template-columns:repeat(2,1fr)}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c4{grid-template-columns:repeat(4,1fr)}

/* ---------- ladder cards ---------- */
.ladder{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ladder .wide{grid-column:span 3}
.orb-card{background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid var(--line);border-radius:var(--radius);padding:26px;display:flex;flex-direction:column}
.orb-card.founding{border-color:#7a5fd0;background:linear-gradient(180deg,#1b1440,#12102a)}
.orb-card.top{border-color:#565d75;background:linear-gradient(180deg,#1a1a30,#10101f)}
.orb-card .orb{width:148px;height:148px;margin:2px auto 14px;border-radius:50%;overflow:hidden;border:1px solid var(--line);box-shadow:0 14px 34px rgba(0,0,0,.5)}
.orb-card .orb img{width:100%;height:100%;object-fit:cover}
.orb-card h3{text-align:center;font-size:23px;font-weight:800}
.orb-card .price{text-align:center;color:var(--violet-lt);font-size:21px;font-weight:600;white-space:nowrap;margin:3px 0 4px}
.orb-card .price small{color:var(--faint);font-size:13px;font-weight:600}
.orb-card .gets{color:var(--muted);font-size:15.5px;margin-top:10px}
.orb-card .gets b{color:var(--ink);font-weight:600}
.orb-card .foot{margin-top:auto;padding-top:16px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.note{font-size:13.5px;color:var(--faint)}
.note b{color:var(--muted)}

/* ---------- lists ---------- */
ul.tight{list-style:none}
ul.tight li{position:relative;padding-left:20px;margin:9px 0;color:var(--muted);font-size:15.5px}
ul.tight li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:50%;background:var(--violet)}
ul.tight li b{color:var(--ink);font-weight:600}

/* ---------- commission table ---------- */
table{width:100%;border-collapse:collapse;font-size:15.5px}
th,td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line)}
th{color:var(--violet-lt);font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
td{color:var(--muted)} td b,td strong{color:var(--ink)}
tr.hl td{background:rgba(139,111,232,.10);color:var(--ink)}
.arith{font-size:14.5px;color:var(--muted);border-left:3px solid var(--violet-deep);padding:4px 0 4px 16px;margin-top:16px}
.arith b{color:var(--ink)}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.step{background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid var(--line);border-radius:var(--radius);padding:20px}
.step .n{width:34px;height:34px;border-radius:50%;background:var(--violet-deep);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:16px;margin-bottom:12px}
.step h3{font-size:16.5px;margin-bottom:6px}
.step p{color:var(--muted);font-size:14.5px}
.flowline{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;margin-top:22px;color:var(--faint);font-size:13.5px;font-weight:600;letter-spacing:.06em}
.flowline .st{border:1px solid var(--line);background:var(--panel2);color:var(--muted);padding:6px 12px;border-radius:999px}
.flowline .arr{color:var(--violet)}

/* ---------- links & kits ---------- */
.linkbox{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:14.5px;background:#0b0b1e;border:1px solid var(--line);
  border-radius:10px;padding:12px 14px;color:var(--violet-lt);word-break:break-all;display:flex;justify-content:space-between;gap:10px;align-items:center}
.linkbox button{flex:none;cursor:pointer;font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--ink);
  background:var(--panel);border:1px solid var(--violet-deep);border-radius:8px;padding:6px 10px}
.kit{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.kit span{font-size:12.5px;font-weight:600;color:var(--muted);border:1px solid var(--line);background:var(--panel2);border-radius:999px;padding:4px 10px}

/* ---------- forms ---------- */
form.capture{display:grid;gap:12px}
form.capture label{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
form.capture input,form.capture select{width:100%;background:#0b0b1e;border:1px solid var(--line);border-radius:10px;color:var(--ink);
  padding:12px 14px;font:inherit;font-size:15.5px;margin-top:5px}
form.capture input:focus,form.capture select:focus{outline:2px solid var(--violet-deep);border-color:var(--violet-deep)}
.form-msg{display:none;border:1px solid #3d5a34;background:#131f16;color:#cfe6c2;border-radius:10px;padding:12px 14px;font-size:14.5px}

/* ---------- dashboard ---------- */
.member{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.member .orb{width:96px;height:96px;border-radius:50%;overflow:hidden;border:1px solid var(--line);flex:none;box-shadow:0 10px 26px rgba(0,0,0,.5)}
.member .orb img{width:100%;height:100%;object-fit:cover}
.member h2{font-size:26px;font-weight:800}
.member .meta{color:var(--muted);font-size:15px}
.big{font-size:42px;font-weight:800;line-height:1.05}
.big small{font-size:15px;color:var(--faint);font-weight:600}
.bar{height:12px;border-radius:999px;background:#0b0b1e;border:1px solid var(--line);overflow:hidden;margin:12px 0 6px}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--violet-deep),var(--violet),var(--green));border-radius:999px}
.gates{list-style:none}
.gates li{display:flex;gap:11px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:15.5px}
.gates li:last-child{border-bottom:none}
.gates .st{flex:none;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;margin-top:1px}
.gates .ok{background:#22331e;color:var(--green);border:1px solid #3d5a34}
.gates .no{background:#2e2410;color:var(--amber);border:1px solid #6b5320}
.gates b{color:var(--ink)}
.toggle{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.toggle button{cursor:pointer;font:inherit;font-size:13.5px;font-weight:700;padding:8px 16px;background:var(--panel2);color:var(--muted);border:none}
.toggle button.on{background:var(--violet-deep);color:#fff}
.sample-flag{border:1px dashed #6b5320;background:rgba(217,164,65,.07);border-radius:12px;padding:12px 16px;color:#ecd3a0;font-size:14.5px;text-align:center}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);margin-top:30px;padding:34px 0 46px;color:var(--faint);font-size:14px}
footer b{color:var(--muted);font-weight:600}
footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:22px}
footer a{color:var(--muted);text-decoration:none;display:block;margin:5px 0}
footer a:hover{color:var(--ink)}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .ladder{grid-template-columns:repeat(2,1fr)} .ladder .wide{grid-column:span 2}
  .steps{grid-template-columns:repeat(2,1fr)} .grid.c4{grid-template-columns:repeat(2,1fr)} .grid.c3{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body{font-size:16px}
  .ladder,.grid.c2,.grid.c3,.grid.c4,.steps{grid-template-columns:1fr} .ladder .wide{grid-column:span 1}
  .topbar-in{flex-wrap:wrap} nav.main{margin-left:0}
  .hero{padding:44px 0 20px} footer .cols{grid-template-columns:1fr}
  .member{gap:14px} .big{font-size:34px}
  th,td{padding:9px 10px}
}