/* ============================================================
   Emma — shared styles for legal pages (Privacy, Terms)
   Same design tokens as the marketing site (EmmaColor.swift):
   Sage-teal accent, warm canvas, AA+ contrast, elderly-first.
   ============================================================ */

:root {
  --bg:#F6F7F5; --surface:#FFFFFF; --surface-2:#FBFCFB;
  --ink:#121817; --ink-2:#495553; --ink-3:#6B7775;
  --accent:#0E6E60; --accent-strong:#0A574C; --accent-bright:#1C8A78; --accent-glow:#4FC9B6;
  --on-accent:#FFFFFF; --accent-soft:#DDEEEA;
  --success:#1B7A4B; --warning:#9A5B00; --info:#1F5FA8;
  --separator:#E2E6E3;
  --shadow-1:0 1px 2px rgba(18,24,23,.04),0 4px 16px rgba(18,24,23,.06);
  --shadow-2:0 2px 6px rgba(18,24,23,.06),0 18px 48px rgba(18,24,23,.10);
  --font-display:ui-rounded,"SF Pro Rounded","Hiragino Maru Gothic ProN",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-body:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --maxw:1080px; --radius:18px; --radius-sm:12px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:#0F1413; --surface:#18201F; --surface-2:#141C1B;
    --ink:#F2F5F4; --ink-2:#B7C2BF; --ink-3:#8A9693;
    --accent:#4FC9B6; --accent-strong:#73DCCB; --accent-bright:#4FC9B6; --accent-glow:#4FC9B6;
    --on-accent:#05201C; --accent-soft:#143430;
    --success:#57C98A; --warning:#E3A857; --info:#6FB0EE; --separator:#2A3432;
    --shadow-1:0 1px 2px rgba(0,0,0,.3),0 4px 16px rgba(0,0,0,.35);
    --shadow-2:0 2px 6px rgba(0,0,0,.4),0 18px 48px rgba(0,0,0,.5);
  }
}
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:90px;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{margin:0;font-family:var(--font-body);font-size:18px;line-height:1.7;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4,.display{font-family:var(--font-display);line-height:1.18;letter-spacing:-.02em;}
a{color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px;}
a:hover{color:var(--accent-strong);}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:6px;}
.wrap{width:min(100% - 40px,var(--maxw));margin-inline:auto;}
.skip{position:absolute;left:-9999px;top:0;background:var(--accent);color:var(--on-accent);padding:12px 18px;border-radius:0 0 12px 0;z-index:200;font-weight:700;}
.skip:focus{left:0;}

/* ---------- Header ---------- */
header.nav{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--bg) 84%,transparent);backdrop-filter:saturate(160%) blur(14px);-webkit-backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid var(--separator);}
.nav-inner{display:flex;align-items:center;gap:16px;padding:13px 0;}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);margin-right:auto;}
.brand .mark{width:38px;height:38px;flex:none;border-radius:11px;box-shadow:var(--shadow-1);}
.brand .name{font-family:var(--font-display);font-weight:800;font-size:1.2rem;letter-spacing:-.02em;line-height:1;}
.brand .sub{display:block;font-weight:600;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-top:3px;}
.nav-links{display:flex;align-items:center;gap:4px;}
.nav-links a{color:var(--ink-2);text-decoration:none;font-weight:600;font-size:.96rem;padding:8px 13px;border-radius:10px;}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--ink);background:var(--accent-soft);}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-display);font-weight:700;font-size:.98rem;padding:12px 22px;border-radius:999px;border:2px solid transparent;cursor:pointer;text-decoration:none;min-height:46px;}
.btn-primary{background:var(--accent);color:var(--on-accent);}
.btn-primary:hover{background:var(--accent-strong);color:var(--on-accent);}
@media (max-width:760px){.nav-links{display:none;}}

/* ---------- Page header ---------- */
.legal-hero{background:linear-gradient(150deg,var(--accent) 0%,var(--accent-strong) 100%);color:#fff;padding:clamp(40px,6vw,68px) 0 clamp(34px,5vw,52px);position:relative;overflow:hidden;}
.legal-hero::after{content:"";position:absolute;right:-90px;top:-90px;width:300px;height:300px;border-radius:50%;border:40px solid rgba(255,255,255,.08);}
.legal-hero .wrap{position:relative;z-index:1;}
.legal-hero .logo-area{display:flex;align-items:center;gap:13px;margin-bottom:20px;}
.legal-hero .mark{width:46px;height:46px;border-radius:13px;}
.legal-hero .lname{font-family:var(--font-display);font-weight:800;font-size:1.2rem;line-height:1;}
.legal-hero .ltag{font-size:.8rem;opacity:.82;}
.legal-hero h1{font-size:clamp(2rem,4.6vw,2.9rem);font-weight:800;margin:0;}
.legal-hero .meta{opacity:.9;font-size:.95rem;margin-top:12px;}
.legal-hero .meta span{white-space:nowrap;}

/* ---------- Layout: TOC + content ---------- */
.legal-body{padding:clamp(34px,5vw,60px) 0 30px;}
.legal-grid{display:grid;grid-template-columns:248px 1fr;gap:clamp(28px,5vw,56px);align-items:start;}
.toc{position:sticky;top:84px;}
.toc h2{font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin:0 0 12px;}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:toc;}
.toc li{margin:0;}
.toc a{display:block;color:var(--ink-2);text-decoration:none;font-size:.92rem;font-weight:600;padding:7px 10px;border-radius:8px;border-left:2px solid transparent;}
.toc a:hover{background:var(--accent-soft);color:var(--accent-strong);}
.toc a.active{color:var(--accent);border-left-color:var(--accent);background:color-mix(in srgb,var(--accent-soft) 60%,transparent);}
@media (max-width:880px){
  .legal-grid{grid-template-columns:1fr;}
  .toc{position:static;}
  .toc details{background:var(--surface);border:1px solid var(--separator);border-radius:var(--radius-sm);padding:6px 14px;box-shadow:var(--shadow-1);}
  .toc summary{cursor:pointer;font-family:var(--font-display);font-weight:700;padding:10px 0;}
  .toc ol{padding:6px 0 10px;}
}
@media (min-width:881px){.toc summary{display:none;}}

