/* tokens.css — Foto Freisleben design tokens
   Concept: "Werkstatt des Lichts" — warmes, analog geprägtes Fotofachgeschäft am Bodensee.
   Palette: Dunkelkammer-Anthrazit + warmes Papier/Creme, Marken-Kobalt (aus dem echten
   freisleben-Schriftzug), ein Safelight-Bernstein als sparsamer Akzent. */

:root {
  /* ---- Colour ---- */
  --c-bg:          #F4EEE3;   /* warm paper */
  --c-surface:     #FBF7EF;   /* lifted card surface */
  --c-surface-2:   #EAE0CF;   /* recessed / muted surface */
  --c-ink:         #211C16;   /* near-black warm ink */
  --c-ink-soft:    #423A30;
  --c-muted:       #6E6456;   /* secondary text */
  --c-line:        #DBD0BD;   /* hairlines on light */

  --c-dark:        #16130F;   /* darkroom band */
  --c-dark-2:      #211C15;
  --c-dark-line:   #3A332888;

  --c-brand:       #2A45C9;   /* cobalt — from the real Freisleben wordmark */
  --c-brand-600:   #2138A8;
  --c-brand-300:   #7E91EA;

  --c-accent:      #E0973B;   /* safelight amber — used < 5% */
  --c-accent-600:  #C67C24;

  --c-cream:       #F4EEE3;   /* text on dark */
  --c-cream-soft:  #C8BCA6;

  /* ---- Typography ---- */
  --ff-display: "Hoefler Text", "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Times New Roman", serif;
  --ff-text:    ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --ff-mono:    ui-monospace, "SFMono-Regular", "Cascadia Code", "Roboto Mono", Menlo, Consolas, monospace;

  /* Fluid type scale — ratio ~1.25, clamps 360 → 1280 */
  --step--2: clamp(0.694rem, 0.66rem + 0.15vw, 0.78rem);
  --step--1: clamp(0.833rem, 0.79rem + 0.2vw, 0.95rem);
  --step-0:  clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --step-1:  clamp(1.2rem, 1.12rem + 0.4vw, 1.4rem);
  --step-2:  clamp(1.44rem, 1.31rem + 0.65vw, 1.85rem);
  --step-3:  clamp(1.728rem, 1.5rem + 1.1vw, 2.6rem);
  --step-4:  clamp(2.07rem, 1.66rem + 2vw, 3.6rem);
  --step-5:  clamp(2.6rem, 1.9rem + 3.4vw, 5.2rem);
  --step-6:  clamp(3.1rem, 1.9rem + 5.6vw, 7rem);

  /* ---- Spacing — ratio 1.5 ---- */
  --sp-3xs: 0.25rem;
  --sp-2xs: 0.5rem;
  --sp-xs:  0.75rem;
  --sp-sm:  1rem;
  --sp-md:  1.5rem;
  --sp-lg:  2.25rem;
  --sp-xl:  3.5rem;
  --sp-2xl: 5.5rem;
  --sp-3xl: 8rem;

  /* ---- Radius ---- */
  --r-sm:   4px;
  --r-md:   10px;
  --r-lg:   20px;
  --r-pill: 999px;

  /* ---- Borders / shadows (warm-tinted) ---- */
  --bw: 1px;
  --shadow-1: 0 1px 2px rgba(33,28,20,.06), 0 2px 6px rgba(33,28,20,.05);
  --shadow-2: 0 6px 18px rgba(33,28,20,.10), 0 2px 6px rgba(33,28,20,.06);
  --shadow-3: 0 24px 60px rgba(22,19,15,.22), 0 8px 24px rgba(22,19,15,.14);

  /* ---- Motion ---- */
  --ease-out:   cubic-bezier(.22,.61,.36,1);
  --ease-spring:cubic-bezier(.34,1.4,.64,1);
  --ease-inout: cubic-bezier(.65,.05,.36,1);
  --dur-1: .18s;
  --dur-2: .34s;
  --dur-3: .6s;
  --dur-4: .9s;

  /* ---- Layout ---- */
  --container: 1180px;
  --container-wide: 1380px;
  --gutter: clamp(1.1rem, 4vw, 2.75rem);
  --measure: 64ch;
  --header-h: 76px;
}