/* ===============================
 * 1) POLICES
 * =============================== */

/* ——— Montserrat (variable + fallback) ——— */
/* Variable normal (axe wght 100→900) */
@font-face {
  font-family: 'Montserrat VF';
  src:
    /* Si tu convertis en .woff2, dé-commente la ligne ci-dessous et garde .ttf en fallback
    url('/assets/fonts/montserrat/variable/Montserrat-VariableFont_wght.woff2') format('woff2-variations'), */
    url('/assets/fonts/montserrat/variable/Montserrat-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
/* Variable italic (axe wght 100→900) */
@font-face {
  font-family: 'Montserrat VF';
  src:
    /* url('/assets/fonts/montserrat/variable/Montserrat-Italic-VariableFont_wght.woff2') format('woff2-variations'), */
    url('/assets/fonts/montserrat/variable/Montserrat-Italic-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}
/* Fallback statique (optionnel) */
@font-face {
  font-family: 'Montserrat Static';
  src: url('/assets/fonts/montserrat/static/Montserrat-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat Static';
  src: url('/assets/fonts/montserrat/static/Montserrat-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* ——— GlamourAbsolute (display) ——— */
/* Regular */
@font-face {
  font-family: 'GlamourAbsolute';
  src: url('/assets/fonts/GlamourAbsolute_Regular.woff2') format('woff2'),
       url('/assets/fonts/GlamourAbsolute_Regular.woff') format('woff'),
       url('/assets/fonts/GlamourAbsolute_Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
/* Condensed */
@font-face {
  font-family: 'GlamourAbsolute Condensed';
  src: url('/assets/fonts/GlamourAbsolute_Condensed.woff2') format('woff2'),
       url('/assets/fonts/GlamourAbsolute_Condensed.woff') format('woff'),
       url('/assets/fonts/GlamourAbsolute_Condensed.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
/* Extended */
@font-face {
  font-family: 'GlamourAbsolute Extended';
  src: url('/assets/fonts/GlamourAbsolute_Extended.woff2') format('woff2'),
       url('/assets/fonts/GlamourAbsolute_Extended.woff') format('woff'),
       url('/assets/fonts/GlamourAbsolute_Extended.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Police principale du site (texte courant) */
body {
  font-family: 'Montserrat VF','Montserrat Static', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 400;
}

/* Titres */
h1, h2, h3 {
  font-family: 'GlamourAbsolute', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 700;
}
h4, h5, h6 {
  font-family: 'Montserrat VF','Montserrat Static', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-weight: 600;
}

/* Utilitaires typographiques */
.font-glamour           { font-family: 'GlamourAbsolute',           system-ui, sans-serif; font-weight: 400; }
.font-glamour-condensed { font-family: 'GlamourAbsolute Condensed', system-ui, sans-serif; font-weight: 600; }
.font-glamour-extended  { font-family: 'GlamourAbsolute Extended',  system-ui, sans-serif; font-weight: 700; }
.font-body              { font-family: 'Montserrat VF','Montserrat Static', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }
.font-display           { font-family: 'GlamourAbsolute', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; }

/* Logo (dimensions uniquement) */
.logo {
  display: block;
  height: 3rem;  /* mobile */
  width: auto;
}
@media (min-width: 768px) {
  .logo {
    height: 4rem !important; /* desktop */
  }
}

/* ===============================
 * 2) PALETTE
 * =============================== */
:root{
  --brand-primary: #2B3F54; /* Bleu marque */
  --brand-cream:   #F0E8D5; /* Crème */
  --brand-dark:    #1D1D1D; /* Noir profond */
  --brand-white:   #FFFFFF; /* Blanc */
  --brand-red:     #D62F27; /* Rouge accent */
}

/* Fonds */
.bg-brand-primary { background-color: var(--brand-primary); }
.bg-brand-cream   { background-color: var(--brand-cream); }
.bg-brand-dark    { background-color: var(--brand-dark); }
.bg-brand-white   { background-color: var(--brand-white); }
.bg-brand-red     { background-color: var(--brand-red); }

/* Textes */
.text-brand-primary { color: var(--brand-primary); }
.text-brand-cream   { color: var(--brand-cream); }
.text-brand-dark    { color: var(--brand-dark); }
.text-brand-white   { color: var(--brand-white); }
.text-brand-red     { color: var(--brand-red); }

/* Aliases pratiques (facultatifs) */
.text-white { color: #FFFFFF; }          /* alias courant */
.text-red   { color: var(--brand-red); } /* compat si déjà utilisé */

/* Hovers utiles (échapper le :) */
.hover\:bg-brand-primary:hover { background-color: var(--brand-primary); }
.hover\:bg-brand-dark:hover    { background-color: var(--brand-dark); }
.hover\:bg-brand-red:hover     { background-color: var(--brand-red); }
.hover\:bg-brand-white:hover   { background-color: var(--brand-white); }
.hover\:bg-brand-cream:hover   { background-color: var(--brand-cream); }

.hover\:text-brand-primary:hover { color: var(--brand-primary); }
.hover\:text-brand-dark:hover    { color: var(--brand-dark); }
.hover\:text-brand-red:hover     { color: var(--brand-red); }
.hover\:text-brand-white:hover   { color: var(--brand-white); }
.hover\:text-brand-cream:hover   { color: var(--brand-cream); }

/* Utilitaires conservés */
.text-brand-dark\/80 { color: rgba(29, 29, 29, 0.8); }

/* ===============================
 * 3) RESET / PETITS PLUS
 * =============================== */
img { height: auto; }

/* ===============================
 * Styles personnalisés
 * =============================== */
header nav li {
  font-size: 18px;
  color:#2B3F54;
}

#garanties img {
  width: 160px;
}