/* ---------- Content typography ---------- */
.content{max-width:760px;}
.content h2{font-size:1.55rem;font-weight:800;color:var(--ink);margin:44px 0 14px;padding-bottom:10px;border-bottom:2px solid var(--separator);scroll-margin-top:90px;}
.content h2:first-of-type{margin-top:0;}
.content h3{font-size:1.2rem;font-weight:700;color:var(--ink);margin:28px 0 10px;}
.content p{margin:0 0 16px;color:var(--ink-2);}
.content ul,.content ol{margin:0 0 18px;padding-left:24px;color:var(--ink-2);}
.content li{margin-bottom:9px;}
.content strong{color:var(--ink);}
.content a{font-weight:600;}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.88em;background:var(--accent-soft);color:var(--accent-strong);padding:1px 6px;border-radius:5px;}

/* ---------- Components ---------- */
.summary-box{background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 30%,var(--separator));border-left:5px solid var(--accent);border-radius:var(--radius-sm);padding:24px 28px;margin:0 0 8px;}
.summary-box h2{border:none;padding:0;margin:0 0 12px;font-size:1.2rem;color:var(--accent-strong);}
.summary-box p{color:var(--ink);margin-bottom:10px;}
.summary-box p:last-child{margin-bottom:0;}

.qa{background:var(--surface);border:1px solid var(--separator);border-radius:var(--radius-sm);margin:12px 0;overflow:hidden;box-shadow:var(--shadow-1);}
.qa .q{background:var(--surface-2);padding:14px 20px;font-family:var(--font-display);font-weight:700;color:var(--ink);font-size:1.02rem;border-bottom:1px solid var(--separator);display:flex;gap:11px;align-items:baseline;}
.qa .q .qi{color:var(--accent);font-weight:800;}
.qa .a{padding:14px 20px;color:var(--ink-2);font-size:1rem;}

.notice{border-radius:var(--radius-sm);padding:16px 20px;margin:20px 0;font-size:1rem;}
.notice strong{display:block;margin-bottom:4px;color:var(--ink);}
.notice.teal{background:var(--accent-soft);border-left:4px solid var(--accent);}
.notice.warn{background:color-mix(in srgb,var(--warning) 14%,var(--surface));border-left:4px solid var(--warning);}

.callout-med{background:linear-gradient(150deg,var(--accent) 0%,var(--accent-strong) 100%);color:#fff;border-radius:var(--radius);padding:26px 30px;margin:24px 0;box-shadow:var(--shadow-2);}
.callout-med h3{color:#fff;margin:0 0 8px;font-size:1.3rem;}
.callout-med p{color:rgba(255,255,255,.92);margin:0;}
.callout-med strong{color:#fff;}

.rights-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:18px 0;}
@media (max-width:560px){.rights-grid{grid-template-columns:1fr;}}
.right-card{background:var(--surface);border:1px solid var(--separator);border-radius:var(--radius-sm);padding:16px 18px;box-shadow:var(--shadow-1);}
.right-card h4{font-size:1rem;color:var(--accent);margin:0 0 5px;}
.right-card p{font-size:.94rem;margin:0;}

.tbl-wrap{overflow-x:auto;margin:18px 0;border:1px solid var(--separator);border-radius:var(--radius-sm);}
table.data{width:100%;border-collapse:collapse;font-size:.95rem;min-width:560px;}
table.data th{background:var(--accent);color:var(--on-accent);text-align:left;padding:12px 14px;font-family:var(--font-display);}
table.data td{padding:11px 14px;border-top:1px solid var(--separator);color:var(--ink-2);vertical-align:top;}
table.data tr:nth-child(even) td{background:var(--surface-2);}

.tp-card{border:1px solid var(--separator);border-radius:var(--radius-sm);padding:18px 22px;margin:14px 0;background:var(--surface);box-shadow:var(--shadow-1);}
.tp-card h4{color:var(--accent);margin:0 0 8px;font-size:1.1rem;}
.tp-card p{margin:0 0 5px;font-size:.96rem;}

/* ---------- Footer (shared with marketing) ---------- */
footer.site{background:var(--surface-2);border-top:1px solid var(--separator);padding:48px 0 30px;margin-top:40px;}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:30px;}
@media (max-width:760px){.foot-grid{grid-template-columns:1fr;gap:24px;}}
.foot-blurb{color:var(--ink-2);font-size:.96rem;max-width:40ch;margin:12px 0 0;}
.foot-col h4{font-family:var(--font-display);font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin:4px 0 12px;}
.foot-col a{display:block;color:var(--ink-2);text-decoration:none;padding:5px 0;font-weight:600;}
.foot-col a:hover{color:var(--accent);}
.disclaimer{border:1px solid var(--separator);border-radius:var(--radius-sm);padding:16px 20px;margin-top:28px;color:var(--ink-3);font-size:.9rem;line-height:1.55;}
.disclaimer b{color:var(--ink-2);}
.legal-foot{margin-top:26px;padding-top:22px;border-top:1px solid var(--separator);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--ink-3);font-size:.86rem;}
.legal-foot a{color:var(--ink-3);}