/* Shared stylesheet for the benji.cash legal/support pages — from the owner's design handoff
   (legal_shared.css), with system font stacks in place of Google Fonts (faster, CSP-clean,
   consistent with the app). Served at /legal_shared.css so both root and /legal/ pages share it.
   Type system (option G, matches the landing + app): Fraunces for big headlines + the wordmark,
   system sans for body. Fraunces is loaded here too so support/legal match the landing. */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,200..600;1,9..144,300..500&display=swap');
:root{--bg:#0d0a06;--bg2:#120e08;--card:#1a140c;--card2:#211a10;--fg:#f2e9d8;--dim:#b3a78f;--mute:#857b68;--faint:#4d4537;--line:#2a2218;--amber:#d39c52;--glow:#eecb86;--green:#8fae97;--gild:linear-gradient(176deg,#fcf3de 4%,#ecd6a9 38%,#cd9f5d 72%,#b8894b 100%);
--font-d:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
--font-display:"Fraunces",serif;
--font-m:ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace}
*{box-sizing:border-box;margin:0;padding:0}*:focus{outline:none}*:focus-visible{outline:2px solid #d39c5299;outline-offset:3px;border-radius:6px}
html{scroll-behavior:smooth}
body{background:var(--bg);font-family:var(--font-d);color:var(--fg);font-weight:300;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.gild{background:var(--gild);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.wrap{max-width:880px;margin:0 auto;padding:0 26px}
/* nav — matches landing */
nav{position:sticky;top:0;z-index:50;background:#0d0a06ee;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:18px;padding-bottom:18px}
.brand{font-family:var(--font-display);font-size:23px;letter-spacing:-.02em;text-decoration:none;color:var(--amber);font-weight:600}
.navbtn{font-family:var(--font-m);font-size:11px;letter-spacing:.05em;text-transform:uppercase;font-weight:500;color:#1c1410;background:var(--gild);padding:10px 17px;border-radius:24px;text-decoration:none}
/* hero header */
.lhero{padding:64px 0 36px;position:relative;text-align:center}
.lhero::before{content:"";position:absolute;top:-80px;left:50%;transform:translateX(-50%);width:680px;height:420px;background:radial-gradient(closest-side,#d39c521c,transparent 70%);pointer-events:none}
.lk{font-family:var(--font-m);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--amber);margin-bottom:16px;position:relative}
.lhero h1{font-family:var(--font-display);font-weight:300;font-size:52px;letter-spacing:-.025em;line-height:1.03;position:relative}
.lhero h1 em{font-style:italic}
.lhero .sub{font-size:16.5px;color:var(--dim);margin-top:16px;position:relative}
.upd{font-family:var(--font-m);font-size:10.5px;color:var(--mute);margin-top:14px;position:relative}
/* at-a-glance cards */
.glance{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin:34px 0 8px}
.gl{background:linear-gradient(170deg,var(--card2),var(--card));border:1px solid var(--line);border-radius:16px;padding:17px 16px}
.gl .gi{font-size:19px;margin-bottom:9px;color:var(--green)}
.gl .gt{font-size:14.5px;font-weight:500;margin-bottom:4px;line-height:1.3}
.gl .gd{font-family:var(--font-m);font-size:9.5px;color:var(--mute);line-height:1.55}
/* numbered sections */
main{padding:26px 0 80px}
.sec{display:grid;grid-template-columns:74px 1fr;gap:22px;padding:30px 0;border-top:1px solid var(--line)}
.sec:first-of-type{border-top:none}
.sec .sn{font-family:var(--font-m);font-size:11px;color:var(--amber);letter-spacing:.08em;padding-top:7px}
.sec h2{font-family:var(--font-display);font-weight:400;font-size:25px;letter-spacing:-.01em;margin-bottom:10px}
.sec h2 em{font-style:italic;color:var(--glow)}
.sec p,.sec li{font-size:15px;color:var(--dim)}
.sec p{margin-bottom:12px}
.sec p:last-child{margin-bottom:0}
.sec ul{list-style:none;margin-bottom:12px}
.sec li{padding:8px 0 8px 26px;position:relative;line-height:1.55}
.sec li::before{content:"";position:absolute;left:2px;top:15px;width:9px;height:9px;border-radius:50%;border:1.5px solid var(--green)}
.sec li.x::before{border-color:#c98b6a;background:transparent}
.sec li.y::before{background:var(--green)}
.sec b{color:var(--fg);font-weight:500}
.sec a{color:var(--amber)}
/* highlight panel (terms: what benji is) */
.hl{background:linear-gradient(170deg,#241a0e,var(--card));border:1px solid #d39c5238;border-radius:18px;padding:22px 24px;margin:6px 0 12px}
.hl p{color:var(--fg)}
/* FAQ — designed accordion look */
.faq{border:1px solid var(--line);border-radius:16px;background:linear-gradient(170deg,var(--card2),var(--card));margin-bottom:11px;overflow:hidden}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:17px 20px;font-size:16px;font-weight:500}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--font-m);color:var(--amber);font-size:17px;flex-shrink:0}
.faq[open] summary::after{content:"–"}
.faq .fa{padding:0 20px 18px;font-size:14.5px;color:var(--dim);line-height:1.65}
.faq .fa a{color:var(--amber)}
/* contact card */
.ccard{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:linear-gradient(170deg,#241a0e,var(--card));border:1px solid #d39c5238;border-radius:18px;padding:24px 26px;margin:8px 0 36px}
.ccard .ct{font-size:21px;font-weight:300}
.ccard .cd{font-family:var(--font-m);font-size:10.5px;color:var(--mute);margin-top:5px}
.cbtn{font-family:var(--font-m);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:500;color:#1c1410;background:var(--gild);padding:14px 24px;border-radius:26px;text-decoration:none;white-space:nowrap}
/* step cards (delete) */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:8px 0 8px}
.stp{background:linear-gradient(170deg,var(--card2),var(--card));border:1px solid var(--line);border-radius:16px;padding:19px}
.stp .si{font-family:var(--font-m);font-size:10px;color:var(--amber);margin-bottom:9px}
.stp .st{font-size:15.5px;font-weight:500;margin-bottom:5px;line-height:1.35}
.stp .sd2{font-family:var(--font-m);font-size:10px;color:var(--mute);line-height:1.6}
.warn{display:inline-block;font-family:var(--font-m);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#c98b6a;border:1px solid #c98b6a55;border-radius:16px;padding:7px 14px;margin-top:14px;position:relative}
/* footer — matches landing */
footer{border-top:1px solid var(--line);padding:28px 0;text-align:center}
footer .wrap p{font-family:var(--font-m);font-size:10px;color:var(--mute)}
footer a{color:var(--mute);text-decoration:none;margin:0 9px}
footer a:hover{color:var(--dim)}
@media(max-width:760px){
 .lhero{padding:42px 0 24px}.lhero h1{font-size:35px}
 .glance{grid-template-columns:1fr 1fr;gap:9px}
 .sec{grid-template-columns:1fr;gap:6px;padding:24px 0}
 .sec .sn{padding-top:0}
 .steps{grid-template-columns:1fr}
 .ccard{padding:19px}.cbtn{width:100%;text-align:center}
 .wrap{padding:0 18px}
}
