/* ANC Core — Front
   Charte ANC Systèmes : navy + accent vert. Toutes les classes préfixées .anc-
   pour zéro collision avec Salient/WPBakery. */

/* Tweaks thème Salient (overrides ciblés) */
.default-logo { border-radius: 5px; }

:root {
    --anc-navy:  #24356c;
    --anc-blue:  #1562a6;
    --anc-teal:  #14809e;
    --anc-green: #419577;
    --anc-yellow:#f5b21a;
    --anc-ink:   #1a1d29;
    --anc-muted: #5c6270;
    --anc-line:  #e3e6ee;
    --anc-soft:  #f4f6fb;
    --anc-radius: 6px;
}

.anc-service { display: flex; flex-direction: column; gap: clamp(40px, 6vw, 88px); }
.anc-module { width: 100%; }

/* ============================================================================
 * Hero banner du single service (badge rubrique + titre + intro + CTA)
 * ========================================================================== */

/* On masque le doublon du thème Salient (titre + entête de page + image à la une) :
   le hero remplace tout ça, et on supprime l'espace au-dessus. */
.single-service .entry-title,
.single-service .heading-title,
.single-service .post-featured-img { display: none !important; }
.single-service .container-wrap { padding-top: 0 !important; }
/* Bandeau « Article suivant / précédent » de Salient en bas du single : retiré. */
.single-service .blog_next_prev_buttons { display: none !important; }

/* Élargit le wrapper de contenu des single service au-delà du max_container_width
   (1550px) de Salient. On scope au conteneur de CONTENU (.main-content) — surtout
   pas au .container global, partagé par le header/top bar/footer. */
.single-service .container.main-content { max-width: min(1700px, 94vw) !important; }
.single-service .main-content .post-area { max-width: none !important; width: 100% !important; }

.anc-service-hero {
    /* Fond full-width mais CONTENU aligné sur le conteneur (= les modules en dessous).
       margin négatif -> le fond déborde jusqu'aux bords ; padding égal -> le contenu revient. */
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-left: calc(50vw - 50%);
    padding-right: calc(50vw - 50%);
    /* top large : le header transparent Salient passe par-dessus, le contenu doit le dégager */
    padding-top: clamp(120px, 13vw, 140px);
    padding-bottom: 20px;
    margin-bottom: clamp(56px, 7vw, 100px);  /* place pour le chevauchement */
    border-radius: 0;
    /* Indigo du top bar (#2b306b) opacifié sur l'image de présentation (texture). */
    background-color: #2b306b;
    background-image: linear-gradient(rgba(43,48,107,.9), rgba(43,48,107,.9)), var(--anc-hero-bg, none);
    background-size: cover;
    background-position: center;
}
/* [anc_hero] hors single CPT (pages fixes) : le conteneur de page (~1550px) est
   plus étroit que le wrapper élargi du single (min(1700px,94vw)). On force ici la
   largeur de contenu à l'identique, indépendamment du conteneur de page —
   le contenu revient à un bloc centré de min(1700px,94vw) dans le viewport. */
.anc-service-hero--standalone {
    /* +70px par côté = padding interne du conteneur Salient sur le single,
       pour que le contenu standalone tombe pile à la même largeur. */
    padding-left: calc(50vw - min(850px, 47vw) + 70px);
    padding-right: calc(50vw - min(850px, 47vw) + 70px);
}
/* Hero in-page (2e hero sur une page, ex. #tinymdm) : pas de header transparent
   à dégager au-dessus -> padding-top de section normal au lieu du grand offset. */
.anc-service-hero--compact { padding-top: clamp(72px, 8vw, 110px); }
/* Hero sans image (ex. page contact) : pas de colonne média -> contenu pleine largeur. */
.anc-service-hero--nomedia .anc-service-hero__inner { display: block; }
.anc-service-hero__inner {
    /* aligné sur le conteneur de contenu (pas de max-width/centrage propre).
       Colonne image capée (pas 50%) + texte qui prend le reste -> banner large/plat. */
    display: grid;
    grid-template-columns: clamp(300px, 32vw, 470px) 1fr;
    align-items: center;
    gap: clamp(32px, 5vw, 80px);
}
/* Image carrée (1:1), couverte (cover) -> taille uniforme quel que soit le format ;
   alignée en bas et débordant légèrement -> chevauchement avec la suite. */
.anc-service-hero__media {
    aspect-ratio: 1 / 1;
    align-self: end;
    margin-bottom: clamp(-64px, -4vw, -36px);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 24px 50px rgba(0,0,0,.35);
}
.anc-service-hero__media img,
.anc-service-hero__img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block;
    border-radius: 0;
}
.anc-service-hero__badge {
    display: inline-block;
    background: #9f2a23;                   /* rouge plein = bouton « Prendre contact » home */
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    padding: 7px 18px;
    border-radius: 999px;
    margin-bottom: 18px;
}
.anc-service-hero__title {
    color: #fff;
    font-size: clamp(28px, 4vw, 48px);
    font-weight: 800;
    line-height: 1.1;
    margin: 0 0 .5em;
}
.anc-service-hero__intro {
    color: rgba(255,255,255,.92);
    font-size: clamp(15px, 1.3vw, 17px);
    line-height: 1.7;
    margin: 0 0 1.6em;
}
/* CTA jaune mais texte blanc (override ciblé, ne touche pas les boutons du hero home). */
.anc-service-hero__cta,
.anc-service-hero__cta:hover { color: #fff !important; text-decoration: none !important; }
.anc-service-hero__cta .anc-service-hero__arrow { transition: transform .2s; }
.anc-service-hero__cta:hover .anc-service-hero__arrow { transform: translateX(4px); }
/* Conteneur des boutons hero : 1 ou 2 CTA alignés (wrap sur petit écran). */
.anc-service-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }

@media (max-width: 860px) {
    /* + d'air sous le hero (avant : l'image carrée débordait, padding-bottom:0) */
    .anc-service-hero { padding-bottom: clamp(40px, 7vw, 72px); }
    .anc-service-hero__inner { grid-template-columns: 1fr; }
    /* Tablette : photo en paysage pleine largeur (au lieu du carré capé à 360px) */
    .anc-service-hero__media {
        order: -1;
        align-self: auto;
        max-width: none;
        width: 100%;
        aspect-ratio: 16 / 9;
        margin-bottom: clamp(24px, 4vw, 36px);
    }
}

/* ---- Image + Texte ---- */
/* Module Image + Texte — image pleine moitié (bord à bord) + texte sur fond couleur,
   façon sections de la home. 2 variantes de fond (gris clair / bleu) + CTA flèche. */
.anc-it {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;            /* image et texte à la même hauteur */
    overflow: hidden;
    border-radius: var(--anc-radius);
}
.anc-it.is-right { direction: rtl; }
.anc-it.is-right > * { direction: ltr; }
.anc-it__media { position: relative; min-height: 240px; }
.anc-it__media img,
.anc-it__img {
    position: absolute; inset: 0;
    width: 100% !important; height: 100% !important;
    object-fit: cover !important; display: block;
}
.anc-it__body {
    padding: clamp(28px, 4vw, 60px);
    display: flex; flex-direction: column; justify-content: center;
}
.anc-it__title { font-size: clamp(22px, 2.6vw, 32px); font-weight: 800; margin: 0 0 .6em; line-height: 1.15; }
.anc-it__text { font-size: 16px; line-height: 1.7; }
.anc-it__text p { margin: 0 0 1em; }
.anc-it__text :last-child { margin-bottom: 0; }

