/* ==========================================================================
   Blitz - système de design (refonte UI 2026-10)
   --------------------------------------------------------------------------
   Chargé après custom.css (template/_assets.php). Tout est préfixé .bz-* :
   aucune règle globale sur body / h1 / a, pour ne pas toucher les gabarits
   actuels tant qu'ils ne sont pas réécrits.

   CONVENTION FONDS FONCÉS : toute surface foncée (section, bandeau, fiche, pied de
   page...) porte la classe .bz-bg-dark. C'est elle qui redéfinit --bz-text (blanc),
   --bz-text-muted et --bz-accent-text ; les titres, le texte et le libellé de .bz-btn
   au survol/focus en dépendent. Un fond foncé posé autrement (style en ligne, image,
   classe maison) sans .bz-bg-dark garde les couleurs du fond clair (#233033) et un
   .bz-btn y serait illisible au survol. Seules les variantes .bz-btn--on-dark ont des
   couleurs explicites qui ne dépendent pas du contexte.

   Valeurs relevées dans le Figma (fichier uGN3rQ021kQSWXFkG0qGRi) :
   - Composantes > Bouton Plein / Bouton Outline : 225x41, rayon 7px, texte
     Area Normal 600 16px/26px, retrait 14px ; état survol (« S ») = même
     couleur à 40 % (plein) ou fond à 20 % (contour, bordure 1px).
   - Composantes > Fiche revue de presse : rayon 5px ; fiche ressource : rayon 10px,
     aucune ombre. Survol (variante 2 de chaque fiche) : fiches claires #FFFFFF → #DDDDDD ;
     fiche ressource dégradé → #063C4A uni ; Fiche Entreprise voile noir 40 % → 60 % ;
     Fiche membre équipe : voile noir 25 % sur la photo.
   - Accueil (1-3485) : Titre section 800 ExtraBold 40px/100 % majuscules #233033 ;
     Sous titre 900 Black 20px/100 % majuscules ; Texte courant 600 18px/26px #233033 ;
     surtitre #00CCFF sur fond foncé, « texte en bleu » #10A0C4 sur fond clair ;
     texte descriptif sur fond foncé = blanc à 65 % ; section : 72px de marge
     haute, contenu à 100px du bord d'un cadre de 1280px.
   ========================================================================== */

:root {
  /* Couleurs (spec, valeurs fixées) */
  --bz-cyan: #00CCFF;
  --bz-dark-1: #073743;
  --bz-dark-2: #02191F;
  --bz-grey-1: #F6F6F6;
  --bz-grey-2: #EFEFEF;
  --bz-white: #FFFFFF;

  /* Couleurs relevées dans le Figma */
  --bz-text: #233033;                     /* texte et titres sur fond clair */
  --bz-text-muted: rgba(35, 48, 51, 0.65); /* même règle que le blanc à 65 % sur fond foncé */
  --bz-cyan-text: #10A0C4;                /* « texte en bleu » sur fond clair */
  --bz-teal: #063C4A;                     /* Bouton « Turquoise foncé » */
  --bz-btn-light: #F0F0F0;                /* Bouton « Blanc » */
  --bz-card-hover: #DDDDDD;               /* fond des fiches claires au survol (« Background fiche ») */

  /* Couleur de marque de la page Entreprise (surchargée en ligne : style="--bz-brand:#...") */
  --bz-brand: var(--bz-cyan);

  /* Couleurs contextuelles : valeurs du fond clair ici, redéfinies par .bz-bg-dark.
     Toute surface foncée doit porter .bz-bg-dark (voir la convention en tête). */
  --bz-accent-text: var(--bz-cyan-text);

  /* Typographie */
  --bz-font: 'Google Sans Flex', 'Poppins', system-ui, sans-serif; /* google-sans-flex.css ; le Figma est en Area Normal */

  /* Mise en page */
  --bz-container: 1280px;
  --bz-gutter: clamp(16px, 7.8vw, 100px);
  --bz-section-space: clamp(48px, 5.6vw, 72px);

  /* Rayons */
  --bz-radius: 10px;      /* fiches (fiche ressource) */
  --bz-radius-sm: 5px;    /* fiche revue de presse */
  --bz-radius-btn: 7px;   /* boutons */

  /* Survol des fiches : fondu lent et doux (0,2 s donnait un clignotement) */
  --bz-card-transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* --------------------------------------------------------------------------
   Fonds
   -------------------------------------------------------------------------- */
.bz-bg-dark,
.bz-bg-grey,
.bz-bg-white,
.bz-section {
  font-family: var(--bz-font);
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
  color: var(--bz-text);
}

.bz-bg-dark {
  --bz-text: var(--bz-white);
  --bz-text-muted: rgba(255, 255, 255, 0.65);
  --bz-accent-text: var(--bz-cyan);
  background: linear-gradient(180deg, var(--bz-dark-1) 0%, var(--bz-dark-2) 100%);
}

/* Surfaces claires : remettent les couleurs du fond clair, pour qu'une surface claire
   posée dans une .bz-bg-dark (fiche, encart) retrouve un texte foncé. */
.bz-bg-grey,
.bz-bg-white {
  --bz-text: #233033;
  --bz-text-muted: rgba(35, 48, 51, 0.65);
  --bz-accent-text: var(--bz-cyan-text);
}

.bz-bg-grey {
  background: linear-gradient(180deg, var(--bz-grey-1) 0%, var(--bz-grey-2) 100%);
}

.bz-bg-white {
  background: var(--bz-white);
}

/* --------------------------------------------------------------------------
   Mise en page
   -------------------------------------------------------------------------- */
.bz-section {
  padding-block: var(--bz-section-space);
  overflow-wrap: break-word;
}

.bz-container {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--bz-container);
  margin-inline: auto;
  padding-inline: var(--bz-gutter);
}

/* --------------------------------------------------------------------------
   Typographie
   -------------------------------------------------------------------------- */
.bz-h1,
.bz-h2,
.bz-h3 {
  font-family: var(--bz-font);
  line-height: 1;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--bz-text);
  margin: 0 0 16px;
  overflow-wrap: break-word;
  hyphens: auto;
}

/* Titre page : 900 Black Italic 40px / 100 % */
.bz-h1 {
  font-weight: 900;
  font-style: italic;
  font-size: clamp(28px, 2.5vw + 18px, 40px);
}

/* Titre section : 800 ExtraBold 40px / 100 % */
.bz-h2 {
  font-weight: 800;
  font-style: normal;
  font-size: clamp(26px, 2.5vw + 16px, 40px);
}

/* Sous titre : 900 Black 20px / 100 % */
.bz-h3 {
  font-weight: 900;
  font-style: normal;
  font-size: 20px;
}

/* Surtitre : Texte courant en cyan */
.bz-eyebrow {
  display: block;
  font-family: var(--bz-font);
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
  color: var(--bz-accent-text);
  margin: 0 0 8px;
}

/* Texte descriptif de section */
.bz-lead {
  font-family: var(--bz-font);
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
  color: var(--bz-text);
  margin: 0 0 16px;
}

.bz-bg-dark .bz-lead {
  color: var(--bz-text-muted);
}

/* Mot mis en valeur dans un titre */
.bz-accent {
  color: var(--bz-accent-text);
}

/* --------------------------------------------------------------------------
   Boutons (Composantes > Bouton Plein / Bouton Outline)
   -------------------------------------------------------------------------- */
.bz-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-sizing: border-box;
  min-height: 41px;
  max-width: 100%;
  padding: 7px 14px;
  border: 1px solid var(--bz-cyan);
  border-radius: var(--bz-radius-btn);
  background-color: var(--bz-cyan);
  color: var(--bz-white);
  font-family: var(--bz-font);
  font-weight: 600;
  font-size: 16px;
  line-height: 26px;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.bz-btn:hover,
.bz-btn:focus-visible {
  background-color: rgba(0, 204, 255, 0.4);
  border-color: rgba(0, 204, 255, 0.4);
  /* Figma « Bleu S » garde le libellé blanc, illisible sur le cyan à 40 % posé sur fond
     clair (1.3:1). --bz-text vaut #233033 sur fond clair (9.3-10.1:1) et redevient blanc
     dans .bz-bg-dark (5.5-7.1:1).
     ATTENTION : sur un fond foncé, ce libellé n'est blanc que si un ancêtre porte
     .bz-bg-dark (convention en tête du fichier). Sans .bz-bg-dark, utiliser une variante
     .bz-btn--on-dark, dont les couleurs sont fixes. */
  color: var(--bz-text);
  text-decoration: none;
}

.bz-btn:focus-visible {
  outline: 2px solid var(--bz-cyan);
  outline-offset: 2px;
}

/* Contour sur fond clair : « Turquoise foncé » */
.bz-btn--outline {
  background-color: transparent;
  border-color: var(--bz-teal);
  color: var(--bz-teal);
}

.bz-btn--outline:hover,
.bz-btn--outline:focus-visible {
  background-color: rgba(6, 60, 74, 0.2);
  border-color: var(--bz-teal);
  color: var(--bz-teal);
}

/* Variantes .bz-btn--on-dark : couleurs explicites, indépendantes de --bz-text, donc
   correctes sur tout fond foncé, même sans ancêtre .bz-bg-dark. */

/* Contour sur fond foncé : « Blanc » (libellé blanc au repos, au survol et au focus) */
.bz-btn--outline.bz-btn--on-dark {
  border-color: var(--bz-white);
  color: var(--bz-white);
}

.bz-btn--outline.bz-btn--on-dark:hover,
.bz-btn--outline.bz-btn--on-dark:focus-visible {
  background-color: rgba(255, 255, 255, 0.2);
  border-color: var(--bz-white);
  color: var(--bz-white);
}

/* Plein sur fond foncé : « Blanc » (fond clair #F0F0F0, libellé #233033 fixe : un
   libellé blanc y serait illisible ; au survol, #233033 sur #F0F0F0 à 80 % = 7.8-8.2:1) */
.bz-btn--on-dark:not(.bz-btn--outline) {
  background-color: var(--bz-btn-light);
  border-color: var(--bz-btn-light);
  color: #233033;
}

.bz-btn--on-dark:not(.bz-btn--outline):hover,
.bz-btn--on-dark:not(.bz-btn--outline):focus-visible {
  background-color: rgba(240, 240, 240, 0.8);
  border-color: rgba(240, 240, 240, 0.8);
  color: #233033;
}

/* --------------------------------------------------------------------------
   Défilement de logos (.bz-marquee, initialisé par blitz.js)
   <div class="bz-marquee"><div class="bz-marquee__track"> ...éléments... </div></div>
   -------------------------------------------------------------------------- */
.bz-marquee {
  overflow: hidden;
  width: 100%;
}

.bz-marquee__track {
  display: flex;
  align-items: center;
  gap: 48px;
  width: max-content;
}

.bz-marquee.is-ready .bz-marquee__track {
  animation: bz-marquee var(--bz-marquee-duration, 30s) linear infinite;
}

.bz-marquee:hover .bz-marquee__track,
.bz-marquee:focus-within .bz-marquee__track {
  animation-play-state: paused;
}

@keyframes bz-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(calc(-50% - 24px)); } /* une copie + la moitié du gap */
}

@media (prefers-reduced-motion: reduce) {
  .bz-marquee.is-ready .bz-marquee__track {
    animation: none;
  }
  .bz-marquee__track {
    flex-wrap: wrap;
    justify-content: center;
    width: auto;
  }
  .bz-marquee__track [aria-hidden="true"] {
    display: none;
  }
}

/* --------------------------------------------------------------------------
   Accordéon FAQ (.bz-faq, initialisé par blitz.js)
   <div class="bz-faq">
     <div class="bz-faq__item">
       <button type="button" class="bz-faq__question">...</button>
       <div class="bz-faq__answer">...</div>
     </div>
   </div>
   -------------------------------------------------------------------------- */
.bz-faq__item {
  border-bottom: 1px solid rgba(35, 48, 51, 0.2);
}

.bz-bg-dark .bz-faq__item {
  border-bottom-color: rgba(255, 255, 255, 0.2);
}

.bz-faq__question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  padding: 16px 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

/* Chevron (Figma : chevron cyan, vers le bas fermé, vers le haut ouvert) */
.bz-faq__question::after {
  content: "";
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  margin: 0 4px 4px 0;
  border-right: 2px solid var(--bz-accent-text);
  border-bottom: 2px solid var(--bz-accent-text);
  transform: rotate(45deg);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), margin 0.35s cubic-bezier(0.4, 0, 0.2, 1); /* même durée que le dépli (blitz.js) */
}

.bz-faq__question[aria-expanded="true"]::after {
  margin-bottom: -4px;
  transform: rotate(-135deg);
}

.bz-faq__answer {
  padding: 0 0 16px;
  color: var(--bz-text-muted);
}

.bz-faq__answer[hidden] {
  display: none;
}

/* ==========================================================================
   Gabarit commun (tâche 5) : barre de navigation, pied de page, partials
   --------------------------------------------------------------------------
   Figma « Composantes » :
   - Barre de navigation : pilule blanche 1166x66, rayon 50px, posée à 64px du haut du
     héros (Accueil 1-3485) ; logo 119px, à 35px du bord ; liens Area Normal 600 16px/26px
     #063C4A, actif #10A0C4 ; sélecteurs FR / CA : pastilles #063C4A 64x30 rayon 50px,
     texte blanc ; sous-menu : fiches blanches rayon 5px, ombre, même typo que les liens.
   - Bas de page : 1280x453 ; colonnes à 129 / 410 / 699 / 890px ; texte 16px/140 % blanc
     (style « Body Base », Regular) ; icônes 24px espacées de 10px ; copyright et liens de
     témoins 12px/140 % ; liens légaux soulignés. Fond : le Figma est noir (#000), mais les
     directives client n'autorisent que trois fonds → dégradé .bz-bg-dark (comme T4).
   ========================================================================== */
:root {
  --bz-nav-text: #063C4A;
  --bz-header-top: 64px;   /* espace au-dessus de la pilule */
  --bz-header-h: 66px;     /* hauteur de la pilule */
  --bz-header-pad: 35px;   /* retrait gauche du logo dans la pilule (et des liens du panneau mobile) */
  --bz-header-pad-r: 20px; /* retrait droit de la pilule */
}

/* --------------------------------------------------------------------------
   Barre de navigation (template/_nav_menu.php)
   Fixe au défilement : position sticky ; quand la page défile, la pilule reste à 16px du
   haut. Elle occupe sa place dans le flux ; une section foncée qui doit passer dessous
   (héros) porte .bz-under-header.
   -------------------------------------------------------------------------- */
.bz-header.sticky-top {
  position: sticky;
  top: calc(16px - var(--bz-header-top));
  z-index: 997;
  padding: var(--bz-header-top) 16px 0;
  pointer-events: none; /* la marge transparente au-dessus de la pilule ne bloque pas les clics */
  font-family: var(--bz-font);
}

