/* legal.css — shared styling for the public info & legal pages
   (About, Support, Privacy, Terms). Matches the About page look. */
:root {
    --bg:#07120c; --bg2:#0b1a11; --panel:#0e2016; --line:rgba(120,200,150,0.14);
    --ink:#e8f3ec; --ink-soft:#9db8a8; --green:#4ade80; --green-deep:#22c55e; --amber:#f6c453;
}
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
    background:var(--bg); color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    line-height:1.65; -webkit-font-smoothing:antialiased;
}
a { color:var(--green); text-decoration:none; }
a:hover { text-decoration:underline; }
.wrap { max-width:820px; margin:0 auto; padding:0 1.5rem; }

.hero {
    position:relative; padding:4rem 0 2.5rem; text-align:center;
    background:
        radial-gradient(1200px 400px at 50% -10%, rgba(74,222,128,0.12), transparent 60%),
        linear-gradient(180deg, var(--bg2), var(--bg));
    border-bottom:1px solid var(--line);
}
.brand { font-size:1.05rem; letter-spacing:0.28em; text-transform:uppercase; color:var(--green); font-weight:700; }
.hero h1 { font-size:clamp(1.8rem,5vw,2.8rem); line-height:1.1; margin:0.8rem auto 0.6rem; font-weight:800; letter-spacing:-0.02em; }
.hero p { color:var(--ink-soft); max-width:56ch; margin:0 auto; font-size:1rem; }
.updated { color:var(--ink-soft); font-size:0.82rem; margin-top:0.8rem; }

/* Top nav between the info pages */
.info-nav { display:flex; gap:0.4rem; justify-content:center; flex-wrap:wrap; padding:1rem 1.5rem; border-bottom:1px solid var(--line); background:var(--bg2); position:sticky; top:0; z-index:10; }
.info-nav a { padding:0.4rem 0.9rem; border-radius:8px; font-size:0.86rem; font-weight:600; color:var(--ink-soft); border:1px solid transparent; }
.info-nav a:hover { text-decoration:none; background:rgba(74,222,128,0.08); color:var(--ink); }
.info-nav a.active { background:var(--green); color:#06210f; }

main { padding:2.5rem 0 1rem; }
section { padding:1.5rem 0; border-bottom:1px solid var(--line); }
section:last-child { border-bottom:none; }
h2 { font-size:clamp(1.3rem,3.5vw,1.7rem); margin-bottom:0.6rem; font-weight:800; letter-spacing:-0.01em; }
h3 { font-size:1.08rem; margin:1.2rem 0 0.35rem; font-weight:700; color:var(--ink); }
p { color:var(--ink-soft); margin-top:0.7rem; max-width:66ch; }
strong { color:var(--ink); }
ul, ol { color:var(--ink-soft); margin:0.7rem 0 0 1.2rem; max-width:66ch; }
li { margin-bottom:0.5rem; }
.eyebrow { color:var(--green); font-weight:700; font-size:0.76rem; letter-spacing:0.16em; text-transform:uppercase; margin-bottom:0.5rem; }

.callout { background:rgba(74,222,128,0.05); border:1px solid rgba(74,222,128,0.3); border-radius:14px; padding:1.3rem; margin-top:1.2rem; }
.callout p { margin-top:0.4rem; }
.callout p:first-child { margin-top:0; }
.warn { background:rgba(246,196,83,0.06); border:1px solid rgba(246,196,83,0.3); border-radius:14px; padding:1.3rem; margin-top:1.2rem; }
.warn h3 { color:var(--amber); margin-top:0; }

.contact-card { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:1.4rem; margin-top:1.2rem; }
.contact-card .label { font-size:0.76rem; text-transform:uppercase; letter-spacing:0.08em; color:var(--ink-soft); }
.contact-card .val { font-size:1.05rem; font-weight:700; color:var(--ink); margin-top:0.15rem; }

.faq { margin-top:1rem; }
.faq details { border:1px solid var(--line); border-radius:12px; padding:0.3rem 1.1rem; margin-bottom:0.6rem; background:var(--panel); }
.faq summary { cursor:pointer; font-weight:700; padding:0.7rem 0; list-style:none; color:var(--ink); }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::before { content:"+ "; color:var(--green); font-weight:800; }
.faq details[open] summary::before { content:"– "; }
.faq details p { margin:0 0 0.9rem; font-size:0.94rem; }

footer { padding:2.5rem 0 4rem; text-align:center; color:var(--ink-soft); font-size:0.85rem; }
footer a { margin:0 0.5rem; }
.code { font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:0.82rem; background:rgba(0,0,0,0.35); padding:0.15rem 0.45rem; border-radius:6px; color:var(--green); word-break:break-all; }
@media (prefers-reduced-motion: reduce){ html { scroll-behavior:auto; } }