/* ==========================================================================
   Kyei&One — Design Tokens (source de vérité exécutable)
   Documentation complète : ../design-system.md
   ========================================================================== */

:root {
  /* ---- Fond ------------------------------------------------------------ */
  --color-bg: #0D0B0A;
  --color-bg-alt: #15110F;
  --color-bg-elevated: #1B1613;
  --color-bg-overlay: rgba(13, 11, 10, 0.88);

  /* ---- Texte ------------------------------------------------------------ */
  --color-text: #E8D9C4;
  --color-text-muted: #B8A88F;
  --color-text-dim: #7A6E5E;
  --color-label: #C9A46A;

  /* ---- Accent signature --------------------------------------------------- */
  --color-copper-start: #C8501A;
  --color-copper-end: #F07A2E;
  --color-copper-mid: #DA6524;
  --gradient-copper: linear-gradient(115deg, var(--color-copper-start) 0%, var(--color-copper-end) 100%);

  /* ---- Accents produit ------------------------------------------------------ */
  --color-p8: #D9772E;
  --color-p30: #D8413F;
  --color-p15: #B87563;
  --color-metal-silver: #C9CDD3;
  --color-metal-rosegold: #C9958A;

  /* ---- Système ---------------------------------------------------------------- */
  --color-error: #D8413F;
  --color-success: #7FA37A;
  --color-border: rgba(232, 217, 196, 0.14);
  --color-border-strong: rgba(232, 217, 196, 0.28);
  --color-focus-ring: #F07A2E;

  /* ---- Typographie -------------------------------------------------------------- */
  --font-serif: 'Cormorant Garamond', 'Times New Roman', serif;
  --font-sans: 'Montserrat', 'Helvetica Neue', sans-serif;

  --fs-display: clamp(2.5rem, 1.9rem + 2.6vw, 4.75rem);
  --fs-h1: clamp(2.1rem, 1.75rem + 1.5vw, 3.4rem);
  --fs-h2: clamp(1.65rem, 1.4rem + 1vw, 2.5rem);
  --fs-h3: clamp(1.3rem, 1.15rem + 0.5vw, 1.65rem);
  --fs-body-lg: clamp(1.1rem, 1.02rem + 0.3vw, 1.3rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-label: 0.75rem;

  --lh-heading: 1.18;
  --lh-body: 1.7;

  --tracking-label: 0.28em;
  --tracking-button: 0.14em;

  /* ---- Spacing (échelle 8px) ----------------------------------------------------- */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4rem;
  --space-7: 6rem;
  --space-8: 8rem;
  --space-9: 10rem;
  --section-padding-y: clamp(4rem, 3rem + 5vw, 9rem);

  /* ---- Header (utilisé pour caler le padding-top des sections) ------------------- */
  --header-h: 76px;
  --header-h-mobile: 64px;

  /* ---- Rayons / bordures ------------------------------------------------------------ */
  --radius-sm: 3px;
  --radius-md: 8px;
  --radius-lg: 18px;
  --radius-full: 999px;
  --border-hairline: 1px solid var(--color-border);

  /* ---- Ombres --------------------------------------------------------------------- */
  --shadow-soft: 0 24px 64px -24px rgba(0, 0, 0, 0.6);
  --shadow-card: 0 14px 42px -20px rgba(0, 0, 0, 0.65);
  --shadow-glow-copper: 0 0 48px -8px rgba(240, 122, 46, 0.4);

  /* ---- Mouvement -------------------------------------------------------------------- */
  --ease-luxe: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out-soft: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-micro: 180ms;
  --dur-fast: 320ms;
  --dur-base: 600ms;
  --dur-slow: 1200ms;
  --dur-intro: 3500ms;

  /* ---- Z-index ------------------------------------------------------------------------ */
  --z-cursor: 1000;
  --z-header: 100;
  --z-modal: 300;
  --z-intro: 500;
  --z-curtain: 400;
}

/* Contrastes calculés (WCAG) — voir design-system.md §2 :
   texte/fond 14.17:1 · label/fond 8.42:1 · muted/fond 8.45:1 (tous AAA)
   texte bouton sur dégradé cuivré = toujours --color-bg (5.49:1), jamais blanc (3.58:1)
   accents produit en texte : p8 6.20:1 / p30 4.44:1 (réservé gros texte/UI) / p15 5.39:1 */

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-micro: 1ms;
    --dur-fast: 1ms;
    --dur-base: 1ms;
    --dur-slow: 1ms;
    --dur-intro: 1ms;
  }
}