.bz-under-header {
  margin-top: calc(-1 * (var(--bz-header-top) + var(--bz-header-h)));
  padding-top: calc(var(--bz-header-top) + var(--bz-header-h) + var(--bz-section-space));
}

/* Ancres (#notre-histoire, #notre-equipe, #contact...) : la cible s'arrête sous la pilule
   sticky (16px du haut + sa hauteur + 16px d'air). Le scroll-margin-top de main.css
   (90px / 66px sur toutes les <section>) s'y ajouterait : remis à 0, l'écart ne vient
   plus que d'ici. main.js (correction au chargement d'une URL avec #) passe par
   scrollIntoView, qui tient compte de ce scroll-padding. */
html {
  scroll-padding-top: calc(16px + var(--bz-header-h) + 16px);
}

section,
.section {
  scroll-margin-top: 0;
}

.bz-header__inner {
  position: relative; /* repère du panneau mobile, aligné sur les bords de la pilule */
  pointer-events: auto;
  box-sizing: border-box;
  max-width: 1166px;
  height: var(--bz-header-h);
  margin: 0 auto;
  padding: 0 var(--bz-header-pad-r) 0 var(--bz-header-pad);
  background: var(--bz-white);
  border-radius: 50px;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
}

.bz-nav {
  display: flex;
  align-items: center;
  height: 100%;
}

.bz-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.bz-nav__logo {
  display: block;
  flex: 0 0 auto;
  line-height: 0;
}

.bz-nav__logo img {
  width: 119px;
  height: auto;
}

.bz-nav__menu {
  display: flex;
  align-items: center;
  gap: 48px;
  margin-left: auto !important;
}

.bz-nav__item {
  position: relative;
}

.bz-nav__link,
.bz-nav__sublink {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0;
  border: 0;
  background: none;
  font-family: var(--bz-font);
  font-weight: 600;
  font-size: 16px;
  line-height: 26px;
  color: var(--bz-nav-text);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.2s ease;
}

.bz-nav__link .bi {
  font-size: 12px;
  -webkit-text-stroke: 1px; /* chevron plus épais, comme le Figma */
  transition: transform 0.2s ease;
}

.bz-nav__link:focus-visible,
.bz-nav__link.active,
.bz-nav__sublink:focus-visible,
.bz-nav__sublink.active,
.bz-nav__item--dropdown:has(.bz-nav__sublink.active) > .bz-nav__link {
  color: var(--bz-cyan-text);
}

/* Survol réservé aux souris : sur écran tactile, :hover reste collé après un toucher et
   « Service » paraîtrait actif en même temps que la page courante. */
@media (hover: hover) {
  .bz-nav__link:hover,
  .bz-nav__sublink:hover {
    color: var(--bz-cyan-text);
  }
}

.bz-nav__link:focus-visible,
.bz-nav__sublink:focus-visible,
.bz-switcher__btn:focus-visible,
.bz-switcher__option:focus-visible,
.bz-nav__toggle:focus-visible {
  outline: 2px solid var(--bz-cyan-text);
  outline-offset: 3px;
  border-radius: 4px;
}

.bz-nav__dropdown-toggle[aria-expanded="true"] .bi {
  transform: rotate(180deg);
}

/* Sous-menu. Ouvert/fermé par le script de _nav_menu.php (.is-open + aria-expanded, au
   survol, au clic et au clavier) : l'état affiché et aria-expanded restent synchrones. */
.bz-nav__submenu {
  display: none;
  flex-direction: column;
  gap: 2px;
}

.bz-nav__submenu.is-open {
  display: flex;
}

/* Sélecteurs langue / marché */
.bz-nav__actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 9px;
  margin-left: 45px;
}

.bz-switcher {
  position: relative;
}

.bz-switcher__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 64px;
  height: 30px;
  padding: 0 12px;
  border: 0;
  border-radius: 50px;
  background: var(--bz-teal);
  color: var(--bz-white);
  font-family: var(--bz-font);
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}

.bz-switcher__btn .bi {
  font-size: 10px;
  -webkit-text-stroke: 1px;
}

.bz-switcher__menu {
  display: none;
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 1200;
  min-width: 170px;
  padding: 6px !important;
  background: var(--bz-white);
  border-radius: 12px;
  box-shadow: 0 12px 34px rgba(0, 40, 46, 0.2);
}

.bz-switcher__menu.is-open {
  display: block;
}

.bz-switcher__option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 9px 14px;
  border-radius: 9px;
  font-family: var(--bz-font);
  font-weight: 600;
  font-size: 14px;
  line-height: 1.2;
  color: var(--bz-nav-text);
  text-decoration: none;
  white-space: nowrap;
}

a.bz-switcher__option:hover,
a.bz-switcher__option:focus-visible {
  background: var(--bz-grey-1);
  color: var(--bz-nav-text);
}

.bz-switcher__option.is-current {
  background: var(--bz-grey-2);
  cursor: default;
}

.bz-nav__toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--bz-nav-text);
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

/* Bureau : panneau blanc sous « Service », même habillage que les menus FR / CA (rayon
   12px, ombre, options à rayon 9px). Le Figma esquisse des fiches blanches séparées posées
   sur son fond gris ; sur les vraies pages (héros foncé, fond gris clair) elles flottaient
   sans fond : un seul panneau, posé 10px sous la pilule. Le texte des options est aligné
   sur celui de « Service » (6px de panneau + 14px d'option = 20px). */
@media (min-width: 1200px) {
  .bz-nav__submenu {
    --bz-submenu-gap: calc((var(--bz-header-h) - 26px) / 2 + 10px); /* bas du lien → panneau */
    display: flex;
    position: absolute;
    top: calc(100% + var(--bz-submenu-gap));
    left: -20px;
    z-index: 1100;
    min-width: 230px;
    padding: 6px !important;
    background: var(--bz-white);
    border-radius: 12px;
    box-shadow: 0 12px 34px rgba(0, 40, 46, 0.2);
    visibility: hidden;
    opacity: 0;
    transform: translateY(-4px);
    pointer-events: none;
  }

  /* pont de survol entre le lien et le panneau : la souris peut descendre sans le fermer */
  .bz-nav__submenu::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    height: var(--bz-submenu-gap);
  }

  .bz-nav__submenu.is-open {
    visibility: visible;
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }

  .bz-nav__submenu .bz-nav__sublink {
    padding: 9px 14px;
    border-radius: 9px;
    line-height: 22px;
  }

  .bz-nav__submenu .bz-nav__sublink.active {
    background: var(--bz-grey-2);
  }
}

@media (min-width: 1200px) and (hover: hover) {
  .bz-nav__submenu .bz-nav__sublink:hover {
    background: var(--bz-grey-1);
  }
}

@media (min-width: 1200px) and (prefers-reduced-motion: no-preference) {
  .bz-nav__submenu {
    transition: opacity 0.15s ease, transform 0.15s ease, visibility 0s linear 0.15s;
  }

  .bz-nav__submenu.is-open {
    transition: opacity 0.15s ease, transform 0.15s ease, visibility 0s;
  }
}

/* Tablette et mobile : menu burger, panneau blanc sous la pilule */
@media (max-width: 1199.98px) {
  .bz-nav__toggle {
    display: inline-flex;
  }

  .bz-nav__actions {
    margin-left: auto;
  }

  .bz-nav__menu {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    max-height: calc(100vh - 120px);
    max-height: calc(100dvh - var(--bz-header-h) - 48px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 12px 0 !important;
    background: var(--bz-white);
    border-radius: 20px;
    box-shadow: 0 12px 34px rgba(0, 40, 46, 0.2);
  }

  .bz-nav__menu.is-open {
    display: flex;
  }

  .bz-nav__link {
    justify-content: space-between;
    width: 100%;
    /* à droite : chevron dans l'axe du bouton ✕ (38px, centré à 19px du retrait droit) */
    padding: 10px calc(var(--bz-header-pad-r) + 13px) 10px var(--bz-header-pad);
  }

  .bz-nav__submenu {
    padding: 0 0 6px !important;
  }

  .bz-nav__sublink {
    padding: 8px var(--bz-header-pad) 8px calc(var(--bz-header-pad) + 16px);
  }
}

@media (max-width: 767.98px) {
  :root {
    --bz-header-top: 16px;
    --bz-header-h: 58px;
    --bz-header-pad: 20px;
    --bz-header-pad-r: 10px;
  }

  .bz-nav__logo img {
    width: 96px;
  }

  .bz-nav__actions {
    gap: 6px;
  }

  .bz-switcher__btn {
    min-width: 0;
    padding: 0 10px;
  }
}

/* --------------------------------------------------------------------------
   Pied de page (template/_site_footer.php)
   -------------------------------------------------------------------------- */
.bz-footer {
  border-top: 1px solid rgba(255, 255, 255, 0.12); /* Figma : bordure haute ; sépare le pied d'une section foncée qui le précède (bandeau d'appel des pages Entreprise) */
  font-family: var(--bz-font);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.4;
  color: var(--bz-white);
}

.bz-footer a {
  color: var(--bz-white);
  text-decoration: none;
  transition: color 0.2s ease;
}

.bz-footer a:hover,
.bz-footer a:focus-visible {
  color: var(--bz-cyan);
}

.bz-footer a:focus-visible {
  outline: 2px solid var(--bz-cyan);
  outline-offset: 2px;
}

.bz-footer ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.bz-footer p {
  margin: 0;
}

.bz-footer__inner {
  box-sizing: border-box;
  max-width: var(--bz-container);
  margin: 0 auto;
  padding: 83px 129px 46px;
}

.bz-footer__top {
  display: grid;
  grid-template-columns: 281px 289px 191px 1fr;
  align-items: start;
}

.bz-footer__logo {
  display: block;
  width: max-content;
  line-height: 0;
}

.bz-footer__logo img {
  display: block;
  width: 164px;
  height: 55px;
  margin: -10px 0 0 -13px; /* marge transparente du fichier (glyphes alignés à 129px comme le Figma) */
}

.bz-footer__social {
  display: flex;
  gap: 10px;
  margin-top: 23px !important;
}

.bz-footer__social a {
  display: block;
  font-size: 24px;
  line-height: 24px;
}

.bz-footer__email {
  display: inline-block;
  margin-top: 8px;
}

.bz-footer__links {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.bz-footer__links--underline a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.bz-footer__bottom {
  margin-top: 127px;
  font-size: 12px;
  line-height: 1.4;
}

.bz-footer__cookies {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 13px;
  margin-top: 3px !important;
}

.bz-footer__cookies a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 1199.98px) {
  .bz-footer__inner {
    padding-inline: var(--bz-gutter);
  }

  .bz-footer__top {
    grid-template-columns: repeat(4, minmax(0, auto));
    justify-content: space-between;
    gap: 32px;
  }
}

@media (max-width: 991.98px) {
  .bz-footer__top {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px 24px;
  }

  .bz-footer__bottom {
    margin-top: 56px;
  }
}

@media (max-width: 575.98px) {
  .bz-footer__inner {
    padding-block: 56px 32px;
  }

  .bz-footer__top {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .bz-footer__links a,
  .bz-footer__email {
    overflow-wrap: anywhere;
  }
}

/* --------------------------------------------------------------------------
   Partials partagés (views/partials/)
   -------------------------------------------------------------------------- */

/* Grilles : 3 → 2 → 1 et 4 → 2 → 1 colonnes */
.bz-grid {
  display: grid;
  gap: 20px;
}

.bz-grid--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bz-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 991.98px) {
  .bz-grid--3,
  .bz-grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .bz-grid--3,
  .bz-grid--4 {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* _section_head */
.bz-section-head {
  max-width: 820px;
  margin-bottom: 40px;
}

.bz-section-head--center {
  margin-inline: auto;
  text-align: center;
}

.bz-section-head .bz-lead > :last-child,
.bz-contact__intro > :last-child,
.bz-faq-section__aside-text > :last-child,
.bz-faq__answer > :last-child {
  margin-bottom: 0;
}

/* Étiquette de sujet (Figma : Area Normal 800 14px/26px blanc sur #10A0C4, rayon 5px) */
.bz-tag {
  display: inline-block;
  align-self: flex-start;
  max-width: 100%;
  padding: 0 10px;
  border-radius: 5px;
  background: var(--bz-cyan-text);
  color: var(--bz-white);
  font-family: var(--bz-font);
  font-weight: 800;
  font-size: 14px;
  line-height: 26px;
}

/* Flèche des fiches (trait + pointe), cyan */
.bz-arrow {
  position: relative;
  flex: 0 0 auto;
  width: 34px;
  height: 2px;
  background: currentColor;
  color: var(--bz-accent-text);
}

.bz-arrow::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: 8px;
  height: 8px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
}

/* _card_article (Figma « Fiches articles de blogue » 359x422 rayon 5px / « fiche ressource »
   359x342 rayon 10px). Toute la fiche est cliquable (lien étiré sur le titre). */
.bz-card-article {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  font-family: var(--bz-font);
  transition: background-color var(--bz-card-transition);
}

.bz-card-article--article {
  --bz-text: #233033;
  --bz-accent-text: var(--bz-cyan-text);
  background: var(--bz-white);
  border-radius: var(--bz-radius-sm);
}

.bz-card-article--article:hover,
.bz-card-article--article:focus-within {
  background: var(--bz-card-hover);
}

.bz-card-article--resource {
  border-radius: var(--bz-radius);
  min-height: 342px;
  isolation: isolate;
  background: var(--bz-teal); /* couleur de survol, sous le dégradé */
}

/* Le dégradé de .bz-bg-dark ne peut pas se fondre vers un aplat : il est posé sur un calque
   qui s'efface au survol (sinon la fiche passait d'un coup au #063C4A). */
.bz-card-article--resource::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, var(--bz-dark-1) 0%, var(--bz-dark-2) 100%);
  transition: opacity var(--bz-card-transition);
}

.bz-card-article--resource:hover::before,
.bz-card-article--resource:focus-within::before {
  opacity: 0;
}

.bz-card-article__media {
  position: relative;
  aspect-ratio: 359 / 224;
  overflow: hidden;
}

.bz-card-article__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bz-card-article__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 12px;
  padding: 16px 20px 18px;
}

.bz-card-article--resource .bz-card-article__body {
  padding: 26px 34px 22px;
}

/* Étiquette posée sur la photo, comme le Figma */
.bz-card-article--article .bz-card-article__media + .bz-card-article__body .bz-tag {
  position: absolute;
  top: 16px;
  left: 20px;
}

.bz-card-article__title {
  margin: 0;
  font-family: var(--bz-font);
  font-weight: 800;
  font-size: 20px;
  line-height: 26px;
  color: var(--bz-text);
  overflow-wrap: break-word;
}

.bz-card-article__link {
  color: inherit;
  text-decoration: none;
}

.bz-card-article__link::after,
.bz-card-press__link::after,
.bz-card-franchise__link::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

.bz-card-article__link:focus-visible,
.bz-card-press__link:focus-visible,
.bz-card-franchise__link:focus-visible {
  outline: none;
}

