/* 10XF Freedom site — night-to-dawn palette shared with the app */
:root{
  --night:#070B15; --night-2:#0D1424; --night-3:#141D33; --ink:#EEF1F7; --muted:#A3AEC5; --faint:#6A7690;
  --line:rgba(238,241,247,.10); --line-2:rgba(238,241,247,.18);
  --dawn:#F4A65E; --dawn-2:#FFD39C; --dawn-ink:#2A1606; --sage:#8CCBA8; --rose:#E8907F;
  --f-display:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;
  --f-read:"Newsreader",Georgia,serif;
  --f-ui:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--night)}
body{margin:0;background:var(--night);color:var(--ink);font:16px/1.55 var(--f-ui);-webkit-font-smoothing:antialiased}
a{color:var(--dawn-2)}
:focus-visible{outline:2px solid var(--dawn-2);outline-offset:3px;border-radius:6px}
.wrap{max-width:1080px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right))}
.narrow{max-width:720px}
header.top{position:relative;z-index:3}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:20px}
.mark{font:900 26px/1 var(--f-display);letter-spacing:.02em;color:var(--ink);text-decoration:none}
.mark b{color:var(--dawn)}
.mark span{font:700 12px/1 var(--f-ui);letter-spacing:.28em;color:var(--muted);margin-left:10px;vertical-align:4px}
nav.top a{color:var(--muted);text-decoration:none;font-weight:600;font-size:15px;margin-left:18px}
nav.top a:hover{color:var(--ink)}

