/* ============================================================
   legal.css — privacy.html and terms.html.

   Loads after tokens.css and site-chrome.css. site-chrome.css has
   no base reset (styles.css carries it for the homepage family), so
   the reset lives here, then one prose column on Paper.
   ============================================================ */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--sans);
  font-size: var(--text-base);
  line-height: 1.43;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font: inherit;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

h1,
h2,
h3,
p,
ul {
  margin: 0;
}

.legal {
  padding: clamp(56px, 7vw, 96px) 0 var(--section-y);
}

/* Section-heading formula: eyebrow, h1, one-line meta. */
.legal__head .eyebrow {
  color: var(--cobalt);
}

.legal__head h1 {
  margin-top: 20px;
  font-family: var(--serif);
  font-size: clamp(32px, 3.4vw, 40px);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-display);
  line-height: 1.06;
}

.legal__head > p:not(.eyebrow) {
  margin-top: 20px;
  color: #555b5b;
  font-size: var(--text-base);
  line-height: 1.5;
}

/* #555b5b is the off-token meta grey; no token exists, so the dark ramp
   value is fixed here to keep it legible on the dark plane. */
html.dark .legal__head > p:not(.eyebrow) {
  color: #bbbdc9;
}

.legal__prose {
  margin-top: clamp(48px, 6vw, 72px);
  color: var(--ink-soft);
  font-size: var(--text-md);
  line-height: 1.65;
}

.legal__prose section + section {
  margin-top: 48px;
}

.legal__prose section > * + *,
.legal__notice > * + * {
  margin-top: 12px;
}

.legal__prose h2,
.legal__prose h3 {
  color: var(--ink);
  font-family: var(--serif);
  font-weight: var(--weight-medium);
}

.legal__prose h2 {
  font-size: var(--text-xl);
  letter-spacing: -0.02em;
  line-height: 1.25;
}

.legal__prose h2 + * {
  margin-top: 16px;
}

.legal__prose h3 {
  margin-top: 28px;
  font-size: var(--text-lg);
  letter-spacing: -0.015em;
  line-height: 1.3;
}

.legal__prose ul {
  padding-left: 22px;
  list-style: disc;
}

.legal__prose li + li {
  margin-top: 8px;
}

.legal__prose li::marker {
  color: #555b5b;
}

/* Same off-token meta grey as the byline above; follows the same ramp. */
html.dark .legal__prose li::marker {
  color: #bbbdc9;
}

.legal__prose strong {
  color: var(--ink);
  font-weight: var(--weight-medium);
}

.legal__prose a {
  color: var(--cobalt);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.legal__prose a:hover {
  color: var(--cobalt-dark);
}

/* Conspicuous by weight and colour, not by capitals or a box. */
.legal__notice p {
  color: var(--ink);
  font-weight: var(--weight-medium);
}

@media (max-width: 720px) {
  .legal__prose section + section {
    margin-top: 40px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}