/* Variantes de fond */
.anc-it--light .anc-it__body { background: #e9e9e9; color: var(--anc-ink); }
.anc-it--light .anc-it__title { color: var(--anc-navy); }
.anc-it--blue  .anc-it__body { background: var(--anc-navy); color: rgba(255,255,255,.92); }
.anc-it--blue  .anc-it__title { color: #fff; }

/* CTA flèche (le trait s'allonge + pointe au survol ; suit la couleur de la variante) */
.anc-it__cta {
    align-self: flex-start;
    margin-top: clamp(18px, 2.5vw, 30px);
    display: inline-flex; align-items: center; gap: 14px;
    font-weight: 700; font-size: 16px;
    color: inherit !important; text-decoration: none !important;
}
.anc-it__cta-arrow {
    position: relative; flex: 0 0 auto;
    width: 26px; height: 2px; background: currentColor;
    transition: width .25s ease;
}
.anc-it__cta-arrow::after {
    content: ""; position: absolute; right: 0; top: 50%;
    width: 7px; height: 7px;
    border-top: 2px solid currentColor; border-right: 2px solid currentColor;
    transform: translateY(-50%) rotate(45deg);
    opacity: 0; transition: opacity .25s ease;
}
.anc-it__cta:hover .anc-it__cta-arrow { width: 42px; }
.anc-it__cta:hover .anc-it__cta-arrow::after { opacity: 1; }

@media (max-width: 781px) {
    .anc-it { grid-template-columns: 1fr; }
    .anc-it.is-right { direction: ltr; }
    .anc-it__media { min-height: 0; aspect-ratio: 16 / 10; }
}

/* Module Blocs en colonnes (image/picto + titre + texte) */
.anc-cols__title {
    text-align: center; color: var(--anc-navy);
    font-size: clamp(24px, 3vw, 34px); font-weight: 800; line-height: 1.15;
    margin: 0 0 clamp(24px, 3vw, 44px);
}
.anc-cols__grid {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: clamp(24px, 3vw, 48px);
}
/* Card structurée : fond blanc, bordure, coins arrondis, ombre légère.
   L'image coiffe la card en pleine largeur, le texte est en dessous (padding). */
.anc-col {
    display: flex; flex-direction: column;
    text-align: center;
    background: #fff;
    border: 1px solid var(--anc-line, #e6e8ef);
    border-radius: var(--anc-radius, 12px);
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(0,0,0,.06);
}
.anc-col__media { line-height: 0; }
/* Format d'image TOUJOURS identique quelle que soit l'image source (recadrage). */
.anc-col__media img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
    border-radius: 0;
}
.anc-col__title { color: var(--anc-navy); font-size: clamp(18px, 1.6vw, 21px); font-weight: 700; line-height: 1.2; margin: 18px 18px 6px; }
.anc-col__title:last-child { margin-bottom: 20px; }
.anc-col__text  { color: var(--anc-ink); font-size: 15px; line-height: 1.6; margin: 0 18px 20px; }
@media (max-width: 960px) { .anc-cols__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .anc-cols__grid { grid-template-columns: 1fr; } }

/* ---- Texte ---- */
.anc-text.is-normal { max-width: 760px; margin-inline: auto; }
.anc-text__title { color: var(--anc-navy); font-size: clamp(22px, 2.6vw, 32px); margin: 0 0 .5em; }
.anc-text__body { color: var(--anc-ink); font-size: 16px; line-height: 1.7; }
.anc-text__body p { margin: 0 0 1em; }

/* ---- FAQ ---- */
.anc-faq { max-width: 820px; margin-inline: auto; }
.anc-faq__title { color: var(--anc-navy); font-size: clamp(20px, 2.4vw, 28px); margin: 0 0 1rem; }
.anc-faq__item { border-bottom: 1px solid var(--anc-line); }
.anc-faq__q {
    cursor: pointer; list-style: none; padding: 16px 32px 16px 0; position: relative;
    font-weight: 600; color: var(--anc-navy); font-size: 17px;
}
.anc-faq__q::-webkit-details-marker { display: none; }
.anc-faq__q::after {
    content: "+"; position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
    font-size: 22px; color: var(--anc-navy); transition: transform .2s;
}
.anc-faq__item[open] .anc-faq__q::after { content: "−"; }
.anc-faq__a { padding: 0 0 16px; color: var(--anc-muted); line-height: 1.7; }

/* ---- Galerie ---- */
/* Galerie : carousel horizontal d'images au format uniforme (clic -> lightbox). */
.anc-gallery {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 4px 0 8px;
}
.anc-gallery::-webkit-scrollbar { display: none; }
.anc-gallery__tile {
    flex: 0 0 auto;
    width: clamp(220px, 30vw, 340px);
    aspect-ratio: 4 / 3;
    margin: 0;
    overflow: hidden;
    border-radius: 12px;
    scroll-snap-align: start;
    cursor: zoom-in;
    display: block;
    box-shadow: 0 8px 24px rgba(0,0,0,.10);
}
.anc-gallery__tile img { width: 100% !important; height: 100% !important; object-fit: cover; display: block; transition: transform .45s; }
.anc-gallery__tile:hover img { transform: scale(1.06); }

/* Flèches du carousel galerie (injectées par le JS) */
.anc-gallery-wrap { position: relative; }
.anc-gallery-nav {
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 40px; height: 40px; border: 0; border-radius: 50%;
    background: #fff; color: var(--anc-navy); box-shadow: 0 4px 14px rgba(0,0,0,.2);
    font-size: 22px; line-height: 1; cursor: pointer; z-index: 3;
    display: flex; align-items: center; justify-content: center;
}
.anc-gallery-nav.is-prev { left: -8px; }
.anc-gallery-nav.is-next { right: -8px; }
.anc-gallery-nav[hidden] { display: none; }

/* Logos partenaires : marquee défilant, logos gris -> couleur au survol. */
.anc-clients__title { text-align: center; color: var(--anc-navy); font-size: clamp(22px,2.6vw,30px); font-weight: 800; margin: 0 0 clamp(20px,3vw,36px); }
.anc-clients__grid { overflow: hidden; width: 100%; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.anc-clients__track { display: flex; align-items: center; gap: clamp(40px, 6vw, 90px); width: max-content; animation: anc-marquee 32s linear infinite; }
.anc-clients__grid:hover .anc-clients__track { animation-play-state: paused; }
@keyframes anc-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.anc-clients__tile { flex: 0 0 auto; display: flex; align-items: center; }
.anc-clients__tile img {
    max-height: 64px; width: auto !important; height: auto !important; display: block;
    filter: grayscale(1); opacity: .6; transition: filter .3s, opacity .3s;
}
.anc-clients__tile:hover img { filter: grayscale(0); opacity: 1; }
@media (prefers-reduced-motion: reduce) { .anc-clients__track { animation: none; } }

/* Lightbox (galerie) */
.anc-lightbox {
    position: fixed; inset: 0; z-index: 1000060;
    display: flex; align-items: center; justify-content: center;
    background: rgba(10,12,24,.92);
}
.anc-lightbox[hidden] { display: none; }
.anc-lightbox__img { max-width: 90vw; max-height: 86vh; border-radius: 8px; box-shadow: 0 20px 60px rgba(0,0,0,.5); }
.anc-lightbox__btn {
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 52px; height: 52px; border: 0; border-radius: 50%;
    background: rgba(255,255,255,.12); color: #fff; font-size: 30px; line-height: 1; cursor: pointer;
}
.anc-lightbox__btn:hover { background: rgba(255,255,255,.25); }
.anc-lightbox__btn.is-prev { left: 3vw; }
.anc-lightbox__btn.is-next { right: 3vw; }
.anc-lightbox__close { position: absolute; top: 20px; right: 24px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255,255,255,.12); color: #fff; font-size: 26px; cursor: pointer; }
.anc-lightbox__close:hover { background: rgba(255,255,255,.25); }

/* ---- CTA ---- */
.anc-cta { text-align: center; padding: clamp(32px, 5vw, 64px); border-radius: var(--anc-radius); }
/* Variantes de fond : bleu (navy), jaune, bordeaux */
.anc-cta.is-primary  { background: var(--anc-navy); }
.anc-cta.is-yellow   { background: #dbab2f; }
.anc-cta.is-bordeaux { background: #9f2a23; }
.anc-cta__title { color: #fff; font-size: clamp(22px, 3vw, 34px); margin: 0 0 .4em; }
.anc-cta__text  { color: rgba(255,255,255,.88); font-size: 17px; margin: 0 0 1.5em; }
.anc-cta__btn {
    display: inline-block; background: #fff; color: var(--anc-navy);
    padding: 14px 30px; border-radius: var(--anc-radius); font-weight: 600; text-decoration: none;
    transition: transform .15s, box-shadow .15s;
}
.anc-cta__btn:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0,0,0,.18); }
/* Bordeaux : bouton blanc à texte bordeaux */
.anc-cta.is-bordeaux .anc-cta__btn { color: #9f2a23; }
/* Jaune : texte foncé (contraste) + bouton navy à texte blanc */
.anc-cta.is-yellow .anc-cta__title { color: var(--anc-navy); }
.anc-cta.is-yellow .anc-cta__text  { color: rgba(26,29,41,.85); }
.anc-cta.is-yellow .anc-cta__btn   { background: var(--anc-navy); color: #fff; }

/* ---- Hero carousel ---- */
.anc-hero { position: relative; overflow: hidden; border-radius: var(--anc-radius); }
.anc-hero__track { display: flex; transition: transform .55s cubic-bezier(.22,.61,.36,1); }
.anc-hero__slide {
    position: relative; flex: 0 0 100%; display: block; text-decoration: none;
    aspect-ratio: 21 / 9; background: var(--anc-navy);
}
.anc-hero__media { position: absolute; inset: 0; }
.anc-hero__media img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.anc-hero__slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(36,53,108,.85) 0%, rgba(36,53,108,0) 60%); }
/* Card par slide : titre + mini-texte + CTA (l'image n'est plus cliquable) */
.anc-hero__card {
    position: absolute; z-index: 2;
    right: clamp(20px, 5vw, 80px);
    top: 50%; transform: translateY(-50%);
    width: min(380px, 80%);
    /* Voile bleu opacifié par-dessus l'image de présentation du service (--card-bg). */
    background-image: linear-gradient(rgba(36,53,108,.82), rgba(36,53,108,.82)), var(--card-bg, none);
    background-size: cover;
    background-position: center;
    border-radius: 0;
    padding: 26px 28px;
    box-shadow: 0 12px 34px rgba(0,0,0,.28);
    display: flex; flex-direction: column; gap: 14px;
}
.anc-hero__card-title { margin: 0; color: #fff; font-size: clamp(20px, 2.4vw, 28px); font-weight: 700; line-height: 1.15; }
.anc-hero__card-text  { margin: 0; color: rgba(255,255,255,.88); font-size: 15px; line-height: 1.5; }
/* CTA "flèche" : lien transparent, trait horizontal à gauche qui s'allonge
   et se dote d'une pointe (->) au survol. */
.anc-hero__card-cta,
.anc-hero__card-cta:link,
.anc-hero__card-cta:visited,
.anc-hero__card-cta:hover,
.anc-hero__card-cta:focus {
    color: #fff !important;
    text-decoration: none !important;
}
.anc-hero__card-cta   {
    align-self: flex-start;
    display: inline-flex; align-items: center; gap: 14px;
    background: none;
    padding: 6px 0;
    font-size: 16px;
    box-shadow: none;
}
.anc-hero__card-cta:hover { background: none; transform: none; box-shadow: none; }
/* Le trait (devient flèche au hover via ::after). */
.anc-hero__card-cta-arrow {
    position: relative; flex: 0 0 auto;
    width: 26px; height: 2px;
    background: currentColor;
    transition: width .25s ease;
}
.anc-hero__card-cta-arrow::after {
    content: ""; position: absolute; right: 0; top: 50%;
    width: 7px; height: 7px;
    border-top: 2px solid currentColor; border-right: 2px solid currentColor;
    transform: translateY(-50%) rotate(45deg);
    opacity: 0; transition: opacity .25s ease;
}
.anc-hero__card-cta:hover .anc-hero__card-cta-arrow { width: 42px; }
.anc-hero__card-cta:hover .anc-hero__card-cta-arrow::after { opacity: 1; }

/* Mosaïque de carrés bleus — slide d'intro, occupe l'emplacement de la card. */
.anc-hero__mosaic {
    position: absolute; z-index: 2;
    right: clamp(20px, 5vw, 80px);
    top: 50%; transform: translateY(-50%);
    width: min(380px, 80%);
    height: var(--anc-card-h, 260px);   /* même boîte que les cards */
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 14px;
}
.anc-hero__mosaic span {
    background: var(--anc-blue);
    border-radius: 0;
    box-shadow: 0 6px 18px rgba(0,0,0,.22);
}
/* Variation de teinte/opacité pour l'effet mosaïque. */
.anc-hero__mosaic span:nth-child(2) { background: var(--anc-navy); }
.anc-hero__mosaic span:nth-child(3) { background: rgba(21,98,166,.6); }
.anc-hero__mosaic span:nth-child(4) { background: rgba(36,53,108,.7); }
.anc-hero__mosaic span:nth-child(5) { background: var(--anc-blue); }
.anc-hero__mosaic span:nth-child(6) { background: rgba(21,98,166,.45); }
.anc-hero__mosaic span:nth-child(7) { background: rgba(36,53,108,.85); }
.anc-hero__mosaic span:nth-child(8) { background: rgba(21,98,166,.75); }
.anc-hero__mosaic span:nth-child(9) { background: var(--anc-navy); }

/* Variante image unique : remplace la grille de 9 carrés par un seul PNG. */
.anc-hero__mosaic--img { display: block; height: auto; gap: 0; box-shadow: none; }
.anc-hero__mosaic--img img { width: 100%; height: auto; display: block; }
.anc-hero-home .anc-hero__mosaic--img { height: auto; }

/* Titre au-dessus des cards */
.anc-hero__heading {
    position: absolute; z-index: 3; margin: 0;
    color: #fff; font-weight: 700; line-height: 1.15;
    font-size: clamp(20px, 2.2vw, 28px);
    left: clamp(20px, 4vw, 48px); top: clamp(16px, 4vh, 40px);
}
.anc-hero__nav {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
    width: 46px; height: 46px; border: 0; border-radius: 50%; cursor: pointer;
    background: rgba(255,255,255,.85); color: var(--anc-navy); font-size: 26px; line-height: 1;
}
.anc-hero__nav.is-prev { left: 16px; } .anc-hero__nav.is-next { right: 16px; }
.anc-hero__nav:hover { background: #fff; }
.anc-hero__dots { position: absolute; bottom: 16px; right: 20px; z-index: 3; display: flex; gap: 7px; }
.anc-hero__dots button { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.5); cursor: pointer; }
.anc-hero__dots button.is-active { background: #fff; }

/* ---- Popup ---- */
.anc-popup { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; }
.anc-popup[hidden] { display: none; }
.anc-popup__overlay { position: absolute; inset: 0; background: rgba(26,29,41,.6); }
.anc-popup__box {
    position: relative; z-index: 1; width: clamp(320px, 70vw, 1200px); min-height: 70vh;
    display: flex; overflow: hidden;
    background: #fff; border-radius: var(--anc-radius);
    box-shadow: 0 24px 60px rgba(0,0,0,.3);
    animation: anc-pop .3s ease;
}
@keyframes anc-pop { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.anc-popup__close {
    position: absolute; top: 12px; right: 14px; z-index: 2; border: 0; background: transparent;
    font-size: 26px; line-height: 1; color: var(--anc-navy); cursor: pointer;
}
.anc-popup__close:hover { color: #9f2a23; }
/* Colonne gauche : marque (logo + nom + accroche) sur fond bleu dégradé. */
.anc-popup__aside {
    flex: 0 0 30%; min-width: 0;
    background: url(/wp-content/uploads/2026/06/logo-new-white-rotate-scaled.png) 76% 1% / auto 49% no-repeat,
                linear-gradient(160deg, var(--anc-navy), var(--anc-blue));
    color: #fff; padding: 40px 30px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; gap: 18px;
}
.anc-popup__logo  {
    width: 180px; max-width: 80%; height: auto; object-fit: contain;
    background: #fff; padding: 14px 18px; border-radius: 10px;
    box-shadow: 0 6px 18px rgba(0,0,0,.18);
}
.anc-popup__brand { font-size: 22px; font-weight: 800; line-height: 1.15; letter-spacing: .3px; }
.anc-popup__kicker {
    font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: 1.6px;
    color: #fff;
}
/* Colonne droite : contenu éditorial renseigné dans le drawer. */
.anc-popup__main {
    flex: 1; min-width: 0; padding: 44px 38px;
    display: flex; flex-direction: column; justify-content: center;
}
.anc-popup__title { color: var(--anc-navy); font-size: 26px; margin: 0 0 14px; }
.anc-popup__content { color: var(--anc-ink); line-height: 1.65; }
.anc-popup__content img { max-width: 100%; height: auto; border-radius: var(--anc-radius); }
/* Boutons de la popup (répéteur) : rouge bordeaux + pilule. */
.anc-popup__actions {
    display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px;
}
.anc-popup__btn {
    display: inline-block; background: #9f2a23; color: #fff;
    padding: 13px 28px; border-radius: 999px; font-weight: 700; text-decoration: none;
}
.anc-popup__btn:hover { background: #87231d; color: #fff; }
@media (max-width: 560px) {
    .anc-popup__box { flex-direction: column; min-height: 0; }
    .anc-popup__aside { flex-basis: auto; padding: 28px 26px; }
    .anc-popup__main  { padding: 30px 26px; }
}

/* Bandeau bas d'écran : point d'entrée de la popup (bouton « Voir » -> grand format). */
.anc-popup-bandeau {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 99998;
    display: flex; align-items: center; gap: 18px;
    padding: 22px clamp(16px, 4vw, 40px); min-height: 84px;
    background: url(/wp-content/uploads/2026/06/logo-new-white-rotate-scaled.png) -9% 29% / auto 245% no-repeat,
                linear-gradient(90deg, var(--anc-navy) 0%, var(--anc-blue) 42%, var(--anc-yellow) 100%);
    color: #fff;
    box-shadow: 0 -6px 24px rgba(0,0,0,.25);
    animation: anc-bandeau-up .35s ease;
}
.anc-popup-bandeau[hidden] { display: none; }
@keyframes anc-bandeau-up { from { transform: translateY(100%); } to { transform: none; } }
.anc-popup-bandeau__logo {
    flex: 0 0 auto; height: 52px; width: auto; display: block; object-fit: contain;
    background: #fff; padding: 6px 10px; border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
}
.anc-popup-bandeau__text { flex: 1; font-weight: 800; font-size: 24px; line-height: 1.3; text-align: center; text-shadow: 0 1px 2px rgba(0,0,0,.18); }
/* « Voir » : bouton mis en avant (gras + pulse) pour appeler au clic. */
.anc-popup-bandeau__see {
    flex: 0 0 auto;
    background: #9f2a23; color: #ffffff; border: 0; cursor: pointer;
    padding: 11px 28px; border-radius: var(--anc-radius); font: inherit; font-weight: 800; font-size: 15px;
    animation: anc-pulse 1.8s ease-in-out infinite;
}
.anc-popup-bandeau__see:hover { background: #87231d; animation-play-state: paused; }
@keyframes anc-pulse {
    0%, 100% { transform: scale(1);    box-shadow: 0 0 0 0 rgba(255,255,255,.55); }
    50%      { transform: scale(1.06); box-shadow: 0 0 0 10px rgba(255,255,255,0); }
}
@media (prefers-reduced-motion: reduce) { .anc-popup-bandeau__see { animation: none; } }
.anc-popup-bandeau__cta {
    flex: 0 0 auto;
    background: var(--anc-green); color: #fff; text-decoration: none;
    padding: 9px 24px; border-radius: var(--anc-radius); font-weight: 700; font-size: 14px;
}
.anc-popup-bandeau__cta:hover { background: #357a61; color: #fff; }
.anc-popup-bandeau__close {
    flex: 0 0 auto;
    background: transparent; border: 0; color: rgba(255,255,255,.75);
    font-size: 24px; line-height: 1; cursor: pointer; padding: 0 4px;
}
.anc-popup-bandeau__close:hover { color: #fff; }


/* ============================================================================
 * Hero home : carousel + overlay (badge + titre + intro + CTAs)
 * Shortcode [anc_hero_home] — voir class-hero-home.php
 * ========================================================================== */

.anc-hero-home {
    position: relative;
    margin: 0;
    /* Hauteur pilotée via style inline depuis le shortcode (attr `height`).
       Défaut = 100vh (plein écran). */
    --anc-hero-home-h: 100vh;
    /* Géométrie de la colonne card (droite) — sert à caler flèches + dots autour de la card. */
    --anc-card-right: clamp(70px, 6vw, 110px);  /* distance card -> bord droit */
    --anc-card-w:     min(380px, 80%);           /* largeur de la card */
    --anc-card-h:     260px;                      /* hauteur de référence de la card (cale dots/flèches) */
}

/* Le carousel et chaque slide occupent toute la hauteur déclarée. */
.anc-hero-home .anc-hero {
    min-height: var(--anc-hero-home-h);
    height: var(--anc-hero-home-h);
    border-radius: 0;
}
.anc-hero-home .anc-hero__slide {
    min-height: var(--anc-hero-home-h);
    height: var(--anc-hero-home-h);
    aspect-ratio: auto;
}

/* Card calée sur la colonne droite, hauteur de référence pour aligner les contrôles. */
.anc-hero-home .anc-hero__card {
    right: var(--anc-card-right);
    width: var(--anc-card-w);
    min-height: var(--anc-card-h);
    justify-content: center;   /* contenu centré dans la card */
}
/* Mosaïque : même boîte que les cards (largeur + hauteur de référence). */
.anc-hero-home .anc-hero__mosaic {
    right: var(--anc-card-right);
    width: var(--anc-card-w);
    height: var(--anc-card-h);
}

/* Flèches de part et d'autre de la card (et plus aux bords de l'écran). */
.anc-hero-home .anc-hero__nav { top: 50%; transform: translateY(-50%); }
.anc-hero-home .anc-hero__nav.is-prev {
    left: auto;
    right: calc(var(--anc-card-right) + var(--anc-card-w) + 14px);  /* à gauche de la card */
}
.anc-hero-home .anc-hero__nav.is-next {
    right: calc(var(--anc-card-right) - 46px - 8px);                /* à droite de la card */
}

/* Titre "Découvrez nos solutions" calé juste au-dessus de la card. */
.anc-hero-home .anc-hero__heading {
    left: auto;
    right: var(--anc-card-right);
    width: var(--anc-card-w);
    top: auto;
    bottom: calc(50% + var(--anc-card-h) / 2 + 16px);
}

/* Dots directement sous la card (centrés sur la colonne). */
.anc-hero-home .anc-hero__dots {
    left: auto;
    right: var(--anc-card-right);
    width: var(--anc-card-w);
    bottom: auto;
    top: 50%;
    transform: translateY(calc(var(--anc-card-h) / 2 + 18px));
    justify-content: center;
}

/* Gradient plus marqué (gauche -> centre) pour la lisibilité de l'overlay. */
.anc-hero-home .anc-hero__slide::after {
    background: linear-gradient(100deg, rgba(20,28,60,.78) 0%, rgba(20,28,60,.45) 45%, rgba(20,28,60,.10) 75%);
}

/* Overlay — le wrapper laisse passer les clics vers le carousel, sauf
   sur la colonne (boutons + liens). */
.anc-hero-home__overlay {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    pointer-events: none;
}

.anc-hero-home__col {
    display: flex;
    flex-direction: column;
    width: min(640px, 92%);
    margin-left: clamp(20px, 6vw, 120px);
    pointer-events: auto;
}

/* Titre de marque hors box, grosse typo blanche sur 2 lignes */
.anc-hero-home__brandname {
    color: #fff;
    font-family: "Public Sans", sans-serif;  /* typo de marque du site (réf. logo ANC) */
    font-weight: 700;
    line-height: .92;
    font-size: clamp(48px, 8vw, 110px);
    letter-spacing: -.01em;
    margin: 0 0 20px;
}
.anc-hero-home__brandname span { display: block; }

.anc-hero-home__inner {
    width: 100%;
    color: #fff;
    border-radius: 20px;
    padding: 2%;
}

/* Badge type "tag pill" : compact, arrondi total, logo réduit. */
.anc-hero-home__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 19px 0px 0;
    margin-top: 28px;
    background: #E5E4E9;
    color: var(--anc-navy);
    border-radius: 999px;
    overflow: hidden;
    font-size: 13px;
    line-height: 1.2;
    box-shadow: 0 4px 14px rgba(0,0,0,.15);
}
.anc-hero-home__badge-img {
    height: 50px !important;
    width: auto !important;
    max-height: 50px !important;
    display: block;
    object-fit: contain;
}
.anc-hero-home__badge-text {
    font-weight: 600;
    letter-spacing: .01em;
}

.anc-hero-home__title {
    font-size: clamp(28px, 4vw, 52px);
    font-weight: 800;
    line-height: 1.08;
    margin: 0 0 16px;
    color: #fff;
    text-shadow: 0 2px 14px rgba(0,0,0,.45);
}

.anc-hero-home__intro {
    font-size: clamp(15px, 1.35vw, 18px);
    line-height: 1.55;
    margin: 0 0 28px;
    color: #fff;
    max-width: 56ch;
    text-shadow: 0 1px 8px rgba(0,0,0,.55);
}

.anc-hero-home__ctas {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

/* Animation d'entrée du contenu hero home : slide depuis la gauche + fondu, en cascade. */
@keyframes anc-hero-home-in {
    from { opacity: 0; transform: translateX(-44px); }
    to   { opacity: 1; transform: translateX(0); }
}
.anc-hero-home__brandname,
.anc-hero-home__badge,
.anc-hero-home__title,
.anc-hero-home__intro,
.anc-hero-home__ctas {
    animation: anc-hero-home-in .7s cubic-bezier(.22,.61,.36,1) both;
}
.anc-hero-home__brandname { animation-delay: .05s; }
.anc-hero-home__badge     { animation-delay: .15s; }
.anc-hero-home__title     { animation-delay: .30s; }
.anc-hero-home__intro     { animation-delay: .45s; }
.anc-hero-home__ctas      { animation-delay: .60s; }
@media (prefers-reduced-motion: reduce) {
    .anc-hero-home__brandname,
    .anc-hero-home__badge,
    .anc-hero-home__title,
    .anc-hero-home__intro,
    .anc-hero-home__ctas { animation: none; }
}

/* Navigation carousel passe par-dessus la backdrop mais reste cliquable. */
.anc-hero-home .anc-hero__nav,
.anc-hero-home .anc-hero__dots { z-index: 6; }

/* --- Boutons CTA (réutilisables hors hero) --- */
.anc-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 26px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 17px;
    line-height: 1.2;
    text-decoration: none !important;
    border: 0;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.anc-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(0,0,0,.22);
}
.anc-btn--yellow  { background: #dbab2f; color: #24356c; }
.anc-btn--yellow:hover  { background: #c79a27; }
.anc-btn--red     { background: #9f2a23; color: #fff; }
.anc-btn--red:hover     { background: #87231d; }
.anc-btn--primary { background: var(--anc-navy);  color: #fff; }
.anc-btn--primary:hover { background: #1a275a; }
.anc-btn--accent  { background: var(--anc-green); color: #fff; }
.anc-btn--accent:hover  { background: #357a61; }

/* Responsive — sur mobile on empile : cluster card (heading + card + dots +
   flèches) EN HAUT, puis le bloc marque (titre + texte + CTA) EN BAS. */
@media (max-width: 1024px) {
    /* --anc-card-h calé sur la hauteur naturelle de la mosaïque à 90vw
       (image 1330x940 -> ratio ~1.41 -> 90vw/1.41 ≈ 64vw). */
    /* Largeur des cards/mosaïque réduite + centrée. --anc-card-w pilote tout. */
    .anc-hero-home {
        --anc-card-w: 60vw;
        --anc-card-h: 43vw;          /* ≈ --anc-card-w / 1.41 (ratio mosaïque) */
        --anc-heading-h: 42px;       /* hauteur réservée au heading */
        /* Centre verticalement le groupe (cluster + texte). Ajuster le -150px
           si besoin pour remonter/descendre l'ensemble. */
        --anc-cluster-top: calc(50vh - 21vw - 150px);
    }

    /* --- Cluster card : ancré EN HAUT, centré horizontalement --- */
    .anc-hero-home .anc-hero__heading {
        right: auto; left: 5vw; width: 90vw;
        bottom: auto; top: var(--anc-cluster-top);
        text-align: center;
    }
    .anc-hero-home .anc-hero__card,
    .anc-hero-home .anc-hero__mosaic {
        bottom: auto;
        top: calc(var(--anc-cluster-top) + var(--anc-heading-h));
        left: 50%; right: auto; transform: translateX(-50%);
        width: var(--anc-card-w);
    }
    /* Mosaïque : format d'origine conservé (ratio naturel de l'image). */
    .anc-hero-home .anc-hero__mosaic { height: auto; }
    .anc-hero-home .anc-hero__mosaic--img { display: block; border-radius: var(--anc-radius); overflow: hidden; }
    .anc-hero-home .anc-hero__mosaic--img img { width: 100%; height: auto; display: block; }
    /* Cards alignées sur le format (largeur + hauteur) de la mosaïque. */
    .anc-hero-home .anc-hero__card {
        height: var(--anc-card-h); min-height: var(--anc-card-h);
        padding: 16px 18px; gap: 8px;
    }
    .anc-hero-home .anc-hero__card-text { display: none; }  /* on garde titre + accroche + CTA */

    /* Dots sous la card. */
    .anc-hero-home .anc-hero__dots {
        right: auto; left: 5vw; width: 90vw;
        bottom: auto; transform: none;
        top: calc(var(--anc-cluster-top) + var(--anc-heading-h) + var(--anc-card-h) + 12px);
        justify-content: center;
    }

    /* Flèches visibles, calées sur le centre vertical de la card + rapprochées. */
    .anc-hero-home .anc-hero__nav {
        display: flex;
        top: calc(var(--anc-cluster-top) + var(--anc-heading-h) + var(--anc-card-h) / 2);
        transform: translateY(-50%);
        justify-content: center;
        align-items: center;
    }
    .anc-hero-home .anc-hero__nav.is-prev { left: calc(20vw - 15%); }
    .anc-hero-home .anc-hero__nav.is-next { right: calc(20vw - 15%); }

    /* --- Bloc marque : ancré EN BAS --- */
    .anc-hero-home__overlay { align-items: flex-start; }
    .anc-hero-home__col {
        width: auto; margin: 0 5vw; padding: 0;
        /* placé juste sous le cluster (heading + card + dots) */
        margin-top: calc(var(--anc-cluster-top) + var(--anc-heading-h) + var(--anc-card-h) + 56px);
    }
    .anc-hero-home__brandname { font-size: 40px; margin-bottom: 10px; }
    .anc-hero-home__inner { padding: 0; }
    .anc-hero-home__title { font-size: 24px; margin-bottom: 10px; }
    .anc-hero-home__intro { font-size: 14px; margin-bottom: 16px; }
    .anc-hero-home__badge { margin-top: 16px; }
    
    /* Bandeau bas d'écran : point d'entrée de la popup (bouton « Voir » -> grand format). */
.anc-popup-bandeau {
   

    background: url(/wp-content/uploads/2026/06/logo-new-white-rotate-scaled.png) -30% 29% / auto 245% no-repeat,
                linear-gradient(90deg, var(--anc-navy) 0%, var(--anc-blue) 42%, var(--anc-yellow) 100%);

 
}
.anc-popup-bandeau__text{
    text-align: end;
}
}
@media (max-width:767px){
    
    .anc-popup-bandeau {
   

    background:url(/wp-content/uploads/2026/06/logo-new-white-rotate-scaled.png) -30% 263% / auto 76% no-repeat,
                linear-gradient(90deg, var(--anc-navy) 0%, var(--anc-blue) 42%, var(--anc-yellow) 100%);

 
}
.anc-popup-bandeau__text{
    text-align: end;
        font-size: 22px;

}
#header-outer[data-format=menu-left-aligned] .row .col.span_3 {
    margin-right: 5px!important;
}
    /* Hero home plus haut sous 767px (override la variable inline du shortcode). */
    .anc-hero-home { --anc-hero-home-h: 117vh !important; }

    /* Hero standalone : padding latéral réduit en mobile. */
    .anc-service-hero--standalone {
        padding-left: 5vw;
        padding-right: 5vw;
    }
}

/* Fond blanc sur le logo. */
a#logo {
    background: white;
    padding: 2%;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#top #logo .starting-logo {
    position: absolute;
    top: 50% !important;
    opacity: 0;
    left: 50% !important;
    transform: translate(-50%, -50%);
}

/* ============================================================================
 * Homogénéisation des CTA jaunes (nectar_cta « texte jaune » #dbab2f) :
 * on les transforme en BOUTONS PLEINS jaunes à texte blanc, sur toutes les
 * pages, sans toucher au contenu. La couleur jaune est posée en style inline
 * sur .link_wrap -> on cible ça (n'affecte ni les CTA rouges/blancs, ni les
 * mots surlignés .nectar-highlighted-text qui utilisent data-color).
 * ========================================================================== */
.link_wrap[style*="dbab2f"] {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    background-color: #dbab2f !important;
    color: #fff !important;
    padding: 12px 26px !important;
    border-radius: 999px !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    transition: background-color .2s ease;
}
.link_wrap[style*="dbab2f"]:hover { background-color: #c2962a !important; }
.link_wrap[style*="dbab2f"] .link_text,
.link_wrap[style*="dbab2f"] a.link_text,
.link_wrap[style*="dbab2f"] a {
    color: #fff !important;
    border-bottom: 0 !important;
    text-decoration: none !important;
    background-image: none !important;
}
/* Pastille ronde + flèche natives Salient masquées (pastille jaune invisible
   sur le bouton jaune) -> on remet une flèche BLANCHE nette (sauf style souligné
   « underline » qui n'avait pas de flèche). */
.link_wrap[style*="dbab2f"] .circle,
.link_wrap[style*="dbab2f"] .arrow { display: none !important; }
.nectar-cta:not([data-style="underline"]) .link_wrap[style*="dbab2f"]::after {
    content: "\203A"; /* › */
    color: #fff !important;
    font-size: 1.35em;
    font-weight: 700;
    line-height: 1;
    margin-left: 2px;
}

/* ============================================================================
 * Page Contact — 2 colonnes (gauche bleu : logo+picto+texte, droite blanc : form)
 * ========================================================================== */
.anc-contact {
    display: grid;
    grid-template-columns: 5fr 7fr;
    align-items: stretch;
    max-width: min(1200px, 92vw);
    margin: clamp(24px,4vw,56px) auto clamp(48px,7vw,96px);
    border-radius: var(--anc-radius, 14px);
    overflow: hidden;
    box-shadow: 0 18px 50px rgba(0,0,0,.12);
}
.anc-contact__left {
    background: var(--anc-navy, #24356c);
    color: #fff;
    padding: clamp(32px, 4vw, 60px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
}
.anc-contact__logo { width: 150px; height: auto; }
.anc-contact__picto { width: 54px; height: 54px; color: #fff; }
.anc-contact__text { font-size: clamp(16px,1.4vw,19px); line-height: 1.6; color: rgba(255,255,255,.92); margin: 0; }
.anc-contact__coords { list-style: none; margin: 0; padding: 0; font-size: 16px; line-height: 1.9; }
.anc-contact__coords a { color: #fff; text-decoration: none; }
.anc-contact__coords a:hover { color: var(--anc-yellow, #dbab2f); }
.anc-contact__name { font-weight: 700; font-size: 18px; margin-bottom: 4px; }
.anc-contact__right { background: #fff; padding: clamp(28px, 3.5vw, 52px); }
.anc-contact__right .wpcf7 { max-width: none; margin: 0; }
@media (max-width: 880px) {
    .anc-contact { grid-template-columns: 1fr; }
}