/* ==========================================================================
   LIVING — Design tokens
   All colour, type, spacing and motion values live here as custom properties.
   Light / "evening edition" values are paired with light-dark(); the active
   scheme follows prefers-color-scheme unless <html data-theme> overrides it.
   WP: enqueue first in functions.php (wp_enqueue_style 'living-tokens').
   ========================================================================== */

:root {
  color-scheme: light dark;

  /* Brand constants */
  --c-ivory: #FAF7F2;
  --c-ink: #1A1A1A;
  --c-cinnamon: #B5562F;
  --c-tea: #4A5D4F;

  /* Semantic colour (light, dark) */
  --bg:          light-dark(#FAF7F2, #15130F);
  --surface:     light-dark(#F3EEE6, #1C1915);
  --surface-2:   light-dark(#EAE3D8, #26221C);
  --ink:         light-dark(#1A1A1A, #EEE7DB);
  --ink-2:       light-dark(#4F4942, #BFB5A7);
  --ink-3:       light-dark(#6B6359, #9A9083);
  --rule:        light-dark(#E2D9CC, #352F28);
  --rule-strong: light-dark(#1A1A1A, #D9D0C2);
  --accent:      light-dark(#B5562F, #DB8460);
  --accent-ink:  light-dark(#93431F, #EB9F7E);
  --on-accent:   light-dark(#FFFFFF, #15130F);
  --tea:         light-dark(#4A5D4F, #A3BBA9);

  /* Always-dark bands (celebrity band, footer) */
  --band-bg:     light-dark(#1A1A1A, #0C0B09);
  --band-ink:    #F3ECE1;
  --band-ink-2:  #B9B0A2;
  --band-rule:   rgb(243 236 225 / 0.16);
  --band-accent: #E39069;

  --scrim: linear-gradient(to top, rgb(14 11 8 / 0.78) 0%, rgb(14 11 8 / 0.35) 45%, rgb(14 11 8 / 0) 75%);
  --shadow-soft: 0 24px 48px -28px rgb(30 22 14 / 0.35);
  --shadow-cover: 0 40px 70px -30px rgb(30 22 14 / 0.55), 0 14px 28px -14px rgb(30 22 14 / 0.35);

  /* Type */
  --font-display: "Bodoni Moda", "Bodoni 72", Didot, "Times New Roman", serif;
  --font-sans: "Manrope", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Fluid type scale (360px → 1440px) */
  --step--2: clamp(0.69rem, 0.67rem + 0.08vw, 0.75rem);
  --step--1: clamp(0.8rem, 0.78rem + 0.12vw, 0.875rem);
  --step-0:  clamp(1rem, 0.96rem + 0.18vw, 1.0625rem);
  --step-1:  clamp(1.15rem, 1.06rem + 0.4vw, 1.375rem);
  --step-2:  clamp(1.35rem, 1.18rem + 0.75vw, 1.85rem);
  --step-3:  clamp(1.65rem, 1.35rem + 1.3vw, 2.6rem);
  --step-4:  clamp(2rem, 1.5rem + 2.3vw, 3.6rem);
  --step-5:  clamp(2.4rem, 1.6rem + 3.8vw, 5rem);
  --step-6:  clamp(3.2rem, 1.4rem + 8.5vw, 9.5rem);
  --step-mast: clamp(3.5rem, 0.6rem + 14.5vw, 14.5rem);

  /* Fluid space scale */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs:  clamp(0.75rem, 0.7rem + 0.2vw, 0.875rem);
  --space-s:   clamp(1rem, 0.9rem + 0.4vw, 1.25rem);
  --space-m:   clamp(1.5rem, 1.3rem + 0.8vw, 2rem);
  --space-l:   clamp(2rem, 1.6rem + 1.6vw, 3rem);
  --space-xl:  clamp(3rem, 2.3rem + 3vw, 5rem);
  --space-2xl: clamp(4rem, 3rem + 5vw, 8rem);

  /* Layout */
  --page-max: 1440px;
  --gutter: clamp(1.25rem, 4vw, 3.5rem);
  --measure: 680px;
  --header-h: 64px;
  --radius-sm: 3px;
  --radius-lg: 28px;

  /* Motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 250ms;
  --dur: 600ms;
  --dur-slow: 1200ms;

  /* Layers */
  --z-share: 40;
  --z-header: 50;
  --z-progress: 80;
  --z-toast: 90;
}

:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"]  { color-scheme: dark; }