/* Ensure's legal pages (privacy/, terms/): the site's colours and type, set for reading */
:root {
  --abyss: #000A22;
  --navy: #011542;
  --steel: #8FA3C7;
  --paper: #EEF2F8;
  --ink: #CDD7E8;
  --green: #31D391;
  --font: "Archivo", "Archivo Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;
  --gutter: clamp(18px, 4vw, 40px);
}
/* a metric match for Archivo, so the late font swap does not move the text */
@font-face { font-family: "Archivo Fallback"; src: local("Arial"), local("Helvetica"); size-adjust: 98.7%; ascent-override: 89.2%; descent-override: 21.3%; line-gap-override: 0%; }
* { box-sizing: border-box; margin: 0; padding: 0; }
html {
  background: var(--abyss); color: var(--ink); font-family: var(--font);
  -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; font-synthesis: none; scroll-padding-top: 20px;
}
body {
  min-height: 100vh;
  background: radial-gradient(70% 420px at 86% 0%, rgba(10,36,99,.85) 0%, rgba(3,22,70,.4) 50%, rgba(0,10,34,0) 100%) no-repeat, var(--abyss);
}
a { color: var(--paper); text-underline-offset: 3px; text-decoration-thickness: 1px; text-decoration-color: rgba(238,242,248,.45); }
a:hover { text-decoration-color: var(--paper); }
:focus-visible { outline: 2px solid var(--paper); outline-offset: 3px; border-radius: 2px; }
.skip {
  position: absolute; left: 12px; top: 12px; z-index: 5; padding: 10px 16px; border-radius: 8px;
  background: var(--navy); border: 1px solid var(--paper); text-decoration: none; font-size: 15px;
  clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; white-space: nowrap;
}
.skip:focus { clip-path: none; width: auto; height: auto; overflow: visible; }

/* the bar: the wordmark home, and the two legal pages (the one you are on in green) */
.bar { display: flex; align-items: center; justify-content: space-between; gap: 12px 24px; flex-wrap: wrap; max-width: 1180px; margin: 0 auto; padding: 22px var(--gutter); }
.home { display: block; padding: 6px 0; color: var(--paper); }
.wm { display: block; width: 124px; height: auto; }
.bar nav { display: flex; gap: 22px; }
.bar nav a { padding: 6px 0; font-size: 15px; font-weight: 500; color: var(--steel); text-decoration: none; }
.bar nav a:hover { color: var(--ink); }
.bar nav a[aria-current="page"] { color: var(--green); box-shadow: inset 0 -1.5px 0 var(--green); }

main { max-width: 760px; margin: 0 auto; padding: clamp(26px, 6vw, 64px) var(--gutter) 64px; }
h1 { font-weight: 800; font-stretch: 86%; font-size: clamp(44px, 7.4vw, 76px); line-height: .95; letter-spacing: -.033em; color: var(--paper); }
.eff { margin-top: 14px; font-size: 15px; color: var(--steel); }
h2 {
  margin-top: clamp(40px, 5vw, 56px); font-weight: 760; font-stretch: 92%; font-size: clamp(25px, 3.2vw, 31px);
  line-height: 1.12; letter-spacing: -.016em; color: var(--paper); text-wrap: balance;
}
h3 { margin-top: 26px; font-size: 18px; font-weight: 650; line-height: 1.3; color: var(--paper); }
p, li { font-size: clamp(16px, 1.1vw, 17.5px); line-height: 1.62; text-wrap: pretty; }
h2 + p, h2 + ul, h3 + p, h3 + ul { margin-top: 12px; }
p + p, p + ul, ul + p, ul + h3 + p { margin-top: 14px; }
ul { padding-left: 1.25em; }
li + li { margin-top: 7px; }
li::marker { color: var(--steel); }
strong { color: var(--paper); font-weight: 650; }

/* the short version first */
.plain { margin-top: clamp(26px, 4vw, 40px); padding: 22px 26px 24px; border: 1px solid rgba(143,163,199,.3); border-radius: 16px; background: rgba(1,21,66,.55); }
.plain h2 { margin-top: 0; font-size: 19px; font-stretch: 100%; letter-spacing: 0; }
.plain ul { margin-top: 12px; }
.toc { margin-top: 30px; padding-bottom: 28px; border-bottom: 1px solid rgba(143,163,199,.2); }
.toc + p { margin-top: 30px; }
.toc h2 { margin-top: 0; font-size: 15px; font-weight: 600; font-stretch: 100%; letter-spacing: 0; color: var(--steel); }
.toc ol { margin-top: 10px; list-style: none; display: grid; gap: 4px 28px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.toc li { font-size: 15px; line-height: 1.5; }
.toc li + li { margin-top: 0; }
.toc a { color: var(--ink); text-decoration-color: rgba(238,242,248,.25); }

.foot { max-width: 760px; margin: 0 auto; padding: 26px var(--gutter) 44px; border-top: 1px solid rgba(143,163,199,.22); font-size: 14px; line-height: 1.6; color: var(--steel); }
.foot p { font-size: 14px; }
.foot p + p { margin-top: 6px; }
.foot a { color: var(--ink); }

@media print {
  html, body { background: #fff !important; color: #011542; }
  .skip, .bar nav, .toc { display: none !important; }
  .home { color: #011542; }
  h1, h2, h3, strong, a { color: #011542 !important; }
  p, li, .eff, .foot, .foot a { color: #2B3A5C !important; }
  .plain { background: none; border-color: #C9D2E3; }
  main, .foot { max-width: none; padding-left: 0; padding-right: 0; }
  .bar { padding-left: 0; padding-right: 0; }
  a { text-decoration: none; }
  h2, h3 { break-after: avoid; }
}