/* ============================================================
   GSB — Amélioration design (passe 1 : micro-interactions).
   100% ADDITIF : ne supprime ni couleur, ni photo, ni élément,
   ni structure. Réversible (supprimer gsb-design.*).
   ============================================================ */
:root { --gsb-ease: cubic-bezier(.4, 0, .2, 1); }

/* Transitions douces sur les éléments interactifs */
a, button,
.bt_bb_button, .bt_bb_button .bt_bb_link,
.gm-anchor, .gm-menu-item__link,
.bt_bb_icon, .wp-block-button__link {
  transition: transform .25s var(--gsb-ease),
              box-shadow .25s var(--gsb-ease),
              background-color .25s var(--gsb-ease),
              color .25s var(--gsb-ease),
              filter .25s var(--gsb-ease);
}

/* Boutons : léger relief au survol (couleurs inchangées) */
.bt_bb_button:hover, .gm-anchor:hover, .wp-block-button__link:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(1, 98, 166, .22);
}

/* Icônes (réseaux + thématiques) : petit rebond au survol */
.bt_bb_icon:hover { transform: translateY(-3px) scale(1.04); }

/* Liens du menu : soulignement animé discret */
.gm-menu-item__link:hover { filter: brightness(1.1); }

/* Défilement fluide + focus accessible (clavier) */
html { scroll-behavior: smooth; }
a:focus-visible, button:focus-visible, .bt_bb_button:focus-visible {
  outline: 3px solid #f5c518;
  outline-offset: 3px;
  border-radius: 2px;
}

/* Images : rendu un peu plus net au survol (sans rognage) */
.bt_bb_image img { transition: transform .4s var(--gsb-ease); }
.bt_bb_image:hover img { transform: scale(1.04); }

/* ---- Passe 2 : cartes photo modernisées (additif) ---- */
/* Coins arrondis + ombre douce + relief au survol.
   La barre-titre est dans .bt_bb_image, donc tout est arrondi proprement. */
.bt_bb_image {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 22px rgba(0, 0, 0, .10);
  transition: transform .3s var(--gsb-ease), box-shadow .3s var(--gsb-ease);
}
.bt_bb_image:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 38px rgba(0, 0, 0, .17);
}

/* Lecteur Vimeo (hero + témoignages) : cadre propre */
.gsb-vimeo {
  border-radius: 12px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .30);
  background: #000;
}

/* ============================================================
   PASSE 3 — refonte visuelle (garde 100% couleurs/identité)
   ============================================================ */

/* --- Titres de section : petit accent jaune (hiérarchie) --- */
.bt_bb_headline.bt_bb_size_extralarge .bt_bb_headline_tag { position: relative; }
.bt_bb_headline.bt_bb_size_extralarge .bt_bb_headline_tag::after {
  content: "";
  display: block;
  width: 70px; height: 4px;
  background: #f5c518;
  border-radius: 3px;
  margin-top: 18px;
}
.bt_bb_headline.bt_bb_size_extralarge.bt_bb_align_center .bt_bb_headline_tag::after {
  margin-left: auto; margin-right: auto;
}

/* --- Hero : titre blanc plus lisible sur la photo --- */
.bt_bb_headline.bt_bb_color_scheme_1 .bt_bb_headline_content {
  text-shadow: 0 2px 16px rgba(0, 0, 0, .45);
}

/* --- Lecteur vidéo hero : plus grand --- */
.gsb-vimeo { max-width: 600px; }

/* --- Boutons : coins arrondis + ombre (jaune/bleu inchangés) --- */
.bt_bb_button, .bt_bb_button a, .gm-anchor, .wp-block-button__link {
  border-radius: 8px;
}
.bt_bb_button a, .gm-anchor, .wp-block-button__link {
  box-shadow: 0 4px 14px rgba(0, 0, 0, .14);
}

/* --- Espacements : plus de respiration entre sections (desktop) --- */
@media (min-width: 992px) {
  .bt_bb_section { padding-top: 26px; padding-bottom: 26px; }
}

