/* =========================================================================
   CLARO — tokens.css
   Variables globales du site : POLICES, COULEURS, ESPACEMENTS.
   C'est LE seul fichier à éditer pour changer la charte (police / couleurs).
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. POLICES AUTO-HÉBERGÉES (WOFF2, dans /assets/fonts)
   ------------------------------------------------------------------------- */

/* — Titres & logo : MuseoModerno — */
@font-face {
  font-family: "MuseoModerno";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/museomoderno-400-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "MuseoModerno";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/museomoderno-400-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "MuseoModerno";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/museomoderno-500-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "MuseoModerno";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/museomoderno-500-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "MuseoModerno";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/museomoderno-600-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "MuseoModerno";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/museomoderno-600-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "MuseoModerno";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/museomoderno-700-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "MuseoModerno";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/museomoderno-700-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* — Corps de texte : Muli (aujourd'hui distribuée sous le nom « Mulish »
     sur Google Fonts ; c'est la même police, licence SIL Open Font License) — */
@font-face {
  font-family: "Muli";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/muli-400-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Muli";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/muli-400-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Muli";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/muli-500-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Muli";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/muli-500-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Muli";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/muli-600-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Muli";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/muli-600-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Muli";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/muli-700-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Muli";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/muli-700-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* =======================================================================
     ← POUR CHANGER LA POLICE DE TOUT LE SITE, MODIFIER ICI
     Il suffit de changer la valeur de ces deux variables (et, si c'est une
     police auto-hébergée, d'ajouter son @font-face ci-dessus).
     Exemple pour passer à Harmonia Sans une fois licenciée :
        --font-display: "Harmonia Sans", "MuseoModerno", sans-serif;
        --font-body:    "Harmonia Sans", "Inter", sans-serif;
     ======================================================================= */
  --font-display: "MuseoModerno", system-ui, sans-serif;  /* titres + logo */
  --font-body:    "Muli", system-ui, sans-serif;          /* corps de texte */

  /* -----------------------------------------------------------------------
     COULEURS DE MARQUE — un seul endroit pour ajuster la charte
     ----------------------------------------------------------------------- */
  --color-primary:        #FB5225;  /* orange CLARO */
  --color-primary-hover:  #FF6A41;
  --color-primary-strong: #D13F16;
  --color-accent:         #B3A1FF;  /* violet lavande */
  --color-accent-soft:    #FE9D82;  /* pêche */

  --color-bg:        #1A0E3D;  /* fond général */
  --color-indigo:    #1F1147;  /* nav, hero, alternance de sections */
  --color-card:      #241654;  /* fond des cartes */
  --color-card-2:    #2A1B5E;  /* variante de carte */
  --color-footer:    #17092E;  /* fond du pied de page */

  --color-text:        #FFFFFF;
  --color-text-soft:   #D9D2F2;
  --color-text-muted:  #CBC2E8;
  --color-text-dim:    #9286C0;
  --color-text-dimmer: #8578B8;  /* relevé pour contraste AA sur fond footer (WCAG 2.1) */
  --color-on-light:    #1E1046;  /* texte sur boutons/tuiles blanches */

  --color-line: rgba(255, 255, 255, 0.08); /* bordures discrètes sur fond sombre */

  /* -----------------------------------------------------------------------
     ESPACEMENTS, RAYONS, LARGEURS
     ----------------------------------------------------------------------- */
  --radius-card:  28px;
  --radius-input: 12px;
  --radius-pill:  999px;

  --wrap:      1240px;  /* largeur max du contenu (nav, footer, hero) */
  --wrap-text: 1180px;  /* largeur max des sections de contenu */
  --pad-x:     40px;    /* marge horizontale des sections */

  --nav-height: 74px;
}