/* Field Frames — legal pages. A plain vertical document that borrows the
   gallery's palette and two faces (Cormorant Garamond for the text, IBM
   Plex Mono for labels) but none of its filmstrip machinery. Dark by
   default, like the site; light when html[data-theme="light"] is set. */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500&family=IBM+Plex+Mono:wght@400&display=swap");

:root {
  color-scheme: dark;
  --ink:       light-dark(#e9e5d9, #15140f);
  --paper:     light-dark(#15140f, #e9e5d9);
  --paper-soft:light-dark(#2a2820, #d6d1c4);
  --paper-dim: light-dark(#5c584d, #9c988b);
  --lichen:    light-dark(#54644a, #93a382);
  --hair:      rgb(from var(--paper) r g b / 0.14);
  --mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --display: "Cormorant Garamond", Georgia, serif;
}
html[data-theme="light"] { color-scheme: light; }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--paper-soft);
  font-family: var(--display);
  font-size: clamp(1.05rem, 0.95rem + 0.4vw, 1.25rem);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
main {
  max-width: 44rem;
  margin: 0 auto;
  padding: clamp(2rem, 6vw, 5rem) clamp(1rem, 5vw, 2.5rem) 5rem;
}
.eyebrow, .meta, nav.legal-nav, footer {
  font-family: var(--mono);
  font-size: 0.66rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--paper-dim);
}
.eyebrow a { color: var(--paper-dim); text-decoration: none; }
.eyebrow a:hover { color: var(--paper); }
.eyebrow a::before { content: "\2190\00a0"; }
h1 {
  font-weight: 500;
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1.05;
  letter-spacing: -0.01em;
  color: var(--paper);
  margin: 0.6em 0 0.25em;
}
.meta { margin: 0 0 3rem; }
h2 {
  font-weight: 600;
  font-size: 1.35em;
  line-height: 1.2;
  color: var(--paper);
  margin: 2.2em 0 0.5em;
}
p, li { margin: 0 0 0.9em; }
ul { padding-left: 1.2em; }
li { margin-bottom: 0.4em; }
a { color: var(--lichen); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.15em; }
a:hover { color: var(--paper); }
strong { color: var(--paper); font-weight: 600; }
.note {
  border-left: 1px solid var(--lichen);
  padding: 0.2em 0 0.2em 1em;
  color: var(--paper-soft);
  font-style: italic;
}
.placeholder { color: var(--lichen); }
hr { border: 0; border-top: 1px solid var(--hair); margin: 3rem 0 1.5rem; }
nav.legal-nav ul, footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 0.6em 1.6em; }
nav.legal-nav a, footer a { color: var(--paper-dim); text-decoration: none; }
nav.legal-nav a:hover, footer a:hover { color: var(--paper); }
nav.legal-nav a[aria-current="page"] { color: var(--lichen); }
footer p { margin-top: 1.2em; text-transform: none; letter-spacing: 0.04em; }

/* The hub */
.hub { list-style: none; padding: 0; margin: 0; }
.hub li { padding: 1.2em 0; border-top: 1px solid var(--hair); margin: 0; }
.hub li:last-child { border-bottom: 1px solid var(--hair); }
.hub a { font-size: 1.35em; color: var(--paper); text-decoration: none; }
.hub a:hover { color: var(--lichen); }
.hub .desc { display: block; margin-top: 0.25em; color: var(--paper-dim); }