.bz-card-article:focus-within,
.bz-card-press:focus-within,
.bz-card-franchise:focus-within {
  outline: 2px solid var(--bz-cyan);
  outline-offset: 2px;
}

.bz-card-article__excerpt {
  margin: 0;
  font-weight: 600;
  font-size: 15px;
  line-height: 24px;
  color: var(--bz-text-muted);
}

.bz-card-article__meta,
.bz-card-press__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  font-weight: 600;
  font-size: 14px;
  line-height: 26px;
  text-transform: uppercase;
  color: var(--bz-text);
}

.bz-card-article--resource .bz-card-article__meta {
  color: var(--bz-text-muted);
}

/* _card_press (Figma « Fiche revue de presse », rayon 5px) */
.bz-card-press {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  --bz-text: #233033;
  --bz-accent-text: var(--bz-cyan-text);
  background: var(--bz-white);
  border-radius: var(--bz-radius-sm);
  font-family: var(--bz-font);
  transition: background-color var(--bz-card-transition);
}

.bz-card-press:hover,
.bz-card-press:focus-within {
  background: var(--bz-card-hover);
}

.bz-card-press__media {
  aspect-ratio: 359 / 224;
  overflow: hidden;
}

.bz-card-press__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bz-card-press__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 24px;
  padding: 16px 20px 18px;
}

.bz-card-press__title {
  margin: 0;
  font-family: var(--bz-font);
  font-weight: 800;
  font-size: 20px;
  line-height: 26px;
  color: var(--bz-text);
  overflow-wrap: break-word;
}

.bz-card-press__link {
  color: inherit;
  text-decoration: none;
}

.bz-card-press__meta {
  line-height: 18px;
}

.bz-card-press__source {
  display: block;
  font-weight: 800;
  color: var(--bz-cyan-text);
}

/* _card_franchise (Figma « Fiche Entreprise » ; Trouver une franchise 42-5080, « Fiche Brand »
   274x253, rayon 5px : photo assombrie, logo 208x208 centré en haut, nom Area Normal 800
   20px/26px blanc centré dont le milieu est à 210px du haut, sur 1 ou 2 lignes).
   Grille : la ligne 1 (logo) et la bande du nom (184-236px, 2 lignes) proportionnelles
   à la hauteur ; le nom reste dans le flux pour que le lien étiré couvre toute la fiche. */
.bz-card-franchise {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 184fr 52fr 17fr;
  aspect-ratio: 274 / 253;
  padding: 0 13px;
  overflow: hidden;
  border-radius: var(--bz-radius-sm);
  background-color: var(--bz-teal);
  background-size: cover;
  background-position: center;
  font-family: var(--bz-font);
  isolation: isolate;
}

.bz-card-franchise::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgba(0, 0, 0, 0.4);
  transition: background-color var(--bz-card-transition);
}

.bz-card-franchise:hover::before,
.bz-card-franchise:focus-within::before {
  background: rgba(0, 0, 0, 0.6);
}

.bz-card-franchise__logo {
  grid-row: 1 / 3;
  grid-column: 1;
  justify-self: center;
  align-self: start;
  width: 84%;            /* 208 / (274 - 2 x 13) */
  max-height: 88%;       /* 208 / 236 (lignes 1-2) */
  aspect-ratio: 1;
  object-fit: contain;
}

.bz-card-franchise__name {
  grid-row: 2;
  grid-column: 1;
  align-self: center;
  margin: 0;
  font-family: var(--bz-font);
  font-weight: 800;
  font-size: 20px;
  line-height: 26px;
  text-align: center;
  color: var(--bz-white);
  overflow-wrap: break-word;
}

.bz-card-franchise__link {
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

/* _resources_section : en-tête (titre + sous-titre facultatif) qui porte seul l'écart avant
   les fiches ; le titre n'a pas de marge propre, le sous-titre se place 21px sous le titre
   (Développement de franchise) et l'en-tête qui en a un est à 60px des fiches. */
.bz-resources__head {
  text-align: center;
  margin-bottom: 40px;
}

.bz-resources__head--sub {
  margin-bottom: 60px;
}

.bz-resources__title {
  margin-bottom: 0;
}

.bz-resources__subtitle {
  margin: 21px 0 0;
  color: var(--bz-text);
}

.bz-resources__subtitle:first-child {
  margin-top: 0;
}

.bz-resources__more {
  display: flex;
  justify-content: flex-end;
  margin-top: 24px;
}

/* _faq_section (Figma Accueil > FAQ : liste + colonne « Vous avez d'autres questions ? ») */
.bz-faq-section__grid {
  display: grid;
  grid-template-columns: minmax(0, 807px) minmax(0, 1fr);
  gap: 56px;
  align-items: start;
}

.bz-faq__heading {
  margin: 0;
  font: inherit;
}

.bz-faq-section .bz-faq__question {
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  color: var(--bz-text);
}

.bz-faq-section .bz-faq__answer {
  font-weight: 600;
  font-size: 14px;
  line-height: 20px;
}

.bz-faq-section__aside {
  padding-top: 64px;
}

.bz-faq-section__aside-title {
  margin: 0 0 12px;
  font-family: var(--bz-font);
  font-weight: 900;
  font-size: 24px;
  line-height: 1.1;
  text-transform: uppercase;
  color: var(--bz-text);
}

.bz-faq-section__aside-text {
  font-size: 16px;
  line-height: 22px;
}

@media (max-width: 991.98px) {
  .bz-faq-section__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .bz-faq-section__aside {
    padding-top: 0;
  }
}

/* _contact_section (Figma Accueil > Section Contact : champs 313x46 #F0F0F0, libellés
   Area Normal 800 20px/25px blancs, photo à droite ~376x313) */
.bz-contact__title {
  max-width: 640px;
}

.bz-contact .bz-contact__intro {
  max-width: 794px;
  margin-bottom: 40px;
  color: var(--bz-text);
}

.bz-contact__grid {
  display: grid;
  grid-template-columns: minmax(0, 658px) minmax(0, 376px);
  justify-content: space-between;
  gap: 40px;
  align-items: start;
}

.bz-contact__grid--no-media {
  grid-template-columns: minmax(0, 658px);
}

.bz-contact__form iframe {
  min-height: 553px;
}

.bz-contact__media {
  margin-top: 42px;
  border-radius: var(--bz-radius-sm);
  overflow: hidden;
}

.bz-contact__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 376 / 313;
  object-fit: cover;
}

.bz-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 32px;
}

.bz-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.bz-field--full {
  grid-column: 1 / -1;
}

.bz-label {
  margin: 0;
  font-family: var(--bz-font);
  font-weight: 800;
  font-size: 20px;
  line-height: 25px;
  color: var(--bz-text);
}

.bz-input {
  box-sizing: border-box;
  width: 100%;
  min-height: 46px;
  padding: 10px 14px;
  border: 1px solid transparent;
  border-radius: var(--bz-radius-btn);
  background: var(--bz-btn-light);
  color: #233033;
  font-family: var(--bz-font);
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
}

.bz-input::placeholder {
  color: rgba(35, 48, 51, 0.55);
}

.bz-input:focus {
  outline: 2px solid var(--bz-cyan);
  outline-offset: 1px;
}

textarea.bz-input {
  min-height: 84px;
  resize: vertical;
}

.bz-contact .g-recaptcha {
  max-width: 100%;
  min-height: 78px; /* place du widget, chargé à la 1re interaction (footer.php) : pas de saut */
  overflow: hidden;
}

@media (max-width: 991.98px) {
  .bz-contact__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .bz-contact__media {
    margin-top: 0;
    max-width: 480px;
  }
}

@media (max-width: 575.98px) {
  .bz-form-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* _cta_band */
.bz-cta-band__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px 40px;
}

.bz-cta-band__title {
  max-width: 760px;
  margin: 0;
}

/* ==========================================================================
   Page Accueil (tâche 7, views/home/*) — Figma Accueil 1-3485, cadre 1280px
   --------------------------------------------------------------------------
   Relevés (px du cadre) :
   - Héros 1280x874 : surtitre à 219px du haut, H1 724px de large à 257, texte 641px
     (blanc 65 %) à 367 ; services à 528 : 3 colonnes à x 100 / 404 / 776, filets
     verticaux à 353 / 726 (titre 900 20px, texte 600 18/26, bouton contour blanc aligné
     en bas, ~91px sous les boutons).
   - Pourquoi Blitz (gris) : marge haute 72 ; colonne gauche 527px (titre 800 40px
     #233033, sous-titre #10A0C4, texte, photo 527x359 rayon 5px à 79px sous le texte) ;
     colonne droite à x 740, 437px : 4 points (titre 900 20px, texte 600 18/26) séparés
     par un filet noir 0,5px.
   - Nos partenaires (blanc) : titre centré à 92px du haut, logos ~110px de haut 52px
     plus bas, en défilement sur toute la largeur.
   - Bande de chiffres (foncé) 1280x164 : valeur 900 50px, libellé 600 18/26 (152px).
   - Témoignages (blanc) : contenu à 85px du haut, x 88, texte 758px, citation 702px,
     auteur 800 18/26 + poste 600, photo 346x473 rayon 5px à x 869.
   - Ressources + Revue de presse : un seul fond gris ; contenu à x 81, 1121px de large ;
     55px entre le bouton « Voir toutes… » et le titre Revue de presse.
   - FAQ (blanc) : contenu à x 81, 54px sous le gris ; formulaire 83px plus bas.
   ========================================================================== */
.bz-home {
  --bz-home-gutter-wide: clamp(16px, 6.3vw, 81px);  /* Ressources, Presse, FAQ */
}

/* Héros */
.bz-home-hero.bz-under-header {
  padding-top: calc(var(--bz-header-top) + var(--bz-header-h) + clamp(40px, 7vw, 89px));
  padding-bottom: clamp(48px, 7vw, 91px);
}

.bz-home-hero__intro {
  max-width: 724px;
}

.bz-home-hero .bz-eyebrow {
  margin-bottom: 15px;
}

.bz-home-hero__title {
  margin-bottom: 27px; /* boîte du H1 Figma 95px pour 2 lignes : texte à 367px */
  hyphens: manual;     /* pas de « FRAN-CHISE » coupé sur mobile */
}

.bz-home-hero__lead {
  max-width: 641px;
  margin-bottom: 0;
}

.bz-home-hero__lead > :last-child,
.bz-home-services__text > :last-child,
.bz-home-why__text > :last-child,
.bz-home-why__point-text > :last-child {
  margin-bottom: 0;
}

.bz-home-services {
  display: grid;
  grid-template-columns: minmax(0, 253fr) minmax(0, 373fr) minmax(0, 454fr);
  margin-top: clamp(40px, 6.5vw, 83px);
}

.bz-home-services__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}

.bz-home-services__item + .bz-home-services__item {
  padding-left: 50px;
  border-left: 1px solid rgba(255, 255, 255, 0.6);
}

.bz-home-services__item:not(:last-child) {
  padding-right: 24px;
}

.bz-home-services__title {
  margin-bottom: 22px;
}

.bz-home-services__text {
  margin-bottom: 40px;
  color: var(--bz-text);
}

.bz-home-services__text p {
  margin: 0 0 8px;
}

.bz-home-services__btn {
  margin-top: auto;
}

@media (max-width: 991.98px) {
  .bz-home-services {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .bz-home-services__item + .bz-home-services__item {
    padding-left: 0;
    padding-top: 32px;
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.6);
  }

  .bz-home-services__item:not(:last-child) {
    padding-right: 0;
  }

  .bz-home-services__text {
    margin-bottom: 24px;
  }
}

/* Pourquoi Blitz */
.bz-home-why {
  padding-bottom: clamp(48px, 7vw, 90px);
}

.bz-home-why__grid {
  display: grid;
  grid-template-columns: minmax(0, 527fr) minmax(0, 437fr);
  gap: 40px clamp(40px, 8.8vw, 113px);
  align-items: start;
}

.bz-home-why .bz-h2 {
  margin-bottom: 24px;
}

.bz-home-why__subtitle {
  margin-bottom: 6px;
}

.bz-home-why__text {
  margin-bottom: 0;
}

.bz-home-why__media {
  margin-top: clamp(32px, 6vw, 79px);
  border-radius: var(--bz-radius-sm);
  overflow: hidden;
}

.bz-home-why__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 527 / 359;
  object-fit: cover;
}

.bz-home-why__points {
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-home-why__point {
  padding-bottom: 24px;
}

.bz-home-why__point + .bz-home-why__point {
  padding-top: 48px;
  border-top: 0.5px solid #000000;
}

.bz-home-why__point .bz-h3 {
  margin-bottom: 14px;
}

.bz-home-why__point-text {
  color: var(--bz-text);
}

@media (max-width: 991.98px) {
  .bz-home-why__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .bz-home-why__media {
    max-width: 527px;
  }

  .bz-home-why__point + .bz-home-why__point {
    padding-top: 28px;
  }
}

/* Nos partenaires (défilement : .bz-marquee, blitz.js) */
.bz-home-partners {
  padding-block: clamp(48px, 7.2vw, 92px) clamp(48px, 10.7vw, 137px);
}

.bz-home-partners__title {
  margin-bottom: clamp(32px, 5vw, 64px);
  text-align: center;
}

.bz-home-partners__marquee .bz-marquee__track {
  gap: 72px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-home-partners__marquee.is-ready .bz-marquee__track {
  animation-name: bz-home-marquee;
}

@keyframes bz-home-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(calc(-50% - 36px)); } /* une copie + la moitié du gap de 72px */
}

@media (prefers-reduced-motion: reduce) {
  .bz-home-partners__marquee.is-ready .bz-marquee__track {
    animation: none;
  }
}

.bz-home-partners__logo {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  height: 110px;
}

.bz-home-partners__logo img {
  display: block;
  width: auto;
  max-width: 180px;
  height: auto;
  max-height: 110px;
  object-fit: contain;
}

@media (max-width: 575.98px) {
  .bz-home-partners__marquee .bz-marquee__track {
    gap: 40px;
  }

  @keyframes bz-home-marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(calc(-50% - 20px)); }
  }

  .bz-home-partners__logo {
    height: 80px;
  }

  .bz-home-partners__logo img {
    max-width: 130px;
    max-height: 80px;
  }
}

/* Bande de chiffres */
.bz-stats {
  padding: 0; /* main.css donne 60px à toute <section> */
  font-family: var(--bz-font);
}

.bz-stats__list {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px 20px;
  min-height: 164px;
  margin: 0 auto;
  padding-block: 32px;
  list-style: none;
}

.bz-stats__item {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: var(--bz-text);
}

.bz-stats__value {
  font-weight: 900;
  font-size: clamp(36px, 3.2vw + 10px, 50px);
  line-height: 1;
  white-space: nowrap;
}

.bz-stats__label {
  max-width: 152px;
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
}

