/* Gili — shared styling for the legal / support pages.
   The landing page (index.html) keeps its own inline styles; these documents are
   plain reading pages: high contrast, one column, no scroll effects. */

:root{
  --day-3:#0A5C74;
  --night-2:#0A1F35;
  --night-3:#04101E;
  --ink:#F4E9D8;
  --ink-soft:#C3DADC;
  --ink-faint:#88A6AF;
  --coral:#FF8A5B;
  --line:rgba(244,233,216,.16);
  --panel:rgba(255,255,255,.035);

  --display:750 clamp(2rem,4.5vw,3rem)/1.1 "Avenir Next","Trebuchet MS","Segoe UI",system-ui,sans-serif;
  --body:400 1.02rem/1.72 system-ui,-apple-system,"Segoe UI",sans-serif;
  --label:600 .72rem/1 "Avenir Next","Segoe UI",system-ui,sans-serif;
}

*{box-sizing:border-box}
body{
  margin:0;
  font:var(--body);
  color:var(--ink);
  background:linear-gradient(180deg,var(--night-2),var(--night-3) 60%) fixed;
  -webkit-font-smoothing:antialiased;
}

.wrap{max-width:48rem;margin:0 auto;padding:0 clamp(1.25rem,5vw,2.5rem)}

/* ── Masthead ─────────────────────────────────────── */
.top{border-bottom:1px solid var(--line);padding:1.5rem 0;margin-bottom:clamp(2.5rem,7vh,4rem)}
.top .wrap{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:baseline;justify-content:space-between}
.brand{font:var(--label);letter-spacing:.2em;text-transform:uppercase;color:var(--coral);text-decoration:none}
.top nav{display:flex;flex-wrap:wrap;gap:1.25rem;font-size:.9rem}
.top nav a{color:var(--ink-faint);text-decoration:none}
.top nav a[aria-current="page"]{color:var(--ink)}
.top nav a:hover,.top nav a:focus-visible{color:var(--ink)}

/* ── Document body ────────────────────────────────── */
h1{font:var(--display);letter-spacing:-.02em;margin:0 0 .6rem;text-wrap:balance}
.dates{color:var(--ink-faint);font-size:.9rem;margin:0 0 3rem}
.dates b{color:var(--ink-soft);font-weight:600}

h2{font-size:1.28rem;letter-spacing:-.01em;margin:3rem 0 .9rem;font-weight:700}
h3{font-size:1.02rem;margin:2rem 0 .6rem;font-weight:650;color:var(--ink-soft)}
p,li{color:var(--ink-soft)}
p{margin:0 0 1.1rem}
ul{margin:0 0 1.1rem;padding-left:1.2rem}
li{margin-bottom:.55rem}
li::marker{color:var(--coral)}
strong{color:var(--ink);font-weight:650}
a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--coral);text-underline-offset:3px}

.lead{font-size:1.1rem;color:var(--ink)}

/* Data table — what we collect */
.tablewrap{overflow-x:auto;margin:0 0 1.4rem;border:1px solid var(--line);border-radius:.7rem;background:var(--panel)}
table{border-collapse:collapse;width:100%;min-width:34rem;font-size:.94rem}
th,td{text-align:left;padding:.8rem 1rem;border-bottom:1px solid var(--line);vertical-align:top}
th{font:var(--label);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);white-space:nowrap}
tr:last-child td{border-bottom:none}
td:first-child{color:var(--ink);font-weight:600}

.callout{border-left:3px solid var(--coral);background:var(--panel);padding:1rem 1.2rem;border-radius:0 .5rem .5rem 0;margin:0 0 1.4rem}
.callout p:last-child{margin-bottom:0}

footer{border-top:1px solid var(--line);margin-top:clamp(3rem,8vh,5rem);padding:2rem 0 3.5rem;color:var(--ink-faint);font-size:.88rem}
footer .wrap{display:flex;flex-wrap:wrap;gap:1rem 2.5rem;justify-content:space-between}
footer a{color:var(--ink-soft);text-decoration:none}
footer nav{display:flex;flex-wrap:wrap;gap:1.25rem}

:focus-visible{outline:2px solid var(--coral);outline-offset:3px;border-radius:4px}