/* =====================================================================
   Typographie : Source Serif 4 (titres) + Manrope (tout le reste)
   Décision owner (D-ouv-09). Polices auto-hébergées : assets/fonts/.
   Bloc placé en tête : le préfixe « body » donne la priorité sur main.css
   et sur les tailles des sections CSB plus bas dans ce fichier.
   ===================================================================== */
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url("../fonts/manrope/manrope-latin-wght.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url("../fonts/manrope/manrope-latin-ext-wght.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/source-serif-4/source-serif-4-latin-600.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../fonts/source-serif-4/source-serif-4-latin-ext-600.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --csb-font-titre: "Source Serif 4", Georgia, "Times New Roman", serif;
  --csb-font-texte: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --csb-texte: #16231A;
  --outfit-font: var(--csb-font-titre);
  --dm-sans-font: var(--csb-font-texte);
  --albert-sans-font: var(--csb-font-texte);
  --body-color: #16231A;
  --title-color: #004540;
  --body-fz: clamp(17px, 16.6px + .095vw, 18px); /* texte courant : +2 px (accueil et Le centre) */
  /* échelle fluide : 1440 px -> 390 px */
  --csb-t-hero: clamp(32px, 23.8px + 2.095vw, 54px);
  --csb-t-section: clamp(28px, 23.5px + 1.143vw, 40px);
  --csb-t-carte: clamp(19px, 17.9px + .286vw, 22px);
  --csb-t-faq: clamp(16px, 15.3px + .19vw, 18px);
  --csb-t-chiffre: clamp(36px, 31.5px + 1.143vw, 48px);
}

/* --- Texte courant --- */
body { font-family: var(--csb-font-texte); font-size: var(--body-fz); font-weight: 400; line-height: 1.65; color: var(--csb-texte); }
body :is(p, li, label, span, a, small, td, th, dd, dt, address, blockquote) { font-family: var(--csb-font-texte); }
body p { line-height: 1.65; }
body :is(b, strong) { font-weight: 600; }
main p { max-width: 65ch; }
main .text-center p, main .text-center .text, main p.text-center { margin-inline: auto; }

