/* Design tokens — shared across both color schemes and both font pairings.
   Scheme/pairing overrides live in schemes.css and fonts.css and re-declare
   only the color/font custom properties defined here. */

:root {
  /* Literary color scheme (default) */
  --color-ink: #211D1A;
  --color-parchment: #FAF6EF;
  --color-parchment-dim: #F1EADC;
  --color-plum-deep: #2E1F2E;
  --color-plum-deep-text: #F1EADC;
  --color-accent: #B5502F;
  --color-accent-soft: #E7C9A9;
  --color-accent-2: #B5502F;
  --color-accent-3: #E7C9A9;
  --color-line: #DED4C2;

  /* Semantic aliases — components consume these, never the raw colors above */
  --surface-page: var(--color-parchment);
  --surface-alt: var(--color-parchment-dim);
  --surface-inverse: var(--color-plum-deep);
  --text-body: var(--color-ink);
  --text-inverse: var(--color-plum-deep-text);
  --text-link: var(--color-accent);
  --border-subtle: var(--color-line);

  /* Literary font pairing (default) */
  --font-display: "Fraunces", ui-serif, Georgia, serif;
  --font-body: "Source Sans 3", ui-sans-serif, system-ui, sans-serif;

  /* Fluid type scale */
  --step--1: clamp(0.833rem, 0.80rem + 0.16vw, 0.9rem);
  --step-0:  clamp(1rem,    0.96rem + 0.2vw,  1.125rem);
  --step-1:  clamp(1.2rem,  1.1rem + 0.5vw,   1.4rem);
  --step-2:  clamp(1.44rem, 1.28rem + 0.8vw,  1.8rem);
  --step-3:  clamp(1.8rem,  1.5rem + 1.5vw,   2.4rem);
  --step-4:  clamp(2.25rem, 1.8rem + 2.3vw,   3.2rem);
  --step-5:  clamp(2.8rem,  2.1rem + 3.5vw,   4.4rem);

  /* Fluid spacing scale */
  --space-3xs: clamp(0.25rem, 0.23rem + 0.1vw, 0.3rem);
  --space-2xs: clamp(0.5rem, 0.46rem + 0.2vw, 0.6rem);
  --space-xs:  clamp(0.75rem, 0.7rem + 0.25vw, 0.9rem);
  --space-s:   clamp(1rem, 0.93rem + 0.35vw, 1.25rem);
  --space-m:   clamp(1.5rem, 1.4rem + 0.5vw, 1.85rem);
  --space-l:   clamp(2rem, 1.8rem + 1vw, 2.75rem);
  --space-xl:  clamp(3rem, 2.6rem + 2vw, 4.5rem);
  --space-2xl: clamp(4.5rem, 3.8rem + 3.5vw, 7rem);

  /* Layout */
  --content-max: 72rem;
  --prose-max: 40rem;
  --radius-s: 4px;
  --radius-m: 10px;
  --radius-l: 20px;

  /* Motion */
  --ease-standard: cubic-bezier(0.2, 0.65, 0.3, 1);
  --duration-fast: 150ms;
  --duration-base: 350ms;
  --duration-slow: 600ms;

  /* Header */
  --header-height-sticky: 4.5rem;
}

@media (max-width: 46rem) {
  :root {
    --header-height-sticky: 3.75rem;
  }
}