.sky{position:relative;overflow:hidden;background:linear-gradient(180deg,#0B1530 0%,#3B3550 52%,#C97C6A 82%,#FFC88A 100%)}
.sky .stars{position:absolute;inset:0;background-image:radial-gradient(1.5px 1.5px at 8% 14%,#fff8,transparent),radial-gradient(1.5px 1.5px at 22% 30%,#fff6,transparent),radial-gradient(1.5px 1.5px at 41% 12%,#fff9,transparent),radial-gradient(1.5px 1.5px at 63% 22%,#fff7,transparent),radial-gradient(1.5px 1.5px at 78% 9%,#fff8,transparent),radial-gradient(1.5px 1.5px at 90% 28%,#fff5,transparent),radial-gradient(1.5px 1.5px at 33% 44%,#fff4,transparent),radial-gradient(1.5px 1.5px at 71% 40%,#fff4,transparent)}
.sky .sun{position:absolute;left:66%;bottom:70px;width:120px;height:120px;margin-left:-60px;border-radius:50%;background:radial-gradient(circle,#FFF0D2 0%,#FFC77F 46%,#F49A55 72%,rgba(244,154,85,0) 74%);box-shadow:0 0 120px 40px rgba(246,164,94,.35)}
.sky svg.ridge{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:130px;display:block}
.sky svg .back{fill:#0A1020;opacity:.7}
.sky svg .front{fill:var(--night)}
.hero{position:relative;z-index:2;padding-block:48px 190px}
.eyebrow{font:700 12.5px/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--dawn-2)}
h1.display{font:900 clamp(44px,8vw,92px)/.9 var(--f-display);text-transform:uppercase;margin:16px 0 18px;max-width:14ch;text-wrap:balance}
.lede{font-size:clamp(17px,2.2vw,20px);max-width:36ch;color:rgba(238,241,247,.9);margin:0}

.join{margin-top:30px;max-width:520px;padding:20px;border-radius:20px;background:rgba(7,11,21,.72);border:1px solid var(--line-2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.join h2{font:800 24px/1.05 var(--f-display);text-transform:uppercase;margin:0 0 6px;letter-spacing:.02em}
.join p{margin:0 0 14px;color:var(--muted);font-size:14.5px}
.row{display:flex;gap:8px;flex-wrap:wrap}
input[type=email]{flex:1 1 220px;min-width:0;font:500 16px var(--f-ui);color:var(--ink);background:var(--night-2);border:1px solid var(--line-2);border-radius:12px;padding:14px}
input[type=email]:focus{outline:2px solid var(--dawn);border-color:transparent}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 20px;border-radius:12px;border:0;font:600 16px var(--f-ui);cursor:pointer;text-decoration:none}
.btn-primary{background:var(--dawn);color:var(--dawn-ink)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--line-2)}
.btn[disabled]{opacity:.5;cursor:wait}
label.check{display:flex;gap:10px;align-items:flex-start;margin-top:12px;font-size:14px;color:var(--muted);cursor:pointer}
label.check input{margin-top:3px;accent-color:var(--dawn)}
.msg{margin-top:12px;font-size:14.5px;font-weight:600}
.msg.ok{color:var(--sage)} .msg.err{color:var(--rose)}

section.block{padding-block:72px}
section.block + section.block{border-top:1px solid var(--line)}
h2.sec{font:900 clamp(34px,5vw,54px)/.95 var(--f-display);text-transform:uppercase;margin:10px 0 28px;max-width:18ch;text-wrap:balance}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.card{padding:22px;border-radius:18px;background:var(--night-2);border:1px solid var(--line)}
.card h3{font:800 22px/1.05 var(--f-display);text-transform:uppercase;letter-spacing:.02em;margin:0 0 8px}
.card p{margin:0;color:var(--muted);font-size:15px}
.card .k{font:900 34px/1 var(--f-display);color:var(--dawn);display:block;margin-bottom:10px}
.pledge{font:500 clamp(22px,3vw,30px)/1.35 var(--f-read);font-style:italic;max-width:30ch;margin:0}

footer{border-top:1px solid var(--line);padding-block:36px 48px;color:var(--faint);font-size:14px}
footer .links{display:flex;flex-wrap:wrap;gap:18px;margin-bottom:14px}
footer a{color:var(--muted);text-decoration:none}
footer a:hover{color:var(--ink)}
.crisis{color:var(--muted)}

/* legal / support pages */
.doc{padding-block:32px 72px}
.doc h1{font:900 clamp(40px,7vw,64px)/.92 var(--f-display);text-transform:uppercase;margin:10px 0 8px}
.doc .updated{color:var(--faint);font-size:14px;margin:0 0 28px}
.doc h2{font:800 24px/1.1 var(--f-display);text-transform:uppercase;letter-spacing:.02em;margin:40px 0 10px}
.doc p,.doc li{color:#D9DEE8;max-width:68ch}
.doc ul{padding-left:20px}
.doc li{margin-bottom:6px}
.doc .callout{padding:16px 18px;border-radius:14px;background:var(--night-2);border:1px solid var(--line-2);margin:18px 0}
.doc table{border-collapse:collapse;width:100%;font-size:15px;margin:10px 0}
.doc th,.doc td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.doc th{color:var(--muted);font-weight:600}
.tablewrap{overflow-x:auto}
.faq details{padding:16px 18px;border-radius:14px;background:var(--night-2);border:1px solid var(--line);margin-bottom:10px}
.faq summary{cursor:pointer;font-weight:600}
.faq details p{margin:10px 0 0;color:var(--muted)}

/* invite */
.invite{min-height:70vh;display:grid;place-items:center;text-align:center;padding-block:48px}
.invite .who{font:900 clamp(40px,8vw,72px)/.92 var(--f-display);text-transform:uppercase;margin:12px 0 14px;text-wrap:balance}
.invite .code{display:inline-block;margin-top:14px;padding:10px 16px;border-radius:12px;border:1px dashed var(--line-2);font:700 20px/1 ui-monospace,Menlo,monospace;letter-spacing:.12em}

@media (max-width:640px){
  .hero{padding-block:28px 150px}
  nav.top a{margin-left:12px;font-size:14px}
  .mark span{display:none}
  .sky .sun{width:90px;height:90px;margin-left:-45px;bottom:56px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