/* --- Titres : Source Serif 4 600 (:not(#csb) = priorité sur les tailles propres à chaque carte du thème) --- */
body :is(h1, h2, h3, h4, h5, h6) { color: var(--theme-color-3); }
body :is(h1, h2, h3, h4, h5, h6):not(#csb) { font-family: var(--csb-font-titre); font-weight: 600; font-style: normal; letter-spacing: -.01em; line-height: 1.3; text-transform: none; }
body :is(h1, h2, h3, h4, h5, h6) a { font-family: inherit; font-weight: inherit; letter-spacing: inherit; }
body h1:not(#csb), body .csb-hero .hero-content-1 .title :is(h1, h2):not(#csb) { font-size: var(--csb-t-hero); line-height: 1.1; }
body .csb-hero .hero-content-1 .title :is(h1, h2) { color: #fff; margin-bottom: 14px; }
body h2:not(#csb), body .common-title h2:not(#csb) { font-size: var(--csb-t-section); line-height: 1.15; }
body :is(h3, h4, h5):not(#csb), body .csb-acces .service-top h2:not(#csb) { font-size: var(--csb-t-carte); line-height: 1.3; }
body h6:not(#csb) { font-size: 16px; line-height: 1.4; }
body .common-title h2 { margin-bottom: 0; }
body .csb-acces .service-top h2 { max-width: 70%; }
/* titres sur fond foncé */
body :is(.csb-faire, .csb-produits, .csb-contact, .csb-footer, .csb-hero) :is(h1, h2, h3, h4, h5, h6) { color: #fff; }
body .csb-contact .contact-form .form-content-top .csb-contact-h { font-family: var(--csb-font-titre); font-weight: 600; font-size: var(--csb-t-section); line-height: 1.15; color: #fff; }
body .csb-contact .contact-form .form-content-top .csb-contact-h span { color: var(--theme-color-2); }
body .csb-logo-text { font-family: var(--csb-font-titre); font-weight: 600; font-size: 17px; letter-spacing: 0; }
body .csb-footer-logo { font-family: var(--csb-font-titre); font-weight: 600; font-size: 24px; letter-spacing: 0; }

/* --- Sous-titres de section : Manrope 600, 13 px, majuscules --- */
body .common-subtitle span { font-family: var(--csb-font-texte); font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; line-height: 1.4; color: var(--csb-texte); }
body :is(.csb-faire, .csb-produits, .csb-contact, .csb-footer) .common-subtitle span { color: #fff; }

/* --- Textes sur fond clair : #16231A, plus de gris --- */
body :is(.csb-pourquoi, .csb-faq, .csb-about, .csb-actus, .csb-videos, .csb-acces, .csb-chiffres) :is(p, li) { color: var(--csb-texte); }
/* --- Textes sur fond foncé : blanc --- */
body :is(.csb-faire, .csb-produits) .section-top-2 .right p { color: rgba(255, 255, 255, .92); }
body .csb-hero .hero-content-1 .text p { color: #fff; font-size: calc(var(--body-fz) + 1px); }
body .csb-contact :is(p, label) { color: rgba(255, 255, 255, .92); }
body .csb-footer :is(p, li, span, address) { color: rgba(255, 255, 255, .92); }

/* --- Boutons, menus, formulaires : Manrope 600, 15 px, sans majuscules --- */
body :is(.e-primary-btn, .main-menu ul li a, .off-canvas-menu li a, button, .accordion-button, .nav-link, .service-btn, .d-btn) { font-family: var(--csb-font-texte); font-size: 15px; font-weight: 600; text-transform: none; letter-spacing: 0; }
body :is(input, textarea, select) { font-family: var(--csb-font-texte); font-size: 15px; font-weight: 500; color: var(--csb-texte); }
body :is(input, textarea)::placeholder { color: #4A5A4F; opacity: 1; }
body .csb-contact .contact-form :is(input, textarea) { color: #fff; }
body .csb-contact .contact-form :is(input, textarea)::placeholder { color: rgba(255, 255, 255, .78); opacity: 1; }
body .csb-topbar, body .csb-topbar a, body .csb-topbar-address { font-size: 13px; font-weight: 500; }

/* --- FAQ --- */
body .csb-faq .accordion-button { font-size: var(--csb-t-faq); font-weight: 600; line-height: 1.4; color: var(--theme-color-3); }

/* --- Badges, dates, catégories --- */
body :is(.tag, .category, .number) span, body :is(.tag, .category) p { font-family: var(--csb-font-texte); font-size: 13px; font-weight: 600; text-transform: none; letter-spacing: 0; }
body .csb-actus .event-date span.csb-jour { font-family: var(--csb-font-texte); font-weight: 600; font-size: 28px; font-variant-numeric: tabular-nums; }
body .csb-actus .event-date span.csb-mois { font-weight: 500; font-size: 14px; }
body .csb-actus .event-date .csb-annee { font-weight: 600; font-size: 12px; letter-spacing: .1em; }
body .csb-video-meta { font-size: 14px; font-weight: 500; }

/* --- Compteurs : Manrope 600, chiffres tabulaires --- */
body :is(.company-achievements .achievement :is(h2, .achievement-chiffre), .csb-chiffres .achievement :is(h2, .achievement-chiffre), .experience-shape-2 h3, .purecounter):not(#csb) { font-family: var(--csb-font-texte); font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
body :is(.company-achievements .achievement :is(h2, .achievement-chiffre), .csb-chiffres .achievement :is(h2, .achievement-chiffre), .csb-about .experience-shape-2 h3):not(#csb) { font-size: var(--csb-t-chiffre); line-height: 1.1; }
body .csb-chiffres .achievement p { font-size: 14px; font-weight: 500; line-height: 1.4; }

body .csb-about .experience-shape-2 h3 { color: var(--theme-color-3); -webkit-text-stroke: 0; }
/* sous-titres des sections vertes : blanc */
body :is(.csb-faire, .csb-produits) .section-top-2 .left .common-subtitle span { color: #fff; }

/* --- Grands numéros décoratifs (environ -30 %) : Manrope 600 --- */
body :is(.card-number h1, .card-number-2 h1, .card-number-3 h1, .service-card-3 .i-shape h1, .service-card .service-top .number span):not(#csb) { font-family: var(--csb-font-texte); font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: 0; line-height: 1; }
body .card-number h1:not(#csb) { font-size: clamp(56px, 3.6rem + 1vw, 84px); }
body :is(.card-number-2 h1, .card-number-3 h1):not(#csb) { font-size: clamp(40px, 2.5rem + 1.1vw, 56px); }

/* --- Titres secondaires qui ne sont pas des titres de carte : Manrope --- */
body :is(.footer-widget .w-title, .csb-footer :is(h2, div).w-title, .header-info .header-info-content p, .header-info-2 .header-info-content p, .header-info-3 .header-info-content p,
  .about-us-section-3 .tab-content .reward h5, .details-subtitle h4, .detail-sidebar .s-widget-wrap .organizer-info-wrap .name h3, .sponsor-info-wrap .name h3,
  .payment-method-form .payment-title h3, .payment-method-form form h5, .testimonial-wrap .review, .next-project .project-content-wrap .project-title h5, .csb-pourquoi .annual-text h5):not(#csb) { font-family: var(--csb-font-texte); font-weight: 600; letter-spacing: 0; }
body :is(.footer-widget .w-title, .csb-footer :is(h2, div).w-title):not(#csb) { font-size: 17px; line-height: 1.4; }
body .csb-pourquoi .annual-text h5:not(#csb) { font-size: 15px; }
body .csb-footer-contact li, body .csb-footer-contact li :is(a, span) { font-size: 15px; line-height: 1.6; }

/* --- Pas d'italique décoratif --- */
body :is(em, cite, blockquote) { font-style: normal; }

/* =====================================================================
   Boutons compacts : même gabarit sur tout le site (tailles seulement ;
   couleurs, survol et animation de la flèche restent ceux du thème)
   ===================================================================== */
/* Bouton standard : 44 px, texte 14 px */
body .e-primary-btn:not(.service-btn) { box-sizing: border-box; height: 44px; min-height: 44px; padding: 0 22px; gap: 12px;
  font-family: var(--csb-font-texte); font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: .01em; text-transform: none; white-space: nowrap; border-radius: 100px; }
body .e-primary-btn.has-icon:not(.service-btn) { padding: 0 6px 0 20px; gap: 12px; }
body .e-primary-btn .icon-wrap { width: 32px; height: 32px; font-size: 13px; }
body .e-primary-btn .icon-wrap .icon { width: 13px; }
body .e-primary-btn .icon-wrap .icon i { font-size: 13px; }
/* variantes dont le thème fixe sa propre taille (cartes produits) */
body .service-card-3 .content .e-primary-btn.has-icon.d-btn .icon-wrap { width: 32px; height: 32px; }
body .service-card-3 .content .e-primary-btn.has-icon.d-btn .icon-wrap .icon { width: 13px; font-size: 13px; }
body .service-card-3 .content .e-primary-btn.has-icon.d-btn { font-size: 14px; }
body .e-primary-btn.has-icon.d-btn { height: 44px; padding: 0 6px 0 20px; font-size: 14px; line-height: 1; }
/* Lien-bouton « service-btn » : reste un lien texte, seule la police change */
body .e-primary-btn.service-btn { font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: .01em; gap: 8px; }
body .e-primary-btn.service-btn .icon-wrap { width: auto; height: auto; }
/* Petit bouton : 38 px (cartes d'actualités et de vidéos) */
body .e-primary-btn.has-small:not(.service-btn) { height: 38px; min-height: 38px; padding: 0 5px 0 16px; gap: 10px; }
body .e-primary-btn.has-small .icon-wrap { width: 28px; height: 28px; font-size: 12px; }
body .e-primary-btn.has-small .icon-wrap .icon { width: 12px; }
/* Onglets en forme de bouton (À propos) */
body .csb-about .c-tabs-wrapper .nav-tabs .nav-item .nav-link { height: 44px; padding: 0 22px; display: inline-flex; align-items: center; font-size: 14px; line-height: 1; border-radius: 100px; }
/* Bouton d'envoi du formulaire et bouton du header : même gabarit que le standard (règles ci-dessus) */
body .csb-contact .contact-form button.e-primary-btn { height: 44px; }

/* Rangées de boutons : passage à la ligne propre */
body .csb-hero .hero-content-1 .join-us { flex-wrap: wrap; gap: 12px; }
body .csb-pourquoi .annual-donation-wrap, body .csb-about .annual-donation-wrap { gap: 12px 20px; }
@media (max-width: 767px) {
  body .e-primary-btn:not(.service-btn) { height: 44px; font-size: 14px; }
  body .e-primary-btn.has-small:not(.service-btn) { height: 38px; }
}

/* Flèches de sliders : 40 x 40 px, icône 14 px */
body :is(.csb-hero-controls button, .csb-faire-nav button, .csb-actus-nav button, .service-slider-active .service-button-prev, .service-slider-active .service-button-next) { width: 40px; height: 40px; font-size: 14px; }
body :is(.csb-hero-controls button, .csb-faire-nav button, .csb-actus-nav button, .service-button-prev, .service-button-next) i { font-size: 14px; }
/* Barres et points de pagination : zone cliquable élargie (40 px minimum) sans changer leur aspect */
body :is(.csb-faire-pagination, .csb-actus-pagination, .hero-slider-pagination-1) .swiper-pagination-bullet { position: relative; }
body :is(.csb-faire-pagination, .csb-actus-pagination) .swiper-pagination-bullet::after { content: ""; position: absolute; inset: -18px 0; }
body .hero-slider-pagination-1 .swiper-pagination-bullet::after { content: ""; position: absolute; inset: -15px; }

/* Boutons de lecture vidéo : environ -20 % */
body .csb-about .positioned-shape .shape-wrapped-thumb-2 .video-thumb .video-play-btn { width: 64px; height: 64px; padding: 0; display: flex; align-items: center; justify-content: center; font-size: 16px; line-height: 1; }
body .csb-video-play { width: 58px; height: 58px; font-size: 16px; }

/* Focus clavier : contour de 3 px (les règles propres à chaque section, plus bas, gardent leur couleur) */
body :is(.e-primary-btn, button, .video-play-btn, .csb-video-play):focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: 3px; }

/* Centre Sahélien pour la Biodiversité - ajustements du thème (header + hero) */

/* --- Barre supérieure --- */
.csb-topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: #fff; font-size: 14px; }
.csb-topbar-list { display: flex; flex-wrap: wrap; gap: 4px 24px; margin: 0; padding: 0; list-style: none; }
.csb-topbar-list a, .csb-topbar-address { display: inline-flex; align-items: center; gap: 8px; color: #fff; line-height: 28px; }
.csb-topbar-list a:hover { text-decoration: underline; }
.csb-topbar-list i { font-size: 13px; }
.csb-topbar-social { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; color: #fff; border-radius: 50%; }
.csb-topbar-social:hover { background: rgba(255, 255, 255, .16); }
.csb-topbar a:focus-visible, .csb-hero a:focus-visible, .csb-hero button:focus-visible,
.header-bar:focus-visible, .off-canvas-menubar a:focus-visible, .off-canvas-menubar button:focus-visible,
.main-menu a:focus-visible, .logo-wrap a:focus-visible { outline: 3px solid #FFE175; outline-offset: 2px; }
.main-menu a:focus-visible, .logo-wrap a:focus-visible, .off-canvas-menubar a:focus-visible,
.off-canvas-menubar button:focus-visible, .header-bar:focus-visible { outline-color: #004540; }

/* --- Logo --- */
.csb-logo { display: block; height: 56px; width: auto; max-width: 100%; }
.csb-logo-text { display: block; font-family: var(--outfit-font); font-weight: 600; font-size: 17px; line-height: 1.15; color: var(--theme-color-3); }

/* --- Menu --- */
.main-menu ul li.csb-active > a { background: rgba(0, 69, 64, .1); font-weight: 600; }
.header-bar { background: none; border: 0; padding: 0; }
.off-canvas-menubar-close { background: none; border: 0; }
.off-canvas-menu li.csb-active > a { color: var(--theme-color); font-weight: 600; }
.csb-offcanvas-cta { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding: 24px 0 0; }
.csb-offcanvas-fb { color: var(--theme-color-3); text-decoration: underline; }

/* --- Hero : image + voile de lisibilité --- */
.csb-hero .hero-side { overflow: hidden; }
/* Hero : hauteur réduite (≈ -17 %) */
.csb-hero .hero-side { padding-top: 280px; padding-bottom: 190px; }
@media (min-width: 1200px) and (max-width: 1700px) { .csb-hero .hero-side { padding-top: 200px; padding-bottom: 130px; } }
@media (min-width: 992px) and (max-width: 1199px) { .csb-hero .hero-side { padding-top: 220px; padding-bottom: 150px; } }
@media (min-width: 768px) and (max-width: 991px) { .csb-hero .hero-side { padding-top: 220px; padding-bottom: 120px; } }
@media (max-width: 767px) { .csb-hero .hero-side { padding-top: 120px; padding-bottom: 110px; } }
.csb-hero-media, .csb-hero-media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.csb-hero-media { z-index: 0; display: block; }
.csb-hero-media img { object-fit: cover; object-position: center; }
.csb-hero-media::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(8, 28, 26, .85) 0%, rgba(8, 28, 26, .62) 42%, rgba(8, 28, 26, .12) 100%); }
@media (max-width: 767px) {
  .csb-hero-media::after { background: linear-gradient(180deg, rgba(8, 28, 26, .5) 0%, rgba(8, 28, 26, .82) 100%); }
}
@media (max-width: 991px) { .csb-hero .hero-slider-social { display: none; } }

/* --- Hero : titres (le thème stylise seulement h1) --- */
.csb-hero .hero-content-1 .title h1, .csb-hero .hero-content-1 .title h2 {
  font-weight: 600; color: var(--light-color); font-size: 60px; line-height: 1.1; margin-bottom: 14px; }
@media (min-width: 1200px) and (max-width: 1399px) { .csb-hero .hero-content-1 .title h1, .csb-hero .hero-content-1 .title h2 { font-size: 56px; } }
@media (min-width: 992px) and (max-width: 1199px) { .csb-hero .hero-content-1 .title h1, .csb-hero .hero-content-1 .title h2 { font-size: 50px; } }
@media (min-width: 768px) and (max-width: 991px) { .csb-hero .hero-content-1 .title h1, .csb-hero .hero-content-1 .title h2 { font-size: 42px; } }
@media (max-width: 767px) { .csb-hero .hero-content-1 .title h1, .csb-hero .hero-content-1 .title h2 { font-size: 30px; } }
.csb-hero .hero-content-1 .title { max-width: 760px; }
.csb-hero .hero-content-1 .text p { color: #fff; }
.csb-hero .hero-content-1 .join-us { flex-wrap: wrap; gap: 14px 16px; }
.csb-hero .hero-content-1 .join-us .csb-btn-solid { background: var(--theme-color); border-color: var(--theme-color); color: var(--dark-color); }
@media (max-width: 575px) { .csb-hero .hero-content-1 .join-us { flex-direction: row; align-items: center; } }

/* --- Hero : flèches --- */
.csb-hero-controls { position: absolute; right: 90px; bottom: 112px; z-index: 99; display: flex; gap: 10px; }
.csb-hero-controls button { width: 46px; height: 46px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255, 255, 255, .12); border: 1.5px solid rgba(255, 255, 255, .5); color: #fff; backdrop-filter: blur(8px); cursor: pointer; transition: background .2s; }
.csb-hero-controls button:hover { background: rgba(255, 255, 255, .28); }
@media (max-width: 1399px) { .csb-hero-controls { right: 30px; } }
@media (max-width: 575px) { .csb-hero-controls { right: 20px; bottom: 20px; } }
@media (prefers-reduced-motion: reduce) { .csb-hero-controls button { transition: none; } }

/* --- Corrections --- */
.csb-hero .hero-side .container { position: relative; z-index: 1; }
.off-canvas-menu a { text-transform: none; }
.csb-offcanvas-cta { padding: 28px 30px 0; }
.off-canvas-menu ul li a { text-transform: none !important; }
.csb-offcanvas-cta .e-primary-btn { padding: 14px 28px; border-radius: 100px; display: inline-flex; }

/* --- Chiffres : 2x2 jusqu'à la tablette (le thème ne passe à 2 colonnes qu'à 767 px) --- */
@media (max-width: 991px) { .csb-chiffres .company-achievements { grid-template-columns: repeat(2, 1fr); gap: 32px 20px; } }

/* --- À propos --- */
.csb-about .award-shape i { font-size: 30px; color: #fff; flex: none; }
.csb-about .award-shape p { max-width: 190px; }
.csb-about .experience-shape-2 p { max-width: 150px; }
.csb-about .experience-shape-2 h3 { white-space: nowrap; }
.csb-about .shape-wrapped-thumb-1 .experience-shape-2 { flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 4px; text-align: left; }
.csb-about .experience-shape-2 h3 { margin-bottom: 0; }
.csb-about .experience-shape-2 p { max-width: 190px; margin-bottom: 0; text-align: left; }
.csb-about .csb-question { display: block; }
.csb-about .csb-question a { color: var(--theme-color-3); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.csb-about .csb-question a:focus-visible, .csb-about .nav-link:focus-visible, .csb-about .video-play-btn:focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: 3px; }
/* images à 2x : largeur d'affichage = taille d'origine des vignettes du thème */
.csb-about .shape-wrapped-thumb-1 > img { width: 434px; max-width: 100%; height: auto; }
.csb-about .positioned-shape .shape-wrapped-thumb-2 .video-thumb img { width: 326px; max-width: 100%; height: auto; }
@media (min-width: 1200px) and (max-width: 1399px) { .csb-about .shape-wrapped-thumb-1 > img { width: 70%; } }
@media (min-width: 992px) and (max-width: 1199px) { .csb-about .shape-wrapped-thumb-1 > img { width: 80%; } }
@media (max-width: 767px) { .csb-about .video-thumb { width: 100%; } .csb-about .positioned-shape .shape-wrapped-thumb-2 .video-thumb img { width: 100%; } }

/* --- Ce que nous faisons (slider) --- */
.csb-faire-slider .swiper-slide { height: auto; }
.csb-faire-bottom { display: flex; align-items: center; gap: 60px; margin-top: 48px; }
.csb-faire-nav { display: flex; gap: 10px; }
.csb-faire-nav button { width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; color: #fff; cursor: pointer;
  background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .35); border-radius: 100px; transition: all .3s linear; }
.csb-faire-nav button:hover { color: var(--theme-color-3); background: var(--theme-color-2); border-color: var(--theme-color-2); }
.csb-faire-nav button:focus-visible { outline: 3px solid var(--theme-color-2); outline-offset: 3px; }
.csb-faire-nav button.swiper-button-disabled { opacity: .4; cursor: default; pointer-events: none; }
.csb-faire-pagination { flex: 1; display: flex; height: 5px; border-radius: 10px; background: rgba(255, 255, 255, .5); }
.csb-faire-pagination .swiper-pagination-bullet { flex: 1; height: 100%; margin: 0; opacity: 1; background: none; border-radius: 10px; }
.csb-faire-pagination .swiper-pagination-bullet:focus-visible { outline: 3px solid var(--theme-color-2); outline-offset: 3px; }
.csb-faire-pagination .swiper-pagination-bullet-active { background: var(--theme-color-2); }
@media (max-width: 767px) { .csb-faire-bottom { gap: 24px; margin-top: 32px; } }
@media (prefers-reduced-motion: reduce) { .csb-faire-nav button { transition: none; } }

/* --- Menu : sous-menu Galerie ouvert aussi au clavier --- */
.main-menu ul .has-dropdown:focus-within .sub-menu { visibility: visible; opacity: 1; top: 100%; }
.main-menu ul .has-dropdown:focus-within > a:after { transform: rotate(180deg); content: "\f068"; }
.main-menu ul .has-dropdown .sub-menu li a:focus-visible { background: var(--theme-color-2); outline-offset: -3px; }
.off-canvas-menu .sub-menu a { text-transform: none; }
.header-section-4 { position: relative; z-index: 50; } /* le sous-menu passe au-dessus du hero */

/* =====================================================================
   Accueil v3 : sections Pourquoi nous, Produits, Actualités, FAQ, Contact, Pied de page
   ===================================================================== */
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important;
  overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

/* --- Pourquoi nous --- */
.csb-pourquoi .thumb img { max-width: 100%; height: auto; }
.csb-pourquoi .why-us-content .text p { margin-bottom: 28px; }
.csb-pourquoi-liste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px 24px; margin: 0 0 40px; padding: 0; list-style: none; }
.csb-pourquoi-liste .service p { margin: 0; color: var(--theme-color-3); font-weight: 500; }
@media (max-width: 575px) { .csb-pourquoi-liste { grid-template-columns: 1fr; } }
.csb-pourquoi .annual-donation-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 32px; }
.csb-pourquoi-icone { width: 60px; height: 60px; flex: none; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%;
  border: 2px solid rgba(0, 69, 64, .1); color: var(--theme-color-3); font-size: 22px; }
.csb-pourquoi .annual-text h5 a { color: var(--theme-color-3); text-decoration: underline; text-underline-offset: 3px; }
.csb-pourquoi a:focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: 3px; }
@media (max-width: 1199px) {
  .csb-pourquoi .thumb { margin-bottom: 240px; }
}
@media (max-width: 767px) {
  .csb-pourquoi .thumb { margin-bottom: 150px; }
}

/* --- Produits (slider Home 04) --- */
.csb-produits .service-card-3 .thumb img { width: 100%; aspect-ratio: 500 / 543; height: auto; object-fit: contain; border-radius: 10px; } /* format réel des images (500x543) : jamais rognées, espace réservé avant chargement */
.csb-produits .service-card-3 .text p { margin-bottom: 0; font-size: var(--body-fz); }
.csb-produits button.service-button-prev, .csb-produits button.service-button-next { border: 0; padding: 0; }
.csb-produits a:focus-visible, .csb-produits button:focus-visible { outline: 3px solid var(--theme-color-2); outline-offset: 3px; }

/* --- Actualités --- */
.csb-actus .blog-card { height: 100%; display: flex; flex-direction: column; background: #fff; border-radius: 10px; }
.csb-actus .blog-card .content { flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
.csb-actu-media { border-radius: 10px 10px 0 0; overflow: hidden; }
.csb-actu-media img { display: block; width: 100%; height: auto; aspect-ratio: 410 / 280; object-fit: cover; }
.csb-actus .blog-card .thumb .category span { display: inline-block; padding: 8px 18px; color: #fff; font-size: 14px; border: 1.5px solid rgba(255, 255, 255, .3);
  border-radius: 53px; background: rgba(0, 24, 25, .45); backdrop-filter: blur(12px); }
.csb-actus .event-date time { display: flex; flex-direction: column; align-items: center; }
.csb-actus .event-date .csb-jour { color: var(--theme-color-2); font-weight: 500; font-size: 32px; line-height: 1.2; font-family: var(--outfit-font); }
.csb-actus .event-date .csb-mois { color: #fff; line-height: 22px; margin-bottom: 4px; }
.csb-actus .event-date .csb-annee { color: var(--theme-color-3); border-radius: 4px; background: var(--theme-color-2); padding: 3px 10px; font-weight: 600; font-size: 12px; letter-spacing: .2em; }
.csb-actus .blog-card .content-top { padding-top: 14px !important; }
.csb-actus-slider .swiper-slide { height: auto; }
.csb-actus-bas { display: flex; align-items: center; gap: 40px; margin-top: 40px; }
.csb-actus-nav { display: flex; gap: 10px; }
.csb-actus-nav button { width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; cursor: pointer; color: var(--theme-color-3);
  background: #fff; border: 1px solid rgba(0, 69, 64, .2); border-radius: 100px; transition: all .3s linear; }
.csb-actus-nav button:hover { background: var(--theme-color-3); color: var(--theme-color-2); }
.csb-actus-nav button.swiper-button-disabled { opacity: .4; pointer-events: none; }
.csb-actus-pagination { flex: 1; display: flex; height: 5px; border-radius: 10px; background: rgba(0, 69, 64, .15); }
.csb-actus-pagination .swiper-pagination-bullet { flex: 1; height: 100%; margin: 0 !important; opacity: 1; background: none; border-radius: 10px; }
.csb-actus-pagination .swiper-pagination-bullet-active { background: var(--theme-color-3); }
.csb-actus a:focus-visible, .csb-actus button:focus-visible, .csb-actus-pagination .swiper-pagination-bullet:focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: 3px; }
@media (max-width: 767px) { .csb-actus-bas { gap: 24px; margin-top: 28px; } }
@media (prefers-reduced-motion: reduce) { .csb-actus-nav button { transition: none; } }

/* --- FAQ --- */
.csb-faq .accordion-header { margin: 0; }
.csb-faq .accordion-body a, .csb-faq-contact a { color: var(--theme-color-3); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.csb-faq-contact { margin-top: 28px; }
.csb-faq-contact a { display: inline-flex; align-items: center; gap: 10px; }
.csb-faq-contact i { font-size: 22px; }
.csb-faq .accordion-button:focus-visible, .csb-faq a:focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: 3px; }
@media (max-width: 1199px) { .csb-faq .faq { flex-direction: column-reverse; align-items: stretch; } }

/* --- Contact --- */
.csb-contact { padding-bottom: 20px; }
.csb-contact-fond { position: absolute; inset: 0; z-index: -2; }
.csb-contact-fond img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }
.csb-contact-fond::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8, 28, 26, .15) 0%, rgba(8, 28, 26, .35) 100%); }
.csb-contact .contact-form .form-content-top .csb-contact-h { font-weight: 500; font-size: 36px; line-height: 48px; color: var(--light-color); margin-bottom: 15px; }
.csb-contact .contact-form .form-content-top .csb-contact-h span { color: var(--theme-color-2); }
@media (max-width: 991px) { .csb-contact .contact-form .form-content-top .csb-contact-h { font-size: 28px; line-height: 1.4; } }
@media (max-width: 767px) { .csb-contact .contact-form .form-content-top .csb-contact-h { font-size: 22px; } }
.csb-contact .form-content-top p a { color: var(--theme-color-2); text-decoration: underline; }
.csb-contact .contact-form input::placeholder, .csb-contact .contact-form textarea::placeholder { color: rgba(255, 255, 255, .78); opacity: 1; }
.csb-contact .contact-form input:focus-visible, .csb-contact .contact-form textarea:focus-visible,
.csb-contact .contact-form button:focus-visible, .csb-contact a:focus-visible { outline: 3px solid var(--theme-color-2); outline-offset: 2px; }
.csb-contact [aria-invalid="true"] { border-color: #FFB4A8 !important; }
.csb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.csb-form-note { color: rgba(255, 255, 255, .78); font-size: 14px; margin: 0 0 18px; }
.csb-form-message { margin: 18px 0 0; color: #fff; font-weight: 500; }
.csb-form-message.success { color: var(--theme-color-2); }
.csb-form-message.error { color: #FFC9BF; }
@media (max-width: 991px) { .csb-contact .contact-form { position: relative; } }

/* --- Pied de page --- */
.csb-footer-logo { font-family: var(--outfit-font); font-weight: 600; font-size: 24px; line-height: 1.2; color: #fff; }
.csb-footer .about-widget .text p { color: rgba(255, 255, 255, .9); }
.csb-footer .social-links { display: flex; gap: 10px; margin-top: 24px; }
.csb-footer .social-links a { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, .3); color: #fff; }
.csb-footer .social-links a:hover { background: var(--theme-color-2); color: var(--theme-color-3); }
.csb-footer :is(h2, div).w-title { line-height: 36px; }
.csb-footer-contact li { display: flex !important; align-items: flex-start; gap: 12px; color: rgba(255, 255, 255, .9); font-size: 17px; line-height: 28px; }
.csb-footer-contact li i { margin-top: 6px; color: var(--theme-color-2); }
.csb-footer-contact li a { word-break: break-word; }
.csb-footer-contact li a:after { display: none; }
.csb-footer .footer-copyright, .csb-footer .footer-bottom-menu a { color: rgba(255, 255, 255, .9); }
.csb-footer a:focus-visible { outline: 3px solid var(--theme-color-2); outline-offset: 3px; }

/* Fonds : les images d'arrière-plan livrées avec le thème sont des images de remplacement (dimensions écrites dessus) */
.csb-pourquoi { background: #fff; }
.csb-actus { background: #F8F7F0; }
.csb-faq { background: #fff; }
.csb-footer { background: var(--theme-color-3); }
/* Badge de date : neutralise le style générique des span du thème */
.csb-actus .event-date span.csb-jour, .csb-actus .event-date span.csb-mois { background: none; padding: 0; letter-spacing: 0; border-radius: 0; }
.csb-actus .event-date span.csb-mois { font-weight: 400; font-size: 15px; }
/* Pourquoi nous : 1200-1399 px, éviter que les vignettes 2 et 3 se recouvrent */
@media (min-width: 1200px) and (max-width: 1399px) {
  .csb-pourquoi .thumb .thumb-2 { left: 0; top: 30%; }
  .csb-pourquoi .thumb .thumb-2 img { width: 52%; }
  .csb-pourquoi .thumb .thumb-3 img { width: 50%; }
}

/* --- Accès rapides (base : service-card du thème) --- */
.csb-acces-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.csb-acces .csb-acces-card { height: 100%; transition: background-color .3s, box-shadow .3s; }
.csb-acces .service-top { gap: 16px; }
.csb-acces .service-top h2 { max-width: 70%; margin-bottom: 0; font-weight: 500; font-size: 28px; line-height: 36px; color: var(--theme-color-3); }
.csb-acces .csb-acces-link { color: inherit; text-decoration: none; }
.csb-acces .csb-acces-link::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.csb-acces .service-top i { flex: none; color: var(--theme-color-3); transition: all .3s; }
.csb-acces .service-content p { width: 90%; margin-bottom: 0; }
/* carte mise en avant = état « survol » du thème (fond blanc, icône sur vert foncé) */
.csb-acces .csb-acces-card.is-featured { background-color: var(--white-color); box-shadow: 0 35px 41.5px -16px rgba(0, 69, 64, .08); }
.csb-acces .csb-acces-card.is-featured .service-top i,
.csb-acces .csb-acces-card:hover .service-top i { background-color: var(--theme-color-3); border-color: var(--theme-color-3); color: var(--theme-color-2); }
.csb-acces .csb-acces-card:has(.csb-acces-link:focus-visible) { outline: 3px solid var(--theme-color-3); outline-offset: 3px; }
@media (max-width: 1199px) { .csb-acces .service-top h2 { font-size: 24px; line-height: 1.3; } }
@media (max-width: 991px) {
  .csb-acces-grid { gap: 16px; }
  .csb-acces .csb-acces-card { padding: 24px 20px; }
  .csb-acces .service-top { flex-direction: column-reverse; align-items: flex-start; }
  .csb-acces .service-top h2 { max-width: 100%; font-size: 22px; }
  .csb-acces .service-content p { width: 100%; }
}
@media (max-width: 767px) { .csb-acces-grid { grid-template-columns: 1fr; } .csb-acces .csb-acces-card { padding: 24px; } }
@media (prefers-reduced-motion: reduce) { .csb-acces .csb-acces-card, .csb-acces .service-top i { transition: none; } }
.csb-acces.services-section { padding-top: 24px; }
@media (max-width: 767px) { .csb-acces.services-section { padding-top: 16px; } }

/* --- Chiffres : version compacte, placée sous À propos --- */
.csb-chiffres.company-achievements-section { margin-top: 24px; padding-bottom: 8px; }
.csb-chiffres .company-achievements { gap: 16px; }
.csb-chiffres .achievement i { width: 52px; height: 52px; font-size: 22px; margin-bottom: 12px; padding: 8px; }
.csb-chiffres .achievement :is(h2, .achievement-chiffre) { font-size: 38px; margin-bottom: 6px; }
.csb-chiffres .achievement p { font-size: 15px; line-height: 22px; }
@media (max-width: 991px) {
  .csb-chiffres .achievement i { width: 44px; height: 44px; font-size: 18px; }
  .csb-chiffres .achievement :is(h2, .achievement-chiffre) { font-size: 30px; }
  .csb-chiffres .achievement p { font-size: 14px; line-height: 1.3; }
}
@media (max-width: 575px) { .csb-chiffres .achievement :is(h2, .achievement-chiffre) { font-size: 28px; } }

/* --- Vidéos (section 'Le centre en vidéos', lightbox Fancybox) --- */
.csb-videos { background: #F8F7F0; } /* fond différent de « Pourquoi se former » (blanc), qui la précède */
.csb-videos-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px 40px; flex-wrap: wrap; margin-bottom: 48px; }
.csb-videos-intro { max-width: 640px; }
.csb-videos-intro p { margin: 0; }
.csb-videos-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }
.csb-video-card { display: flex; flex-direction: column; background: #fff; border-radius: 10px; overflow: hidden; transition: box-shadow .3s; }
.csb-video-card:hover { box-shadow: 0 35px 41.5px -16px rgba(0, 69, 64, .12); }
.csb-video-media { position: relative; aspect-ratio: 16 / 9; background: var(--theme-color-3); }
.csb-video-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.csb-video-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 24, 25, 0) 45%, rgba(0, 24, 25, .45) 100%); pointer-events: none; }
.csb-video-play { position: absolute; top: 50%; left: 50%; z-index: 2; transform: translate(-50%, -50%); width: 72px; height: 72px; display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 20px; border: 1px solid rgba(255, 255, 255, .8); border-radius: 100%; background: rgba(0, 69, 64, .55); backdrop-filter: blur(8px); transition: background .3s, color .3s, border-color .3s; }
.csb-video-play i { margin-left: 3px; }
.csb-video-play:hover, .csb-video-card:hover .csb-video-play { color: var(--theme-color-3); background: var(--theme-color-2); border-color: var(--theme-color-2); }
.csb-video-body { display: flex; flex-direction: column; align-items: flex-start; flex: 1; padding: 24px 26px 28px; }
.csb-video-meta { margin: 0 0 10px; font-size: 14px; font-weight: 500; color: var(--theme-color-3); }
.csb-video-body h3 { font-size: 22px; line-height: 1.3; font-weight: 600; color: var(--theme-color-3); margin-bottom: 14px; }
.csb-video-desc { margin: 0 0 20px; }
.csb-video-open { margin-top: auto; }
.csb-videos a:focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: 3px; }
@media (max-width: 991px) { .csb-videos-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } }
@media (max-width: 767px) { .csb-videos-grid { grid-template-columns: 1fr; } .csb-videos-top { margin-bottom: 32px; } .csb-video-body { padding: 20px 20px 24px; } .csb-video-play { width: 60px; height: 60px; } }
@media (prefers-reduced-motion: reduce) { .csb-video-card, .csb-video-play { transition: none; } }

/* --- FAQ : titres des questions un peu plus petits (24 px -> 20 px au maximum) --- */
body .csb-faq .faq-accordion .accordion-item .accordion-header .accordion-button { font-size: clamp(17px, 15.9px + .38vw, 20px); line-height: 1.3; }

/* --- Paragraphes justifiés (césure automatique : html lang="fr") --- */
body :is(.csb-hero, .csb-acces, .csb-about, .csb-faire, .csb-pourquoi, .csb-videos, .csb-produits, .csb-actus, .csb-faq, .csb-contact, .csb-footer) :is(p, .benefits li, .accordion-body) {
  text-align: justify; -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 6 3 3;
}
/* exceptions : petits libellés, badges, textes centrés */
body :is(.csb-about .experience-shape-2, .csb-about .award-shape, .csb-about .csb-question, .csb-pourquoi .annual-text, .csb-pourquoi-liste, .csb-chiffres, .csb-video-meta, .csb-form-note, .csb-faq-contact) :is(p, li) {
  text-align: start; hyphens: manual; -webkit-hyphens: manual;
}
/* Ce que nous faisons : la zone de texte reste en place au survol (pas d'espace ajouté en bas) */

/* --- À propos : bloc « Une question ? » resserré --- */
body .csb-about .csb-question { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
body .csb-about .csb-question p { margin: 0; font-size: 14px; line-height: 1.3; }
body .csb-about .csb-question a { margin: 0; font-size: 18px; line-height: 1.3; width: fit-content; }

/* --- Header : menu centré entre le logo et le bouton --- */
.header-section-4 .header-bottom-layout { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; column-gap: 24px; }
.header-section-4 .header-bottom-layout .header-left-2 { grid-column: 1; justify-self: start; }
.header-section-4 .header-bottom-layout .main-menu { grid-column: 2; justify-self: center; }
.header-section-4 .header-bottom-layout .header-right { grid-column: 3; justify-self: end; }

/* =====================================================================
   Page « Le centre » (le-centre.php) : préfixe .csb-lc-
   ===================================================================== */
.csb-lc-lien { display: inline-flex; align-items: center; gap: 8px; color: var(--theme-color-3); font-weight: 600; font-size: 15px; text-decoration: underline; text-underline-offset: 4px; }
.csb-lc-lien:hover { color: var(--theme-color-3); text-decoration-thickness: 2px; }
.csb-lc-lien:focus-visible, .csb-lc-bandeau a:focus-visible, .csb-lc-sites a:focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: 3px; border-radius: 3px; }

/* --- Bandeau --- */
.csb-lc-bandeau { position: relative; overflow: hidden; background: var(--theme-color-3); margin: 0; padding: 0; }
.csb-lc-bandeau .csb-lc-bandeau-fond { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center 28%; z-index: 0; }
.csb-lc-bandeau .breadcrumb-content::before { display: none; }
.csb-lc-bandeau::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(8, 28, 26, .88) 0%, rgba(8, 28, 26, .7) 45%, rgba(8, 28, 26, .25) 100%); }
.csb-lc-bandeau .container { position: relative; z-index: 2; }
.csb-lc-bandeau .breadcrumb-content { background: none; min-height: clamp(320px, 30vw, 440px); display: flex; flex-direction: column; justify-content: center; padding: 70px 0; }
@media (max-width: 767px) { .csb-lc-bandeau::after { background: linear-gradient(180deg, rgba(8, 28, 26, .7) 0%, rgba(8, 28, 26, .85) 100%); } .csb-lc-bandeau .breadcrumb-content { min-height: 0; padding: 56px 0; } }
.csb-lc-bandeau .breadcrumb-nav ul li { color: rgba(255, 255, 255, .85); }
.csb-lc-bandeau .breadcrumb-nav a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.csb-lc-bandeau .breadcrumb-nav a:focus-visible { outline-color: var(--theme-color-2); }
.csb-lc-bandeau .breadcrumb-title h1 { font-family: var(--csb-font-titre, inherit); font-weight: 600; font-size: clamp(32px, 4.4vw, 56px); line-height: 1.1; color: #fff; margin-bottom: 14px; }
.csb-lc-bandeau .breadcrumb-title p { color: rgba(255, 255, 255, .9); max-width: 460px; margin: 0; }


/* --- Qui sommes-nous : badge « 2021 » --- */
.csb-lc-badge { position: absolute; left: -24px; top: -36px; display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
  padding: 14px 20px; border-radius: 10px; background: var(--theme-color-2); color: var(--theme-color-3); box-shadow: 0 12px 30px -10px rgba(0, 69, 64, .35); }
.csb-lc-badge-annee { font-family: var(--csb-font-titre, inherit); font-weight: 600; font-size: 34px; line-height: 1; }
.csb-lc-badge-texte { font-weight: 600; font-size: 13px; }
@media (max-width: 767px) { .csb-lc-badge { left: auto; right: 8px; top: auto; bottom: 8px; padding: 10px 14px; } .csb-lc-badge-annee { font-size: 24px; } }

/* --- Cartes (approche, étapes) : base service-card du thème --- */
.csb-lc-approche { background: #F8F7F0; }
.csb-lc-approche .service-card { background: #fff; height: 100%; }
.csb-lc-carte { height: 100%; }
.csb-lc-carte .service-top { align-items: flex-start; gap: 16px; }
.csb-lc-carte .service-top h3 { font-size: clamp(19px, 1.6vw, 22px); line-height: 1.3; color: var(--theme-color-3); margin: 0; max-width: none; }
.csb-lc-carte .service-top i { flex: none; width: 56px; height: 56px; font-size: 22px; padding: 0; }
.csb-lc-carte .service-content p { margin: 0; color: #16231A; }
.csb-lc-etapes-liste { list-style: none; padding: 0; margin-bottom: 0; }
.csb-lc-etapes .service-card .number { flex: none; width: 56px; height: 56px; }
.csb-lc-etapes .service-card .number span { color: var(--theme-color-3); font-size: 18px; }
.csb-lc-etapes-bas { display: flex; justify-content: center; margin-top: 40px; }

/* --- Histoire (onglets par année) --- */
.csb-lc-histoire-photo img, .csb-lc-domaines-photo img { width: 100%; height: auto; border-radius: 10px; display: block; }
.csb-lc-histoire-photo { position: relative; padding: 0 0 18px 18px; }
.csb-lc-histoire-photo:before, .csb-lc-domaines-photo:before { content: ""; position: absolute; left: 0; bottom: 0; width: 70%; height: 70%; border-radius: 10px; background: var(--theme-color-2); z-index: -1; }
.csb-lc-histoire-photo, .csb-lc-domaines-photo { z-index: 0; }
.csb-lc-domaines-photo { position: relative; padding: 0 18px 18px 0; }
.csb-lc-domaines-photo:before { left: auto; right: 0; }
.csb-lc-annee { margin: 0 0 6px; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; color: var(--theme-color-3); }

/* --- Domaines (accordéon) --- */
.csb-lc-domaines { background: #F8F7F0; }
.csb-lc-domaines .accordion-item { background: #fff; }
.csb-lc-domaines .accordion-button { gap: 14px; }
.csb-lc-dom-icone { flex: none; width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%;
  background: #F8F7F0; border: 2px solid var(--theme-color-2); color: var(--theme-color-3); font-size: 18px; }
.csb-lc-domaines .accordion-body p { color: #16231A; margin-bottom: 12px; }
.csb-lc-themes { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0 0 16px; }
.csb-lc-themes li { padding: 5px 12px; border-radius: 100px; background: #F8F7F0; border: 1px solid rgba(0, 69, 64, .15); font-size: 14px; font-weight: 500; color: var(--theme-color-3); }

/* --- Installations (fond vert foncé) --- */
.csb-lc-installations { position: relative; overflow: hidden; background: var(--theme-color-3); color: #fff; }
.csb-lc-installations .shape-10, .csb-lc-installations .shape-11 { position: absolute; pointer-events: none; opacity: .5; }
.csb-lc-installations .shape-10 { top: 0; left: 0; }
.csb-lc-installations .shape-11 { bottom: 0; right: 0; }
.csb-lc-installations .common-subtitle span { color: #fff; }
.csb-lc-installations .common-title h2 { color: #fff; }
.csb-lc-installations-intro { color: rgba(255, 255, 255, .9); margin: 0; max-width: 520px; }
.csb-lc-tuiles { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; list-style: none; padding: 0; margin: 0; }
.csb-lc-tuile { display: flex; align-items: flex-start; gap: 18px; padding: 26px; border-radius: 10px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .16); transition: background .3s; }
.csb-lc-tuile:hover { background: rgba(255, 255, 255, .1); }
.csb-lc-tuile-icone { flex: none; width: 56px; height: 56px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--theme-color-2); color: var(--theme-color-3); font-size: 22px; }
.csb-lc-tuile h3 { font-size: 19px; line-height: 1.3; color: #fff; margin: 4px 0 6px; }
.csb-lc-tuile p { margin: 0; color: rgba(255, 255, 255, .88); font-size: 15px; }
@media (max-width: 1199px) { .csb-lc-tuiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .csb-lc-tuiles { grid-template-columns: 1fr; } .csb-lc-tuile { padding: 20px; } }
@media (prefers-reduced-motion: reduce) { .csb-lc-tuile { transition: none; } }

/* --- Sites --- */
.csb-lc-site { height: 100%; padding: 30px; border-radius: 10px; background: #F8F7F0; border: 1px solid rgba(0, 69, 64, .1); }
.csb-lc-site--contact { background: #fff; border: 2px solid var(--theme-color-2); }
.csb-lc-site-icone { width: 56px; height: 56px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--theme-color-3); color: var(--theme-color-2); font-size: 22px; margin-bottom: 18px; }
.csb-lc-site h3 { font-size: 21px; line-height: 1.3; color: var(--theme-color-3); margin-bottom: 8px; }
.csb-lc-site p { color: #16231A; margin-bottom: 14px; }
.csb-lc-contact { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.csb-lc-contact li { display: flex; align-items: center; gap: 12px; }
.csb-lc-contact i { width: 18px; color: var(--theme-color-3); }
.csb-lc-contact a { color: #16231A; font-weight: 500; word-break: break-word; }
.csb-lc-contact a:hover { color: var(--theme-color-3); text-decoration: underline; }

/* --- Partenaires (masquée par défaut) --- */
.csb-lc-partenaires { background: #F8F7F0; }
.csb-lc-partenaires-liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; list-style: none; padding: 0; margin: 0; }
.csb-lc-partenaires-liste li { padding: 24px; border-radius: 10px; background: #fff; }
.csb-lc-partenaires-liste h3 { font-size: 19px; color: var(--theme-color-3); margin-bottom: 6px; }
.csb-lc-partenaires-liste p { margin: 0; color: #16231A; font-size: 15px; }
@media (max-width: 991px) { .csb-lc-partenaires-liste { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575px) { .csb-lc-partenaires-liste { grid-template-columns: 1fr; } }

/* --- Appel à l'action --- */
.csb-lc-appel { position: relative; overflow: hidden; padding: 120px 0; isolation: isolate; }
.csb-lc-appel-fond { position: absolute; inset: 0; z-index: -1; }
.csb-lc-appel-fond img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.csb-lc-appel-fond::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8, 28, 26, .88) 0%, rgba(8, 28, 26, .7) 50%, rgba(8, 28, 26, .35) 100%); }
.csb-lc-appel-contenu { max-width: 620px; }
.csb-lc-appel h2 { font-family: var(--csb-font-titre, inherit); font-weight: 600; font-size: clamp(28px, 3.2vw, 42px); line-height: 1.15; color: #fff; margin-bottom: 14px; }
.csb-lc-appel p { color: rgba(255, 255, 255, .92); margin-bottom: 28px; }
.csb-lc-appel-boutons { display: flex; flex-wrap: wrap; gap: 12px; }
.csb-lc-btn-clair { background: transparent; border: 1.5px solid rgba(255, 255, 255, .7); color: #fff; }
.csb-lc-btn-clair:hover { color: var(--theme-color-3); }
.csb-lc-appel a:focus-visible { outline: 3px solid var(--theme-color-2); outline-offset: 3px; }
@media (max-width: 767px) { .csb-lc-appel { padding: 80px 0; } .csb-lc-appel-fond::after { background: rgba(8, 28, 26, .78); } }
/* Pas de justification dans l'accordéon, les puces et les cartes courtes (évite les grands espaces sur mobile) */
body :is(.csb-lc-domaines .accordion-body, .csb-lc-themes, .csb-lc-carte, .csb-lc-tuile, .csb-lc-site, .csb-lc-annees .tab-pane) :is(p, li) { text-align: left; hyphens: manual; -webkit-hyphens: manual; }

/* --- Ce que nous faisons : cartes blanches (design « campagnes » de la Home 05) --- */
.csb-faire .csb-card { height: 100%; display: flex; flex-direction: column; background: #fff; border-radius: 10px; padding: 10px; }
.csb-faire .csb-card .thumb img { display: block; width: 100%; height: auto; }
.csb-faire .csb-card .thumb .date { padding: 8px 16px; font-size: 13px; line-height: 1; background: rgba(0, 24, 25, .45); }
.csb-faire .csb-card .thumb .date span { line-height: 1; font-weight: 600; }
.csb-faire .csb-card .content { flex: 1; display: flex; }
.csb-faire .csb-card .content .donation-wrap { flex: 1; display: flex; flex-direction: column; padding: 18px 12px 12px; }
.csb-faire .csb-card .content .content-top { flex: 1; }
.csb-faire .csb-card .content .title { margin-bottom: 8px; }
body .csb-faire .csb-card .content .title h3, body .csb-faire .csb-card .content .title h3 a { color: var(--theme-color-3); margin-bottom: 0; }
body .csb-faire .csb-card .content .text p { color: var(--csb-texte); font-size: var(--body-fz); line-height: 1.65; margin-bottom: 20px; text-align: left; }
.csb-faire .csb-card .d-bottom { justify-content: flex-start; margin-top: auto; }
.csb-faire .csb-card .csb-title:focus-visible { outline: 2px solid var(--theme-color-3); outline-offset: 3px; border-radius: 3px; }
.csb-faire .csb-card:has(.csb-title:focus-visible) { outline: 3px solid var(--theme-color-2); outline-offset: 3px; }

/* --- Header : bouton « Se former » (secondaire) avant « Nous appeler » --- */
.csb-header-btns { align-items: center; gap: 12px; }
.csb-btn-outline { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 24px; font-weight: 500; font-size: 16px; line-height: 1; white-space: nowrap;
  color: var(--theme-color-3); background: #fff; border: 2px solid var(--theme-color-3); border-radius: 100px; transition: background .3s, color .3s; }
.csb-btn-outline:hover { background: var(--theme-color-3); color: var(--theme-color-2); }
.csb-btn-outline:focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: 3px; }
@media (min-width: 1200px) and (max-width: 1399px) { .csb-header-btns { gap: 8px; } .csb-btn-outline { padding: 0 18px; font-size: 15px; } }
.csb-offcanvas-cta .csb-btn-outline { min-height: 44px; }
@media (prefers-reduced-motion: reduce) { .csb-btn-outline { transition: none; } }

/* --- Page « Le centre » : corrections d'intégration (.csb-lc-) --- */
/* onglets des années : gabarit des boutons compacts (44 px, 14 px) */
/* questions de l'accordéon « Nos domaines » : titres d'items, même échelle que les titres de cartes */
body .csb-lc-domaines .accordion-button { font-family: var(--csb-font-titre); font-size: var(--csb-t-carte); font-weight: 600; letter-spacing: -.01em; line-height: 1.3; }
/* paragraphes alignés à gauche, sans coupure de mots (le thème justifie le texte) */
body :is(.csb-lc-qui, .csb-lc-approche, .csb-lc-annees, .csb-lc-domaines, .csb-lc-etapes, .csb-lc-installations, .csb-lc-sites, .csb-lc-appel, .csb-lc-bandeau) p { text-align: left; hyphens: manual; -webkit-hyphens: manual; }
body :is(.csb-lc-qui, .csb-lc-approche, .csb-lc-annees, .csb-lc-domaines, .csb-lc-etapes, .csb-lc-installations, .csb-lc-sites, .csb-lc-appel, .csb-lc-bandeau) p:not(#csb) { text-align: left; hyphens: manual; -webkit-hyphens: manual; }
body :is(.csb-lc-approche, .csb-lc-etapes, .csb-lc-sites) .text-center p:not(#csb) { text-align: center; }

/* --- Menu : sous-menu « Formations » (libellés plus longs), page courante, fermeture par Échap --- */
.main-menu ul .has-dropdown .sub-menu { width: max-content; min-width: 220px; max-width: 320px; }
.main-menu ul .has-dropdown .sub-menu li a[aria-current="page"] { font-weight: 600; background: rgba(0, 69, 64, .08); }
.main-menu ul .has-dropdown.csb-closed .sub-menu { visibility: hidden !important; opacity: 0 !important; }
.off-canvas-menu .sub-menu a[aria-current="page"] { font-weight: 600; color: var(--theme-color); }

/* --- Logo du Centre (assets/img/csb/csb-logo.webp, 800x278) : plus grand pour garder le texte lisible --- */
.csb-logo { height: 62px; }
@media (min-width: 1400px) { .csb-logo { height: 72px; } }
@media (max-width: 575px) { .csb-logo { height: 58px; } }
.csb-logo { width: auto; max-width: none; flex: none; }
.header-section-4 .logo-wrap, .off-canvas-logo { flex: none; }
body .header-section-4 .logo-wrap .csb-logo, body .off-canvas-menubar .off-canvas-logo .csb-logo { width: auto; max-width: none; }
@media (min-width: 1200px) and (max-width: 1399px) { .csb-logo { height: 54px; } } /* le menu reste sur une ligne avec 2 boutons */

/* --- Notre histoire : cartes horizontales (design « événements » de la Home 02) --- */
  font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: .02em; font-variant-numeric: tabular-nums; color: var(--theme-color-3); }


/* --- Coordonnées avant le pied de page (base : contact-info du thème) --- */
.csb-info .contact-info { display: block; }
body .csb-info .contact-info h3:not(#csb) { overflow-wrap: anywhere; }
.csb-info a.contact-info:not(.active):hover { background: rgba(255, 255, 255, .35); }
.csb-info a.contact-info:focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: -3px; }
.csb-info a.contact-info.active:focus-visible { outline-color: var(--theme-color-2); }
@media (min-width: 992px) and (max-width: 1399px) { .csb-info .contact-info { padding: 26px 20px; } body .csb-info .contact-info h3:not(#csb) { font-size: 17px; line-height: 1.4; } }
@media (prefers-reduced-motion: reduce) { .csb-info .contact-info, .csb-info .contact-info h3, .csb-info .contact-info p { transition: none; } }
@media (max-width: 575px) { .csb-info .contact-info { padding: 24px 22px; } body .csb-info .contact-info h3:not(#csb) { font-size: 15.5px; } }

/* --- Notre histoire : onglets des années (version d origine, avec les corrections d intégration) --- */
.csb-lc-annees .nav-tabs { flex-wrap: wrap; gap: 8px; }
.csb-lc-annees .nav-tabs .nav-item .nav-link { padding: 8px 18px; font-size: 15px; background: #F8F7F0; }
.csb-lc-annees .nav-tabs .nav-item .nav-link:focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: 2px; }
.csb-lc-annees .tab-pane { padding: 28px 30px; border-radius: 10px; background: #F8F7F0; border-left: 4px solid var(--theme-color-2); }
.csb-lc-annees .tab-pane h3 { font-size: clamp(20px, 1.8vw, 24px); line-height: 1.3; color: var(--theme-color-3); margin-bottom: 10px; }
.csb-lc-annees .tab-pane p { color: #16231A; margin-bottom: 16px; }
@media (max-width: 575px) { .csb-lc-annees .tab-pane { padding: 22px 20px; } }
body .csb-lc-annees .nav-tabs .nav-item .nav-link { height: 44px; padding: 0 20px; display: inline-flex; align-items: center; font-size: 14px; line-height: 1; border-radius: 100px; }
body .csb-lc-annees .tab-pane:focus-visible { outline: 3px solid var(--theme-color-3); outline-offset: 3px; }

/* Notre histoire : photo qui change avec l année ; panneau plus étroit */
.csb-lc-photo-cadre { position: relative; aspect-ratio: 380 / 430; border-radius: 10px; overflow: hidden; }
.csb-lc-histoire-photo .csb-lc-photo-cadre img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 0; opacity: 0; transition: opacity .45s ease; }
.csb-lc-histoire-photo .csb-lc-photo-cadre img.is-active { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .csb-lc-histoire-photo .csb-lc-photo-cadre img { transition: none; } }
.csb-lc-annees { max-width: none; }
/* Notre histoire : photo et texte à 50 % chacun, cadre carré pour limiter le recadrage des photos */
.csb-lc-histoire .csb-lc-photo-cadre { aspect-ratio: 1 / 1; }

/* --- Nos installations : cartes avec photo (remplace les tuiles) --- */
.csb-lc-inst-grille { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px 24px; list-style: none; padding: 0; margin: 0; }
.csb-lc-inst-carte { display: flex; flex-direction: column; border-radius: 10px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .16); transition: transform .3s ease, background .3s ease; }
.csb-lc-inst-carte:hover { transform: translateY(-4px); background: rgba(255, 255, 255, .1); }
.csb-lc-inst-media { position: relative; flex: none; aspect-ratio: 4 / 3; }
.csb-lc-inst-photo { position: absolute; inset: 0; display: block; overflow: hidden; border-radius: 9px 9px 0 0; }
.csb-lc-inst-photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.csb-lc-inst-carte:hover .csb-lc-inst-photo img { transform: scale(1.05); }
.csb-lc-inst-media--vide { display: flex; align-items: center; justify-content: center; border-radius: 9px 9px 0 0; background: rgba(255, 255, 255, .1); color: var(--theme-color-2); font-size: 84px; }
.csb-lc-inst-media > .csb-lc-tuile-icone { position: absolute; left: 24px; bottom: -28px; border: 4px solid var(--theme-color-3); box-sizing: content-box; width: 52px; height: 52px; }
.csb-lc-inst-corps { flex: 1; display: flex; flex-direction: column; padding: 44px 24px 26px; }
body .csb-lc-inst-carte h3:not(#csb) { font-size: 21px; line-height: 1.3; color: #fff; margin: 0 0 8px; }
body .csb-lc-inst-carte .csb-lc-inst-corps > p:not(#csb) { margin: 0 0 16px; color: rgba(255, 255, 255, .9); font-size: 15.5px; line-height: 1.6; }
.csb-lc-inst-lie { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: auto 0 18px; }
.csb-lc-inst-lie > span { font-size: 14px; color: rgba(255, 255, 255, .9); }
.csb-lc-inst-lie ul { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0; }
.csb-lc-inst-lie li { padding: 3px 12px; border-radius: 100px; background: rgba(255, 255, 255, .14); color: #fff; font-size: 13.5px; line-height: 1.5; }
.csb-lc-inst-lien { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; color: var(--theme-color-2); font-weight: 600; font-size: 15px; text-decoration: underline; text-underline-offset: 4px; }
.csb-lc-inst-lien:hover { color: #fff; }
.csb-lc-installations a:focus-visible { outline: 3px solid var(--theme-color-2); outline-offset: 3px; border-radius: 4px; }
/* Encart « Visiter le centre » */
.csb-lc-inst-visite { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 20px; margin-top: 56px; padding: 30px; border-radius: 14px; background: rgba(255, 255, 255, .1); }
.csb-lc-inst-visite-texte { flex: 1; }
body .csb-lc-inst-visite h3:not(#csb) { font-size: 22px; line-height: 1.3; color: #fff; margin: 0 0 6px; }
body .csb-lc-inst-visite p:not(#csb) { margin: 0; color: rgba(255, 255, 255, .92); }
.csb-lc-inst-visite-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
.csb-lc-inst-wa { display: inline-flex; align-items: center; gap: 8px; color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.csb-lc-inst-wa:hover { color: var(--theme-color-2); }
.csb-lc-inst-wa i { font-size: 20px; }
@media (min-width: 992px) { .csb-lc-inst-visite { flex-direction: row; align-items: center; gap: 28px; padding: 28px 36px; } .csb-lc-inst-visite-actions { flex: none; } }
@media (max-width: 1199px) { .csb-lc-inst-grille { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .csb-lc-inst-grille { grid-template-columns: 1fr; } .csb-lc-inst-corps { padding: 44px 20px 24px; } .csb-lc-inst-visite { padding: 24px 20px; } }
@media (prefers-reduced-motion: reduce) { .csb-lc-inst-carte, .csb-lc-inst-photo img { transition: none; } .csb-lc-inst-carte:hover { transform: none; } .csb-lc-inst-carte:hover .csb-lc-inst-photo img { transform: none; } }

/* --- FAQ du centre : fond crème, réponses alignées à gauche --- */
.csb-lc-faq { background: #F8F7F0; }
body .csb-lc-faq .accordion-body, body .csb-lc-faq .accordion-body:not(#csb) { text-align: left; hyphens: manual; -webkit-hyphens: manual; }

/* Chiffres : libellé centré sous le chiffre */
body .csb-chiffres .achievement p:not(#csb) { text-align: center; margin-inline: auto; }

/* FAQ de l'accueil : textes alignés à gauche, sans espaces étirés ni coupure de mots */
body .csb-faq :is(.accordion-body, .faq-content, .col-xl-5) p:not(#csb) { text-align: left; hyphens: manual; -webkit-hyphens: manual; }


/* =====================================================================
   Hero : typographie éditoriale (surtitre, titre, accent, paragraphe, filières, compteur, entrée)
   Préfixe .csb-hero ; ce bloc passe après les règles du thème et les blocs Typographie / Boutons.
   ===================================================================== */
/* Surtitre : filet jaune + capitales, plus de pastille */
body .csb-hero .hero-content-1 .subtitle { padding: 0; gap: 12px; background: none; border: 0; border-radius: 0; backdrop-filter: none; margin-bottom: 22px; }
body .csb-hero .hero-content-1 .subtitle::before { content: ""; flex: none; width: 32px; height: 2px; background: var(--theme-color-2); }
body .csb-hero .hero-content-1 .subtitle span { font-family: var(--csb-font-texte); font-weight: 600; font-size: 13px; line-height: 1.5; letter-spacing: .16em; text-transform: uppercase; color: var(--theme-color-2); }

/* Titre */
body .csb-hero .hero-content-1 .title { max-width: none; margin-bottom: 0; }
body .csb-hero .hero-content-1 .title :is(h1, h2):not(#csb) {
  font-size: clamp(36px, 5.4vw, 76px); line-height: 1.02; letter-spacing: -.025em; text-wrap: balance; max-width: 13ch;
  margin-bottom: 26px; text-shadow: 0 2px 24px rgba(0, 0, 0, .25); }
body .csb-hero .hero-content-1 .title .csb-hero-accent {
  color: var(--theme-color-2); padding-bottom: .06em; -webkit-box-decoration-break: clone; box-decoration-break: clone;
  background: no-repeat 0 calc(100% - .1em) / 100% 10px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 10' preserveAspectRatio='none'%3E%3Cpath d='M3 5 Q18 3.2 33 5 T63 5 T93 5 T117 4.6' fill='none' stroke='%23FFE175' stroke-opacity='.9' stroke-width='6' stroke-linecap='round'/%3E%3C/svg%3E"); }

/* Paragraphe : aligné à gauche, sans césure */
body .csb-hero .hero-content-1 .text { max-width: none; margin-bottom: 28px; }
body .csb-hero .hero-content-1 .text p:not(#csb) {
  font-weight: 400; font-size: clamp(16px, 1.25vw, 19px); line-height: 1.6; color: rgba(255, 255, 255, .88); max-width: 44ch; margin: 0;
  text-align: left; hyphens: manual; -webkit-hyphens: manual; }

/* Filières (diapositive 1) */
.csb-hero .csb-hero-filieres { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 28px; font-size: 13px; font-weight: 500; letter-spacing: .04em; }
.csb-hero .csb-hero-filieres a { color: rgba(255, 255, 255, .7); text-decoration: none; }
.csb-hero .csb-hero-filieres a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.csb-hero .csb-hero-filieres a:focus-visible { outline: 3px solid var(--theme-color-2); outline-offset: 3px; border-radius: 3px; }
.csb-hero .csb-hero-sep { color: var(--theme-color-2); }
@media (max-width: 575px) { .csb-hero .csb-hero-filieres { display: none; } }

/* Compteur « 01 / 03 » à gauche des flèches */
.csb-hero-controls { align-items: center; }
.csb-hero-count { margin-right: 10px; font-size: 14px; font-weight: 600; letter-spacing: .04em; font-variant-numeric: tabular-nums; color: rgba(255, 255, 255, .5); }
.csb-hero-count .csb-hero-count-cur { color: #fff; }

/* Entrée : fondu + translation de 16 px, décalés de 80 ms (diapositive active) */
@keyframes csbHeroEntree { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.csb-hero .swiper-slide-active :is(.subtitle, .title, .text, .join-us, .csb-hero-filieres) { animation: csbHeroEntree .6s cubic-bezier(.2, .7, .2, 1) both; }
.csb-hero .swiper-slide-active .title { animation-delay: .08s; }
.csb-hero .swiper-slide-active .text { animation-delay: .16s; }
.csb-hero .swiper-slide-active .join-us { animation-delay: .24s; }
.csb-hero .swiper-slide-active .csb-hero-filieres { animation-delay: .32s; }
@media (prefers-reduced-motion: reduce) { .csb-hero .swiper-slide-active :is(.subtitle, .title, .text, .join-us, .csb-hero-filieres) { animation: none; } }

/* Mobile */
@media (max-width: 767px) {
  body .csb-hero .hero-content-1 .title :is(h1, h2):not(#csb) { font-size: clamp(36px, 10vw, 40px); line-height: 1.06; max-width: 100%; margin-bottom: 18px; }
  body .csb-hero .hero-content-1 .title .csb-hero-accent { background-size: 100% 6.5px; }
  body .csb-hero .hero-content-1 .text p:not(#csb) { font-size: 16px; }
  body .csb-hero .hero-content-1 .subtitle { margin-bottom: 16px; }
}

/* Hero : voile renforcé sur tablette et mobile (contraste du texte), compteur lisible sur photo claire */
@media (max-width: 991px) { .csb-hero-media::after { background: linear-gradient(180deg, rgba(8, 28, 26, .66) 0%, rgba(8, 28, 26, .9) 100%); } }
.csb-hero-count { text-shadow: 0 1px 8px rgba(0, 0, 0, .45); }
.csb-hero-count .csb-hero-count-tot { color: rgba(255, 255, 255, .72); }

/* Hero : titre plus large, sur deux lignes (3 au maximum pour les titres les plus longs) */
body .csb-hero .hero-content-1 .title :is(h1, h2):not(#csb) { max-width: min(100%, 16em); }

/* --- Hero accueil : hauteur -5 %, titre -4 px, paragraphe un peu plus large --- */
.csb-hero .hero-side { padding-top: 260px; padding-bottom: 170px; }
@media (min-width: 1200px) and (max-width: 1700px) { .csb-hero .hero-side { padding-top: 187px; padding-bottom: 117px; } }
@media (min-width: 992px) and (max-width: 1199px) { .csb-hero .hero-side { padding-top: 204px; padding-bottom: 134px; } }
@media (min-width: 768px) and (max-width: 991px) { .csb-hero .hero-side { padding-top: 207px; padding-bottom: 107px; } }
@media (max-width: 767px) { .csb-hero .hero-side { padding-top: 128px; padding-bottom: 118px; } }
body .csb-hero .hero-content-1 .title :is(h1, h2):not(#csb) { font-size: calc(clamp(36px, 5.4vw, 76px) - 4px); }
body .csb-hero .hero-content-1 .text p:not(#csb) { max-width: 52ch; }

/* --- Hero : bouton principal en vert foncé (au lieu du vert vif) ; survol jaune --- */
body .csb-hero .hero-content-1 .join-us .csb-btn-solid { background: var(--theme-color-3); border-color: var(--theme-color-3); color: #fff; }
body .csb-hero .hero-content-1 .join-us .csb-btn-solid:before { background: var(--theme-color-2); }
body .csb-hero .hero-content-1 .join-us .csb-btn-solid .icon-wrap { background: #fff; color: var(--theme-color-3); }
body .csb-hero .hero-content-1 .join-us .csb-btn-solid:hover { color: var(--theme-color-3); }
body .csb-hero .hero-content-1 .join-us .csb-btn-solid:hover .icon-wrap { background: var(--theme-color-3); color: #fff; }

/* --- Pied de page : logo image --- */
.csb-footer-logo { display: inline-block; line-height: 0; }
.csb-footer-logo img { display: block; width: 170px; height: auto; max-width: 100%; }
@media (max-width: 575px) { .csb-footer-logo img { width: 140px; } }

/* Hero accueil : pas de navigation (compteur, flèches, points) sur mobile et tablette */
@media (max-width: 991px) {
	body .csb-hero .csb-hero-controls,
	body .csb-hero .hero-slider-pagination-1 { display: none !important; }
}

/* --- Barre du haut : réseaux sociaux (Facebook, TikTok, LinkedIn) --- */
.csb-topbar-droite { display: flex; align-items: center; gap: 18px; }
.csb-topbar-reseaux { display: inline-flex; align-items: center; gap: 4px; }

/* --- Bouton WhatsApp flottant (bas à droite) --- */
.csb-wa { position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); z-index: 50; display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.csb-wa-icone { width: 58px; height: 58px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: #128C7E; color: #fff; font-size: 30px; box-shadow: 0 10px 24px -8px rgba(0, 40, 36, .55); transition: background-color .2s ease, transform .2s ease; }
.csb-wa:hover .csb-wa-icone, .csb-wa:focus-visible .csb-wa-icone { background: #0b6b60; transform: scale(1.06); }
.csb-wa-libelle { padding: 8px 14px; border-radius: 100px; background: #fff; color: #004540; font-family: var(--csb-font-texte); font-size: 14px; font-weight: 600; line-height: 1.2; box-shadow: 0 10px 24px -12px rgba(0, 40, 36, .5); opacity: 0; transform: translateX(8px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; white-space: nowrap; }
@media (hover: hover) { .csb-wa:hover .csb-wa-libelle { opacity: 1; transform: none; } }
.csb-wa:focus-visible { outline: 3px solid #004540; outline-offset: 4px; border-radius: 100px; }
.csb-wa:focus-visible .csb-wa-libelle { opacity: 1; transform: none; }
@media (max-width: 575px) { .csb-wa-icone { width: 54px; height: 54px; font-size: 28px; } }
@media (prefers-reduced-motion: reduce) { .csb-wa-icone, .csb-wa-libelle { transition: none; } .csb-wa:hover .csb-wa-icone { transform: none; } }
/* Le bouton WhatsApp flottant ne doit pas masquer le bas du pied de page */
.csb-footer .footer-bottom-layout-2 { padding-right: 84px; }
@media (max-width: 767px) { .csb-footer .footer-bottom-layout-2 { padding-right: 0; padding-bottom: 72px; } }

/* Pied de page : « Activités » rattaché à « Événements » (6 nov. 2026) */
.footer-widget ul li.csb-footer-sous { padding-left: 14px; }
.footer-widget ul li.csb-footer-sous a { font-size: .94em; opacity: .88; }