/* ─────────────────────────────────────────────────────────────────
   Pebble & Silver — v1.5 legal / policy prose
   Ported from the live site.css `main.legal` rules onto v1.5 tokens so the
   policy body reads identically under the v1.5 chrome (_LayoutV15). Loaded only
   by the legal pages via their @section Styles, after tokens.css + site.css.
   The header/footer/body chrome comes from v1.5 site.css; this file styles only
   the rendered policy content inside <main class="legal">.
   ───────────────────────────────────────────────────────────────── */

main.legal {
  max-width: var(--container-text);
  margin-inline: auto;
  padding: 56px 24px 72px;
}

main.legal h1 {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: var(--weight-medium);
  font-size: 32px;
  letter-spacing: var(--tracking-tight);
  line-height: 1.05;
  color: var(--color-green-deep);
  margin: 0 0 24px;
}

main.legal h2 {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: var(--weight-medium);
  font-size: 24px;
  letter-spacing: var(--tracking-tight);
  line-height: 1.1;
  color: var(--color-green-deep);
  margin: 36px 0 16px;
}

main.legal h3 {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: var(--weight-medium);
  font-size: 20px;
  letter-spacing: var(--tracking-snug);
  line-height: 1.15;
  color: var(--color-green-deep);
  margin: 24px 0 12px;
}

main.legal h5.legal-last-modified {
  font-family: var(--font-mono);
  font-weight: var(--weight-medium);
  font-size: 11px;
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--color-stone);
  margin: 0 0 16px;
}

main.legal p { margin: 0 0 16px; }
main.legal ul { margin: 0 0 16px; padding-left: 24px; }
main.legal li { margin: 0 0 8px; }

main.legal a {
  color: var(--signal-link);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: color var(--duration-fast) var(--ease-standard);
}
main.legal a:hover,
main.legal a:focus-visible {
  color: var(--color-green-deep);
  outline: none;
}

/* Desktop bumps (mobile is the default above), mirroring the live legal scale. */
@media (min-width: 768px) {
  main.legal { padding: 80px 24px 96px; }
  main.legal h1 { font-size: 44px; margin-bottom: 32px; }
  main.legal h2 { font-size: 32px; margin-top: 48px; }
  main.legal h3 { font-size: 24px; margin-top: 32px; }
}