/* --- Mobile : ajustements --- */
@media (max-width: 767px) {
  .gsb-vimeo { max-width: 100%; }
  .bt_bb_headline.bt_bb_size_extralarge .bt_bb_headline_tag::after { margin-top: 12px; }
  .bt_bb_section { padding-top: 6px; padding-bottom: 6px; }
}

/* ============================================================
   PASSE 4 — MODERNISATION PRO
   Typo moderne + hiérarchie + espacements + cartes/boutons.
   Garde 100% couleurs, logo, photos, infos. Réversible.
   (On ne touche PAS aux polices d'icônes : sélecteurs texte only.)
   ============================================================ */

/* 1) Typographie moderne — corps en Inter, titres/UI en Poppins */
body,
p, .bt_bb_text, .bt_bb_text p, li, td, th, blockquote, figcaption,
input, select, textarea {
  font-family: 'Inter', -apple-system, "Segoe UI", system-ui, sans-serif;
}
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.bt_bb_text p { line-height: 1.75; }

.bt_bb_headline_tag,
.bt_bb_headline_content, .bt_bb_headline_content span,
.bt_bb_card_title, .bt_bb_card_icon_title,
.gm-menu-item__link, .bt_bb_button_text {
  font-family: 'Poppins', 'Inter', sans-serif !important;
}
.bt_bb_headline_tag { letter-spacing: -.02em; line-height: 1.15; }

/* 2) Boutons modernes (coins, ombre, graisse) — jaune/bleu inchangés */
.bt_bb_button a, .gm-anchor, .wp-block-button__link {
  border-radius: 10px !important;
  font-weight: 600;
  letter-spacing: .02em;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .16) !important;
}

/* 3) Cartes plus modernes (rayon + ombre douce profonde) */
.bt_bb_image {
  border-radius: 16px;
  box-shadow: 0 12px 34px rgba(16, 42, 67, .12);
}
.bt_bb_image:hover { box-shadow: 0 22px 50px rgba(16, 42, 67, .20); }

/* 4) Espacements généreux entre sections (respiration "pro") */
@media (min-width: 992px) {
  .bt_bb_section { padding-top: 44px; padding-bottom: 44px; }
}

/* 5) Navigation : un peu plus de présence */
.gm-menu-item__link { font-weight: 600; }

/* 6) Accent jaune des grands titres : un poil plus marqué */
.bt_bb_headline.bt_bb_size_extralarge .bt_bb_headline_tag::after {
  height: 5px; width: 78px;
}

/* ============================================================
   PASSE 5 — REFONTE HEADER / HERO / VIDÉOS (couleurs gardées)
   ============================================================ */

/* ---------- HEADER : nav épurée (retrait des pastilles) ---------- */
.gm-navbar .gm-main-menu-wrapper .gm-anchor {
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 10px;
  transition: color .2s var(--gsb-ease), background-color .2s var(--gsb-ease);
}
.gm-navbar .gm-main-menu-wrapper > ul > .gm-menu-item > .gm-anchor:hover {
  background: rgba(1, 98, 166, .08) !important;
  color: #0162a6 !important;
}
.gm-navbar .gm-menu-item__txt { font-weight: 600; letter-spacing: .01em; }

/* Toolbar : icônes sociales modernes (cercle + survol) */
.gm-toolbar-left a {
  display: inline-flex !important;
  align-items: center; justify-content: center;
  width: 38px !important; height: 38px;
  padding: 0 !important; margin: 0 4px !important;
  border-radius: 50%;
  transition: transform .2s var(--gsb-ease), background-color .2s var(--gsb-ease);
}
.gm-toolbar-left a:hover { transform: translateY(-2px) scale(1.08); background: rgba(0, 0, 0, .07); }

/* ---------- HERO : profondeur + lisibilité ---------- */
.bt_bb_background_image_holder_wrapper { position: relative; }
.bt_bb_background_image_holder_wrapper::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(2,30,60,.18) 0%, rgba(2,30,60,0) 32%, rgba(2,30,60,.42) 100%);
}
.bt_bb_headline.bt_bb_color_scheme_1 .bt_bb_headline_content span {
  text-shadow: 0 4px 26px rgba(0, 0, 0, .55);
}

