/* ==========================================================================
   MAISON DM — VARIABLES DU DESIGN
   --------------------------------------------------------------------------
   Ce fichier contient les réglages de base du site : couleurs, polices,
   tailles et espacements. Ils sont utilisés partout dans style.css.

   Pour changer une couleur sur TOUT le site, modifiez-la ici, une seule fois.
   Exemple : remplacez #CFA771 par une autre valeur pour changer l'or.
   ========================================================================== */


/* --- 1. Les polices (fichiers rangés dans assets/fonts) ------------------- */

@font-face {
  font-family: "Cormorant Garamond";
  src: url("../fonts/cormorant-garamond.woff") format("woff");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Jost";
  src: url("../fonts/jost.woff") format("woff");
  font-weight: 300 600;
  font-style: normal;
  font-display: swap;
}


/* --- 2. Les réglages ------------------------------------------------------ */

:root {
  /* Couleurs de la marque (mesurées dans les logos) */
  --noir:          #0B0B0B;  /* fond des sections sombres            */
  --noir-doux:     #151412;  /* fond légèrement plus clair (pied)    */
  --ivoire:        #F7F5F2;  /* fond clair, texte sur fond noir      */
  --ivoire-fonce:  #ECE7DF;  /* cadres photo vides, séparations      */
  --or:            #CFA771;  /* or Maison DM : couleur de la marque  */
  --or-lumiere:    #EBC88F;  /* or au survol de la souris            */
  --bronze:        #8A6438;  /* l'or, version lisible sur fond clair */
  --anthracite:    #1C1A17;  /* texte courant sur fond clair         */
  --grege:         #B9B2A6;  /* texte secondaire sur fond noir       */

  /* Or propre à chaque univers (utilisé sur sa page) */
  --or-cook:       #CEB477;
  --or-events:     #D7AF66;

  /* Couleur d'accent : l'or Maison DM par défaut.
     Les pages DM Cook et DM Events la remplacent (voir en bas du fichier). */
  --accent: var(--or);

  /* Polices : la première disponible est utilisée */
  --police-titres: "Cormorant Garamond", Garamond, "Times New Roman", serif;
  --police-texte:  "Jost", "Helvetica Neue", Arial, sans-serif;

  /* Tailles de texte (clamp = taille qui s'adapte à l'écran : mini, idéale, maxi) */
  --taille-petit:  0.9375rem;
  --taille-texte:  1.0625rem;
  --taille-h3:     clamp(1.6rem, 1.35rem + 0.9vw, 2rem);
  --taille-h2:     clamp(2.1rem, 1.5rem + 2.6vw, 3.4rem);
  --taille-h1:     clamp(2.6rem, 1.4rem + 4.6vw, 5rem);

  /* Espacements */
  --largeur-max:     72rem;                        /* largeur maximale du contenu  */
  --marge-laterale:  clamp(1rem, 4vw, 2.5rem);     /* marges à gauche et à droite  */
  --espace-section:  clamp(4.5rem, 9vw, 8rem);     /* hauteur entre deux sections  */
  --hauteur-entete:  4.75rem;

  /* Traits dorés fins */
  --trait-or:        1px solid rgba(207, 167, 113, 0.35);
  --trait-bronze:    1px solid rgba(138, 100, 56, 0.35);

  --transition: 200ms ease;
}


/* --- 3. Couleur d'accent de chaque univers --------------------------------
   Sur dm-cook.html, la balise <body> porte la classe "univers-cook" :
   tous les éléments dorés de la page prennent alors l'or de DM Cook. */

.univers-cook   { --accent: var(--or-cook); }
.univers-events { --accent: var(--or-events); }