/* legal.css — the privacy page: one readable column on bone, under the shared
   solid header and dark footer from chrome.css. Consumes tokens.css. */

.gn-legal{background:var(--bone);margin:0;font-family:var(--sans);color:var(--ink);
  font-feature-settings:"ss01","cv11";-webkit-font-smoothing:antialiased}
.gn-legal *{box-sizing:border-box}
.gn-legal a:focus-visible{outline:2px solid var(--navy);outline-offset:3px;border-radius:4px}

/* Skip-to-content link — hidden until keyboard-focused (mirrors marketing.css) */
.gn-skip{position:absolute;top:8px;left:8px;padding:12px 18px;background:var(--ink);color:var(--bone);
  font-family:var(--sans);font-weight:500;font-size:14px;border-radius:6px;
  text-decoration:none;z-index:1000;
  transform:translateY(-200%);transition:transform .15s var(--ease)}
.gn-skip:focus{transform:translateY(0);outline:2px solid var(--ochre);outline-offset:2px}

/* ── Column ─────────────────────────────────────────────────── */
.legal{max-width:760px;margin:0 auto;padding:56px 80px 120px}
.legal-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--fog);margin:0 0 20px;display:inline-flex;align-items:center;gap:8px}
.legal-eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--rust)}
.legal h1{font-family:var(--serif);font-weight:400;font-size:56px;line-height:1.04;
  letter-spacing:-0.022em;margin:0 0 20px}
/* Two classes on purpose: `.legal p` and `.legal ul` below would otherwise override these. */
.legal .legal-lede{font-family:var(--serif);font-size:22px;line-height:1.45;letter-spacing:-0.005em;
  color:var(--ink);margin:0 0 18px;max-width:640px}
.legal .legal-meta{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--fog);margin:0 0 28px}

/* Contents — a paper card, numbered like the section headings.
   Nine entries flow down two columns, five then four: the row count is ceil(entries / 2),
   so change repeat(5,…) if a section is added or removed. One column on phones (see below). */
.legal-contents{margin:4px 0 0;padding:20px 24px 22px;background:var(--paper);border:1px solid var(--line);border-radius:10px}
.legal-contents .lc-h{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--fog);margin:0 0 14px}
.legal .legal-contents ol{margin:0;padding:0;list-style:none;display:grid;grid-auto-flow:column;
  grid-template-rows:repeat(5,auto);grid-template-columns:1fr 1fr;gap:10px 36px}
.legal .legal-contents li{margin:0;font-size:15px;line-height:1.4}
.legal .legal-contents li + li{margin-top:0}
.legal .legal-contents a{display:flex;gap:12px;align-items:baseline;color:var(--ink);text-decoration:none}
.legal-contents a .n{font-family:var(--mono);font-size:11px;color:var(--rust);min-width:10px}
.legal-contents a:hover .t{text-decoration:underline;text-underline-offset:3px}
.legal .legal-contents + section{border-top:0;margin-top:16px}

/* Sections */
.legal section{padding:32px 0 8px;border-top:1px solid var(--line);scroll-margin-top:24px}
.legal section:first-of-type{margin-top:32px}
.legal h2{font-family:var(--sans);font-weight:500;font-size:24px;line-height:1.2;
  letter-spacing:-0.015em;margin:0 0 14px}
.legal p,.legal li{font-family:var(--sans);font-size:16.5px;line-height:1.65;color:var(--ink);margin:0}
.legal p + p{margin-top:14px}
.legal p + ul,.legal ul + p{margin-top:14px}
.legal ul{margin:0 0 24px;padding-left:22px}
.legal li + li{margin-top:8px}
.legal p:last-child{margin-bottom:24px}
.legal a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.legal a:hover{color:var(--rust)}
/* nowrap: a host name such as us-west-2.amazonaws.com must not break at its hyphens. Keep code
   snippets short (the longest today fits a 320px phone); a long one would need a break of its own. */
.legal code{font-family:var(--mono);font-size:.88em;background:var(--vellum);padding:1px 6px;border-radius:4px;white-space:nowrap}
.legal strong{font-weight:500}
/* The consent sentence, quoted exactly as the forms show it */
.legal-quote{margin:14px 0;padding:14px 18px;border-left:3px solid var(--navy);background:var(--paper);
  font-family:var(--sans);font-size:16.5px;line-height:1.6;color:var(--ink)}
.legal-quote + p{margin-top:14px}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width:1024px){ .legal{padding:48px 40px 96px} }
@media (max-width:720px){
  .legal{padding:40px 24px 72px}
  .legal h1{font-size:38px;line-height:1.06}
  .legal .legal-lede{font-size:19px}
  .legal .legal-contents ol{grid-auto-flow:row;grid-template-rows:none;grid-template-columns:1fr}
  .legal h2{font-size:21px}
  .legal p,.legal li{font-size:15.5px}
}