/* ---------- VIDÉOS : grille uniforme & propre ---------- */
.bt_bb_video, .bt-video-container, .bt_bb_video .wp-video { width: 100% !important; }
.gsb-vimeo {
  width: 100% !important;
  max-width: 100% !important;
  aspect-ratio: 16 / 9;
  height: auto !important;
  border-radius: 14px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .28);
  background: #000;
  margin: 0 !important;
}

/* ============================================================
   PASSE 6 — FIX boutons (remplissage = inset box-shadow) + hero
   ============================================================ */

/* FIX : préserver le remplissage jaune (inset) + garder une ombre portée */
.bt_bb_button.bt_bb_style_filled a {
  box-shadow: 0 0 0 3em var(--secondary-color, #fcce09) inset,
              0 6px 20px rgba(0, 0, 0, .16) !important;
  border-radius: 10px;
}
.bt_bb_button.bt_bb_style_filled a:hover {
  box-shadow: 0 0 0 0 var(--secondary-color, #fcce09) inset,
              0 12px 28px rgba(0, 0, 0, .26) !important;
}
/* style outline éventuel : on ne touche pas à son box-shadow de bordure */
.bt_bb_button.bt_bb_style_outline a { border-radius: 10px; }

/* HERO plus impactant : titre géant (uniquement le titre blanc du hero) */
.bt_bb_headline.bt_bb_color_scheme_1.bt_bb_size_extralarge .bt_bb_headline_tag {
  font-size: clamp(2.8rem, 6vw, 5.2rem) !important;
  font-weight: 800 !important;
  line-height: 1.04 !important;
}
@media (max-width: 767px) {
  .bt_bb_headline.bt_bb_color_scheme_1.bt_bb_size_extralarge .bt_bb_headline_tag {
    font-size: clamp(2.1rem, 9vw, 3.2rem) !important;
  }
}

/* ============================================================
   PASSE 7 — TRANSFORMATION MODERNE (bold, mêmes couleurs)
   ============================================================ */

/* Échelle typographique forte (look éditorial moderne) */
.bt_bb_headline.bt_bb_size_extralarge .bt_bb_headline_tag {
  font-size: clamp(2.2rem, 4.6vw, 3.5rem) !important;
  font-weight: 800 !important;
  letter-spacing: -.03em !important;
  line-height: 1.1 !important;
}
.bt_bb_headline.bt_bb_size_large .bt_bb_headline_tag {
  font-size: clamp(1.6rem, 3vw, 2.3rem) !important;
  font-weight: 700 !important;
  letter-spacing: -.02em !important;
}
.bt_bb_headline.bt_bb_size_extralarge .bt_bb_headline_tag::after {
  height: 5px; width: 86px; margin-top: 22px;
}

/* Espacements généreux — site aéré "pro" */
@media (min-width: 992px) {
  .bt_bb_section { padding-top: 64px !important; padding-bottom: 64px !important; }
}

/* Cartes : plus de présence (rayon + ombre + relief) */
.bt_bb_image { border-radius: 20px; box-shadow: 0 16px 42px rgba(16, 42, 67, .13); }
.bt_bb_image:hover { box-shadow: 0 28px 62px rgba(16, 42, 67, .22); transform: translateY(-7px); }

/* Lisibilité du corps de texte */
.bt_bb_text p { font-size: 1.05rem; line-height: 1.8; }

/* Boutons : graisse + tracking (remplissage inset préservé en passe 6) */
.bt_bb_button.bt_bb_style_filled a, .bt_bb_button.bt_bb_style_outline a {
  letter-spacing: .04em; font-weight: 700;
}

/* ============================================================
   PASSE 8 — REFONTE AVANCÉE (carte blanche, mêmes couleurs)
   ============================================================ */

/* Barre de progression de défilement (jaune→bleu) */
#gsb-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0;
  background: linear-gradient(90deg, #fcce09, #0162a6);
  z-index: 100000; transition: width .12s linear; pointer-events: none;
}
/* Ombre renforcée du header quand on défile (si sticky) */
.gsb-scrolled .gm-navbar, .gsb-scrolled .mainHeader {
  box-shadow: 0 8px 28px rgba(2, 30, 60, .14) !important;
}

/* HERO immersif : plein écran + contenu centré verticalement */
.bt_bb_section:has(.bt_bb_background_image_holder) {
  min-height: 76vh;
  display: flex; align-items: center;
}
.bt_bb_section:has(.bt_bb_background_image_holder) > .bt_bb_port { width: 100%; }
@media (max-width: 767px) {
  .bt_bb_section:has(.bt_bb_background_image_holder) { min-height: 70vh; }
}

/* SECTIONS BLEUES : profondeur (halo lumineux subtil) */
.bt_bb_section.bt_bb_color_scheme_10 { position: relative; }
.bt_bb_section.bt_bb_color_scheme_10::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(85% 70% at 88% 8%, rgba(255, 255, 255, .10), transparent 55%);
}
.bt_bb_section.bt_bb_color_scheme_10 > .bt_bb_port { position: relative; z-index: 1; }

/* BOUTONS : plus généreux (l'inset de remplissage suit la font, pas le padding) */
.bt_bb_button.bt_bb_style_filled a, .bt_bb_button.bt_bb_style_outline a {
  padding: 15px 32px !important;
  border-radius: 12px;
}

/* FOOTER : plus d'air + survol des liens en jaune */
.btSiteFooterWidgets { padding-top: 54px !important; padding-bottom: 34px !important; }
.btSiteFooter a { transition: color .2s ease; }
.btSiteFooter a:hover { color: #fcce09 !important; }

/* FIX : garder YouTube caché malgré le style des icônes toolbar (passe 5) */
.gm-toolbar-left a[href*="UCQav2qBwhhSdpu2t46JXDGQ"],
.gm-toolbar-left a[href*="youtube.com"],
.gm-toolbar-right a[href*="youtube.com"] { display: none !important; }

/* ============================================================
   PASSE 9 (révisée) — header PROPRE, couleurs du thème
   (on retire le bleu foncé qui n'était pas la couleur du thème)
   ============================================================ */
/* Masquer la liste sociale vide en doublon (href vides) */
.gm-toolbar-right .gm-toolbar-socials-list { display: none !important; }
/* CONNEXION : juste des coins arrondis (reste jaune/bleu du thème) */
.gm-toolbar-right a[href*="/connexion/"] { border-radius: 8px !important; }
/* Nav : légère ombre de séparation */
.gm-navbar, .mainHeader { box-shadow: 0 3px 18px rgba(2, 30, 60, .07); }

/* ============================================================
   PASSE 10 — GOUTTIÈRES (LE vrai correctif "tout est collé")
   Le framework gutté avait perdu les espaces entre colonnes.
   On les remet, sans toucher aux colonnes voulues "flush" (padding_0).
   ============================================================ */
.bt_bb_row > .bt_bb_column:not(.bt_bb_padding_0),
.bt_bb_row_inner > .bt_bb_column_inner:not(.bt_bb_padding_0),
.bt_bb_row_inner > .bt_bb_column:not(.bt_bb_padding_0) {
  padding: 14px !important;
  box-sizing: border-box !important;
}

/* ============================================================
   PASSE 11 — FIX FOOTER (supprimer le grand vide)
   Le padding de section généreux (64px) était de trop en footer.
   ============================================================ */
footer .bt_bb_section,
.btSiteFooterWidgets .bt_bb_section,
.btSiteFooterCopyMenu .bt_bb_section {
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}
.btSiteFooterWidgets { padding-top: 28px !important; padding-bottom: 4px !important; }
.btSiteFooterCopyMenu { padding-top: 12px !important; padding-bottom: 12px !important; }