@media (max-width: 991.98px) {
  .bz-stats__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .bz-stats__item {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
}

/* Témoignages (carrousel Bootstrap #carouselBlitz) */
.bz-home-testimonials {
  padding-block: clamp(48px, 6.6vw, 85px) clamp(48px, 6.3vw, 80px);
}

.bz-home-testimonials .bz-container {
  padding-inline: clamp(16px, 6.9vw, 88px) clamp(16px, 5.1vw, 65px);
}

.bz-home-testimonials__grid {
  display: grid;
  grid-template-columns: minmax(0, 758fr) minmax(0, 346fr);
  gap: 40px 23px;
  align-items: start;
}

.bz-home-testimonials__grid--no-media {
  grid-template-columns: minmax(0, 1fr);
}

.bz-home-testimonials__title {
  max-width: 420px;
  margin-bottom: 34px;
}

.bz-home-testimonials .bz-eyebrow {
  margin-bottom: 39px;
}

.bz-home-testimonials__item {
  margin: 0;
}

.bz-home-testimonials__quote {
  max-width: 702px;
  margin: 0;
  color: var(--bz-text);
}

.bz-home-testimonials__quote > :last-child {
  margin-bottom: 0;
}

.bz-home-testimonials__author {
  display: flex;
  flex-direction: column;
  margin-top: 48px;
  color: var(--bz-text);
}

.bz-home-testimonials__author strong {
  font-weight: 800;
}

.bz-home-testimonials__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  max-width: 702px;
  margin-top: 40px;
}

.bz-home-testimonials__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--bz-text);
  font-size: 16px;
  cursor: pointer;
}

.bz-home-testimonials__arrow:hover,
.bz-home-testimonials__arrow:focus-visible {
  background: var(--bz-grey-2);
}

.bz-home-testimonials__arrow:focus-visible,
.bz-home-testimonials__dots [data-bs-slide-to]:focus-visible {
  outline: 2px solid var(--bz-cyan);
  outline-offset: 2px;
}

/* Points du Figma : pastille active allongée (19x8), autres 8x8, gris #868686 */
.bz-home-testimonials__dots.carousel-indicators {
  position: static;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
}

.bz-home-testimonials__dots [data-bs-slide-to] {
  box-sizing: content-box;
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background-color: #868686;
  opacity: 0.4;
  text-indent: 0;
  transition: width 0.2s ease, opacity 0.2s ease;
}

.bz-home-testimonials__dots [data-bs-slide-to].active {
  width: 19px;
  opacity: 1;
}

.bz-home-testimonials__media {
  border-radius: var(--bz-radius-sm);
  overflow: hidden;
}

.bz-home-testimonials__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 346 / 473;
  object-fit: cover;
}

@media (max-width: 991.98px) {
  .bz-home-testimonials__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .bz-home-testimonials__media {
    max-width: 346px;
  }

  .bz-home-testimonials__author {
    margin-top: 28px;
  }
}

/* Ressources + Revue de presse : un seul fond gris (le fond propre de _resources_section
   est retiré dans l'enveloppe .bz-home-grey) */
.bz-home-grey .bz-resources {
  background: none;
  padding-bottom: 0;
}

.bz-home .bz-resources .bz-container,
.bz-home-press .bz-container,
.bz-home .bz-faq-section .bz-container {
  padding-inline: var(--bz-home-gutter-wide);
}

.bz-home-press {
  background: none; /* main.css colore toute <section> : le gris vient de .bz-home-grey */
  padding-block: clamp(40px, 4.3vw, 55px) clamp(48px, 7.5vw, 96px);
}

.bz-home .bz-resources__head {
  margin-bottom: 52px;
}

.bz-home-press__title {
  margin-bottom: 56px;
  text-align: center;
}

/* FAQ */
.bz-home .bz-faq-section {
  padding-block: clamp(40px, 4.2vw, 54px) clamp(48px, 6.5vw, 83px);
}

/* ==========================================================================
   Page Trouver une franchise (tâche 8, views/franchise_search/*) — Figma 42-5080
   Relevés (px du cadre de 1280px) :
   - fond « Background dégradé gris » 1280x2499 sous la pilule jusqu'au pied de page
     (Figma #E9E8E8 → #FBFBFB ; on garde .bz-bg-grey des directives, comme ailleurs) ;
   - H1 « Titre page » 900 Black Italic 40px/100 % majuscules #233033, boîte à top 216,
     x 98 ; texte « Texte courant » 600 18/26 #233033 à 65 %, 641px, top 281, x 102 ;
   - libellés de filtre Texte courant #233033, top 360 (boîte 32px) ; Select 177x40
     (min 120), top 392, x 98 / 304 / 514, fond #FFFFFF, bordure 1px #D9D9D9, rayon 5px,
     retraits 12/12/12/16, écart 8px avec l'icône 16px ; texte 16px/100 % #1E1E1E ;
   - fiches « Fiche Brand » 274x253 sur 4 colonnes, x 57 / 354 / 651 / 948 (écart 23px),
     rangées à 513 + n x 277 (écart 24px) ; 71px sous la dernière rangée.
   ========================================================================== */
.bz-search {
  --bz-search-gutter: clamp(16px, 4.45vw, 57px); /* grille des fiches : 57px du bord */
  padding-bottom: clamp(48px, 5.5vw, 71px);
}

.bz-search.bz-under-header {
  padding-top: calc(var(--bz-header-top) + var(--bz-header-h) + clamp(32px, 6.7vw, 86px));
}

/* main.css donne un fond et 60px de marge à toute <section> */
.bz-search__head,
.bz-search__results {
  background: none;
  padding: 0;
  overflow: visible;
}

.bz-search__title {
  margin-bottom: 25px;
  hyphens: manual;
}

.bz-search__lead {
  max-width: 641px;
  margin: 0 0 53px;
  color: var(--bz-text-muted);
}

/* Filtres : une ligne, puis une colonne sous 576px */
.bz-search-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 30px;
  margin-bottom: clamp(40px, 6.3vw, 81px);
}

.bz-search-filter__field {
  flex: 0 0 177px;
  min-width: 120px;
}

.bz-search-filter__label {
  display: block;
  margin: 0 0 6px;
  font-family: var(--bz-font);
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
  color: var(--bz-text);
}

.bz-search-filter__select,
.bz-search-filter .select2-container--default .select2-selection--single {
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  border: 1px solid #D9D9D9;
  border-radius: 8px; /* Figma « Select Field » : Radius/200 */
  background: #FFFFFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%231E1E1E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center / 16px 16px;
  color: #1E1E1E;
  font-family: var(--bz-font);
  font-weight: 400;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}

.bz-search-filter__select {
  appearance: none;
  -webkit-appearance: none;
  padding: 0 36px 0 16px; /* 16px à gauche ; icône 16px + 8px d'écart + 12px à droite */
  text-overflow: ellipsis;
}

.bz-search-filter__select:focus-visible,
.bz-search-filter .select2-container--focus .select2-selection--single,
.bz-search-filter .select2-container--open .select2-selection--single {
  outline: 2px solid var(--bz-cyan);
  outline-offset: 1px;
  border-color: #D9D9D9;
}

/* Emplacement : liste à recherche Select2 (même habillage que les deux autres) */
.bz-search-filter .select2-container--default .select2-selection--single {
  padding: 0; /* main.css lui donne 12px : le retrait est sur __rendered */
}

.bz-search-filter .select2-container--default .select2-selection--single .select2-selection__rendered {
  box-sizing: border-box;
  width: 100%;
  padding: 0 36px 0 16px;
  line-height: 38px;
  color: #1E1E1E;
}

.bz-search-filter .select2-container--default .select2-selection--single .select2-selection__arrow {
  display: none; /* l'icône vient du fond, comme sur les <select> natifs */
}

.bz-search-filter .select2-dropdown {
  overflow: hidden;
  border-color: #D9D9D9;
  border-radius: 8px;
  font-family: var(--bz-font);
  font-size: 16px;
  color: #1E1E1E;
}

/* Liste ouverte (Figma « Filtre », état ouvert) : option courante en gras, survol gris
   comme les menus FR / CA */
.bz-search-filter .select2-container--default .select2-results__option--selected,
.bz-search-filter .select2-container--default .select2-results__option[aria-selected="true"] {
  background-color: transparent;
  font-weight: 700;
}

.bz-search-filter .select2-container--default .select2-results__option--highlighted[aria-selected],
.bz-search-filter .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: var(--bz-grey-1);
  color: #1E1E1E;
}

/* Grille des fiches : 4 → 2 → 1 colonnes */
.bz-search__results-inner {
  padding-inline: var(--bz-search-gutter);
}

.bz-search__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px 23px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-search__item {
  min-width: 0;
}

.bz-search__loader {
  display: flex;
  justify-content: center;
  padding: 40px 0;
}

@media (max-width: 991.98px) {
  .bz-search__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .bz-search__grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .bz-search-filter__field {
    flex: 1 1 100%;
  }
  .bz-search__lead {
    margin-bottom: 32px;
  }
}

/* Fenêtre de détail (franchise_search/_popup.php, ouverte au clic sur une fiche) */
.bz-popup {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 16px;
  background: rgba(0, 0, 0, 0.78);
}

.bz-popup__dialog {
  position: relative;
  box-sizing: border-box;
  width: min(760px, 100%);
  max-height: calc(100vh - 32px);
  overflow: auto;
  padding: clamp(24px, 4vw, 40px);
  border-radius: var(--bz-radius);
}

.bz-popup__close {
  position: absolute;
  top: 16px;
  right: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid #D9D9D9;
  border-radius: 50%;
  background: var(--bz-white);
  color: var(--bz-text);
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}

.bz-popup__close:hover,
.bz-popup__close:focus-visible {
  border-color: var(--bz-teal);
  outline: none;
  box-shadow: 0 0 0 2px var(--bz-cyan);
}

.bz-popup__title {
  margin: 0 56px 24px 0;
  hyphens: manual;
  font-size: clamp(24px, 2vw + 14px, 32px);
}

.bz-popup__intro {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  gap: 24px;
  align-items: center;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(35, 48, 51, 0.15);
}

.bz-popup__intro--text {
  grid-template-columns: minmax(0, 1fr);
}

.bz-popup__logo {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
  border-radius: var(--bz-radius);
}

.bz-popup__text {
  margin: 0;
  color: var(--bz-text);
}

.bz-popup__stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 24px 16px;
  margin: 0;
  padding: 24px 0;
  list-style: none;
  border-bottom: 1px solid rgba(35, 48, 51, 0.15);
  text-align: center;
}

.bz-popup__stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.bz-popup__icon {
  font-size: 48px;
  line-height: 1;
  color: var(--bz-cyan-text);
}

.bz-popup__value {
  font-weight: 900;
  font-size: 20px;
  line-height: 26px;
  color: var(--bz-text);
}

.bz-popup__label {
  font-size: 16px;
  line-height: 22px;
  color: var(--bz-text-muted);
}

.bz-popup__cta {
  display: flex;
  justify-content: center;
  padding-top: 24px;
}

@media (max-width: 575.98px) {
  .bz-popup__intro {
    grid-template-columns: minmax(0, 1fr);
  }
  .bz-popup__logo {
    max-width: 160px;
    margin-inline: auto;
  }
}

/* ==========================================================================
   Page Entreprise (tâche 9, views/partenaire/*) — Figma 1-1200 / 110-1575 Crèmerie
   Chez Mamie, 1-1325 Bagels Le Trou, cadres de 1280px
   --------------------------------------------------------------------------
   Couleur de marque : .bz-partner reçoit en ligne --bz-brand (primary_color validé) et
   --bz-brand-ink (blanc ou #233033, le plus contrasté sur la couleur de marque, calculé
   en PHP). Sans couleur valide : --bz-brand = --bz-cyan (:root), --bz-brand-ink foncé.
   Relevés (px du cadre) :
   - Héros (gris) : H1 « Titre page » 900 Black Italic 40px couleur de marque, à 67px sous
     la pilule, x 99 ; accroche 800 18/26 puis texte 600 18/26 (732px) ; bouton plein
     couleur de marque 175x40 rayon 7 ; mention 600 15px/26 ; logo 208x81 à x 987 ;
     bas du héros à 80px sous la mention.
   - Bande de chiffres 1280x143 couleur de marque : picto 48x46, 23px avant la valeur
     900 Black 40px/100 %, libellé 600 18/26 ; colonnes à x 102 / 465 / 770 / 1015.
   - Pourquoi choisir (blanc) : titre 800 40px à 96px du haut, 62px avant la liste ;
     numéros 800 40px couleur de marque (52px, alignés à droite), titre 900 Black 20px,
     texte 600 18/26 à x 163 ; filets noirs 0,5px de 493px, 26px de part et d'autre ;
     photo 430x529 rayon 5px à x 742.
   - Bandeau photo pleine largeur 1280x445.
   - Profil recherché : titre 800 40px, texte d'intro 600 18/26, 2 colonnes de 508px à
     x 79 / 671 (titre 900 20px, texte 600 18/26).
   - Étapes de sélection (gris) : titre à gauche (x 93), liste de 495px à x 610.
   - Témoignages (blanc) : titre 800 40px, sous-titre 600 18/26, citation 600 18/26
     #575757, étoiles couleur de marque, points (actif 19x8) ; photo 346x473 rayon 5px.
   - Appel à l'action (foncé) : titre 800 40px blanc (640px), bouton contour blanc dessous.
   ========================================================================== */
.bz-partner {
  --bz-brand-ink: #233033;
  --bz-partner-gutter: clamp(16px, 7.1vw, 91px);
}

.bz-partner .bz-container {
  padding-inline: var(--bz-partner-gutter);
}

/* Pas de « FRAN-CHISÉS » coupé sur mobile (overflow-wrap reste en dernier recours) */
.bz-partner .bz-h2,
.bz-partner .bz-h3 {
  hyphens: manual;
}

/* Bouton plein couleur de marque (héros) */
.bz-btn--brand {
  min-height: 40px;
  border-color: var(--bz-brand);
  background-color: var(--bz-brand);
  color: var(--bz-brand-ink);
}

.bz-btn--brand:hover,
.bz-btn--brand:focus-visible {
  border-color: var(--bz-brand);
  background-color: transparent;
  color: var(--bz-text);
}

.bz-btn--brand:focus-visible {
  outline-color: var(--bz-brand);
}

/* Héros */
.bz-partner-hero.bz-under-header {
  padding-top: calc(var(--bz-header-top) + var(--bz-header-h) + clamp(32px, 5.2vw, 67px));
  padding-bottom: clamp(48px, 6.3vw, 80px);
}

.bz-partner-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 732px) minmax(0, 208px);
  justify-content: space-between;
  gap: 32px 40px;
  align-items: end;
}

.bz-partner-hero__grid--no-logo {
  grid-template-columns: minmax(0, 732px);
}

.bz-partner-hero__title {
  margin-bottom: 8px;
  color: var(--bz-brand);
  hyphens: manual;
}

