/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */


/* Le container qui contient un phantom crée son contexte
   d'empilement ET passe au-dessus des sections voisines,
   débordements décoratifs inclus */
.e-con:has(> .phantom),
.e-con:has(> .e-con-inner > .phantom) {
    position: relative;
    z-index: 1;
}

/* L'élément décoratif : sous le contenu de sa section,
   au-dessus du background de sa section */
.phantom {
    z-index: -1;
    pointer-events: none;
    user-select: none;
}


/* ==========================================================
 * UTILITY — Affichage conditionnel par breakpoint
 * ==========================================================
 * .menu-mobile-only  → masqué desktop, visible tablette/mobile
 * .desktop-only      → visible desktop, masqué tablette/mobile
 * ========================================================== */

/* Masqué en desktop (>1024px) */
@media (min-width: 1025px) {
    .menu-mobile-only {
        display: none !important;
    }
}

/* Bonus — l'inverse au cas où (visible desktop uniquement) */
@media (max-width: 1024px) {
    .desktop-only {
        display: none !important;
    }
}


/* ==========================================================
 * UTILITY — Couleurs de texte inline
 * ========================================================== */
.text-orange { color: #EC6608; }
.text-white  { color: #FFFFFF; }
.text-dark   { color: #242423; }
.text-black  { color: #000000; }
.text-yellow { color: #f49e40; }

/* ==========================================================
 * UTILITY — Poids de police inline
 * ========================================================== */
.thin   { font-weight: 300; }
.normal { font-weight: 400; }
.medium { font-weight: 500; }
.semi   { font-weight: 600; }
.bold   { font-weight: 700; }
.xbold  { font-weight: 800; }

/* ==========================================================
 * UTILITY — Style de police inline
 * ========================================================== */
.italic { font-style: italic; }

/* ==========================================================
 * UTILITY — Casse
 * ========================================================== */
.uppercase { text-transform: uppercase; }
.lowercase { text-transform: lowercase; }

/* La section devient un cadre découpé (overflow hidden = les décors sont coupés aux bords) */
.e-con:has(> .bg-image) {
  position: relative;
  overflow: hidden;
}

/* L'élément décoratif : absolu, derrière tout, non cliquable */
.bg-image {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  user-select: none;
}

/* Tous les autres enfants de la section repassent au-dessus */
.e-con:has(> .bg-image) > *:not(.bg-image) {
  position: relative;
  z-index: 1;
}

/* ==========================================================
 * BOUTONS — Remplissage au survol "style covering"
 * btn-anim       → orange, texte blanc
 * btn-anim-white → blanc, texte noir
 * btn-anim-black → noir, texte blanc
 * ========================================================== */

.btn-anim .elementor-button,
.btn-anim-white .elementor-button,
.btn-anim-black .elementor-button {
    --btn-fill: #EC6608;
    --btn-fill-text: #FFFFFF;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    vertical-align: top;
    transition: color 300ms ease;
}

.btn-anim-white .elementor-button { --btn-fill: #FFFFFF; --btn-fill-text: #151414; }
.btn-anim-black .elementor-button { --btn-fill: #151414; --btn-fill-text: #FFFFFF; }

/* Remplissage caché à gauche */
:is(.btn-anim, .btn-anim-white, .btn-anim-black) .elementor-button::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--btn-fill);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 400ms cubic-bezier(0.65, 0, 0.35, 1);
    z-index: -1;
}

/* Icône SVG : suit toujours la couleur du texte */
:is(.btn-anim, .btn-anim-white, .btn-anim-black) .elementor-button-icon {
    transition: transform 300ms ease;
}
:is(.btn-anim, .btn-anim-white, .btn-anim-black) .elementor-button-icon svg [fill]:not([fill="none"]) {
    fill: currentColor !important;
}
:is(.btn-anim, .btn-anim-white, .btn-anim-black) .elementor-button-icon svg [stroke]:not([stroke="none"]) {
    stroke: currentColor !important;
}

/* Survol + focus */
:is(.btn-anim, .btn-anim-white, .btn-anim-black) .elementor-button:is(:hover, :focus-visible) {
    color: var(--btn-fill-text) !important;
}
:is(.btn-anim, .btn-anim-white, .btn-anim-black) .elementor-button:is(:hover, :focus-visible)::before {
    transform: scaleX(1);
}
:is(.btn-anim, .btn-anim-white, .btn-anim-black) .elementor-button:is(:hover, :focus-visible) .elementor-button-icon {
    transform: translateX(5px);
}

@media (prefers-reduced-motion: reduce) {
    :is(.btn-anim, .btn-anim-white, .btn-anim-black) .elementor-button::before,
    :is(.btn-anim, .btn-anim-white, .btn-anim-black) .elementor-button-icon {
        transition: none;
    }
}

/* ==========================================================
 * BOUTONS — Vidage au survol (bouton plein → contour)
 * btn-anim-2       → sur fond sombre (texte reste blanc)
 * btn-anim-2-light → sur fond clair (texte passe en noir)
 * ========================================================== */

:is(.btn-anim-2, .btn-anim-2-light) .elementor-button {
    --btn-fill: #EC6608;
    --btn-empty-text: #FFFFFF;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    vertical-align: top;
    background-color: transparent !important;
    transition: color 300ms ease;
}

.btn-anim-2-light .elementor-button { --btn-empty-text: #151414; }

/* Remplissage orange visible au repos */
:is(.btn-anim-2, .btn-anim-2-light) .elementor-button::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--btn-fill);
    transform: scaleX(1);
    transform-origin: left;
    transition: transform 400ms cubic-bezier(0.65, 0, 0.35, 1);
    z-index: -1;
}

:is(.btn-anim-2, .btn-anim-2-light) .elementor-button-icon {
    transition: transform 300ms ease;
}

/* Survol + focus : l'orange se vide vers la droite */
:is(.btn-anim-2, .btn-anim-2-light) .elementor-button:is(:hover, :focus-visible)::before {
    transform: scaleX(0);
}

:is(.btn-anim-2, .btn-anim-2-light) .elementor-button:is(:hover, :focus-visible) {
    color: var(--btn-empty-text) !important;
}

:is(.btn-anim-2, .btn-anim-2-light) .elementor-button:is(:hover, :focus-visible) svg {
    fill: var(--btn-empty-text) !important;
}

:is(.btn-anim-2, .btn-anim-2-light) .elementor-button:is(:hover, :focus-visible) .elementor-button-icon {
    transform: translateX(5px);
}

@media (prefers-reduced-motion: reduce) {
    :is(.btn-anim-2, .btn-anim-2-light) .elementor-button::before,
    :is(.btn-anim-2, .btn-anim-2-light) .elementor-button-icon {
        transition: none;
    }
}

/* ==========================================================
 * RÉALISATIONS — Bouton galerie
 * Style intégré dans galleryViewer.php (shortcode [acf_galerie_bouton]).
 * Couleurs surchargeables ici si besoin via :
 *   --acf-galerie-trigger-bg, --acf-galerie-trigger-bg-hover, --acf-galerie-badge-bg
 * ========================================================== */


/* ==========================================================
 * EFFET — Spotlight cards (lueur orange qui suit la souris)
 * Usage : classe .sc-spotlight sur le container de la carte
 * Script : Éléments personnalisés → Code → "Spotlight cards"
 * ========================================================== */

.sc-spotlight {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.sc-spotlight::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        350px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
        rgba(236, 102, 8, 0.18),
        transparent 60%
    );
    opacity: 0;
    transition: opacity 400ms ease;
    pointer-events: none;
    z-index: -1;
}

.sc-spotlight:hover::after {
    opacity: 1;
}


/* ==========================================================
 * BADGES ARTICLE — [article_badges]
 * ==========================================================
 * .sc-badge--une : étiquette « À la une » (plein orange)
 * .sc-badge--cat : catégories (verre dépoli, pour poser sur une image)
 * Variante fond clair : ajouter la classe .sc-badges--light au widget
 * ========================================================== */

.sc-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

@media all and (max-width: 767px) {
    .sc-badges { 
        flex-direction: column;
        align-items: flex-start;
    }
}

.sc-badge {
    display: inline-flex;
    align-items: center;
    padding: 9px 18px;
    border-radius: 0 0 8px 8px;
    font-family: var(--e-global-typography-56de74f-font-family, 'Barlow Condensed'), sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    color: #fff;
    transition: background-color .25s ease, color .25s ease;
}

.sc-badge--une {
    background: var(--e-global-color-primary, #EC6608);
}

.sc-badge--cat {
    background: rgba(255, 255, 255, .28);
    -webkit-backdrop-filter: blur(8px);
            backdrop-filter: blur(8px);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25);
}

a.sc-badge--cat:hover {
    background: rgba(255, 255, 255, .9);
    color: var(--e-global-color-accent, #151414);
}

/* Sur fond clair (hors image) */
.sc-badges--light .sc-badge--cat {
    background: rgba(21, 20, 20, .08);
    box-shadow: inset 0 0 0 1px rgba(21, 20, 20, .12);
    color: var(--e-global-color-accent, #151414);
}

.sc-badges--light a.sc-badge--cat:hover {
    background: var(--e-global-color-accent, #151414);
    color: #fff;
}


/* ==========================================================
 * MULTI-AGENCES — Footer « Nos agences » ([agences_liste])
 * ==========================================================
 * Rendu : <span class="agences-liste"><a class="agence-lien">…</a>…</span>
 * L'agence courante porte la classe .is-current
 * ========================================================== */

.agences-liste {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.agences-liste .agence-lien {
    color: inherit;
    text-decoration: none;
}

.agences-liste .agence-lien:hover {
    text-decoration: underline;
}


/* ==========================================================
 * FORMULAIRE DE CONTACT — mention reCAPTCHA (champ HTML Elementor)
 * ========================================================== */

.sc-form-notice {
    margin: 4px 0 0;
    font-size: 11px;
    line-height: 1.5;
    color: rgba(255, 255, 255, .75); /* le formulaire est dans une carte sombre */
}

.sc-form-notice a {
    color: inherit;
    text-decoration: underline;
}

.sc-form-notice a:hover {
    color: #fff;
}


/* ==========================================================
 * NOTRE MÉTHODE — frise en 5 étapes (page contact)
 * ==========================================================
 * Structure Elementor :
 *   .e-con.sc-methode__steps            → container des étapes (contenu pleine largeur)
 *     .e-con.sc-methode__step  × 5      → une étape (colonne, centrée)
 *        .sc-methode__num               → widget titre « 01 » (pastille)
 *        .sc-methode__title             → widget titre
 *        .sc-methode__desc              → widget texte
 * Le trait blanc serpente : 01 → 02 → 03, demi-cercle à droite, trait de
 * retour dans l'interligne, demi-cercle à gauche (hors grille), puis 04 → 05.
 * Chaque étape dessine son segment via ::after (Elementor n'utilise que
 * ::before sur les containers).
 * ========================================================== */

.e-con.sc-methode__steps {
    --sc-line: #FFFFFF;
    --sc-line-w: 2px;
    --sc-gap: 64px;       /* espace entre les 2 rangées */
    --sc-badge-h: 32px;   /* hauteur de la pastille : le trait passe à mi-hauteur */
    --sc-radius: 32px;    /* rayon du demi-cercle gauche (le trait de retour passe 2×rayon au-dessus des pastilles 04/05) */
    --sc-overhang: 56px;  /* dépassement des demi-cercles hors de la grille */
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: 1fr;  /* rangées de même hauteur : nécessaire au calcul des virages */
    column-gap: 0;
    row-gap: var(--sc-gap);
    align-items: stretch;
}

.e-con.sc-methode__steps > .e-con.sc-methode__step {
    position: relative;
    width: auto;
    padding: 0 24px;
}

.sc-methode__steps > .sc-methode__step:nth-child(-n+3) { grid-column: span 2; }
.sc-methode__steps > .sc-methode__step:nth-child(4)    { grid-column: 2 / 4; }
.sc-methode__steps > .sc-methode__step:nth-child(5)    { grid-column: 4 / 6; }

/* Pastille numérotée */
.sc-methode__num {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: var(--sc-badge-h, 32px);
    min-width: 52px;
    padding: 0 14px;
    border: 2px solid #EC6608;
    border-radius: 999px;
    background: #151414;
}

.sc-methode__num .elementor-widget-container,
.sc-methode__num .elementor-heading-title {
    line-height: 1;
    margin: 0;
}

/* Pas de marge fantôme sous le dernier paragraphe : la hauteur de l'étape
   doit s'arrêter au texte pour que le trait mobile soit centré dans l'interligne. */
.sc-methode__desc p:last-child {
    margin-bottom: 0;
}

/* Segments du trait */
.sc-methode__steps > .sc-methode__step::after {
    content: '';
    position: absolute;
    top: calc(var(--sc-badge-h) / 2 - var(--sc-line-w) / 2);
    z-index: 1;
    pointer-events: none;
    border: 0 solid var(--sc-line);
    box-sizing: border-box;
}

/* 01 : trait de la pastille vers la droite */
.sc-methode__steps > .sc-methode__step:nth-child(1)::after {
    left: 50%;
    width: 50%;
    border-top-width: var(--sc-line-w);
}

/* 02 : trait traversant */
.sc-methode__steps > .sc-methode__step:nth-child(2)::after {
    left: 0;
    width: 100%;
    border-top-width: var(--sc-line-w);
}

/* 03 : trait + demi-cercle à droite qui redescend vers le trait de retour
   (bas de l'élément = 2×rayon au-dessus du centre des pastilles 04/05) */
.sc-methode__steps > .sc-methode__step:nth-child(3)::after {
    left: 0;
    width: calc(100% + var(--sc-overhang));
    height: calc(100% + var(--sc-gap) - 2 * var(--sc-radius) + var(--sc-line-w));
    border-top-width: var(--sc-line-w);
    border-right-width: var(--sc-line-w);
    border-bottom-width: var(--sc-line-w);
    border-radius: 0 999px 999px 0; /* clampé par le navigateur → demi-cercle exact */
}

/* 04 : trait de retour (haut), demi-cercle à gauche hors grille, puis trait
   du bas jusqu'au centre de la pastille 05.
   L'étape 04 occupe les colonnes 2-3 : -50 % = bord gauche de la grille,
   150 % = bord gauche de l'étape 03 = centre de la pastille 05. */
.sc-methode__steps > .sc-methode__step:nth-child(4)::after {
    left: calc(-50% - var(--sc-overhang));
    width: calc(200% + var(--sc-overhang));
    height: calc(2 * var(--sc-radius) + var(--sc-line-w));
    top: calc(var(--sc-badge-h) / 2 - 2 * var(--sc-radius) - var(--sc-line-w) / 2);
    border-top-width: var(--sc-line-w);
    border-left-width: var(--sc-line-w);
    border-bottom-width: var(--sc-line-w);
    border-radius: 999px 0 0 999px;
}

/* 05 : rien à dessiner, le trait est porté par 04 */
.sc-methode__steps > .sc-methode__step:nth-child(5)::after {
    display: none;
}

/* Déchirure collée au bas de la section précédente : le container ne prend
   aucune hauteur, l'image est calée sur son bord bas → aucun liseré sombre
   quelle que soit la largeur d'écran (remplace la marge négative fixe). */
.e-con.sc-shape-bottom {
    position: relative;
    height: 0;
    min-height: 0;
    padding: 0;
    margin: 0;
    z-index: 2;
}

.e-con.sc-shape-bottom > .elementor-widget-image {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    margin: 0;
}

.e-con.sc-shape-bottom img {
    display: block;
    width: 100%;
    height: auto;
}

/* Motifs décoratifs : au-dessus du fond, sous le contenu */
.sc-methode__pattern {
    pointer-events: none;
    user-select: none;
}

/* Tablette / mobile : une colonne, trait vertical entre les pastilles */
@media (max-width: 1024px) {
    .e-con.sc-methode__steps {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
        row-gap: 40px;
        max-width: 420px;
        margin-inline: auto;
    }

    .sc-methode__steps > .sc-methode__step:nth-child(n) {
        grid-column: auto;
    }

    /* Court connecteur vertical dans l'interligne (le trait ne traverse pas les textes) */
    .sc-methode__steps > .sc-methode__step:nth-child(n)::after {
        display: block;
        left: 50%;
        top: calc(100% + 8px);
        width: 0;
        height: 24px; /* interligne 40px : 8px de marge de chaque côté */
        border: 0;
        border-left: var(--sc-line-w) solid var(--sc-line);
        border-radius: 0;
        transform: translateX(-50%);
        opacity: .6;
    }

    .sc-methode__steps > .sc-methode__step:last-child::after {
        display: none;
    }
}



/* ==========================================================
 * CARROUSELS — Cartes hors champ atténuées
 * Classes : carrousel-realisations · carrousel-avis · carrousel-histoire · carrousel-membre
 * Opacité gérée par le snippet JS « Carrousels – cartes visibles »
 * L'opacité est appliquée au contenu de la slide (> *) et non à la slide :
 * Motion pour Elementor écrit opacity:1 en ligne sur .swiper-slide.
 * ========================================================== */

:is(.carrousel-realisations, .carrousel-avis, .carrousel-histoire, .carrousel-membre) .swiper {
  overflow: visible !important;
}

:is(.carrousel-realisations, .carrousel-avis, .carrousel-histoire, .carrousel-membre) .swiper-slide > * {
  opacity: 0.35;
  transition: opacity 0.2s ease;
}

:is(.carrousel-realisations, .carrousel-avis, .carrousel-histoire, .carrousel-membre) .swiper-slide.is-visible > * {
  opacity: 1;
}
/* ==========================================================================
   Filtre de taxonomie (Elementor Pro) en onglets soulignés — classe CSS « sc-filter-tabs »
   Ligne grise continue sous toute la barre, onglet actif souligné en orange.
   Les items sont des <button> : le kit Elementor leur impose fond orange, radius 50px
   et padding, d'où les !important ci-dessous.
   ========================================================================== */
.sc-filter-tabs {
    --e-filter-justify-content: center;
    --e-filter-align-items: flex-end;
    --e-filter-space-between: 40px;
    --e-filter-item-padding: 0; /* valeur simple : Elementor l'injecte dans un calc() pour --e-filter-item-max-width */
    --e-filter-normal-text-color: #6b6b6b;
    --e-filter-hover-text-color: var(--e-global-color-accent, #151414);
    --e-filter-active-text-color: var(--e-global-color-accent, #151414);
    --sc-filter-line: #d9d9d9;
    --sc-filter-active: var(--e-global-color-primary, #EC6608);
}

.sc-filter-tabs .e-filter {
    width: fit-content;               /* la ligne grise ne fait que la largeur des taxonomies */
    max-width: 100%;
    margin-inline: auto;              /* centrée dans la section */
    border-bottom: 1px solid var(--sc-filter-line);
}

.sc-filter-tabs .e-filter button.e-filter-item {
    position: relative;
    margin: 0 !important;
    padding: 0 0 14px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible;
    color: var(--e-filter-normal-text-color);
    font-family: var(--e-global-typography-56de74f-font-family, 'Barlow Condensed'), sans-serif;
    font-size: 15px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: .12em;
    text-transform: uppercase;
    line-height: 1;
    cursor: pointer;
    transition: color .25s ease, border-color .25s ease;
}

/* Soulignement : pseudo-élément de 3px centré sur la ligne grise de 1px
   (1px au-dessus, la ligne, 1px en dessous) => visuellement une seule et même ligne. */
.sc-filter-tabs .e-filter button.e-filter-item::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -2px;
    height: 3px;
    background: transparent;
    transition: background-color .25s ease;
}

.sc-filter-tabs .e-filter button.e-filter-item:hover:not([aria-pressed='true']),
.sc-filter-tabs .e-filter button.e-filter-item:focus-visible:not([aria-pressed='true']) {
    color: var(--e-filter-hover-text-color);
}

.sc-filter-tabs .e-filter button.e-filter-item[aria-pressed='true'],
.sc-filter-tabs .e-filter button.e-filter-item[aria-pressed='true']:hover,
.sc-filter-tabs .e-filter button.e-filter-item[aria-pressed='true']:focus {
    color: var(--e-filter-active-text-color);
    background: transparent !important;
}

.sc-filter-tabs .e-filter button.e-filter-item[aria-pressed='true']::after {
    background: var(--sc-filter-active);
}

/* --- Flèches de défilement (injectées par assets/js/filter-tabs.js) --- */
.sc-filter-tabs__wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.sc-filter-tabs__wrap .e-filter {
    min-width: 0;
}

.sc-filter-tabs .sc-filter-tabs__arrow {
    display: none;                     /* visibles uniquement en tablette/mobile, si ça déborde */
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin: 0 0 8px !important;        /* alignées sur le texte, pas sur la ligne */
    padding: 0 !important;
    background: var(--e-global-color-8c2951a, #fff) !important;
    border: 1px solid var(--sc-filter-line) !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    color: var(--e-global-color-accent, #151414) !important;
    line-height: 1;
    cursor: pointer;
    transition: background-color .25s ease, border-color .25s ease, color .25s ease, opacity .25s ease;
}

.sc-filter-tabs .sc-filter-tabs__arrow svg {
    display: block;
}

.sc-filter-tabs .sc-filter-tabs__arrow--prev svg {
    transform: scaleX(-1);
}

.sc-filter-tabs .sc-filter-tabs__arrow:hover:not(:disabled) {
    background: var(--e-global-color-accent, #151414) !important;
    border-color: var(--e-global-color-accent, #151414) !important;
    color: #fff !important;
}

.sc-filter-tabs .sc-filter-tabs__arrow:disabled {
    opacity: .3;
    cursor: default;
}

@media (max-width: 1024px) {
    .sc-filter-tabs {
        --e-filter-justify-content: flex-start;
        --e-filter-space-between: 28px;
        --e-filter-wrap: nowrap;
        --e-filter-overflow-x: auto;
    }

    .sc-filter-tabs .e-filter {
        scroll-behavior: smooth;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
    }

    .sc-filter-tabs .e-filter button.e-filter-item {
        scroll-snap-align: center;
    }

    .sc-filter-tabs__wrap.is-scrollable .sc-filter-tabs__arrow {
        display: inline-flex;
    }
}

@media (max-width: 767px) {
    .sc-filter-tabs {
        --e-filter-space-between: 24px;
    }

    .sc-filter-tabs .e-filter button.e-filter-item {
        padding-bottom: 12px !important;
    }

    .sc-filter-tabs .sc-filter-tabs__arrow {
        width: 28px;
        height: 28px;
    }
}

/* ==========================================================================
   Single actualité (template Elementor « Single actualité »)
   Classes CSS à poser sur les widgets :
     sc-breadcrumb     → liste d'icônes « Actualités › Titre » (dernier item en gras)
     sc-reading-time   → rendu du shortcode [sc_reading_time]
     sc-toc            → widget Table des matières (numéros orange, sans point)
     sc-post-content   → widget Contenu de l'article (typo H2 / paragraphes / images)
     sc-share          → rangée des icônes de partage ; sc-copy-link sur l'icône « lien »
     carrousel-actus   → carrousel de boucle des autres actualités
   ========================================================================== */

/* --- Fil d'Ariane --- */
.sc-breadcrumb .elementor-icon-list-item:last-child .elementor-icon-list-text {
    font-weight: 700;
}
.sc-breadcrumb .elementor-icon-list-item:last-child {
    min-width: 0;
}
.sc-breadcrumb .elementor-icon-list-item:last-child .elementor-icon-list-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sc-breadcrumb a:hover .elementor-icon-list-text {
    color: var(--e-global-color-primary, #EC6608);
}

/* --- Temps de lecture --- */
.sc-reading-time {
    display: inline-block;
    font-family: 'Barlow', sans-serif;
    font-size: 1rem;
    line-height: 1.2;
    color: #FFFFFF;
}
.sc-reading-time strong {
    font-weight: 700;
    color: var(--e-global-color-primary, #EC6608);
}

/* --- Sommaire (Table des matières Elementor Pro) --- */
.sc-toc ol.elementor-toc__list-wrapper .elementor-toc__list-item-text-wrapper::before {
    content: counter(item);
    font-family: 'Barlow', sans-serif;
    font-size: 1.375rem;
    font-weight: 700;
    font-style: italic;
    line-height: 1;
    letter-spacing: .1em;
    color: var(--e-global-color-primary, #EC6608);
    margin-inline-end: 14px;
    min-width: 14px;
}
.sc-toc .elementor-toc__list-item-text-wrapper {
    align-items: flex-start;
}
.sc-toc .elementor-toc__list-item {
    margin-bottom: 14px;
}
.sc-toc .elementor-toc__list-item:last-child {
    margin-bottom: 0;
}
.sc-toc .elementor-toc__list-item-text {
    display: block;
    line-height: 1.2;
}
.sc-toc .elementor-toc__body {
    padding-top: 10px;
}

/* Liens : jamais soulignés ; l'état actif natif d'Elementor est neutralisé au profit
   de .is-current (posé par single-actu.js sur la section en cours de lecture). */
.elementor-element.elementor-widget.sc-toc.elementor-widget-table-of-contents {
    --item-text-decoration: none;
    --item-text-hover-decoration: none;
    --item-text-active-decoration: none;
    --item-text-hover-color: var(--e-global-color-primary, #EC6608);
    --item-text-active-color: #FFFFFF;
}
.sc-toc .elementor-toc__body .elementor-toc__list-item-text {
    text-decoration: none;
    border-radius: 4px;
    transition: color .2s ease;
}
.sc-toc .elementor-toc__body .elementor-toc__list-item-text.is-current {
    color: var(--e-global-color-primary, #EC6608);
}
.sc-toc .elementor-toc__body .elementor-toc__list-item-text:focus {
    outline: none;
    box-shadow: none;
}
.sc-toc .elementor-toc__body .elementor-toc__list-item-text:focus-visible {
    outline: 2px solid var(--e-global-color-primary, #EC6608);
    outline-offset: 4px;
}

/* --- Contenu de l'article --- */
.sc-post-content {
    font-family: 'Barlow', sans-serif;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--e-global-color-accent, #151414);
    text-align: justify;
}
.sc-post-content p,
.sc-post-content ul,
.sc-post-content ol {
    margin: 0 0 1.25em;
}
.sc-post-content ul,
.sc-post-content ol {
    padding-left: 1.4em;
}
.sc-post-content li { margin-bottom: .4em; }
.sc-post-content a {
    color: var(--e-global-color-primary, #EC6608);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.sc-post-content strong { font-weight: 700; }
.sc-post-content h2,
.sc-post-content h3,
.sc-post-content h4 {
    font-family: 'Barlow', sans-serif;
    font-weight: 700;
    font-style: italic;
    text-transform: uppercase;
    color: var(--e-global-color-accent, #151414);
    text-align: left;
    margin: 2.5rem 0 .75rem;
    scroll-margin-top: 140px;
}
.sc-post-content h2 { font-size: 1.375rem; line-height: 1.3; }
.sc-post-content h3 { font-size: 1.25rem;  line-height: 1.3; }
.sc-post-content h4 { font-size: 1.125rem; line-height: 1.3; }
.sc-post-content > :first-child { margin-top: 0; }
.sc-post-content img,
.sc-post-content figure,
.sc-post-content .wp-block-image {
    max-width: 100%;
    height: auto;
}
.sc-post-content figure,
.sc-post-content .wp-block-image,
.sc-post-content p > img:only-child {
    margin: 2.5rem 0;
}
.sc-post-content img {
    display: block;
    width: 100%;
    border-radius: 20px 0 20px 0;
    object-fit: cover;
}
.sc-post-content figcaption {
    margin-top: .5rem;
    font-size: .875rem;
    color: #6b6b6b;
    text-align: left;
}
.sc-post-content blockquote {
    margin: 2rem 0;
    padding: 1rem 0 1rem 1.5rem;
    border-left: 3px solid var(--e-global-color-primary, #EC6608);
    font-style: italic;
    text-align: left;
}

/* --- Partage --- */
.sc-share .elementor-icon {
    transition: transform .25s ease, filter .25s ease;
}
.sc-share .elementor-icon:hover {
    transform: translateY(-3px);
    filter: brightness(1.15);
}
.sc-copy-toast {
    position: fixed;
    left: 50%;
    bottom: 32px;
    z-index: 9999;
    transform: translate(-50%, 20px);
    padding: 12px 22px;
    border-radius: 999px;
    background: var(--e-global-color-accent, #151414);
    color: #fff;
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
    opacity: 0;
    pointer-events: none;
    transition: opacity .25s ease, transform .25s ease;
}
.sc-copy-toast.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
}

/* --- Carrousel des autres actualités (cartes hors champ atténuées, cf. snippet « Carrousels – cartes visibles ») --- */
.carrousel-actus .swiper {
    overflow: visible !important;
}
.carrousel-actus .swiper-slide {
    opacity: 0.35;
    transition: opacity 0.2s ease;
}
.carrousel-actus .swiper-slide.is-visible {
    opacity: 1;
}
/* Sticky Elementor : le « spacer » est un clone de la sidebar (visibility:hidden) mais ses enfants
   portent un visibility:visible inline posé par motion-elementor → le clone réapparaissait en double. */
.elementor-sticky__spacer,
.elementor-sticky__spacer * {
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Pattern décoratif placé DERRIÈRE le contenu (points du bas de l'article : passent sous l'image / le sommaire) */
.bg-image.sc-bg-behind {
    z-index: -1;
}

/* Tant qu'il n'y a qu'une seule autre actualité, la carte garde la largeur d'une carte sur deux */
@media (min-width: 1025px) {
    .carrousel-actus .swiper-slide { max-width: calc(50% - 20px); }
}

@media (max-width: 767px) {
    .sc-post-content { text-align: left; }
    .sc-post-content h2,
    .sc-post-content h3,
    .sc-post-content h4 { margin-top: 2rem; }
}

/* Chevron du fil d'Ariane : SVG « vers le bas » dans la médiathèque, tourné vers la droite */
.sc-breadcrumb .elementor-icon-list-icon svg {
    transform: rotate(-90deg);
}
.sc-breadcrumb .elementor-icon-list-items {
    flex-wrap: nowrap;
    max-width: 100%;
}

/* =========================================================
   Single offre d'emploi (template Elementor « Offre d'emploi »)
   ========================================================= */
/* Texte des champs ACF (missions, profil, avantages) */
.sc-offer-text {
    font-family: 'Barlow', sans-serif;
    font-size: 1rem;
    line-height: 1.5;
    color: #151414;
}
.sc-offer-text p { margin: 0 0 0.75rem; }
.sc-offer-text p:last-child,
.sc-offer-text ul:last-child,
.sc-offer-text ol:last-child { margin-bottom: 0; }
.sc-offer-text ul,
.sc-offer-text ol {
    margin: 0 0 0.75rem;
    padding-left: 1.25rem;
}
.sc-offer-text ul { list-style: disc; }
.sc-offer-text li { margin-bottom: 0.25rem; }
.sc-offer-text li::marker { color: #EC6608; }
.sc-offer-text strong { font-weight: 700; }
.sc-offer-text a { color: #EC6608; text-decoration: underline; }

/* Localisation dans le hero : icône épingle + « Agence de … » */
.sc-offer-location .elementor-icon-list-icon svg { width: 18px; height: 22px; }

/* ==========================================================
 * FILTRE — Agences (équipe)
 * Shortcode [sc_filtre_agences] (inc/filtre-membres.php) relié au carrousel
 * de boucle qui le suit — JS : assets/js/filtre-membres.js
 * Les !important neutralisent le style global des boutons du kit Elementor
 * ========================================================== */
.filtre-agences {
    display: flex;
    justify-content: center;
    width: fit-content;
    max-width: 100%;
    margin-inline: auto;
}
.filtre-agence {
    display: inline-flex;
    align-items: center;
    height: 2.375rem;
    margin: 0 !important;
    padding: 0.625rem 0.875rem 0.625rem 1.25rem !important;
    background: none !important;
    border: 0 !important;
    border-bottom: 2px solid #999999 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 0.96em;
    letter-spacing: 0.17em;
    text-transform: uppercase;
    white-space: nowrap;
    color: #999999 !important;
    cursor: pointer;
    transition: color 0.2s ease, border-color 0.2s ease;
}
.filtre-agence:hover,
.filtre-agence.is-active { color: #151414 !important; }
.filtre-agence.is-active { border-bottom-color: #EC6608 !important; }
@media (max-width: 1024px) {
    .filtre-agence { font-size: 1rem; }
}
@media (max-width: 767px) {
    /* Les agences défilent horizontalement au doigt */
    .filtre-agences {
        justify-content: flex-start;
        overflow-x: auto;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .filtre-agences::-webkit-scrollbar { display: none; }
    .filtre-agence {
        font-size: 0.875rem;
        padding: 0.625rem 0.75rem !important;
    }
}
/* ==========================================================
 * PLAN DU SITE — shortcode [sc_plan_du_site] (inc/plan-du-site.php)
 * ========================================================== */
.sc-sitemap {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 48px 40px;
    font-family: 'Barlow', sans-serif;
    color: #151414;
}
.sc-sitemap__group--agences,
.sc-sitemap__group--realisations { grid-column: 1 / -1; }
.sc-sitemap__list--realisations {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px 40px;
}
.sc-sitemap__list--realisations > li:first-child { grid-column: 1 / -1; }
.sc-sitemap .sc-sitemap__list--realisations li.sc-sitemap__sub { margin-top: 0.4rem; }
.sc-sitemap__title {
    margin: 0 0 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #EC6608;
    font-family: 'Barlow', sans-serif;
    font-size: 1.375rem;
    font-weight: 700;
    font-style: italic;
    line-height: 1.2em;
    text-transform: uppercase;
    color: #151414;
}
.sc-sitemap ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.sc-sitemap ul ul {
    margin: 0.35rem 0 0.75rem;
    padding-left: 1.1rem;
    border-left: 1px solid rgba(21, 20, 20, 0.12);
}
.sc-sitemap li {
    position: relative;
    margin: 0 0 0.45rem;
    padding-left: 1.1rem;
    font-size: 1rem;
    line-height: 1.5;
}
.sc-sitemap li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.6em;
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 50%;
    background: #EC6608;
}
.sc-sitemap ul ul li::before { width: 0.3rem; height: 0.3rem; background: #999999; }
.sc-sitemap li.sc-sitemap__sub::before { display: none; }
.sc-sitemap li.sc-sitemap__sub { padding-left: 0; margin-top: 0.9rem; }
.sc-sitemap__subtitle {
    display: block;
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #EC6608;
}
.sc-sitemap a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}
.sc-sitemap a:hover { color: #EC6608; }
.sc-sitemap__meta { font-size: 0.875rem; color: #6b6b6b; }
/* Titre de la réalisation dans la visionneuse ouverte depuis une URL (?galerie=slug) */
.acf-galerie-overlay .acf-galerie-title {
    margin: 0 0 0.75rem !important;
    padding: 0 3.5rem;
    font-family: 'Barlow Condensed', 'Barlow', sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-align: center;
    color: #fff;
}
.sc-sitemap__agences {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 32px 40px;
}
.sc-sitemap__agence-title {
    margin: 0 0 0.75rem;
    font-family: 'Barlow Condensed', sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #151414;
}
.sc-sitemap__agence--private .sc-sitemap__agence-title::after {
    content: ' (privée)';
    font-size: 0.8em;
    color: #999999;
    letter-spacing: 0;
}
@media (max-width: 1024px) {
    .sc-sitemap { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 32px; }
    .sc-sitemap__list--realisations { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .sc-sitemap { grid-template-columns: 1fr; gap: 32px; }
    .sc-sitemap__list--realisations { grid-template-columns: 1fr; }
    .sc-sitemap__title { font-size: 1.25rem; }
    .sc-sitemap li { font-size: 0.9375rem; }
}

.filtre-agences__empty {
    margin: 20px 0 0;
    text-align: center;
    font-family: 'Barlow', sans-serif;
    font-size: 1rem;
    color: #6b6b6b;
}
.elementor-widget-loop-carousel.sc-filter-empty .elementor-swiper-button,
.elementor-widget-loop-carousel.sc-filter-fits .elementor-swiper-button,
.elementor-widget-loop-carousel.sc-filter-fits .swiper-pagination { display: none; }
.elementor-widget.sc-offer-location .elementor-icon-list-item .elementor-icon-list-text a { display: inline; color: inherit; text-decoration: none; }
.elementor-widget.sc-offer-location .elementor-icon-list-item .elementor-icon-list-text a:hover { color: #EC6608; }

@media (max-width: 767px) {
    .sc-offer-text { text-align: left; }
}




/* ==========================================================
 * ARTICLE — Images et fin de contenu
 * ========================================================== */

/* Images du contenu : plus d'espace fantôme sous l'image */
.sc-post-content img {
    display: block;
    max-width: 100%;
    height: auto;
}

/* Blocs image : marge maîtrisée entre les éléments */
.sc-post-content figure,
.sc-post-content .wp-block-image {
    margin: 2rem 0;
}

/* Aucun espace après le dernier élément de l'article */
.sc-post-content > *:last-child {
    margin-bottom: 0 !important;
}



/* ==========================================================
 * HEADER — Logo calé sur le bord gauche du header
 * ========================================================== */

.elementor-location-header.elementor-58 .elementor-element.elementor-element-a63702c {
    text-align: left;
}




/* ==========================================================
 * HEADER — Menu principal toujours sur une ligne
 * ==========================================================
 * Entre 1025px (passage au burger) et 1440px, les espacements
 * du header se resserrent progressivement pour que le menu et
 * le bouton « Nous contacter » tiennent sur une seule ligne.
 * ========================================================== */

@media (min-width: 1025px) {
    .elementor-location-header .elementor-nav-menu--main > .elementor-nav-menu {
        flex-wrap: nowrap;
    }

    .elementor-location-header .elementor-nav-menu--main .elementor-item {
        white-space: nowrap;
    }

    .elementor-location-header.elementor-58 .elementor-element.elementor-element-adf72eb {
        --padding-left: clamp(24px, calc(24px + (100vw - 1025px) * 0.1349), 80px);
        --padding-right: clamp(24px, calc(24px + (100vw - 1025px) * 0.1349), 80px);
    }

    .elementor-location-header.elementor-58 .elementor-element.elementor-element-0f71508 {
        --gap: clamp(12px, calc(12px + (100vw - 1025px) * 0.0193), 20px);
        --column-gap: clamp(12px, calc(12px + (100vw - 1025px) * 0.0193), 20px);
    }

    .elementor-location-header.elementor-58 .elementor-element.elementor-element-e1472ae .elementor-nav-menu--main .elementor-item {
        padding-left: clamp(7px, calc(7px + (100vw - 1025px) * 0.012), 12px);
        padding-right: clamp(7px, calc(7px + (100vw - 1025px) * 0.012), 12px);
        font-size: clamp(15px, calc(15px + (100vw - 1025px) * 0.0024), 16px);
    }

    .elementor-location-header.elementor-58 .elementor-element.elementor-element-e1472ae .elementor-nav-menu--main .sub-arrow {
        padding-left: clamp(4px, calc(4px + (100vw - 1025px) * 0.0145), 10px);
    }

    .elementor-location-header.elementor-58 .elementor-element.elementor-element-07640ac .elementor-button {
        white-space: nowrap;
        padding-left: clamp(16px, calc(16px + (100vw - 1025px) * 0.0193), 24px);
        padding-right: clamp(16px, calc(16px + (100vw - 1025px) * 0.0193), 24px);
        letter-spacing: clamp(1px, calc(1px + (100vw - 1025px) * 0.0041), 2.72px);
    }
}