/* Design tokens — Yoraflow */

:root {
  /* Couleurs — fond & neutres, crème chaud + jaune beurre */
  --color-cream: #FEFBF3;
  --color-cream-alt: #FBF2D2;
  --color-sand: #F5E8AA;
  --color-blush: #F3D3DC;
  --color-white: #FFFFFF;

  /* Couleurs — accents vin français / beurre */
  --color-sage: #C4557A;
  --color-sage-deep: #AA1945;
  --color-terracotta: #D4A94A;
  --color-terracotta-deep: #AA1945;

  /* Couleurs — texte */
  --color-charcoal: #3A1420;
  --color-charcoal-soft: #7A4655;

  /* Usage sémantique */
  --color-bg: var(--color-cream);
  --color-bg-alt: var(--color-cream-alt);
  --color-text: var(--color-charcoal);
  --color-text-muted: var(--color-charcoal-soft);
  --color-border: rgba(58, 20, 32, 0.14);
  --color-focus: var(--color-terracotta-deep);

  /* Typographie */
  --font-display: 'Poppins', 'Helvetica Neue', Arial, sans-serif;
  --font-accent: 'Playfair Display', Georgia, serif;
  --font-body: 'Poppins', 'Helvetica Neue', Arial, sans-serif;

  --fs-xs: clamp(0.78rem, 0.75rem + 0.15vw, 0.85rem);
  --fs-sm: clamp(0.88rem, 0.85rem + 0.15vw, 0.98rem);
  --fs-base: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --fs-md: clamp(1.15rem, 1.08rem + 0.35vw, 1.4rem);
  --fs-lg: clamp(1.4rem, 1.25rem + 0.75vw, 1.85rem);
  --fs-xl: clamp(2.2rem, 1.5rem + 3vw, 3.6rem);
  --fs-2xl: clamp(2.6rem, 1.6rem + 4vw, 5rem);
  --fs-3xl: clamp(3rem, 1rem + 8.4vw, 11rem);
  --fs-hero: clamp(2.6rem, 1rem + 7.5vw, 9rem);

  --lh-tight: 1.1;
  --lh-snug: 1.3;
  --lh-normal: 1.6;

  /* Espacements */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: clamp(1.5rem, 1.3rem + 1vw, 2rem);
  --space-lg: clamp(2.25rem, 1.8rem + 2vw, 3.5rem);
  --space-xl: clamp(3.5rem, 2.6rem + 4vw, 6rem);
  --space-2xl: clamp(5rem, 3.5rem + 6vw, 9rem);

  /* Forme */
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 32px;
  --radius-pill: 999px;

  /* Ombres */
  --shadow-sm: 0 2px 10px rgba(58, 20, 32, 0.08);
  --shadow-md: 0 12px 40px rgba(58, 20, 32, 0.14);

  /* Structure */
  --container-max: 1240px;
  --container-pad: clamp(1.25rem, 4vw, 3rem);

  /* Transitions */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: 180ms var(--ease);
  --transition-base: 320ms var(--ease);
}