.bz-partner-hero__tagline,
.bz-partner-hero__text {
  margin: 0 0 26px;
  font-size: 18px;
  line-height: 26px;
  color: var(--bz-text);
}

.bz-partner-hero__tagline {
  font-weight: 800;
}

.bz-partner-hero__text {
  margin-bottom: 45px;
}

.bz-partner-hero__note {
  margin: 9px 0 0;
  font-size: 15px;
  line-height: 26px;
  color: var(--bz-text);
}

.bz-partner-hero__logo {
  justify-self: end;
  margin-bottom: 8px;
}

.bz-partner-hero__logo img {
  display: block;
  width: 100%;
  max-width: 208px;
  height: auto;
  max-height: 140px;
  object-fit: contain;
}

/* Bande de chiffres */
.bz-partner-stats {
  padding: 0; /* main.css donne 60px à toute <section> */
  background: var(--bz-brand);
  color: var(--bz-brand-ink);
  font-family: var(--bz-font);
}

.bz-partner .bz-partner-stats__list {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px 20px;
  min-height: 143px;
  margin: 0 auto;
  padding-block: 28px;
  padding-inline: clamp(16px, 7.9vw, 102px);
  list-style: none;
}

.bz-partner-stats__item {
  display: flex;
  align-items: center;
  gap: 23px;
  min-width: 0;
}

.bz-partner-stats__icon {
  flex: 0 0 auto;
  font-size: 46px;
  line-height: 1;
}

.bz-partner-stats__text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.bz-partner-stats__value {
  font-weight: 900;
  font-size: clamp(32px, 2vw + 14px, 40px);
  line-height: 1;
  white-space: nowrap;
}

.bz-partner-stats__label {
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
}

/* Listes numérotées (Pourquoi choisir, Étapes) */
.bz-partner-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-partner-list__item {
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr);
  column-gap: 12px;
  padding-block: 26px;
  border-top: 0.5px solid #000000;
}

.bz-partner-list__item:first-child {
  padding-top: 0;
  border-top: 0;
}

.bz-partner-list__item:last-child {
  padding-bottom: 0;
}

.bz-partner-list__num {
  margin-top: -6px;
  font-family: var(--bz-font);
  font-weight: 800;
  font-size: 40px;
  line-height: 1;
  text-align: right;
  white-space: nowrap;
  color: var(--bz-brand);
}

.bz-partner-list__title {
  margin: 0;
  line-height: 1;
  hyphens: manual;
}

.bz-partner-list__text {
  margin-top: 16px;
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
  color: var(--bz-text);
}

/* Titre-phrase (plus de 60 caractères, partner_helper.php) : style texte, pas majuscule 900 */
.bz-partner .bz-h3.bz-partner-title--text {
  font-weight: 800;
  font-size: 18px;
  line-height: 26px;
  text-transform: none;
  max-width: none;
}

.bz-partner-list__body > .bz-partner-list__text:first-child,
.bz-partner-who__item > .bz-partner-list__text:first-child {
  margin-top: 0;
}

.bz-partner-list__text > :last-child {
  margin-bottom: 0;
}

.bz-partner-list__text p {
  margin: 0 0 8px;
}

/* Pourquoi choisir */
.bz-partner-why {
  padding-top: clamp(48px, 7.5vw, 96px);
  padding-bottom: clamp(48px, 8.4vw, 108px);
}

.bz-partner-why__title {
  max-width: 800px;
  margin-bottom: clamp(32px, 4.8vw, 62px);
}

.bz-partner-why__grid {
  display: grid;
  grid-template-columns: minmax(0, 526px) minmax(0, 430px);
  column-gap: clamp(40px, 9.8vw, 125px);
  align-items: start;
}

.bz-partner-why__grid--no-media {
  grid-template-columns: minmax(0, 526px);
}

.bz-partner-why__grid .bz-partner-list__item {
  margin-right: 33px; /* filets de 493px */
}

.bz-partner-why__media {
  margin-top: 6px;
  border-radius: var(--bz-radius-sm);
  overflow: hidden;
}

.bz-partner-why__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 430 / 529;
  object-fit: cover;
}

/* Bandeau photo */
.bz-photo-band {
  overflow: hidden;
}

.bz-photo-band img {
  display: block;
  width: 100%;
  height: clamp(200px, 34.8vw, 445px);
  object-fit: cover;
}

/* Profil recherché */
.bz-partner-who {
  padding-top: clamp(48px, 6.1vw, 78px);
  padding-bottom: clamp(48px, 7.8vw, 100px);
}

.bz-partner-who__title {
  margin-bottom: 8px;
}

.bz-partner-who__lead {
  max-width: 735px;
  margin-bottom: 0;
}

.bz-partner-who__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 508px));
  gap: 56px 84px;
  margin: clamp(32px, 5vw, 65px) 0 0;
  padding: 0;
  list-style: none;
}

.bz-partner-who__item-title {
  max-width: 340px;
  margin: 0;
  line-height: 27px;
  hyphens: manual;
}

.bz-partner-who__item .bz-partner-list__text {
  margin-top: 22px;
}

/* Étapes de sélection */
.bz-partner-steps {
  padding-top: clamp(48px, 6.4vw, 82px);
  padding-bottom: clamp(48px, 5vw, 64px);
}

.bz-partner-steps__grid {
  display: grid;
  grid-template-columns: minmax(0, 519px) minmax(0, 495px);
  align-items: start;
}

.bz-partner-steps__title {
  max-width: 340px;
}

.bz-partner-list--steps .bz-partner-list__item {
  column-gap: 11px;
  padding-block: 24px;
}

.bz-partner-list--steps .bz-partner-list__item:first-child {
  padding-top: 6px;
}

.bz-partner-list--steps .bz-partner-list__item--title-only {
  align-items: center;
}

.bz-partner-list--steps .bz-partner-list__item--title-only .bz-partner-list__num {
  margin-top: 0;
}

.bz-partner-steps__desc {
  margin-top: 14px;
}

/* Témoignages */
.bz-partner-testimonials {
  padding-top: clamp(48px, 5.5vw, 71px);
  padding-bottom: clamp(48px, 4.8vw, 62px);
}

.bz-partner-testimonials__grid {
  display: grid;
  grid-template-columns: minmax(0, 758px) minmax(0, 346px);
  justify-content: space-between;
  gap: 40px;
  align-items: start;
}

.bz-partner-testimonials__grid--no-media {
  grid-template-columns: minmax(0, 758px);
}

.bz-partner-testimonials__body {
  padding-top: clamp(0px, 1.3vw, 16px);
}

.bz-partner-testimonials__title {
  margin-bottom: 18px;
}

.bz-partner-testimonials__subtitle {
  margin: 0 0 40px;
  font-size: 18px;
  line-height: 26px;
  color: var(--bz-text);
}

.bz-partner-testimonials__item {
  margin: 0;
}

.bz-partner-testimonials__quote {
  max-width: 702px;
  margin: 0;
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
  color: #575757;
}

.bz-partner-testimonials__stars {
  display: flex;
  gap: 6px;
  margin-top: 28px;
  font-size: 30px;
  line-height: 1;
  color: var(--bz-brand);
}

.bz-partner-testimonials__dots.carousel-indicators {
  position: static;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;
  margin: 40px 0 0;
  padding: 0;
}

.bz-partner-testimonials__dots [data-bs-slide-to] {
  box-sizing: content-box;
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background-color: #868686;
  opacity: 0.35;
  text-indent: 0;
  transition: width 0.2s ease, opacity 0.2s ease;
}

.bz-partner-testimonials__dots [data-bs-slide-to].active {
  width: 19px;
  opacity: 1;
}

.bz-partner-testimonials__dots [data-bs-slide-to]:focus-visible {
  outline: 2px solid var(--bz-brand);
  outline-offset: 2px;
}

.bz-partner-testimonials__media {
  border-radius: var(--bz-radius-sm);
  overflow: hidden;
}

.bz-partner-testimonials__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 346 / 473;
  object-fit: cover;
}

/* Appel à l'action (_cta_band, variante bouton sous le titre) */
.bz-cta-band--stacked .bz-cta-band__inner {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 30px;
}

.bz-cta-band--stacked .bz-cta-band__title {
  max-width: 660px;
}

.bz-partner .bz-cta-band .bz-container {
  padding-inline: clamp(16px, 8.7vw, 112px);
}

@media (max-width: 991.98px) {
  .bz-partner-hero__grid,
  .bz-partner-why__grid,
  .bz-partner-steps__grid,
  .bz-partner-testimonials__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .bz-partner-hero__logo {
    justify-self: start;
    order: -1;
    margin-bottom: 0;
  }

  .bz-partner-hero__logo img {
    max-width: 160px;
    max-height: 110px;
  }

  .bz-partner .bz-partner-stats__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bz-partner-why__grid {
    row-gap: 40px;
  }

  .bz-partner-why__grid .bz-partner-list__item {
    margin-right: 0;
  }

  .bz-partner-why__media,
  .bz-partner-testimonials__media {
    max-width: 430px;
  }

  .bz-partner-steps__grid {
    row-gap: 32px;
  }

  .bz-partner-steps__title {
    max-width: none;
  }
}

@media (max-width: 767.98px) {
  .bz-partner-who__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .bz-partner-who__item-title {
    max-width: none;
  }

  .bz-partner-hero__text {
    margin-bottom: 32px;
  }
}

@media (max-width: 575.98px) {
  .bz-partner .bz-partner-stats__list {
    grid-template-columns: minmax(0, 1fr);
    justify-items: start;
  }

  .bz-partner-stats__item {
    gap: 16px;
  }

  .bz-partner-list__item {
    grid-template-columns: 46px minmax(0, 1fr);
    column-gap: 12px;
  }

  .bz-partner-list__num {
    font-size: 30px;
    margin-top: -3px;
  }
}

/* ==========================================================================
   Pages Services : parties communes (Développement de franchise 1-856, tâche 10, et
   Franchiser son entreprise 1-962, tâche 11). Enveloppe .bz-svc sur les deux pages.
   - Héros 1280x645 identique sur les deux cadres (partials/_service_hero.php).
   - Surtitre de section en majuscules (#10A0C4) 63px sous le haut, titre 800 40px à
     +111 (« L'expertise » / « Notre accompagnement ») : .bz-svc-eyebrow, .bz-svc-title.
   - Témoignages : photo 417px de large, citation 650px (partials/_testimonials.php) ; Franchiser
     place la photo à gauche (.bz-home-testimonials__grid--media-first).
   - Ressources et FAQ : contenu à 81px du bord, comme l'accueil.
   ========================================================================== */
.bz-svc {
  --bz-svc-gutter-wide: clamp(16px, 6.3vw, 81px);  /* Ressources, FAQ */
}

/* Héros (partials/_service_hero.php, classes .bz-home-hero + réglages des pages Services) */
.bz-svc-hero.bz-under-header {
  padding-top: calc(var(--bz-header-top) + var(--bz-header-h) + clamp(40px, 7.6vw, 97px));
  padding-bottom: clamp(48px, 8.4vw, 108px);
}

.bz-svc-hero .bz-home-hero__lead {
  color: rgba(255, 255, 255, 0.8);
}

.bz-svc-hero__btn {
  margin-top: 40px;
}

/* Surtitre et titre de section */
.bz-svc-eyebrow {
  text-transform: uppercase;
  margin-bottom: 22px;
}

.bz-svc-title {
  max-width: 805px;
  margin-bottom: clamp(32px, 4.7vw, 60px);
}

/* Témoignages (partials/_testimonials.php, classes .bz-home-testimonials + réglages des pages Services) */
.bz-svc .bz-home-testimonials {
  padding-block: clamp(48px, 6vw, 77px) clamp(48px, 6.5vw, 83px);
}

.bz-svc .bz-home-testimonials__grid {
  grid-template-columns: minmax(0, 687fr) minmax(0, 417fr);
}

.bz-svc .bz-home-testimonials__grid--no-media {
  grid-template-columns: minmax(0, 1fr);
}

.bz-svc .bz-home-testimonials__title {
  margin-bottom: 35px;
}

.bz-svc .bz-home-testimonials .bz-eyebrow {
  margin-bottom: 28px;
}

.bz-svc .bz-home-testimonials__quote,
.bz-svc .bz-home-testimonials__nav {
  max-width: 650px;
}

.bz-svc .bz-home-testimonials__author {
  margin-top: clamp(28px, 5.9vw, 75px);
}

.bz-svc .bz-home-testimonials__nav {
  margin-top: 8px;
}

.bz-svc .bz-home-testimonials__media img {
  aspect-ratio: 417 / 480;
}

@media (max-width: 991.98px) {
  .bz-svc .bz-home-testimonials__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .bz-svc .bz-home-testimonials__media {
    max-width: 417px;
  }
}

/* Ressources et FAQ : contenu à 81px du bord (comme l'accueil) */
.bz-svc .bz-resources .bz-container,
.bz-svc .bz-faq-section .bz-container {
  padding-inline: var(--bz-svc-gutter-wide);
}

.bz-svc .bz-resources {
  padding-block: clamp(48px, 5.4vw, 69px) clamp(48px, 4.5vw, 58px);
}

/* ==========================================================================
   Page Développement de franchise (tâche 10, views/developpement_franchise/*) — Figma 1-856
   --------------------------------------------------------------------------
   Relevés (px du cadre de 1280px, lus dans le panneau Properties) :
   - Héros 1280x645 : surtitre #00CCFF à 227, H1 (Titre page) 724px à 265, texte 641px
     blanc 80 % à 375, bouton contour blanc 220x41 à 496 (« Scroll to Section: Contact »).
   - L'expertise (blanc, 645-1296) : surtitre 600 18/26 #10A0C4 en majuscules à 708, titre
     800 40px 805px à 756, points à 917 et 1099, colonnes x 102 / 640 (titre 900 20px, texte
     600 18/26 38px plus bas, 493-515px).
   - Pourquoi confier (gris, 1296-2252) : grille de « Pourquoi Blitz » de l'accueil
     (.bz-home-why) ; titre à 1378, sous-titre #10A0C4 à 1580, texte 540px à 1613, photo
     527x349 rayon 5px à 1810 ; points à x 739 (458px), filet noir 0,5px sous chaque point,
     le dernier compris.
   - Chiffres (foncé, 2252-2646) : titre 800 40px 489px à x 95 / 2319 ; chiffres x 708 / 1028,
     y 2321 / 2458 (valeur 900 50px, libellé 600 18/26 71px sous la valeur).
   - Témoignages (blanc, 2646-3286) : carrousel de l'accueil (.bz-home-testimonials) ;
     titre à 2723, sous-titre 2837, citation 650px à 2892, auteur à 3089 ; photo 417x480
     rayon 5px à x 798 / 2723.
   - Ressources (gris, 3286-3968) : titre centré à 3355, sous-titre 3416, fiches à 3502
     (x 82, 1121px), bouton à droite à 3869. FAQ (blanc, 3968-4616), formulaire foncé.
   Héros, surtitre et titre de L'expertise, témoignages, Ressources et FAQ : règles
   communes « Pages Services » ci-dessus (.bz-svc). Ici, seulement ce qui est propre à
   la page (enveloppe .bz-svc.bz-devf).
   ========================================================================== */

