/* L1: shared tokens for all secondary pages — light/parchment palette */
:root {
  --paper: oklch(96% 0.025 85);
  --paper-2: oklch(98% 0.015 85);
  --paper-3: oklch(94% 0.028 80);
  --ink: oklch(20% 0.035 60);
  --ink-2: oklch(36% 0.04 60);
  --ink-3: oklch(54% 0.04 60);
  --gold: oklch(58% 0.13 70);
  --gold-2: oklch(50% 0.13 65);
  --rule-soft: oklch(82% 0.03 80);
  --rule: oklch(72% 0.04 80);
  --seal: oklch(45% 0.15 30);          /* destructive / warning — brand seal */
  --success: oklch(52% 0.13 145);      /* affirmative ✓ */
  --focus-ring: oklch(58% 0.13 70);    /* alias of --gold for keyboard focus */
  --ff-display: 'Playfair Display', Georgia, serif;
  --ff-italic: 'Cormorant Garamond', Georgia, serif;
  --ff-body: 'Inter', system-ui, sans-serif;
  --ff-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--ff-body);
  font-size: clamp(1rem, 0.96rem + 0.30vw, 1.14rem);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--gold-2); transition: color 180ms; }
a:hover { color: var(--gold); }
.crest, .icon-eng {
  display: block; mix-blend-mode: multiply; filter: contrast(1.05);
  user-select: none;
}
.legal-shell { max-width: 760px; margin: 0 auto; padding: 60px 24px 80px; }
.crest-block { width: 80px; height: 80px; margin: 0 auto 16px; }
h1.legal-title {
  font-family: var(--ff-display); font-weight: 800;
  font-size: clamp(2rem, 1.6rem + 2vw, 3rem);
  text-align: center; color: var(--ink);
  letter-spacing: -0.018em; line-height: 1.05;
  margin: 6px 0; text-wrap: balance;
}
.eyebrow {
  text-align: center;
  font-family: var(--ff-display); font-size: 0.92rem; font-weight: 800;
  letter-spacing: 0.18em; text-transform: uppercase;
  /* Mastering: deepen gold-2 toward ink for AA-comfortable contrast on paper */
  color: color-mix(in oklch, var(--gold-2) 78%, var(--ink) 22%);
}
.updated {
  text-align: center; font-size: 0.92rem;
  color: var(--ink-2);
  margin-bottom: 36px; font-style: italic; font-family: var(--ff-italic);
}
h2 {
  font-family: var(--ff-display); font-weight: 700;
  color: var(--ink); font-size: 1.4rem;
  margin: 36px 0 12px; padding-bottom: 6px;
  border-bottom: 1px solid var(--rule-soft);
}
h3 { font-family: var(--ff-display); color: var(--ink); font-size: 1.05rem; margin: 22px 0 8px; }
p, li { color: var(--ink); font-size: 0.98rem; line-height: 1.7; }
ul { padding-left: 22px; margin: 8px 0; }
li { padding: 3px 0; }
.callout {
  border-left: 3px solid var(--gold);
  padding: 14px 20px; margin: 24px 0;
  background: color-mix(in oklch, var(--gold) 6%, var(--paper-2));
  border-radius: 0 3px 3px 0;
  font-size: 0.95rem;
}
.callout strong { color: var(--gold-2); }
.nav-bar {
  padding: 18px 24px; border-bottom: 1px solid var(--rule-soft);
  display: flex; justify-content: space-between; align-items: center;
  background: color-mix(in oklch, var(--paper) 88%, transparent);
  backdrop-filter: blur(12px); position: sticky; top: 0; z-index: 10;
}
.nav-bar a {
  color: var(--ink-2); text-decoration: none;
  font-size: 0.85rem; letter-spacing: 0.16em; text-transform: uppercase;
  font-family: var(--ff-display); font-weight: 600;
}
.nav-bar a:hover { color: var(--ink); }
.legal-footer {
  text-align: center; font-size: 0.875rem; color: var(--ink-2);
  padding: 28px 20px; border-top: 1px solid var(--rule-soft);
  background: var(--paper-3); margin-top: 40px;
  font-family: var(--ff-italic); font-style: italic;
}
.legal-footer p { color: var(--ink-2); font-size: 0.875rem; }
.legal-footer a { color: var(--gold-2); }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; border-radius: 2px; }
@media (max-width: 375px) {
  .legal-shell { padding: 40px 16px 60px; }
  h1.legal-title { font-size: clamp(1.6rem, 7vw, 2rem); }
  .nav-bar { padding: 14px 16px; }
  .nav-bar a { font-size: 0.78rem; letter-spacing: 0.12em; }
}
@media (min-width: 1440px) {
  .legal-shell { max-width: 820px; padding: 80px 24px 100px; }
}
.warn-block {
  border: 2px solid var(--gold);
  padding: 22px 26px; margin: 28px 0;
  background: color-mix(in oklch, var(--gold) 7%, var(--paper-2));
  border-radius: 4px;
}
.warn-block strong { color: var(--gold-2); }
.warn-block ul li { padding: 6px 0; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }