/* Captain's Pick — captainspick.golf · one static stylesheet, no dependencies */
:root{--pine:#0B3D27;--green:#11603C;--action:#177A4C;--mint:#E4F0E8;--mint-line:#CFE2D6;--gold:#EFBF45;--gold-border:#D6A52C;--gold-ink:#5E4708;--gold-tint:#FBF4DF;--ink:#141A16;--muted:#69736C;--label:#737D76;--bg:#F2F4F0;--linen:#F7F6F2;--card:#FFFFFF;--sep:rgba(60,67,60,0.12)}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif;background:var(--bg);color:var(--ink);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--green);text-decoration:none}
a:hover{color:var(--action);text-decoration:underline}
a:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:4px}
.wrap{max-width:640px;margin:0 auto;padding:0 24px}
.wrap-wide{max-width:960px;margin:0 auto;padding:0 24px}
/* ---- hero ---- */
.hero{background:var(--pine);color:#fff;padding:28px 0 56px}
.hero a{color:#fff}
.mark-row{display:flex;align-items:center;gap:10px;padding-bottom:40px}
.mark-row .flag{flex:0 0 auto}
.wordmark{font-size:17px;font-weight:700;letter-spacing:-0.2px;color:#fff}
.hero h1{font-size:clamp(34px,7vw,50px);line-height:1.08;letter-spacing:-0.8px;font-weight:800;text-wrap:balance}
.hero .lede{font-size:clamp(17px,2.4vw,20px);line-height:1.5;color:rgba(255,255,255,0.82);margin-top:16px;max-width:34em;text-wrap:pretty}
.hero .cta{margin-top:28px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hero .cta-note{font-size:13px;color:rgba(255,255,255,0.72)}
/* App Store badge — built in CSS, no external asset */
.appstore{display:inline-flex;align-items:center;gap:9px;background:#000;color:#fff;border:1px solid rgba(255,255,255,0.28);border-radius:11px;padding:9px 16px 9px 13px;text-decoration:none}
.appstore:hover{color:#fff;text-decoration:none;background:#101010}
.appstore .txt{display:flex;flex-direction:column;line-height:1.15;text-align:left}
.appstore .txt small{font-size:10.5px;font-weight:400;letter-spacing:0.2px}
.appstore .txt b{font-size:18px;font-weight:600;letter-spacing:-0.2px}
/* ---- invite banner (the /join/* fallback state) ---- */
.invite{background:rgba(239,191,69,0.13);border:1px solid rgba(239,191,69,0.45);border-radius:15px;padding:16px 18px;margin-bottom:36px}
.invite .kicker{font-size:12px;font-weight:700;letter-spacing:1.2px;color:var(--gold)}
.invite p{font-size:15px;line-height:1.5;color:rgba(255,255,255,0.92);margin-top:5px;text-wrap:pretty}
.code-pill{display:inline-flex;align-items:center;margin-top:12px;background:rgba(239,191,69,0.14);border:1px solid rgba(239,191,69,0.45);border-radius:11px;padding:8px 14px;font-size:20px;font-weight:800;letter-spacing:3px;color:#fff;font-variant-numeric:tabular-nums}
/* ---- feature walk ---- */
.features{padding:44px 0 8px}
.features h2{font-size:13px;font-weight:700;letter-spacing:1.4px;color:var(--label);text-transform:uppercase;padding-bottom:16px}
.grid{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:640px){.grid{grid-template-columns:1fr 1fr}}
.tile{background:var(--card);border-radius:14px;padding:18px 18px 16px;box-shadow:0 0.5px 1.5px rgba(20,26,22,0.06)}
.tile .ic{width:34px;height:34px;border-radius:9px;background:var(--mint);display:flex;align-items:center;justify-content:center}
.tile.gold .ic{background:var(--gold-tint)}
.tile h3{font-size:17px;font-weight:700;letter-spacing:-0.2px;margin-top:10px}
.tile p{font-size:15px;color:var(--muted);line-height:1.5;margin-top:4px;text-wrap:pretty}
/* ---- closing strip ---- */
.closer{padding:40px 0 8px;text-align:center}
.closer p{font-size:15px;color:var(--muted);margin-bottom:16px}
.closer .appstore{border-color:rgba(20,26,22,0.15)}
/* ---- footer ---- */
footer{padding:44px 0 40px}
footer .row{display:flex;align-items:center;justify-content:center;gap:18px;font-size:13px;color:var(--label)}
footer a{color:var(--muted);font-weight:600}
/* ---- doc pages (/privacy, /support) ---- */
.doc-bar{background:var(--pine);padding:14px 0}
.doc-bar .mark-row{padding-bottom:0}
.doc-bar a{color:#fff}
.doc-bar a:hover{color:#fff}
body.doc{background:var(--linen)}
.doc main{padding:40px 0 8px}
.doc h1{font-size:32px;letter-spacing:-0.5px;font-weight:800}
.doc .dateline{font-size:13px;color:var(--label);margin-top:6px}
.doc .intro{font-size:16px;line-height:1.55;margin-top:16px;text-wrap:pretty}
.doc h2{font-size:19px;font-weight:700;letter-spacing:-0.2px;margin:32px 0 8px}
.doc p{font-size:15px;line-height:1.6;color:#3C433E;margin-top:8px;text-wrap:pretty}
.doc ul{margin:8px 0 0 20px}
.doc li{font-size:15px;line-height:1.6;color:#3C433E;margin-top:6px}
.doc .never{background:var(--mint);border:1px solid var(--mint-line);border-radius:14px;padding:16px 18px;margin-top:12px}
.doc .never p,.doc .never li{color:var(--ink)}
.contact-card{display:flex;align-items:center;gap:14px;background:var(--card);border-radius:14px;padding:16px 18px;box-shadow:0 0.5px 1.5px rgba(20,26,22,0.06);margin-top:16px}
.contact-card .ic{width:40px;height:40px;border-radius:10px;background:var(--gold-tint);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.contact-card b{font-size:16px;display:block}
.contact-card span{font-size:13.5px;color:var(--muted)}
.faq{background:var(--card);border-radius:14px;box-shadow:0 0.5px 1.5px rgba(20,26,22,0.06);margin-top:12px;padding:4px 18px}
.faq section{padding:14px 0;border-bottom:0.5px solid var(--sep)}
.faq section:last-child{border-bottom:none}
.faq h3{font-size:15.5px;font-weight:700}
.faq p{font-size:14.5px;color:var(--muted);line-height:1.55;margin-top:4px;text-wrap:pretty}