/* L'expertise Blitz Franchise */
.bz-devf-expertise {
  padding-block: clamp(48px, 4.9vw, 63px) clamp(48px, 5.2vw, 66px);
}

/* Composant partagé .bz-points : liste de points (h3 + texte) sur 2 colonnes, 1 sous
   768px. Utilisé par L'expertise (ici) et par À propos (Pourquoi Blitz, Nos valeurs,
   réglages propres sous .bz-about-points) : une retouche ici touche les deux pages. */
.bz-points {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 40px 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-points__item {
  min-width: 0;
  padding-right: 25px;
}

.bz-points__item .bz-h3 {
  margin-bottom: 18px;
}

.bz-points__text {
  color: var(--bz-text);
}

.bz-points__text > :last-child,
.bz-devf-stats__label > :last-child {
  margin-bottom: 0;
}

@media (max-width: 767.98px) {
  .bz-points {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .bz-points__item {
    padding-right: 0;
  }
}

/* Pourquoi confier votre développement (classes .bz-home-why + réglages de la page) */
.bz-devf-why {
  padding-top: clamp(48px, 6.4vw, 82px);
}

.bz-devf-why .bz-h2 {
  margin-bottom: 40px;
}

.bz-devf-why .bz-home-why__subtitle {
  margin-bottom: 10px;
}

.bz-devf-why .bz-home-why__media {
  margin-top: clamp(32px, 5.2vw, 67px);
}

.bz-devf-why .bz-home-why__media img {
  aspect-ratio: 527 / 349;
}

.bz-devf-why .bz-home-why__point {
  padding-bottom: 36px;
  border-bottom: 0.5px solid #000000;
}

.bz-devf-why .bz-home-why__point + .bz-home-why__point {
  padding-top: 27px;
  border-top: 0;
}

.bz-devf-why .bz-home-why__point .bz-h3 {
  margin-bottom: 16px;
}

/* Bande de chiffres */
.bz-devf-stats {
  padding-block: clamp(48px, 5.2vw, 67px) clamp(48px, 5.2vw, 66px);
}

.bz-devf-stats__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 472px);
  gap: 32px 40px;
  align-items: start;
}

.bz-devf-stats__title {
  max-width: 489px;
  margin: 0;
}

.bz-devf-stats__list {
  display: grid;
  /* Figma : colonnes à x 708 / 1028 (libellé de droite 151px en Area Normal) ; la police
     de secours, plus large, coupait « accompagnées » : 20px pris à la colonne de gauche. */
  grid-template-columns: minmax(0, 300fr) minmax(0, 172fr);
  gap: 14px 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-devf-stats__item {
  display: flex;
  flex-direction: column;
  gap: 21px;
  min-width: 0;
  color: var(--bz-text);
}

.bz-devf-stats__value {
  font-weight: 900;
  font-size: clamp(36px, 3.2vw + 10px, 50px);
  line-height: 1;
  white-space: nowrap;
}

.bz-devf-stats__label {
  padding-right: 16px;
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
}

.bz-devf-stats__label p {
  margin: 0;
}

@media (max-width: 991.98px) {
  .bz-devf-stats__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .bz-devf-stats__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 16px;
  }

  .bz-devf-stats__item {
    gap: 12px;
  }

  .bz-devf-stats__label {
    padding-right: 0;
  }
}

/* ==========================================================================
   Page Franchiser son entreprise (tâche 11, views/franchiser/*) — Figma 1-962
   --------------------------------------------------------------------------
   Relevés (px du cadre de 1280px, mesurés sur le prototype ; le compte Figma n'avait
   pas le mode dev) :
   - Héros 1280x645 : identique à Développement de franchise (partials/_service_hero).
   - Notre accompagnement (blanc, 645-1488) : surtitre et titre comme L'expertise
     (.bz-svc-eyebrow / .bz-svc-title) ; deux colonnes à x 100 / 643 : à gauche 3 points
     (titre 900 20px, texte 444px 37px sous le titre, ~40px entre les points), à droite
     « Documentation et outils » (474px) puis une liste à filets 0,5px, un élément tous
     les 50px, sans filet sous le dernier.
   - Votre entreprise est-elle prête? (gris, 1488-1980) : titre à +89, sous-titre
     #10A0C4 ~48px plus bas, texte 472px ; à droite liste à filets, un élément tous les
     64px, à partir du haut du titre.
   - Une équipe qui comprend (blanc, 1980-2405) : grand titre à gauche à +88, à droite
     surtitre cyan en majuscules à x 643 et texte 540px (2 paragraphes).
   - Chiffres (foncé, 2405-2567) : 3 chiffres sur une ligne, répartis de x 100 à 1180,
     valeur 900 50px, libellé à 20px de la valeur (lignes coupées comme le Figma par un
     <br> dans le texte du bloc).
   - Une première analyse (gris, 2567-3292) : colonne de gauche 490px (titre à +74,
     sous-titre, texte, phrase, liste numérotée 01-03 : numéro 900 à x 100, texte à x 157,
     un élément tous les ~66px, filets entre les éléments), bouton contour à 3170 ;
     photo 416x568 rayon 5px à x 774, en haut de la section +75.
   - Témoignages (blanc, 3292-3881) : photo 417x461 à GAUCHE (x 69, +62), texte à
     x 555 (650px), titre à +72 ; même carrousel que l'accueil.
   - Ressources, FAQ, formulaire : règles communes « Pages Services ».
   ========================================================================== */

/* Composants partagés .bz-cols (deux colonnes égales, 1 sous 768px) et .bz-text (texte
   courant d'un bloc WYSIWYG) : Franchiser (Notre accompagnement, Votre entreprise est-elle
   prête?, Une équipe, Analyse) et À propos (Notre raison d'être, Vision / Mission). Une
   retouche ici touche les deux pages ; les réglages propres restent sous .bz-franchiser-*
   et .bz-about-*. */
.bz-cols {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 40px 0;
  align-items: start;
}

.bz-cols > * {
  min-width: 0;
}

/* Texte courant des blocs (HTML de l'éditeur), partagé */
.bz-text {
  color: var(--bz-text);
}

.bz-text p {
  margin: 0 0 26px;
}

.bz-text > :last-child {
  margin-bottom: 0;
}

/* Sous-titre cyan sous un titre de section */
.bz-franchiser-subtitle {
  margin-bottom: 9px;
}

/* Listes à filets (le <ul>/<ol> vient du texte du bloc) */
.bz-franchiser-list ul,
.bz-franchiser-list ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-franchiser-list li {
  padding: 12px 0;
}

.bz-franchiser-list li + li {
  border-top: 0.5px solid #000000;
}

.bz-franchiser-list li:last-child {
  padding-bottom: 0;
}

/* Liste seule dans sa colonne, plus aérée : le premier élément s'aligne sur le titre voisin */
.bz-franchiser-list--loose li {
  padding: 19px 0;
}

.bz-franchiser-list--loose li:first-child {
  padding-top: 0;
}

.bz-franchiser-list--loose li:last-child {
  padding-bottom: 0;
}

/* Liste numérotée 01, 02… */
.bz-franchiser-list--numbered ol {
  counter-reset: bz-franchiser-step;
}

.bz-franchiser-list--numbered li {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: baseline;
  padding: 10px 0 30px;
  counter-increment: bz-franchiser-step;
}

.bz-franchiser-list--numbered li:last-child {
  padding-bottom: 30px;
}

.bz-franchiser-list--numbered li::before {
  content: counter(bz-franchiser-step, decimal-leading-zero);
  font-weight: 900;
  font-size: 20px;
  line-height: 26px;
  color: var(--bz-teal);
}

/* Notre accompagnement */
.bz-franchiser-bases {
  padding-block: clamp(48px, 4.9vw, 63px) clamp(48px, 4.4vw, 56px);
}

.bz-franchiser-points {
  display: grid;
  gap: 40px;
  margin: 0;
  padding: 0 clamp(0px, 7.5vw, 96px) 0 0;
  list-style: none;
}

.bz-franchiser-points .bz-h3,
.bz-franchiser-docs .bz-h3 {
  margin-bottom: 17px;
}

.bz-franchiser-docs {
  padding-right: clamp(0px, 5.2vw, 66px);
}

/* Votre entreprise est-elle prête? */
.bz-franchiser-ready {
  padding-block: clamp(48px, 6.3vw, 80px) clamp(48px, 4.4vw, 56px);
}

.bz-franchiser-ready .bz-h2,
.bz-franchiser-analysis .bz-h2 {
  margin-bottom: 40px;
}

.bz-franchiser-ready__intro {
  padding-right: clamp(0px, 5.3vw, 68px);
}

.bz-franchiser-ready .bz-franchiser-list {
  padding-right: clamp(0px, 5.2vw, 66px);
}

/* Une équipe qui comprend */
.bz-franchiser-team {
  padding-block: clamp(48px, 6.9vw, 88px) clamp(48px, 5.7vw, 73px);
}

.bz-franchiser-team__title {
  max-width: 440px;
  margin: 0;
  hyphens: manual; /* pas de « CRÉA-TION » coupé */
}

.bz-franchiser-team__eyebrow {
  margin-bottom: 11px;
}

/* Bande de chiffres (classes .bz-stats de l'accueil) */
.bz-franchiser-stats .bz-stats__list {
  min-height: 162px;
}

.bz-franchiser-stats .bz-stats__item {
  gap: 20px;
}

.bz-franchiser-stats .bz-stats__label {
  max-width: none;
}

.bz-franchiser-stats .bz-stats__label p {
  margin: 0;
}

/* Une première analyse */
.bz-franchiser-analysis {
  padding-block: clamp(48px, 5.8vw, 74px) clamp(48px, 6.4vw, 82px);
}

.bz-franchiser-analysis__grid {
  display: grid;
  grid-template-columns: minmax(0, 490px) minmax(0, 416px);
  justify-content: space-between;
  gap: 40px;
  align-items: start;
  padding-right: clamp(16px, 7vw, 90px);
}

.bz-franchiser-analysis__grid--no-media {
  grid-template-columns: minmax(0, 490px);
}

.bz-franchiser-analysis__body {
  min-width: 0;
}

.bz-franchiser-analysis__lead {
  margin: 40px 0 0;
  color: var(--bz-text);
}

.bz-franchiser-analysis__btn {
  margin-top: 30px;
}

.bz-franchiser-analysis__media {
  border-radius: var(--bz-radius-sm);
  overflow: hidden;
}

.bz-franchiser-analysis__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 416 / 568;
  object-fit: cover;
}

/* Formulaire : titre sur 2 lignes comme le Figma (717px), sans coupure de mot */
.bz-franchiser .bz-contact__title {
  max-width: 760px;
  hyphens: manual;
}

/* Témoignages : photo à gauche */
.bz-franchiser .bz-home-testimonials {
  padding-block: clamp(48px, 4.8vw, 62px) clamp(48px, 5.2vw, 66px);
}

.bz-svc .bz-home-testimonials__grid--media-first {
  grid-template-columns: minmax(0, 417fr) minmax(0, 650fr);
  gap: 40px clamp(32px, 5.4vw, 69px);
  padding-inline: clamp(16px, 5.4vw, 69px) clamp(16px, 5.9vw, 75px);
}

.bz-home-testimonials__grid--media-first .bz-home-testimonials__media {
  order: -1;
}

.bz-home-testimonials__grid--media-first .bz-home-testimonials__body {
  padding-top: 10px;
}

.bz-svc .bz-home-testimonials__grid--media-first .bz-home-testimonials__media img {
  aspect-ratio: 417 / 461;
}

@media (max-width: 991.98px) {
  .bz-franchiser-analysis__grid {
    grid-template-columns: minmax(0, 1fr);
    padding-right: var(--bz-gutter);
  }

  .bz-franchiser-analysis__media {
    max-width: 416px;
  }

  .bz-svc .bz-home-testimonials__grid--media-first {
    grid-template-columns: minmax(0, 1fr);
  }

  .bz-franchiser-stats .bz-stats__list {
    align-items: start;
  }

  /* Empilé : texte d'abord, sinon la photo suit celle d'« Une première analyse ». */
  .bz-home-testimonials__grid--media-first .bz-home-testimonials__media {
    order: 0;
  }

  .bz-home-testimonials__grid--media-first .bz-home-testimonials__body {
    padding-top: 0;
  }
}

@media (max-width: 767.98px) {
  .bz-cols {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .bz-franchiser-points,
  .bz-franchiser-docs,
  .bz-franchiser-ready__intro,
  .bz-franchiser-ready .bz-franchiser-list {
    padding-right: 0;
  }

  .bz-franchiser-team__title {
    max-width: none;
  }
}

/* ==========================================================================
   Pages Ressources et Article (tâche 12, views/blog/*) — Figma 36-3604 et 1-1430
   --------------------------------------------------------------------------
   Relevés (px du cadre de 1280px, mesurés sur le prototype ; Claude in Chrome n'était
   pas connecté, pas de mode dev) :
   Ressources (36-3604)
   - Bandeau foncé 1280x422 (sous la pilule) : H1 « Titre page » à x 100, ~93px sous la
     pilule ; filtres 39px sous le H1 : « Tous les sujets » 178x40 (même habillage que
     les filtres de Trouver une franchise), recherche 342x40 à 12px, loupe à droite ;
     80px sous les filtres.
   - Liste (gris) : fiches « Fiches articles de blogue » 359px sur 3 colonnes, x 58 /
     463 / 868 (écart 46px), rangées espacées de 54px, 70px sous le bandeau ; 3 rangées
     par page ; points de pagination 60px sous les fiches (actif 19x8, autres 8x8,
     comme les témoignages), ~54px avant le pied de page. Pas de formulaire.
   Article (1-1430)
   - Photo pleine largeur 1280x584 sous la pilule.
   - Gris : titre 800 40px majuscules (style « Titre section », pas l'italique du titre
     page) à x 120, 80px sous la photo ; « Écrit par » / « Date » (libellé gras) ~50px
     plus bas ; contenu 630px (x 120-750), texte 18/26 justifié, intertitres gras ;
     barre latérale 283px à x 885, à hauteur de la ligne auteur : titres 900 20px
     majuscules, icônes 32px, sujets 16px, articles similaires (vignette 115x77 rayon
     5px, titre 800 16px, date) ; 144px sous le contenu, puis le pied de page.
   ========================================================================== */

/* Ressources : bandeau */
.bz-blog-hero.bz-under-header {
  padding-top: calc(var(--bz-header-top) + var(--bz-header-h) + clamp(40px, 7.3vw, 93px));
  padding-bottom: clamp(48px, 6.3vw, 80px);
}

.bz-blog-hero__title {
  margin-bottom: clamp(24px, 3vw, 39px);
}

.bz-blog-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0;
}

