/* Shared styles for privacy.html, terms.html, accessibility.html */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --navy: #101c36;
  --navy-deep: #0a1226;
  --navy-foot: #070d1c;
  --lime: #86b60a;
  --lime-hi: #9fd10c;
  --lime-ink: #4f6d06;
  --paper: #eef0ec;
  --ink: #141d30;
  --ink-soft: #485468;
  --on-dark-soft: rgba(238,241,246,.74);
  --hair-dark: rgba(238,241,246,.16);
  --hair-light: rgba(16,28,54,.2);
  --gutter: clamp(24px, 6vw, 96px);
  --display: 'Big Shoulders Display', 'Arial Narrow', Impact, sans-serif;
  --body: 'Barlow', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--body); font-size: 18px; line-height: 1.65;
  color: var(--ink); background: var(--paper);
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--navy); outline-offset: 3px; }

.skip {
  position: absolute; left: 12px; top: -64px; z-index: 300;
  background: var(--lime); color: var(--navy-deep);
  padding: 12px 18px; font-weight: 600; text-decoration: none; transition: top .2s;
}
.skip:focus { top: 12px; }

/* header */
.lh {
  background: var(--navy-deep); color: #fff;
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px var(--gutter);
}
.lh img { height: 84px; width: auto; }
.lh a { text-decoration: none; }
.lh .back {
  font-weight: 600; font-size: 17px; color: #fff;
  text-decoration: underline; text-decoration-color: var(--lime);
  text-decoration-thickness: 2px; text-underline-offset: 8px;
}
.lh :focus-visible, .lf :focus-visible { outline-color: var(--lime); }

/* page title band */
.lt { background: var(--navy); color: #fff; padding: clamp(48px, 7vw, 96px) var(--gutter); }
.lt h1 {
  font-family: var(--display); font-weight: 900; text-transform: uppercase;
  font-size: clamp(48px, 7vw, 104px); line-height: .92;
}
.lt p { margin-top: 16px; color: var(--on-dark-soft); font-size: 17px; }

/* prose */
.prose { padding: clamp(48px, 7vw, 96px) var(--gutter); }
.prose-inner { max-width: 44rem; }
.prose h2 {
  font-family: var(--display); font-weight: 800; text-transform: uppercase;
  font-size: clamp(26px, 2.6vw, 36px); line-height: 1; color: var(--navy);
  margin: 2.2em 0 .5em; padding-top: 1.2em; border-top: 1px solid var(--hair-light);
}
.prose h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.prose p { margin-bottom: 1em; color: var(--ink); }
.prose ul { margin: 0 0 1em 1.2em; }
.prose li { margin-bottom: .4em; }
.prose a { color: var(--navy); text-decoration-color: var(--lime); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.prose a:hover { text-decoration-color: var(--navy); }

/* footer */
.lf { background: var(--navy-foot); color: var(--on-dark-soft); padding: 32px var(--gutter) 28px; }
.lf-row { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px 28px; font-size: 15px; }
.lf nav { display: flex; flex-wrap: wrap; gap: 8px 28px; }
.lf a { text-decoration: none; transition: color .2s; }
.lf a:hover { color: var(--lime); }

@media (max-width: 560px) {
  .lh img { height: 64px; }
  body { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
}
