/* ==========================================================================
   ATELIER DH — Design Tokens
   ========================================================================== */

:root {
  /* --- Spacing --- */
  --pad:       clamp(18px, 4vw, 72px);
  --gap:       clamp(18px, 2.5vw, 42px);
  --section-y: clamp(64px, 9vw, 160px);   /* editorial rhythm — more breathing room */

  /* --- Colors (black/white only; gray = opacity) --- */
  --c-bg:   #000;
  --c-fg:   #FFF;
  --c-mute: rgba(255, 255, 255, 0.55);
  --c-rule: rgba(255, 255, 255, 0.12);

  /* --- Typography — Families --- */
  --ff-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ff-accent:  'Source Serif 4', 'Georgia', serif;

  /* --- Typography — Fluid Scale (legacy, retained for backward-compat) --- */
  --fs-xs:   clamp(0.6875rem, 0.5vw + 0.5rem, 0.8125rem);   /* ~11–13 px */
  --fs-sm:   clamp(0.8125rem, 0.6vw + 0.6rem, 0.9375rem);   /* ~13–15 px */
  --fs-base: clamp(0.9375rem, 0.8vw + 0.65rem, 1.125rem);   /* ~15–18 px */
  --fs-md:   clamp(1.125rem, 1.2vw + 0.7rem, 1.5rem);       /* ~18–24 px */
  --fs-lg:   clamp(1.5rem, 2vw + 0.8rem, 2.5rem);           /* ~24–40 px */
  --fs-xl:   clamp(2rem, 3vw + 1rem, 3.5rem);               /* ~32–56 px */
  --fs-hero: clamp(2.5rem, 5vw + 1rem, 5rem);               /* ~40–80 px */

  /* --- Typography — Editorial Scale (new semantic tokens) --- */
  --fs-display: clamp(2.75rem, 6vw + 1rem, 7rem);           /* ~44–112 px — project statements */
  --fs-h1:      clamp(2rem, 3vw + 1rem, 4.5rem);            /* ~32–72 px */
  --fs-h2:      clamp(1.5rem, 2vw + 1rem, 2.5rem);          /* ~24–40 px */
  --fs-body:    clamp(1rem, 0.2vw + 0.95rem, 1.125rem);     /* ~16–18 px */
  --fs-caption: 0.75rem;                                    /* 12 px */

  /* --- Typography — Weights --- */
  --fw-light:   300;
  --fw-regular: 400;
  --fw-medium:  500;

  /* --- Layout --- */
  --max-w:      1440px;
  --max-w-text: 680px;

  /* --- Transitions --- */
  --ease-out:        cubic-bezier(0.16, 1, 0.3, 1);
  --ease-editorial:  cubic-bezier(0.22, 0.61, 0.36, 1);    /* slower, softer — for reveals */
  --dur-fast: 200ms;
  --dur-base: 400ms;
  --dur-slow: 800ms;
  --dur-cinematic: 1600ms;                                  /* hero fade-in + stage reveals */
}