.bz-blog-filter__topic {
  flex: 0 0 178px;
  min-width: 0;
}

.bz-blog-filter__search {
  position: relative;
  flex: 0 1 342px;
  min-width: 0;
}

.bz-blog-filter__input {
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  padding: 0 44px 0 16px;
  border: 1px solid #D9D9D9;
  border-radius: 8px;
  background: #FFFFFF;
  color: #1E1E1E;
  font-family: var(--bz-font);
  font-weight: 400;
  font-size: 16px;
  line-height: 1;
  appearance: none;
  -webkit-appearance: none;
}

.bz-blog-filter__input::placeholder {
  color: #B3B3B3;
  opacity: 1;
}

.bz-blog-filter__input::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

.bz-blog-filter__input:focus-visible,
.bz-blog-filter__submit:focus-visible {
  outline: 2px solid var(--bz-cyan);
  outline-offset: 1px;
}

.bz-blog-filter__submit {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 0 8px 8px 0;
  background: transparent;
  color: #1E1E1E;
  font-size: 15px;
  line-height: 40px;
  cursor: pointer;
}

/* Ressources : liste (main.css donne 60px de marge à toute <section>) */
.bz-blog-list {
  padding-top: clamp(40px, 5.5vw, 70px);
  padding-bottom: clamp(48px, 4.2vw, 54px);
}

.bz-blog-list__inner {
  padding-inline: clamp(16px, 4.5vw, 58px);
}

.bz-blog-list__grid {
  gap: 54px 46px;
}

.bz-blog-list__empty {
  grid-column: 1 / -1;
  margin: 0;
  text-align: center;
  color: var(--bz-text-muted);
}

.bz-blog-pager {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  margin-top: clamp(32px, 4.7vw, 52px); /* + 8px de zone de clic = 60px sous les fiches */
}

.bz-blog-pager[hidden] {
  display: none;
}

/* Point visible 8x8 (actif 19x8), zone de clic 24px (retrait transparent) */
.bz-blog-pager__dot {
  box-sizing: content-box;
  width: 8px;
  height: 8px;
  margin: 0;
  padding: 8px 3px;
  border: 0;
  border-radius: 8px;
  background-color: #868686;
  background-clip: content-box;
  opacity: 0.4;
  cursor: pointer;
  transition: width 0.2s ease, opacity 0.2s ease;
}

.bz-blog-pager__dot:hover {
  opacity: 0.7;
}

.bz-blog-pager__dot.is-active {
  width: 19px;
  opacity: 1;
  cursor: default;
}

.bz-blog-pager__dot:focus-visible {
  outline: 2px solid var(--bz-cyan);
  outline-offset: -2px;
}

@media (max-width: 991.98px) {
  .bz-blog-list__grid {
    gap: 32px 24px;
  }
}

@media (max-width: 575.98px) {
  .bz-blog-filter__topic,
  .bz-blog-filter__search {
    flex: 1 1 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bz-blog-pager__dot {
    transition: none;
  }
}

/* Article : photo */
.bz-article__hero.bz-under-header {
  padding: 0;
  height: clamp(280px, 45.6vw, 584px);
  overflow: hidden;
}

.bz-article__hero img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Article : titre, auteur, contenu, barre latérale */
.bz-article__body {
  padding-top: clamp(40px, 6.3vw, 80px);
  padding-bottom: clamp(64px, 11.3vw, 144px);
}

.bz-article__layout {
  display: grid;
  grid-template-columns: minmax(0, 630px) minmax(0, 283px);
  grid-template-areas:
    "title   ."
    "meta    side"
    "content side";
  grid-template-rows: auto auto 1fr;
  justify-content: space-between;
  column-gap: 40px;
  padding-left: clamp(16px, 9.4vw, 120px);
  padding-right: clamp(16px, 8.75vw, 112px);
}

.bz-article__title {
  grid-area: title;
  margin: 0;
  line-height: 1.25;
  hyphens: manual;
}

.bz-article__meta {
  grid-area: meta;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 54px;
  margin: clamp(24px, 3.4vw, 44px) 0 clamp(28px, 4vw, 52px);
  color: var(--bz-text);
}

.bz-article__meta strong {
  font-weight: 800;
}

.bz-article-sidebar {
  grid-area: side;
  min-width: 0;
  padding-top: clamp(0px, 5.2vw, 66px); /* « Partager » ~20px sous la ligne auteur */
}

.bz-article-sidebar__widget + .bz-article-sidebar__widget {
  margin-top: 44px;
}

.bz-article-sidebar__title {
  margin-bottom: 12px;
}

.bz-article-share,
.bz-article-topics,
.bz-article-related {
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-article-share {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.bz-article-share__link {
  display: block;
  color: var(--bz-text);
  font-size: 32px;
  line-height: 1;
  text-decoration: none;
  transition: color 0.2s ease;
}

.bz-article-share__link:hover,
.bz-article-share__link:focus-visible {
  color: var(--bz-accent-text);
}

.bz-article-topics li + li {
  margin-top: 3px;
}

.bz-article-topics__link,
.bz-article-related__date {
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: var(--bz-text);
}

.bz-article-topics__link {
  text-decoration: none;
}

.bz-article-topics__link:hover,
.bz-article-topics__link:focus-visible {
  color: var(--bz-accent-text);
  text-decoration: underline;
}

.bz-article-related__item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 18px;
}

.bz-article-related__item + .bz-article-related__item {
  margin-top: 22px;
}

.bz-article-related__img {
  flex: 0 0 115px;
  width: 115px;
  height: 77px;
  border-radius: var(--bz-radius-sm);
  object-fit: cover;
}

.bz-article-related__text {
  min-width: 0;
  padding-top: 2px;
}

.bz-article-related__title {
  margin: 0;
  font-family: var(--bz-font);
  font-weight: 800;
  font-size: 16px;
  line-height: 22px;
  color: var(--bz-text);
  overflow-wrap: break-word;
}

.bz-article-related__link {
  color: inherit;
  text-decoration: none;
}

/* Toute la ligne est cliquable (lien étiré sur le titre) */
.bz-article-related__link::after {
  content: "";
  position: absolute;
  inset: 0;
}

.bz-article-related__item:hover .bz-article-related__title,
.bz-article-related__link:focus-visible {
  color: var(--bz-accent-text);
}

.bz-article-related__link:focus-visible {
  outline: none;
}

.bz-article-related__item:focus-within {
  outline: 2px solid var(--bz-cyan);
  outline-offset: 4px;
  border-radius: var(--bz-radius-sm);
}

/* --------------------------------------------------------------------------
   Texte riche .bz-richtext (contenu des articles .bz-article__content et des pages
   personnalisées .bz-custom__content) : HTML de l'éditeur (Summernote, souvent collé de
   Google Docs). Base commune : seule la police collée est neutralisée ; la taille, la
   couleur, le fond et l'interligne saisis par l'admin sont conservés (page personnalisée :
   l'admin garde la main sur son contenu, encarts colorés, embeds). Les ARTICLES ajoutent
   .bz-article__content, qui neutralise aussi taille, couleur, fond et interligne pour
   garder la typographie du site ; le gras, l'italique, l'alignement et les marges restent.
   -------------------------------------------------------------------------- */
.bz-article__content {
  grid-area: content;
}

.bz-richtext {
  min-width: 0;
  font-family: var(--bz-font);
  font-weight: 400;
  font-size: 18px;
  line-height: 26px;
  color: var(--bz-text);
  overflow-wrap: break-word;
}

.bz-richtext * {
  font-family: inherit !important; /* polices collées de Google Docs */
}

.bz-article__content * {
  font-size: inherit !important;
  line-height: inherit !important;
  color: inherit !important;
  background-color: transparent !important;
  white-space: normal !important; /* Google Docs pose white-space: pre sur les <li> */
}

.bz-richtext p {
  margin: 0 0 26px;
}

/* Ligne vide de Google Docs (<p><br></p>) : une ligne, sans marge en plus */
.bz-richtext p:has(> br:only-child),
.bz-richtext p:has(> b:only-child > br:only-child),
.bz-richtext p:has(> span:only-child > br:only-child) {
  margin: 0;
}

.bz-richtext h1,
.bz-richtext h2,
.bz-richtext h3,
.bz-richtext h4,
.bz-richtext h5,
.bz-richtext h6 {
  margin: 40px 0 8px;
  font-weight: 800;
  font-size: 18px;
  line-height: 26px;
  text-transform: none;
}

.bz-richtext h2 {
  font-size: 22px;
  line-height: 30px;
}

.bz-article__content h1,
.bz-article__content h2,
.bz-article__content h3,
.bz-article__content h4,
.bz-article__content h5,
.bz-article__content h6 {
  font-size: 18px !important;
  line-height: 26px !important;
}

.bz-article__content h2 {
  font-size: 22px !important;
  line-height: 30px !important;
}

.bz-richtext > .bz-article__block:first-child > :first-child,
.bz-richtext > :first-child {
  margin-top: 0;
}

.bz-richtext b,
.bz-richtext strong {
  font-weight: 700;
}

.bz-richtext ul,
.bz-richtext ol {
  margin: 0 0 26px;
  padding-inline-start: 26px;
}

.bz-article__content ul,
.bz-article__content ol {
  padding-inline-start: 26px !important; /* Google Docs : 48px en ligne */
}

.bz-richtext ul {
  list-style: disc;
}

.bz-richtext ol {
  list-style: decimal;
}

.bz-richtext li {
  margin: 0;
}

.bz-richtext li > p {
  margin: 0;
}

.bz-richtext a {
  color: var(--bz-accent-text);
}

.bz-article__content a,
.bz-article__content a * {
  color: var(--bz-accent-text) !important;
}

.bz-richtext a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.bz-richtext a:hover,
.bz-richtext a:focus-visible {
  text-decoration-thickness: 2px;
}

.bz-richtext img,
.bz-richtext video,
.bz-richtext iframe {
  max-width: 100% !important;
  border-radius: var(--bz-radius-sm);
}

.bz-richtext img,
.bz-richtext video {
  height: auto !important;
}

.bz-richtext blockquote {
  margin: 0 0 26px;
  padding: 4px 0 4px 20px;
  border-left: 3px solid var(--bz-cyan-text);
  font-style: italic;
}

.bz-richtext blockquote > :last-child {
  margin-bottom: 0;
}

.bz-richtext table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
}

.bz-richtext pre,
.bz-richtext pre * {
  white-space: pre-wrap !important;
}

@media (min-width: 768px) {
  .bz-article__content {
    text-align: justify;
  }
}

/* Texte justifié trop étroit sur mobile (lézardes) : aligné à gauche */
@media (max-width: 767.98px) {
  .bz-richtext [style*="justify"] {
    text-align: left !important;
  }
}

@media (max-width: 991.98px) {
  .bz-article__layout {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "title"
      "meta"
      "content"
      "side";
    grid-template-rows: auto;
  }

  .bz-article-sidebar {
    padding-top: 48px;
  }
}

/* ==========================================================================
   Page À propos (tâche 13, views/about/*) — Figma 1-1092
   --------------------------------------------------------------------------
   Relevés (px du cadre de 1280px, mesurés sur le prototype : le navigateur n'avait pas
   accès au mode dev) :
   - Héros (foncé, 0-763) : surtitre à 245, H1 2 lignes, texte blanc 80 % 641px ; photo
     375x397 rayon 5px à x 827, bas aligné sur le bas du texte (661).
   - Notre histoire (gris, 763-~1590) : titre à +85 ; colonne de l'année 351px (x 100-451),
     année 800 40px alignée à droite, filet 0,5px 8px sous l'année ; récit à x 494 (631px),
     ~36px entre deux années ; ~88px sous le dernier récit.
   - Chiffres (foncé) : titre 2 lignes à +64, chiffres 72px plus bas, 2 colonnes à x 96 /
     653 (valeur 900 50px, libellé 900 18px majuscules, description 600 18/26 ~16px plus
     bas, ~450-520px), une rangée tous les ~248px. Blocs about/stats.
   - Nos services (blanc) : grille de « Pourquoi Blitz » de l'accueil (colonnes 527 / 458 à
     x 100 / 731) ; photo 527x426 à 70px sous le texte ; services séparés par un filet
     0,5px (27px au-dessus, 32px au-dessous) ; bouton contour #10A0C4 « En savoir plus ».
   - Pourquoi Blitz Franchise (gris) : titre 2 lignes à +67, points 2 x 2 à x 100 / 640
     67px plus bas (grille de L'expertise, Développement de franchise).
   - Notre raison d'être (foncé, 238px de haut) : titre à gauche, texte 475px à x 640.
   - Vision / Mission (gris) : 2 colonnes x 104 / 642, texte 35px sous le titre ; Nos
     valeurs 77px plus bas, valeurs 2 x 2 serrées (titre puis texte).
   - Rencontrez l'équipe (blanc) : titre à +78 ; fiches 296px (photo 296x280 rayon 5px),
     3 colonnes réparties sur 1074px, une rangée tous les ~454px ; nom 900 20px, poste 600.
   - Formulaire (foncé) : partials/_contact_section (natif), titre sur 2 lignes (~450px).
   ========================================================================== */

/* Héros */
.bz-about-hero.bz-under-header {
  padding-top: calc(var(--bz-header-top) + var(--bz-header-h) + clamp(40px, 9vw, 115px));
  padding-bottom: clamp(48px, 8vw, 102px);
}

.bz-about-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 641px) minmax(0, 375px);
  justify-content: space-between;
  align-items: end;
  gap: 40px;
}

.bz-about-hero__grid--no-media {
  grid-template-columns: minmax(0, 724px);
}

.bz-about-hero .bz-eyebrow {
  margin-bottom: 15px;
}

.bz-about-hero__title {
  margin-bottom: 27px;
  hyphens: manual;
}

.bz-bg-dark .bz-about-hero__lead {
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.8);
}

.bz-about-hero__lead p {
  margin: 0 0 26px;
}

.bz-about-hero__lead > :last-child,
.bz-about-history__text > :last-child {
  margin-bottom: 0;
}

.bz-about-hero__media {
  border-radius: var(--bz-radius-sm);
  overflow: hidden;
}

.bz-about-hero__media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 375 / 397;
  object-fit: cover;
}

@media (max-width: 991.98px) {
  .bz-about-hero__grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .bz-about-hero__media {
    max-width: 375px;
  }
}

/* Notre histoire */
.bz-about-history {
  padding-block: clamp(48px, 6.6vw, 85px) clamp(48px, 6.9vw, 88px);
}

.bz-about-history__title {
  max-width: 351px;
  margin-bottom: 18px;
}

