/*
  Luna Spiegel — design tokens
  Source: docs/tasks/issue-7-initial-site/04-concept-reviewed.md §2

  Self-hosted fonts only (must-fix GDPR requirement from Elli — see
  05-storyboard-reviewed.md, "Bilingual structure"). Every @font-face
  below points at /assets/fonts/*.woff2 shipped inside this repo.
  Never add a <link> to fonts.googleapis.com / fonts.gstatic.com or any
  other third-party font host, including "temporarily".
*/

/* ---------- Self-hosted fonts ---------- */

@font-face {
  font-family: "Fraunces Variable";
  src: url("../fonts/Fraunces-Roman.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Fraunces Variable";
  src: url("../fonts/Fraunces-Italic.woff2") format("woff2");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Inter Variable";
  src: url("../fonts/InterVariable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Inter Variable";
  src: url("../fonts/InterVariable-Italic.woff2") format("woff2");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Space Mono";
  src: url("../fonts/SpaceMono-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Space Mono";
  src: url("../fonts/SpaceMono-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Space Mono";
  src: url("../fonts/SpaceMono-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---------- Color ---------- */
  --paper: #faf6f0;
  --ink: #1b1712;
  --night: #181310;
  --night-ink: #f5efe6;
  --brass: #96612b;
  --brass-tint: #d9ae73;
  --rose: #a63d56;
  --rose-tint: #e7a2af;
  --wash-teal: #1f4c4a;
  --paper-brass: #f5eee1;
  --paper-rose: #f6e9ea;

  /*
    --brass-deep: a darkened brass used specifically for small mono-set
    eyebrow labels on light backgrounds. Full-strength --brass measures
    ~4.4-4.8:1 depending on the exact light tint behind it — enough on
    plain --paper, but not reliably >=4.5:1 on --paper-rose/--paper-brass
    at the ~13-14px size eyebrows are set at. Verified against the WCAG
    contrast formula (see scripts used during build): --brass-deep clears
    ~6:1 on every light background token above. Not part of Elli's
    original token table — added at implementation to close a small AA
    gap her review flagged as "verify with a contrast checker."
  */
  --brass-deep: #7a4f22;

  /*
    Contrast rule of thumb (Elli, 04-concept-reviewed.md §2.1):
    full-strength --brass / --rose = large text (>=24px), icons,
    borders, graphic fills, on either background. Small/body text
    always uses the *-tint variant on --night, or the base color on
    --paper. These are Elli's best manual estimates against WCAG
    formulas — re-verify with a contrast checker before public launch.
  */

  /* ---------- Type families ---------- */
  --font-display: "Fraunces Variable", ui-serif, Georgia, "Iowan Old Style", serif;
  --font-body: "Inter Variable", -apple-system, BlinkMacSystemFont, "Segoe UI",
    Helvetica, Arial, sans-serif;
  --font-mono: "Space Mono", ui-monospace, "SFMono-Regular", "JetBrains Mono",
    Consolas, monospace;

  /* ---------- Fluid type scale ---------- */
  --size-h1: clamp(2.25rem, 6vw, 4.5rem);
  --size-h2: clamp(1.5rem, 4vw, 2.5rem);
  --size-h3: clamp(1.125rem, 2.5vw, 1.375rem);
  --size-lede: clamp(1.125rem, 1.5vw, 1.25rem);
  --size-body: 1rem;
  --size-mono: clamp(0.8125rem, 1vw, 0.875rem);

  /* ---------- Layout ---------- */
  --measure: 70ch;
  --wrapper-max: 1280px;
  --section-padding: clamp(4rem, 10vw, 8rem);
  --gutter: clamp(1.25rem, 4vw, 3rem);

  /* ---------- Motion ---------- */
  --motion-fast: 250ms;
  --motion-medium: 350ms;
  --motion-slow: 600ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  color-scheme: light;
}