/* === Design tokens === */
/* Single source of truth. Change these and the whole site changes with them. */

:root {
    /* Colour — 60/30/10: deep brown ground, warm grey type, dusty pink at peaks */
  --color-bg:         #2A2018;   /* 60% — deep espresso brown */
  --color-fg:         #DDD7CF;   /* 30% — warm bone-grey */
  --color-fg-muted:   #8E867D;   /*     — secondary text, eyebrows */
  --color-fg-faint:   #4D4138;   /*     — hairlines, faint borders */
  --color-accent:     #D49AA0;   /* 10% — dusty rose, Ch 2 / 5 / 6 peaks */
  --color-accent-warm:#E8B5B8;   /*     — softer pink, subtle moments */

  /* Type — fluid scale, mobile-first */
  --type-display: clamp(2.75rem, 10vw, 6rem);
  --type-h1:      clamp(2rem, 7vw, 4rem);
  --type-h2:      clamp(1.5rem, 5vw, 2.5rem);
  --type-body:    clamp(1rem, 2.5vw, 1.125rem);
  --type-lede:    clamp(1.25rem, 3.5vw, 1.5rem);
  --type-small:   0.875rem;
  --type-micro:   0.75rem;

  /* Spacing */
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.5rem;
  --space-xl:  4rem;
  --space-2xl: 6rem;
  --space-3xl: 10rem;

  /* Layout */
  --inner-max: 36rem;
  --gutter:    clamp(1.75rem, 6.5vw, 3.5rem);

  /* Motion */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 240ms;
  --duration-base: 480ms;
  --duration-slow: 1200ms;

  /* z-index stack */
  --z-bg:        0;
  --z-mid:      10;
  --z-fg:       20;
  --z-ui:      100;
  --z-preloader: 1000;

  /* Fonts */
  --font-serif: 'Fraunces', 'Times New Roman', Georgia, serif;
  --font-sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;
}

@media (min-width: 768px) {
  :root { --inner-max: 42rem; }
}
@media (min-width: 1200px) {
  :root { --inner-max: 48rem; }
}