/* The privacy and terms pages: the landing page's look (dark, big type, a soft spectrum glow),
   made for reading - one comfortable column, with the contents beside it on wide screens. */
:root {
    color-scheme: dark;
    --bg: #0a0a0a;
    --card: #141414;
    --text: #f2f2f2;
    --body: #c4c4c4;
    --muted: #8a8a8a;
    --line: rgba(255, 255, 255, 0.09);
    --blue: #0d99ff;
    --spectrum: linear-gradient(90deg, #ff4d2e 0%, #ffd23f 34%, #8fe0bf 66%, #0d99ff 100%);
    --gutter: clamp(16px, 3.9vw, 56px);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { margin: 0; background: var(--bg); color: var(--body); font: 400 16.5px/1.7 Inter, -apple-system, "Segoe UI", Arial, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: inherit; }
.wrap { width: 100%; max-width: calc(1180px + 2 * var(--gutter)); margin: 0 auto; padding: 0 var(--gutter); }

/* Header */
.legal-head { position: sticky; top: 0; z-index: 10; background: rgba(10, 10, 10, 0.75); backdrop-filter: blur(14px) saturate(140%); -webkit-backdrop-filter: blur(14px) saturate(140%); border-bottom: 1px solid var(--line); }
.legal-nav { display: flex; align-items: center; justify-content: space-between; height: 68px; }
.legal-logo { display: inline-flex; align-items: flex-end; gap: 1px; color: var(--text); text-decoration: none; font: 800 25px/0.75 Inter, Arial, sans-serif; letter-spacing: -0.04em; }
.legal-logo svg { flex: none; display: block; width: 0.893em; height: 0.774em; }
.legal-links { display: flex; align-items: center; gap: 28px; }
.legal-links a { font-size: 15px; font-weight: 500; color: #c8c8c8; text-decoration: none; transition: color .2s; }
.legal-links a:hover, .legal-links a[aria-current] { color: #fff; }
.legal-btn { display: inline-flex; align-items: center; height: 40px; padding: 0 18px; border-radius: 999px; background: var(--text); color: #0a0a0a !important; font-weight: 600; font-size: 14.5px; text-decoration: none; transition: transform .2s, box-shadow .3s; }
.legal-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 30px rgba(13, 153, 255, 0.3); }

/* Title */
.legal-hero { position: relative; padding: 96px 0 56px; overflow: hidden; isolation: isolate; border-bottom: 1px solid var(--line); }
.legal-hero::before, .legal-hero::after { content: ""; position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; }
.legal-hero::before { width: 760px; height: 760px; right: -200px; top: -380px; background: radial-gradient(closest-side, rgba(13, 153, 255, 0.32), transparent 72%); }
.legal-hero::after { width: 560px; height: 560px; right: 260px; top: -200px; background: radial-gradient(closest-side, rgba(255, 77, 46, 0.2), transparent 72%); }
.legal-kicker { font-size: 12.5px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted); }
h1 { margin: 16px 0 0; color: var(--text); font-weight: 800; font-size: clamp(44px, 7vw, 96px); line-height: 0.98; letter-spacing: -0.052em; }
h1 span { background: var(--spectrum); -webkit-background-clip: text; background-clip: text; color: transparent; }
.legal-lede { max-width: 620px; margin: 26px 0 0; font-size: 18.5px; line-height: 1.6; color: var(--muted); }
.legal-date { display: inline-flex; align-items: center; gap: 10px; margin: 28px 0 0; padding: 6px 14px 6px 8px; border-radius: 999px; border: 1px solid var(--line); background: rgba(255, 255, 255, 0.04); font-size: 13.5px; color: #c8c8c8; }
.legal-date::before { content: ""; width: 8px; height: 8px; margin-left: 4px; border-radius: 50%; background: var(--spectrum); }

/* Body: contents on the left, text on the right */
.legal-body { display: grid; grid-template-columns: 240px minmax(0, 720px); gap: 80px; padding-top: 64px; padding-bottom: 40px; }
.legal-toc { position: sticky; top: 100px; align-self: start; }
.legal-toc p { margin: 0 0 14px; font-size: 12.5px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted); }
.legal-toc ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--line); }
.legal-toc li { margin: 0; padding: 0; }
.legal-toc li::before { display: none; }
.legal-toc a { display: block; padding: 6px 0 6px 16px; margin-left: -1px; border-left: 1px solid transparent; font-size: 14.5px; line-height: 1.4; color: var(--muted); text-decoration: none; transition: color .2s, border-color .2s; }
.legal-toc a:hover { color: var(--text); border-left-color: var(--blue); }

.legal-text { counter-reset: section; }
.legal-text section { padding: 34px 0; border-top: 1px solid var(--line); }
.legal-text section:first-child { padding-top: 0; border-top: 0; }
h2 { display: flex; align-items: baseline; gap: 16px; margin: 0 0 14px; color: var(--text); font-size: clamp(22px, 2.4vw, 28px); line-height: 1.2; font-weight: 700; letter-spacing: -0.03em; }
h2::before { counter-increment: section; content: counter(section, decimal-leading-zero); flex: none; font-size: 13px; font-weight: 500; letter-spacing: 0; color: var(--muted); font-variant-numeric: tabular-nums; }
p, ul { margin: 0 0 14px; }
p:last-child, ul:last-child { margin-bottom: 0; }
ul { list-style: none; padding: 0; }
li { position: relative; margin-bottom: 12px; padding-left: 22px; }
li::before { content: ""; position: absolute; left: 2px; top: 0.72em; width: 7px; height: 7px; border-radius: 50%; background: var(--spectrum); }
strong { color: var(--text); font-weight: 600; }
.legal-text a { color: #6fb8ff; text-decoration: underline; text-decoration-color: rgba(111, 184, 255, 0.4); text-underline-offset: 3px; }
.legal-text a:hover { text-decoration-color: currentColor; }
code { padding: 2px 7px; border-radius: 6px; background: var(--card); border: 1px solid var(--line); font: 0.88em Consolas, "SF Mono", Menlo, monospace; color: var(--text); }

/* Contact card at the end */
.legal-contact { margin-top: 30px; padding: 28px 30px; border-radius: 18px; background: var(--card); border: 1px solid var(--line); position: relative; overflow: hidden; }
.legal-contact::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 1px; background: var(--spectrum); opacity: 0.8; }
.legal-contact h3 { margin: 0 0 6px; color: var(--text); font-size: 18px; letter-spacing: -0.02em; }
.legal-contact p { margin: 0; color: var(--muted); }
.legal-contact a { color: var(--text); font-weight: 600; }

/* Footer */
.legal-foot { padding: 40px 0 56px; font-size: 14.5px; color: var(--muted); }
.legal-foot .wrap { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; padding-top: 34px; border-top: 1px solid var(--line); }
.legal-foot nav { display: flex; gap: 28px; flex-wrap: wrap; }
.legal-foot a { color: #c8c8c8; text-decoration: none; transition: color .2s; }
.legal-foot a:hover { color: #fff; }

@media (max-width: 900px) {
    .legal-body { grid-template-columns: minmax(0, 1fr); gap: 40px; padding-top: 44px; }
    .legal-toc { position: static; padding: 22px 22px 18px; border-radius: 16px; background: var(--card); border: 1px solid var(--line); }
    .legal-toc ol { columns: 2; column-gap: 20px; border-left: 0; }
    .legal-toc a { padding-left: 0; border-left: 0; break-inside: avoid; }
}
@media (max-width: 600px) {
    body { font-size: 16px; }
    .legal-nav { height: 60px; }
    .legal-links a:not(.legal-btn) { display: none; }
    .legal-hero { padding: 64px 0 40px; }
    .legal-hero::before { width: 480px; height: 480px; right: -220px; top: -240px; }
    .legal-hero::after { display: none; }
    .legal-toc ol { columns: 1; }
    h2 { gap: 12px; }
    .legal-contact { padding: 22px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media print {
    .legal-head, .legal-toc, .legal-hero::before, .legal-hero::after { display: none; }
    body { background: #fff; color: #222; }
    h1, h2, strong { color: #000; }
    h1 span { color: #000; background: none; }
    .legal-body { display: block; }
}