.bz-about-history__list {
  display: grid;
  gap: 36px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-about-history__item {
  display: grid;
  grid-template-columns: minmax(0, 351px) minmax(0, 631px);
  column-gap: 43px;
  align-items: start;
}

.bz-about-history__year {
  display: block;
  padding-bottom: 8px;
  border-bottom: 0.5px solid var(--bz-text);
  font-weight: 800;
  font-size: clamp(30px, 2vw + 14px, 40px);
  line-height: 1;
  text-align: right;
  color: var(--bz-text);
}

.bz-about-history__text {
  color: var(--bz-text);
}

.bz-about-history__text p {
  margin: 0 0 26px;
}

@media (max-width: 767.98px) {
  .bz-about-history__item {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 16px;
  }

  .bz-about-history__year {
    text-align: left;
  }
}

/* Blitz Franchise en chiffres (blocs about/stats) */
.bz-about-stats {
  padding-block: clamp(48px, 5vw, 64px) clamp(48px, 5.2vw, 67px);
}

.bz-about-stats__title {
  max-width: 400px;  /* « BLITZ FRANCHISE / EN CHIFFRES » sur 2 lignes */
  margin-bottom: clamp(32px, 5.6vw, 72px);
}

.bz-about-stats__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(32px, 5vw, 64px) 40px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-about-stats__item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  color: var(--bz-text);
}

.bz-about-stats__value {
  font-weight: 900;
  font-size: clamp(36px, 3.2vw + 10px, 50px);
  line-height: 1;
  white-space: nowrap;
}

.bz-about-stats__label {
  font-weight: 900;
  font-size: 18px;
  line-height: 26px;
  text-transform: uppercase;
}

.bz-about-stats__text {
  max-width: 470px;
  margin-top: 16px;
  padding-right: 16px;
  font-weight: 600;
  font-size: 18px;
  line-height: 26px;
}

.bz-about-stats__text p {
  margin: 0;
}

@media (max-width: 575.98px) {
  .bz-about-stats__list {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }
}

/* Nos services (classes .bz-home-why de l'accueil + réglages de la page) */
.bz-about-services {
  padding-top: clamp(48px, 6vw, 77px);
  padding-bottom: clamp(48px, 7.5vw, 96px);
}

.bz-about-services .bz-h2 {
  margin-bottom: 24px;
}

.bz-about-services .bz-home-why__media {
  margin-top: clamp(32px, 5.5vw, 70px);
}

.bz-about-services .bz-home-why__media img {
  aspect-ratio: 527 / 426;
}

.bz-about-services .bz-home-why__point {
  padding-bottom: 27px;
}

.bz-about-services .bz-home-why__point + .bz-home-why__point {
  padding-top: 32px;
}

.bz-about-services .bz-home-why__point:last-child {
  padding-bottom: 0;
}

.bz-about-services .bz-home-why__point .bz-h3 {
  margin-bottom: 6px;
}

.bz-about-services__btn {
  margin-top: 22px;
  border-color: var(--bz-cyan-text);
  color: var(--bz-cyan-text);
}

.bz-about-services__btn:hover,
.bz-about-services__btn:focus-visible {
  background-color: rgba(16, 160, 196, 0.15);
  border-color: var(--bz-cyan-text);
  color: var(--bz-teal);
}

/* Pourquoi Blitz Franchise et Nos valeurs (grille .bz-points) */
.bz-about-why {
  padding-block: clamp(48px, 5.2vw, 67px) clamp(48px, 6.5vw, 83px);
}


/* « NOTRE / VISION », « NOTRE / MISSION » sur 2 lignes, comme le Figma */
.bz-about-values__heading {
  max-width: 260px;
  hyphens: manual;
}

.bz-about-why__title {
  max-width: 440px;
  margin-bottom: clamp(32px, 5.2vw, 67px);
  hyphens: manual;
}

.bz-about-points .bz-h3 {
  margin-bottom: 12px;
}

@media (min-width: 768px) {
  .bz-about-points .bz-points__item {
    padding-right: clamp(0px, 4vw, 50px);
  }
}

.bz-about-points .bz-points__text p {
  margin: 0;
}

/* Notre raison d'être */
.bz-about-purpose {
  padding-block: clamp(48px, 6vw, 78px);
}

.bz-about-purpose__grid {
  align-items: center;
}

.bz-about-purpose__title {
  max-width: 440px;
  margin: 0;
  hyphens: manual;
}

.bz-about-purpose .bz-text {
  max-width: 475px;
}

/* Vision, mission, valeurs */
.bz-about-values {
  padding-block: clamp(48px, 5vw, 64px) clamp(48px, 5.5vw, 70px);
}

.bz-about-values__cols .bz-text {
  max-width: 500px;
  padding-right: 16px;
}

.bz-about-values__heading {
  margin-bottom: 35px;
}

.bz-about-values__cols + .bz-about-values__list {
  margin-top: clamp(40px, 6vw, 77px);
}

.bz-about-values__title {
  margin-bottom: 30px;
}

.bz-about-values .bz-about-points {
  gap: 24px 0;
}

.bz-about-values .bz-about-points .bz-h3 {
  margin-bottom: 4px;
}

@media (max-width: 767.98px) {
  .bz-about-purpose__grid,
  .bz-about-values__cols {
    grid-template-columns: minmax(0, 1fr);
  }

  .bz-about-values__heading {
    margin-bottom: 20px;
  }
}

/* Notre équipe (Composantes > Fiche membre équipe) */
.bz-about-team {
  padding-block: clamp(48px, 6vw, 78px) clamp(48px, 6.9vw, 88px);
}

.bz-about-team__title {
  margin-bottom: clamp(32px, 4.5vw, 58px);
}

.bz-about-team__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 296px));
  justify-content: space-between;
  gap: clamp(40px, 5.5vw, 70px) 24px;
  max-width: 1074px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.bz-team-card {
  min-width: 0;
}

.bz-team-card__media {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: var(--bz-radius-sm);
}

/* Survol (Figma : Rectangle noir 25 % sur la photo), seulement si la fiche mène au profil */
.bz-team-card__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  transition: background-color var(--bz-card-transition);
  pointer-events: none;
}

.bz-team-card--linked:hover .bz-team-card__media::after,
.bz-team-card--linked:focus-within .bz-team-card__media::after {
  background: rgba(0, 0, 0, 0.25);
}

.bz-team-card__photo {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 296 / 280;
  object-fit: cover;
  background: var(--bz-grey-2);
}

.bz-team-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-top: 15px; /* nom à 296px du haut d'une photo de 281px */
}

.bz-team-card__name {
  margin: 0;
  font-weight: 800;
  font-size: 24px;
}

.bz-team-card__linkedin {
  flex: 0 0 auto;
  color: var(--bz-cyan-text);
  font-size: 20px;
  line-height: 1;
}

.bz-team-card__linkedin:hover,
.bz-team-card__linkedin:focus-visible {
  color: var(--bz-teal);
}

.bz-team-card__role {
  margin: 7px 0 0;
  color: var(--bz-text);
}

@media (max-width: 991.98px) {
  .bz-about-team__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .bz-about-team__grid {
    grid-template-columns: minmax(0, 1fr);
    max-width: 296px;
  }
}

/* Formulaire : titre sur 2 lignes comme le Figma */
.bz-about .bz-contact__title {
  max-width: 480px;
  hyphens: manual;
}

/* ==========================================================================
   Pages personnalisées, 404 / 410 et bandeau de témoins (tâche 14)
   --------------------------------------------------------------------------
   Pas de cadre Figma dédié : le spec réutilise l'en-tête et le pied de page communs. Héros
   foncé comme celui de Ressources (.bz-under-header), contenu dans .bz-container sur fond
   blanc, texte riche = .bz-richtext (partagé avec le contenu des articles).
   ========================================================================== */

/* Page personnalisée */
.bz-custom__hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding-bottom: clamp(32px, 4.7vw, 60px);
}

.bz-custom__hero--image {
  min-height: clamp(320px, 40vw, 480px);
  display: flex;
  align-items: flex-end;
}

.bz-custom__hero--image .bz-custom__hero-inner {
  position: relative;
}

.bz-custom__hero-img {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Voile dégradé : le titre blanc reste lisible quelle que soit la photo */
.bz-custom__hero--image::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(7, 55, 67, 0.75) 0%, rgba(2, 25, 31, 0.92) 100%);
}

.bz-custom__title {
  margin: 0;
}

.bz-custom__body {
  padding-bottom: clamp(64px, 9vw, 112px);
}

.bz-custom__content {
  max-width: 860px;
}

/* Page d'erreur (errors/html/error_404.php) */
.bz-error {
  padding-bottom: clamp(64px, 9vw, 112px);
}

.bz-error__body {
  max-width: 760px; /* le conteneur reste centré comme sur les autres pages */
}

.bz-error__text {
  max-width: 540px;
}

.bz-error__other {
  margin-top: clamp(24px, 3vw, 40px);
}

.bz-error__other .bz-lead {
  max-width: 540px;
}

.bz-error__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
}

/* Bandeau de témoins (template/_cookie_banner.php) : carte flottante en bas de page, sur
   fond foncé ; boutons du système (Blanc plein = Accepter, contour blanc = Refuser). */
.bz-cookie {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 24px;
  z-index: 99999;
  box-sizing: border-box;
  max-width: 860px;
  max-height: calc(100vh - 120px);
  margin-inline: auto;
  overflow-y: auto;
  padding: 22px 26px;
  border: 1px solid rgba(255, 255, 255, 0.18); /* se détache du pied de page foncé */
  border-radius: var(--bz-radius);
  box-shadow: 0 18px 45px rgba(0, 40, 46, 0.38), 0 2px 8px rgba(0, 40, 46, 0.22);
  animation: bz-cookie-up 0.55s cubic-bezier(0.22, 0.9, 0.35, 1.1) both;
}

@keyframes bz-cookie-up {
  from { opacity: 0; transform: translateY(40px); }
  to   { opacity: 1; transform: translateY(0); }
}

.bz-cookie__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.bz-cookie__title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 6px;
  font-weight: 900;
  font-size: 16px;
  line-height: 1.25;
  text-transform: uppercase;
  color: var(--bz-text);
}

.bz-cookie__text {
  margin: 0;
  font-size: 14px;
  line-height: 22px;
  color: var(--bz-text-muted);
}

.bz-cookie__text a {
  color: var(--bz-accent-text);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.bz-cookie__text a:hover,
.bz-cookie__text a:focus-visible {
  text-decoration-thickness: 2px;
}

.bz-cookie__text a:focus-visible {
  outline: 2px solid var(--bz-cyan);
  outline-offset: 2px;
}

.bz-cookie__actions {
  display: flex;
  flex-shrink: 0;
  gap: 10px;
}

@media (max-width: 640px) {
  .bz-cookie {
    bottom: 12px;
    padding: 18px;
  }

  .bz-cookie__row {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
  }

  .bz-cookie__actions .bz-btn {
    flex: 1 1 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bz-cookie {
    animation: none;
  }
}

/* ==========================================================================
   Mouvement (commun à toutes les pages)
   Tout est discret (0,4 à 0,9 s, petits déplacements, jamais de rebond) et s'arrête sous
   prefers-reduced-motion : html.bz-motion n'est posée par template/_assets.php que hors de
   cette préférence, les autres effets sont dans un @media (prefers-reduced-motion: no-preference).
   ========================================================================== */

/* Apparition au défilement : blitz.js pose [data-bz-reveal] sur les éléments sous l'écran
   au chargement, puis .is-revealed (et --bz-reveal-delay pour le décalage) à leur entrée. */
.bz-motion [data-bz-reveal]:not(.is-revealed) {
  opacity: 0;
}

.bz-motion [data-bz-reveal].is-revealed {
  animation: bz-reveal 0.6s cubic-bezier(0.2, 0.6, 0.2, 1) var(--bz-reveal-delay, 0ms) backwards;
}

@keyframes bz-reveal {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
}

@media print {
  .bz-motion [data-bz-reveal] {
    opacity: 1 !important;
    animation: none !important;
  }
}

/* Chronologie d'À propos : le filet sous l'année se trace (de la droite, comme l'année
   alignée à droite ; de la gauche sous 768px) quand l'étape apparaît. */
.bz-motion .bz-about-history__item[data-bz-reveal] .bz-about-history__year {
  position: relative;
  border-bottom-color: transparent;
}

.bz-motion .bz-about-history__item[data-bz-reveal] .bz-about-history__year::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -0.5px;
  left: 0;
  border-bottom: 0.5px solid var(--bz-text);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.9s cubic-bezier(0.4, 0, 0.2, 1) calc(var(--bz-reveal-delay, 0ms) + 0.25s);
}

.bz-motion .bz-about-history__item.is-revealed .bz-about-history__year::after {
  transform: scaleX(1);
}

@media (max-width: 767.98px) {
  .bz-motion .bz-about-history__item[data-bz-reveal] .bz-about-history__year::after {
    transform-origin: left;
  }
}

@media (prefers-reduced-motion: no-preference) {
  /* Titre de l'accueil : le mot en bleu (bloc title_accent) se dévoile de gauche à droite.
     Marges négatives du découpage : l'italique déborde de sa boîte. */
  .bz-home-hero__title .bz-accent {
    display: inline-block;
    animation: bz-accent-in 0.9s cubic-bezier(0.2, 0.6, 0.2, 1) 0.3s backwards;
  }

  @keyframes bz-accent-in {
    from {
      clip-path: inset(-20% 100% -20% -20%);
      transform: translateX(-12px);
    }
    to {
      clip-path: inset(-20% -20% -20% -20%);
      transform: none;
    }
  }

  /* Fiches : la flèche avance, la photo grossit lentement dans son cadre */
  .bz-arrow {
    transition: transform var(--bz-card-transition);
  }

  .bz-card-article:hover .bz-arrow,
  .bz-card-article:focus-within .bz-arrow,
  .bz-card-press:hover .bz-arrow,
  .bz-card-press:focus-within .bz-arrow {
    transform: translateX(6px);
  }

  .bz-card-article__media img,
  .bz-card-press__media img {
    transition: transform 0.7s cubic-bezier(0.2, 0.6, 0.2, 1);
  }

  .bz-card-article:hover .bz-card-article__media img,
  .bz-card-article:focus-within .bz-card-article__media img,
  .bz-card-press:hover .bz-card-press__media img,
  .bz-card-press:focus-within .bz-card-press__media img {
    transform: scale(1.04);
  }

  /* Fiche entreprise : la photo est le fond de la fiche (style en ligne) ; un calque qui en
     hérite grossit sous le voile (::before, z-index -1). */
  .bz-card-franchise::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image: inherit;
    background-size: cover;
    background-position: center;
    transition: transform 0.7s cubic-bezier(0.2, 0.6, 0.2, 1);
  }

  .bz-card-franchise:hover::after,
  .bz-card-franchise:focus-within::after {
    transform: scale(1.04);
  }

  /* Barre : la pilule se resserre et son ombre s'affirme une fois la page défilée
     (body.scrolled, posée par main.js au-delà de 100px). Bureau seulement. */
  .bz-header__inner {
    transition: max-width 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  }
}

@media (min-width: 1200px) {
  .scrolled .bz-header__inner {
    max-width: 1120px;
    box-shadow: 0 10px 30px rgba(0, 40, 46, 0.18);
  }
}