/* Toute racine de bloc = conteneur de requête (container queries mobile-first du
   CSS Studio). `inline-size` = containment sur l'axe largeur seulement, sûr pour des
   éléments de niveau bloc ; permet aux descendants (et aux blocs enfants via leur
   ancêtre) d'utiliser @container partout, pas seulement sur 3 blocs. */
[data-block-type] {
    container-type: inline-size;
}

/* Typographie de confort (enhancement progressif, no-op si non supporté) :
   titres équilibrés sur 2-3 lignes, paragraphes sans mot orphelin. */
@supports (text-wrap: balance) {
    [data-block-type] :is(h1, h2, h3, h4) {
        text-wrap: balance;
    }
}
@supports (text-wrap: pretty) {
    [data-block-type] p {
        text-wrap: pretty;
    }
}

.gas-block-hero,
.gas-block-section,
.gas-block-text,
.gas-block-image,
/* video_embed n'était borné par RIEN : posé seul dans une page, le lecteur et
   son titre partaient d'un bord à l'autre du navigateur, contre la règle
   « aucun contenu ne touche les bords » (docs/ia-guides/composer-pages-documents
   §5). Il rejoint donc les blocs de contenu bornés. */
.gas-block-video-embed,
.gas-block-cta-band,
.gas-block-shortcode,
.gas-block-article-header,
.gas-block-paywall-gate,
.gas-block-related-articles,
.gas-block-latest-articles,
.gas-gated-placeholder {
    margin: var(--gas-space-6, 20px) auto;
    max-width: min(100%, var(--gas-content-max-width, 720px));
    padding-inline: var(--gas-space-4, 10px);
}

/* Modifier `container` — la règle ci-dessus plafonne la BOÎTE du bloc à
   --gas-content-max-width et ne lit jamais --gas-container. Résultat : le
   modifier `container` (narrow/default/wide/full), déclaré par 36 schémas,
   n'avait aucun effet sur la largeur du bloc — il ne libérait que le `__inner`
   de certains blocs. Deux tenants (raphael-noir, donnersens) avaient dû écrire
   ce correctif à la main dans leurs overrides ; il appartient au cœur.

   On cible la classe d'état `is-container-{valeur}` émise par le renderer de
   modifiers en plus de la custom property : ces règles ne s'appliquent donc QUE
   si le modifier est explicitement demandé — aucun bloc sans modifier ne change
   de largeur. (Une custom property inline n'est pas ciblable en CSS, et un
   sélecteur d'attribut `[style*="--gas-…"]` est supprimé par le purge du
   bundle : d'où la classe.)

   La classe est répétée trois fois à dessein : un override de tenant du type
   `.gas-page .gas-block-hero { max-width: … }` (0,2,0) l'emporterait sinon sur
   une classe simple (0,1,0) et le modifier resterait sans effet — exactement le
   symptôme d'origine. Une intention d'auteur posée sur le bloc doit primer sur
   une règle générale de gabarit ; `!important` ferait le même travail en
   empêchant tout ajustement ultérieur. */
.is-container-full.is-container-full.is-container-full {
    max-width: none;
    margin-inline: 0;
}

.is-container-wide.is-container-wide.is-container-wide {
    max-width: min(100%, var(--gas-container-wide, 1280px));
}

.is-container-default.is-container-default.is-container-default {
    max-width: min(100%, var(--gas-container-default, 1100px));
}

.is-container-narrow.is-container-narrow.is-container-narrow {
    max-width: min(100%, var(--gas-container-narrow, 640px));
}

/* latest_articles / gallery : rejoignent la convention typo tenant.
   Sans ces règles, le wrapper typed-shortcode héritait du system-ui et
   sortait plus gros que le <h1> (session 3 voie-lotus). Chaque tenant
   rattrapait en Zone 4 — un tiers des overrides restants. */
.gas-block-latest-articles,
.gas-block-gallery {
    max-width: min(100%, var(--gas-site-max-width, 1120px));
    margin-inline: auto;
    padding-inline: clamp(1rem, 5vw, 2.5rem);
    box-sizing: border-box;
    font-family: var(--gas-font-family, inherit);
}
.gas-block-latest-articles :is(h1, h2, h3, h4),
.gas-block-gallery :is(h1, h2, h3, h4),
.gas-block-article-header :is(h1, h2) {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-weight: 500;
    line-height: 1.2;
}
.gas-block-latest-articles h2,
.gas-block-gallery h2 {
    font-size: clamp(1.35rem, 2.3vw, 1.85rem);
}
.gas-block-latest-articles h3,
.gas-block-gallery h3 {
    font-size: clamp(1.1rem, 1.8vw, 1.35rem);
}/* @gas:block latest_articles start */

.gas-block-latest-articles p {
    font-family: var(--gas-font-family, inherit);
}
/* @gas:block latest_articles end *//* @gas:block title_block start */



/* title_block : contraindre au canvas du site (plus large que le corps de texte) */
.gas-block-title-block {
    margin-block: var(--gas-space-6, 20px);
    margin-inline: auto;
    max-width: min(100%, var(--gas-site-max-width, 1280px));
    padding-inline: var(--gas-space-l, 24px);
    box-sizing: border-box;
}
/* @gas:block title_block end */

/* Base de taille du texte libre des documents/pages GAS. Sans elle, le texte non
   explicitement taillé hérite du root : sous un site épinglé 62.5% (10px=10px), il
   tombe à ~10px (illisible). Token px → invariant au root (no-op à 100%). Même parti
   pris que le footer (gas-site-footer.css) et le body Astro (Layout.astro). */
.gas-page {
    font-size: var(--gas-text-m);
    line-height: var(--gas-leading-normal);
    padding-block-start: var(--gas-page-content-gap, var(--gas-space-xs, 8px));
}

/* === Le premier bloc d'une page colle au header ==========================
   Les marges verticales inter-blocs (cœur : .gas-block-hero / .gas-block-section
   ont margin 20px auto) s'appliquent aussi au PREMIER enfant de .gas-page :
   bande vide entre bas de header et haut du contenu. Très visible quand la
   page ouvre sur un hero overlay ou une section full_bleed (emmanuelsilvy.ch
   et d'autres vitrines). Mesuré : padding page (~8px) + marge hero (~20px)
   ≈ 28px de vide. Spécificité (0,4,0) passe devant les overrides tenant (0,3,0).
   Couvre section ET hero : le fix initial n'annulait que .gas-block-section,
   or beaucoup de one-pagers ouvrent sur data-block-type="hero". */
.gas-page > .gas-block-anchor:first-child > .gas-block-section,
.gas-page > .gas-block-section:first-child,
.gas-page > .gas-block-anchor:first-child > .gas-block-hero:not(.gas-block-hero--minimal):not(.gas-block-hero--text_split),
.gas-page > .gas-block-hero:not(.gas-block-hero--minimal):not(.gas-block-hero--text_split):first-child {
    margin-block-start: 0;
}

/* Gouttière haute de .gas-page retirée quand le premier bloc est visuellement
   plein cadre (section full_bleed OU hero). Les pages qui ouvrent sur du
   texte / une section content gardent --gas-page-content-gap. */
.gas-page:has(> .gas-block-anchor:first-child > .gas-block-section--width-full_bleed),
.gas-page:has(> .gas-block-section--width-full_bleed:first-child),
.gas-page:has(> .gas-block-anchor:first-child > .gas-block-hero:not(.gas-block-hero--minimal):not(.gas-block-hero--text_split)),
.gas-page:has(> .gas-block-hero:not(.gas-block-hero--minimal):not(.gas-block-hero--text_split):first-child) {
    padding-block-start: 0;
}

/* Les variantes `minimal` / `text_split` sont du TEXTE sur le fond de page, pas
   une ouverture plein cadre : leur coller le header supprime l'air au-dessus du
   titre et la page démarre à ras. Elles gardent donc la gouttière. */

/* === Gouttière de contenu par défaut (corrige « texte collé au bord » sur mobile) ===
   `.gas-page` n'a aucun padding horizontal : sur mobile (viewport < `--gas-container`),
   le `__inner` d'un bloc remplit 100% et le texte se colle au bord. On pose une
   gouttière par défaut sur TOUT `__inner` de bloc. `:where([data-block-type])` scope
   aux blocs (exclut header/footer) SANS ajouter de spécificité → les blocs qui
   définissent leur propre `padding-inline` plus loin (cta-band, timeline…) gardent
   leur valeur. Les fonds full-bleed (`__bg`, `__media`, `__image`) ne sont PAS des
   `__inner` → ils restent edge-to-edge. Règle PRÉCOCE (avant les règles par bloc). */
:where([data-block-type]) [class*="__inner"] {
    padding-inline: var(--gas-space-m, 16px);
}
/* Blocs de formulaire sans `__inner` (contenu direct dans la section) → gouttière
   sur la section elle-même. */
:where([data-block-type="contact_form"], [data-block-type="newsletter_signup"]) {
    padding-inline: var(--gas-space-m, 16px);
}
/* Conteneurs de contenu sans `__inner` qui restaient collés au bord sur mobile
   (max-width + margin auto sans padding horizontal). Audit complet des candidats :
   les blocs full-bleed (image/gallery/image_collage/map/entity_hero/logo_marquee)
   et les éléments DANS un `__inner` (subtitles, grids de pricing/bento/feature-
   showcase…, `__content` du hero) sont EXCLUS car déjà OK. `:where` = pas de
   spécificité ajoutée (un variant comme `breadcrumb.is-tone-surface` garde son
   propre padding). */
:where(.gas-document--article, .gas-block-breadcrumb, .gas-block-login-form, .gas-block-letter__header, .gas-block-section--panel) {
    padding-inline: var(--gas-space-m, 16px);
}

.gas-page--layout-canvas {
    max-width: none;
    padding: 0;
}

.gas-page--layout-canvas > .gas-block-anchor {
    margin: 0;
}


.gas-block-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--gas-block-section-bg, transparent);
}

.gas-block-section::before,
.gas-block-section::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: -1;
}

.gas-block-section--bg-image::before {
    background-image: var(--gas-block-section-image);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.gas-block-section--focal-top::before {
    background-position: top center;
}

.gas-block-section--focal-bottom::before {
    background-position: bottom center;
}

.gas-block-section--focal-left::before {
    background-position: center left;
}

.gas-block-section--focal-right::before {
    background-position: center right;
}

.gas-block-section::after {
    background: var(--gas-block-section-overlay, transparent);
    opacity: var(--gas-block-section-overlay-opacity, 0);
}

.gas-block-section--width-wide {
    max-width: min(100%, var(--gas-wide-max-width, 920px));
}

.gas-block-section--width-full_bleed {
    width: 100vw;
    max-width: none;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.gas-block-section--height-half {
    min-height: 50vh;
}

.gas-block-section--height-full {
    min-height: 100vh;
}

.gas-block-section__inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: min(100%, var(--gas-content-max-width, 720px));
    margin-inline: auto;
    display: grid;
    gap: var(--gas-space-5, 12.5px);
}

.gas-block-section--content-wide .gas-block-section__inner {
    max-width: min(100%, var(--gas-wide-max-width, 920px));
}

.gas-block-section--content-full .gas-block-section__inner {
    max-width: none;
}

/* ── Shape dividers (découpes SVG en haut/bas de section) ── */
.gas-block-section--divider-h-s {
    --_gas-divider-h: clamp(24px, 4vw, 48px);
}

.gas-block-section--divider-h-m {
    --_gas-divider-h: clamp(40px, 6vw, 80px);
}

.gas-block-section--divider-h-l {
    --_gas-divider-h: clamp(60px, 9vw, 120px);
}

.gas-block-section--divider-h-xl {
    --_gas-divider-h: clamp(90px, 12vw, 170px);
}

.gas-block-section__divider {
    position: absolute;
    left: 0;
    width: 100%;
    height: var(--_gas-divider-h, 80px);
    line-height: 0;
    color: var(--gas-block-section-divider-color, var(--gas-white, #fff));
    pointer-events: none;
    z-index: 0;
}

.gas-block-section__divider svg {
    display: block;
    width: 100%;
    height: 100%;
}

.gas-block-section__divider--top {
    top: 0;
}

.gas-block-section__divider--bottom {
    bottom: 0;
}

/* La forme du bas pointe vers le bas (retournement vertical). */
.gas-block-section__divider--bottom svg {
    transform: scaleY(-1);
}

/* Miroir horizontal optionnel. */
.gas-block-section--divider-flip-top .gas-block-section__divider--top svg {
    transform: scaleX(-1);
}

.gas-block-section--divider-flip-bottom .gas-block-section__divider--bottom svg {
    transform: scaleX(-1) scaleY(-1);
}

/* ── Séparateurs multi-couches (waves_layered, waves_double) ── */
.gas-block-section__divider--multilayer {
    overflow: hidden;
    position: absolute;
}

.gas-block-section__divider--multilayer svg {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 200%;
    height: 100%;
}

/* Le dernier SVG détermine la hauteur du conteneur (position relative). */
.gas-block-section__divider--multilayer svg:last-child {
    position: relative;
    display: block;
}

/* ── Animations seamless des séparateurs ── */
@media (prefers-reduced-motion: no-preference) {
    /* Mono-couche animable : glissement du SVG (width 200%, translateX -50%). */
    .gas-block-section__divider--animated:not(.gas-block-section__divider--multilayer) svg {
        width: 200%;
        animation: gas-divider-slide 14s linear infinite;
        will-change: transform;
    }

    /* Multi-couche : chaque SVG glisse à une vitesse différente (parallax). */
    .gas-block-section__divider--multilayer.gas-block-section__divider--animated svg[data-layer="0"] {
        animation: gas-divider-slide 14s linear infinite;
        will-change: transform;
    }

    .gas-block-section__divider--multilayer.gas-block-section__divider--animated svg[data-layer="1"] {
        animation: gas-divider-slide 20s linear infinite;
        will-change: transform;
    }

    .gas-block-section__divider--multilayer.gas-block-section__divider--animated svg[data-layer="2"] {
        animation: gas-divider-slide-rev 26s linear infinite;
        will-change: transform;
    }

    @keyframes gas-divider-slide {
        from { transform: translateX(0); }
        to   { transform: translateX(-50%); }
    }

    @keyframes gas-divider-slide-rev {
        from { transform: translateX(-50%); }
        to   { transform: translateX(0); }
    }
}


/* Correction flip + animation (la forme du bas est déjà inversée verticalement). */
.gas-block-section--divider-flip-top .gas-block-section__divider--top.gas-block-section__divider--animated:not(.gas-block-section__divider--multilayer) svg {
    animation-direction: reverse;
}

.gas-block-section--divider-flip-bottom .gas-block-section__divider--bottom.gas-block-section__divider--animated:not(.gas-block-section__divider--multilayer) svg {
    animation-direction: reverse;
}

/* ── Fonds décoratifs : mesh (maillage de tokens) ── */
.gas-block-section--mesh-aurora {
    background-color: var(--gas-neutral-50, #f8fafc);
    background-image:
        radial-gradient(at 18% 20%, color-mix(in srgb, var(--gas-primary) 38%, transparent), transparent 52%),
        radial-gradient(at 82% 12%, color-mix(in srgb, var(--gas-accent) 32%, transparent), transparent 46%),
        radial-gradient(at 62% 82%, color-mix(in srgb, var(--gas-info) 30%, transparent), transparent 50%);
}

.gas-block-section--mesh-sunset {
    background-color: var(--gas-neutral-50, #f8fafc);
    background-image:
        radial-gradient(at 16% 22%, color-mix(in srgb, var(--gas-warning) 40%, transparent), transparent 52%),
        radial-gradient(at 84% 18%, color-mix(in srgb, var(--gas-danger) 32%, transparent), transparent 48%),
        radial-gradient(at 60% 84%, color-mix(in srgb, var(--gas-accent) 30%, transparent), transparent 50%);
}

.gas-block-section--mesh-ocean {
    background-color: var(--gas-neutral-50, #f8fafc);
    background-image:
        radial-gradient(at 20% 18%, color-mix(in srgb, var(--gas-info) 38%, transparent), transparent 52%),
        radial-gradient(at 80% 16%, color-mix(in srgb, var(--gas-primary) 34%, transparent), transparent 48%),
        radial-gradient(at 58% 86%, color-mix(in srgb, var(--gas-success) 28%, transparent), transparent 50%);
}

.gas-block-section--mesh-forest {
    background-color: var(--gas-neutral-50, #f8fafc);
    background-image:
        radial-gradient(at 18% 20%, color-mix(in srgb, var(--gas-success) 38%, transparent), transparent 52%),
        radial-gradient(at 82% 14%, color-mix(in srgb, var(--gas-primary) 30%, transparent), transparent 48%),
        radial-gradient(at 62% 82%, color-mix(in srgb, var(--gas-accent) 26%, transparent), transparent 50%);
}

.gas-block-section--mesh-mono {
    background-color: var(--gas-neutral-50, #f8fafc);
    background-image:
        radial-gradient(at 20% 18%, color-mix(in srgb, var(--gas-primary) 32%, transparent), transparent 52%),
        radial-gradient(at 80% 20%, color-mix(in srgb, var(--gas-primary) 18%, transparent), transparent 50%),
        radial-gradient(at 60% 84%, color-mix(in srgb, var(--gas-primary) 12%, transparent), transparent 52%);
}

/* ── Fonds décoratifs : motifs (pattern) en filigrane via ::before ── */
.gas-block-section--bg-pattern::before {
    opacity: var(--gas-block-section-pattern-opacity, 0.08);
}

.gas-block-section--pattern-dots::before {
    background-image: radial-gradient(var(--gas-neutral-500, #64748b) 1.5px, transparent 1.6px);
    background-size: 22px 22px;
}

.gas-block-section--pattern-grid::before {
    background-image:
        linear-gradient(var(--gas-neutral-500, #64748b) 1px, transparent 1px),
        linear-gradient(90deg, var(--gas-neutral-500, #64748b) 1px, transparent 1px);
    background-size: 28px 28px;
}

.gas-block-section--pattern-lines::before {
    background-image: repeating-linear-gradient(45deg, var(--gas-neutral-500, #64748b) 0, var(--gas-neutral-500, #64748b) 1px, transparent 1px, transparent 12px);
}

.gas-block-section--pattern-cross::before {
    background-image:
        linear-gradient(var(--gas-neutral-500, #64748b) 1px, transparent 1px),
        linear-gradient(90deg, var(--gas-neutral-500, #64748b) 1px, transparent 1px);
    background-size: 32px 32px;
    background-position: center;
}

/* ── Forme organique décorative (blob), cumulable avec tout fond ── */
.gas-block-section__blob {
    position: absolute;
    width: clamp(180px, 32vw, 460px);
    aspect-ratio: 1;
    border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%;
    background: var(--gas-block-section-blob-color, var(--gas-primary));
    filter: blur(48px);
    opacity: 0.45;
    z-index: 0;
    pointer-events: none;
}

.gas-block-section--blob-tl .gas-block-section__blob { top: -8%; left: -6%; }
.gas-block-section--blob-tr .gas-block-section__blob { top: -8%; right: -6%; }
.gas-block-section--blob-bl .gas-block-section__blob { bottom: -8%; left: -6%; }
.gas-block-section--blob-br .gas-block-section__blob { bottom: -8%; right: -6%; }
.gas-block-section--blob-center .gas-block-section__blob {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* ── Cadre média réutilisable (gas-frame) : image, hero, feature_showcase ── */
.gas-frame {
    display: block;
}

.gas-frame img {
    display: block;
    width: 100%;
    height: auto;
    /* La bordure du cadre "ring" est incluse dans la largeur (sinon +2px de
       débordement quand l'image fait 100% de sa colonne, ex. mobile). */
    box-sizing: border-box;
}

.gas-frame--ring img {
    border-radius: var(--gas-radius-l, 12px);
    border: 1px solid var(--gas-neutral-200, #e2e8f0);
}

.gas-frame--shadow img {
    border-radius: var(--gas-radius-l, 12px);
    box-shadow: 0 24px 50px -12px rgba(15, 23, 42, 0.28), 0 8px 20px -8px rgba(15, 23, 42, 0.16);
}

.gas-frame--browser {
    border-radius: var(--gas-radius-l, 12px);
    overflow: hidden;
    border: 1px solid var(--gas-neutral-200, #e2e8f0);
    box-shadow: 0 24px 50px -16px rgba(15, 23, 42, 0.25);
    background: var(--gas-white, #fff);
}

.gas-frame__bar {
    display: block;
    height: 34px;
    background: var(--gas-neutral-100, #f1f5f9);
    border-bottom: 1px solid var(--gas-neutral-200, #e2e8f0);
    position: relative;
}

.gas-frame__bar::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 14px;
    width: 10px;
    height: 10px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: var(--gas-danger, #ef4444);
    box-shadow: 18px 0 0 var(--gas-warning, #f59e0b), 36px 0 0 var(--gas-success, #22c55e);
}

.gas-frame--browser img {
    border-radius: 0;
}

.gas-frame--device {
    display: inline-block;
    max-width: min(100%, 360px);
    padding: 10px;
    background: var(--gas-neutral-900, #0f172a);
    border-radius: 28px;
    box-shadow: 0 30px 60px -18px rgba(15, 23, 42, 0.4);
}

.gas-frame--device img {
    border-radius: 18px;
}


/* ── Section « panneau » : carte arrondie contenue et flottante ── */
.gas-block-section--panel {
    width: auto;
    max-width: min(100%, var(--gas-wide-max-width, 920px));
    margin-inline: auto;
    margin-block: var(--gas-space-l, 15px);
    border-radius: var(--gas-radius-xl, 20px);
    box-shadow: 0 30px 60px -24px rgba(15, 23, 42, 0.28), 0 8px 24px -12px rgba(15, 23, 42, 0.16);
    overflow: hidden;
}

@media (max-width: 640px) {
    .gas-block-section--panel {
        margin-block: var(--gas-space-m, 10px);
        border-radius: var(--gas-radius-l, 12px);
    }
}/* @gas:block hero start */



/* ── Hero : effets média (variante split) + variante minimal ── */
.gas-block-hero--effect-tilt .gas-block-hero__media {
    transform: rotate(-2deg);
    transition: transform 0.3s var(--gas-ease-standard, ease);
}

.gas-block-hero--effect-tilt .gas-block-hero__media:hover {
    transform: rotate(0);
}

.gas-block-hero--effect-offset .gas-block-hero__media {
    transform: translateY(15px);
}

.gas-block-hero--effect-angled .gas-block-hero__media img,
.gas-block-hero--effect-angled .gas-block-hero__image {
    clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 95%);
}

.gas-block-hero--minimal .gas-block-hero__content {
    max-width: 560px;
    margin-inline: auto;
    text-align: center;
}

.gas-block-hero--minimal .gas-block-hero__actions {
    justify-content: center;
}

/* ── hero : variante overlay (image plein cadre + contenu centré + voile) ── */
.gas-block-hero--overlay {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    border-radius: var(--gas-radius-l, 12px);
}
.gas-block-hero--overlay .gas-block-hero__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.gas-block-hero--overlay .gas-block-hero__bg .gas-block-hero__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.gas-block-hero--overlay::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: rgba(15, 23, 42, var(--gas-hero-overlay, 0.5));
}
.gas-block-hero--overlay .gas-block-hero__inner {
    position: relative;
    z-index: 1;
    display: block;
    padding-block: var(--gas-space-3xl, 50px);
    text-align: center;
}
.gas-block-hero--overlay .gas-block-hero__content {
    max-width: 460px;
    margin-inline: auto;
}
.gas-block-hero--overlay .gas-block-hero__eyebrow,
.gas-block-hero--overlay .gas-block-hero__title,
.gas-block-hero--overlay .gas-block-hero__subtitle,
.gas-block-hero--overlay .gas-block-hero__note {
    color: var(--gas-white, #fff);
}
.gas-block-hero--overlay .gas-block-hero__actions,
.gas-block-hero--overlay .gas-block-hero__note {
    justify-content: center;
}

@media (max-width: 720px) {
    .gas-block-hero--effect-tilt .gas-block-hero__media,
    .gas-block-hero--effect-offset .gas-block-hero__media {
        transform: none;
    }
}
/* @gas:block hero end */


.gas-block-section--padding-none {
    padding: 0;
}

.gas-block-section--padding-sm {
    padding-block: var(--gas-space-4, 10px);
}

.gas-block-section--padding-md {
    padding-block: var(--gas-space-6, 20px);
}

.gas-block-section--padding-lg {
    padding-block: var(--gas-space-8, 30px);
}

.gas-block-section--padding-xl {
    padding-block: var(--gas-space-10, 40px);
}

/* Alignement vertical du contenu dans la hauteur de la section.
 * `align-content` (et non `align-items`) centre le bloc de contenu dans
 * l'espace disponible quand la section est plus haute que son contenu
 * (height: half / full). */
.gas-block-section--valign-center {
    display: grid;
    align-content: center;
}

.gas-block-section--valign-bottom {
    display: grid;
    align-content: end;
}

/* Couleur de texte des blocs enfants — pilotable depuis l'éditeur (champ
 * text_color), pour rendre lisible le contenu sur une image de fond sombre
 * sans écrire de CSS.
 *
 * Les renderers de blocs lisent tous `var(--gas-color-text[-muted], …)`. Plutôt
 * qu'une guerre de spécificité, on REDÉFINIT ces variables sur la section :
 * elles cascadent vers hero / text / cta / image-text-split / etc. Les boutons
 * gardent leur propre style (ils n'utilisent pas ces variables). */
.gas-block-section--text-light {
    --gas-color-text: var(--gas-text-color-inverse, #fff);
    --gas-color-text-muted: var(--gas-text-color-inverse, #fff);
    /* Liens lisibles sur fond coloré/sombre : sinon ils gardent la couleur de
       lien primary et disparaissent (ex. lien primary sur un fond primary). */
    --gas-text-color-link: var(--gas-text-color-inverse, #fff);
    --gas-text-color-link-hover: var(--gas-text-color-inverse, #fff);
    color: var(--gas-text-color-inverse, #fff);
}

.gas-block-section--text-light a {
    color: var(--gas-text-color-inverse, #fff);
    text-decoration: underline;
}

.gas-block-section--text-light a:hover {
    color: var(--gas-text-color-inverse, #fff);
    opacity: 0.85;
}

.gas-block-section--text-dark {
    --gas-color-text: var(--gas-text-color, #161616);
    --gas-color-text-muted: var(--gas-text-color-muted, #4a4a4a);
    color: var(--gas-text-color, #161616);
}

/* Colonnes natives de section (gas-block-section--cols-1 = mono-col, par défaut) */
.gas-block-section__grid {
    display: grid;
    grid-template-columns: var(--gas-block-section-columns, 1fr);
    align-items: start;
}

.gas-block-section__column {
    display: grid;
    gap: var(--gas-space-5, 12.5px);
    min-width: 0;
}

.gas-block-section--gap-none .gas-block-section__grid {
    gap: 0;
}

.gas-block-section--gap-sm .gas-block-section__grid {
    gap: var(--gas-space-4, 10px);
}

.gas-block-section--gap-md .gas-block-section__grid {
    gap: var(--gas-space-6, 20px);
}

.gas-block-section--gap-lg .gas-block-section__grid {
    gap: var(--gas-space-8, 30px);
}

@media (max-width: 768px) {
    .gas-block-section--cols-2 .gas-block-section__grid,
    .gas-block-section--cols-3 .gas-block-section__grid,
    .gas-block-section--cols-4 .gas-block-section__grid,
    .gas-block-section--cols-5 .gas-block-section__grid,
    .gas-block-section--cols-6 .gas-block-section__grid {
        grid-template-columns: 1fr;
    }
}

/*
 * Grille 12 colonnes (Lot H2, champ additif column_spans). Une section porte
 * la classe --grid-12 quand column_spans est présent et valide (somme = 12) ;
 * chaque cellule reçoit alors une classe utilitaire --span-{n} en plus de la
 * classe de base .gas-block-section__column (gap/display hérités, cf. ci-dessus).
 */
.gas-block-section--grid-12 .gas-block-section__grid {
    grid-template-columns: var(--gas-block-section-columns, repeat(12, 1fr));
}

.gas-block-section__column--span-1 { grid-column: span 1; }
.gas-block-section__column--span-2 { grid-column: span 2; }
.gas-block-section__column--span-3 { grid-column: span 3; }
.gas-block-section__column--span-4 { grid-column: span 4; }
.gas-block-section__column--span-5 { grid-column: span 5; }
.gas-block-section__column--span-6 { grid-column: span 6; }
.gas-block-section__column--span-7 { grid-column: span 7; }
.gas-block-section__column--span-8 { grid-column: span 8; }
.gas-block-section__column--span-9 { grid-column: span 9; }
.gas-block-section__column--span-10 { grid-column: span 10; }
.gas-block-section__column--span-11 { grid-column: span 11; }
.gas-block-section__column--span-12 { grid-column: span 12; }

@media (max-width: 768px) {
    /* Empilement mobile : la grille 12 doit repasser à UNE piste ici même.
     * Le repli --cols-N plus haut ne suffit pas : la règle de base
     * `--grid-12 { grid-template-columns: repeat(12, 1fr) }` arrive plus
     * tard dans la source et regagne à spécificité égale. Or garder 12
     * pistes en mobile fait déborder la page même avec des colonnes en
     * pleine ligne : les 11 column-gaps imposent une largeur minimale
     * incompressible (mesuré sur aph : 11 × 32px = 352px dans 296px utiles
     * → 24px de scroll horizontal sur toutes les pages). */
    .gas-block-section--grid-12 .gas-block-section__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    /* On neutralise aussi le span pour que chaque cellule occupe toute la
     * largeur au lieu de rester bornée à N/12e. */
    .gas-block-section--grid-12 .gas-block-section__column[class*="--span-"] {
        grid-column: 1 / -1;
    }
}

.gas-block-section .gas-block-anchor,
.gas-block-section .gas-block-hero,
.gas-block-section .gas-block-text,
.gas-block-section .gas-block-image,
.gas-block-section .gas-block-cta-band,
.gas-block-section .gas-block-shortcode,
.gas-block-section .gas-block-typed-shortcode,
.gas-block-section .gas-block-cta {
    max-width: none;
    margin: 0;
    padding-inline: 0;
}/* @gas:block hero start */


.gas-block-hero__inner {
    display: grid;
    gap: var(--gas-space-4, 10px);
    align-items: center;
}

.gas-block-hero__eyebrow {
    margin: 0 0 var(--gas-space-3, 7.5px);
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-sm, 8.5px);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.gas-block-hero__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0;
    color: var(--gas-color-text, #161616);
    font-size: clamp(18px, 4vw, 26px);
    line-height: 1.2;
}

.gas-block-hero__note {
    display: flex;
    align-items: center;
    gap: var(--gas-space-2, 5px);
    margin: var(--gas-space-4, 10px) 0 0;
    color: var(--gas-color-text-muted, #4a4a4a);
    font-style: italic;
    font-size: var(--gas-text-s, 14px);
    line-height: 1.4;
}

.gas-block-hero__note-icon {
    flex: 0 0 auto;
    width: 1.4em;
    height: 1.4em;
    color: var(--gas-accent-text);
}

.gas-block-hero__subtitle {
    margin: var(--gas-space-3, 7.5px) 0 0;
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-m, 16px);
    line-height: 1.5;
}

.gas-block-hero__secondary {
    color: var(--gas-color-text-muted, #4a4a4a);
}

.gas-block-hero__secondary-text {
    margin: 0;
    font-size: var(--gas-text-m, 16px);
    line-height: 1.65;
}

.gas-block-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-3, 7.5px);
    margin-top: var(--gas-space-4, 10px);
}

.gas-block-hero__media {
    margin: 0;
}

.gas-block-hero__image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-lg, 7.5px);
}

/* Garde-fou : une photo portrait posée dans un hero "split" (colonne étroite)
   monterait à sa hauteur native (~950px) et déséquilibrerait l'ouverture. On
   borne et on recadre (cover). N'affecte pas les images plus basses que le cap. */
.gas-block-hero--split .gas-block-hero__image {
    max-height: 480px;
    object-fit: cover;
}

/* Modificateur plein écran : le hero prend environ 50% du viewport. */
.gas-block-hero--full-height {
    min-height: 50svh;
    display: flex;
    flex-direction: column;
}
.gas-block-hero--full-height .gas-block-hero__inner {
    flex: 1;
    align-items: center;
}
.gas-block-hero--full-height.gas-block-hero--split .gas-block-hero__media {
    align-self: stretch;
}
.gas-block-hero--full-height.gas-block-hero--split .gas-block-hero__image {
    height: 100%;
    max-height: none;
    width: 100%;
    object-fit: cover;
}
/* @gas:block hero end *//* @gas:block text start */




.gas-block-text__inner {
    display: grid;
    gap: var(--gas-space-3, 7.5px);
}

.gas-block-text__title {
    margin: 0;
    color: var(--gas-color-text, #161616);
}

.gas-block-text__content {
    color: var(--gas-color-text, #161616);
    line-height: 1.65;
}

.gas-block-text--narrow {
    max-width: min(100%, 520px);
}

.gas-block-text--full {
    max-width: min(100%, 920px);
}

.gas-block-text--card .gas-block-text__inner {
    background: var(--gas-color-surface, #fff);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-lg, 7.5px);
    padding: var(--gas-space-4, 10px);
}

.gas-block-text--highlight .gas-block-text__inner {
    background: var(--gas-color-primary-soft, #eef7ff);
    border-left: 4px solid var(--gas-color-primary, #1a73e8);
    padding: var(--gas-space-4, 10px);
}

.gas-block-text--align-center {
    text-align: center;
}

.gas-block-text--align-right {
    text-align: right;
}

/* ── text : habillage de texte (float) — pattern magazine ── */
/* flow-root sur le conteneur habillé : englobe la hauteur du float sans
   dépendre d'un pseudo-élément clearfix (technique moderne, robuste face aux
   marges collapsées des enfants du richtext). */
.gas-block-text--has-float {
    display: flow-root;
}

.gas-block-text__float {
    margin: 0 0 var(--gas-space-4, 10px);
}

.gas-block-text__float--left {
    float: left;
    margin-right: var(--gas-space-4, 10px);
}

.gas-block-text__float--right {
    float: right;
    margin-left: var(--gas-space-4, 10px);
}

.gas-block-text__float--third {
    width: 33%;
}

.gas-block-text__float--half {
    width: 50%;
}

.gas-block-text__float-img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-m, 6px);
}

@supports (shape-outside: inset(0)) {
    .gas-block-text__float--left {
        shape-outside: margin-box;
    }
    .gas-block-text__float--right {
        shape-outside: margin-box;
    }
}

@media (max-width: 768px) {
    .gas-block-text__float--left,
    .gas-block-text__float--right {
        float: none;
        width: 100%;
        margin: 0 0 var(--gas-space-4, 10px);
    }
}
/* @gas:block text end *//* @gas:block image start */




.gas-block-image__figure {
    margin: 0;
}

.gas-block-image__img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-md, 5px);
}

.gas-block-image__caption {
    margin-top: var(--gas-space-2, 5px);
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-s, 14px);
}

.gas-block-image--narrow {
    max-width: min(100%, 520px);
}

.gas-block-image--full {
    max-width: min(100%, 920px);
}
/* @gas:block image end *//* @gas:block cta_band start */






/* cta_band : base + layout (__inner/__content/__title/__subtitle/__actions) consolidés
   plus bas dans ce fichier (bloc unique). Ici, uniquement les modifiers de fond ACTIFS
   (--none/--primary/--soft, émis par le renderer via background_tone). */
.gas-block-cta-band--none .gas-block-cta-band__inner {
    background: var(--gas-color-surface, #fff);
    border: 1px solid var(--gas-color-border, #e0e0e0);
}

.gas-block-cta-band--primary .gas-block-cta-band__inner {
    background: var(--gas-color-primary, #1a73e8);
    color: var(--gas-color-on-primary, #fff);
}

.gas-block-cta-band--soft .gas-block-cta-band__inner {
    background: var(--gas-color-primary-soft, #eef7ff);
    color: var(--gas-color-text, #161616);
}

/* `background_tone=none` pose en réalité une CARTE BLANCHE (surface + filet),
   pas un fond transparent. Posé dans une section à texte clair, le cta_band
   devenait donc un rectangle blanc sur lequel le texte — clair par héritage —
   était invisible. On neutralise la carte dans ce contexte précis : le bloc
   redevient transparent et hérite de la couleur de la section. Le rendu par
   défaut (hors section claire) est inchangé. */
.gas-block-section--text-light .gas-block-cta-band--none .gas-block-cta-band__inner {
    background: transparent;
    border-color: color-mix(in srgb, currentColor 28%, transparent);
}
/* @gas:block cta_band end *//* @gas:block shortcode start */




.gas-block-shortcode {
    min-height: 1px;
}
/* @gas:block shortcode end */

.gas-document--article {
    max-width: min(100%, var(--gas-content-max-width, 720px));
    margin: 0 auto;
}

/* Piste explicite `minmax(0, 1fr)` : sans elle la colonne implicite est en `auto`
   (shrink-to-fit). Même famille de piège que `.gas-block-group__item` plus bas. */
.gas-document__body--article {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--gas-space-5, 12.5px);
}

/* …mais fixer la piste ne suffit pas : la règle globale
   `[data-block-type] { container-type: inline-size }` applique `contain: inline-size`,
   et un item de grille sous size containment N'EST PAS étiré par `justify-items:
   stretch` (vérifié : `stretch` et `justify-self: stretch` laissent le bloc à 32px,
   soit son padding seul). Il faut une largeur explicite. Sans ça, tout bloc posé dans
   le corps d'un article s'effondre : titre et texte à 0px de large, un mot par ligne. */
.gas-document__body--article > [data-block-type] {
    width: 100%;
}/* @gas:block article_header start */


.gas-block-article-header {
    display: grid;
    gap: var(--gas-space-4, 10px);
}

.gas-block-article-header__media {
    margin: 0;
}

.gas-block-article-header__image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-lg, 7.5px);
}

.gas-block-article-header__content {
    display: grid;
    gap: var(--gas-space-2, 5px);
}

.gas-block-article-header__title {
    margin: 0;
    color: var(--gas-color-text, #161616);
    font-size: clamp(20px, 5vw, 30px);
    line-height: 1.1;
}

.gas-block-article-header__meta,
.gas-block-article-header__subtitle {
    margin: 0;
    color: var(--gas-color-text-muted, #4a4a4a);
}

.gas-block-article-header--compact .gas-block-article-header__title,
.gas-block-article-header--title_only .gas-block-article-header__title {
    font-size: clamp(17.5px, 4vw, 23.5px);
}

/* Variantes de style — écrites à l'audit des previews (2026-07-19) : les six
   classes ci-dessous étaient émises par le renderer SANS aucune règle CSS,
   d'où huit previews identiques et le « --band ne rend aucune bande » relevé
   dès la session 1 (§4.13). `--hero` est le rendu de base : pas de règle. */

/* compact : image réduite, en-tête resserré pour flux denses. */
.gas-block-article-header--compact .gas-block-article-header__image {
    max-height: 180px;
    object-fit: cover;
}

/* title_only : texte pur — aucun média même si une image est fournie. */
.gas-block-article-header--title_only .gas-block-article-header__media {
    display: none;
}

/* overlay : titre posé sur l'image, voile sombre pour la lisibilité. */
.gas-block-article-header--overlay {
    position: relative;
}
.gas-block-article-header--overlay .gas-block-article-header__image {
    min-height: 280px;
    object-fit: cover;
}
.gas-block-article-header--overlay .gas-block-article-header__content {
    position: absolute;
    inset: auto 0 0 0;
    padding: var(--gas-space-6, 24px);
    background: linear-gradient(to top, rgb(0 0 0 / 0.62), rgb(0 0 0 / 0));
    border-radius: 0 0 var(--gas-radius-lg, 7.5px) var(--gas-radius-lg, 7.5px);
}
.gas-block-article-header--overlay .gas-block-article-header__title,
.gas-block-article-header--overlay .gas-block-article-header__meta,
.gas-block-article-header--overlay .gas-block-article-header__subtitle {
    color: var(--gas-white, #fff);
}

/* split : texte d'un côté, image de l'autre (empilé sous 720px). */
@container (min-width: 720px) {
    .gas-block-article-header--split {
        grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
        align-items: center;
        gap: var(--gas-space-6, 24px);
    }
    .gas-block-article-header--split .gas-block-article-header__media {
        order: 2;
    }
}
.gas-block-article-header--split .gas-block-article-header__image {
    height: 100%;
    object-fit: cover;
}

/* band : pas de photo — titre sur une bande de couleur token. */
.gas-block-article-header--band .gas-block-article-header__media {
    display: none;
}
.gas-block-article-header--band .gas-block-article-header__content {
    background: var(--gas-primary-ultra-light, #eef4f8);
    border-inline-start: 4px solid var(--gas-primary, #26414e);
    border-radius: var(--gas-radius-m, 8px);
    padding: var(--gas-space-6, 24px);
}

/* card : en-tête encarté, détaché du fond de page. */
.gas-block-article-header--card {
    background: var(--gas-bg-surface, #fff);
    border: 1px solid var(--gas-border-subtle, #e3e3e3);
    border-radius: var(--gas-radius-lg, 12px);
    box-shadow: var(--gas-shadow-m, 0 2px 8px rgb(0 0 0 / 0.06));
    padding: var(--gas-space-6, 24px);
}

/* offset : image décalée, contenu en contrepoint sur carte chevauchante. */
.gas-block-article-header--offset .gas-block-article-header__media {
    margin-inline-end: var(--gas-space-8, 32px);
}
.gas-block-article-header--offset .gas-block-article-header__content {
    background: var(--gas-bg-surface, #fff);
    border-radius: var(--gas-radius-lg, 12px);
    box-shadow: var(--gas-shadow-m, 0 2px 8px rgb(0 0 0 / 0.06));
    padding: var(--gas-space-5, 20px);
    margin-top: calc(-1 * var(--gas-space-8, 32px));
    margin-inline-start: var(--gas-space-8, 32px);
    position: relative;
}
/* @gas:block article_header end *//* @gas:block paywall_gate start */




.gas-block-paywall-gate--unlocked {
    display: grid;
    gap: var(--gas-space-4, 10px);
}
/* @gas:block paywall_gate end *//* @gas:block related_articles start */




.gas-block-related-articles {
    display: grid;
    gap: var(--gas-space-4, 10px);
}
/* @gas:block related_articles end */

.gas-gated-placeholder {
    display: grid;
    gap: var(--gas-space-3, 7.5px);
    justify-items: start;
    padding: var(--gas-space-4, 10px);
    border: 1px dashed var(--gas-color-border, #d0d0d0);
    border-radius: var(--gas-radius-md, 5px);
    background: var(--gas-color-surface-soft, #f8f8f8);
}

.gas-gated-placeholder__icon {
    font-size: 11.5px;
    line-height: 1;
}

.gas-gated-placeholder__message {
    margin: 0;
    color: var(--gas-color-text, #161616);
}

.gas-gated-placeholder__action {
    margin-top: var(--gas-space-1, 2.5px);
}

.gas-gated-placeholder__loading {
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-2, 5px);
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-s, 14px);
}

.gas-gated-placeholder__spinner {
    width: 9px;
    height: 9px;
    border: 2px solid var(--gas-color-border, #d0d0d0);
    border-top-color: var(--gas-color-primary, #1a73e8);
    border-radius: 50%;
    animation: gas-gated-spinner 0.8s linear infinite;
}

.gas-gated-placeholder__error {
    margin: 0;
    color: var(--gas-color-danger, #c62828);
    font-size: var(--gas-text-s, 14px);
}

.gas-gated-placeholder--unlocked {
    border-style: solid;
    border-color: var(--gas-color-success, #2e7d32);
    background: var(--gas-color-surface, #fff);
    animation: gas-gated-unlock-fade 0.2s ease-out;
}

@keyframes gas-gated-spinner {
    to {
        transform: rotate(360deg);
    }
}

@keyframes gas-gated-unlock-fade {
    from {
        opacity: 0.35;
    }
    to {
        opacity: 1;
    }
}

.gas-block-features-grid__grid,
.gas-block-stats__grid,
.gas-block-team-grid__grid,
.gas-block-logo-cloud__grid,
.gas-block-gallery__grid {
    display: grid;
    gap: var(--gas-space-4, 10px);
}

.gas-block-features-grid--cols-2 .gas-block-features-grid__grid,
.gas-block-team-grid--cols-2 .gas-block-team-grid__grid,
.gas-block-gallery--cols-2 .gas-block-gallery__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gas-block-features-grid--cols-3 .gas-block-features-grid__grid,
.gas-block-team-grid--cols-3 .gas-block-team-grid__grid,
.gas-block-gallery--cols-3 .gas-block-gallery__grid,
.gas-block-logo-cloud--cols-3 .gas-block-logo-cloud__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gas-block-features-grid--cols-4 .gas-block-features-grid__grid,
.gas-block-team-grid--cols-4 .gas-block-team-grid__grid,
.gas-block-gallery--cols-4 .gas-block-gallery__grid,
.gas-block-logo-cloud--cols-4 .gas-block-logo-cloud__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}/* @gas:block logo_cloud start */


.gas-block-logo-cloud--cols-5 .gas-block-logo-cloud__grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.gas-block-logo-cloud--cols-6 .gas-block-logo-cloud__grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}
/* @gas:block logo_cloud end */

.gas-block-features-grid__item,
.gas-block-stats__item,
.gas-block-team-grid__item,
.gas-block-testimonials__item,
.gas-block-info-box,
.gas-block-file-download__inner,
.gas-block-faq__item {
    background: var(--gas-color-surface, #fff);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-md, 5px);
    padding: var(--gas-space-4, 10px);
}/* @gas:block image_text_split start */

/* Titre : suit l'identité typo heading du tenant (--gas-font-family-heading). */
.gas-block-image-text-split__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
}


.gas-block-image-text-split__inner {
    display: grid;
    gap: var(--gas-space-5, 12.5px);
    align-items: center;
}

.gas-block-image-text-split--right .gas-block-image-text-split__media {
    order: 2;
}

.gas-block-image-text-split--sticky-media .gas-block-image-text-split__media {
    position: sticky;
    top: var(--gas-space-6, 15px);
    align-self: start;
}

.gas-block-image-text-split__image {
    display: block;
    width: 100%;
    height: auto;
    /* Garde-fou : les photos portrait (768×1024…) atteignent ~950px à leur
       hauteur native et déséquilibrent la section. On borne et on recadre
       (cover). Les images plus basses que le cap ne sont pas affectées. */
    max-height: 560px;
    object-fit: cover;
    border-radius: var(--gas-radius-md, 5px);
}

/* Label vertical pivoté sur le bord extérieur de la colonne de contenu. */
.gas-block-image-text-split--has-side-label .gas-block-image-text-split__content {
    display: flex;
    align-items: stretch;
    gap: var(--gas-space-4, 10px);
}

.gas-block-image-text-split__side-label {
    flex: 0 0 auto;
    margin: 0;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    font-size: var(--gas-text-xs, 7.5px);
    font-weight: 600;
    color: var(--gas-color-text-muted, #6b7280);
    white-space: nowrap;
}

.gas-block-image-text-split__content-body {
    flex: 1 1 auto;
    min-width: 0;
}

/* Rectangle décoratif décalé derrière l'image (effet quinconce). */
.gas-block-image-text-split--decor-panel .gas-block-image-text-split__media {
    position: relative;
    /* Sans stacking context local, le ::before en z-index:-1 passe DERRIÈRE le
       fond de tout wrapper ancêtre (ordre de peinture : z<0 avant les fonds des
       descendants en flux) : le panneau était invisible dès qu'un conteneur —
       page preview, carte, section à fond — posait un background. Vérifié au
       pixel (audit 2026-07-19). `isolation` confine le z-négatif au média. */
    isolation: isolate;
}

.gas-block-image-text-split--decor-panel .gas-block-image-text-split__media::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: calc(var(--gas-space-6, 15px) * -1);
    bottom: var(--gas-space-6, 15px);
    left: calc(var(--gas-space-6, 15px) * -1);
    right: var(--gas-space-6, 15px);
    border-radius: var(--gas-radius-lg, 7.5px);
    background: var(--gas-its-decor, var(--gas-color-primary-soft, #d8eefb));
}

/* L'image à droite => décor décalé vers le coin extérieur droit. */
.gas-block-image-text-split--decor-panel.gas-block-image-text-split--right .gas-block-image-text-split__media::before {
    left: var(--gas-space-6, 15px);
    right: calc(var(--gas-space-6, 15px) * -1);
}

.gas-block-image-text-split--decor-primary {
    --gas-its-decor: var(--gas-color-primary-soft, #d8eefb);
}

.gas-block-image-text-split--decor-accent {
    --gas-its-decor: var(--gas-color-accent-soft, #f6e2d8);
}

.gas-block-image-text-split--decor-secondary {
    --gas-its-decor: var(--gas-color-secondary-soft, #e6e2f3);
}

.gas-block-image-text-split--decor-neutral {
    --gas-its-decor: var(--gas-color-surface-muted, #f0f1f3);
}

/* Mobile : le label vertical reprend un flux horizontal lisible. */
@media (max-width: 768px) {
    .gas-block-image-text-split--has-side-label .gas-block-image-text-split__content {
        flex-direction: column;
        gap: var(--gas-space-2, 5px);
    }

    .gas-block-image-text-split__side-label {
        writing-mode: horizontal-tb;
        transform: none;
    }
}
/* @gas:block image_text_split end */

/* featured_news : contraint dans le conteneur du site (heading + slot). */
.gas-block-featured_news {
    max-width: var(--gas-container, 1100px);
    margin-inline: auto;
    padding-inline: var(--gas-section-padding-x, var(--gas-space-l, 15px));
}

.gas-block-shop-catalog__inner,
.gas-block-placement-slot__inner {
    display: grid;
    gap: var(--gas-space-4, 10px);
}

.gas-block-shop-catalog--grid-2 .gas-block-shop-catalog__inner,
.gas-block-placement-slot--grid-2 .gas-block-placement-slot__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gas-block-shop-catalog--grid-3 .gas-block-shop-catalog__inner,
.gas-block-placement-slot--grid-3 .gas-block-placement-slot__inner {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gas-block-shop-catalog--grid-4 .gas-block-shop-catalog__inner,
.gas-block-placement-slot--grid-4 .gas-block-placement-slot__inner {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gas-block-shop-catalog--list .gas-block-shop-catalog__inner,
.gas-block-placement-slot--list .gas-block-placement-slot__inner,
.gas-block-placement-slot--carousel .gas-block-placement-slot__inner {
    grid-template-columns: 1fr;
}/* @gas:block placement_slot start */


.gas-block-placement-slot--cards-media-left .gas-block-placement-slot__inner,
.gas-block-placement-slot--cards-media-right .gas-block-placement-slot__inner,
.gas-block-placement-slot--cards-text-only .gas-block-placement-slot__inner {
    grid-template-columns: 1fr;
}
/* @gas:block placement_slot end *//* @gas:block shop_catalog start */



.gas-block-shop-catalog__item {
    background: var(--gas-color-surface, #fff);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-md, 5px);
    padding: var(--gas-space-4, 10px);
}

.gas-block-shop-catalog__link {
    display: grid;
    gap: var(--gas-space-2, 5px);
    color: inherit;
    text-decoration: none;
}

.gas-block-shop-catalog__image {
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-sm, 3.75px);
    display: block;
}

.gas-block-shop-catalog__title {
    margin: 0;
}

.gas-block-shop-catalog__price {
    margin: 0;
    color: var(--gas-color-text-muted, #4a4a4a);
}

/* V3-B — filtres client sur dataset exporté */
.gas-block-shop-catalog__filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-m, 16px);
    margin-bottom: var(--gas-space-l, 24px);
}

.gas-block-shop-catalog__filter {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-xs, 4px);
    font-size: var(--gas-font-size-sm, 0.875rem);
}

.gas-block-shop-catalog__filter select {
    min-width: 12rem;
    padding: var(--gas-space-xs, 4px) var(--gas-space-s, 8px);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-m, 4px);
    background: var(--gas-color-surface, #fff);
}

.gas-block-shop-catalog__bucket {
    margin: 0;
    font-size: var(--gas-font-size-sm, 0.875rem);
    color: var(--gas-color-text-muted, #4a4a4a);
}

.gas-block-shop-catalog__empty {
    margin-top: var(--gas-space-m, 16px);
    color: var(--gas-color-text-muted, #4a4a4a);
}
/* @gas:block shop_catalog end *//* @gas:block shop_product start */

/* shop_product — buy-box d'un produit embarquable (D9) */
.gas-block-shop-product {
    display: grid;
    gap: var(--gas-space-m, 16px);
    padding: var(--gas-space-l, 24px);
    background: var(--gas-color-surface, #fff);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-l, 8px);
}

.gas-block-shop-product__title {
    margin: 0;
    font-size: var(--gas-font-size-h3, 1.25rem);
}

.gas-block-shop-product__title-link {
    color: inherit;
    text-decoration: none;
}

.gas-block-shop-product__title-link:hover {
    text-decoration: underline;
}

.gas-block-shop-product__price {
    margin: 0;
    font-weight: 600;
    font-size: var(--gas-font-size-lg, 1.125rem);
}

.gas-block-shop-product__bucket {
    margin: 0;
    font-size: var(--gas-font-size-sm, 0.875rem);
    color: var(--gas-color-text-muted, #4a4a4a);
}

.gas-block-shop-product__image {
    max-width: 100%;
    height: auto;
    border-radius: var(--gas-radius-m, 4px);
}

.gas-block-shop-product__description {
    color: var(--gas-color-text-muted, #4a4a4a);
}

/* V3-B — variantes snapshot (pas d'achat statique) */
.gas-block-shop-product__variants {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--gas-space-xs, 4px);
}

.gas-block-shop-product__variant {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-s, 8px);
    align-items: baseline;
    padding: var(--gas-space-xs, 4px) 0;
    border-bottom: 1px solid var(--gas-color-border, #e0e0e0);
    font-size: var(--gas-font-size-sm, 0.875rem);
}

.gas-block-shop-product__variant[data-availability="unavailable"] {
    opacity: 0.55;
}

.gas-block-shop-product__variant-price {
    font-weight: 600;
}

.gas-block-shop-product__variant-bucket {
    color: var(--gas-color-text-muted, #4a4a4a);
}

.gas-block-shop-product__buybox {
    min-height: 48px;
}

.gas-block-shop-product__error,
.gas-block-shop-product__unavailable {
    color: var(--gas-color-danger, #b00020);
}

.gas-shop-product__document {
    margin-top: var(--gas-space-xl, 32px);
}

.gas-shop-product-form__loading {
    text-align: center;
    padding: var(--gas-space-l, 24px);
    color: var(--gas-color-text-muted, #4a4a4a);
}

/* @gas:block shop_product end *//* @gas:block rental_catalog start */




/* rental_catalog — catalogue de matériel louable (module location) */
.gas-block-rental-catalog__inner {
    display: grid;
    gap: var(--gas-space-m, 10px);
}

.gas-block-rental-catalog--grid-2 .gas-block-rental-catalog__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gas-block-rental-catalog--grid-3 .gas-block-rental-catalog__inner {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gas-block-rental-catalog--grid-4 .gas-block-rental-catalog__inner {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gas-block-rental-catalog--list .gas-block-rental-catalog__inner {
    grid-template-columns: 1fr;
}

.gas-block-rental-catalog__card {
    display: grid;
    gap: var(--gas-space-s, 5px);
    align-content: start;
    background: var(--gas-color-surface, #fff);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-l, 7.5px);
    padding: var(--gas-space-m, 10px);
}

.gas-block-rental-catalog__media {
    display: block;
    border-radius: var(--gas-radius-m, 5px);
    overflow: hidden;
}

.gas-block-rental-catalog__media img {
    width: 100%;
    height: auto;
    display: block;
}

.gas-block-rental-catalog__title {
    margin: 0;
    font-size: var(--gas-text-m, 10px);
}

.gas-block-rental-catalog__title a {
    color: inherit;
    text-decoration: none;
}

.gas-block-rental-catalog__desc {
    margin: 0;
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-s, 8.75px);
}

.gas-block-rental-catalog__price {
    margin: 0;
    font-weight: var(--gas-weight-semi, 600);
}
/* @gas:block rental_catalog end *//* @gas:block toc start */




.gas-block-toc {
    padding: var(--gas-space-3, 7.5px);
    border-left: 2px solid var(--gas-color-border, #d0d0d0);
}

.gas-block-toc__list {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.gas-block-toc__item + .gas-block-toc__item {
    margin-top: var(--gas-space-2, 5px);
}

.gas-block-toc__item--level-3 {
    padding-left: var(--gas-space-3, 7.5px);
}

.gas-block-toc__link {
    color: var(--gas-color-text, #161616);
    text-decoration: none;
}

.gas-block-toc__link:hover,
.gas-block-toc__link:focus {
    text-decoration: underline;
}

.gas-block-toc--sticky {
    position: sticky;
    top: var(--gas-space-4, 10px);
    align-self: start;
    max-height: calc(100vh - var(--gas-space-8, 20px));
    overflow-y: auto;
}
/* @gas:block toc end */

.gas-block-image-text-split__actions,
.gas-block-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-3, 7.5px);
    margin-top: var(--gas-space-4, 10px);
}/* @gas:block stats start */


.gas-block-stats--inline .gas-block-stats__grid {
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}

.gas-block-stats__value {
    margin: 0;
    font-size: clamp(15px, 2.5vw, 20px);
    font-weight: 700;
}

.gas-block-stats__label {
    margin: var(--gas-space-1, 2.5px) 0 0;
    color: var(--gas-color-text-muted, #4a4a4a);
}
/* cards vs inline se confondaient : seule la taille de minmax différait
   (audit 2026-07-19). cards = items en carte ; inline = rangée compacte à
   séparateurs verticaux. */
.gas-block-stats--cards .gas-block-stats__item {
    background: var(--gas-bg-surface, #fff);
    border: 1px solid var(--gas-border-subtle, #e3e3e3);
    border-radius: var(--gas-radius-m, 8px);
    padding: var(--gas-space-5, 20px);
}
.gas-block-stats--inline .gas-block-stats__grid {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--gas-space-6, 24px);
}
.gas-block-stats--inline .gas-block-stats__item {
    padding-inline-end: var(--gas-space-6, 24px);
    border-inline-end: 1px solid var(--gas-border-subtle, #e3e3e3);
}
.gas-block-stats--inline .gas-block-stats__item:last-child {
    border-inline-end: 0;
    padding-inline-end: 0;
}
/* @gas:block stats end */

.gas-block-team-grid__avatar img,
.gas-block-testimonials__avatar img,
.gas-block-logo-cloud__item img,
.gas-block-gallery__item img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-sm, 3.75px);
}/* @gas:block gallery start */


.gas-block-gallery__item[data-gallery-lqip] {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 46%),
        var(--gas-gallery-placeholder-color, var(--gas-color-surface-muted, #edf2f7));
    overflow: hidden;
}

.gas-block-gallery.is-lqip-ready .gas-block-gallery__item[data-gallery-lqip] img {
    opacity: 0.9;
    filter: blur(10px);
    transform: scale(1.015);
    transition:
        opacity 0.45s ease,
        filter 0.45s ease,
        transform 0.45s ease;
}

.gas-block-gallery.is-lqip-ready .gas-block-gallery__item[data-gallery-lqip] img.is-loaded {
    opacity: 1;
    filter: blur(0);
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .gas-block-gallery.is-lqip-ready .gas-block-gallery__item[data-gallery-lqip] img {
        opacity: 1;
        filter: none;
        transform: none;
        transition: none;
    }
}
/* @gas:block gallery end *//* @gas:block testimonials start */


/* Titre : suit l'identité typo heading du tenant (--gas-font-family-heading). */
.gas-block-testimonials__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
}


/* ── testimonials : taille des avatars (hors avatar vedette, cercle fixe) + note étoilée ── */
.gas-block-testimonials__avatar:not(.gas-block-testimonials__featured-avatar) {
    width: 60px;
}
.gas-block-testimonials--avatar-small .gas-block-testimonials__avatar:not(.gas-block-testimonials__featured-avatar) {
    width: 40px;
}
.gas-block-testimonials--avatar-large .gas-block-testimonials__avatar:not(.gas-block-testimonials__featured-avatar) {
    width: 80px;
}
.gas-block-testimonials__rating {
    margin: 0 0 var(--gas-space-2, 5px);
    line-height: 1;
    letter-spacing: 0.08em;
    font-size: var(--gas-text-m, 16px);
}
.gas-block-testimonials__rating-on {
    color: var(--gas-warning, #f59e0b);
}
.gas-block-testimonials__rating-off {
    color: var(--gas-color-border, #d1d5db);
}
/* @gas:block testimonials end *//* @gas:block accordion start */




.gas-block-accordion__items {
    border-top: 1px solid var(--gas-color-border, #e2e8f0);
}

.gas-block-accordion__item {
    border-bottom: 1px solid var(--gas-color-border, #e2e8f0);
}

.gas-block-accordion__item + .gas-block-accordion__item {
    margin-top: 0;
}

.gas-block-accordion__question {
    width: 100%;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: start;
    cursor: pointer;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: var(--gas-space-4, 10px) 0;
    list-style: none;
}

.gas-block-accordion__question:focus-visible {
    outline: 2px solid var(--gas-color-focus, var(--gas-primary, #2563eb));
    outline-offset: 3px;
}

.gas-block-accordion__question::after {
    content: "";
    flex: 0 0 auto;
    width: 6px;
    height: 6px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-1.5px);
    transition: transform 0.2s var(--gas-ease-standard, ease);
    opacity: 0.45;
}

.gas-block-accordion__item.is-open .gas-block-accordion__question::after {
    transform: rotate(-135deg) translateY(-1.5px);
}

.gas-block-accordion__answer-wrapper {
    display: grid;
    grid-template-rows: 0fr;
}

@media (prefers-reduced-motion: no-preference) {
    .gas-block-accordion__answer-wrapper {
        transition: grid-template-rows 280ms var(--gas-ease-out, ease-out);
    }
}

.gas-block-accordion__item.is-open .gas-block-accordion__answer-wrapper {
    grid-template-rows: 1fr;
}

.gas-block-accordion__answer {
    overflow: hidden;
    min-height: 0;
    margin-top: 0;
    padding: 0 0 var(--gas-space-4, 10px);
    color: var(--gas-color-text-muted, #64748b);
    line-height: 1.65;
}

/* Styles bordered / filled : encadré complet, pas de filet de base, espacement entre items */
.gas-block-accordion--style-bordered .gas-block-accordion__items,
.gas-block-accordion--style-filled .gas-block-accordion__items {
    border-top: 0;
    display: grid;
    gap: var(--gas-space-3, 7.5px);
}

.gas-block-accordion--style-bordered .gas-block-accordion__question,
.gas-block-accordion--style-filled .gas-block-accordion__question {
    padding: var(--gas-space-3, 9px) 0;
}

.gas-block-accordion--style-bordered .gas-block-accordion__answer,
.gas-block-accordion--style-filled .gas-block-accordion__answer {
    padding-bottom: var(--gas-space-3, 9px);
}
/* @gas:block accordion end *//* @gas:block testimonials start */




.gas-block-testimonials__track {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: var(--gas-space-4, 10px);
}

.gas-block-testimonials--carousel .gas-block-testimonials__track {
    display: flex;
    transition: transform 0.25s var(--gas-ease-standard, ease);
    overflow: hidden;
}

.gas-block-testimonials--carousel .gas-block-testimonials__item {
    min-width: 100%;
}

.gas-block-testimonials__controls {
    display: flex;
    gap: var(--gas-space-2, 5px);
    margin-top: var(--gas-space-3, 7.5px);
}

.gas-block-testimonials--engine-embla {
    padding: clamp(28px, 5vw, 64px);
    background: #f4efe4;
    color: #171512;
    border: 1px solid color-mix(in srgb, #171512 10%, transparent);
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__inner {
    max-width: min(1120px, 100%);
    margin-inline: auto;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__title {
    margin-bottom: clamp(24px, 4vw, 44px);
    color: #171512;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__viewport {
    position: relative;
    overflow: hidden;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__track {
    position: relative;
    display: flex;
    gap: 0;
    overflow: visible;
    transition: none;
    will-change: transform;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__item {
    flex: 0 0 100%;
    min-width: 100%;
    max-width: 100%;
    display: grid;
    grid-template-columns: minmax(190px, 0.34fr) minmax(0, 1fr);
    align-items: stretch;
    overflow: hidden;
    min-height: 340px;
    background: #fffdf7;
    border: 1px solid color-mix(in srgb, #171512 12%, transparent);
    border-radius: 8px;
    color: #171512;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__avatar {
    width: auto;
    min-height: 100%;
    margin: 0;
    background: #171512;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__avatar img,
.gas-block-testimonials--engine-embla .gas-block-testimonials__avatar picture {
    width: 100%;
    height: 100%;
    min-height: 340px;
    display: block;
    object-fit: cover;
    border-radius: 0;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__quote,
.gas-block-testimonials--engine-embla .gas-block-testimonials__author,
.gas-block-testimonials--engine-embla .gas-block-testimonials__role,
.gas-block-testimonials--engine-embla .gas-block-testimonials__rating {
    color: #171512;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__quote {
    position: relative;
    max-width: 760px;
    margin: 0;
    padding: clamp(42px, 6vw, 78px) clamp(30px, 6vw, 78px) 0;
    font-family: 'Iowan Old Style', Georgia, 'Palatino Linotype', Palatino, 'Times New Roman', serif;
    font-size: clamp(24px, 3.2vw, 40px);
    line-height: 1.25;
    font-style: normal;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__quote::before {
    content: "“";
    position: absolute;
    inset-block-start: 16px;
    inset-inline-start: clamp(28px, 5vw, 60px);
    color: #c9941a;
    font-size: clamp(54px, 8vw, 92px);
    line-height: 1;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__author {
    margin: clamp(22px, 4vw, 36px) clamp(30px, 6vw, 78px) 0;
    font-size: var(--gas-text-m, 10px);
    font-weight: 700;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__role {
    margin: 4px clamp(30px, 6vw, 78px) clamp(34px, 5vw, 64px);
    color: color-mix(in srgb, #171512 68%, transparent);
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__rating {
    position: absolute;
    margin: clamp(22px, 4vw, 34px) 0 0 clamp(30px, 6vw, 78px);
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__controls {
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__controls .gas-button {
    width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0;
    border-radius: 999px;
    border-color: #171512;
    background: #171512;
    color: #fffdf7;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__dot {
    width: 34px;
    height: 3px;
    border-radius: 999px;
    background: #171512;
    opacity: 0.22;
}

.gas-block-testimonials--engine-embla .gas-block-testimonials__dot.is-active {
    opacity: 1;
    transform: none;
}

.gas-block-testimonials__dot:focus-visible {
    outline: 2px solid var(--gas-primary, #2563eb);
    outline-offset: 2px;
}

@media (max-width: 760px) {
    .gas-block-testimonials--engine-embla {
        padding: 20px;
    }

    .gas-block-testimonials--engine-embla .gas-block-testimonials__item {
        grid-template-columns: 1fr;
    }

    .gas-block-testimonials--engine-embla .gas-block-testimonials__avatar,
    .gas-block-testimonials--engine-embla .gas-block-testimonials__avatar img,
    .gas-block-testimonials--engine-embla .gas-block-testimonials__avatar picture {
        min-height: 220px;
        aspect-ratio: 16 / 10;
    }
}
/* @gas:block testimonials end *//* @gas:block info_box start */




.gas-block-info-box--info {
    border-left: 4px solid var(--gas-color-primary, #1a73e8);
}

.gas-block-info-box--success {
    border-left: 4px solid var(--gas-color-success, #2e7d32);
}

.gas-block-info-box--warning {
    border-left: 4px solid var(--gas-color-warning, #f9a825);
}

.gas-block-info-box--danger {
    border-left: 4px solid var(--gas-color-danger, #c62828);
}
/* @gas:block info_box end *//* @gas:block quote start */




.gas-block-quote {
    margin: var(--gas-space-6, 20px) auto;
    max-width: min(100%, 520px);
    border-left: 4px solid var(--gas-color-border, #d0d0d0);
    padding: var(--gas-space-4, 10px);
    color: var(--gas-color-text, #161616);
}

.gas-block-quote--highlight {
    background: var(--gas-color-primary-soft, #eef7ff);
    border-left-color: var(--gas-color-primary, #1a73e8);
}
/* @gas:block quote end *//* @gas:block gallery start */




/* Lightbox = élément <dialog> natif (showModal) : top-layer, focus trap, Escape
   et restauration du focus gérés par le navigateur. Le voile passe par ::backdrop.
   Fermé = display:none natif ; ouvert via [open]. */
.gas-block-gallery-lightbox {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    margin: 0;
    border: 0;
    padding: var(--gas-space-4, 10px);
    background: transparent;
    color: inherit;
    overflow: hidden;
}

.gas-block-gallery-lightbox[open] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--gas-space-2, 5px);
}

.gas-block-gallery-lightbox::backdrop {
    background: var(--gas-topbar-bg);
}

/* Entrée animée du dialog (radar §6 : @starting-style). Auto-dégradant : un
   navigateur sans @starting-style ignore le bloc → apparition sèche actuelle.
   Pas d'animation de sortie (elle exigerait allow-discrete + délai de close). */
@media (prefers-reduced-motion: no-preference) {
    .gas-block-gallery-lightbox[open] {
        opacity: 1;
        transform: scale(1);
        transition:
            opacity var(--gas-duration-fast, 200ms) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1)),
            transform var(--gas-duration-fast, 200ms) var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1));
    }
    @starting-style {
        .gas-block-gallery-lightbox[open] {
            opacity: 0;
            transform: scale(0.97);
        }
    }
    .gas-block-gallery-lightbox[open]::backdrop {
        opacity: 1;
        transition: opacity var(--gas-duration-fast, 200ms) var(--gas-ease-standard, ease);
    }
    @starting-style {
        .gas-block-gallery-lightbox[open]::backdrop {
            opacity: 0;
        }
    }
}

.gas-block-gallery-lightbox__img {
    max-width: min(100%, 700px);
    max-height: 80vh;
    width: auto;
    height: auto;
}

.gas-block-gallery-lightbox__media {
    display: grid;
    place-items: center;
    max-width: min(94vw, 1100px);
}

.gas-block-gallery-lightbox__video,
.gas-block-gallery-lightbox__iframe {
    width: min(94vw, 1100px);
    max-height: 80vh;
    aspect-ratio: 16 / 9;
    border: 0;
    border-radius: var(--gas-radius-md, 5px);
    background: #000;
}

.gas-block-gallery-lightbox__zoom {
    border: 0;
    padding: 0;
    background: transparent;
    cursor: zoom-in;
    touch-action: manipulation;
}

.gas-block-gallery-lightbox__zoom.is-zoomed {
    cursor: grab;
    touch-action: none;
}

.gas-block-gallery-lightbox__zoom.is-zoomed .gas-block-gallery-lightbox__img {
    max-width: min(94vw, 1400px);
    max-height: none;
    transform-origin: center;
    transition: transform 0.12s ease-out;
    will-change: transform;
}

.gas-block-gallery-lightbox__zoom:focus-visible,
.gas-block-gallery-lightbox__close:focus-visible,
.gas-block-gallery-lightbox__nav:focus-visible {
    outline: 2px solid var(--gas-text-color-inverse);
    outline-offset: 3px;
}

.gas-block-gallery-lightbox__caption {
    color: var(--gas-text-color-inverse);
    margin: 0;
}
.gas-block-gallery-lightbox__credit {
    margin: 0;
    color: color-mix(in srgb, var(--gas-text-color-inverse) 72%, transparent);
    font-size: var(--gas-text-xs, 12px);
    text-align: center;
}
.gas-block-gallery-lightbox__filmstrip {
    display: flex;
    max-width: min(94vw, 720px);
    gap: var(--gas-space-xs, 6px);
    overflow-x: auto;
    padding-bottom: var(--gas-space-xs, 4px);
}
.gas-block-gallery-lightbox__thumb {
    position: relative;
    flex: 0 0 45px;
    aspect-ratio: 4 / 3;
    border: 2px solid transparent;
    border-radius: var(--gas-radius-s, 4px);
    padding: 0;
    overflow: hidden;
    background: var(--gas-color-surface-muted, #eef2f7);
    cursor: pointer;
}
.gas-block-gallery-lightbox__thumb.is-active {
    border-color: var(--gas-primary, #2563eb);
}
.gas-block-gallery-lightbox__thumb img,
.gas-block-gallery-lightbox__thumb picture {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.gas-block-gallery-lightbox__thumb-play {
    position: absolute;
    inset: 50% auto auto 50%;
    color: var(--gas-text-color-inverse);
    font-size: 8.5px;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
    transform: translate(-50%, -50%);
}

.gas-block-gallery-lightbox__close {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 20px;
    line-height: 1;
    background: transparent;
    border: 0;
    color: var(--gas-text-color-inverse);
    cursor: pointer;
}

/* Lightbox : navigation précédent/suivant + compteur (album parcourable). */
.gas-block-gallery-lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 50%;
    background: color-mix(in srgb, var(--gas-text-color-inverse) 15%, transparent);
    color: var(--gas-text-color-inverse);
    font-size: 17.5px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gas-block-gallery-lightbox__nav:hover {
    background: color-mix(in srgb, var(--gas-text-color-inverse) 28%, transparent);
}
.gas-block-gallery-lightbox__nav--prev { left: 10px; }
.gas-block-gallery-lightbox__nav--next { right: 10px; }
.gas-block-gallery-lightbox__counter {
    color: var(--gas-text-color-inverse);
    font-size: var(--gas-text-s, 8.75px);
    opacity: 0.85;
    margin: 0;
}
.gas-block-gallery-lightbox__nav[hidden] { display: none; }

/* ===== gallery layout=feature : mosaïque « 1 grande tuile + vignettes » ===== */
.gas-block-gallery--layout-feature .gas-block-gallery__grid {
    grid-template-columns: 1fr;
    gap: var(--gas-space-3, 7.5px);
}
.gas-block-gallery--layout-feature .gas-block-gallery__item {
    position: relative;
    margin: 0;
    aspect-ratio: 1 / 1;
    border-radius: var(--gas-radius-md, 5px);
    overflow: hidden;
}
.gas-block-gallery--layout-feature .gas-block-gallery__link {
    display: block;
    width: 100%;
    height: 100%;
}
.gas-block-gallery--layout-feature .gas-block-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
}
.gas-block-gallery__media-placeholder {
    display: block;
    width: 100%;
    min-height: 100%;
    aspect-ratio: 4 / 3;
    border-radius: var(--gas-radius-md, 5px);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 45%),
        var(--gas-color-surface-muted, #eef2f7);
}
.gas-block-gallery__link {
    position: relative;
    display: block;
}
.gas-block-gallery__play-badge {
    position: absolute;
    inset: 50% auto auto 50%;
    display: grid;
    place-items: center;
    inline-size: 32.5px;
    block-size: 32.5px;
    border-radius: var(--gas-radius-full, 999px);
    background: color-mix(in srgb, var(--gas-color-surface-card, #fff) 88%, transparent);
    color: var(--gas-primary, #2563eb);
    box-shadow: var(--gas-shadow-m, 0 10px 28px rgba(15, 23, 42, 0.22));
    transform: translate(-50%, -50%);
    transition: transform var(--gas-transition-fast, 0.16s ease), background var(--gas-transition-fast, 0.16s ease);
    pointer-events: none;
}
.gas-block-gallery__link:hover .gas-block-gallery__play-badge {
    background: var(--gas-color-surface-card, #fff);
    transform: translate(-50%, -50%) scale(1.06);
}

.gas-block-gallery--layout-hotspots .gas-block-gallery__grid {
    display: block;
}

.gas-block-gallery--layout-hotspots .gas-block-gallery__item {
    position: relative;
    max-width: min(100%, 980px);
    margin-inline: auto;
    border-radius: var(--gas-radius-lg, 8px);
    overflow: visible;
}

.gas-block-gallery--layout-hotspots .gas-block-gallery__link {
    overflow: hidden;
    border-radius: inherit;
}

.gas-block-gallery__hotspots {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.gas-block-gallery__hotspot {
    position: absolute;
    z-index: 2;
    inline-size: 12.5px;
    block-size: 12.5px;
    padding: 0;
    border: 2px solid var(--gas-color-surface-card, #fff);
    border-radius: var(--gas-radius-full, 999px);
    background: var(--gas-primary, #2563eb);
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--gas-primary, #2563eb) 42%, transparent), var(--gas-shadow-m, 0 10px 28px rgba(15, 23, 42, 0.22));
    transform: translate(-50%, -50%);
    cursor: pointer;
    pointer-events: auto;
    animation: gas-gallery-hotspot-pulse 2.4s ease-out infinite;
}

.gas-block-gallery__hotspot:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--gas-primary, #2563eb) 35%, transparent);
    outline-offset: 3px;
}

.gas-block-gallery__hotspot-popover {
    max-width: min(180px, calc(100vw - 20px));
    padding: var(--gas-space-4, 10px);
    border: 1px solid var(--gas-color-border, #d1d5db);
    border-radius: var(--gas-radius-md, 5px);
    background: var(--gas-color-surface-card, #fff);
    color: var(--gas-color-text, #161616);
    box-shadow: var(--gas-shadow-l, 0 16px 40px rgba(15, 23, 42, 0.22));
}

.gas-block-gallery__hotspot-popover:popover-open {
    inset: auto;
    position: absolute;
    top: anchor(bottom);
    left: anchor(center);
    margin-block-start: 7.5px;
    transform: translateX(-50%);
}

.gas-block-gallery__hotspot-popover p {
    margin: var(--gas-space-2, 5px) 0 0;
}

.gas-block-gallery__hotspot-popover a {
    display: inline-flex;
    margin-top: var(--gas-space-3, 7.5px);
    font-weight: 700;
}

@supports not (top: anchor(bottom)) {
    .gas-block-gallery__hotspot-popover:popover-open {
        position: fixed;
        inset: 50% auto auto 50%;
        transform: translate(-50%, -50%);
    }
}
/* @gas:block gallery end */

@keyframes gas-gallery-hotspot-pulse {
    0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--gas-primary, #2563eb) 42%, transparent), var(--gas-shadow-m, 0 10px 28px rgba(15, 23, 42, 0.22)); }
    70% { box-shadow: 0 0 0 14px transparent, var(--gas-shadow-m, 0 10px 28px rgba(15, 23, 42, 0.22)); }
    100% { box-shadow: 0 0 0 0 transparent, var(--gas-shadow-m, 0 10px 28px rgba(15, 23, 42, 0.22)); }
}/* @gas:block gallery start */


@media (prefers-reduced-motion: reduce) {
    .gas-block-gallery__hotspot {
        animation: none;
    }
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__grid {
    display: grid;
    gap: clamp(20px, 6vw, 50px);
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__item {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(160px, 0.75fr);
    gap: clamp(10px, 3vw, 25px);
    align-items: center;
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__item:nth-child(even) {
    grid-template-columns: minmax(160px, 0.75fr) minmax(0, 1.25fr);
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__item:nth-child(even) .gas-block-gallery__link {
    grid-column: 2;
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__item:nth-child(even) .gas-block-gallery__essay-copy {
    grid-column: 1;
    grid-row: 1;
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__link {
    overflow: hidden;
    border-radius: var(--gas-radius-lg, 8px);
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__essay-copy {
    display: grid;
    gap: var(--gas-space-3, 7.5px);
    align-content: center;
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__caption {
    margin: 0;
    font-size: clamp(13.5px, 3vw, 24px);
    font-weight: 800;
    line-height: 1.05;
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__essay-text {
    align-self: start;
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-m, 16px);
}

@media (max-width: 760px) {
    .gas-block-gallery--layout-photo_essay .gas-block-gallery__item,
    .gas-block-gallery--layout-photo_essay .gas-block-gallery__item:nth-child(even) {
        grid-template-columns: 1fr;
    }

    .gas-block-gallery--layout-photo_essay .gas-block-gallery__item:nth-child(even) .gas-block-gallery__link,
    .gas-block-gallery--layout-photo_essay .gas-block-gallery__item:nth-child(even) .gas-block-gallery__essay-copy {
        grid-column: auto;
        grid-row: auto;
    }
}
.gas-block-gallery--layout-feature .gas-block-gallery__item.is-hidden {
    display: none;
}
.gas-block-gallery__item.is-filter-hidden {
    display: none;
}
.gas-block-gallery__filters {
    display: grid;
    gap: var(--gas-space-s);
    margin-block: var(--gas-space-m);
}
.gas-block-gallery__search {
    width: min(100%, 240px);
    min-height: 25px;
    border: 1px solid var(--gas-color-border, #d7dde8);
    border-radius: var(--gas-radius-s, 4px);
    padding: 5.5px 7.5px;
    background: var(--gas-color-surface-card, #fff);
    color: var(--gas-color-text, #1f2937);
}
.gas-block-gallery__filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-xs);
}
.gas-block-gallery__filter-chip {
    border: 1px solid var(--gas-color-border, #d7dde8);
    border-radius: var(--gas-radius-full, 999px);
    padding: 4.2px 7.5px;
    background: var(--gas-color-surface-card, #fff);
    color: var(--gas-color-text, #1f2937);
    cursor: pointer;
}
.gas-block-gallery__filter-chip.is-active {
    border-color: var(--gas-primary, #2563eb);
    background: var(--gas-primary-soft, #eff6ff);
    color: var(--gas-primary, #2563eb);
}
@container (min-width: 560px) {
    .gas-block-gallery--layout-feature .gas-block-gallery__grid {
        grid-template-columns: repeat(4, 1fr);
    }
    /* 1re image = grande tuile carrée 2×2 (l'aire est déjà carrée via les vignettes). */
    .gas-block-gallery--layout-feature .gas-block-gallery__item:first-child {
        grid-column: span 2;
        grid-row: span 2;
        aspect-ratio: auto;
    }
}
/* Calque « Voir les N photos » sur la dernière tuile visible. */
.gas-block-gallery__more {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--gas-space-2, 5px);
    background: var(--gas-bg-overlay);
    color: var(--gas-text-color-inverse);
    font-weight: 600;
    text-align: center;
    padding: var(--gas-space-3, 7.5px);
    transition: background 0.2s var(--gas-ease-standard, ease);
}
.gas-block-gallery__link:hover .gas-block-gallery__more {
    background: var(--gas-bg-overlay);
}
.gas-block-gallery__more-icon { display: block; }

/* Galerie — couche visuelle éditoriale commune aux rendus PHP et Astro. */

/* width=default : galerie bornée par le conteneur éditorial (le full-bleed
   reste le défaut historique du bloc). */
.gas-block-gallery--width-default {
    max-width: var(--gas-container, 1200px);
    margin-inline: auto;
    padding-inline: var(--gas-space-m, 16px);
}

.gas-block-gallery {
    --gas-gallery-radius: 8px;
    --gas-gallery-ink: var(--gas-color-text, #15201d);
    --gas-gallery-muted: var(--gas-text-color-muted, #5d6763);
    --gas-gallery-panel: rgba(255, 255, 255, 0.92);
    --gas-gallery-card-bg: color-mix(in srgb, #fff 94%, var(--gas-primary, #0f766e) 6%);
    --gas-gallery-card-border: color-mix(in srgb, var(--gas-color-border, #d7dde8) 78%, transparent);
    --gas-gallery-card-shadow: 0 16px 42px rgba(20, 31, 28, 0.11);
    --gas-gallery-card-shadow-hover: 0 22px 60px rgba(20, 31, 28, 0.17);
    --gas-gallery-caption-bg: linear-gradient(180deg, transparent 0%, rgba(7, 13, 18, 0.78) 100%);
    color: var(--gas-gallery-ink);
    display: grid;
    gap: clamp(16px, 2.4vw, 28px);
}
/* @gas:block gallery end */

/* Utilitaire a11y « visuellement masqué ». WordPress fournit `.screen-reader-text`
   via le thème, mais en headless (Astro/Cloudflare Pages) ce CSS de thème est absent
   → les labels destinés aux lecteurs d'écran fuient en clair (ex. libellés de groupe
   de facette du bloc card_archive « Catégories », « Localité / région » redondants
   avec la 1ʳᵉ option du <select>). On fournit donc la règle globalement dans le bundle
   de blocs, servi à la fois par WP et par Astro. */
.screen-reader-text,
.gas-block-gallery .screen-reader-text {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}/* @gas:block gallery start */


.gas-block-gallery__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    max-width: 780px;
    margin: 0 auto clamp(4px, 0.9vw, 10px);
    color: var(--gas-gallery-ink);
    font-size: clamp(17px, 3vw, 27.5px);
    line-height: 1.05;
    letter-spacing: 0;
    text-align: center;
}

.gas-block-gallery__grid {
    gap: clamp(14px, 2vw, 24px);
}

.gas-block-gallery__item {
    position: relative;
    margin: 0;
    border: 1px solid var(--gas-gallery-card-border);
    border-radius: var(--gas-gallery-radius);
    background: var(--gas-gallery-card-bg);
    box-shadow: var(--gas-gallery-card-shadow);
    overflow: hidden;
}

.gas-block-gallery__link {
    min-height: 100%;
    overflow: hidden;
    border-radius: inherit;
}

.gas-block-gallery__item img,
.gas-block-gallery__media-placeholder {
    width: 100%;
    transition:
        transform var(--gas-transition-normal, 0.22s ease),
        filter var(--gas-transition-normal, 0.22s ease),
        opacity var(--gas-transition-normal, 0.22s ease);
}

.gas-block-gallery__item img {
    display: block;
    border-radius: 0;
}

.gas-block-gallery__item:hover,
.gas-block-gallery__item:focus-within {
    box-shadow: var(--gas-gallery-card-shadow-hover);
}

@media (prefers-reduced-motion: no-preference) {
    .gas-block-gallery__item {
        transition:
            transform var(--gas-transition-normal, 0.22s ease),
            box-shadow var(--gas-transition-normal, 0.22s ease),
            border-color var(--gas-transition-normal, 0.22s ease);
    }

    .gas-block-gallery__item:hover,
    .gas-block-gallery__item:focus-within {
        transform: translateY(-3px);
        border-color: color-mix(in srgb, var(--gas-primary, #2563eb) 30%, var(--gas-color-border, #d7dde8));
    }

    .gas-block-gallery__item:hover img,
    .gas-block-gallery__item:focus-within img {
        transform: scale(1.035);
        filter: saturate(1.05) contrast(1.02);
    }
}

.gas-block-gallery__caption {
    margin: 0;
    color: var(--gas-color-text, #15201d);
    font-size: var(--gas-text-s, 14px);
    font-weight: 700;
    line-height: 1.35;
}

.gas-block-gallery:not(.gas-block-gallery--layout-photo_essay) .gas-block-gallery__caption {
    position: absolute;
    inset: auto 0 0;
    z-index: 1;
    min-height: 34%;
    display: flex;
    align-items: flex-end;
    padding: clamp(12px, 1.8vw, 18px);
    background: var(--gas-gallery-caption-bg);
    color: var(--gas-text-color-inverse, #fff);
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.35);
}

.gas-block-gallery:not(.gas-block-gallery--layout-photo_essay) .gas-block-gallery__link::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
    pointer-events: none;
}

.gas-block-gallery__filters {
    width: min(100%, 760px);
    margin-inline: auto;
    margin-block: 0 clamp(8px, 1.6vw, 18px);
    padding: clamp(10px, 1.6vw, 14px);
    border: 1px solid color-mix(in srgb, var(--gas-color-border, #d7dde8) 78%, transparent);
    border-radius: var(--gas-gallery-radius);
    background: var(--gas-gallery-panel);
    color: var(--gas-gallery-ink);
    box-shadow: 0 10px 26px rgba(20, 31, 28, 0.07);
}

.gas-block-gallery__search {
    width: 100%;
    border-color: color-mix(in srgb, var(--gas-color-border, #d7dde8) 72%, transparent);
    border-radius: var(--gas-radius-md, 5px);
    background: #fff;
    color: var(--gas-gallery-ink);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.gas-block-gallery__search:focus {
    border-color: color-mix(in srgb, var(--gas-primary, #2563eb) 62%, var(--gas-color-border, #d7dde8));
    outline: 3px solid color-mix(in srgb, var(--gas-primary, #2563eb) 18%, transparent);
}

.gas-block-gallery__filter-chips {
    gap: 8px;
    justify-content: center;
}

.gas-block-gallery__filter-chip {
    border-radius: var(--gas-radius-full, 999px);
    background: #fff;
    color: var(--gas-gallery-ink);
    font-weight: 700;
    transition:
        background var(--gas-transition-fast, 0.16s ease),
        border-color var(--gas-transition-fast, 0.16s ease),
        transform var(--gas-transition-fast, 0.16s ease);
}

.gas-block-gallery__filter-chip:hover,
.gas-block-gallery__filter-chip:focus-visible {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--gas-primary, #2563eb) 36%, var(--gas-color-border, #d7dde8));
}

.gas-block-gallery__filter-chip.is-active {
    background: #f6fbec;
    color: var(--gas-primary, #0f766e);
    box-shadow: 0 8px 20px color-mix(in srgb, var(--gas-primary, #2563eb) 16%, transparent);
}

.gas-block-gallery__play-badge {
    border: 1px solid rgba(255, 255, 255, 0.7);
    background: color-mix(in srgb, var(--gas-color-surface-card, #fff) 92%, transparent);
    color: var(--gas-primary, #0f766e);
}

.gas-block-gallery__more {
    background:
        linear-gradient(135deg, rgba(8, 13, 18, 0.74), rgba(15, 118, 110, 0.72)),
        var(--gas-bg-overlay);
    font-size: clamp(10px, 2vw, 13.5px);
}

.gas-block-gallery--layout-feature .gas-block-gallery__grid {
    padding: clamp(8px, 1.4vw, 14px);
    border: 1px solid color-mix(in srgb, var(--gas-color-border, #d7dde8) 70%, transparent);
    border-radius: var(--gas-gallery-radius);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.84), rgba(242, 249, 247, 0.74)),
        var(--gas-color-surface, #fff);
    box-shadow: 0 18px 48px rgba(20, 31, 28, 0.09);
}

.gas-block-gallery--layout-feature .gas-block-gallery__item {
    box-shadow: none;
}

.gas-block-gallery--layout-feature .gas-block-gallery__item:first-child .gas-block-gallery__caption {
    font-size: clamp(10.5px, 2vw, 15px);
}

.gas-block-gallery--layout-hotspots {
    padding: clamp(16px, 3vw, 34px);
    border: 1px solid color-mix(in srgb, var(--gas-color-border, #d7dde8) 70%, transparent);
    border-radius: var(--gas-gallery-radius);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(239, 247, 244, 0.86)),
        var(--gas-color-surface, #fff);
    box-shadow: 0 24px 70px rgba(20, 31, 28, 0.11);
}

.gas-block-gallery--layout-hotspots .gas-block-gallery__item {
    border: 0;
    box-shadow: 0 18px 54px rgba(20, 31, 28, 0.18);
}

.gas-block-gallery--layout-hotspots .gas-block-gallery__item:hover,
.gas-block-gallery--layout-hotspots .gas-block-gallery__item:focus-within {
    transform: none;
}

.gas-block-gallery__hotspot {
    inline-size: 14.5px;
    block-size: 14.5px;
    background: var(--gas-primary, #0f766e);
}

.gas-block-gallery__hotspot::after {
    content: "";
    position: absolute;
    inset: 50% auto auto 50%;
    inline-size: 3.8px;
    block-size: 3.8px;
    border-radius: var(--gas-radius-full, 999px);
    background: var(--gas-color-surface-card, #fff);
    transform: translate(-50%, -50%);
}

.gas-block-gallery__hotspot-popover {
    border-radius: var(--gas-gallery-radius);
    border-color: color-mix(in srgb, var(--gas-color-border, #d1d5db) 70%, transparent);
}

.gas-block-gallery__hotspot-popover strong {
    color: var(--gas-primary, #0f766e);
}

.gas-block-gallery--layout-photo_essay {
    counter-reset: gas-gallery-essay;
}

/* L'incrément vit sur l'ITEM, pas sur le ::before : un counter-increment porté
   par un pseudo-élément est re-scopé au pseudo (spec css-lists-3) et chaque
   légende affichait « 01 ». */
.gas-block-gallery--layout-photo_essay .gas-block-gallery__item {
    counter-increment: gas-gallery-essay;
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__grid {
    gap: clamp(25px, 7vw, 60px);
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__item {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__item:hover,
.gas-block-gallery--layout-photo_essay .gas-block-gallery__item:focus-within {
    transform: none;
    box-shadow: none;
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__link {
    border: 1px solid var(--gas-gallery-card-border);
    box-shadow: var(--gas-gallery-card-shadow);
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__essay-copy {
    position: relative;
    padding: clamp(18px, 3vw, 34px);
    border-left: 3px solid var(--gas-primary, #0f766e);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.8), rgba(247, 250, 249, 0.54));
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__essay-copy::before {
    content: counter(gas-gallery-essay, decimal-leading-zero);
    color: var(--gas-primary, #0f766e);
    font-size: var(--gas-text-s, 14px);
    font-weight: 800;
    letter-spacing: 0.08em;
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__caption {
    color: var(--gas-color-text, #15201d);
    text-shadow: none;
}

.gas-block-gallery--layout-photo_essay .gas-block-gallery__essay-text {
    max-width: 320px;
    line-height: 1.75;
}

.gas-block-gallery--layout-carousel .gas-block-gallery__viewport {
    padding: 8px 2px 18px;
}

.gas-block-gallery--layout-carousel .gas-block-gallery__item {
    border-radius: var(--gas-gallery-radius);
}

.gas-block-gallery--layout-carousel .gas-block-gallery__item img,
.gas-block-gallery--layout-justified .gas-block-gallery__item img,
.gas-block-gallery--layout-masonry .gas-block-gallery__item img,
.gas-block-gallery--layout-marquee .gas-block-gallery__item img {
    border-radius: 0;
}

.gas-block-gallery--layout-masonry .gas-block-gallery__item,
.gas-block-gallery--layout-justified .gas-block-gallery__item {
    background: #fff;
}

.gas-block-gallery--layout-marquee {
    padding-block: 10px;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

.gas-block-gallery--layout-marquee .gas-block-gallery__item {
    width: clamp(150px, 16vw, 210px);
}

.gas-block-gallery--layout-stack .gas-block-gallery__item {
    border-color: rgba(20, 31, 28, 0.12);
}

.gas-block-gallery--layout-stack .gas-block-gallery__item img {
    border-radius: var(--gas-radius-xs, 3px);
}

@media (max-width: 760px) {
    .gas-block-gallery__title {
        text-align: left;
    }

    .gas-block-gallery__filters,
    .gas-block-gallery--layout-hotspots {
        padding: 12px;
    }

    .gas-block-gallery:not(.gas-block-gallery--layout-photo_essay) .gas-block-gallery__caption {
        min-height: 42%;
    }

    .gas-block-gallery--layout-photo_essay .gas-block-gallery__essay-copy {
        border-left: 0;
        border-top: 3px solid var(--gas-primary, #0f766e);
        padding-inline: 0;
        background: transparent;
    }
}
/* @gas:block gallery end *//* @gas:block letter start */




/* ===== letter : en-tête centré + feuille « papier » + pile de feuilles ===== */
.gas-block-letter__header {
    max-width: 460px;
    margin: 0 auto var(--gas-space-xl, 30px);
    text-align: center;
}
.gas-block-letter--align-left .gas-block-letter__header {
    margin-inline: 0;
    text-align: left;
}
.gas-block-letter__eyebrow {
    margin: 0 0 var(--gas-space-3, 7.5px);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: var(--gas-text-s, 8.75px);
    font-weight: 600;
    color: var(--gas-color-text-muted, #6b7280);
}
.gas-block-letter__title {
    margin: 0 0 var(--gas-space-4, 10px);
    font-size: var(--gas-text-3xl, 25px);
    line-height: 1.1;
}
.gas-block-letter__lead {
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-l, 11.25px);
    line-height: var(--gas-prose-leading, 1.6);
}
.gas-block-letter__sheet {
    position: relative;
    max-width: 460px;
    margin-inline: auto;
    background: var(--gas-color-surface, #fff);
    border-radius: var(--gas-radius-sm, 2.5px);
    padding: clamp(var(--gas-space-l, 20px), 5vw, var(--gas-space-2xl, 40px));
    box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.18);
}
.gas-block-letter__body {
    line-height: var(--gas-prose-leading, 1.7);
    color: var(--gas-color-text, #161616);
}
.gas-block-letter__body > * {
    margin: 0;
}
.gas-block-letter__body > * + * {
    margin-top: var(--gas-space-4, 10px);
}

/* Effet pile de papier : deux calques blancs pivotés derrière la feuille. */
.gas-block-letter.is-stacked .gas-block-letter__sheet::before,
.gas-block-letter.is-stacked .gas-block-letter__sheet::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: var(--gas-color-surface, #fff);
    border-radius: inherit;
    box-shadow: 0 24px 50px -30px rgba(0, 0, 0, 0.15);
}
.gas-block-letter.is-stacked .gas-block-letter__sheet::before {
    transform: rotate(-2.4deg) translateY(-3px);
}
.gas-block-letter.is-stacked .gas-block-letter__sheet::after {
    transform: rotate(1.8deg) translateY(6px);
}

/* Signataire (membre du comité) : photo + nom + rôle. */
.gas-block-letter__author {
    text-align: center;
}
.gas-block-letter__author-photo {
    width: 132px;
    height: 132px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    margin: 0 auto var(--gas-space-s, 8px);
    box-shadow: var(--gas-shadow-m);
}
.gas-block-letter__author-name {
    font-weight: 700;
    margin: 0;
}
.gas-block-letter__author-role {
    color: var(--gas-color-text-muted, var(--gas-color-text));
    font-size: var(--gas-text-s);
    margin: 0;
}
.gas-block-letter__signature {
    display: block;
    max-width: 220px;
    height: auto;
    margin-top: var(--gas-space-m, 16px);
}
/* Disposition « side » : auteur en colonne à gauche de la feuille. La feuille est
   bornée pour garder une bonne longueur de ligne même dans une section large. */
.gas-block-letter--has-author .gas-block-letter__sheet {
    max-width: 880px;
    margin-inline: auto;
}
.gas-block-letter--author-side .gas-block-letter__sheet {
    display: grid;
    grid-template-columns: minmax(0, 180px) minmax(0, 1fr);
    gap: var(--gas-space-xl, 32px);
    align-items: start;
}
/* Disposition « top » : auteur en ligne au-dessus du corps. */
.gas-block-letter--author-top .gas-block-letter__author {
    display: flex;
    align-items: center;
    gap: var(--gas-space-m, 16px);
    text-align: left;
    margin-bottom: var(--gas-space-m, 16px);
}
.gas-block-letter--author-top .gas-block-letter__author-photo {
    width: 84px;
    height: 84px;
    margin: 0;
}
@container (max-width: 640px) {
    .gas-block-letter--author-side .gas-block-letter__sheet {
        grid-template-columns: 1fr;
    }
    .gas-block-letter--author-side .gas-block-letter__author {
        margin-bottom: var(--gas-space-m, 16px);
    }
}
/* @gas:block letter end *//* @gas:block intro_cards start */




/* ===== intro_cards : colonne d'intro + grille de cartes configurables ===== */
.gas-block-intro-cards {
    container-type: inline-size;
}
.gas-block-intro-cards__inner {
    max-width: var(--gas-container, 1100px);
    margin-inline: auto;
    padding-inline: var(--gas-section-padding-x, var(--gas-space-l, 15px));
    display: grid;
    gap: var(--gas-space-xl, 30px);
    align-items: start;
}
@container (min-width: 720px) {
    .gas-block-intro-cards__inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr);
    }
}
.gas-block-intro-cards__eyebrow {
    margin: 0 0 var(--gas-space-4, 10px);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: var(--gas-text-s, 8.75px);
    font-weight: 700;
    color: var(--gas-color-text, #161616);
}
.gas-block-intro-cards__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0 0 var(--gas-space-4, 10px);
    font-size: var(--gas-text-3xl, 25px);
    line-height: 1.1;
}
.gas-block-intro-cards__lead {
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-l, 11.25px);
    line-height: var(--gas-prose-leading, 1.6);
}
/* Sans colonne d'intro, la grille de cartes prend toute la largeur. */
.gas-block-intro-cards--cards-only .gas-block-intro-cards__inner {
    grid-template-columns: 1fr;
}
.gas-block-intro-cards__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--gas-space-m, 15px);
    grid-template-columns: 1fr;
}
@container (min-width: 520px) {
    .gas-block-intro-cards--cols-2 .gas-block-intro-cards__grid,
    .gas-block-intro-cards--cols-3 .gas-block-intro-cards__grid,
    .gas-block-intro-cards--cols-4 .gas-block-intro-cards__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@container (min-width: 860px) {
    .gas-block-intro-cards--cols-3 .gas-block-intro-cards__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .gas-block-intro-cards--cols-4 .gas-block-intro-cards__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
.gas-block-intro-cards__item {
    margin: 0;
}
.gas-block-intro-cards__card {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-3, 7.5px);
    height: 100%;
    padding: var(--gas-space-l, 20px);
    border-radius: var(--gas-radius-l, 7.5px);
    text-decoration: none;
    color: inherit;
}
.gas-block-intro-cards__icon {
    font-size: 20px;
    line-height: 1;
    margin-bottom: var(--gas-space-3, 7.5px);
}
/* Image d'en-tête de carte : sort du padding de la carte pour coller aux bords
   (même geste que les cartes du bloc cards), coins arrondis hérités en haut. */
.gas-block-intro-cards__media {
    display: block;
    margin: calc(-1 * var(--gas-space-l, 20px)) calc(-1 * var(--gas-space-l, 20px)) var(--gas-space-3, 7.5px);
    overflow: hidden;
    border-radius: var(--gas-radius-l, 7.5px) var(--gas-radius-l, 7.5px) 0 0;
}
.gas-block-intro-cards__media img {
    display: block;
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
}
.gas-block-intro-cards__card-title {
    margin: 0;
    font-size: var(--gas-text-l, 12.5px);
    line-height: 1.2;
}
.gas-block-intro-cards__card-text {
    margin: 0;
    font-size: var(--gas-text-m, 10px);
    line-height: var(--gas-prose-leading, 1.6);
    opacity: 0.92;
}
.gas-block-intro-cards__link {
    margin-top: auto;
    padding-top: var(--gas-space-3, 7.5px);
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-2, 5px);
    font-weight: 600;
}
.gas-block-intro-cards__link-arrow {
    transition: transform 0.2s var(--gas-ease-standard, ease);
}
a.gas-block-intro-cards__card:hover .gas-block-intro-cards__link-arrow {
    transform: translateX(4px);
}

/* Tons de carte (couleur de fond configurable). */
.gas-block-intro-cards--card-dark .gas-block-intro-cards__card {
    background: var(--gas-tone-dark-bg, #111827);
    color: var(--gas-tone-dark-fg, #f9fafb);
}
.gas-block-intro-cards--card-navy .gas-block-intro-cards__card {
    background: var(--gas-tone-navy-bg, #1a2e4a);
    color: var(--gas-tone-navy-fg, #dce8f7);
}
.gas-block-intro-cards--card-primary .gas-block-intro-cards__card {
    background: var(--gas-color-primary, #1a73e8);
    color: var(--gas-text-color-inverse);
}
.gas-block-intro-cards--card-accent .gas-block-intro-cards__card {
    background: var(--gas-accent-dark, #c8643c);
    color: var(--gas-text-color-inverse);
}
.gas-block-intro-cards--card-secondary .gas-block-intro-cards__card {
    background: var(--gas-color-secondary, #6b5b95);
    color: var(--gas-text-color-inverse);
}
.gas-block-intro-cards--card-surface .gas-block-intro-cards__card {
    background: var(--gas-color-surface, #fff);
    color: var(--gas-color-text, #161616);
    border: 1px solid var(--gas-color-border, #e0e0e0);
}
/* @gas:block intro_cards end *//* @gas:block newsletter_signup start */




/* ===== newsletter_signup : bandeau d'inscription (texte + formulaire) ===== */
.gas-block-newsletter-signup {
    container-type: inline-size;
    padding: var(--gas-space-xl, 30px) var(--gas-space-l, 20px);
    border-radius: var(--gas-radius-m, 5px);
}
.gas-block-newsletter-signup__inner {
    display: grid;
    gap: var(--gas-space-xl, 30px);
    align-items: center;
}
@container (min-width: 760px) {
    .gas-block-newsletter-signup__inner {
        grid-template-columns: 1fr 1fr;
    }
}
.gas-block-newsletter-signup__eyebrow {
    margin: 0 0 var(--gas-space-3, 7.5px);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: var(--gas-text-s, 8.75px);
    font-weight: 700;
}
.gas-block-newsletter-signup__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0 0 var(--gas-space-3, 7.5px);
    font-size: var(--gas-text-2xl, 20px);
    line-height: 1.15;
}
.gas-block-newsletter-signup__lead {
    font-size: var(--gas-text-l, 11.25px);
    opacity: 0.9;
}
.gas-block-newsletter-signup__note {
    margin: 0 0 var(--gas-space-4, 10px);
    font-size: var(--gas-text-l, 12.5px);
}
.gas-block-newsletter-signup__fields {
    display: flex;
    gap: var(--gas-space-2, 5px);
    flex-wrap: wrap;
    background: var(--gas-color-surface, #fff);
    border-radius: var(--gas-radius-m, 5px);
    padding: 3.5px;
}
.gas-block-newsletter-signup__input {
    flex: 1 1 120px;
    min-width: 0;
    border: 0;
    padding: 8.5px 10px;
    font-size: var(--gas-text-m, 16px);
    background: transparent;
    color: var(--gas-color-text, #161616);
}
.gas-block-newsletter-signup__input:focus {
    outline: 2px solid var(--gas-color-primary, #1a73e8);
    outline-offset: -2px;
    border-radius: var(--gas-radius-sm, 2.5px);
}
.gas-block-newsletter-signup__button {
    flex: 0 0 auto;
    border: 0;
    cursor: pointer;
    padding: 8.5px 15px;
    border-radius: var(--gas-radius-sm, 2.5px);
    background: var(--gas-tone-dark-bg, #111827);
    color: var(--gas-tone-dark-fg, #f9fafb);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
.gas-block-newsletter-signup__button:disabled {
    opacity: 0.6;
    cursor: default;
}
.gas-block-newsletter-signup__hp {
    position: absolute !important;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
}
.gas-block-newsletter-signup__feedback {
    margin: var(--gas-space-3, 7.5px) 0 0;
    font-size: var(--gas-text-s, 8.75px);
    min-height: 1.2em;
}
.gas-block-newsletter-signup__feedback.is-error {
    font-weight: 600;
}

/* Tons de bandeau (couleur de fond configurable). */
.gas-block-newsletter-signup--band-accent {
    background: var(--gas-accent-dark, #c8643c);
    color: var(--gas-text-color-inverse);
}
.gas-block-newsletter-signup--band-primary {
    background: var(--gas-color-primary, #1a73e8);
    color: var(--gas-text-color-inverse);
}
.gas-block-newsletter-signup--band-dark {
    background: var(--gas-tone-dark-bg, #111827);
    color: var(--gas-tone-dark-fg, #f9fafb);
}
.gas-block-newsletter-signup--band-surface {
    background: var(--gas-color-surface-muted, #f0f1f3);
    color: var(--gas-color-text, #161616);
}
.gas-block-newsletter-signup--band-surface .gas-block-newsletter-signup__fields {
    border: 1px solid var(--gas-color-border, #e0e0e0);
}

/* Média optionnel (logo / illustration au-dessus du texte). */
.gas-block-newsletter-signup__media {
    margin: 0 0 var(--gas-space-4, 10px);
}
.gas-block-newsletter-signup__image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-m, 5px);
    object-fit: cover;
}

/* Layouts : stacked + centered_card repassent en une colonne centrée. */
.gas-block-newsletter-signup--layout-stacked .gas-block-newsletter-signup__inner,
.gas-block-newsletter-signup--layout-centered_card .gas-block-newsletter-signup__inner {
    grid-template-columns: 1fr;
    max-width: 400px;
    margin-inline: auto;
    text-align: center;
    gap: var(--gas-space-l, 20px);
}
.gas-block-newsletter-signup--layout-stacked .gas-block-newsletter-signup__fields,
.gas-block-newsletter-signup--layout-centered_card .gas-block-newsletter-signup__fields {
    justify-content: center;
}
.gas-block-newsletter-signup--layout-stacked .gas-block-newsletter-signup__media,
.gas-block-newsletter-signup--layout-centered_card .gas-block-newsletter-signup__media {
    max-width: 120px;
    margin-inline: auto;
}
/* Carte centrée : encart blanc posé sur la bande teintée. */
.gas-block-newsletter-signup--layout-centered_card .gas-block-newsletter-signup__inner {
    background: var(--gas-color-surface, #fff);
    color: var(--gas-color-text, #161616);
    padding: var(--gas-space-xl, 30px) var(--gas-space-l, 20px);
    border-radius: var(--gas-radius-l, 10px);
    box-shadow: 0 24px 60px -30px rgba(15, 23, 42, 0.45);
}
/* @gas:block newsletter_signup end *//* @gas:block video_embed start */




.gas-block-video-embed__frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: var(--gas-radius-md, 5px);
    overflow: hidden;
    background: var(--gas-topbar-bg);
    display: grid;
    place-items: center;
}

.gas-block-video-embed--ratio-21-9 .gas-block-video-embed__frame {
    aspect-ratio: 21 / 9;
}

.gas-block-video-embed--ratio-4-3 .gas-block-video-embed__frame {
    aspect-ratio: 4 / 3;
}

.gas-block-video-embed--ratio-1-1 .gas-block-video-embed__frame {
    aspect-ratio: 1 / 1;
}

.gas-block-video-embed__iframe,
.gas-block-video-embed__video {
    width: 100%;
    height: 100%;
    border: 0;
}
/* @gas:block video_embed end *//* @gas:block faq start */


/* Titre : suit l'identité typo heading du tenant (--gas-font-family-heading). */
.gas-block-faq__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
}



.gas-block-faq__item + .gas-block-faq__item {
    margin-top: var(--gas-space-2, 5px);
}

.gas-block-faq__number {
    font-weight: 700;
    display: inline-block;
    margin-bottom: var(--gas-space-1, 2.5px);
}

/* ── faq : variante side_by_side (question à gauche, réponse à droite) ── */
.gas-block-faq--side_by_side .gas-block-faq__item {
    background: transparent;
    border: 0;
    border-top: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: 0;
    padding: var(--gas-space-l, 20px) 0;
}
.gas-block-faq--side_by_side .gas-block-faq__item + .gas-block-faq__item {
    margin-top: 0;
}
.gas-block-faq--side_by_side .gas-block-faq__question {
    margin: 0;
    font-size: var(--gas-text-l, 11.25px);
}
@media (min-width: 720px) {
    .gas-block-faq--side_by_side .gas-block-faq__item {
        display: grid;
        grid-template-columns: 2fr 3fr;
        gap: var(--gas-space-xl, 30px);
        align-items: start;
    }
}
/* Variantes flat / cards — classes émises sans aucune règle jusqu'à l'audit
   des previews (2026-07-19) : les deux rendaient comme l'accordéon par défaut. */
.gas-block-faq--flat .gas-block-faq__item {
    background: transparent;
    border: 0;
    border-radius: 0;
    padding-inline: 0;
    border-bottom: 1px solid var(--gas-border-subtle, #e3e3e3);
}
.gas-block-faq--flat .gas-block-faq__item + .gas-block-faq__item {
    margin-top: var(--gas-space-4, 10px);
}
.gas-block-faq--cards .gas-block-faq__item {
    box-shadow: var(--gas-shadow-m, 0 2px 8px rgb(0 0 0 / 0.08));
    border: 0;
    padding: var(--gas-space-5, 20px);
}
.gas-block-faq--cards .gas-block-faq__item + .gas-block-faq__item {
    margin-top: var(--gas-space-4, 10px);
}
/* @gas:block faq end */

@media (min-width: 768px) {
    .gas-block-hero--split .gas-block-hero__inner,
    .gas-block-hero--text_split .gas-block-hero__inner,
    .gas-block-hero--product_canvas .gas-block-hero__inner,
    .gas-block-cta-band__inner {
        grid-template-columns: 1fr 1fr;
    }

    .gas-block-hero--text_split .gas-block-hero__inner,
    .gas-block-hero--product_canvas .gas-block-hero__inner {
        align-items: end;
    }

    .gas-block-hero--text_split .gas-block-hero__secondary,
    .gas-block-hero--product_canvas .gas-block-hero__secondary {
        align-self: center;
    }

    .gas-block-hero--product_canvas .gas-block-hero__media {
        grid-column: 1 / -1;
        margin-top: var(--gas-space-6, 20px);
    }

    /* Variante split image à gauche : on inverse l'ordre des colonnes (DOM reste
       texte-d'abord pour le mobile/a11y, où tout est empilé). */
    .gas-block-hero--split.gas-block-hero--media-left .gas-block-hero__content { order: 2; }
    .gas-block-hero--split.gas-block-hero--media-left .gas-block-hero__media { order: 1; }

    .gas-block-image-text-split__inner {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 767px) {
    .gas-block-shop-catalog__inner,
    .gas-block-placement-slot__inner {
        grid-template-columns: 1fr;
    }

    .gas-block-toc--collapsed-on-mobile {
        max-height: 37.5px;
        overflow: hidden;
        position: relative;
    }
}/* @gas:block feature_lead start */


/* ----------------------------------------------------------------------
 * Block: feature_lead
 * Vedette + colonne latérale de cards secondaires.
 * -------------------------------------------------------------------- */

.gas-block-feature-lead {
    display: block;
    margin-block: var(--gas-space-l, 20px);
}

.gas-block-feature-lead__inner {
    display: grid;
    gap: var(--gas-space-l, 20px);
    grid-template-columns: 2fr 1fr;
    align-items: start;
}

.gas-block-feature-lead--featured-right .gas-block-feature-lead__inner {
    grid-template-columns: 1fr 2fr;
}

.gas-block-feature-lead--featured-right .gas-block-feature-lead__featured {
    order: 2;
}

.gas-block-feature-lead--magazine .gas-block-feature-lead__inner {
    grid-template-columns: 3fr 1fr;
    gap: var(--gas-space-xl, 30px);
    border-block-start: 1px solid var(--gas-border-subtle, rgba(0, 0, 0, 0.08));
    border-block-end: 1px solid var(--gas-border-subtle, rgba(0, 0, 0, 0.08));
    padding-block: var(--gas-space-l, 20px);
}

.gas-block-feature-lead--stacked .gas-block-feature-lead__inner {
    grid-template-columns: 1fr;
}

.gas-block-feature-lead__featured {
    display: grid;
    gap: var(--gas-space-m, 15px);
}

.gas-block-feature-lead__featured-media {
    margin: 0;
    overflow: hidden;
    border-radius: var(--gas-radius-m, 7.5px);
}

.gas-block-feature-lead__featured-image {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

.gas-block-feature-lead__kicker {
    margin: 0;
    font-size: var(--gas-text-xs, 7.5px);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gas-color-text-muted, #666);
}

.gas-block-feature-lead__featured-title {
    margin: 0;
    font-size: var(--gas-text-2xl, 17.5px);
    line-height: 1.15;
}

.gas-block-feature-lead--magazine .gas-block-feature-lead__featured-title {
    font-size: var(--gas-text-3xl, 22.5px);
    font-family: var(--gas-font-serif, Georgia, serif);
}

.gas-block-feature-lead__featured-description {
    margin: 0;
    font-size: var(--gas-text-m, 10px);
    line-height: 1.6;
    color: var(--gas-color-text, inherit);
}

.gas-block-feature-lead__featured-cta {
    justify-self: start;
}

.gas-block-feature-lead__sidebar {
    display: grid;
    gap: var(--gas-space-m, 12.5px);
}

.gas-block-feature-lead__sidebar-title {
    margin: 0;
    font-size: var(--gas-text-l, 12.5px);
}

.gas-block-feature-lead__sidebar-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: var(--gas-space-m, 12.5px);
}

.gas-block-feature-lead--stacked .gas-block-feature-lead__sidebar-list {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.gas-block-feature-lead__sidebar-item {
    margin: 0;
}

.gas-block-feature-lead__sidebar-link {
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: var(--gas-space-s, 7.5px);
    align-items: center;
    text-decoration: none;
    color: inherit;
    padding: var(--gas-space-xs, 5px);
    border-radius: var(--gas-radius-s, 5px);
    transition: background-color 0.15s var(--gas-ease-standard, ease);
}

a.gas-block-feature-lead__sidebar-link:hover,
a.gas-block-feature-lead__sidebar-link:focus-visible {
    background-color: var(--gas-color-surface-hover, rgba(0, 0, 0, 0.04));
}

.gas-block-feature-lead__sidebar-media {
    margin: 0;
    overflow: hidden;
    border-radius: var(--gas-radius-s, 5px);
    aspect-ratio: 1 / 1;
}

.gas-block-feature-lead__sidebar-thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gas-block-feature-lead__sidebar-body {
    display: grid;
    gap: var(--gas-space-2xs, 2.5px);
}

.gas-block-feature-lead__sidebar-kicker {
    font-size: var(--gas-text-xs, 7px);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gas-color-text-muted, #666);
}

.gas-block-feature-lead__sidebar-name {
    font-size: var(--gas-text-m, 10px);
    line-height: 1.3;
    font-weight: 600;
}

@media (max-width: 768px) {
    .gas-block-feature-lead__inner,
    .gas-block-feature-lead--featured-right .gas-block-feature-lead__inner,
    .gas-block-feature-lead--magazine .gas-block-feature-lead__inner {
        grid-template-columns: 1fr;
    }
    .gas-block-feature-lead--featured-right .gas-block-feature-lead__featured {
        order: 0;
    }
}
/* @gas:block feature_lead end *//* @gas:block featured_encounter start */




/* ----------------------------------------------------------------------
 * Block: featured_encounter
 * Triptyque éditorial intro + média + fiche détail.
 * -------------------------------------------------------------------- */

.gas-block-featured-encounter {
    --_encounter-accent: var(--gas-accent-text, var(--gas-accent, #c96a4d));
    --_encounter-muted: var(--gas-color-text-muted, var(--gas-secondary, #83916f));
    --_encounter-text: var(--gas-color-text, #111111);
    --_encounter-border: var(--gas-border-subtle, rgba(17, 17, 17, 0.18));
    display: block;
    max-width: var(--gas-container-wide, 960px);
    margin-inline: auto;
    margin-block: var(--gas-space-2xl, 50px);
    padding-inline: var(--gas-space-m, 15px);
    color: var(--_encounter-text);
}

.gas-block-featured-encounter--compact {
    margin-block: var(--gas-space-xl, 30px);
}

.gas-block-featured-encounter__inner {
    display: grid;
    grid-template-columns: minmax(130px, 0.9fr) minmax(240px, 2fr) minmax(140px, 0.95fr);
    gap: var(--gas-space-xl, 30px);
    align-items: center;
}

.gas-block-featured-encounter--compact .gas-block-featured-encounter__inner {
    gap: var(--gas-space-l, 20px);
}

.gas-block-featured-encounter__intro,
.gas-block-featured-encounter__detail {
    min-width: 0;
}

.gas-block-featured-encounter__eyebrow,
.gas-block-featured-encounter__type {
    margin: 0 0 var(--gas-space-m, 12.5px) 0;
    font-size: var(--gas-text-s, 8.75px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.gas-block-featured-encounter__type {
    color: var(--_encounter-muted);
}

.gas-block-featured-encounter__headline,
.gas-block-featured-encounter__title,
.gas-block-featured-encounter__closing {
    font-family: var(--gas-font-serif, Georgia, serif);
    font-weight: 400;
    letter-spacing: 0;
}

.gas-block-featured-encounter__headline {
    display: grid;
    gap: var(--gas-space-2xs, 2.5px);
    margin: 0 0 var(--gas-space-l, 20px) 0;
    font-size: var(--gas-text-4xl, 35px);
    line-height: 1.03;
}

.gas-block-featured-encounter__headline-primary {
    color: var(--_encounter-accent);
}

.gas-block-featured-encounter__headline-secondary {
    color: var(--_encounter-muted);
}

.gas-block-featured-encounter__intro-text {
    margin: 0;
    font-size: var(--gas-text-xl, 15px);
    line-height: 1.45;
    font-weight: 600;
}

.gas-block-featured-encounter__archive-link,
.gas-block-featured-encounter__watch-link {
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-s, 7.5px);
    color: var(--_encounter-accent);
    text-decoration: none;
}

.gas-block-featured-encounter__archive-link {
    margin-block-start: var(--gas-space-xl, 30px);
    min-height: 35px;
    padding: 0 var(--gas-space-m, 15px);
    border: 1px solid var(--_encounter-muted);
    border-radius: var(--gas-radius-s, 3.5px);
    color: var(--_encounter-muted);
    font-size: var(--gas-text-s, 8.75px);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.gas-block-featured-encounter__archive-link:hover,
.gas-block-featured-encounter__archive-link:focus-visible {
    background: color-mix(in srgb, var(--_encounter-muted) 9%, transparent);
}

.gas-block-featured-encounter__media {
    margin: 0;
}

.gas-block-featured-encounter__media-frame {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    min-height: 260px;
    color: inherit;
    background: var(--gas-color-surface-muted, #f4f1ec);
    text-decoration: none;
}

.gas-block-featured-encounter__image,
.gas-block-featured-encounter__image-placeholder {
    display: block;
    width: 100%;
    height: 100%;
}

.gas-block-featured-encounter__image {
    object-fit: cover;
}

.gas-block-featured-encounter__image-placeholder {
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--_encounter-accent) 18%, transparent), transparent),
        var(--gas-color-surface-muted, #f4f1ec);
}

.gas-block-featured-encounter__play {
    position: absolute;
    inset: 50% auto auto 50%;
    width: 50px;
    height: 50px;
    border: 2px solid var(--gas-color-white, #ffffff);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    background: color-mix(in srgb, var(--gas-color-text-default) 12%, transparent);
}

.gas-block-featured-encounter__play::before {
    content: "";
    position: absolute;
    inset: 50% auto auto 53%;
    width: 0;
    height: 0;
    border-block: 7.5px solid transparent;
    border-inline-start: 12.5px solid var(--gas-color-white, #ffffff);
    transform: translate(-50%, -50%);
}

.gas-block-featured-encounter__title {
    margin: 0 0 var(--gas-space-s, 7.5px) 0;
    color: var(--_encounter-accent);
    font-size: var(--gas-text-3xl, 22.5px);
    line-height: 1.08;
}

.gas-block-featured-encounter__person {
    margin: 0 0 var(--gas-space-m, 15px) 0;
    font-size: var(--gas-text-m, 10px);
    font-weight: 700;
}

.gas-block-featured-encounter__description {
    margin: 0;
    font-size: var(--gas-text-m, 10px);
    line-height: 1.45;
    font-weight: 600;
}

.gas-block-featured-encounter__watch-link {
    margin-block-start: var(--gas-space-l, 20px);
    font-size: var(--gas-text-m, 10px);
    font-weight: 600;
}

.gas-block-featured-encounter__meta {
    display: grid;
    gap: var(--gas-space-s, 7.5px);
    margin-block-start: var(--gas-space-xl, 30px);
    padding-block-start: var(--gas-space-m, 15px);
    border-block-start: 1px solid var(--_encounter-border);
    font-size: var(--gas-text-m, 10px);
    font-weight: 600;
}

.gas-block-featured-encounter__meta p {
    margin: 0;
}

.gas-block-featured-encounter__keywords-label {
    margin-inline-end: 2.5px;
}

.gas-block-featured-encounter__keywords {
    color: var(--_encounter-accent);
}

.gas-block-featured-encounter__closing {
    max-width: 720px;
    margin: var(--gas-space-2xl, 50px) 0 0 0;
    color: var(--_encounter-muted);
    font-size: var(--gas-text-4xl, 35px);
    line-height: 1.08;
}

@media (max-width: 1180px) {
    .gas-block-featured-encounter__inner {
        grid-template-columns: minmax(140px, 0.8fr) minmax(200px, 1.2fr);
    }

    .gas-block-featured-encounter__detail {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: minmax(140px, 0.8fr) minmax(200px, 1.2fr);
        gap: var(--gas-space-l, 20px) var(--gas-space-xl, 30px);
        align-items: start;
    }

    .gas-block-featured-encounter__detail > :not(.gas-block-featured-encounter__meta) {
        grid-column: 1;
    }

    .gas-block-featured-encounter__meta {
        grid-column: 2;
        grid-row: 1 / span 5;
        margin-block-start: 0;
    }
}

@media (max-width: 760px) {
    .gas-block-featured-encounter {
        margin-block: var(--gas-space-xl, 30px);
        padding-inline: var(--gas-space-s, 10px);
    }

    .gas-block-featured-encounter__inner,
    .gas-block-featured-encounter__detail {
        grid-template-columns: 1fr;
    }

    .gas-block-featured-encounter__headline {
        font-size: var(--gas-text-3xl, 22.5px);
    }

    .gas-block-featured-encounter__intro-text {
        font-size: var(--gas-text-l, 12.5px);
    }

    .gas-block-featured-encounter__media-frame {
        min-height: 180px;
    }

    .gas-block-featured-encounter__detail > :not(.gas-block-featured-encounter__meta),
    .gas-block-featured-encounter__meta {
        grid-column: auto;
        grid-row: auto;
    }

    .gas-block-featured-encounter__meta {
        margin-block-start: var(--gas-space-l, 20px);
    }

    .gas-block-featured-encounter__closing {
        margin-block-start: var(--gas-space-xl, 30px);
        font-size: var(--gas-text-3xl, 22.5px);
    }
}
/* @gas:block featured_encounter end *//* @gas:block card_carousel start */




/* ----------------------------------------------------------------------
 * Block: card_carousel
 * Rangée scrollable horizontale de cards (livres, produits, contenus).
 * -------------------------------------------------------------------- */

.gas-block-card-carousel {
    margin-block: var(--gas-space-l, 20px);
    position: relative;
}

.gas-block-card-carousel__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0 0 var(--gas-space-m, 15px) 0;
    font-size: var(--gas-text-2xl, 17.5px);
    text-align: center;
}

.gas-block-card-carousel__viewport {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
    padding-block: var(--gas-space-xs, 5px);
}

.gas-block-card-carousel__viewport:focus-visible {
    outline: 2px solid var(--gas-color-focus, var(--gas-primary, #2563eb));
    outline-offset: 4px;
}

.gas-block-card-carousel__track {
    display: grid;
    grid-auto-flow: column;
    gap: var(--gas-space-m, 15px);
    padding-inline: var(--gas-space-xs, 5px);
}

.gas-block-card-carousel--cols-2 .gas-block-card-carousel__track {
    grid-auto-columns: calc((100% - var(--gas-space-m, 15px) * 1) / 2);
}

.gas-block-card-carousel--cols-3 .gas-block-card-carousel__track {
    grid-auto-columns: calc((100% - var(--gas-space-m, 15px) * 2) / 3);
}

.gas-block-card-carousel--cols-4 .gas-block-card-carousel__track {
    grid-auto-columns: calc((100% - var(--gas-space-m, 15px) * 3) / 4);
}

.gas-block-card-carousel--cols-5 .gas-block-card-carousel__track {
    grid-auto-columns: calc((100% - var(--gas-space-m, 15px) * 4) / 5);
}

.gas-block-card-carousel--with-peek .gas-block-card-carousel__track {
    padding-inline-end: 20%;
}

.gas-block-card-carousel__item {
    scroll-snap-align: start;
    min-width: 0;
}

.gas-block-card-carousel__link {
    display: grid;
    gap: var(--gas-space-xs, 5px);
    text-decoration: none;
    color: inherit;
}

.gas-block-card-carousel__media {
    margin: 0;
    overflow: hidden;
    border-radius: var(--gas-radius-s, 5px);
    aspect-ratio: 3 / 4;
    background: var(--gas-color-surface-muted, #f5f5f5);
}

.gas-block-card-carousel__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gas-block-card-carousel__badge {
    position: absolute;
    inset-block-start: var(--gas-space-xs, 5px);
    inset-inline-start: var(--gas-space-xs, 5px);
    background: var(--gas-color-accent-bg, #111);
    color: var(--gas-color-accent-fg, #fff);
    padding: 1.5px 5px;
    font-size: var(--gas-text-xs, 7px);
    border-radius: var(--gas-radius-xs, 2.5px);
}

.gas-block-card-carousel__title-item {
    font-size: var(--gas-text-m, 10px);
    font-weight: 600;
    margin: 0;
    line-height: 1.3;
}

.gas-block-card-carousel__subtitle {
    font-size: var(--gas-text-s, 8.75px);
    color: var(--gas-color-text-muted, #666);
    margin: 0;
}

.gas-block-card-carousel--compact .gas-block-card-carousel__media {
    aspect-ratio: 1 / 1;
}

.gas-block-card-carousel--engine-embla {
    --_carousel-visible: 4;
}

.gas-block-card-carousel--engine-embla.gas-block-card-carousel--cols-2 {
    --_carousel-visible: 2;
}

.gas-block-card-carousel--engine-embla.gas-block-card-carousel--cols-3 {
    --_carousel-visible: 3;
}

.gas-block-card-carousel--engine-embla.gas-block-card-carousel--cols-5 {
    --_carousel-visible: 5;
}

.gas-block-card-carousel--engine-embla .gas-block-card-carousel__viewport {
    overflow: hidden;
    scrollbar-width: none;
}

.gas-block-card-carousel--engine-embla .gas-block-card-carousel__track {
    display: flex;
    gap: var(--gas-space-m, 15px);
    padding-inline: var(--gas-space-xs, 5px);
}

.gas-block-card-carousel--engine-embla .gas-block-card-carousel__item {
    flex: 0 0 calc((100% - (var(--gas-space-m, 15px) * (var(--_carousel-visible) - 1))) / var(--_carousel-visible));
}

.gas-block-card-carousel--engine-embla.gas-block-card-carousel--with-peek .gas-block-card-carousel__item {
    flex-basis: min(78%, calc((100% - (var(--gas-space-m, 15px) * 2)) / 3));
}

.gas-block-card-carousel--engine-embla .gas-block-card-carousel__link {
    height: 100%;
}

.gas-block-card-carousel__controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--gas-space-s, 10px);
    margin-top: var(--gas-space-m, 15px);
}
/* @gas:block card_carousel end */

.gas-block-card-carousel__control,
.gas-block-gallery__carousel-control {
    inline-size: 22.5px;
    block-size: 22.5px;
    border: 1px solid var(--gas-color-border, #e2e8f0);
    border-radius: 999px;
    background: var(--gas-color-surface-card, #fff);
    color: var(--gas-color-text, #0f172a);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.gas-block-card-carousel__control:disabled,
.gas-block-gallery__carousel-control:disabled {
    cursor: not-allowed;
    opacity: 0.42;
}/* @gas:block card_carousel start */


.gas-block-card-carousel__dots {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.gas-block-card-carousel__dot {
    inline-size: 5px;
    block-size: 5px;
    border: 0;
    border-radius: 999px;
    padding: 0;
    background: var(--gas-color-border, #cbd5e1);
    cursor: pointer;
}

.gas-block-card-carousel__dot.is-active {
    background: var(--gas-primary, #2563eb);
    transform: scale(1.25);
}

.gas-block-card-carousel__dot:focus-visible {
    outline: 2px solid var(--gas-primary, #2563eb);
    outline-offset: 2px;
}

.gas-block-card-carousel .gas-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 768px) {
    .gas-block-card-carousel--cols-3 .gas-block-card-carousel__track,
    .gas-block-card-carousel--cols-4 .gas-block-card-carousel__track,
    .gas-block-card-carousel--cols-5 .gas-block-card-carousel__track {
        grid-auto-columns: 60%;
    }
}

/* ─────────────────────────────────────────────────────────────────────────
   Carrousel CSS natif (::scroll-button / ::scroll-marker) — Chrome 135+/Safari 19+.
   Donne boutons prev/next + dots SANS JS, identiques en rendu WP (PHP) et Astro
   statique. Appliqué UNIQUEMENT quand les contrôles JS (island React) sont
   absents (détecté via :not(:has(__controls))) → aucun doublon avec l'island.
   Fallback navigateurs anciens : scroll-snap seul (statu quo, pas de régression).
   Les libellés viennent des custom props --gas-carousel-*-label (injectées par
   le renderer, donc localisées) via le texte-alt de `content`.
   ───────────────────────────────────────────────────────────────────────── */
@supports (scroll-marker-group: after) {
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__viewport {
        position: relative;
        scroll-marker-group: after;
    }
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__viewport::scroll-button(left),
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__viewport::scroll-button(right) {
        position: absolute;
        top: 40%;
        z-index: 2;
        inline-size: 22.5px;
        block-size: 22.5px;
        border: 0;
        border-radius: var(--gas-radius-full, 999px);
        background: var(--gas-color-surface-card, #fff);
        box-shadow: var(--gas-shadow-m, 0 2px 8px rgba(0, 0, 0, 0.15));
        color: var(--gas-color-text, #1f2937);
        font-size: 12.5px;
        line-height: 1;
        cursor: pointer;
    }
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__viewport::scroll-button(left) {
        left: 2.5px;
        content: "‹" / var(--gas-carousel-prev-label, "Précédent");
    }
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__viewport::scroll-button(right) {
        right: 2.5px;
        content: "›" / var(--gas-carousel-next-label, "Suivant");
    }
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__viewport::scroll-button(left):disabled,
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__viewport::scroll-button(right):disabled {
        opacity: 0.35;
        cursor: default;
    }
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__viewport::scroll-button(left):focus-visible,
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__viewport::scroll-button(right):focus-visible {
        outline: 2px solid var(--gas-primary, #2563eb);
        outline-offset: 2px;
    }
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__viewport::scroll-marker-group {
        display: flex;
        justify-content: center;
        gap: 4px;
        padding-block-start: 7.5px;
    }
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__item::scroll-marker {
        content: "";
        inline-size: 5px;
        block-size: 5px;
        border: 0;
        border-radius: var(--gas-radius-full, 999px);
        background: var(--gas-color-border, #cbd5e1);
        cursor: pointer;
    }
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__item::scroll-marker:target-current {
        background: var(--gas-primary, #2563eb);
    }
    .gas-block-card-carousel--controls:not(:has(.gas-block-card-carousel__controls)) .gas-block-card-carousel__item::scroll-marker:focus-visible {
        outline: 2px solid var(--gas-primary, #2563eb);
        outline-offset: 2px;
    }
}
/* @gas:block card_carousel end *//* @gas:block image_collage start */




/* ----------------------------------------------------------------------
 * Block: image_collage — composition de tuiles superposées, presets figés.
 * -------------------------------------------------------------------- */
.gas-block-image-collage {
    max-width: var(--gas-container, var(--gas-container-default));
    margin-inline: auto;
}

/* Tuile générique : ratio, coins arrondis, image en couverture. */
.gas-block-image-collage__tile {
    position: relative;
    margin: 0;
    overflow: hidden;
    border-radius: var(--gas-radius-lg, 7.5px);
    background: var(--gas-color-surface, #fff);
    box-shadow: 0 18px 40px -24px rgba(0, 0, 0, 0.45);
}

.gas-block-image-collage__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Libellé + légende en surimpression bas de tuile. */
.gas-block-image-collage__overlay {
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-1, 2.5px);
    padding: var(--gas-space-4, 10px);
    color: var(--gas-text-color-inverse);
    background: linear-gradient(to top, var(--gas-bg-overlay), transparent);
}

.gas-block-image-collage__label {
    font-size: var(--gas-text-lg, 11.25px);
    font-weight: 600;
    line-height: 1.15;
}

.gas-block-image-collage__caption {
    font-size: var(--gas-text-sm, 8.5px);
    opacity: 0.9;
}

/* Pastille de lecture vidéo, centrée. */
.gas-block-image-collage__play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.gas-block-image-collage__play-icon {
    width: 64px;
    height: 64px;
    padding: 16px;
    color: var(--gas-color-text, #161616);
    background: color-mix(in srgb, var(--gas-color-surface-card) 90%, transparent);
    border-radius: 999px;
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.5);
}

/* Carte statistique (pas d'image). */
.gas-block-image-collage__tile--stat {
    display: flex;
    align-items: center;
    justify-content: center;
}

.gas-block-image-collage__stat {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-2, 5px);
    padding: var(--gas-space-4, 10px);
    text-align: center;
}

.gas-block-image-collage__stat-value {
    font-size: var(--gas-text-4xl, 25px);
    font-weight: 700;
    line-height: 1;
    color: var(--gas-color-text, #161616);
}

.gas-block-image-collage__stat-label {
    font-size: var(--gas-text-xs, 7.5px);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gas-color-text-muted, #555);
}

.gas-block-image-collage__stat-text {
    margin: 0;
    font-size: var(--gas-text-sm, 8.5px);
    color: var(--gas-color-text, #161616);
}

/* Preset editorial-feature : maquette (grande tuile + 2 moyennes + stat). */
.gas-block-image-collage--editorial-feature {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: auto auto;
    gap: var(--gas-space-4, 10px);
}

.gas-block-image-collage--editorial-feature .gas-block-image-collage__tile--pos-1 {
    grid-column: 1 / 5;
    grid-row: 1;
    aspect-ratio: 4 / 3;
}

.gas-block-image-collage--editorial-feature .gas-block-image-collage__tile--pos-2 {
    grid-column: 4 / 7;
    grid-row: 1 / 3;
    align-self: center;
    aspect-ratio: 3 / 4;
    transform: translateY(var(--gas-space-6, 32px));
}

.gas-block-image-collage--editorial-feature .gas-block-image-collage__tile--pos-3 {
    grid-column: 1 / 4;
    grid-row: 2;
    aspect-ratio: 4 / 3;
}

.gas-block-image-collage--editorial-feature .gas-block-image-collage__tile--pos-4 {
    grid-column: 3 / 6;
    grid-row: 2;
    align-self: end;
    transform: translateY(var(--gas-space-4, 10px));
}

/* Preset staggered-3 : 3 tuiles décalées verticalement. */
.gas-block-image-collage--staggered-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gas-space-4, 10px);
    align-items: start;
}

.gas-block-image-collage--staggered-3 .gas-block-image-collage__tile {
    aspect-ratio: 3 / 4;
}

.gas-block-image-collage--staggered-3 .gas-block-image-collage__tile--pos-2 {
    transform: translateY(var(--gas-space-6, 32px));
}

.gas-block-image-collage--staggered-3 .gas-block-image-collage__tile--pos-3 {
    transform: translateY(calc(var(--gas-space-6, 32px) * 2));
}

/* Preset mosaic-4 : mosaïque régulière 2×2, sans chevauchement. */
.gas-block-image-collage--mosaic-4 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gas-space-4, 10px);
}

.gas-block-image-collage--mosaic-4 .gas-block-image-collage__tile {
    aspect-ratio: 1 / 1;
}

/* Responsive : tous les presets s'empilent en une colonne sans décalage. */
@media (max-width: 768px) {
    .gas-block-image-collage--editorial-feature,
    .gas-block-image-collage--staggered-3,
    .gas-block-image-collage--mosaic-4 {
        display: flex;
        flex-direction: column;
        gap: var(--gas-space-4, 10px);
    }

    .gas-block-image-collage--editorial-feature .gas-block-image-collage__tile,
    .gas-block-image-collage--staggered-3 .gas-block-image-collage__tile,
    .gas-block-image-collage--mosaic-4 .gas-block-image-collage__tile {
        grid-column: auto;
        grid-row: auto;
        transform: none;
        aspect-ratio: 4 / 3;
    }
}
/* @gas:block image_collage end *//* @gas:block contact_form start */




/* ----------------------------------------------------------------------
 * Block: contact_form mock fallback
 * Rendu visuel quand aucun formulaire réel n'est connecté.
 * -------------------------------------------------------------------- */

.gas-block-contact-form__mock {
    display: grid;
    gap: var(--gas-space-m, 10px);
    max-width: 360px;
}

.gas-block-contact-form__mock-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gas-space-m, 10px);
}

.gas-block-contact-form__mock-label {
    display: grid;
    gap: var(--gas-space-2xs, 3px);
    font-size: var(--gas-text-s, 8.75px);
    color: var(--gas-color-text, inherit);
}

.gas-block-contact-form__mock-label > span {
    font-weight: 500;
}

.gas-block-contact-form__mock-label input,
.gas-block-contact-form__mock-label select,
.gas-block-contact-form__mock-label textarea {
    width: 100%;
    padding: 6px 8px;
    border: 1px solid var(--gas-border-subtle, rgba(0,0,0,0.15));
    border-radius: var(--gas-radius-s, 5px);
    font-size: var(--gas-text-s, 14px);
    font-family: inherit;
    background: var(--gas-color-surface-card);
}

.gas-block-contact-form__mock-label textarea {
    resize: vertical;
    min-height: 60px;
}

.gas-block-contact-form__mock-consent {
    display: flex;
    align-items: flex-start;
    gap: var(--gas-space-s, 5px);
    font-size: var(--gas-text-s, 8.75px);
    color: var(--gas-color-text-muted, #555);
}

.gas-block-contact-form__mock-note {
    font-size: var(--gas-text-xs, 7.5px);
    color: var(--gas-color-text-muted, #777);
    margin: 0;
}

@media (max-width: 600px) {
    .gas-block-contact-form__mock-row {
        grid-template-columns: 1fr;
    }
}
/* @gas:block contact_form end */

/* ----------------------------------------------------------------------
 * Modifiers transverses : is-tone-*, is-align-*, density/container
 * Appliqués au root [data-block-type] de tout block (cf. schemas/*.php).
 * -------------------------------------------------------------------- */

/* Tone : surface (défaut, transparent), accent (teinte douce),
 * primary (couleur de marque), dark (sombre, texte clair). */
/* NB : pas de `color:` ici — un bloc surface imbriqué dans une bande sombre doit
 * hériter du texte clair de la bande (--gas-tone-surface-fg = texte de base,
 * non réassigné par les tones sombres). */
[data-block-type].is-tone-surface { background: var(--gas-tone-surface-bg, transparent); }

[data-block-type].is-tone-accent {
    background: var(--gas-tone-accent-bg, #f3f4f6);
    color: var(--gas-tone-accent-fg, inherit);
    padding-block: var(--gas-space-l, 20px);
    padding-inline: var(--gas-space-m, 15px);
    border-radius: var(--gas-radius-m, 7.5px);
    /* bande accent claire (ultra-light) : le texte de marque reste lisible en foncé. */
    --gas-accent-text: var(--gas-accent-ultra-dark);
    --gas-primary-text: var(--gas-color-primary);
}

/* Tones sombres (primary/dark) : on REDÉFINIT les tokens --gas-color-* DANS la section
 * (comme le dark mode) au lieu de forcer la couleur via `*`. Ainsi cartes, texte, bordures
 * et boutons s'adaptent ensemble — fini le « texte clair sur carte blanche ». */
[data-block-type].is-tone-primary {
    background: var(--gas-tone-primary-bg, #1d4ed8);
    color: var(--gas-tone-primary-fg, #fff);
    padding-block: var(--gas-space-l, 20px);
    padding-inline: var(--gas-space-m, 15px);
    border-radius: var(--gas-radius-m, 7.5px);
    --gas-color-text: var(--gas-tone-primary-fg, #fff);
    --gas-color-text-muted: var(--gas-primary-ultra-light);
    --gas-color-surface-card: var(--gas-primary-dark);
    --gas-color-surface: var(--gas-primary);
    --gas-color-border: var(--gas-primary-light);
    /* fond teal saturé : texte de marque → foreground clair. */
    --gas-accent-text: var(--gas-tone-primary-fg, #fff);
    --gas-primary-text: var(--gas-tone-primary-fg, #fff);
}
[data-block-type].is-tone-dark {
    background: var(--gas-tone-dark-bg, #111827);
    color: var(--gas-tone-dark-fg, #f9fafb);
    padding-block: var(--gas-space-l, 20px);
    padding-inline: var(--gas-space-m, 15px);
    border-radius: var(--gas-radius-m, 7.5px);
    --gas-color-text: var(--gas-tone-dark-fg, #f9fafb);
    --gas-color-text-muted: var(--gas-neutral-400);
    --gas-color-surface-card: var(--gas-neutral-800);
    --gas-color-surface: var(--gas-neutral-900);
    --gas-color-border: var(--gas-neutral-700);
    /* fond sombre : texte de marque → variantes claires (lisibles sur noir).
       primary-light (L36%) reste trop foncé sur cette bande → ultra-light (L95%). */
    --gas-accent-text: var(--gas-accent-light);
    --gas-primary-text: var(--gas-primary-ultra-light);
}
/* Boutons dans les bandeaux à tone sombre (primary/dark) : lisibilité garantie.
   Le solide devient blanc (texte = couleur du bandeau), l'outline devient contour blanc.
   Couvre les 2 systèmes de tone : générique `.is-tone-*` ET le bandeau CTA `.gas-block-cta-band--*`. */
[data-block-type].is-tone-primary .gas-button--primary,
[data-block-type].is-tone-dark .gas-button--primary,
.gas-block-cta-band--primary .gas-button--primary,
.gas-block-cta-band--dark .gas-button--primary {
    background: #fff;
    border-color: #fff;
    color: var(--gas-tone-primary-bg, #1d4ed8);
}
[data-block-type].is-tone-dark .gas-button--primary,
.gas-block-cta-band--dark .gas-button--primary {
    color: var(--gas-tone-dark-bg, #111827);
}
[data-block-type].is-tone-primary .gas-button--primary:hover,
[data-block-type].is-tone-dark .gas-button--primary:hover,
.gas-block-cta-band--primary .gas-button--primary:hover,
.gas-block-cta-band--dark .gas-button--primary:hover {
    background: var(--gas-neutral-100, #f1f1f1);
    border-color: var(--gas-neutral-100, #f1f1f1);
}
[data-block-type].is-tone-primary .gas-button--outline,
[data-block-type].is-tone-dark .gas-button--outline,
.gas-block-cta-band--primary .gas-button--outline,
.gas-block-cta-band--dark .gas-button--outline {
    background: transparent;
    border-color: #fff;
    color: #fff;
}
[data-block-type].is-tone-primary .gas-button--outline:hover:not(:disabled):not([disabled]),
[data-block-type].is-tone-dark .gas-button--outline:hover:not(:disabled):not([disabled]),
.gas-block-cta-band--primary .gas-button--outline:hover:not(:disabled):not([disabled]),
.gas-block-cta-band--dark .gas-button--outline:hover:not(:disabled):not([disabled]),
[data-block-type].is-tone-primary .gas-button--primary:hover:not(:disabled):not([disabled]),
[data-block-type].is-tone-dark .gas-button--primary:hover:not(:disabled):not([disabled]),
.gas-block-cta-band--primary .gas-button--primary:hover:not(:disabled):not([disabled]),
.gas-block-cta-band--dark .gas-button--primary:hover:not(:disabled):not([disabled]) {
    background: #fff;
    border-color: #fff;
    color: var(--gas-tone-primary-bg, #1d4ed8);
}
[data-block-type].is-tone-dark .gas-button--outline:hover:not(:disabled):not([disabled]),
.gas-block-cta-band--dark .gas-button--outline:hover:not(:disabled):not([disabled]),
[data-block-type].is-tone-dark .gas-button--primary:hover:not(:disabled):not([disabled]),
.gas-block-cta-band--dark .gas-button--primary:hover:not(:disabled):not([disabled]) {
    color: var(--gas-tone-dark-bg, #111827);
}
/* Liens textuels hérités soulignés sur tones sombres (les .gas-button gardent leur style). */
[data-block-type].is-tone-primary a:not(.gas-button),
[data-block-type].is-tone-dark a:not(.gas-button) {
    color: inherit;
    text-decoration: underline;
}

/* Align : impose un text-align au contenu interne. */
[data-block-type].is-align-left { text-align: left; }
[data-block-type].is-align-center { text-align: center; }
[data-block-type].is-align-center :is(.gas-block-cta__actions, .gas-block-hero__actions, .gas-block-cta-band__actions, .gas-block-feature-lead__featured-body) { justify-content: center; }
[data-block-type].is-align-right { text-align: right; }
[data-block-type].is-align-right :is(.gas-block-cta__actions, .gas-block-hero__actions, .gas-block-cta-band__actions) { justify-content: flex-end; }

/* Density : rythme vertical générique pour les blocs simples.
   Les blocs complexes gardent leurs règles spécifiques plus bas si elles existent. */
[data-block-type][style*="--gas-density"] {
    margin-block: calc(var(--gas-space-6, 20px) * var(--gas-density, 1));
}

[data-block-type][style*="--gas-density"] [class*="__inner"] {
    gap: calc(var(--gas-space-4, 10px) * var(--gas-density, 1));
}/* @gas:block cta start */


/* ----------------------------------------------------------------------
 * Polish : petits blocks (cta, cta_band, member_cta, info_box)
 * Plus de padding, fonds doux, espacements généreux pour un rendu pro.
 * -------------------------------------------------------------------- */

.gas-block-cta {
    padding-block: var(--gas-space-l, 20px);
    padding-inline: var(--gas-space-m, 15px);
    border-radius: var(--gas-radius-m, 7.5px);
    background: var(--gas-tone-accent-bg, #f8fafc);
    text-align: center;
    margin-block: var(--gas-space-l, 20px);
}

.gas-block-cta--none {
    background: transparent;
    padding-block: var(--gas-space-m, 15px);
}

.gas-block-cta--primary {
    background: var(--gas-tone-primary-bg, #1d4ed8);
    color: var(--gas-text-color-inverse);
}

.gas-block-cta--soft {
    background: var(--gas-tone-accent-bg, #eef2ff);
}

.gas-block-cta__inner {
    max-width: 400px;
    margin-inline: auto;
    display: grid;
    gap: var(--gas-space-m, 10px);
}

.gas-block-cta__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0;
    font-size: var(--gas-text-xl, 15px);
    line-height: 1.2;
}

.gas-block-cta__text {
    margin: 0;
    font-size: var(--gas-text-m, 10px);
    color: var(--gas-color-text-muted, #4b5563);
    opacity: 0.85;
}

.gas-block-cta__actions {
    display: flex;
    gap: var(--gas-space-s, 7.5px);
    flex-wrap: wrap;
    justify-content: center;
}

.gas-block-cta--primary :is(.gas-block-cta__title, .gas-block-cta__text) {
    color: inherit;
}
/* @gas:block cta end *//* @gas:block cta_band start */




.gas-block-cta-band {
    padding-block: var(--gas-space-l, 20px);
    padding-inline: var(--gas-space-m, 15px);
    border-radius: var(--gas-radius-m, 7.5px);
    margin-block: var(--gas-space-l, 20px);
}

.gas-block-cta-band__inner {
    display: flex;
    gap: var(--gas-space-l, 20px);
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 600px;
    margin-inline: auto;
    padding: var(--gas-space-l, 20px) var(--gas-space-xl, 27.5px);
    border-radius: var(--gas-radius-l, 14px);
}

@media (max-width: 640px) {
    .gas-block-cta-band__inner {
        padding: var(--gas-space-m, 15px);
    }
}

.gas-block-cta-band__content {
    display: grid;
    gap: var(--gas-space-2xs, 3px);
    flex: 1;
    min-width: 160px;
}

.gas-block-cta-band__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0;
    font-size: var(--gas-text-l, 12.5px);
    line-height: 1.2;
}

.gas-block-cta-band__subtitle {
    margin: 0;
    opacity: 0.85;
    font-size: var(--gas-text-m, 10px);
}

.gas-block-cta-band__actions {
    display: flex;
    gap: var(--gas-space-s, 7.5px);
    flex-wrap: wrap;
}

/* CTA band en panneau « soft » : présentation centrée empilée (titre, sous-titre,
   puis boutons centrés en dessous). Évite le chevauchement boutons/texte de la
   disposition côte-à-côte quand le titre est long ou qu'il y a deux boutons —
   pattern CTA panneau standard et lisible. */
.gas-block-cta-band--soft .gas-block-cta-band__inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    max-width: 760px;
    gap: var(--gas-space-m, 15px);
}
.gas-block-cta-band--soft .gas-block-cta-band__content {
    justify-items: center;
    flex: 0 1 auto;
}
.gas-block-cta-band--soft .gas-block-cta-band__actions {
    justify-content: center;
}

.gas-block-cta-band--primary :is(.gas-block-cta-band__title, .gas-block-cta-band__subtitle) {
    color: inherit;
}
/* @gas:block cta_band end *//* @gas:block member_cta start */




/* Member CTA : pro card avec ombre légère, padding généreux. */
.gas-block-member-cta {
    border: 1px solid var(--gas-border-subtle, rgba(0, 0, 0, 0.08));
    border-radius: var(--gas-radius-l, 10px);
    padding: var(--gas-space-l, 20px);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    background: var(--gas-color-surface-card);
    margin-block: var(--gas-space-l, 20px);
}

.gas-block-member-cta--showcase {
    background: linear-gradient(135deg, var(--gas-tone-accent-bg, #eef2ff), #fff);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}

.gas-block-member-cta__inner {
    display: grid;
    gap: var(--gas-space-m, 10px);
    text-align: center;
    max-width: 360px;
    margin-inline: auto;
}

.gas-block-member-cta__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0;
    font-size: var(--gas-text-xl, 15px);
}

.gas-block-member-cta__subtitle {
    margin: 0;
    color: var(--gas-color-text-muted, #6b7280);
}

.gas-block-member-cta__actions {
    display: flex;
    gap: var(--gas-space-s, 7.5px);
    justify-content: center;
    flex-wrap: wrap;
    margin-top: var(--gas-space-s, 5px);
}
/* @gas:block member_cta end */

/* ============================================================
 * CONTAINER QUERIES — adaptation des blocs grids à leur container
 *
 * Au lieu de scaler selon le viewport (@media), les grids scalent
 * selon la largeur de leur PARENT. Un block placé dans une colonne
 * étroite (sidebar, row 1/2+1/2) reçoit naturellement moins de
 * colonnes. Le modifier --cols-N agit comme PLAFOND : "max N
 * colonnes si la container width le permet, sinon réduit".
 *
 * Breakpoints choisis :
 *   < 420px  : 1 col (mobile, sidebar)
 *   420-680  : 2 cols max
 *   680-900  : 3 cols max
 *   900-1140 : 4 cols max
 *   >=1140   : 5-6 cols max (logo_cloud)
 * ============================================================ */

.gas-block-features-grid,
.gas-block-team-grid,
.gas-block-gallery,
.gas-block-logo-cloud,
.gas-block-stats,
.gas-block-card-carousel,
.gas-block-image-text-split,
.gas-block-feature-lead {
    container-type: inline-size;
}

/* Grids classiques (features_grid, team_grid, gallery, logo_cloud, stats) :
 * grid-template-columns scale par paliers de container width.
 * Base mobile (avant tout breakpoint) = 1 colonne. */
.gas-block-features-grid__grid,
.gas-block-team-grid__grid,
.gas-block-gallery__grid,
.gas-block-logo-cloud__grid,
.gas-block-stats__grid {
    grid-template-columns: 1fr;
}

@container (min-width: 420px) {
    .gas-block-features-grid--cols-2 .gas-block-features-grid__grid,
    .gas-block-features-grid--cols-3 .gas-block-features-grid__grid,
    .gas-block-features-grid--cols-4 .gas-block-features-grid__grid,
    .gas-block-team-grid--cols-2 .gas-block-team-grid__grid,
    .gas-block-team-grid--cols-3 .gas-block-team-grid__grid,
    .gas-block-team-grid--cols-4 .gas-block-team-grid__grid,
    .gas-block-gallery--cols-2 .gas-block-gallery__grid,
    .gas-block-gallery--cols-3 .gas-block-gallery__grid,
    .gas-block-gallery--cols-4 .gas-block-gallery__grid,
    .gas-block-logo-cloud--cols-3 .gas-block-logo-cloud__grid,
    .gas-block-logo-cloud--cols-4 .gas-block-logo-cloud__grid,
    .gas-block-logo-cloud--cols-5 .gas-block-logo-cloud__grid,
    .gas-block-logo-cloud--cols-6 .gas-block-logo-cloud__grid,
    .gas-block-stats__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@container (min-width: 680px) {
    .gas-block-features-grid--cols-3 .gas-block-features-grid__grid,
    .gas-block-features-grid--cols-4 .gas-block-features-grid__grid,
    .gas-block-team-grid--cols-3 .gas-block-team-grid__grid,
    .gas-block-team-grid--cols-4 .gas-block-team-grid__grid,
    .gas-block-gallery--cols-3 .gas-block-gallery__grid,
    .gas-block-gallery--cols-4 .gas-block-gallery__grid,
    .gas-block-logo-cloud--cols-3 .gas-block-logo-cloud__grid,
    .gas-block-logo-cloud--cols-4 .gas-block-logo-cloud__grid,
    .gas-block-logo-cloud--cols-5 .gas-block-logo-cloud__grid,
    .gas-block-logo-cloud--cols-6 .gas-block-logo-cloud__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .gas-block-stats--cards .gas-block-stats__grid,
    .gas-block-stats--inline .gas-block-stats__grid {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    }
}

@container (min-width: 900px) {
    .gas-block-features-grid--cols-4 .gas-block-features-grid__grid,
    .gas-block-team-grid--cols-4 .gas-block-team-grid__grid,
    .gas-block-gallery--cols-4 .gas-block-gallery__grid,
    .gas-block-logo-cloud--cols-4 .gas-block-logo-cloud__grid,
    .gas-block-logo-cloud--cols-5 .gas-block-logo-cloud__grid,
    .gas-block-logo-cloud--cols-6 .gas-block-logo-cloud__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}/* @gas:block features_grid start */

/* Titre : suit l'identité typo heading du tenant (--gas-font-family-heading). */
.gas-block-features-grid__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
}


/* features_grid en 1 colonne : liste verticale éditoriale, icône (badge rond)
 * à gauche du titre + description, sans carte. Reste mono-colonne à toute
 * largeur (pas promu dans les @container ci-dessus). Idéal en colonne de page
 * ou comme enfant d'un row 1/2+1/2. */
.gas-block-features-grid--cols-1 .gas-block-features-grid__grid {
    grid-template-columns: 1fr;
    gap: var(--gas-space-l, 20px);
}
.gas-block-features-grid--cols-1 .gas-block-features-grid__item {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: var(--gas-space-m, 15px);
    align-items: start;
    background: none;
    border: 0;
    padding: 0;
}
/* ── features_grid : taille des icônes ── */
.gas-block-features-grid--icon-none .gas-block-features-grid__icon {
    display: none;
}
.gas-block-features-grid--icon-small .gas-block-features-grid__icon {
    font-size: 15px;
    line-height: 1;
}
.gas-block-features-grid--icon-medium .gas-block-features-grid__icon {
    font-size: 22.5px;
    line-height: 1;
}
.gas-block-features-grid--icon-large .gas-block-features-grid__icon {
    font-size: 32.5px;
    line-height: 1;
}

/* Icônes SVG du registre (common/blocks/icons.json) : le SVG est calé sur la
 * taille typographique de l'icône (1em) et hérite de currentColor ; teinte
 * primaire par défaut pour se démarquer du texte. */
.gas-block-features-grid__icon--svg {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--gas-primary, currentColor);
}

.gas-block-features-grid__icon-svg {
    display: block;
    width: 1em;
    height: 1em;
}

.gas-block-features-grid--cols-1 .gas-block-features-grid__icon {
    grid-row: 1 / span 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 27.5px;
    height: 27.5px;
    border-radius: 50%;
    background: var(--gas-color-surface-muted, #f0f1f3);
    font-size: var(--gas-text-l, 12.5px);
    line-height: 1;
}
.gas-block-features-grid--cols-1 .gas-block-features-grid__item-title,
.gas-block-features-grid--cols-1 .gas-block-features-grid__item-text {
    grid-column: 2;
    margin: 0;
}
.gas-block-features-grid--cols-1 .gas-block-features-grid__item-text {
    margin-top: var(--gas-space-2, 5px);
}
/* @gas:block features_grid end *//* @gas:block logo_cloud start */




@container (min-width: 1140px) {
    .gas-block-logo-cloud--cols-5 .gas-block-logo-cloud__grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
    .gas-block-logo-cloud--cols-6 .gas-block-logo-cloud__grid {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}
/* @gas:block logo_cloud end *//* @gas:block image_text_split start */




/* image_text_split : devient mono-col en container < 640px */
.gas-block-image-text-split__inner {
    display: grid;
    gap: var(--gas-space-m, 15px);
    grid-template-columns: 1fr;
    /* Conteneur par défaut : ce bloc LARGE n'est pas dans la liste des blocs
       centrés en tête de fichier → sans ça, image + texte touchent les bords
       du navigateur (« texte collé au bord »). On borne, on centre et on padde
       par défaut, tout en respectant le modifier --gas-container s'il est posé. */
    max-width: var(--gas-container, var(--gas-container-wide, 1120px));
    margin-inline: auto;
    padding-inline: var(--gas-space-l, 20px);
}
/* @gas:block image_text_split end */

/* Même garde-fou conteneur pour les autres blocs LARGES absents de la liste
   par défaut (features_grid, stats) → sinon contenu collé aux bords. Respecte
   le modifier --gas-container. */
.gas-block-features-grid__inner,
.gas-block-stats__inner {
    max-width: var(--gas-container, var(--gas-container-wide, 1120px));
    margin-inline: auto;
    padding-inline: var(--gas-space-l, 20px);
}/* @gas:block image_text_split start */

@container (min-width: 640px) {
    .gas-block-image-text-split__inner {
        grid-template-columns: 1fr 1fr;
        align-items: center;
    }
    .gas-block-image-text-split--right .gas-block-image-text-split__media {
        order: 2;
    }

    /* media_fill : l'image s'étire sur toute la hauteur de la colonne texte
     * (cover) au lieu de garder son ratio naturel centré. Gated sur la classe
     * pour ne pas affecter les usages existants (image centrée hauteur auto). */
    .gas-block-image-text-split--media-fill .gas-block-image-text-split__inner {
        align-items: stretch;
    }
    .gas-block-image-text-split--media-fill .gas-block-image-text-split__media {
        height: 100%;
    }
    .gas-block-image-text-split--media-fill .gas-block-image-text-split__image {
        height: 100%;
        object-fit: cover;
    }
}
/* @gas:block image_text_split end *//* @gas:block feature_lead start */




/* feature_lead : vedette + sidebar en 2/3+1/3 quand assez large, sinon stack */
@container (max-width: 768px) {
    .gas-block-feature-lead__inner,
    .gas-block-feature-lead--featured-right .gas-block-feature-lead__inner,
    .gas-block-feature-lead--magazine .gas-block-feature-lead__inner {
        grid-template-columns: 1fr;
    }
}
/* @gas:block feature_lead end *//* @gas:block card_carousel start */






/* card_carousel : nombre de cards visibles à la fois adapté au container */
@container (max-width: 600px) {
    .gas-block-card-carousel--cols-3 .gas-block-card-carousel__track,
    .gas-block-card-carousel--cols-4 .gas-block-card-carousel__track,
    .gas-block-card-carousel--cols-5 .gas-block-card-carousel__track {
        grid-auto-columns: 65%;
    }
}
@container (min-width: 600px) and (max-width: 900px) {
    .gas-block-card-carousel--cols-4 .gas-block-card-carousel__track,
    .gas-block-card-carousel--cols-5 .gas-block-card-carousel__track {
        grid-auto-columns: calc((100% - var(--gas-space-m, 15px) * 2) / 3);
    }
}
/* @gas:block card_carousel end */


/* =============================================================
   Couleurs de texte par token (mark richtext gas-rt-color--*)
   Partagé : éditeur admin + rendu frontend WP/Astro.
   ============================================================= */
.gas-rt-color--primary { color: var(--gas-primary-text); --gas-rt-mark-color: var(--gas-primary); }
.gas-rt-color--primary-dark { color: var(--gas-primary-dark); --gas-rt-mark-color: var(--gas-primary-dark); }
.gas-rt-color--primary-light { color: var(--gas-primary-light); --gas-rt-mark-color: var(--gas-primary-light); }
.gas-rt-color--secondary { color: var(--gas-secondary); --gas-rt-mark-color: var(--gas-secondary); }
.gas-rt-color--secondary-dark { color: var(--gas-secondary-dark); --gas-rt-mark-color: var(--gas-secondary-dark); }
.gas-rt-color--accent { color: var(--gas-accent-text); --gas-rt-mark-color: var(--gas-accent); }
.gas-rt-color--accent-dark { color: var(--gas-accent-dark); --gas-rt-mark-color: var(--gas-accent-dark); }
.gas-rt-color--accent-light { color: var(--gas-accent-light); --gas-rt-mark-color: var(--gas-accent-light); }
.gas-rt-color--success { color: var(--gas-success); --gas-rt-mark-color: var(--gas-success); }
.gas-rt-color--warning { color: var(--gas-warning); --gas-rt-mark-color: var(--gas-warning); }
.gas-rt-color--danger { color: var(--gas-danger); --gas-rt-mark-color: var(--gas-danger); }
.gas-rt-color--info { color: var(--gas-info); --gas-rt-mark-color: var(--gas-info); }
.gas-rt-color--neutral-900 { color: var(--gas-neutral-900); --gas-rt-mark-color: var(--gas-neutral-900); }
.gas-rt-color--neutral-700 { color: var(--gas-neutral-700); --gas-rt-mark-color: var(--gas-neutral-700); }
.gas-rt-color--neutral-500 { color: var(--gas-neutral-500); --gas-rt-mark-color: var(--gas-neutral-500); }

/* @gas:emphasis-marks-start */
/*
   Styles de mise en évidence (mark richtext gas-rt-mark--*)
   Généré par : wp gas emphasis build-css — NE PAS MODIFIER MANUELLEMENT.
   Source : common/config/text-emphasis-catalog.php
   Styles : marker, marker_slant, underline, brush, wave, circle, gradient, box
   Partagé WP + Astro (même fichier physique).
   La couleur de décoration se pilote via --gas-rt-mark-color
   (fallback sur le token d'accent du site).
 */

/* Base neutre : ne touche pas à la couleur de texte. */
.gas-rt-mark {
    color: inherit;
}

/* --- marker : surligneur translucide posé derrière le bas du texte --- */
.gas-rt-mark--marker {
    background: linear-gradient(
        color-mix(in srgb, var(--gas-rt-mark-color, var(--gas-accent)) 30%, transparent),
        color-mix(in srgb, var(--gas-rt-mark-color, var(--gas-accent)) 30%, transparent)
    );
    background-size: 100% 55%;
    background-position: 0 88%;
    background-repeat: no-repeat;
    padding-inline: 0.05em;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

/* --- marker_slant : surligneur incliné (~-12°) via pseudo-élément ::before --- */
.gas-rt-mark--marker_slant {
    position: relative;
}
.gas-rt-mark--marker_slant::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0.05em -0.15em;
    background: color-mix(in srgb, var(--gas-rt-mark-color, var(--gas-accent)) 35%, transparent);
    transform: skewX(-12deg);
}

/* --- underline : soulignement droit épais décoratif --- */
.gas-rt-mark--underline {
    background-image: linear-gradient(
        var(--gas-rt-mark-color, var(--gas-accent)),
        var(--gas-rt-mark-color, var(--gas-accent))
    );
    background-size: 100% 3px;
    background-position: 0 100%;
    background-repeat: no-repeat;
    padding-bottom: 0.05em;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

/* --- brush : soulignement SVG via masque sur pseudo-élément --- */
.gas-rt-mark--brush {
    position: relative;
}
.gas-rt-mark--brush::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.1em;
    height: 0.45em;
    background-color: var(--gas-rt-mark-color, var(--gas-accent));
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20120%2012%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0,9%20C8,5%2014,11%2022,8%20C30,5%2036,11%2044,7%20C52,3%2058,10%2066,7%20C74,4%2080,10%2088,7%20C96,4%20102,10%20110,7%20C116,4%20118,8%20120,7%22%20stroke=%22black%22%20stroke-width=%223%22%20fill=%22none%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20120%2012%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0,9%20C8,5%2014,11%2022,8%20C30,5%2036,11%2044,7%20C52,3%2058,10%2066,7%20C74,4%2080,10%2088,7%20C96,4%20102,10%20110,7%20C116,4%20118,8%20120,7%22%20stroke=%22black%22%20stroke-width=%223%22%20fill=%22none%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22/%3E%3C/svg%3E");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    pointer-events: none;
}

/* --- wave : soulignement SVG via masque sur pseudo-élément --- */
.gas-rt-mark--wave {
    position: relative;
}
.gas-rt-mark--wave::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.1em;
    height: 0.45em;
    background-color: var(--gas-rt-mark-color, var(--gas-accent));
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20120%2010%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0,5%20C10,1%2020,9%2030,5%20C40,1%2050,9%2060,5%20C70,1%2080,9%2090,5%20C100,1%20110,9%20120,5%22%20stroke=%22black%22%20stroke-width=%222.5%22%20fill=%22none%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20120%2010%22%20preserveAspectRatio=%22none%22%3E%3Cpath%20d=%22M0,5%20C10,1%2020,9%2030,5%20C40,1%2050,9%2060,5%20C70,1%2080,9%2090,5%20C100,1%20110,9%20120,5%22%20stroke=%22black%22%20stroke-width=%222.5%22%20fill=%22none%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22/%3E%3C/svg%3E");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    pointer-events: none;
}

/* --- circle : entourage SVG ellipse via masque sur pseudo-élément couvrant la box --- */
.gas-rt-mark--circle {
    position: relative;
}
.gas-rt-mark--circle::after {
    content: '';
    position: absolute;
    inset: -0.2em -0.3em;
    background-color: var(--gas-rt-mark-color, var(--gas-accent));
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20120%2040%22%20preserveAspectRatio=%22none%22%3E%3Cellipse%20cx=%2260%22%20cy=%2220%22%20rx=%2256%22%20ry=%2217%22%20stroke=%22black%22%20stroke-width=%222.5%22%20fill=%22none%22%20stroke-linecap=%22round%22/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%20120%2040%22%20preserveAspectRatio=%22none%22%3E%3Cellipse%20cx=%2260%22%20cy=%2220%22%20rx=%2256%22%20ry=%2217%22%20stroke=%22black%22%20stroke-width=%222.5%22%20fill=%22none%22%20stroke-linecap=%22round%22/%3E%3C/svg%3E");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    pointer-events: none;
}

/* --- gradient : texte en dégradé entre le token primaire et le token accent --- */
.gas-rt-mark--gradient {
    background-image: linear-gradient(
        90deg,
        var(--gas-rt-mark-color, var(--gas-primary)),
        var(--gas-accent)
    );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    padding-inline: 0.05em;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

/* --- box : texte encadré d'une boîte arrondie avec bordure en couleur token --- */
.gas-rt-mark--box {
    border: 2px solid var(--gas-rt-mark-color, var(--gas-accent));
    border-radius: 0.25em;
    padding-inline: 0.35em;
    padding-block: 0.05em;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}/* @gas:block statement start */


/* @gas:emphasis-marks-end */

/* =============================================================
   Bloc statement — grande phrase d'accroche typographique
   ============================================================= */
.gas-block-statement {
    padding-block: var(--gas-block-gap-l, 20px);
}
.gas-block-statement__inner {
    max-width: var(--gas-container, var(--gas-container-wide, 720px));
    margin-inline: auto;
    padding-inline: var(--gas-block-pad-x, 12.5px);
}
.gas-block-statement__eyebrow {
    margin: 0 0 var(--gas-space-3, 7.5px);
    font-size: var(--gas-text-s, 8.75px);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gas-color-text-muted, var(--gas-neutral-600));
}
.gas-block-statement__text {
    margin: 0;
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-weight: 600;
    line-height: 1.1;
    color: var(--gas-color-text, var(--gas-neutral-900));
}
.gas-block-statement__text :is(p, h1, h2, h3) {
    margin: 0 0 0.2em;
}
.gas-block-statement__text :is(p, h1, h2, h3):last-child {
    margin-bottom: 0;
}
.gas-block-statement--size-l .gas-block-statement__text { font-size: var(--gas-text-2xl, clamp(15px, 3vw, 22.5px)); }
.gas-block-statement--size-xl .gas-block-statement__text { font-size: var(--gas-text-3xl, clamp(20px, 5vw, 35px)); }
.gas-block-statement--size-display .gas-block-statement__text { font-size: clamp(25px, 7vw, 50px); }
.gas-block-statement.is-align-center { text-align: center; }
.gas-block-statement.is-align-right { text-align: right; }
/* @gas:block statement end *//* @gas:block country_cloud start */




/* =============================================================
   Bloc country_cloud — nuage de pays sur carte du monde
   ============================================================= */
.gas-block-country-cloud {
    padding-block: var(--gas-block-gap-m, 15px);
}
.gas-block-country-cloud__inner {
    position: relative;
    max-width: var(--gas-container, var(--gas-container-default, 640px));
    margin-inline: auto;
    min-height: 120px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.gas-block-country-cloud__map {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    opacity: 0.45;
    pointer-events: none;
    z-index: 0;
}
.gas-block-country-cloud__list {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35em 0.9em;
    margin: 0;
    padding: 0;
    list-style: none;
}
.gas-block-country-cloud.is-align-center .gas-block-country-cloud__list { justify-content: center; }
.gas-block-country-cloud.is-align-right .gas-block-country-cloud__list { justify-content: flex-end; }
.gas-block-country-cloud__item {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-weight: 700;
    line-height: 1;
}
.gas-block-country-cloud__item--size-s { font-size: var(--gas-text-l, 12.5px); }
.gas-block-country-cloud__item--size-m { font-size: var(--gas-text-xl, 17.5px); }
.gas-block-country-cloud__item--size-l { font-size: clamp(20px, 4vw, 30px); }
.gas-block-country-cloud__item--size-xl { font-size: clamp(27.5px, 6vw, 45px); }
.gas-block-country-cloud__more {
    position: relative;
    z-index: 1;
    margin: 7.5px 0 0;
    font-size: var(--gas-text-s, 8.75px);
    font-weight: 700;
    color: var(--gas-color-text-muted, var(--gas-neutral-600));
}
.gas-block-country-cloud.is-align-center .gas-block-country-cloud__more { text-align: center; }
.gas-block-country-cloud.is-align-right .gas-block-country-cloud__more { text-align: right; }
.gas-block-country-cloud__header {
    position: relative;
    z-index: 1;
    margin: 0 0 var(--gas-space-m, 16px);
}
.gas-block-country-cloud__eyebrow {
    margin: 0 0 var(--gas-space-2xs, 4px);
    font-size: var(--gas-text-s, 8.75px);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gas-color-primary, var(--gas-primary));
}
.gas-block-country-cloud__title {
    margin: 0;
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-size: clamp(22px, 3.5vw, 32px);
    line-height: 1.1;
    color: var(--gas-text-color, inherit);
}
.gas-block-country-cloud.is-align-center .gas-block-country-cloud__header { text-align: center; }
.gas-block-country-cloud.is-align-right .gas-block-country-cloud__header { text-align: right; }
/* @gas:block country_cloud end *//* @gas:block pathway_cards start */




/* ==========================================================================
   Bloc pathway_cards — en-tête colorable + grille de cartes « porte d'entrée »
   ========================================================================== */
.gas-block-pathway-cards {
    --gas-pathway-card-bg: var(--gas-color-surface-card, var(--gas-bg-elevated, #fff));
    box-sizing: border-box;
    width: 100%;
    max-width: var(--gas-container, var(--gas-site-max-width, 1280px));
    margin-inline: auto;
    padding-block: var(--gas-space-2xl, 48px);
    padding-inline: var(--gas-space-l, 24px);
}

/* ── En-tête ──────────────────────────────────────────────────────────── */
.gas-block-pathway-cards__header {
    max-width: 64ch;
    margin: 0 auto var(--gas-space-2xl, 48px);
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-m, 16px);
}
.gas-block-pathway-cards--align-center .gas-block-pathway-cards__header {
    text-align: center;
    align-items: center;
}
.gas-block-pathway-cards--align-left .gas-block-pathway-cards__header {
    text-align: left;
    align-items: flex-start;
    margin-inline: 0;
}

.gas-block-pathway-cards__eyebrow {
    margin: 0;
    font-size: var(--gas-text-xs, 11px);
    font-weight: var(--gas-weight-bold, 700);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--gas-primary-text);
}
.gas-block-pathway-cards__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0;
    font-size: var(--gas-text-3xl, 33px);
    font-weight: var(--gas-weight-bold, 700);
    line-height: 1.1;
    color: var(--gas-color-text, var(--gas-neutral-900));
}
.gas-block-pathway-cards__lead {
    font-size: var(--gas-text-l, 20px);
    font-weight: var(--gas-weight-semi, 600);
    line-height: 1.35;
    color: var(--gas-color-text, var(--gas-neutral-900));
}
.gas-block-pathway-cards__intro {
    font-size: var(--gas-text-m, 16px);
    line-height: 1.6;
    color: var(--gas-color-text-muted, var(--gas-neutral-600));
}
.gas-block-pathway-cards__lead > :first-child,
.gas-block-pathway-cards__intro > :first-child { margin-top: 0; }
.gas-block-pathway-cards__lead > :last-child,
.gas-block-pathway-cards__intro > :last-child { margin-bottom: 0; }

/* ── Grille ───────────────────────────────────────────────────────────── */
.gas-block-pathway-cards__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--gas-space-l, 24px);
    grid-template-columns: 1fr;
}
@media (min-width: 640px) {
    .gas-block-pathway-cards__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .gas-block-pathway-cards--cols-2 .gas-block-pathway-cards__grid { grid-template-columns: repeat(2, 1fr); }
    .gas-block-pathway-cards--cols-3 .gas-block-pathway-cards__grid { grid-template-columns: repeat(3, 1fr); }
    .gas-block-pathway-cards--cols-4 .gas-block-pathway-cards__grid { grid-template-columns: repeat(4, 1fr); }
}

.gas-block-pathway-cards__item { display: flex; }

/* ── Carte ────────────────────────────────────────────────────────────── */
.gas-block-pathway-cards__card {
    display: flex;
    flex-direction: column;
    width: 100%;
    background: var(--gas-pathway-card-bg);
    border-radius: var(--gas-radius-l, 12px);
    overflow: hidden;
    box-shadow: var(--gas-shadow-m, 0 4px 12px rgba(0, 0, 0, 0.08));
    text-decoration: none;
    color: inherit;
    transition: transform 0.2s var(--gas-ease-standard, ease), box-shadow 0.2s var(--gas-ease-standard, ease);
}
a.gas-block-pathway-cards__card:hover,
a.gas-block-pathway-cards__card:focus-visible {
    transform: translateY(-4px);
    box-shadow: var(--gas-shadow-l, 0 10px 30px rgba(0, 0, 0, 0.1));
}

.gas-block-pathway-cards__media {
    margin: 0;
    aspect-ratio: var(--gas-aspect-card, 4 / 3);
    overflow: hidden;
    background: var(--gas-neutral-100);
}
.gas-block-pathway-cards__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gas-block-pathway-cards__body {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-s, 8px);
    padding: var(--gas-space-l, 24px);
    flex: 1 1 auto;
}
.gas-block-pathway-cards__category {
    margin: 0;
    font-size: var(--gas-text-xs, 11px);
    font-weight: var(--gas-weight-bold, 700);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gas-primary-text);
}
.gas-block-pathway-cards__card-title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0;
    font-size: var(--gas-text-l, 20px);
    font-weight: var(--gas-weight-semi, 600);
    line-height: 1.2;
    color: var(--gas-accent-text);
}
.gas-block-pathway-cards__card-text {
    margin: 0;
    font-size: var(--gas-text-s, 13px);
    line-height: 1.55;
    color: var(--gas-color-text-muted, var(--gas-neutral-600));
}
.gas-block-pathway-cards__link {
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-s, 8px);
    margin-top: var(--gas-space-s, 8px);
    font-size: var(--gas-text-s, 13px);
    font-weight: var(--gas-weight-semi, 600);
    color: var(--gas-accent-text);
}
.gas-block-pathway-cards__link-arrow {
    transition: transform 0.2s var(--gas-ease-standard, ease);
}
a.gas-block-pathway-cards__card:hover .gas-block-pathway-cards__link-arrow {
    transform: translateX(4px);
}

/* ── Variante onglets « persona » (enhancer pathway_tabs) ─────────────────── */
/* Sans JS : tablist masquée (hidden), groupes empilés avec leur libellé en
   sous-titre. Avec JS (is-enhanced) : tablist visible, sous-titres masqués,
   seul le panneau actif est affiché (hidden posé par l'enhancer). */
.gas-block-pathway-cards__tablist {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--gas-space-s, 8px);
    margin-bottom: var(--gas-space-l, 15px);
}
.gas-block-pathway-cards--align-left .gas-block-pathway-cards__tablist { justify-content: flex-start; }
.gas-block-pathway-cards__tablist[hidden] { display: none; }
.gas-block-pathway-cards__tab {
    appearance: none;
    cursor: pointer;
    padding: var(--gas-space-xs, 5px) var(--gas-space-l, 15px);
    background: transparent;
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-full, 999px);
    font-size: var(--gas-text-s, 13px);
    font-weight: var(--gas-weight-semi, 600);
    color: var(--gas-color-text, #111827);
}
.gas-block-pathway-cards__tab:hover,
.gas-block-pathway-cards__tab:focus-visible {
    border-color: var(--gas-color-primary, #2563eb);
    color: var(--gas-color-primary, #2563eb);
}
.gas-block-pathway-cards__tab.is-active {
    background: var(--gas-color-primary, #2563eb);
    border-color: var(--gas-color-primary, #2563eb);
    color: var(--gas-text-on, #fff);
}
.gas-block-pathway-cards__group + .gas-block-pathway-cards__group { margin-top: var(--gas-space-xl, 24px); }
.gas-block-pathway-cards--tabs.is-enhanced .gas-block-pathway-cards__group + .gas-block-pathway-cards__group { margin-top: 0; }
.gas-block-pathway-cards__group-title {
    font-size: var(--gas-text-l, 20px);
    margin: 0 0 var(--gas-space-m, 10px);
}
.gas-block-pathway-cards--align-center .gas-block-pathway-cards__group-title { text-align: center; }
.gas-block-pathway-cards--tabs.is-enhanced .gas-block-pathway-cards__group-title { display: none; }
.gas-block-pathway-cards__group[hidden] { display: none; }
/* @gas:block pathway_cards end *//* @gas:block people_grid start */




/* ============================================================================
 * Bloc people_grid — panneau intro + grille de portraits (nom en surimpression)
 * ========================================================================== */
.gas-block-people-grid {
    box-sizing: border-box;
    width: 100%;
    max-width: var(--gas-container, var(--gas-site-max-width, 1280px));
    margin-inline: auto;
    padding-block: var(--gas-space-2xl, 48px);
    padding-inline: var(--gas-space-l, 24px);
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--gas-space-2xl, 48px);
}
@media (min-width: 1024px) {
    .gas-block-people-grid {
        grid-template-columns: 1.4fr 1fr;
        align-items: center;
        gap: var(--gas-space-3xl, 64px);
    }
    /* Maquette : portraits à gauche, panneau d'intro à droite. */
    .gas-block-people-grid__grid { order: 1; }
    .gas-block-people-grid__intro { order: 2; }
}

/* ── Panneau d'intro ──────────────────────────────────────────────────── */
.gas-block-people-grid__intro {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-m, 16px);
}
.gas-block-people-grid__eyebrow {
    margin: 0;
    font-size: var(--gas-text-xs, 11px);
    font-weight: var(--gas-weight-bold, 700);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--gas-color-text-muted, var(--gas-neutral-600));
}
.gas-block-people-grid__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0;
    font-size: var(--gas-text-3xl, 33px);
    font-weight: var(--gas-weight-bold, 700);
    line-height: 1.1;
    color: var(--gas-color-text, var(--gas-neutral-900));
}
.gas-block-people-grid__lead {
    font-size: var(--gas-text-l, 20px);
    line-height: 1.4;
    color: var(--gas-color-text, var(--gas-neutral-900));
}
.gas-block-people-grid__text {
    font-size: var(--gas-text-m, 16px);
    line-height: 1.6;
    color: var(--gas-color-text-muted, var(--gas-neutral-600));
}
.gas-block-people-grid__lead > :first-child,
.gas-block-people-grid__text > :first-child { margin-top: 0; }
.gas-block-people-grid__lead > :last-child,
.gas-block-people-grid__text > :last-child { margin-bottom: 0; }
.gas-block-people-grid__cta {
    align-self: flex-start;
    margin-top: var(--gas-space-s, 8px);
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-s, 8px);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.gas-block-people-grid__cta-arrow { transition: transform 0.2s ease; }
.gas-block-people-grid__cta:hover .gas-block-people-grid__cta-arrow { transform: translateX(4px); }

/* ── Grille de portraits ──────────────────────────────────────────────── */
.gas-block-people-grid__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--gas-space-m, 16px);
    grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 640px) {
    .gas-block-people-grid--cols-2 .gas-block-people-grid__grid { grid-template-columns: repeat(2, 1fr); }
    .gas-block-people-grid--cols-3 .gas-block-people-grid__grid { grid-template-columns: repeat(3, 1fr); }
}
.gas-block-people-grid__item { display: flex; }

/* ── Tuile portrait ───────────────────────────────────────────────────── */
.gas-block-people-grid__tile {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: var(--gas-aspect-square, 1 / 1);
    border-radius: var(--gas-radius-l, 12px);
    overflow: hidden;
    background: var(--gas-neutral-100);
    text-decoration: none;
    color: inherit;
    transition: transform 0.2s var(--gas-ease-standard, ease), box-shadow 0.2s var(--gas-ease-standard, ease);
}
a.gas-block-people-grid__tile:hover,
a.gas-block-people-grid__tile:focus-visible {
    transform: translateY(-3px);
    box-shadow: var(--gas-shadow-l, 0 10px 30px rgba(0, 0, 0, 0.12));
}
.gas-block-people-grid__media {
    margin: 0;
    width: 100%;
    height: 100%;
}
.gas-block-people-grid__photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.gas-block-people-grid__caption {
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: var(--gas-space-m, 16px);
    background: linear-gradient(to top, var(--gas-bg-overlay), transparent);
}
.gas-block-people-grid__name {
    font-size: var(--gas-text-m, 16px);
    font-weight: var(--gas-weight-bold, 700);
    line-height: 1.15;
    color: var(--gas-white, #fff);
}
.gas-block-people-grid__role {
    font-size: var(--gas-text-xs, 11px);
    line-height: 1.2;
    color: var(--gas-white, #fff);
    opacity: 0.85;
}

/* ── Tuile « voir tout » ──────────────────────────────────────────────── */
.gas-block-people-grid__tile--see-all {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    gap: var(--gas-space-s, 8px);
    padding: var(--gas-space-l, 24px);
    background: var(--gas-accent-dark, var(--gas-accent));
    color: var(--gas-white, #fff);
}
.gas-block-people-grid__see-all-label {
    font-size: var(--gas-text-m, 16px);
    font-weight: var(--gas-weight-semi, 600);
}
.gas-block-people-grid__see-all-arrow {
    font-size: var(--gas-text-l, 20px);
    transition: transform 0.2s var(--gas-ease-standard, ease);
}
a.gas-block-people-grid__tile--see-all:hover .gas-block-people-grid__see-all-arrow { transform: translateX(4px); }
/* @gas:block people_grid end */

/* =============================================================================
   Lot 0 — règles transverses centrales (a11y + modifier container)
   ============================================================================= */

/* Focus clavier visible sur tout élément interactif d'un bloc qui n'est pas déjà
   un .gas-button (liens, champs, boutons natifs, summary). a11y « pro ». */
[data-block-type] :is(a, button, input, select, textarea, summary, [tabindex]):not(.gas-button):focus-visible {
    outline: var(--gas-focus-ring-width, 2px) solid var(--gas-focus-ring-color, currentColor);
    outline-offset: var(--gas-focus-ring-offset, 2px);
    border-radius: var(--gas-radius-s, 4px);
}

/* Modifier `container` — opt-in : ne s'applique QUE si la racine du bloc porte
   l'inline `--gas-container` (posé par l'applicateur central de modifiers). Contraint
   la largeur du wrapper de contenu __inner et le centre. Zéro impact sur les blocs
   sans le modifier (aucune régression de layout). */
[data-block-type][style*="--gas-container"] [class*="__inner"] {
    max-width: var(--gas-container);
    margin-inline: auto;
}

/* Wrappers de shortcodes legacy (typed_shortcode : committee_grid, news_strip,
   partner_banner, featured_activity, upcoming_activities, latest_articles, etc.).
   Le contenu interne vient du shortcode (styles legacy du module) ; ici on garantit
   seulement un rythme vertical cohérent + un cadre propre quand le bloc est toné.
   Les wrappers ayant un CSS dédié (member_cta…) gardent la priorité (plus spécifique). */
.gas-block-typed-shortcode {
    margin-block: var(--gas-space-2xl);
}
.gas-block-typed-shortcode:is(.is-tone-accent, .is-tone-primary, .is-tone-dark, .is-tone-muted) {
    padding: var(--gas-space-xl);
    border-radius: var(--gas-radius-l);
}/* @gas:block upcoming_activities start */


/* upcoming_activities — heading optionnel injecté par le renderer */
.gas-block-upcoming-activities__header {
    max-width: var(--gas-container, 1100px);
    margin-inline: auto;
    padding-inline: var(--gas-section-padding-x, var(--gas-space-l, 15px));
    padding-block-end: var(--gas-space-m, 10px);
}
.gas-block-upcoming-activities__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-size: var(--gas-text-2xl, 15px);
    font-weight: var(--gas-font-weight-bold, 700);
    line-height: var(--gas-leading-tight, 1.25);
    margin: 0;
}
/* @gas:block upcoming_activities end *//* @gas:block pricing_table start */


/* =============================================================================
   Bloc pricing_table — grille de plans tarifaires (conversion). Portable WP/Astro.
   ============================================================================= */
.gas-block-pricing-table {
    margin-block: var(--gas-space-2xl);
}
.gas-block-pricing-table__inner {
    max-width: var(--gas-container, var(--gas-container-wide, 1120px));
    margin-inline: auto;
    padding-inline: var(--gas-space-l);
}
.gas-block-pricing-table__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0 0 var(--gas-space-s);
    font-size: var(--gas-text-2xl);
    line-height: var(--gas-leading-tight);
    text-align: center;
}
.gas-block-pricing-table__subtitle {
    margin: 0 auto var(--gas-space-xl);
    max-width: 480px;
    color: var(--gas-color-text-muted);
    font-size: var(--gas-text-l);
    text-align: center;
}
.gas-block-pricing-table__grid {
    display: grid;
    gap: var(--gas-space-l);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
    align-items: start;
}
.gas-block-pricing-table--cols-2 .gas-block-pricing-table__grid { max-width: 560px; margin-inline: auto; }
.gas-block-pricing-table--cols-3 .gas-block-pricing-table__grid {
    max-width: min(100%, var(--gas-container-wide, 1120px));
    margin-inline: auto;
}

.gas-block-pricing-table__plan {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-s);
    padding: var(--gas-space-xl) var(--gas-space-l);
    background: var(--gas-color-surface-card, #fff);
    /* Fond clair propre : on fixe la couleur de texte au lieu d'hériter d'un tone
       sombre de la section (sinon texte clair sur carte blanche). */
    color: var(--gas-color-text);
    border: 1px solid var(--gas-color-border);
    border-radius: var(--gas-radius-l);
    box-shadow: var(--gas-shadow-s);
    height: 100%;
}
.gas-block-pricing-table__plan--featured {
    border-color: var(--gas-color-primary, #2563eb);
    border-width: 2px;
    /* Halo teinté primaire pour faire ressortir le plan « populaire ». */
    box-shadow: 0 24px 50px -22px color-mix(in srgb, var(--gas-color-primary, #2563eb) 55%, transparent);
}
.gas-block-pricing-table__plan--featured .gas-block-pricing-table__plan-name {
    color: var(--gas-color-primary, #2563eb);
}
/* Sur desktop (plans côte à côte), le plan vedette est légèrement surélevé. */
@media (min-width: 768px) {
    .gas-block-pricing-table__plan--featured {
        transform: scale(1.05);
        z-index: 1;
    }
}
.gas-block-pricing-table__badge {
    position: absolute;
    top: 0;
    inset-inline-end: var(--gas-space-l);
    transform: translateY(-50%);
    padding: var(--gas-space-2xs) var(--gas-space-s);
    background: var(--gas-color-primary);
    color: var(--gas-color-on-primary, #fff);
    border-radius: var(--gas-radius-full);
    font-size: var(--gas-text-xs);
    font-weight: var(--gas-weight-semi);
    letter-spacing: 0.02em;
}
.gas-block-pricing-table__plan-name {
    margin: 0;
    font-size: var(--gas-text-l);
    font-weight: var(--gas-weight-semi);
}
.gas-block-pricing-table__price {
    margin: 0;
    display: flex;
    align-items: baseline;
    gap: var(--gas-space-2xs);
    flex-wrap: wrap;
}
.gas-block-pricing-table__price-amount {
    font-size: var(--gas-text-3xl);
    font-weight: var(--gas-weight-bold);
    line-height: 1;
    color: var(--gas-primary-text);
}
.gas-block-pricing-table__price-period {
    color: var(--gas-color-text-muted);
    font-size: var(--gas-text-s);
}
.gas-block-pricing-table__plan-desc {
    margin: 0;
    color: var(--gas-color-text-muted);
    font-size: var(--gas-text-s);
}
.gas-block-pricing-table__features {
    list-style: none;
    margin: var(--gas-space-s) 0;
    padding: 0;
    display: grid;
    gap: var(--gas-space-xs);
}
.gas-block-pricing-table__feature {
    display: flex;
    align-items: flex-start;
    gap: var(--gas-space-s);
    font-size: var(--gas-text-s);
}
.gas-block-pricing-table__feature-check {
    flex-shrink: 0;
    color: var(--gas-primary-text);
    font-weight: var(--gas-weight-bold);
    line-height: 1.4;
}
.gas-block-pricing-table__cta {
    margin-top: auto;
    width: 100%;
    justify-content: center;
}

@media (max-width: 767px) {
    .gas-block-pricing-table__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .gas-block-pricing-table__plan {
        height: auto;
    }
}

/* ── CTA de fin de grille (footer_link) ── */
.gas-block-pricing-table__footer-link {
    margin-top: var(--gas-space-l, 15px);
    text-align: center;
}
.gas-block-pricing-table__footer-link-anchor {
    font-weight: 600;
    font-size: var(--gas-text-s, 14px);
    color: var(--gas-primary, var(--gas-color-primary));
    text-decoration: none;
}
.gas-block-pricing-table__footer-link-anchor:hover,
.gas-block-pricing-table__footer-link-anchor:focus-visible {
    text-decoration: underline;
    text-underline-offset: 0.18em;
}
/* @gas:block pricing_table end *//* @gas:block bento_grid start */




/* =============================================================================
   Bloc bento_grid — grille modulaire de cellules de tailles variées. Portable WP/Astro.
   ============================================================================= */
.gas-block-bento-grid {
    margin-block: var(--gas-space-2xl);
}
.gas-block-bento-grid__inner {
    max-width: var(--gas-container, var(--gas-container-wide, 1120px));
    margin-inline: auto;
    padding-inline: var(--gas-space-l);
}
.gas-block-bento-grid__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0 0 var(--gas-space-s);
    font-size: var(--gas-text-2xl);
    line-height: var(--gas-leading-tight);
    text-align: center;
}
.gas-block-bento-grid__subtitle {
    margin: 0 auto var(--gas-space-xl);
    max-width: 480px;
    color: var(--gas-color-text-muted);
    font-size: var(--gas-text-l);
    text-align: center;
}
.gas-block-bento-grid__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: minmax(110px, auto);
    grid-auto-flow: dense;
    gap: var(--gas-space-m);
}
.gas-block-bento-grid__item {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: var(--gas-space-2xs);
    padding: var(--gas-space-l);
    background: var(--gas-color-surface-card, #fff);
    border: 1px solid var(--gas-color-border);
    border-radius: var(--gas-radius-l);
    overflow: hidden;
    /* Fond clair propre : couleur de texte fixée (pas d'héritage du tone section).
       Les tuiles avec image gardent leur texte clair via --has-image plus bas. */
    color: var(--gas-color-text);
    text-decoration: none;
    transition: transform var(--gas-transition-normal), box-shadow var(--gas-transition-normal);
}
a.gas-block-bento-grid__item:hover {
    transform: translateY(-3px);
    box-shadow: var(--gas-shadow-m);
}
.gas-block-bento-grid__item--wide  { grid-column: span 2; }
.gas-block-bento-grid__item--tall  { grid-row: span 2; }
.gas-block-bento-grid__item--large { grid-column: span 2; grid-row: span 2; }

.gas-block-bento-grid__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
.gas-block-bento-grid__item--has-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 30%, rgba(0, 0, 0, 0.6));
    z-index: 1;
}
.gas-block-bento-grid__item--has-image .gas-block-bento-grid__body {
    position: relative;
    z-index: 2;
    color: var(--gas-color-white, #fff);
}
.gas-block-bento-grid__body {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-2xs);
}
.gas-block-bento-grid__icon {
    font-size: var(--gas-text-2xl);
    line-height: 1;
    margin-bottom: var(--gas-space-xs);
}
.gas-block-bento-grid__eyebrow {
    font-size: var(--gas-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--gas-primary-text);
    font-weight: var(--gas-weight-semi);
}
.gas-block-bento-grid__item--has-image .gas-block-bento-grid__eyebrow {
    color: var(--gas-color-white, #fff);
    opacity: 0.85;
}
.gas-block-bento-grid__item-title {
    margin: 0;
    font-size: var(--gas-text-l);
    font-weight: var(--gas-weight-semi);
    line-height: var(--gas-leading-tight);
}
.gas-block-bento-grid__item-text {
    margin: 0;
    font-size: var(--gas-text-s);
    color: var(--gas-color-text-muted);
}
.gas-block-bento-grid__item--has-image .gas-block-bento-grid__item-text {
    color: var(--gas-color-white, #fff);
    opacity: 0.9;
}

@media (max-width: 60rem) {
    .gas-block-bento-grid__grid { grid-template-columns: repeat(2, 1fr); }
    .gas-block-bento-grid__item--large { grid-column: span 2; }
}
@media (max-width: 36rem) {
    .gas-block-bento-grid__grid { grid-template-columns: 1fr; }
    .gas-block-bento-grid__item--wide,
    .gas-block-bento-grid__item--tall,
    .gas-block-bento-grid__item--large { grid-column: auto; grid-row: auto; }
}

/* ===== Variante magazine : tuile éditoriale dominante + secondaires + bande
   de micro-cartes chiffrées. Esprit page de revue, pas SaaS. Structure pilotée
   par la POSITION de l'item (--pos-N), même mécanique que image_collage. ===== */
.gas-block-bento-grid--magazine .gas-block-bento-grid__grid {
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: minmax(96px, auto);
}
/* Tuile dominante : items[0], 2 colonnes × 2 lignes, visuel + texte imposants. */
.gas-block-bento-grid--magazine .gas-block-bento-grid__item--pos-1 {
    grid-column: span 2;
    grid-row: span 2;
}
.gas-block-bento-grid--magazine .gas-block-bento-grid__item--pos-1 .gas-block-bento-grid__item-title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-size: var(--gas-text-xl);
    line-height: var(--gas-leading-tight);
}
/* Tuiles secondaires : items[1..3], moyennes, 1 colonne × 1 ligne. */
.gas-block-bento-grid--magazine .gas-block-bento-grid__item--pos-2,
.gas-block-bento-grid--magazine .gas-block-bento-grid__item--pos-3,
.gas-block-bento-grid--magazine .gas-block-bento-grid__item--pos-4 {
    grid-column: span 1;
    grid-row: span 1;
}
/* Bande de micro-cartes : items[4+] (kind=stat), rangée basse, plus compactes. */
.gas-block-bento-grid--magazine .gas-block-bento-grid__item--kind-stat {
    grid-column: span 1;
    grid-row: span 1;
    padding: var(--gas-space-m);
    background: var(--gas-color-surface, var(--gas-color-surface-card, #fff));
    border-style: dashed;
}
.gas-block-bento-grid--magazine .gas-block-bento-grid__stat {
    justify-content: center;
    align-items: flex-start;
    gap: 0;
}
.gas-block-bento-grid--magazine .gas-block-bento-grid__stat-value {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-size: var(--gas-text-2xl);
    font-weight: var(--gas-weight-bold);
    line-height: 1.1;
    color: var(--gas-primary-text);
}
.gas-block-bento-grid--magazine .gas-block-bento-grid__stat-label {
    font-size: var(--gas-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--gas-color-text-muted);
}
/* Citation éventuelle mêlée à la bande basse : prend 2 colonnes, ton éditorial. */
.gas-block-bento-grid--magazine .gas-block-bento-grid__item--kind-quote {
    grid-column: span 2;
    grid-row: span 1;
    background: var(--gas-color-accent-soft, var(--gas-color-surface, #fff));
    border-style: solid;
}
.gas-block-bento-grid--magazine .gas-block-bento-grid__quote-text {
    font-size: var(--gas-text-m);
}
@media (max-width: 60rem) {
    .gas-block-bento-grid--magazine .gas-block-bento-grid__grid { grid-template-columns: repeat(2, 1fr); }
    .gas-block-bento-grid--magazine .gas-block-bento-grid__item--pos-1 { grid-column: span 2; }
}
@media (max-width: 36rem) {
    .gas-block-bento-grid--magazine .gas-block-bento-grid__grid { grid-template-columns: 1fr; }
    .gas-block-bento-grid--magazine .gas-block-bento-grid__item--pos-1,
    .gas-block-bento-grid--magazine .gas-block-bento-grid__item--kind-stat,
    .gas-block-bento-grid--magazine .gas-block-bento-grid__item--kind-quote {
        grid-column: auto;
        grid-row: auto;
    }
}

/* ===== Variante quilt : patchwork organique à hauteurs asymétriques, plus
   doux que le bento standard (thérapeutes, écoles, associations). Mélange
   libre image / texte court / chiffre / citation. Pattern de hauteurs répété
   par groupe de 6 positions pour absorber un nombre variable d'items. ===== */
.gas-block-bento-grid--quilt .gas-block-bento-grid__grid {
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: minmax(64px, auto);
    grid-auto-flow: dense;
    gap: var(--gas-space-l);
}
.gas-block-bento-grid--quilt .gas-block-bento-grid__item {
    border-radius: var(--gas-radius-xl, var(--gas-radius-l));
    border: none;
    box-shadow: var(--gas-shadow-s);
}
.gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-1 { grid-column: span 3; grid-row: span 4; }
.gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-2 { grid-column: span 3; grid-row: span 3; }
.gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-3 { grid-column: span 2; grid-row: span 2; }
.gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-4 { grid-column: span 2; grid-row: span 3; }
.gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-5 { grid-column: span 2; grid-row: span 2; }
.gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-6 { grid-column: span 3; grid-row: span 2; }
.gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-7 { grid-column: span 3; grid-row: span 3; }
.gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-8 { grid-column: span 3; grid-row: span 2; }
/* Tuile chiffre : plus petite, fond doux, centrée — respire au milieu du patchwork. */
.gas-block-bento-grid--quilt .gas-block-bento-grid__item--kind-stat {
    background: var(--gas-color-accent-soft, var(--gas-color-surface, #fff));
    align-items: center;
    text-align: center;
}
.gas-block-bento-grid--quilt .gas-block-bento-grid__stat {
    align-items: center;
    text-align: center;
    width: 100%;
}
.gas-block-bento-grid--quilt .gas-block-bento-grid__stat-value {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-size: var(--gas-text-2xl);
    font-weight: var(--gas-weight-bold);
    color: var(--gas-primary-text);
}
.gas-block-bento-grid--quilt .gas-block-bento-grid__stat-label {
    font-size: var(--gas-text-xs);
    color: var(--gas-color-text-muted);
}
/* Tuile citation : fond accent doux, typographie éditoriale. */
.gas-block-bento-grid--quilt .gas-block-bento-grid__item--kind-quote {
    background: var(--gas-color-accent-soft, var(--gas-color-surface, #fff));
    justify-content: center;
}
.gas-block-bento-grid--quilt .gas-block-bento-grid__quote {
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-xs);
}
.gas-block-bento-grid--quilt .gas-block-bento-grid__quote-text {
    margin: 0;
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-size: var(--gas-text-l);
    font-style: italic;
    line-height: var(--gas-leading-snug, var(--gas-leading-tight));
}
.gas-block-bento-grid--quilt .gas-block-bento-grid__quote-cite {
    font-style: normal;
    font-size: var(--gas-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--gas-color-text-muted);
}
@media (max-width: 60rem) {
    .gas-block-bento-grid--quilt .gas-block-bento-grid__grid { grid-template-columns: repeat(3, 1fr); }
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-1,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-2,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-6,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-7,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-8 { grid-column: span 3; }
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-3,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-4,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-5 { grid-column: span 1; }
}
@media (max-width: 36rem) {
    .gas-block-bento-grid--quilt .gas-block-bento-grid__grid { grid-template-columns: 1fr; }
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-1,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-2,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-3,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-4,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-5,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-6,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-7,
    .gas-block-bento-grid--quilt .gas-block-bento-grid__item--pos-8 {
        grid-column: auto;
        grid-row: auto;
        min-height: 200px;
    }
}
/* @gas:block bento_grid end *//* @gas:block gallery start */




/* =============================================================================
   gallery — layouts additionnels : masonry / carousel / justified / marquee / stack
   ============================================================================= */
/* Masonry — fallback colonnes CSS, puis CSS Grid masonry quand disponible */
.gas-block-gallery--layout-masonry .gas-block-gallery__grid { display: block; column-count: 3; column-gap: var(--gas-space-m); }
.gas-block-gallery--layout-masonry .gas-block-gallery__item { break-inside: avoid; margin-bottom: var(--gas-space-m); }
.gas-block-gallery--layout-masonry .gas-block-gallery__item img { width: 100%; height: auto; display: block; border-radius: var(--gas-radius-m); }
@media (max-width: 60rem) { .gas-block-gallery--layout-masonry .gas-block-gallery__grid { column-count: 2; } }
@media (max-width: 36rem) { .gas-block-gallery--layout-masonry .gas-block-gallery__grid { column-count: 1; } }
@supports (grid-template-rows: masonry) {
    .gas-block-gallery--layout-masonry .gas-block-gallery__grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-template-rows: masonry;
        gap: var(--gas-space-m);
        align-tracks: start;
    }
    .gas-block-gallery--layout-masonry.gas-block-gallery--cols-2 .gas-block-gallery__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .gas-block-gallery--layout-masonry.gas-block-gallery--cols-4 .gas-block-gallery__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .gas-block-gallery--layout-masonry .gas-block-gallery__item {
        break-inside: auto;
        margin-bottom: 0;
    }
    @media (max-width: 60rem) {
        .gas-block-gallery--layout-masonry .gas-block-gallery__grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }
    @media (max-width: 36rem) {
        .gas-block-gallery--layout-masonry .gas-block-gallery__grid {
            grid-template-columns: 1fr;
        }
    }
}

/* Carousel — native = scroll-snap léger ; embla = même markup, moteur premium lazy-loadé */
.gas-block-gallery--layout-carousel .gas-block-gallery__viewport {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: var(--gas-space-s);
}
.gas-block-gallery--layout-carousel.gas-block-gallery--engine-embla .gas-block-gallery__viewport {
    overflow: hidden;
    scroll-snap-type: none;
}
.gas-block-gallery--layout-carousel .gas-block-gallery__grid {
    display: flex;
    gap: clamp(14px, 2vw, 28px);
    min-width: 100%;
}
.gas-block-gallery--layout-carousel.gas-block-gallery--engine-native .gas-block-gallery__grid {
    width: max-content;
}
.gas-block-gallery--layout-carousel .gas-block-gallery__item {
    flex: 0 0 clamp(220px, 28vw, 340px);
    scroll-snap-align: start;
}
.gas-block-gallery--layout-carousel .gas-block-gallery__item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; border-radius: var(--gas-radius-m); }
.gas-block-gallery__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gas-space-m);
    margin-block-end: var(--gas-space-m);
}
.gas-block-gallery__header .gas-block-gallery__title { margin: 0; }
.gas-block-gallery__carousel-controls { display: flex; justify-content: center; gap: var(--gas-space-s); margin-top: var(--gas-space-m); }
.gas-block-gallery__carousel-controls--header-right { flex: none; margin-top: 0; }
.gas-block-gallery--controls-overlay { position: relative; }
.gas-block-gallery__carousel-controls--overlay {
    position: absolute;
    inset-inline: var(--gas-space-s);
    inset-block-start: 50%;
    z-index: 2;
    justify-content: space-between;
    margin-top: 0;
    pointer-events: none;
    transform: translateY(-50%);
}
.gas-block-gallery__carousel-controls--overlay .gas-block-gallery__carousel-control { pointer-events: auto; }

/* Carrousel CSS natif (rail PHP / Astro statique) — boutons + dots zéro-JS via
   ::scroll-button / ::scroll-marker. Gated @supports + engine natif + absence
   de l'island (:not(:has(__carousel-controls))) → jamais de doublon. Fallback
   navigateurs anciens : scroll-snap seul. Libellés localisés via custom props. */
@supports (scroll-marker-group: after) {
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__viewport {
        position: relative;
        scroll-marker-group: after;
    }
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__viewport::scroll-button(left),
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__viewport::scroll-button(right) {
        position: absolute;
        top: 40%;
        z-index: 2;
        inline-size: 22.5px;
        block-size: 22.5px;
        border: 0;
        border-radius: var(--gas-radius-full, 999px);
        background: var(--gas-color-surface-card, #fff);
        box-shadow: var(--gas-shadow-m, 0 2px 8px rgba(0, 0, 0, 0.15));
        color: var(--gas-color-text, #1f2937);
        font-size: 12.5px;
        line-height: 1;
        cursor: pointer;
    }
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__viewport::scroll-button(left) {
        left: 2.5px;
        content: "‹" / var(--gas-carousel-prev-label, "Précédent");
    }
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__viewport::scroll-button(right) {
        right: 2.5px;
        content: "›" / var(--gas-carousel-next-label, "Suivant");
    }
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__viewport::scroll-button(left):disabled,
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__viewport::scroll-button(right):disabled {
        opacity: 0.35;
        cursor: default;
    }
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__viewport::scroll-button(left):focus-visible,
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__viewport::scroll-button(right):focus-visible {
        outline: 2px solid var(--gas-primary, #2563eb);
        outline-offset: 2px;
    }
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__viewport::scroll-marker-group {
        display: flex;
        justify-content: center;
        gap: 4px;
        padding-block-start: 7.5px;
    }
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__item::scroll-marker {
        content: "";
        inline-size: 5px;
        block-size: 5px;
        border: 0;
        border-radius: var(--gas-radius-full, 999px);
        background: var(--gas-color-border, #cbd5e1);
        cursor: pointer;
    }
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__item::scroll-marker:target-current {
        background: var(--gas-primary, #2563eb);
    }
    .gas-block-gallery--layout-carousel.gas-block-gallery--engine-native:not(.gas-block-gallery--controls-off):not(:has(.gas-block-gallery__carousel-controls)) .gas-block-gallery__item::scroll-marker:focus-visible {
        outline: 2px solid var(--gas-primary, #2563eb);
        outline-offset: 2px;
    }
}
@media (max-width: 36rem) {
    .gas-block-gallery--layout-carousel .gas-block-gallery__item {
        flex-basis: min(82%, 280px);
    }
}

/* Justified — rangées de hauteur constante, largeurs variables (type Flickr) */
.gas-block-gallery--layout-justified .gas-block-gallery__grid {
    --gas-gallery-row-height: clamp(120px, 20vw, 220px);
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-s);
}
.gas-block-gallery--layout-justified .gas-block-gallery__item {
    --gas-gallery-item-ratio: 1;
    --gas-gallery-item-basis: 160px;
    flex: var(--gas-gallery-item-ratio) 1 var(--gas-gallery-item-basis);
    min-width: min(100%, var(--gas-gallery-item-basis));
    height: var(--gas-gallery-row-height);
}
.gas-block-gallery__link picture { display: contents; }
.gas-block-gallery--layout-justified .gas-block-gallery__item img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: var(--gas-radius-s); }
@media (max-width: 36rem) {
    .gas-block-gallery--layout-justified .gas-block-gallery__grid {
        --gas-gallery-row-height: clamp(110px, 48vw, 180px);
    }
    .gas-block-gallery--layout-justified .gas-block-gallery__item {
        flex-basis: min(100%, var(--gas-gallery-item-basis));
    }
}
/* @gas:block gallery end */

/* Motion tuiles — scroll-driven CSS, progressif et désactivé en reduced-motion */
@keyframes gas-gallery-tile-enter {
    from {
        opacity: 0.35;
        transform: translateY(18px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}/* @gas:block gallery start */

@media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
        .gas-block-gallery--tile-motion-scroll .gas-block-gallery__item {
            animation: gas-gallery-tile-enter both ease-out;
            animation-timeline: view();
            animation-range: entry 0% cover 30%;
            transform-origin: center;
            will-change: opacity, transform;
        }
        .gas-block-gallery--tile-motion-scroll .gas-block-gallery__item:nth-child(3n + 2) {
            animation-range: entry 5% cover 35%;
        }
        .gas-block-gallery--tile-motion-scroll .gas-block-gallery__item:nth-child(3n) {
            animation-range: entry 10% cover 40%;
        }
    }
}

/* Marquee — ruban défilant en continu (drift doux ; statique si reduced-motion) */
.gas-block-gallery--layout-marquee { overflow: hidden; }
.gas-block-gallery--layout-marquee .gas-block-gallery__grid { display: flex; gap: var(--gas-space-m); width: max-content; animation: gas-gallery-marquee 40s linear infinite; }
.gas-block-gallery--layout-marquee .gas-block-gallery__item { flex: 0 0 auto; width: 160px; }
.gas-block-gallery--layout-marquee .gas-block-gallery__item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; border-radius: var(--gas-radius-m); }
/* @gas:block gallery end */
@keyframes gas-gallery-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }/* @gas:block gallery start */

@media (prefers-reduced-motion: reduce) { .gas-block-gallery--layout-marquee .gas-block-gallery__grid { animation: none; flex-wrap: wrap; width: auto; } }

/* Stack — pile de polaroids pivotés, se déploie au survol */
.gas-block-gallery--layout-stack .gas-block-gallery__grid { display: flex; justify-content: center; flex-wrap: wrap; padding: var(--gas-space-l) 0; }
.gas-block-gallery--layout-stack .gas-block-gallery__item { width: 130px; margin-inline: -25px; padding: var(--gas-space-xs); background: var(--gas-color-surface-card, #fff); border: 1px solid var(--gas-color-border); border-radius: var(--gas-radius-s); box-shadow: var(--gas-shadow-m); transform: rotate(-4deg); transition: transform var(--gas-transition-normal), margin var(--gas-transition-normal); }
.gas-block-gallery--layout-stack .gas-block-gallery__item:nth-child(even) { transform: rotate(4deg); }
.gas-block-gallery--layout-stack .gas-block-gallery__grid:hover .gas-block-gallery__item { margin-inline: var(--gas-space-xs); transform: rotate(0); }
.gas-block-gallery--layout-stack .gas-block-gallery__item img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block; }

/* Overrides finaux des variantes historiques de galerie : garder le polish commun. */
.gas-block-gallery--layout-carousel .gas-block-gallery__item img,
.gas-block-gallery--layout-justified .gas-block-gallery__item img,
.gas-block-gallery--layout-masonry .gas-block-gallery__item img,
.gas-block-gallery--layout-marquee .gas-block-gallery__item img {
    border-radius: 0;
}

.gas-block-gallery--layout-carousel .gas-block-gallery__item,
.gas-block-gallery--layout-justified .gas-block-gallery__item,
.gas-block-gallery--layout-masonry .gas-block-gallery__item,
.gas-block-gallery--layout-marquee .gas-block-gallery__item {
    border-radius: var(--gas-gallery-radius);
    overflow: hidden;
}

.gas-block-gallery--layout-marquee .gas-block-gallery__item {
    width: clamp(150px, 16vw, 210px);
}
/* @gas:block gallery end *//* @gas:block logo_marquee start */




/* =============================================================================
   Bloc logo_marquee — bandeau de logos défilant (boucle fluide via piste dupliquée)
   ============================================================================= */
.gas-block-logo-marquee { margin-block: var(--gas-space-2xl); text-align: center; }
.gas-block-logo-marquee__title { margin: 0 0 var(--gas-space-l); color: var(--gas-color-text-muted); font-size: var(--gas-text-s); text-transform: uppercase; letter-spacing: 0.06em; }
.gas-block-logo-marquee__viewport { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.gas-block-logo-marquee__track { display: flex; gap: var(--gas-space-2xl); width: max-content; align-items: center; animation: gas-logo-marquee 30s linear infinite; }
.gas-block-logo-marquee--speed-slow .gas-block-logo-marquee__track { animation-duration: 50s; }
.gas-block-logo-marquee--speed-fast .gas-block-logo-marquee__track { animation-duration: 18s; }
.gas-block-logo-marquee__viewport:hover .gas-block-logo-marquee__track { animation-play-state: paused; }
.gas-block-logo-marquee__item { flex: 0 0 auto; display: inline-flex; align-items: center; }
.gas-block-logo-marquee__img { height: 26px; width: auto; max-width: 120px; object-fit: contain; display: block; }
.gas-block-logo-marquee--grayscale .gas-block-logo-marquee__img { filter: grayscale(1); opacity: .7; transition: filter var(--gas-transition-normal), opacity var(--gas-transition-normal); }
.gas-block-logo-marquee--grayscale .gas-block-logo-marquee__item:hover .gas-block-logo-marquee__img { filter: grayscale(0); opacity: 1; }
/* @gas:block logo_marquee end */
@keyframes gas-logo-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }/* @gas:block logo_marquee start */

@media (prefers-reduced-motion: reduce) { .gas-block-logo-marquee__track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; } }
/* @gas:block logo_marquee end *//* @gas:block timeline start */




/* =============================================================================
   Bloc timeline — frise chronologique verticale
   ============================================================================= */
.gas-block-timeline { margin-block: var(--gas-space-2xl); }
.gas-block-timeline__inner { max-width: var(--gas-container, var(--gas-container-narrow, 640px)); margin-inline: auto; padding-inline: var(--gas-space-l); }
.gas-block-timeline__title { margin: 0 0 var(--gas-space-s); font-size: var(--gas-text-2xl); line-height: var(--gas-leading-tight); text-align: center; font-family: var(--gas-font-heading, var(--gas-font-base, inherit)); }
.gas-block-timeline__subtitle { margin: 0 auto var(--gas-space-xl); color: var(--gas-color-text-muted); text-align: center; max-width: 480px; }
.gas-block-timeline__list { list-style: none; margin: 0; padding: 0; position: relative; }
.gas-block-timeline__list::before { content: ''; position: absolute; left: 9px; top: 6px; bottom: 6px; width: 2px; background: var(--gas-color-border); }
.gas-block-timeline__item { position: relative; display: flex; gap: var(--gas-space-m); padding-bottom: calc(var(--gas-space-xl) * var(--gas-density, 1)); }
.gas-block-timeline__item:last-child { padding-bottom: 0; }
.gas-block-timeline__dot { position: relative; z-index: 1; flex: 0 0 auto; width: 19px; height: 19px; border-radius: var(--gas-radius-full); background: var(--gas-color-primary); color: var(--gas-color-on-primary, #fff); display: inline-flex; align-items: center; justify-content: center; font-size: var(--gas-text-s); }
.gas-block-timeline__body { padding-top: 1px; }
.gas-block-timeline__marker { font-size: var(--gas-text-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--gas-primary-text); font-weight: var(--gas-weight-semi); }
.gas-block-timeline__item-title { margin: 1.5px 0 2.5px; font-size: var(--gas-text-l); }
.gas-block-timeline__item-text { margin: 0; color: var(--gas-color-text-muted); font-size: var(--gas-text-s); }
/* @gas:block timeline end *//* @gas:block comparison_table start */




/* =============================================================================
   Bloc comparison_table — comparatif features × plans
   ============================================================================= */
.gas-block-comparison-table { margin-block: var(--gas-space-2xl); }
.gas-block-comparison-table__inner { max-width: var(--gas-container, var(--gas-container-default, 800px)); margin-inline: auto; padding-inline: var(--gas-space-l); }
.gas-block-comparison-table__title { margin: 0 0 var(--gas-space-s); font-size: var(--gas-text-2xl); line-height: var(--gas-leading-tight); text-align: center; font-family: var(--gas-font-heading, var(--gas-font-base, inherit)); }
.gas-block-comparison-table__subtitle { margin: 0 auto var(--gas-space-xl); color: var(--gas-color-text-muted); text-align: center; max-width: 480px; }
.gas-block-comparison-table__scroll { overflow-x: auto; }
.gas-block-comparison-table__table { width: 100%; border-collapse: collapse; font-size: var(--gas-text-s); }
.gas-block-comparison-table__table th,
.gas-block-comparison-table__table td { padding: calc(var(--gas-space-s) * var(--gas-density, 1)) var(--gas-space-m); text-align: center; border-bottom: 1px solid var(--gas-color-border); }
.gas-block-comparison-table__col { font-weight: var(--gas-weight-semi); font-size: var(--gas-text-m); }
.gas-block-comparison-table__feature { text-align: left; font-weight: var(--gas-weight-medium); color: var(--gas-color-text); }
.gas-block-comparison-table__col.is-featured,
.gas-block-comparison-table__cell.is-featured { background: var(--gas-color-primary-soft); }
.gas-block-comparison-table__col.is-featured { color: var(--gas-primary-text); border-top: 2px solid var(--gas-color-primary); border-top-left-radius: var(--gas-radius-m); border-top-right-radius: var(--gas-radius-m); }
.gas-block-comparison-table__yes { color: var(--gas-primary-text); font-weight: var(--gas-weight-bold); }
.gas-block-comparison-table__no { color: var(--gas-color-text-muted); opacity: .5; }
.gas-block-comparison-table__val { color: var(--gas-color-text); }
/* @gas:block comparison_table end *//* @gas:block pricing_toggle start */




/* ===== Blocs/variantes ajoutés (workflow parallèle) — intégrés ===== */

/* =============================================================================
   Bloc pricing_toggle — bascule Mensuel/Annuel qui pilote un pricing_table voisin.
   Portable WP/Astro. Le toggle ajoute/retire .is-annual sur la cible.
   ============================================================================= */
.gas-block-pricing-toggle {
    margin-block: calc(var(--gas-space-l) * var(--gas-density, 1));
}
.gas-block-pricing-toggle__inner {
    max-width: var(--gas-container, var(--gas-container-narrow, 640px));
    margin-inline: auto;
    padding-inline: var(--gas-space-l);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--gas-space-m);
}
.gas-block-pricing-toggle__control {
    display: inline-flex;
    padding: var(--gas-space-2xs);
    background: var(--gas-color-surface-card, #fff);
    border: 1px solid var(--gas-color-border);
    border-radius: var(--gas-radius-full);
    box-shadow: var(--gas-shadow-s);
}
.gas-block-pricing-toggle__option {
    appearance: none;
    margin: 0;
    border: 0;
    cursor: pointer;
    padding: var(--gas-space-xs) var(--gas-space-l);
    background: transparent;
    color: var(--gas-color-text-muted);
    font-size: var(--gas-text-s);
    font-weight: var(--gas-weight-semi);
    border-radius: var(--gas-radius-full);
    transition: background-color 0.2s var(--gas-ease-standard, ease), color 0.2s var(--gas-ease-standard, ease);
}
.gas-block-pricing-toggle__option[aria-selected="true"] {
    background: var(--gas-color-primary);
    color: var(--gas-color-on-primary, #fff);
    box-shadow: var(--gas-shadow-s);
}
.gas-block-pricing-toggle__save {
    color: var(--gas-accent-text);
    font-size: var(--gas-text-s);
    font-weight: var(--gas-weight-semi);
}
@media (prefers-reduced-motion: reduce) {
    .gas-block-pricing-toggle__option {
        transition: none;
    }
}
/* @gas:block pricing_toggle end *//* @gas:block pricing_table start */




/* Bascule mensuel/annuel sur le pricing_table cible.
   Par défaut : prix mensuel visible, annuel masqué (hidden inline).
   Quand un ancêtre porte .is-annual : on inverse. */
.gas-block-pricing-table .gas-block-pricing-table__price--annual {
    display: none;
}
.is-annual .gas-block-pricing-table__price--monthly,
.gas-block-pricing-table.is-annual .gas-block-pricing-table__price--monthly {
    display: none;
}
.is-annual .gas-block-pricing-table__price--annual[hidden],
.gas-block-pricing-table.is-annual .gas-block-pricing-table__price--annual[hidden] {
    display: flex;
}
/* @gas:block pricing_table end *//* @gas:block feature_tabs start */




/* =========================================================================
 * Bloc feature_tabs — Fonctionnalités en onglets (role=tablist/tab/tabpanel)
 * ========================================================================= */
.gas-block-feature-tabs { margin-block: calc(var(--gas-space-2xl) * var(--gas-density, 1)); }
.gas-block-feature-tabs__inner { max-width: var(--gas-container, var(--gas-container-default, 800px)); margin-inline: auto; padding-inline: var(--gas-space-l); }
.gas-block-feature-tabs__title { margin: 0 0 var(--gas-space-s); font-size: var(--gas-text-3xl); line-height: var(--gas-leading-tight); text-align: center; font-family: var(--gas-font-heading, var(--gas-font-base, inherit)); }
.gas-block-feature-tabs__subtitle { margin: 0 auto var(--gas-space-xl); color: var(--gas-color-text-muted); text-align: center; max-width: 480px; }

.gas-block-feature-tabs__tablist {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--gas-space-xs);
    margin-bottom: calc(var(--gas-space-xl) * var(--gas-density, 1));
    border-bottom: 1px solid var(--gas-color-border);
}
.gas-block-feature-tabs__tab {
    appearance: none;
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: var(--gas-space-s) var(--gas-space-m);
    margin-bottom: -1px;
    font: inherit;
    font-size: var(--gas-text-m);
    font-weight: var(--gas-weight-medium);
    color: var(--gas-color-text-muted);
    border-bottom: 2px solid transparent;
    border-radius: var(--gas-radius-s) var(--gas-radius-s) 0 0;
    transition: color var(--gas-transition-fast, 150ms), border-color var(--gas-transition-fast, 150ms), background-color var(--gas-transition-fast, 150ms);
}
.gas-block-feature-tabs__tab:hover { color: var(--gas-color-text); background: var(--gas-color-surface-card); }
.gas-block-feature-tabs__tab.is-active,
.gas-block-feature-tabs__tab[aria-selected="true"] {
    color: var(--gas-primary-text);
    border-bottom-color: var(--gas-primary-text);
    font-weight: var(--gas-weight-semi);
}

.gas-block-feature-tabs__panels { position: relative; }
.gas-block-feature-tabs__panel {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--gas-space-xl);
    align-items: center;
}
.gas-block-feature-tabs__panel[hidden] { display: none; }
.gas-block-feature-tabs__panel-title { margin: 0 0 var(--gas-space-s); font-size: var(--gas-text-2xl); line-height: var(--gas-leading-tight); }
.gas-block-feature-tabs__panel-text { margin: 0; color: var(--gas-color-text-muted); font-size: var(--gas-text-m); line-height: var(--gas-leading-relaxed, 1.625); }
.gas-block-feature-tabs__panel-media { overflow: hidden; border-radius: var(--gas-radius-l); box-shadow: var(--gas-shadow-m); }
.gas-block-feature-tabs__image { display: block; width: 100%; height: auto; }

@media (min-width: 48rem) {
    .gas-block-feature-tabs__panel { grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .gas-block-feature-tabs__tab { transition: none; }
}
/* @gas:block feature_tabs end *//* @gas:block cta_sticky_bar start */





/* =============================================================================
   Bloc cta_sticky_bar — barre d'appel à l'action flottante (bas d'écran, fixed)
   ============================================================================= */
.gas-block-cta-sticky-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--gas-z-sticky, 1000);
    padding-inline: var(--gas-space-m);
    padding-block: calc(var(--gas-space-s) * var(--gas-density, 1));
    padding-bottom: calc(var(--gas-space-s) * var(--gas-density, 1) + env(safe-area-inset-bottom, 0px));
    background: var(--gas-color-primary);
    color: var(--gas-color-on-primary, #fff);
    box-shadow: var(--gas-shadow-l);
}
.gas-block-cta-sticky-bar[hidden] { display: none; }
.gas-block-cta-sticky-bar__inner {
    max-width: var(--gas-container, var(--gas-container-wide, 960px));
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: calc(var(--gas-space-s) * var(--gas-density, 1));
}
.gas-block-cta-sticky-bar__text {
    margin: 0;
    font-size: var(--gas-text-s);
    line-height: var(--gas-leading-snug, 1.4);
}
.gas-block-cta-sticky-bar__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gas-space-s);
}
.gas-block-cta-sticky-bar__cta { flex: 1 1 auto; text-align: center; }
.gas-block-cta-sticky-bar__close {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    border-radius: var(--gas-radius-full);
    background: transparent;
    color: inherit;
    font-size: var(--gas-text-l);
    line-height: 1;
    cursor: pointer;
    opacity: 0.85;
}
.gas-block-cta-sticky-bar__close:hover { opacity: 1; background: rgba(0, 0, 0, 0.12); }

/* Desktop : barre horizontale alignée */
@media (min-width: 48rem) {
    .gas-block-cta-sticky-bar__inner {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: var(--gas-space-l);
    }
    .gas-block-cta-sticky-bar__text { flex: 1 1 auto; font-size: var(--gas-text-m); }
    .gas-block-cta-sticky-bar__actions { flex: 0 0 auto; justify-content: flex-end; }
    .gas-block-cta-sticky-bar__cta { flex: 0 0 auto; }
}

/* Tonalités — adaptatives dark via tokens (l'applicateur central pose is-tone-*) */
.gas-block-cta-sticky-bar.is-tone-surface { background: var(--gas-color-surface-card); color: var(--gas-color-text); border-top: 1px solid var(--gas-color-border); }
.gas-block-cta-sticky-bar.is-tone-accent { background: var(--gas-accent-dark); color: var(--gas-color-on-accent, #fff); }
.gas-block-cta-sticky-bar.is-tone-primary { background: var(--gas-color-primary); color: var(--gas-color-on-primary, #fff); }
.gas-block-cta-sticky-bar.is-tone-dark { background: var(--gas-tone-dark-bg, #111827); color: var(--gas-tone-dark-fg, #f9fafb); }

/* Alignement du texte (l'applicateur central pose is-align-*) */
.gas-block-cta-sticky-bar.is-align-center .gas-block-cta-sticky-bar__text { text-align: center; }
.gas-block-cta-sticky-bar.is-align-right .gas-block-cta-sticky-bar__text { text-align: right; }

/* Animation d'entrée — neutralisée si l'utilisateur préfère un mouvement réduit
   (l'enhancer JS n'ajoute la classe --enter qu'en l'absence de prefers-reduced-motion). */
@media (prefers-reduced-motion: no-preference) {
    .gas-block-cta-sticky-bar--enter {
        animation: gas-cta-sticky-bar-in var(--gas-duration-m, 240ms) var(--gas-ease-out, ease-out) both;
    }
}
/* @gas:block cta_sticky_bar end */
@keyframes gas-cta-sticky-bar-in {
    from { transform: translateY(100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}/* @gas:block cta_sticky_bar start */


/* Position haut d'écran (alternative au bas par défaut). */
.gas-block-cta-sticky-bar--position-top {
    top: 0;
    bottom: auto;
    padding-bottom: calc(var(--gas-space-s) * var(--gas-density, 1));
    padding-top: calc(var(--gas-space-s) * var(--gas-density, 1) + env(safe-area-inset-top, 0px));
}
@media (prefers-reduced-motion: no-preference) {
    .gas-block-cta-sticky-bar--position-top.gas-block-cta-sticky-bar--enter {
        animation-name: gas-cta-sticky-bar-in-top;
    }
}
/* @gas:block cta_sticky_bar end */
@keyframes gas-cta-sticky-bar-in-top {
    from { transform: translateY(-100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}/* @gas:block before_after start */


/* =============================================================================
   Bloc before_after — comparateur d'images avant/après (curseur draggable)
   ============================================================================= */
.gas-block-before-after { margin-block: var(--gas-space-2xl); }
.gas-block-before-after__inner { max-width: var(--gas-container, var(--gas-container-default, 800px)); margin-inline: auto; padding-inline: var(--gas-space-l); }
.gas-block-before-after__title { margin: 0 0 var(--gas-space-s); font-size: var(--gas-text-2xl); line-height: var(--gas-leading-tight); text-align: center; font-family: var(--gas-font-heading, var(--gas-font-base, inherit)); }
.gas-block-before-after__subtitle { margin: 0 auto var(--gas-space-xl); color: var(--gas-color-text-muted); text-align: center; max-width: 480px; }

.gas-block-before-after__figure {
    --gas-ba-start: 50%;
    position: relative;
    margin: 0;
    width: 100%;
    overflow: hidden;
    border-radius: var(--gas-radius-l);
    box-shadow: var(--gas-shadow-m);
    background: var(--gas-color-surface-card);
    user-select: none;
    touch-action: pan-y;
    line-height: 0;
}
.gas-block-before-after__pane { position: absolute; inset: 0; }
.gas-block-before-after__pane--after { position: relative; }
.gas-block-before-after__pane--before {
    clip-path: inset(0 calc(100% - var(--gas-ba-start)) 0 0);
}
.gas-block-before-after__image { display: block; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }

.gas-block-before-after__badge {
    position: absolute;
    top: var(--gas-space-m);
    padding: calc(var(--gas-space-xs)) var(--gas-space-s);
    border-radius: var(--gas-radius-s, var(--gas-radius-m));
    background: var(--gas-color-surface-card);
    color: var(--gas-color-text);
    font-size: var(--gas-text-xs);
    line-height: var(--gas-leading-tight);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: var(--gas-weight-semi);
    box-shadow: var(--gas-shadow-m);
}
.gas-block-before-after__badge--before { left: var(--gas-space-m); }
.gas-block-before-after__badge--after { right: var(--gas-space-m); }

.gas-block-before-after__handle {
    position: absolute;
    top: 0;
    bottom: 0;
    left: var(--gas-ba-start);
    transform: translateX(-50%);
    width: 28px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: ew-resize;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}
.gas-block-before-after__handle-line {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 2px;
    transform: translateX(-50%);
    background: var(--gas-color-surface-card);
    box-shadow: var(--gas-shadow-m);
}
.gas-block-before-after__handle-grip {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: var(--gas-radius-full);
    background: var(--gas-color-primary);
    color: var(--gas-color-on-primary, #fff);
    box-shadow: var(--gas-shadow-m);
    transition: transform var(--gas-transition-fast, 0.15s) var(--gas-ease-standard, ease);
}
.gas-block-before-after__handle-grip svg { width: 14px; height: 14px; }
.gas-block-before-after__handle:hover .gas-block-before-after__handle-grip { transform: scale(1.08); }
.gas-block-before-after__handle:focus-visible { outline: none; }
.gas-block-before-after__handle:focus-visible .gas-block-before-after__handle-grip {
    outline: 2px solid var(--gas-color-primary);
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    .gas-block-before-after__handle-grip { transition: none; }
    .gas-block-before-after__handle:hover .gas-block-before-after__handle-grip { transform: none; }
}
/* @gas:block before_after end *//* @gas:block faq_columns start */





/* =============================================================================
   Bloc faq_columns — FAQ en deux colonnes, questions/réponses ouvertes
   ============================================================================= */
.gas-block-faq-columns { margin-block: var(--gas-space-2xl); }
.gas-block-faq-columns__inner { max-width: var(--gas-container, var(--gas-container-default, 800px)); margin-inline: auto; padding-inline: var(--gas-space-l); }
.gas-block-faq-columns__title { margin: 0 0 var(--gas-space-s); font-size: var(--gas-text-2xl); line-height: var(--gas-leading-tight); font-family: var(--gas-font-heading, var(--gas-font-base, inherit)); }
.gas-block-faq-columns__subtitle { margin: 0 0 var(--gas-space-xl); color: var(--gas-color-text-muted); max-width: 480px; }
.gas-block-faq-columns.is-align-center .gas-block-faq-columns__subtitle { margin-inline: auto; }
.gas-block-faq-columns__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: calc(var(--gas-space-xl) * var(--gas-density, 1)) var(--gas-space-2xl);
    text-align: left;
}
.gas-block-faq-columns__item { min-width: 0; }
.gas-block-faq-columns__question { margin: 0 0 var(--gas-space-xs); font-size: var(--gas-text-l); line-height: var(--gas-leading-snug, 1.4); color: var(--gas-color-text); }
.gas-block-faq-columns__answer { margin: 0; color: var(--gas-color-text-muted); font-size: var(--gas-text-s); line-height: var(--gas-leading-relaxed, 1.625); }
.gas-block-faq-columns__answer > :first-child { margin-top: 0; }
.gas-block-faq-columns__answer > :last-child { margin-bottom: 0; }
.gas-block-faq-columns__answer a { color: var(--gas-primary-text); }
@media (max-width: 48rem) {
    .gas-block-faq-columns__grid { grid-template-columns: minmax(0, 1fr); gap: calc(var(--gas-space-l) * var(--gas-density, 1)); }
}
/* @gas:block faq_columns end *//* @gas:block hero start */






/* ==========================================================================
   Hero — variante media_grid : texte d'un côté, grille asymétrique d'images
   (1 grande + 2 petites) de l'autre. Respecte image_position (left/right).
   ========================================================================== */

.gas-block-hero--media_grid .gas-block-hero__inner {
    gap: calc(var(--gas-space-6, 20px) * var(--gas-density, 1));
    max-width: var(--gas-container, 720px);
}

.gas-block-hero__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 1fr;
    gap: var(--gas-space-3, 7.5px);
}

.gas-block-hero__grid-cell {
    margin: 0;
    overflow: hidden;
    border-radius: var(--gas-radius-l, 10px);
    box-shadow: var(--gas-shadow-m, 0 8px 24px rgba(0, 0, 0, 0.12));
    background: var(--gas-color-surface-card, #fff);
}

/* Grande tuile : occupe les deux colonnes, plus haute. */
.gas-block-hero__grid-cell--large {
    grid-column: 1 / -1;
    aspect-ratio: 16 / 9;
}

.gas-block-hero__grid-cell--small {
    aspect-ratio: 1 / 1;
}

.gas-block-hero__grid-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Empilement mobile : texte au-dessus, grille en dessous. */
@media (min-width: 768px) {
    .gas-block-hero--media_grid .gas-block-hero__inner {
        grid-template-columns: 1fr 1fr;
        align-items: center;
    }

    /* image_position=left : on inverse l'ordre des colonnes (DOM reste
       texte-d'abord pour le mobile/a11y, où tout est empilé). */
    .gas-block-hero--media_grid.gas-block-hero--media-left .gas-block-hero__content { order: 2; }
    .gas-block-hero--media_grid.gas-block-hero--media-left .gas-block-hero__grid { order: 1; }
}
/* @gas:block hero end *//* @gas:block cta start */





/* ── CTA variantes split_image / with_background ─────────────────────────── */

/* Densité + container appliqués par l'applicateur central sur la racine.
   On scope aux variantes pour ne pas perturber le CTA "default" historique. */

.gas-block-cta--variant-split_image,
.gas-block-cta--variant-with_background {
    padding-block: calc(var(--gas-space-l, 20px) * var(--gas-density, 1));
    padding-inline: 0;
    margin-block: calc(var(--gas-space-l, 20px) * var(--gas-density, 1));
    background: transparent;
    text-align: left;
}

/* — Variante split_image : visuel d'un côté, texte de l'autre — */
.gas-block-cta--variant-split_image .gas-block-cta__inner {
    max-width: var(--gas-container, var(--gas-container-default, 720px));
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: calc(var(--gas-space-l, 20px) * var(--gas-density, 1));
    align-items: center;
    padding-inline: var(--gas-space-m, 15px);
    border-radius: var(--gas-radius-l, 10px);
    overflow: hidden;
    background: var(--gas-color-surface-card, #fff);
    border: 1px solid var(--gas-color-border, #e5e7eb);
}

.gas-block-cta--variant-split_image.gas-block-cta--media-right .gas-block-cta__media {
    order: 2;
}

.gas-block-cta--variant-split_image .gas-block-cta__media {
    margin: 0;
    aspect-ratio: var(--gas-aspect-card, 4 / 3);
    border-radius: var(--gas-radius-m, 7.5px);
    overflow: hidden;
}

.gas-block-cta--variant-split_image .gas-block-cta__image {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    object-fit: cover;
}

.gas-block-cta--variant-split_image .gas-block-cta__body {
    display: grid;
    gap: calc(var(--gas-space-m, 15px) * var(--gas-density, 1));
}

/* — Variante with_background : fond image + overlay + texte clair — */
.gas-block-cta--variant-with_background {
    position: relative;
    isolation: isolate;
    border-radius: var(--gas-radius-l, 10px);
    overflow: hidden;
    background-color: var(--gas-color-secondary, #1f2937);
    background-image: var(--gas-block-cta-image, none);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    text-align: center;
}

.gas-block-cta--variant-with_background .gas-block-cta__overlay {
    position: absolute;
    inset: 0;
    z-index: 0;
    background: #000;
    opacity: var(--gas-block-cta-overlay-opacity, 0.55);
    pointer-events: none;
}

.gas-block-cta--variant-with_background .gas-block-cta__inner {
    position: relative;
    z-index: 1;
    max-width: var(--gas-container, var(--gas-container-default, 720px));
    margin-inline: auto;
    padding-inline: var(--gas-space-l, 20px);
    display: grid;
    justify-items: center;
    gap: calc(var(--gas-space-m, 15px) * var(--gas-density, 1));
}

.gas-block-cta--variant-with_background .gas-block-cta__body {
    display: grid;
    gap: calc(var(--gas-space-m, 15px) * var(--gas-density, 1));
    justify-items: center;
    max-width: 480px;
}

/* Texte clair lisible par-dessus l'image */
.gas-block-cta--variant-with_background :is(.gas-block-cta__title, .gas-block-cta__text),
.gas-block-cta--variant-with_background .gas-block-cta__text :is(p, li, a) {
    color: var(--gas-text-color-inverse, #fff);
}

.gas-block-cta--variant-with_background .gas-block-cta__text {
    opacity: 0.92;
}

.gas-block-cta--variant-with_background .gas-block-cta__actions {
    justify-content: center;
}

/* Responsive : le visuel passe au-dessus du texte sur mobile */
@media (max-width: 48rem) {
    .gas-block-cta--variant-split_image .gas-block-cta__inner {
        grid-template-columns: 1fr;
    }
    .gas-block-cta--variant-split_image.gas-block-cta--media-right .gas-block-cta__media {
        order: 0;
    }
}
/* @gas:block cta end *//* @gas:block testimonials start */




/* ── Testimonials — variante « featured » : une grande citation mise en avant ── */
.gas-block-testimonials--featured .gas-block-testimonials__inner {
    max-width: var(--gas-container, var(--gas-container-narrow, 480px));
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: calc(var(--gas-space-l) * var(--gas-density, 1));
    padding-block: calc(var(--gas-space-xl) * var(--gas-density, 1));
}

/* ── testimonials : variante side_by_side (image + citation horizontale) ── */
.gas-block-testimonials--side_by_side .gas-block-testimonials__sbs {
    display: grid;
    gap: var(--gas-space-xl, 30px);
    align-items: center;
    margin: 0;
}
.gas-block-testimonials--side_by_side .gas-block-testimonials__sbs-media img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-l, 12px);
    object-fit: cover;
}
.gas-block-testimonials--side_by_side .gas-block-testimonials__sbs-quote {
    margin: 0 0 var(--gas-space-m, 10px);
    font-size: var(--gas-text-l, 12.5px);
    line-height: 1.4;
}
.gas-block-testimonials--side_by_side .gas-block-testimonials__sbs-cite {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-2xs, 2.5px);
}
.gas-block-testimonials--side_by_side .gas-block-testimonials__sbs-cite .gas-block-testimonials__author {
    font-weight: 600;
}
.gas-block-testimonials--side_by_side .gas-block-testimonials__sbs-cite .gas-block-testimonials__role {
    color: var(--gas-color-text-muted, #4a4a4a);
}
@media (min-width: 720px) {
    .gas-block-testimonials--side_by_side .gas-block-testimonials__sbs {
        grid-template-columns: minmax(0, 180px) 1fr;
    }
}

.gas-block-testimonials__featured {
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: calc(var(--gas-space-m) * var(--gas-density, 1));
    align-items: center;
    text-align: center;
}

.gas-block-testimonials__featured-logo img {
    display: block;
    height: var(--gas-space-2xl);
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

.gas-block-testimonials__featured-quote {
    margin: 0;
    font-size: var(--gas-text-2xl);
    line-height: 1.3;
    font-weight: 600;
    color: var(--gas-color-text);
    max-width: 38ch;
}

.gas-block-testimonials__featured-quote::before {
    content: "\201C";
    margin-inline-end: 0.1em;
    color: var(--gas-accent-text);
}

.gas-block-testimonials__featured-quote::after {
    content: "\201D";
    margin-inline-start: 0.05em;
    color: var(--gas-accent-text);
}

.gas-block-testimonials__featured-cite {
    display: flex;
    align-items: center;
    gap: var(--gas-space-s);
    font-style: normal;
}

.gas-block-testimonials__featured-avatar {
    flex: 0 0 auto;
    width: var(--gas-space-2xl);
    height: var(--gas-space-2xl);
    border-radius: var(--gas-radius-full, 999px);
    overflow: hidden;
}

.gas-block-testimonials__featured-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--gas-radius-full, 999px);
}

.gas-block-testimonials__featured-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: start;
    line-height: 1.3;
}

.gas-block-testimonials__featured-author {
    font-weight: 600;
    color: var(--gas-color-text);
}

.gas-block-testimonials__featured-role {
    font-size: var(--gas-text-s);
    color: var(--gas-color-text-muted);
}

@media (max-width: 640px) {
    .gas-block-testimonials__featured-quote {
        font-size: var(--gas-text-xl);
    }
}
/* @gas:block testimonials end *//* @gas:block feature_showcase start */



/* ── Bloc feature_showcase : capture encadrée + checklist ── */
.gas-block-feature-showcase__inner {
    max-width: min(100%, var(--gas-content-max-width, 720px));
    margin-inline: auto;
    display: grid;
    gap: var(--gas-block-gap-l, 25px);
    align-items: center;
}

.gas-block-feature-showcase--split .gas-block-feature-showcase__inner {
    grid-template-columns: 1fr 1fr;
}

.gas-block-feature-showcase--media-left .gas-block-feature-showcase__media {
    order: -1;
}

.gas-block-feature-showcase--stacked .gas-block-feature-showcase__inner {
    grid-template-columns: 1fr;
}

.gas-block-feature-showcase--stacked .gas-block-feature-showcase__content {
    max-width: 480px;
    margin-inline: auto;
    text-align: center;
}

.gas-block-feature-showcase__eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--gas-text-s, 8.5px);
    color: var(--gas-primary, #2563eb);
    font-weight: 600;
    margin: 0 0 5px;
}

.gas-block-feature-showcase__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-size: var(--gas-text-3xl, 20px);
    margin: 0 0 5px;
    line-height: 1.15;
}

.gas-block-feature-showcase__text {
    color: var(--gas-color-text-muted, #64748b);
    margin: 0;
}

.gas-block-feature-showcase__list {
    list-style: none;
    margin: 12.5px 0 0;
    padding: 0;
    display: grid;
    gap: 6px;
}

.gas-block-feature-showcase--stacked .gas-block-feature-showcase__list {
    display: inline-grid;
    text-align: left;
}

.gas-block-feature-showcase__item {
    display: flex;
    gap: 6px;
    align-items: flex-start;
}

.gas-block-feature-showcase__check {
    width: 12.5px;
    height: 12.5px;
    flex: none;
    color: var(--gas-success, #16a34a);
    margin-top: 0.15em;
}

.gas-block-feature-showcase__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 7.5px;
    margin-top: 15px;
}

.gas-block-feature-showcase--stacked .gas-block-feature-showcase__actions {
    justify-content: center;
}

.gas-block-feature-showcase__media img {
    width: 100%;
    height: auto;
}

@media (max-width: 860px) {
    .gas-block-feature-showcase--split .gas-block-feature-showcase__inner {
        grid-template-columns: 1fr;
    }

    .gas-block-feature-showcase--media-left .gas-block-feature-showcase__media {
        order: 0;
    }
}
/* @gas:block feature_showcase end *//* @gas:block features_grid start */




/* ── features_grid : styles d'items (cards / bordered / numbered) ── */
.gas-block-features-grid--style-cards .gas-block-features-grid__item {
    background: var(--gas-white, #fff);
    border: 1px solid var(--gas-neutral-100, #f1f5f9);
    border-radius: var(--gas-radius-l, 12px);
    padding: 15px;
    box-shadow: 0 10px 30px -16px rgba(15, 23, 42, 0.2);
}

.gas-block-features-grid--style-bordered .gas-block-features-grid__item {
    border: 1px solid var(--gas-neutral-200, #e2e8f0);
    border-radius: var(--gas-radius-m, 10px);
    padding: 15px;
}

.gas-block-features-grid--style-numbered .gas-block-features-grid__grid {
    counter-reset: gas-fg;
}

.gas-block-features-grid--style-numbered .gas-block-features-grid__item {
    counter-increment: gas-fg;
    position: relative;
    padding-top: 27.5px;
}

.gas-block-features-grid--style-numbered .gas-block-features-grid__item::before {
    content: counter(gas-fg, decimal-leading-zero);
    position: absolute;
    top: 0;
    left: 0;
    font-size: var(--gas-text-2xl, 16px);
    font-weight: 700;
    color: var(--gas-primary, #2563eb);
    opacity: 0.5;
}
/* @gas:block features_grid end *//* @gas:block team_grid start */


/* Titre : suit l'identité typo heading du tenant (--gas-font-family-heading). */
.gas-block-team-grid__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
}



/* ── team_grid : styles (card / circle / minimal) ── */
.gas-block-team-grid--style-card .gas-block-team-grid__item {
    background: var(--gas-white, #fff);
    border: 1px solid var(--gas-neutral-100, #f1f5f9);
    border-radius: var(--gas-radius-l, 12px);
    padding: 12.5px;
    box-shadow: 0 10px 30px -16px rgba(15, 23, 42, 0.18);
    text-align: center;
}

.gas-block-team-grid--style-circle .gas-block-team-grid__item {
    text-align: center;
}

.gas-block-team-grid--style-circle .gas-block-team-grid__avatar {
    width: min(90px, 100%);
    aspect-ratio: 1;
    height: auto;
    margin: 0 auto 7.5px;
    border-radius: 50%;
    overflow: hidden;
}

.gas-block-team-grid--style-circle .gas-block-team-grid__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gas-block-team-grid--style-minimal .gas-block-team-grid__bio {
    display: none;
}

/* ── team_grid : variante vertical (une rangée par membre : portrait + bio) ── */
.gas-block-team-grid.gas-block-team-grid--style-vertical .gas-block-team-grid__grid {
    grid-template-columns: 1fr;
    gap: var(--gas-space-l, 20px);
}
.gas-block-team-grid--style-vertical .gas-block-team-grid__item {
    display: grid;
    grid-template-columns: minmax(0, 120px) 1fr;
    column-gap: var(--gas-space-l, 20px);
    row-gap: var(--gas-space-2xs, 2.5px);
    align-content: center;
    text-align: left;
}
/* Avatar en colonne 1 (calé en haut) ; nom/rôle/bio empilés en colonne 2. */
.gas-block-team-grid--style-vertical .gas-block-team-grid__avatar {
    margin: 0;
    grid-column: 1;
    grid-row: 1 / span 3;
    align-self: start;
}
.gas-block-team-grid--style-vertical .gas-block-team-grid__name,
.gas-block-team-grid--style-vertical .gas-block-team-grid__role,
.gas-block-team-grid--style-vertical .gas-block-team-grid__bio {
    grid-column: 2;
    margin: 0;
}
.gas-block-team-grid--style-vertical .gas-block-team-grid__avatar img {
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-l, 12px);
}
@media (max-width: 640px) {
    .gas-block-team-grid--style-vertical .gas-block-team-grid__item {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .gas-block-team-grid--style-vertical .gas-block-team-grid__avatar {
        grid-column: 1;
        grid-row: auto;
        max-width: 120px;
        margin-inline: auto;
    }
    .gas-block-team-grid--style-vertical .gas-block-team-grid__name,
    .gas-block-team-grid--style-vertical .gas-block-team-grid__role,
    .gas-block-team-grid--style-vertical .gas-block-team-grid__bio {
        grid-column: 1;
    }
}
/* style-minimal : version dépouillée — plain (défaut) garde la base carte,
   minimal la retire. Les deux étaient identiques (audit 2026-07-19). */
.gas-block-team-grid--style-minimal .gas-block-team-grid__item {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
}
.gas-block-team-grid--style-minimal .gas-block-team-grid__bio {
    display: none;
}
/* @gas:block team_grid end *//* @gas:block stats start */




/* ── stats : variante band (bande colorée pleine largeur) ── */
.gas-block-stats--band .gas-block-stats__inner {
    background: var(--gas-primary, #2563eb);
    color: var(--gas-white, #fff);
    border-radius: var(--gas-radius-l, 12px);
    padding: 22.5px 15px;
}

.gas-block-stats--band .gas-block-stats__grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    gap: 15px;
}

/* Les items héritent de la carte blanche partagée (.gas-block-stats__item) :
   sur la bande colorée, texte blanc sur carte blanche = chiffres invisibles.
   En band, les items posent leur texte directement sur la bande. */
.gas-block-stats--band .gas-block-stats__item {
    background: transparent;
    border: 0;
    box-shadow: none;
}

.gas-block-stats--band .gas-block-stats__title,
.gas-block-stats--band .gas-block-stats__value {
    color: var(--gas-white, #fff);
}

.gas-block-stats--band .gas-block-stats__label {
    color: rgba(255, 255, 255, 0.85);
}

/* ── stats : titre + accroche ── */
.gas-block-stats__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-size: var(--gas-text-xl, 15px);
    line-height: 1.2;
}
.gas-block-stats__lead {
    margin: var(--gas-space-2, 5px) 0 var(--gas-space-l, 20px);
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-l, 11.25px);
    max-width: 440px;
}

/* ── stats : fond image + voile sombre ── */
.gas-block-stats--has-bg {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    border-radius: var(--gas-radius-l, 12px);
}
.gas-block-stats--has-bg .gas-block-stats__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}
.gas-block-stats--has-bg .gas-block-stats__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.gas-block-stats--has-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: rgba(15, 23, 42, var(--gas-stats-overlay, 0.55));
}
.gas-block-stats--has-bg .gas-block-stats__inner {
    position: relative;
    z-index: 1;
    padding: var(--gas-space-2xl, 40px) var(--gas-space-xl, 30px);
}
.gas-block-stats--has-bg .gas-block-stats__title {
    color: var(--gas-white, #fff);
}
.gas-block-stats--has-bg .gas-block-stats__lead {
    color: rgba(255, 255, 255, 0.85);
}
/* Les chiffres restent dans leurs cartes claires (lisibles sur la photo) ;
   seuls le titre et l'accroche, posés à même le fond, passent en blanc. */

/* ── stats : variante split (image d'un côté, chiffres de l'autre) ── */
.gas-block-stats--split .gas-block-stats__inner {
    display: grid;
    gap: var(--gas-space-xl, 30px);
    align-items: center;
}
.gas-block-stats--split .gas-block-stats__media {
    margin: 0;
}
.gas-block-stats--split .gas-block-stats__media img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-l, 12px);
    object-fit: cover;
}
@container (min-width: 640px) {
    .gas-block-stats--split .gas-block-stats__inner {
        grid-template-columns: 1fr 1fr;
    }
    .gas-block-stats--split.gas-block-stats--media-right .gas-block-stats__media {
        order: 2;
    }
    .gas-block-stats--split .gas-block-stats__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ── stats : variante timeline (chiffres sur un axe chronologique) ── */
.gas-block-stats--timeline .gas-block-stats__grid {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-l, 20px);
}
.gas-block-stats--timeline .gas-block-stats__item {
    position: relative;
    flex: 1 1 80px;
    min-width: 80px;
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: var(--gas-space-l, 20px) 0 0;
    text-align: center;
}
/* Segment de ligne (au sommet de chaque item) + point relié. */
.gas-block-stats--timeline .gas-block-stats__item::before {
    content: "";
    position: absolute;
    top: 3.5px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--gas-color-border, #e2e8f0);
}
.gas-block-stats--timeline .gas-block-stats__item:first-child::before { left: 50%; }
.gas-block-stats--timeline .gas-block-stats__item:last-child::before { right: 50%; }
.gas-block-stats--timeline .gas-block-stats__item::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--gas-color-primary, #2563eb);
    box-shadow: 0 0 0 4px var(--gas-color-surface, #fff);
}
@media (max-width: 640px) {
    .gas-block-stats--timeline .gas-block-stats__grid { flex-direction: column; }
    .gas-block-stats--timeline .gas-block-stats__item {
        text-align: left;
        padding: 0 0 var(--gas-space-m, 10px) var(--gas-space-l, 20px);
    }
    .gas-block-stats--timeline .gas-block-stats__item::before {
        top: 0;
        bottom: 0;
        left: 4px;
        right: auto;
        width: 2px;
        height: auto;
    }
    .gas-block-stats--timeline .gas-block-stats__item:first-child::before { top: 3px; left: 4px; }
    .gas-block-stats--timeline .gas-block-stats__item:last-child::before { bottom: auto; height: 100%; left: 4px; }
    .gas-block-stats--timeline .gas-block-stats__item::after {
        top: 3px;
        left: 0;
        transform: none;
    }
}
/* @gas:block stats end *//* @gas:block timeline start */




/* ── timeline : variante alternating (zig-zag desktop, vertical mobile) ── */
@media (min-width: 768px) {
    .gas-block-timeline--alternating .gas-block-timeline__list::before {
        left: 50%;
        transform: translateX(-50%);
    }

    .gas-block-timeline--alternating .gas-block-timeline__item {
        width: 50%;
        position: relative;
        /* width:50% DOIT inclure le padding-left/right:25px : en content-box le
           padding élargit l'item au-delà de la ligne centrale → le dot des items
           de gauche (impairs) se retrouve décalé de +25px (non aligné sur la
           timeline) alors que ceux de droite restent OK. */
        box-sizing: border-box;
    }

    .gas-block-timeline--alternating .gas-block-timeline__dot {
        position: absolute;
        top: 0;
    }

    .gas-block-timeline--alternating .gas-block-timeline__item:nth-child(odd) {
        margin-left: 0;
        padding-right: 25px;
        text-align: right;
        flex-direction: row-reverse;
    }

    .gas-block-timeline--alternating .gas-block-timeline__item:nth-child(odd) .gas-block-timeline__dot {
        right: -9.5px;
        left: auto;
    }

    .gas-block-timeline--alternating .gas-block-timeline__item:nth-child(even) {
        margin-left: 50%;
        padding-left: 25px;
    }

    .gas-block-timeline--alternating .gas-block-timeline__item:nth-child(even) .gas-block-timeline__dot {
        left: -9.5px;
    }
}
/* @gas:block timeline end *//* @gas:block quote start */




/* ── quote : variantes card / pull ── */
.gas-block-quote--card {
    background: var(--gas-white, #fff);
    border: 1px solid var(--gas-neutral-100, #f1f5f9);
    border-left: 1px solid var(--gas-neutral-100, #f1f5f9);
    border-radius: var(--gas-radius-l, 12px);
    padding: 20px;
    box-shadow: 0 12px 30px -16px rgba(15, 23, 42, 0.18);
}

.gas-block-quote--pull {
    border: 0;
    text-align: center;
    padding: 25px 10px 10px;
}

.gas-block-quote--pull::before {
    content: "\201C";
    display: block;
    font-size: 40px;
    line-height: 0.5;
    color: var(--gas-primary, #2563eb);
    opacity: 0.3;
}

.gas-block-quote--pull .gas-block-quote__text {
    font-size: clamp(15px, 4vw, 25px);
    line-height: 1.25;
    font-weight: 600;
}
/* @gas:block quote end *//* @gas:block title_block start */


/* Titre : suit l'identité typo heading du tenant (--gas-font-family-heading). */
.gas-block-title-block__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
}

/* ── title_block : alignement ──
 * Les modificateurs --align-* sont émis par les DEUX renderers (PHP
 * GasBlockTitleBlock et astro/src/components/blocks/TitleBlock.astro) mais
 * aucune règle ne posait `text-align` : seul le décor "underline" en tenait
 * compte pour placer son trait. Résultat : `align: center|right` n'avait
 * aucun effet sur le texte (visible aussi dans la preview
 * title_block-underline.png, trait centré sous un titre resté à gauche). */
.gas-block-title-block--align-center {
    text-align: center;
}

.gas-block-title-block--align-right {
    text-align: right;
}

/* ── title_block : eyebrow (supertitre) ── */
.gas-block-title-block__eyebrow {
    margin: 0 0 var(--gas-space-2xs, 5px);
    font-size: var(--gas-text-s, 8.75px);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gas-primary, #2563eb);
}

.gas-block-title-block--decor-side .gas-block-title-block__eyebrow {
    padding-left: 10px;
}

/* ── title_block : décors (underline / gradient / side) ── */
.gas-block-title-block--decor-underline .gas-block-title-block__title {
    padding-bottom: 5px;
    position: relative;
}

.gas-block-title-block--decor-underline .gas-block-title-block__title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 4px;
    border-radius: 2px;
    background: var(--gas-primary, #2563eb);
}

.gas-block-title-block--align-center.gas-block-title-block--decor-underline .gas-block-title-block__title::after {
    left: 50%;
    transform: translateX(-50%);
}

.gas-block-title-block--decor-gradient .gas-block-title-block__title {
    background: linear-gradient(90deg, var(--gas-primary, #2563eb), var(--gas-accent, #f59e0b));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.gas-block-title-block--decor-side .gas-block-title-block__title {
    border-left: 4px solid var(--gas-primary, #2563eb);
    padding-left: 10px;
}
/* @gas:block title_block end *//* @gas:block logo_cloud start */




/* ── logo_cloud : en-tête (titre / sous-titre / CTA) + alignement ── */
.gas-block-logo-cloud__header {
    margin: 0 0 var(--gas-space-l, 20px);
}
.gas-block-logo-cloud__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    margin: 0;
    font-size: var(--gas-text-xl, 15px);
    line-height: 1.2;
    font-weight: 600;
}
.gas-block-logo-cloud__subtitle {
    margin: var(--gas-space-2, 5px) 0 0;
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-l, 11.25px);
    max-width: 420px;
}
.gas-block-logo-cloud__cta {
    margin: var(--gas-space-l, 20px) 0 0;
}
.gas-block-logo-cloud--align-center .gas-block-logo-cloud__header,
.gas-block-logo-cloud--align-center .gas-block-logo-cloud__cta {
    text-align: center;
}
.gas-block-logo-cloud--align-center .gas-block-logo-cloud__subtitle {
    margin-inline: auto;
}

/* ── logo_cloud : styles grayscale / bordered ── */
.gas-block-logo-cloud--style-grayscale .gas-block-logo-cloud__item img {
    filter: grayscale(1);
    opacity: 0.7;
    transition: filter 0.25s var(--gas-ease-standard, ease), opacity 0.25s var(--gas-ease-standard, ease);
}

.gas-block-logo-cloud--style-grayscale .gas-block-logo-cloud__item:hover img {
    filter: grayscale(0);
    opacity: 1;
}

.gas-block-logo-cloud--style-bordered .gas-block-logo-cloud__item {
    border: 1px solid var(--gas-neutral-200, #e2e8f0);
    border-radius: var(--gas-radius-m, 10px);
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* @gas:block logo_cloud end *//* @gas:block faq_columns start */




/* ── faq_columns : styles bordered / separated ── */
.gas-block-faq-columns--style-bordered .gas-block-faq-columns__item {
    border: 1px solid var(--gas-neutral-200, #e2e8f0);
    border-radius: var(--gas-radius-m, 10px);
    padding: 12.5px;
}

.gas-block-faq-columns--style-separated .gas-block-faq-columns__item {
    border-bottom: 1px solid var(--gas-neutral-200, #e2e8f0);
    padding-bottom: 10px;
}
/* @gas:block faq_columns end *//* @gas:block accordion start */




/* ── accordion : styles bordered / filled ── */
.gas-block-accordion--style-bordered .gas-block-accordion__item {
    border: 1px solid var(--gas-neutral-200, #e2e8f0);
    border-radius: var(--gas-radius-m, 10px);
    padding: 0 10px;
}

.gas-block-accordion--style-filled .gas-block-accordion__item {
    background: var(--gas-neutral-50, #f8fafc);
    border: 0;
    border-radius: var(--gas-radius-m, 10px);
    padding: 0 10px;
}
/* @gas:block accordion end *//* @gas:block pricing_table start */




/* ── pricing_table : styles compact / bordered ── */
.gas-block-pricing-table--style-bordered .gas-block-pricing-table__plan {
    box-shadow: none;
    border: 1px solid var(--gas-neutral-200, #e2e8f0);
}

.gas-block-pricing-table--style-compact .gas-block-pricing-table__plan {
    padding: 12.5px;
    box-shadow: 0 6px 16px -10px rgba(15, 23, 42, 0.15);
}
/* @gas:block pricing_table end *//* @gas:block cta_band start */




/* ── cta_band : tons gradient / dark (sur __inner comme primary/soft) ── */
.gas-block-cta-band--gradient .gas-block-cta-band__inner {
    background: linear-gradient(120deg, var(--gas-primary, #2563eb), var(--gas-accent, #f59e0b));
}

.gas-block-cta-band--dark .gas-block-cta-band__inner {
    background: var(--gas-neutral-900, #0f172a);
}

.gas-block-cta-band--gradient .gas-block-cta-band__title,
.gas-block-cta-band--gradient .gas-block-cta-band__subtitle,
.gas-block-cta-band--dark .gas-block-cta-band__title,
.gas-block-cta-band--dark .gas-block-cta-band__subtitle {
    color: var(--gas-white, #fff);
}
/* @gas:block cta_band end */


/* ── Section : colonne collante (sticky) ── */
.gas-block-section--sticky-left,
.gas-block-section--sticky-right {
    overflow: visible; /* position:sticky est cassée par overflow:hidden de la section */
}

.gas-block-section--sticky-left .gas-block-section__column:first-child,
.gas-block-section--sticky-right .gas-block-section__column:last-child {
    position: sticky;
    top: var(--gas-sticky-top, 15px);
    align-self: start;
}

@media (max-width: 768px) {
    .gas-block-section--sticky-left .gas-block-section__column:first-child,
    .gas-block-section--sticky-right .gas-block-section__column:last-child {
        position: static;
    }
}

/* ══════════════════════════════════════════════════════════════════════════
   Section : scrollytelling HORIZONTAL (layout=horizontal).
   Le scroll vertical de la page pilote une translation horizontale d'un rail
   de panneaux plein écran. Base = carrousel à scroll-snap (repli universel :
   Firefox, sans JS, mobile, reduced-motion) ; enhancement = épinglage + scrub.
   Le scrub est DÉCRIT en CSS (pattern Bramus « view-timeline » : section haute
   qui porte la timeline, animation-range: contain = durée d'épinglage) MAIS
   PILOTÉ par l'enhancer JS section_horizontal.js : Chrome (≥ ~149) ne résout pas
   une view-timeline nommée sous un `position: sticky` → l'enhancer neutralise
   l'animation CSS et pose le transform en rAF. Piège CRITIQUE réglé : le pin est
   en `overflow: clip` et NON `overflow-x: hidden` (qui forcerait overflow-y à
   `auto`, faisant du pin un scroll-container qui pige la molette → page bloquée).
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Base / repli : carrousel horizontal à défilement tactile ── */
.gas-block-section--horizontal .gas-block-section__hpin {
    position: relative;
}

.gas-block-section--horizontal .gas-block-section__htrack {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    overscroll-behavior-x: contain;
}

.gas-block-section--horizontal .gas-block-section__panel {
    flex: 0 0 100%;
    min-width: 0;
    scroll-snap-align: start;
}

/* Étire le bloc-panneau (et le wrapper `.gas-block-anchor` que le renderer pose
   autour de chaque bloc) sur toute la hauteur du panneau : un grid mono-cellule
   étire son enfant à 100 % par défaut. Sans ça, un bloc court (hero) laisse du
   vide sous lui une fois le panneau en plein écran. */
.gas-block-section--horizontal .gas-block-section__panel,
.gas-block-section--horizontal .gas-block-section__panel > .gas-block-anchor {
    display: grid;
}

.gas-block-section--horizontal .gas-block-section__panel > .gas-block-anchor {
    min-height: 0;
}

/* ── Enhancement : épinglage + scrub horizontal (desktop, motion permis) ──
   WOW fix : le pin N'EST PLUS conditionné à @supports (animation-timeline).
   Chrome casse les view-timeline nommées sous sticky → le scrub est piloté
   en JS (section_horizontal.js). Le CSS pose seulement la géométrie d'épinglage
   pour que isPinned() soit vrai et que le rAF ait de la room. */
@keyframes gas-section-hscroll {
    to {
        transform: translateX(calc(-100% + 100vw));
    }
}

@media (min-width: 769px) and (prefers-reduced-motion: no-preference) {
    .gas-block-section--horizontal {
        /* Hauteur de scroll = N panneaux → room pour le scrub horizontal. */
        height: calc(var(--gas-block-section-panels, 3) * 100svh) !important;
        min-height: calc(var(--gas-block-section-panels, 3) * 100svh);
        /* overflow visible : indispensable pour que le sticky enfant fonctionne. */
        overflow: visible !important;
        /* Break out of content-width parents (width-content, padding). */
        width: 100vw;
        max-width: 100vw;
        margin-inline: calc(50% - 50vw);
        position: relative;
        view-timeline-name: --gas-hsection;
        view-timeline-axis: block;
    }

    .gas-block-section--horizontal .gas-block-section__hpin {
        position: sticky;
        top: 0;
        height: 100svh;
        width: 100vw;
        max-width: 100vw;
        /* `clip` et NON `overflow-x: hidden` : `hidden` sur un seul axe force
           l'autre axe à `auto` (règle CSS overflow) → le pin devient un
           scroll-container qui PIÈGE la molette. */
        overflow: clip;
    }

    .gas-block-section--horizontal .gas-block-section__htrack {
        width: max-content;
        height: 100%;
        overflow: visible;
        scroll-snap-type: none;
        will-change: transform;
    }

    /* SDA en enhancement pure (si le navigateur sait) — l'enhancer JS prime. */
    @supports (animation-timeline: view()) {
        .gas-block-section--horizontal .gas-block-section__htrack {
            animation: gas-section-hscroll linear both;
            animation-timeline: --gas-hsection;
            animation-range: contain 0% contain 100%;
        }
    }

    .gas-block-section--horizontal .gas-block-section__panel {
        flex: 0 0 100vw;
        width: 100vw;
        height: 100%;
        overflow: clip;
        /* Micro-effet : panneaux non actifs un peu atténués. */
        transition: opacity 280ms var(--gas-ease-standard, ease), transform 280ms var(--gas-ease-standard, ease);
        opacity: 0.72;
        transform: scale(0.96);
    }

    .gas-block-section--horizontal .gas-block-section__panel.is-active {
        opacity: 1;
        transform: scale(1);
    }

    /* Ken léger sur l'image du panneau actif. */
    .gas-block-section--horizontal .gas-block-section__panel.is-active img {
        animation: gas-hpanel-ken 12s ease-in-out infinite alternate;
    }
}

@keyframes gas-hpanel-ken {
    from { transform: scale(1); }
    to { transform: scale(1.06); }
}

/* ── Mobile : swipe (carrousel, défaut — le base ci-dessus suffit) ou stack ── */
@media (max-width: 768px) {
    .gas-block-section--horizontal.gas-block-section--hmobile-stack .gas-block-section__htrack {
        flex-direction: column;
        overflow-x: visible;
        scroll-snap-type: none;
    }

    .gas-block-section--horizontal.gas-block-section--hmobile-stack .gas-block-section__panel {
        flex: 0 0 auto;
    }

    /* Chrome de progression moins envahissant en mobile. */
    .gas-block-section--horizontal .gas-block-section__hhint {
        display: none;
    }
}

/* ══════════════════════════════════════════════════════════════════════════
   WOW v3 — chrome horizontal (progress + dots + compteur + edge hints).
   Posé dans le pin, au-dessus des panneaux (z-index). aria-hidden : purement
   décoratif — l'ordre DOM des panneaux porte la sémantique.
   ══════════════════════════════════════════════════════════════════════════ */
.gas-block-section--horizontal .gas-block-section__hchrome {
    position: absolute;
    inset: 0;
    z-index: 4;
    pointer-events: none;
}

.gas-block-section--horizontal .gas-block-section__hprogress {
    position: absolute;
    inset-inline: 0;
    inset-block-start: 0;
    height: 3px;
    background: color-mix(in srgb, var(--gas-color-border, #ccc) 55%, transparent);
    overflow: hidden;
}

.gas-block-section--horizontal .gas-block-section__hprogress-fill {
    display: block;
    width: 100%;
    height: 100%;
    background: var(--gas-primary, #2563eb);
    transform-origin: left center;
    transform: scaleX(var(--gas-hsection-progress, 0));
    transition: transform 60ms linear;
}

.gas-block-section--horizontal .gas-block-section__hmeta {
    position: absolute;
    inset-inline: 0;
    inset-block-end: var(--gas-space-5, 16px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--gas-space-2, 8px);
}

.gas-block-section--horizontal .gas-block-section__hcounter {
    font-size: var(--gas-text-s, 14px);
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--gas-color-text, #161616);
    background: color-mix(in srgb, var(--gas-bg-surface, #fff) 88%, transparent);
    padding: 4px 12px;
    border-radius: var(--gas-radius-full, 999px);
    border: 1px solid var(--gas-color-border, #e2e8f0);
    backdrop-filter: blur(6px);
}

.gas-block-section--horizontal .gas-block-section__hdots {
    display: flex;
    gap: 6px;
}

.gas-block-section--horizontal .gas-block-section__hdot {
    width: 7px;
    height: 7px;
    border-radius: var(--gas-radius-full, 999px);
    background: color-mix(in srgb, var(--gas-color-border, #ccc) 80%, transparent);
    transition: background 160ms ease, transform 160ms ease;
}

.gas-block-section--horizontal .gas-block-section__hdot.is-active {
    background: var(--gas-primary, #2563eb);
    transform: scale(1.3);
}

/* Edge fades + chevrons de direction (décoratifs). */
.gas-block-section--horizontal .gas-block-section__hhint {
    position: absolute;
    inset-block: 0;
    width: min(12vw, 96px);
    pointer-events: none;
}

.gas-block-section--horizontal .gas-block-section__hhint--prev {
    inset-inline-start: 0;
    background: linear-gradient(to right, color-mix(in srgb, var(--gas-bg-surface, #fff) 55%, transparent), transparent);
}

.gas-block-section--horizontal .gas-block-section__hhint--next {
    inset-inline-end: 0;
    background: linear-gradient(to left, color-mix(in srgb, var(--gas-bg-surface, #fff) 55%, transparent), transparent);
}

.gas-block-section--horizontal .gas-block-section__hhint--next::after,
.gas-block-section--horizontal .gas-block-section__hhint--prev::after {
    content: '';
    position: absolute;
    inset-block-start: 50%;
    width: 10px;
    height: 10px;
    border-inline-end: 2px solid var(--gas-color-text-muted, #666);
    border-block-end: 2px solid var(--gas-color-text-muted, #666);
    opacity: 0.55;
    transform: translateY(-50%) rotate(-45deg);
}

.gas-block-section--horizontal .gas-block-section__hhint--next::after {
    inset-inline-end: 18px;
}

.gas-block-section--horizontal .gas-block-section__hhint--prev::after {
    inset-inline-start: 18px;
    transform: translateY(-50%) rotate(135deg);
}

/* Masquer le hint prev au tout début, next à la fin (progress 0 / 1). */
.gas-block-section--horizontal[style*="--gas-hsection-progress: 0"] .gas-block-section__hhint--prev,
.gas-block-section--horizontal[style*="--gas-hsection-progress:0"] .gas-block-section__hhint--prev {
    opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
    .gas-block-section--horizontal .gas-block-section__hprogress-fill,
    .gas-block-section--horizontal .gas-block-section__hdot {
        transition: none;
    }
    .gas-block-section--horizontal .gas-block-section__hhint {
        display: none;
    }
}
/* @gas:block intro_cards start */




/* ── Cartes à hauteur égale (la carte remplit sa cellule de grille) ── */
.gas-block-intro-cards__item {
    display: flex;
}
.gas-block-intro-cards__card {
    flex: 1;
}
/* @gas:block intro_cards end */
.gas-block-pathway-cards__card,
.gas-block-feature-showcase__media {
    height: 100%;
}/* @gas:block cards start */


/* ══════════════════════════════════════════════════════════════════════════
   Bloc `cards` — collection unifiée (manuelle + dynamique).
   Anatomie : media (header visuel) + corps (category/titre/texte) + footer.
   Variantes : cover | standard | minimal | horizontal.
   Dispositions : grid | featured-first | list.
   ══════════════════════════════════════════════════════════════════════════ */
.gas-block-cards__inner {
    max-width: min(100%, var(--gas-content-max-width, 720px));
    margin-inline: auto;
    /* Garde-fou bords : padding latéral pour ne jamais coller au bord
       (notamment sous la max-width, en mobile). */
    padding-inline: var(--gas-space-l, 20px);
}
.gas-block-cards__head {
    max-width: 480px;
    margin: 0 auto 20px;
    text-align: center;
}
.gas-block-cards__eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: var(--gas-text-s, 8.5px);
    color: var(--gas-primary, #2563eb);
    font-weight: 600;
    margin: 0 0 4px;
}
.gas-block-cards__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-size: var(--gas-text-3xl, 20px);
    margin: 0 0 5px;
    line-height: 1.15;
}
.gas-block-cards__lead {
    color: var(--gas-color-text-muted, #64748b);
    margin: 0;
}

/* ── Grille ── */
.gas-block-cards__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--gas-block-gap-m, 15px);
    align-items: stretch;
}
.gas-block-cards--cols-2 .gas-block-cards__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gas-block-cards--cols-4 .gas-block-cards__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gas-block-cards__cell { display: flex; }

/* ── Disposition "list" : une carte par rangée, pleine largeur ── */
.gas-block-cards--layout-list .gas-block-cards__grid { grid-template-columns: 1fr; }

/* ── Disposition "featured-first" : 1re carte sur toute la largeur ── */
.gas-block-cards--layout-featured-first .gas-block-cards__cell--featured {
    grid-column: 1 / -1;
}

/* ── La carte remplit la cellule + flex column pour pousser le footer en bas ── */
.gas-block-cards__card {
    display: flex;
    flex-direction: column;
    flex: 1;
    height: 100%;
    border-radius: var(--gas-radius-l, 14px);
    overflow: hidden;
    background: var(--gas-color-surface-card, #fff);
    color: inherit;
    text-decoration: none;
    transition: transform 0.18s var(--gas-ease-standard, ease), box-shadow 0.18s var(--gas-ease-standard, ease);
}
a.gas-block-cards__card:hover { transform: translateY(-3px); }

.gas-block-cards__media {
    position: relative;
    margin: 0;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--gas-neutral-100, #f1f5f9);
}
.gas-block-cards__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* image_fit = contain : image entière visible (fond neutre du média), pas de
   recadrage. Pour photos produit/matériel aux ratios variés. Le sélecteur de
   section couvre aussi les cartes reconstruites par l'island runtime Astro. */
.gas-block-cards--fit-contain .gas-block-cards__media img {
    object-fit: contain;
}
.gas-block-cards__icon {
    font-size: 18px;
    line-height: 1;
    padding: 12.5px 12.5px 0;
}
.gas-block-cards__body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12.5px;
    flex: 1;
}
.gas-block-cards--align-center .gas-block-cards__body {
    text-align: center;
    align-items: center;
}
.gas-block-cards__category {
    font-size: var(--gas-text-xs, 11px);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--gas-primary, #2563eb);
    margin: 0;
}
.gas-block-cards__card-title {
    font-size: var(--gas-text-l, 12px);
    margin: 0;
    line-height: 1.25;
}
.gas-block-cards__text {
    margin: 0;
    color: var(--gas-color-text-muted, #64748b);
    line-height: 1.55;
}
.gas-block-cards__footer {
    margin-top: auto;
    padding-top: 7.5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 7.5px;
    flex-wrap: wrap;
}
.gas-block-cards--align-center .gas-block-cards__footer { justify-content: center; }
.gas-block-cards__meta {
    font-size: var(--gas-text-xs, 11px);
    color: var(--gas-color-text-muted, #64748b);
}
.gas-block-cards__cta {
    font-weight: 600;
    font-size: var(--gas-text-s, 14px);
    color: var(--gas-primary, #2563eb);
    text-decoration: none;
}

/* ── Variante "horizontal" : image à gauche, corps à droite ── */
.gas-block-cards__card--horizontal {
    flex-direction: row;
    align-items: stretch;
}
.gas-block-cards__card--horizontal .gas-block-cards__media {
    aspect-ratio: auto;
    width: 38%;
    min-width: 38%;
    flex-shrink: 0;
}
.gas-block-cards__card--horizontal .gas-block-cards__body { flex: 1; }

/* ── Variante "cover" : titre en surimpression sur l'image ── */
.gas-block-cards__card--cover {
    position: relative;
    min-height: 160px;
    color: var(--gas-white, #fff);
}
.gas-block-cards__card--cover .gas-block-cards__media {
    position: absolute;
    inset: 0;
    aspect-ratio: auto;
    height: 100%;
}
.gas-block-cards__card--cover .gas-block-cards__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0) 35%, rgba(15, 23, 42, 0.78) 100%);
}
.gas-block-cards__card--cover .gas-block-cards__body {
    position: relative;
    margin-top: auto;
    z-index: 1;
}
.gas-block-cards__card--cover .gas-block-cards__text,
.gas-block-cards__card--cover .gas-block-cards__meta { color: rgba(255, 255, 255, 0.85); }
.gas-block-cards__card--cover .gas-block-cards__category,
.gas-block-cards__card--cover .gas-block-cards__cta { color: var(--gas-white, #fff); }

/* ── Variante "minimal" : titre seul, dense ── */
.gas-block-cards__card--minimal .gas-block-cards__body { padding: 10px 11px; }

/* ── Styles de carte (card_style) ── */
.gas-block-cards--style-elevated .gas-block-cards__card {
    box-shadow: 0 12px 30px -16px rgba(15, 23, 42, 0.22);
    border: 1px solid var(--gas-neutral-100, #f1f5f9);
}
.gas-block-cards--style-outline .gas-block-cards__card {
    border: 1px solid var(--gas-neutral-200, #e2e8f0);
}
.gas-block-cards--style-flat .gas-block-cards__card {
    background: var(--gas-neutral-50, #f8fafc);
}
.gas-block-cards--style-glass .gas-block-cards__card {
    background: color-mix(in srgb, var(--gas-color-surface-card, #fff) 65%, transparent);
    border: 1px solid color-mix(in srgb, var(--gas-color-surface-card, #fff) 50%, transparent);
    backdrop-filter: blur(10px);
    box-shadow: 0 12px 30px -18px rgba(15, 23, 42, 0.25);
}
/* La variante cover garde un fond image, pas le fond de style. */
.gas-block-cards__card--cover.gas-block-cards__card { background: var(--gas-neutral-900, #0f172a); }

@media (max-width: 860px) {
    .gas-block-cards--cols-3 .gas-block-cards__grid,
    .gas-block-cards--cols-4 .gas-block-cards__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 560px) {
    .gas-block-cards__grid { grid-template-columns: 1fr; }
    .gas-block-cards__card--horizontal { flex-direction: column; }
    .gas-block-cards__card--horizontal .gas-block-cards__media { width: 100%; min-width: 0; aspect-ratio: 16 / 10; }
}

/* ── Badges de carte (manuels + règles dynamiques) ── */
.gas-block-cards__badge {
    --_tone: var(--gas-badge-tone, var(--gas-primary, #2563eb));
    display: inline-flex;
    align-items: center;
    font-size: var(--gas-text-xs, 11px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.02em;
    padding: 2.8px 5.5px;
    border-radius: 999px;
    white-space: nowrap;
}
/* Styles */
.gas-block-cards__badge--pill,
.gas-block-cards__badge--solid {
    background: var(--_tone);
    color: var(--gas-white, #fff);
}
.gas-block-cards__badge--outline {
    background: var(--gas-white, #fff);
    color: var(--_tone);
    border: 1px solid var(--_tone);
}
.gas-block-cards__badge--solid { border-radius: var(--gas-radius-s, 6px); }
/* Badges en surimpression sur l'image (coins) */
.gas-block-cards__media .gas-block-cards__badge {
    position: absolute;
    z-index: 2;
    box-shadow: 0 4px 12px -6px rgba(15, 23, 42, 0.45);
}
.gas-block-cards__badge--pos-image-top-left { top: 6px; left: 6px; }
.gas-block-cards__badge--pos-image-top-right { top: 6px; right: 6px; }
.gas-block-cards__badge--pos-image-bottom-left { bottom: 6px; left: 6px; }
.gas-block-cards__badge--pos-image-bottom-right { bottom: 6px; right: 6px; }
/* Badges sous l'image (dans le corps) */
.gas-block-cards__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 2px;
}
.gas-block-cards--align-center .gas-block-cards__badges { justify-content: center; }

/* ── Description richtext limitée (p/ul/ol/li/strong/em/br) ── */
.gas-block-cards__text--rich > :first-child { margin-top: 0; }
.gas-block-cards__text--rich > :last-child { margin-bottom: 0; }
.gas-block-cards__text--rich p {
    margin: 0 0 var(--gas-space-2xs, 2.5px);
}
.gas-block-cards__text--rich ul,
.gas-block-cards__text--rich ol {
    margin: 0;
    padding-left: var(--gas-space-m, 10px);
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-2xs, 2.5px);
    text-align: left;
}

/* ── CTA de fin de grille (footer_link) ── */
.gas-block-cards__footer-link {
    margin-top: var(--gas-space-l, 15px);
    text-align: center;
}
.gas-block-cards__footer-link-anchor {
    font-weight: 600;
    font-size: var(--gas-text-s, 14px);
    color: var(--gas-primary, #2563eb);
    text-decoration: none;
}
.gas-block-cards__footer-link-anchor:hover,
.gas-block-cards__footer-link-anchor:focus-visible {
    text-decoration: underline;
    text-underline-offset: 0.18em;
}
/* @gas:block cards end */

/* ── intro_cards / pathway_cards : relief de carte (card_style) ── */
.gas-block-intro-cards--style-elevated .gas-block-intro-cards__card,
.gas-block-pathway-cards--style-elevated .gas-block-pathway-cards__card {
    box-shadow: 0 14px 34px -18px rgba(15, 23, 42, 0.28);
}
.gas-block-intro-cards--style-outline .gas-block-intro-cards__card,
.gas-block-pathway-cards--style-outline .gas-block-pathway-cards__card {
    border: 1px solid var(--gas-neutral-200, #e2e8f0);
}/* @gas:block text start */


/* ── text : flux multi-colonnes (type journal/magazine) ── */
.gas-block-text--cols-2 .gas-block-text__content {
    column-count: 2;
    column-gap: var(--gas-space-l, 25px);
}
.gas-block-text--cols-3 .gas-block-text__content {
    column-count: 3;
    column-gap: var(--gas-space-l, 25px);
}
/* Évite de couper titres, images, listes et citations entre 2 colonnes */
.gas-block-text--cols-2 .gas-block-text__content :is(h2, h3, h4, figure, ul, ol, blockquote, img),
.gas-block-text--cols-3 .gas-block-text__content :is(h2, h3, h4, figure, ul, ol, blockquote, img) {
    break-inside: avoid;
}
.gas-block-text--cols-2 .gas-block-text__content > :first-child,
.gas-block-text--cols-3 .gas-block-text__content > :first-child {
    margin-top: 0;
}
@media (max-width: 640px) {
    .gas-block-text--cols-2 .gas-block-text__content,
    .gas-block-text--cols-3 .gas-block-text__content {
        column-count: 1;
    }
}
@media (min-width: 641px) and (max-width: 900px) {
    .gas-block-text--cols-3 .gas-block-text__content {
        column-count: 2;
    }
}
/* @gas:block text end *//* @gas:block contact_info start */




/* ════════════════════════════════════════════════════════════════════════════
   Bloc contact_info — coordonnées structurées (adresse / tél / email / horaires)
   ════════════════════════════════════════════════════════════════════════════ */
.gas-block-contact-info {
    container-type: inline-size;
}
.gas-block-contact-info__inner {
    max-width: var(--gas-container, var(--gas-container-default, 800px));
    margin-inline: auto;
    /* Garde-fou bords : padding latéral (mobile / sous la max-width). */
    padding-inline: var(--gas-space-l, 20px);
}
.gas-block-contact-info__head {
    margin: 0 0 var(--gas-space-l, 20px);
}
.gas-block-contact-info__title {
    margin: 0;
    font-size: var(--gas-text-xl, 15px);
    line-height: 1.2;
}
/* @gas:block contact_info end *//* @gas:block contact_form start */



/* Titre du formulaire : même calage que le titre des coordonnées (margin-top 0)
   pour que les deux colonnes d'une page contact s'alignent en haut. */
.gas-block-contact-form__title {
    margin: 0 0 var(--gas-space-m, 12px);
    font-size: var(--gas-text-xl, 15px);
    line-height: 1.2;
}
/* @gas:block contact_form end *//* @gas:block contact_info start */



.gas-block-contact-info__intro {
    margin: var(--gas-space-2, 5px) 0 0;
    color: var(--gas-color-text-muted, #4a4a4a);
}
.gas-block-contact-info__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--gas-space-m, 10px);
}
.gas-block-contact-info__item {
    display: flex;
    gap: var(--gas-space-3, 7.5px);
    align-items: flex-start;
}
.gas-block-contact-info__icon {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    color: var(--gas-color-primary, #2563eb);
    margin-top: 1px;
}
.gas-block-contact-info__value {
    color: inherit;
    text-decoration: none;
}
a.gas-block-contact-info__value:hover,
.gas-block-contact-info__maplink:hover {
    text-decoration: underline;
}
.gas-block-contact-info__address {
    font-style: normal;
}
.gas-block-contact-info__maplink {
    display: inline-block;
    margin-top: var(--gas-space-1, 2.5px);
    font-size: var(--gas-text-s, 9px);
    color: var(--gas-color-primary, #2563eb);
}
.gas-block-contact-info__socials {
    list-style: none;
    display: flex;
    gap: var(--gas-space-2, 5px);
    margin: var(--gas-space-l, 20px) 0 0;
    padding: 0;
}
.gas-block-contact-info__social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--gas-color-surface-muted, #f0f1f3);
    color: var(--gas-color-text, #161616);
    transition: background 0.18s var(--gas-ease-standard, ease), color 0.18s var(--gas-ease-standard, ease);
}
.gas-block-contact-info__social-link:hover {
    background: var(--gas-color-primary, #2563eb);
    color: #fff;
}
.gas-block-contact-info__social-link .gas-block-contact-info__icon {
    width: 12px;
    height: 12px;
    color: currentColor;
    margin: 0;
}
/* Grille 2 colonnes */
@container (min-width: 540px) {
    .gas-block-contact-info--layout-grid .gas-block-contact-info__list {
        grid-template-columns: 1fr 1fr;
    }
}
/* En ligne (footer) */
.gas-block-contact-info--layout-inline .gas-block-contact-info__list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-l, 20px);
    align-items: center;
}
.gas-block-contact-info--layout-inline .gas-block-contact-info__item {
    align-items: center;
}
/* @gas:block contact_info end *//* @gas:block map start */




/* ════════════════════════════════════════════════════════════════════════════
   Bloc map — carte de localisation intégrée (iframe OSM / Google)
   ════════════════════════════════════════════════════════════════════════════ */
.gas-block-map__figure {
    margin: 0;
    max-width: var(--gas-container, var(--gas-container-default, 800px));
    margin-inline: auto;
}
.gas-block-map__frame {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: var(--gas-radius-l, 12px);
    border: 1px solid var(--gas-color-border, #e2e8f0);
    background: var(--gas-color-surface-muted, #f0f1f3);
}
.gas-block-map--h-s .gas-block-map__frame { height: 300px; }
.gas-block-map--h-m .gas-block-map__frame { height: 420px; }
.gas-block-map--h-l .gas-block-map__frame { height: 560px; }
.gas-block-map__iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}
.gas-block-map__caption {
    margin: var(--gas-space-2, 5px) 0 0;
    font-size: var(--gas-text-s, 9px);
    color: var(--gas-color-text-muted, #4a4a4a);
    text-align: center;
}
@media (max-width: 640px) {
    .gas-block-map--h-m .gas-block-map__frame { height: 340px; }
    .gas-block-map--h-l .gas-block-map__frame { height: 420px; }
}
/* @gas:block map end *//* @gas:block privacy_notice start */




/* ════════════════════════════════════════════════════════════════════════════
   Bloc privacy_notice — mention de confidentialité / RGPD inline (présentation)
   ════════════════════════════════════════════════════════════════════════════ */
.gas-block-privacy-notice__inner {
    display: flex;
    align-items: flex-start;
    gap: var(--gas-space-3, 7.5px);
    padding: var(--gas-space-m, 10px) var(--gas-space-l, 15px);
    border-radius: var(--gas-radius-l, 12px);
    border: 1px solid var(--gas-color-border, #e2e8f0);
    background: var(--gas-color-surface-muted, #f0f1f3);
    font-size: var(--gas-text-s, 9.5px);
}
.gas-block-privacy-notice__icon {
    flex: 0 0 auto;
    width: 15px;
    height: 15px;
    color: var(--gas-color-primary, #2563eb);
    margin-top: 1px;
}
.gas-block-privacy-notice__text {
    flex: 1 1 auto;
    min-width: 0;
}
.gas-block-privacy-notice__text > :first-child { margin-top: 0; }
.gas-block-privacy-notice__text > :last-child { margin-bottom: 0; }
.gas-block-privacy-notice__text a { color: var(--gas-color-primary, #2563eb); text-decoration: underline; }
.gas-block-privacy-notice__cta { flex: 0 0 auto; white-space: nowrap; }

/* Tons */
.gas-block-privacy-notice--tone-dark .gas-block-privacy-notice__inner {
    background: var(--gas-tone-dark-bg, #111827);
    border-color: transparent;
    color: var(--gas-tone-dark-fg, #f9fafb);
}
.gas-block-privacy-notice--tone-dark .gas-block-privacy-notice__icon,
.gas-block-privacy-notice--tone-dark .gas-block-privacy-notice__text a { color: var(--gas-accent, #f59e0b); }
.gas-block-privacy-notice--tone-primary .gas-block-privacy-notice__inner {
    background: color-mix(in srgb, var(--gas-color-primary, #2563eb) 10%, var(--gas-color-surface, #fff));
    border-color: color-mix(in srgb, var(--gas-color-primary, #2563eb) 25%, transparent);
}

/* Dispositions */
.gas-block-privacy-notice--variant-left .gas-block-privacy-notice__inner,
.gas-block-privacy-notice--variant-center .gas-block-privacy-notice__inner,
.gas-block-privacy-notice--variant-right .gas-block-privacy-notice__inner {
    max-width: 480px;
}
.gas-block-privacy-notice--variant-center .gas-block-privacy-notice__inner {
    margin-inline: auto;
    text-align: center;
    flex-direction: column;
    align-items: center;
}
.gas-block-privacy-notice--variant-right .gas-block-privacy-notice__inner { margin-left: auto; }
.gas-block-privacy-notice--variant-full .gas-block-privacy-notice__inner { align-items: center; }
@media (max-width: 640px) {
    .gas-block-privacy-notice__inner { flex-wrap: wrap; }
    .gas-block-privacy-notice__cta { width: 100%; text-align: center; }
}
/* CTA lisible sur ton sombre */
.gas-block-privacy-notice--tone-dark .gas-block-privacy-notice__cta {
    border-color: rgba(255, 255, 255, 0.6);
    color: var(--gas-tone-dark-fg, #f9fafb);
}
.gas-block-privacy-notice--tone-dark .gas-block-privacy-notice__cta:hover {
    background: rgba(255, 255, 255, 0.12);
}
/* @gas:block privacy_notice end *//* @gas:block card_archive start */




/* ════════════════════════════════════════════════════════════════════════════
   Bloc card_archive — collection dynamique filtrable / cherchable / paginée
   ════════════════════════════════════════════════════════════════════════════ */
.gas-block-card-archive { container-type: inline-size; }
.gas-block-card-archive__inner { max-width: var(--gas-container, var(--gas-container-wide, 900px)); margin-inline: auto; }
.gas-block-card-archive__head { margin: 0 0 var(--gas-space-l, 20px); }
.gas-block-card-archive__title { margin: 0; font-size: var(--gas-text-xl, 15px); line-height: 1.2; }
.gas-block-card-archive__lead { margin: var(--gas-space-2, 5px) 0 0; color: var(--gas-color-text-muted, #4a4a4a); }
/* Toolbar : une seule rangée alignée (recherche à gauche qui grandit, filtres puis
   tri compacts à droite), passe proprement à la ligne en mobile. Contrôles à
   hauteur constante (38px) pour un rendu net et pro. */
.gas-block-card-archive__toolbar { display: flex; flex-wrap: wrap; gap: var(--gas-space-2, 8px); align-items: center; margin-bottom: var(--gas-space-l, 18px); }
.gas-block-card-archive__search,
.gas-block-card-archive__ai-search { display: flex; gap: var(--gas-space-2, 6px); flex: 2 1 240px; min-width: 0; align-items: center; order: 1; }
/* Ordre visuel dans la rangée : recherche (1) → filtres (2) → tri poussé à droite (3).
   L'ordre DOM (recherche, tri, filtres) reste correct pour la tabulation clavier. */
.gas-block-card-archive__filters--dropdowns { order: 2; }
.gas-block-card-archive__sort,
.gas-block-card-archive__sort-row { order: 3; }
/* La recherche unifiée n'est plus une « carte » encadrée : elle se fond dans la barre. */
.gas-block-card-archive__ai-search { flex-wrap: wrap; padding: 0; border: 0; background: none; }
.gas-block-card-archive__search-input,
.gas-block-card-archive__ai-input { flex: 1 1 auto; min-width: 0; height: 38px; box-sizing: border-box; padding: 0 12px; border: 1px solid var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-m, 6px); background: var(--gas-color-surface, #fff); color: var(--gas-color-text, #161616); font-size: var(--gas-text-s, 14px); transition: border-color .15s ease, box-shadow .15s ease; }
.gas-block-card-archive__search-input:focus,
.gas-block-card-archive__ai-input:focus { outline: none; border-color: var(--gas-color-primary, #2563eb); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gas-color-primary, #2563eb) 18%, transparent); }
/* Boutons de recherche : hauteur/typo alignées sur les contrôles voisins. */
.gas-block-card-archive__search-btn,
.gas-block-card-archive__ai-btn { height: 38px; padding: 0 16px; font-size: var(--gas-text-s, 14px); flex: 0 0 auto; white-space: nowrap; }
.gas-block-card-archive__ai-chips { display: flex; flex: 1 1 100%; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.gas-block-card-archive__ai-chip { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: var(--gas-radius-full, 999px); background: color-mix(in srgb, var(--gas-color-primary, #2563eb) 10%, var(--gas-color-surface, #fff)); color: var(--gas-color-text, #161616); font-size: var(--gas-text-xs, 12px); }
/* Ligne de statut de la recherche IA (revue UX — remplace le seul chip vague) : propre
   rangée SOUS la toolbar (pas empilée dans la barre de recherche), montre la requête
   tapée + ce qui a été compris (facettes) + le mode (pertinence/simple). */
.gas-block-card-archive__ai-status { display: flex; flex-wrap: wrap; align-items: center; gap: var(--gas-space-2, 8px); margin: calc(-1 * var(--gas-space-m, 10px)) 0 var(--gas-space-l, 18px); padding: var(--gas-space-3, 8px) var(--gas-space-4, 10px); border-radius: var(--gas-radius-m, 6px); background: var(--gas-color-surface-muted, #f0f1f3); font-size: var(--gas-text-s, 14px); color: var(--gas-color-text-muted, #4a4a4a); }
.gas-block-card-archive__ai-status[hidden] { display: none; }
.gas-block-card-archive__ai-status-text { flex: 1 1 auto; min-width: 0; }
.gas-block-card-archive__ai-status-text strong { color: var(--gas-color-text, #161616); font-weight: 600; }
.gas-block-card-archive__ai-status-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.gas-block-card-archive__ai-status-clear { flex: 0 0 auto; padding: 0; border: 0; background: transparent; color: var(--gas-color-primary, #2563eb); font-size: var(--gas-text-s, 14px); font-weight: 600; text-decoration: underline; cursor: pointer; }
.gas-block-card-archive__ai-status-clear:hover { color: var(--gas-color-primary-hover, var(--gas-color-primary, #2563eb)); }
/* Tri : discret, poussé à droite de la barre. */
.gas-block-card-archive__sort,
.gas-block-card-archive__sort-row { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; margin-left: auto; }
.gas-block-card-archive__sort-label { color: var(--gas-color-text-muted, #4a4a4a); font-size: var(--gas-text-xs, 12px); font-weight: 600; white-space: nowrap; }
.gas-block-card-archive__sort-select,
.gas-block-card-archive__filter-select { height: 38px; padding: 0 30px 0 12px; border: 1px solid var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-m, 6px); background: var(--gas-color-surface, #fff); color: var(--gas-color-text, #161616); font-size: var(--gas-text-s, 14px); cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease; }
.gas-block-card-archive__sort-select:focus,
.gas-block-card-archive__filter-select:focus { outline: none; border-color: var(--gas-color-primary, #2563eb); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gas-color-primary, #2563eb) 18%, transparent); }
.gas-block-card-archive__facets { display: flex; flex-wrap: wrap; gap: var(--gas-space-2, 5px); }
/* Facettes secondaires (entity multi-critères) : chaque groupe sur sa propre ligne,
   mais ses chips s'alignent EN LIGNE (côte à côte, wrap) — le libellé prend toute la
   largeur et passe au-dessus des chips. */
.gas-block-card-archive__facets--secondary { flex: 1 1 100%; margin-top: var(--gas-space-2, 5px); flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--gas-space-2, 5px); }
.gas-block-card-archive__facets--secondary > .gas-block-card-archive__filter-label { margin: 0; font-size: var(--gas-text-xs, 12px); font-weight: 600; color: var(--gas-color-text-muted, #4a4a4a); text-transform: uppercase; letter-spacing: 0.05em; }
.gas-block-card-archive__facets--secondary > .gas-block-card-archive__chip { display: inline-flex; }
.gas-block-card-archive__filter-label { width: 100%; }
/* Mode filters_layout=dropdowns : un <select> natif par groupe de facettes, compacts
   et dimensionnés au contenu, alignés dans la rangée de la toolbar (pas de bloc à
   part). Passe à la ligne en mobile. Le bouton « Filtrer » n'est qu'un secours no-JS :
   masqué dès que l'enhancer est actif (classe --js sur la racine du bloc). */
.gas-block-card-archive__filters--dropdowns { display: flex; flex-wrap: wrap; align-items: center; gap: var(--gas-space-2, 8px); flex: 0 1 auto; }
.gas-block-card-archive__filter-group { display: flex; flex: 0 1 auto; min-width: 0; }
.gas-block-card-archive__filter-select { width: auto; max-width: 220px; }
.gas-block-card-archive__filter-submit-form { display: inline-flex; flex: 0 0 auto; }
.gas-block-card-archive--js .gas-block-card-archive__filter-submit-form { display: none; }
.gas-block-card-archive__filter-submit { height: 38px; padding: 0 14px; font-size: var(--gas-text-s, 14px); }
@container (max-width: 480px) {
    .gas-block-card-archive__filters--dropdowns { flex-direction: column; align-items: stretch; }
    .gas-block-card-archive__filter-group { min-width: 0; }
}
/* Mode filters_layout=drawer : toutes les facettes repliées dans un panneau <details>
   natif (fonctionne sans JS), déclenché par un bouton « Filtres (n) » dans la toolbar.
   Recommandé dès 3+ groupes de facettes ou mobile-first. */
.gas-block-card-archive__drawer { flex: 1 1 100%; order: 4; }
.gas-block-card-archive__drawer-toggle { display: inline-flex; align-items: center; gap: var(--gas-space-2, 6px); width: max-content; padding: 7px 14px; border: 1px solid var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-m, 8px); background: var(--gas-color-surface, #fff); color: var(--gas-color-text, #161616); font-size: var(--gas-text-s, 14px); font-weight: 600; cursor: pointer; user-select: none; list-style: none; transition: border-color 0.15s ease, background 0.15s ease; }
.gas-block-card-archive__drawer-toggle::-webkit-details-marker { display: none; }
.gas-block-card-archive__drawer-toggle:hover { border-color: var(--gas-color-primary, #2563eb); }
.gas-block-card-archive__drawer-toggle::after { content: '▾'; font-size: 0.8em; opacity: 0.6; transition: transform 0.15s ease; }
.gas-block-card-archive__drawer[open] > .gas-block-card-archive__drawer-toggle::after { transform: rotate(180deg); }
.gas-block-card-archive__drawer-count { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--gas-radius-full, 999px); background: var(--gas-color-primary, #2563eb); color: #fff; font-size: var(--gas-text-xs, 11px); font-weight: 600; line-height: 1; }
.gas-block-card-archive__drawer-panel { display: flex; flex-direction: column; align-items: flex-start; gap: var(--gas-space-m, 12px); margin-top: var(--gas-space-2, 8px); padding: var(--gas-space-m, 14px); border: 1px solid var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-m, 8px); background: var(--gas-color-surface-muted, #f7f8f9); }
.gas-block-card-archive__drawer-panel .gas-block-card-archive__facets--secondary { margin-top: 0; }
/* Chips de filtres ACTIFS en mode drawer/sidebar : sous le bouton « Filtres » / en fin
   de toolbar (order 5 > drawer 4), PAS au-dessus de la barre de recherche (leur order 0
   par défaut les éjectait tout en haut, loin du contrôle qui les a posés — retour UX
   prod raphael-noir). Le retrait d'un filtre reste ainsi à côté du drawer. */
.gas-block-card-archive--filters-drawer .gas-block-card-archive__active,
.gas-block-card-archive--filters-sidebar .gas-block-card-archive__active { order: 5; border-top: 0; padding-top: 0; }
/* Mode filters_layout=sidebar : facettes en colonne latérale à gauche des résultats
   (style annuaire/catalogue). __split est rendu par les deux renderers (PHP + îlot)
   uniquement dans ce mode (pas __body, déjà pris par le corps des cartes) ; colonne
   unique (facettes au-dessus) en mobile. */
.gas-block-card-archive__split { display: grid; grid-template-columns: minmax(190px, 250px) minmax(0, 1fr); gap: var(--gas-space-l, 20px) var(--gas-space-xl, 32px); align-items: start; }
.gas-block-card-archive__sidebar { display: flex; flex-direction: column; align-items: stretch; gap: var(--gas-space-l, 18px); position: sticky; top: var(--gas-space-l, 16px); }
.gas-block-card-archive__sidebar .gas-block-card-archive__facets--secondary { margin-top: 0; }
.gas-block-card-archive__results { min-width: 0; }
@container (max-width: 720px) {
    .gas-block-card-archive__split { grid-template-columns: 1fr; }
    .gas-block-card-archive__sidebar { position: static; }
}
/* Boutons de basculement de vue */
.gas-block-card-archive__view-toggle { display: flex; gap: 2px; align-items: center; margin-left: auto; }
.gas-block-card-archive__view-btn { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 1px solid var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-m, 5px); background: transparent; color: var(--gas-color-text-muted, #4a4a4a); font-size: 13px; cursor: pointer; transition: background 0.15s ease, color 0.15s ease; }
.gas-block-card-archive__view-btn:hover { background: var(--gas-color-surface-muted, #f0f1f3); }
.gas-block-card-archive__view-btn.is-active { background: var(--gas-color-primary, #2563eb); color: #fff; border-color: transparent; }
.gas-block-card-archive__chip { display: inline-flex; align-items: center; gap: 4px; padding: 3.5px 8px; border-radius: var(--gas-radius-full, 999px); border: 1px solid var(--gas-color-border, #e2e8f0); background: var(--gas-color-surface, #fff); color: var(--gas-color-text, #161616); text-decoration: none; font-size: var(--gas-text-s, 9px); transition: background 0.15s ease, color 0.15s ease; }
.gas-block-card-archive__chip:hover { border-color: var(--gas-color-primary, #2563eb); }
.gas-block-card-archive__chip.is-active { background: var(--gas-color-primary, #2563eb); color: #fff; border-color: transparent; }
.gas-block-card-archive__chip--active { background: var(--gas-color-surface-muted, #f0f1f3); }
.gas-block-card-archive__chip-count { opacity: 0.7; font-size: 0.85em; }
.gas-block-card-archive__active { display: flex; flex: 1 1 100%; flex-wrap: wrap; align-items: center; gap: var(--gas-space-2, 5px); padding-top: var(--gas-space-2, 5px); border-top: 1px solid var(--gas-color-border, #e2e8f0); }
.gas-block-card-archive__reset { color: var(--gas-color-primary, #2563eb); font-size: var(--gas-text-s, 9px); font-weight: 600; text-decoration: none; background: transparent; border: 0; cursor: pointer; }
.gas-block-card-archive__count { margin: 0 0 var(--gas-space-m, 10px); color: var(--gas-color-text-muted, #4a4a4a); font-size: var(--gas-text-s, 9px); }
.gas-block-card-archive__empty { padding: var(--gas-space-2xl, 40px); text-align: center; color: var(--gas-color-text-muted, #4a4a4a); border: 1px dashed var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-l, 12px); }
.gas-block-card-archive__grid { display: grid; gap: var(--gas-space-l, 20px); grid-template-columns: 1fr; }
@container (min-width: 480px) {
    .gas-block-card-archive--cols-2 .gas-block-card-archive__grid,
    .gas-block-card-archive--cols-3 .gas-block-card-archive__grid,
    .gas-block-card-archive--cols-4 .gas-block-card-archive__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container (min-width: 760px) {
    .gas-block-card-archive--cols-3 .gas-block-card-archive__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .gas-block-card-archive--cols-4 .gas-block-card-archive__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.gas-block-card-archive__card { display: flex; flex-direction: column; border-radius: var(--gas-radius-l, 12px); overflow: hidden; background: var(--gas-color-surface-card, #fff); color: inherit; text-decoration: none; height: 100%; transition: transform 0.18s ease; }
.gas-block-card-archive--style-elevated .gas-block-card-archive__card { box-shadow: 0 12px 30px -16px rgba(15, 23, 42, 0.22); border: 1px solid var(--gas-neutral-100, #f1f5f9); }
.gas-block-card-archive--style-outline .gas-block-card-archive__card { border: 1px solid var(--gas-color-border, #e2e8f0); }
.gas-block-card-archive--style-flat .gas-block-card-archive__card { background: var(--gas-color-surface-muted, #f0f1f3); }
a.gas-block-card-archive__card:hover { transform: translateY(-3px); }

/* Variante "liste" : une colonne, cartes horizontales (média à gauche). */
.gas-block-card-archive--layout-list .gas-block-card-archive__grid { grid-template-columns: 1fr; gap: var(--gas-space-m, 10px); }
.gas-block-card-archive--layout-list .gas-block-card-archive__card { flex-direction: row; align-items: stretch; height: auto; }
.gas-block-card-archive--layout-list .gas-block-card-archive__media { flex: 0 0 140px; max-width: 140px; }
.gas-block-card-archive--layout-list .gas-block-card-archive__body { flex: 1 1 auto; }
@media (max-width: 600px) {
    .gas-block-card-archive--layout-list .gas-block-card-archive__card { flex-direction: column; }
    .gas-block-card-archive--layout-list .gas-block-card-archive__media { flex-basis: auto; max-width: none; }
}

/* Variantes éditoriales simples : titres, extraits, média latéral compact. */
.gas-block-card-archive--layout-title_only .gas-block-card-archive__grid,
.gas-block-card-archive--layout-title_excerpt .gas-block-card-archive__grid,
.gas-block-card-archive--layout-media_left .gas-block-card-archive__grid,
.gas-block-card-archive--layout-media_right .gas-block-card-archive__grid,
.gas-block-card-archive--layout-split_media_left .gas-block-card-archive__grid,
.gas-block-card-archive--layout-split_media_right .gas-block-card-archive__grid {
    grid-template-columns: 1fr;
}
.gas-block-card-archive--layout-title_only .gas-block-card-archive__grid,
.gas-block-card-archive--layout-title_excerpt .gas-block-card-archive__grid { gap: 0; border-top: 1px solid var(--gas-color-border, #e2e8f0); }
.gas-block-card-archive--layout-title_only .gas-block-card-archive__card,
.gas-block-card-archive--layout-title_excerpt .gas-block-card-archive__card {
    height: auto;
    border: 0;
    border-bottom: 1px solid var(--gas-color-border, #e2e8f0);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.gas-block-card-archive--layout-title_only.gas-block-card-archive--style-elevated .gas-block-card-archive__card,
.gas-block-card-archive--layout-title_excerpt.gas-block-card-archive--style-elevated .gas-block-card-archive__card,
.gas-block-card-archive--layout-title_only.gas-block-card-archive--style-outline .gas-block-card-archive__card,
.gas-block-card-archive--layout-title_excerpt.gas-block-card-archive--style-outline .gas-block-card-archive__card { border-left: 0; border-right: 0; border-top: 0; box-shadow: none; }
.gas-block-card-archive--layout-title_only .gas-block-card-archive__body,
.gas-block-card-archive--layout-title_excerpt .gas-block-card-archive__body { padding: var(--gas-space-3, 8px) 0; }
.gas-block-card-archive--layout-title_only .gas-block-card-archive__media,
.gas-block-card-archive--layout-title_only .gas-block-card-archive__icon,
.gas-block-card-archive--layout-title_only .gas-block-card-archive__cat,
.gas-block-card-archive--layout-title_only .gas-block-card-archive__text,
.gas-block-card-archive--layout-title_only .gas-block-card-archive__quote,
.gas-block-card-archive--layout-title_excerpt .gas-block-card-archive__media,
.gas-block-card-archive--layout-title_excerpt .gas-block-card-archive__icon,
.gas-block-card-archive--layout-title_excerpt .gas-block-card-archive__cat { display: none; }
.gas-block-card-archive--layout-title_only .gas-block-card-archive__card-title,
.gas-block-card-archive--layout-title_excerpt .gas-block-card-archive__card-title { font-size: var(--gas-text-m, 10px); }
.gas-block-card-archive--layout-title_excerpt .gas-block-card-archive__text { max-width: 72ch; }

.gas-block-card-archive--layout-media_left .gas-block-card-archive__grid,
.gas-block-card-archive--layout-media_right .gas-block-card-archive__grid { gap: var(--gas-space-m, 10px); }
.gas-block-card-archive--layout-media_left .gas-block-card-archive__card,
.gas-block-card-archive--layout-media_right .gas-block-card-archive__card {
    flex-direction: row;
    align-items: stretch;
    height: auto;
}
.gas-block-card-archive--layout-media_left .gas-block-card-archive__media,
.gas-block-card-archive--layout-media_right .gas-block-card-archive__media {
    flex: 0 0 104px;
    max-width: 104px;
    min-height: 92px;
    aspect-ratio: 1;
}
.gas-block-card-archive--layout-media_right .gas-block-card-archive__media { order: 2; }
.gas-block-card-archive--layout-media_right .gas-block-card-archive__body { order: 1; }
.gas-block-card-archive--layout-media_left .gas-block-card-archive__body,
.gas-block-card-archive--layout-media_right .gas-block-card-archive__body { flex: 1 1 auto; justify-content: center; }

.gas-block-card-archive--layout-split_media_left .gas-block-card-archive__card,
.gas-block-card-archive--layout-split_media_right .gas-block-card-archive__card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    min-height: 220px;
    height: auto;
}
.gas-block-card-archive--layout-split_media_left .gas-block-card-archive__media,
.gas-block-card-archive--layout-split_media_right .gas-block-card-archive__media { aspect-ratio: auto; min-height: 220px; height: 100%; }
.gas-block-card-archive--layout-split_media_left .gas-block-card-archive__body,
.gas-block-card-archive--layout-split_media_right .gas-block-card-archive__body { justify-content: center; padding: var(--gas-space-xl, 30px); }
.gas-block-card-archive--layout-split_media_right .gas-block-card-archive__media { order: 2; }
.gas-block-card-archive--layout-split_media_right .gas-block-card-archive__body { order: 1; }
@media (max-width: 600px) {
    .gas-block-card-archive--layout-media_left .gas-block-card-archive__card,
    .gas-block-card-archive--layout-media_right .gas-block-card-archive__card,
    .gas-block-card-archive--layout-split_media_left .gas-block-card-archive__card,
    .gas-block-card-archive--layout-split_media_right .gas-block-card-archive__card { display: flex; flex-direction: column; }
    .gas-block-card-archive--layout-media_left .gas-block-card-archive__media,
    .gas-block-card-archive--layout-media_right .gas-block-card-archive__media { flex-basis: auto; max-width: none; min-height: 160px; aspect-ratio: 16 / 9; order: 0; }
    .gas-block-card-archive--layout-split_media_left .gas-block-card-archive__media,
    .gas-block-card-archive--layout-split_media_right .gas-block-card-archive__media { min-height: 180px; aspect-ratio: 16 / 9; order: 0; }
    .gas-block-card-archive--layout-media_right .gas-block-card-archive__body,
    .gas-block-card-archive--layout-split_media_right .gas-block-card-archive__body { order: 1; }
}

/* Variante "galerie" : image plein format + titre en overlay, aspect carré. */
.gas-block-card-archive--layout-gallery .gas-block-card-archive__card { position: relative; background: transparent; box-shadow: none; border: none; height: auto; aspect-ratio: 1; }
.gas-block-card-archive--layout-gallery.gas-block-card-archive--style-elevated .gas-block-card-archive__card,
.gas-block-card-archive--layout-gallery.gas-block-card-archive--style-outline .gas-block-card-archive__card { box-shadow: none; border: none; }
.gas-block-card-archive--layout-gallery .gas-block-card-archive__media { position: absolute; inset: 0; aspect-ratio: unset; border-radius: var(--gas-radius-l, 12px); overflow: hidden; }
.gas-block-card-archive--layout-gallery .gas-block-card-archive__overlay { position: absolute; bottom: 0; left: 0; right: 0; margin: 0; padding: var(--gas-space-m, 10px) var(--gas-space-4, 10px) var(--gas-space-4, 10px); background: linear-gradient(to top, rgba(0,0,0,0.62) 0%, transparent 100%); border-radius: 0 0 var(--gas-radius-l, 12px) var(--gas-radius-l, 12px); display: flex; flex-direction: column; gap: 2px; }
.gas-block-card-archive--layout-gallery .gas-block-card-archive__overlay .gas-block-card-archive__cat { color: rgba(255,255,255,0.75); }
.gas-block-card-archive--layout-gallery .gas-block-card-archive__overlay .gas-block-card-archive__card-title { color: #fff; margin: 0; font-size: var(--gas-text-m, 10px); }
a.gas-block-card-archive--layout-gallery .gas-block-card-archive__card:hover { transform: none; }
a.gas-block-card-archive--layout-gallery .gas-block-card-archive__card:hover .gas-block-card-archive__media img { transform: scale(1.04); transition: transform 0.3s ease; }

/* Variante "citations" : texte centré, style blockquote, pas d'image. */
.gas-block-card-archive--layout-quote .gas-block-card-archive__grid { grid-template-columns: 1fr; gap: var(--gas-space-m, 10px); }
@container (min-width: 480px) {
    .gas-block-card-archive--layout-quote .gas-block-card-archive__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.gas-block-card-archive--layout-quote .gas-block-card-archive__card { background: var(--gas-color-surface-muted, #f0f1f3); border-radius: var(--gas-radius-l, 12px); padding: var(--gas-space-l, 20px); border-left: 3px solid var(--gas-color-primary, #2563eb); height: auto; }
.gas-block-card-archive--layout-quote.gas-block-card-archive--style-elevated .gas-block-card-archive__card { box-shadow: none; }
.gas-block-card-archive--layout-quote .gas-block-card-archive__body { padding: 0; gap: var(--gas-space-m, 10px); }
.gas-block-card-archive--layout-quote .gas-block-card-archive__quote { margin: 0; font-style: italic; color: var(--gas-color-text, #161616); font-size: var(--gas-text-m, 10px); line-height: 1.6; }
.gas-block-card-archive--layout-quote .gas-block-card-archive__quote::before { content: '«\00a0'; }
.gas-block-card-archive--layout-quote .gas-block-card-archive__quote::after { content: '\00a0»'; }
.gas-block-card-archive--layout-quote .gas-block-card-archive__card-title { margin: 0; font-size: var(--gas-text-s, 9px); font-weight: 600; color: var(--gas-color-text-muted, #4a4a4a); }

.gas-block-card-archive__media { position: relative; margin: 0; aspect-ratio: 16 / 10; overflow: hidden; background: var(--gas-neutral-100, #f1f5f9); }
.gas-block-card-archive__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Pattern B — badge « dispo » (overlay) : places restantes / complet, rafraîchi au runtime. */
.gas-block-card-archive__badge { display: inline-block; padding: 2px 8px; border-radius: var(--gas-radius-full, 999px); font-size: var(--gas-text-s, 9px); font-weight: 600; line-height: 1.4; }
.gas-block-card-archive__media .gas-block-card-archive__badge { position: absolute; top: 8px; right: 8px; box-shadow: 0 1px 4px rgba(15, 23, 42, 0.2); }
.gas-block-card-archive__body > .gas-block-card-archive__badge { align-self: flex-start; }
.gas-block-card-archive__badge--ok { color: #fff; background: var(--gas-color-success, #16a34a); }
.gas-block-card-archive__badge--warn { color: #fff; background: var(--gas-color-warning, #d97706); }
.gas-block-card-archive__badge--full { color: #fff; background: var(--gas-color-danger, #dc2626); }
.gas-block-card-archive__badge--info { color: var(--gas-color-text, #161616); background: var(--gas-color-surface-muted, #f0f1f3); }
.gas-block-card-archive__badge--muted { color: var(--gas-color-text-muted, #4a4a4a); background: var(--gas-color-surface-muted, #f0f1f3); }
.gas-block-card-archive__body { display: flex; flex-direction: column; gap: 4px; padding: var(--gas-space-4, 10px); }
.gas-block-card-archive__cat { font-size: var(--gas-text-s, 9px); color: var(--gas-color-primary, #2563eb); font-weight: 600; }
.gas-block-card-archive__card-title { margin: 0; font-size: var(--gas-text-l, 12px); line-height: 1.25; }
.gas-block-card-archive__text { margin: 0; color: var(--gas-color-text-muted, #4a4a4a); font-size: var(--gas-text-s, 9px); }
/* Méta de carte (ex. année) — accolée au titre. */
.gas-block-card-archive__card-title .gas-block-card-archive__card-meta { margin-left: var(--gas-space-3, 8px); font-size: var(--gas-text-s, 9px); font-weight: 400; color: var(--gas-color-text-muted, #4a4a4a); }
/* Pastilles (tags) de carte — ex. expertises/services d'une réalisation. */
.gas-block-card-archive__tags { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.gas-block-card-archive__tag { font-size: var(--gas-text-xs, 8px); font-weight: 600; line-height: 1; padding: 4px 8px; border-radius: var(--gas-radius-pill, 999px); background: var(--gas-color-surface-muted, #f0f1f3); color: var(--gas-color-text, #1a1a1a); }
/* image_fit=contain : logos/visuels aux ratios variés visibles en entier sur fond neutre. */
.gas-block-card-archive--fit-contain .gas-block-card-archive__media img { object-fit: contain; padding: var(--gas-space-4, 10px); }
/* Contain PAR CARTE (auto) : logo-bandeau/affiche détecté au ratio → contain même si
   le bloc est en fit-cover. Spécificité > la règle de base cover. Cf. archive home. */
.gas-block-card-archive__media--contain img { object-fit: contain; padding: var(--gas-space-m, 16px); }
.gas-block-card-archive__pagination { display: flex; align-items: center; justify-content: center; gap: var(--gas-space-l, 20px); margin-top: var(--gas-space-xl, 30px); }
.gas-block-card-archive__page { color: var(--gas-color-primary, #2563eb); text-decoration: none; font-weight: 600; }
.gas-block-card-archive__page-info { color: var(--gas-color-text-muted, #4a4a4a); }
.gas-block-card-archive__progressive { display: flex; justify-content: center; margin-top: var(--gas-space-xl, 30px); }
.gas-block-card-archive__sentinel { display: block; width: 1px; height: 1px; }
@container (max-width: 480px) {
    .gas-block-card-archive__toolbar { flex-direction: column; align-items: stretch; }
    .gas-block-card-archive__sort,
    .gas-block-card-archive__sort-row { justify-content: space-between; }
}
.gas-block-card-archive__ai-answer { margin: 0 0 var(--gas-space-m, 12px); padding: 10px 14px; border-left: 3px solid var(--gas-color-primary, #2563eb); background: var(--gas-color-surface-muted, #f7f8f9); border-radius: 0 var(--gas-radius-m, 8px) var(--gas-radius-m, 8px) 0; font-size: var(--gas-text-m, 15px); }
/* @gas:block card_archive end *//* @gas:block file_download start */




/* ==========================================================================
   file_download — mode liste + état verrouillé + métadonnées
   ========================================================================== */
.gas-block-file-download__file-meta {
    color: var(--gas-text-muted, #6b7280);
    font-size: var(--gas-text-s, 13px);
}

.gas-block-file-download__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-s, 7.5px);
}

.gas-block-file-download__file {
    display: flex;
    align-items: center;
    gap: var(--gas-space-m, 10px);
    padding: var(--gas-space-s, 7.5px) var(--gas-space-m, 10px);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-m, 5px);
    background: var(--gas-color-surface, #fff);
}
/* @gas:block file_download end */

.gas-block-file-download__ext,
.gas-block-downloads-list__ext {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    padding: 0 var(--gas-space-xs, 5px);
    border-radius: var(--gas-radius-s, 3.75px);
    background: color-mix(in srgb, var(--gas-color-primary, #2563eb) 12%, transparent);
    color: var(--gas-color-primary, #2563eb);
    font-size: var(--gas-text-s, 13px);
    font-weight: 700;
    letter-spacing: 0.02em;
}

.gas-block-file-download__file-body,
.gas-block-downloads-list__body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1 1 auto;
}/* @gas:block file_download start */


.gas-block-file-download__file-label {
    font-weight: 600;
    color: var(--gas-text-color, #111827);
}

.gas-block-file-download__file-desc {
    color: var(--gas-text-secondary, #4b5563);
    font-size: var(--gas-text-s, 13px);
}

.gas-block-file-download__btn {
    flex: 0 0 auto;
}
/* @gas:block file_download end */

.gas-block-file-download__lock,
.gas-block-downloads-list__lock {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--gas-space-xs, 5px);
    text-align: center;
    padding: var(--gas-space-l, 15px);
    border: 1px dashed var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-m, 5px);
    color: var(--gas-text-muted, #6b7280);
}

.gas-block-file-download__lock-icon,
.gas-block-downloads-list__lock-icon {
    font-size: var(--gas-text-l, 20px);
}/* @gas:block downloads_list start */


/* ==========================================================================
   downloads_list — bibliothèque de fichiers
   ========================================================================== */
.gas-block-downloads-list__inner {
    max-width: var(--gas-container, 960px);
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-l, 15px);
}

.gas-block-downloads-list.is-align-center { text-align: center; }

.gas-block-downloads-list__title {
    font-size: var(--gas-text-l, 20px);
    margin: 0;
}

.gas-block-downloads-list__lead {
    color: var(--gas-text-secondary, #4b5563);
    margin: 4px 0 0;
}

.gas-block-downloads-list__grid {
    display: grid;
    gap: var(--gas-space-m, 10px);
    grid-template-columns: repeat(var(--gas-dl-cols, 2), minmax(0, 1fr));
}

.gas-block-downloads-list--cols-1 { --gas-dl-cols: 1; }
.gas-block-downloads-list--cols-2 { --gas-dl-cols: 2; }
.gas-block-downloads-list--cols-3 { --gas-dl-cols: 3; }

.gas-block-downloads-list__card {
    display: flex;
    align-items: center;
    gap: var(--gas-space-m, 10px);
    padding: var(--gas-space-m, 10px);
    border-radius: var(--gas-radius-m, 5px);
    text-decoration: none;
    color: inherit;
    background: var(--gas-color-surface, #fff);
    transition: transform 0.15s var(--gas-ease-standard, ease), box-shadow 0.15s var(--gas-ease-standard, ease);
}

.gas-block-downloads-list--style-outline .gas-block-downloads-list__card { border: 1px solid var(--gas-color-border, #e0e0e0); }
.gas-block-downloads-list--style-flat .gas-block-downloads-list__card { background: color-mix(in srgb, var(--gas-color-primary, #2563eb) 5%, transparent); }
.gas-block-downloads-list--style-elevated .gas-block-downloads-list__card { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 4px 12px rgba(0, 0, 0, 0.06); }

.gas-block-downloads-list__card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.gas-block-downloads-list__label {
    font-weight: 600;
    color: var(--gas-text-color, #111827);
}

.gas-block-downloads-list__desc {
    color: var(--gas-text-secondary, #4b5563);
    font-size: var(--gas-text-s, 13px);
}

.gas-block-downloads-list__meta {
    color: var(--gas-text-muted, #6b7280);
    font-size: var(--gas-text-s, 13px);
}

.gas-block-downloads-list__action {
    flex: 0 0 auto;
    color: var(--gas-color-primary, #2563eb);
    font-size: var(--gas-text-l, 20px);
    font-weight: 700;
}
/* @gas:block downloads_list end */

@container (max-width: 640px) {
    .gas-block-downloads-list__grid { grid-template-columns: 1fr; }
    .gas-block-file-download__file { flex-wrap: wrap; }
}/* @gas:block entity_single start */


/* Bloc entity_single — fiche d'un CPT Entity Kit (parité avec le renderer PHP). */
.gas-block-entity-single .gas-entity-single__header { margin-bottom: var(--gas-space-l, 20px); }
.gas-block-entity-single .gas-entity-single__category { margin: 0 0 var(--gas-space-xs, 2.5px); color: var(--gas-color-primary, #5b3df5); font-size: var(--gas-text-s, 8.75px); font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; }
.gas-block-entity-single .gas-entity-single__title { margin: 0; font-size: var(--gas-text-xl, 22.5px); line-height: 1.1; color: var(--gas-color-text, #15151a); }
.gas-block-entity-single .gas-entity-single__media { margin: 0 0 var(--gas-space-l, 20px); }
.gas-block-entity-single .gas-entity-single__image { display: block; width: 100%; height: auto; border-radius: var(--gas-radius-l, 10px); object-fit: cover; }
.gas-block-entity-single .gas-entity-single__body { display: grid; gap: var(--gas-space-m, 10px); margin-bottom: var(--gas-space-l, 20px); }
.gas-block-entity-single .gas-entity-single__field { display: grid; gap: var(--gas-space-xs, 2.5px); }
.gas-block-entity-single .gas-entity-single__field-label { font-size: var(--gas-text-s, 8.75px); font-weight: 600; color: var(--gas-color-text-muted, #6b6b78); }
.gas-block-entity-single .gas-entity-single__field-value { color: var(--gas-color-text, #15151a); font-size: var(--gas-text-m, 10px); }
.gas-block-entity-single .gas-entity-single__field-value img { max-width: 100%; height: auto; border-radius: var(--gas-radius-m, 5px); }
.gas-block-entity-single .gas-entity-single__relations { margin-top: var(--gas-space-l, 20px); padding-top: var(--gas-space-m, 10px); border-top: 1px solid var(--gas-color-border, #e4e4ec); }
.gas-block-entity-single .gas-entity-single__relations-title { margin: 0 0 var(--gas-space-s, 5px); font-size: var(--gas-text-l, 15px); color: var(--gas-color-text, #15151a); }
.gas-block-entity-single .gas-entity-single__relation-list { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: var(--gas-space-s, 5px); }
.gas-block-entity-single .gas-entity-single__relation { display: inline-flex; align-items: baseline; gap: var(--gas-space-xs, 2.5px); padding: var(--gas-space-xs, 2.5px) var(--gas-space-s, 5px); border-radius: var(--gas-radius-m, 5px); background: var(--gas-color-surface-alt, #f4f4f8); }
.gas-block-entity-single .gas-entity-single__relation-link { color: var(--gas-color-primary, #5b3df5); font-weight: 600; text-decoration: none; }
.gas-block-entity-single .gas-entity-single__relation-link:hover { text-decoration: underline; }
.gas-block-entity-single .gas-entity-single__relation-meta { color: var(--gas-color-text-muted, #6b6b78); font-size: var(--gas-text-s, 8.75px); }
.gas-block-entity-single__empty { color: var(--gas-color-text-muted, #6b6b78); }
/* @gas:block entity_single end *//* @gas:block breadcrumb start */




/* ==========================================================================
   breadcrumb — fil d'Ariane
   ========================================================================== */
.gas-block-breadcrumb {
    max-width: var(--gas-container, 960px);
    margin-inline: auto;
    font-size: var(--gas-text-s, 13px);
}

.gas-block-breadcrumb.is-tone-surface { background: var(--gas-color-surface, #fff); padding: var(--gas-space-s, 7.5px) var(--gas-space-m, 10px); border-radius: var(--gas-radius-m, 5px); }
.gas-block-breadcrumb.is-tone-dark { color: var(--gas-text-on, #fff); }
.gas-block-breadcrumb.is-align-center .gas-block-breadcrumb__list { justify-content: center; }

.gas-block-breadcrumb__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--gas-space-xs, 5px);
}

.gas-block-breadcrumb__item {
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-xs, 5px);
    color: var(--gas-text-muted, #6b7280);
}

.gas-block-breadcrumb__item:not(:first-child)::before {
    color: var(--gas-text-muted, #9ca3af);
    opacity: 0.7;
}

.gas-block-breadcrumb--sep-chevron .gas-block-breadcrumb__item:not(:first-child)::before { content: "\203A"; }
.gas-block-breadcrumb--sep-slash .gas-block-breadcrumb__item:not(:first-child)::before { content: "/"; }
.gas-block-breadcrumb--sep-arrow .gas-block-breadcrumb__item:not(:first-child)::before { content: "\2192"; }
.gas-block-breadcrumb--sep-dot .gas-block-breadcrumb__item:not(:first-child)::before { content: "\2022"; }

.gas-block-breadcrumb__link {
    color: var(--gas-text-secondary, #4b5563);
    text-decoration: none;
}
.gas-block-breadcrumb__link:hover { color: var(--gas-color-primary, #2563eb); text-decoration: underline; }

.gas-block-breadcrumb__current {
    color: var(--gas-text-color, #111827);
    font-weight: 600;
}
/* @gas:block breadcrumb end *//* @gas:block directory_map start */




/* ==========================================================================
   directory_map — annuaire cartographié (carte + liste filtrable)
   ========================================================================== */
.gas-block-directory-map__inner {
    max-width: var(--gas-container, 1100px);
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-l, 15px);
}

.gas-block-directory-map__title { font-size: var(--gas-text-l, 20px); margin: 0; }
.gas-block-directory-map__lead { color: var(--gas-text-secondary, #4b5563); margin: 4px 0 0; }

.gas-block-directory-map__layout {
    display: grid;
    gap: var(--gas-space-l, 15px);
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    align-items: start;
}

.gas-block-directory-map--map_left .gas-block-directory-map__panel { order: 2; }
.gas-block-directory-map--map_top .gas-block-directory-map__layout { grid-template-columns: 1fr; }
.gas-block-directory-map--map_top .gas-block-directory-map__map { order: -1; }

.gas-block-directory-map__panel {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-m, 10px);
}

.gas-block-directory-map__toolbar {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-s, 7.5px);
}

.gas-block-directory-map__search { display: flex; gap: var(--gas-space-xs, 5px); }
.gas-block-directory-map__search-input {
    flex: 1 1 auto;
    padding: var(--gas-space-xs, 5px) var(--gas-space-s, 7.5px);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-m, 5px);
}

.gas-block-directory-map__facets { display: flex; flex-wrap: wrap; gap: var(--gas-space-xs, 5px); }
.gas-block-directory-map__chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px var(--gas-space-s, 7.5px);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-full, 999px);
    font-size: var(--gas-text-s, 13px);
    text-decoration: none;
    color: var(--gas-text-secondary, #4b5563);
}
.gas-block-directory-map__chip.is-active { background: var(--gas-color-primary, #2563eb); color: var(--gas-text-on, #fff); border-color: transparent; }
.gas-block-directory-map__chip-count { opacity: 0.7; font-variant-numeric: tabular-nums; }

.gas-block-directory-map__count { color: var(--gas-text-muted, #6b7280); font-size: var(--gas-text-s, 13px); margin: 0; }

.gas-block-directory-map__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-xs, 5px);
    max-height: 520px;
    overflow-y: auto;
}

.gas-block-directory-map__item {
    padding: var(--gas-space-s, 7.5px) var(--gas-space-m, 10px);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-m, 5px);
    background: var(--gas-color-surface, #fff);
}
.gas-block-directory-map__item:hover { border-color: var(--gas-color-primary, #2563eb); }
.gas-block-directory-map__item-title { font-size: var(--gas-text-m, 16px); margin: 0; }
.gas-block-directory-map__item-title a { color: inherit; text-decoration: none; }
.gas-block-directory-map__item-title a:hover { color: var(--gas-color-primary, #2563eb); }
.gas-block-directory-map__item-cat {
    display: inline-block;
    margin-top: 2px;
    font-size: var(--gas-text-s, 13px);
    color: var(--gas-color-primary, #2563eb);
}
.gas-block-directory-map__item-address { color: var(--gas-text-secondary, #4b5563); font-size: var(--gas-text-s, 13px); margin: 2px 0 0; }
.gas-block-directory-map__empty { color: var(--gas-text-muted, #6b7280); }

.gas-block-directory-map__map {
    position: sticky;
    top: var(--gas-space-m, 10px);
    border-radius: var(--gas-radius-l, 7.5px);
    overflow: hidden;
    background: color-mix(in srgb, var(--gas-color-primary, #2563eb) 6%, transparent);
}
.gas-block-directory-map__canvas { width: 100%; height: 100%; min-height: inherit; }
.gas-block-directory-map--h-s .gas-block-directory-map__map { min-height: 320px; }
.gas-block-directory-map--h-m .gas-block-directory-map__map { min-height: 460px; }
.gas-block-directory-map--h-l .gas-block-directory-map__map { min-height: 600px; }
.gas-block-directory-map__canvas { min-height: 320px; }
.gas-block-directory-map--h-m .gas-block-directory-map__canvas { min-height: 460px; }
.gas-block-directory-map--h-l .gas-block-directory-map__canvas { min-height: 600px; }
.gas-block-directory-map__noscript { padding: var(--gas-space-l, 15px); text-align: center; color: var(--gas-text-muted, #6b7280); }

@media (max-width: 768px) {
    .gas-block-directory-map__layout { grid-template-columns: 1fr; }
    .gas-block-directory-map--map_left .gas-block-directory-map__panel { order: 0; }
    .gas-block-directory-map__map { position: static; order: -1; }
    .gas-block-directory-map__list { max-height: none; }
}
/* @gas:block directory_map end *//* @gas:block search_box start */




/* ==========================================================================
   search_box — champ de recherche
   ========================================================================== */
.gas-block-search-box__inner {
    max-width: var(--gas-container, 640px);
    margin-inline: auto;
}
.gas-block-search-box.is-align-center { text-align: center; }
.gas-block-search-box.is-align-center .gas-block-search-box__form { justify-content: center; }
.gas-block-search-box.is-tone-surface .gas-block-search-box__inner,
.gas-block-search-box.is-tone-dark .gas-block-search-box__inner,
.gas-block-search-box.is-tone-primary .gas-block-search-box__inner {
    padding: var(--gas-space-l, 15px);
    border-radius: var(--gas-radius-l, 7.5px);
}
.gas-block-search-box.is-tone-surface .gas-block-search-box__inner { background: var(--gas-color-surface, #fff); }
.gas-block-search-box.is-tone-dark .gas-block-search-box__inner { background: var(--gas-color-dark, #111827); color: var(--gas-text-on, #fff); }
.gas-block-search-box.is-tone-primary .gas-block-search-box__inner { background: var(--gas-color-primary, #2563eb); color: var(--gas-text-on, #fff); }

.gas-block-search-box__title { font-size: var(--gas-text-l, 20px); margin: 0 0 4px; }
.gas-block-search-box__lead { margin: 0 0 var(--gas-space-m, 10px); opacity: 0.85; }

.gas-block-search-box__form { display: flex; gap: var(--gas-space-xs, 5px); }
.gas-block-search-box__input {
    flex: 1 1 auto;
    min-width: 0;
    padding: var(--gas-space-s, 7.5px) var(--gas-space-m, 10px);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-m, 5px);
    font-size: var(--gas-text-m, 16px);
}
.gas-block-search-box--large .gas-block-search-box__input { padding: var(--gas-space-m, 10px) var(--gas-space-l, 15px); font-size: var(--gas-text-l, 20px); }
.gas-block-search-box__btn { flex: 0 0 auto; }

/* ── Variante guided — entrée de recherche en langage naturel (ressenti) ── */
.gas-block-search-box--guided { padding-block: var(--gas-space-2xl, 48px); }
.gas-block-search-box--guided .gas-block-search-box__inner {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-s, 7.5px);
}
.gas-block-search-box--guided.is-align-center .gas-block-search-box__inner { align-items: center; }
.gas-block-search-box__eyebrow {
    margin: 0;
    font-size: var(--gas-text-xs, 12px);
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--gas-color-primary, #2563eb);
}
.gas-block-search-box--guided .gas-block-search-box__title {
    font-size: var(--gas-text-3xl, 32px);
    line-height: 1.15;
    margin: 0;
}
.gas-block-search-box--guided .gas-block-search-box__lead {
    font-size: var(--gas-text-l, 20px);
    margin: 0;
}
.gas-block-search-box__note {
    margin: 0 0 var(--gas-space-s, 7.5px);
    font-family: var(--gas-font-family-accent, inherit);
    font-style: italic;
    color: var(--gas-text-muted, #6b7280);
}
.gas-block-search-box--guided .gas-block-search-box__form {
    margin-top: var(--gas-space-m, 10px);
    width: 100%;
    max-width: var(--gas-container-narrow, 640px);
}
.gas-block-search-box__reassurance {
    margin: var(--gas-space-s, 7.5px) 0 0;
    font-size: var(--gas-text-s, 13px);
    color: var(--gas-text-muted, #6b7280);
}
/* @gas:block search_box end *//* @gas:block search_results start */




/* ==========================================================================
   search_results — résultats de recherche
   ========================================================================== */
.gas-block-search-results__inner {
    max-width: var(--gas-container, 800px);
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-m, 10px);
}
.gas-block-search-results__title { font-size: var(--gas-text-l, 20px); margin: 0; }
.gas-block-search-results__lead { color: var(--gas-text-secondary, #4b5563); margin: 0; }
.gas-block-search-results__count { color: var(--gas-text-muted, #6b7280); font-size: var(--gas-text-s, 13px); margin: 0; }
.gas-block-search-results__hint,
.gas-block-search-results__empty { color: var(--gas-text-muted, #6b7280); }

.gas-block-search-results__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-m, 10px);
}
.gas-block-search-results__item {
    padding: var(--gas-space-m, 10px) 0;
    border-bottom: 1px solid var(--gas-color-border, #e0e0e0);
}
.gas-block-search-results__badge {
    display: inline-block;
    font-size: var(--gas-text-s, 13px);
    color: var(--gas-color-primary, #2563eb);
    background: color-mix(in srgb, var(--gas-color-primary, #2563eb) 10%, transparent);
    padding: 1px 6px;
    border-radius: var(--gas-radius-full, 999px);
    margin-bottom: 3px;
}
.gas-block-search-results__item-title { font-size: var(--gas-text-m, 16px); margin: 0; }
.gas-block-search-results__item-title a { color: var(--gas-text-color, #111827); text-decoration: none; }
.gas-block-search-results__item-title a:hover { color: var(--gas-color-primary, #2563eb); text-decoration: underline; }
.gas-block-search-results__excerpt { color: var(--gas-text-secondary, #4b5563); margin: 3px 0 0; }
.gas-block-search-results__lock { display: inline-block; margin-top: 3px; font-size: var(--gas-text-s, 13px); color: var(--gas-text-muted, #6b7280); }

.gas-block-search-results__pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--gas-space-m, 10px);
    margin-top: var(--gas-space-m, 10px);
}
.gas-block-search-results__page { color: var(--gas-color-primary, #2563eb); text-decoration: none; }
.gas-block-search-results__page-info { color: var(--gas-text-muted, #6b7280); font-size: var(--gas-text-s, 13px); }
/* @gas:block search_results end *//* @gas:block countdown start */




/* ==========================================================================
   countdown — compte à rebours
   ========================================================================== */
.gas-block-countdown__inner {
    max-width: var(--gas-container, 720px);
    margin-inline: auto;
}
.gas-block-countdown.is-align-center { text-align: center; }
.gas-block-countdown.is-align-center .gas-block-countdown__timer { justify-content: center; }
.gas-block-countdown.is-tone-surface .gas-block-countdown__inner,
.gas-block-countdown.is-tone-primary .gas-block-countdown__inner,
.gas-block-countdown.is-tone-dark .gas-block-countdown__inner {
    padding: var(--gas-space-l, 15px);
    border-radius: var(--gas-radius-l, 7.5px);
}
.gas-block-countdown.is-tone-surface .gas-block-countdown__inner { background: var(--gas-color-surface, #fff); }
.gas-block-countdown.is-tone-primary .gas-block-countdown__inner { background: var(--gas-color-primary, #2563eb); color: var(--gas-text-on, #fff); }
.gas-block-countdown.is-tone-dark .gas-block-countdown__inner { background: var(--gas-color-dark, #111827); color: var(--gas-text-on, #fff); }

.gas-block-countdown__title { font-size: var(--gas-text-l, 20px); margin: 0 0 4px; }
.gas-block-countdown__lead { margin: 0 0 var(--gas-space-m, 10px); opacity: 0.85; }

.gas-block-countdown__timer {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-m, 10px);
}
.gas-block-countdown__unit {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    min-width: 60px;
}
.gas-block-countdown--boxes .gas-block-countdown__unit {
    padding: var(--gas-space-s, 7.5px) var(--gas-space-m, 10px);
    border-radius: var(--gas-radius-m, 5px);
    background: color-mix(in srgb, var(--gas-color-primary, #2563eb) 10%, transparent);
}
.gas-block-countdown__value {
    font-size: clamp(28px, 6vw, 44px);
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.gas-block-countdown__label {
    font-size: var(--gas-text-s, 13px);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    opacity: 0.75;
}
.gas-block-countdown--inline .gas-block-countdown__timer { gap: var(--gas-space-s, 7.5px); align-items: baseline; }
.gas-block-countdown--inline .gas-block-countdown__unit { flex-direction: row; gap: 3px; min-width: 0; }
.gas-block-countdown--inline .gas-block-countdown__value { font-size: var(--gas-text-l, 20px); }
.gas-block-countdown__expired { font-size: var(--gas-text-l, 20px); font-weight: 600; margin: 0; }
/* @gas:block countdown end *//* @gas:block social_embed start */




/* ==========================================================================
   social_embed — publication réseau social (privacy-first)
   ========================================================================== */
.gas-block-social-embed__inner {
    max-width: var(--gas-container, 560px);
    margin-inline: auto;
}
.gas-block-social-embed.is-align-center { text-align: center; }
.gas-block-social-embed__title { font-size: var(--gas-text-l, 20px); margin: 0 0 var(--gas-space-s, 7.5px); }

.gas-block-social-embed__placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--gas-space-s, 7.5px);
    padding: var(--gas-space-xl, 20px) var(--gas-space-l, 15px);
    border: 1px dashed var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-l, 7.5px);
    background: color-mix(in srgb, var(--gas-color-primary, #2563eb) 4%, transparent);
}
.gas-block-social-embed__provider {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: var(--gas-text-s, 13px);
    color: var(--gas-color-primary, #2563eb);
}
.gas-block-social-embed__notice {
    margin: 0;
    color: var(--gas-text-secondary, #4b5563);
    font-size: var(--gas-text-s, 13px);
    max-width: 420px;
}
.gas-block-social-embed__mount { display: flex; justify-content: center; }
.gas-block-social-embed__mount iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 0;
    border-radius: var(--gas-radius-m, 5px);
}
.gas-block-social-embed__caption {
    margin: var(--gas-space-s, 7.5px) 0 0;
    color: var(--gas-text-muted, #6b7280);
    font-size: var(--gas-text-s, 13px);
}
.gas-block-social-embed__fallback { color: var(--gas-color-primary, #2563eb); }
/* @gas:block social_embed end *//* @gas:block learning_pathway start */




/* ====== learning_pathway — plan d'un parcours de formation ====== */
.gas-block-learning-pathway {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-s, 7.5px);
}
.gas-block-learning-pathway__title { margin: 0; }
.gas-block-learning-pathway__subtitle {
    margin: 0;
    color: var(--gas-text-muted, #6b7280);
}
.gas-block-learning-pathway__meta {
    margin: 0;
    font-size: var(--gas-text-s, 13px);
    color: var(--gas-text-muted, #6b7280);
}
.gas-block-learning-pathway__description { margin: 0; white-space: pre-line; }
.gas-block-learning-pathway__sections {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-s, 7.5px);
}
.gas-block-learning-pathway__section {
    border: 1px solid var(--gas-border-color, #e5e7eb);
    border-radius: var(--gas-radius-l, 12px);
    padding: var(--gas-space-m, 10px);
    background: var(--gas-surface-card, #fff);
}
.gas-block-learning-pathway__section-title {
    margin: 0 0 var(--gas-space-xs, 5px);
    font-size: var(--gas-text-m, 15px);
}
.gas-block-learning-pathway__items {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-xs, 5px);
}
.gas-block-learning-pathway__item { font-size: var(--gas-text-s, 13px); }
.gas-block-learning-pathway__item-optional {
    font-size: var(--gas-text-xs, 11px);
    color: var(--gas-text-muted, #6b7280);
    border: 1px solid var(--gas-border-color, #e5e7eb);
    border-radius: var(--gas-radius-m, 8px);
    padding: 0 var(--gas-space-xs, 5px);
}
.gas-block-learning-pathway__cta { margin: 0; }
.gas-block-learning-pathway__empty { color: var(--gas-text-muted, #6b7280); }
/* @gas:block learning_pathway end *//* @gas:block quiz_embed start */




/* ====== quiz_embed — quiz interactif dans une page ====== */
.gas-block-quiz-embed__title { margin: 0 0 var(--gas-space-s, 7.5px); }
.gas-block-quiz-embed__gate {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-s, 7.5px);
    align-items: flex-start;
    border: 1px solid var(--gas-border-color, #e5e7eb);
    border-radius: var(--gas-radius-l, 12px);
    padding: var(--gas-space-m, 10px);
    background: var(--gas-surface-card, #fff);
}
.gas-block-quiz-embed__gate-title { margin: 0; font-weight: 600; }
.gas-block-quiz-embed__empty { color: var(--gas-text-muted, #6b7280); }
/* @gas:block quiz_embed end *//* @gas:block related_entities start */



/* Bloc related_entities (pont documents ↔ entités, lot 10 plan v2) */

.gas-block-related-entities {
    margin: var(--gas-space-l, 15px) 0;
}

.gas-block-related-entities__heading {
    font-size: var(--gas-text-l, 12.5px);
    margin: 0 0 var(--gas-space-s, 5px);
}

.gas-block-related-entities__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: var(--gas-space-s, 5px);
}

.gas-block-related-entities__item {
    display: flex;
    gap: var(--gas-space-s, 5px);
    padding: var(--gas-space-s, 5px);
    border: 1px solid var(--gas-color-border, #e2e2ea);
    border-radius: var(--gas-radius-m, 5px);
    background: var(--gas-color-surface, #fff);
}

.gas-block-related-entities__image {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: var(--gas-radius-m, 5px);
    flex-shrink: 0;
}

.gas-block-related-entities__category {
    margin: 0;
    font-size: var(--gas-text-s, 8.75px);
    color: var(--gas-color-text-muted, #6b6b78);
}

.gas-block-related-entities__title {
    margin: 0;
    font-weight: 600;
}

.gas-block-related-entities__link {
    font-size: var(--gas-text-s, 8.75px);
    color: var(--gas-color-primary, #5b3df5);
}
/* @gas:block related_entities end */

/* ============================================================
   Bloc « Événement lié » (Lot 4a — article → activité)
   ============================================================ */
.gas-related-events {
    margin: var(--gas-space-6) 0;
}
.gas-related-events__title {
    margin-bottom: var(--gas-space-4);
}
.gas-related-events__list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: var(--gas-space-4);
}
.gas-related-events__card {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-3);
    padding: var(--gas-space-4);
    border: 1px solid var(--gas-color-border);
    border-radius: var(--gas-radius-m);
    background: var(--gas-color-surface);
}
.gas-related-events__card-title {
    font-weight: 600;
    text-decoration: none;
    color: var(--gas-color-text);
}
.gas-related-events__card-title:hover {
    color: var(--gas-color-accent);
}
.gas-related-events__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-3);
    color: var(--gas-color-text-secondary);
    font-size: .9em;
}
.gas-related-events__cta {
    align-self: flex-start;
}

/* Pages système (404 / accès réservé) : rangée de boutons d'action. */
.gas-system-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-s, 7.5px);
    justify-content: center;
    margin-block-start: var(--gas-space-m, 15px);
}/* @gas:block login_form start */


/* Bloc formulaire de connexion : conteneur centré, largeur maîtrisée. */
.gas-block-login-form {
    max-width: var(--gas-container, 320px);
    margin-inline: auto;
}
/* @gas:block login_form end */

/* ============================================================
   Bloc collection_activites (Lot 4b — activités d'une collection)
   ============================================================ */
.gas-collection-activites { margin: var(--gas-space-6) 0; }
.gas-collection-activites__title { margin-bottom: var(--gas-space-4); }
.gas-collection-activites__list {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--gas-space-4);
}
.gas-collection-activites__link {
    display: flex; flex-direction: column;
    border: 1px solid var(--gas-color-border); border-radius: var(--gas-radius-m);
    overflow: hidden; text-decoration: none; color: var(--gas-color-text);
    background: var(--gas-color-surface); transition: border-color .15s ease, transform .15s ease;
}
.gas-collection-activites__link:hover { border-color: var(--gas-color-accent); transform: translateY(-2px); }
.gas-collection-activites__img { width: 100%; height: 140px; object-fit: cover; display: block; background: var(--gas-color-bg-subtle); }
.gas-collection-activites__body { display: flex; flex-direction: column; gap: var(--gas-space-2, 4px); padding: var(--gas-space-4); }
.gas-collection-activites__name { font-weight: 600; }
.gas-collection-activites__date { color: var(--gas-color-text-secondary); font-size: .9em; }/* @gas:block card_archive start */


/* card_archive — état chargement AJAX (pagination dynamique) */
.gas-block-card-archive.is-loading .gas-block-card-archive__grid {
    opacity: 0.45;
    pointer-events: none;
    transition: opacity 0.18s var(--gas-ease-standard, ease);
}
.gas-block-card-archive.is-loading .gas-block-card-archive__pagination {
    opacity: 0.45;
    pointer-events: none;
}
.gas-block-card-archive.is-loading .gas-block-card-archive__progressive {
    opacity: 0.65;
    pointer-events: none;
}
/* @gas:block card_archive end *//* @gas:block audio_player start */




/* ─── audio_player ──────────────────────────────────────────────────────── */

.gas-block-audio-player {
    container-type: inline-size;
}
.gas-block-audio-player__inner {
    max-width: var(--gas-container, var(--gas-container-default, 720px));
    margin-inline: auto;
    padding-inline: var(--gas-space-4);
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-3);
}
.gas-block-audio-player__title {
    font-size: var(--gas-text-l, 12.5px);
    font-weight: 600;
    color: var(--gas-color-text);
    margin: 0;
}
.gas-block-audio-player__frame {
    width: 100%;
    border-radius: var(--gas-radius-m, 8px);
    overflow: hidden;
    background: var(--gas-color-surface-muted, #111);
}
.gas-block-audio-player__iframe {
    width: 100%;
    height: var(--_player-h, 352px);
    display: block;
    border: 0;
}
.gas-block-audio-player__caption {
    font-size: var(--gas-text-s, 8.75px);
    color: var(--gas-color-text-secondary);
    margin: 0;
}
/* @gas:block audio_player end *//* @gas:block hero_video start */




/* ─── hero_video ─────────────────────────────────────────────────────────── */

.gas-block-hero-video {
    position: relative;
    min-height: var(--_hero-min-h, 100svh);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    isolation: isolate;
    color: #fff;
}

.gas-block-hero-video__bg {
    position: absolute;
    inset: 0;
    z-index: -1;
}

.gas-block-hero-video__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}
/* iFrame YouTube/Vimeo : scale trick pour couvrir sans bandes noires */
.gas-block-hero-video__video--yt,
.gas-block-hero-video__video--vimeo {
    width: 200%;
    height: 200%;
    top: -50%;
    left: -50%;
}

/* Image de secours : cachée par défaut, visible sous prefers-reduced-motion */
.gas-block-hero-video__fallback {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: none;
}
@media (prefers-reduced-motion: reduce) {
    .gas-block-hero-video__video { display: none; }
    .gas-block-hero-video__fallback { display: block; }
}

.gas-block-hero-video__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, var(--_hero-overlay, 0.45));
}

.gas-block-hero-video__content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--gas-space-4);
    padding: clamp(48px, 8vw, 120px) clamp(20px, 5vw, 80px);
    max-width: 860px;
    width: 100%;
}
.gas-block-hero-video--align-left .gas-block-hero-video__content {
    align-items: flex-start;
    text-align: left;
}

.gas-block-hero-video__eyebrow {
    font-size: 7.5px;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    opacity: .75;
    margin: 0;
}
.gas-block-hero-video__title {
    font-family: var(--gas-font-heading, var(--gas-font-base, inherit));
    font-size: clamp(25px, 7vw, 50px);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -.02em;
    margin: 0;
    color: #fff;
}
.gas-block-hero-video__subtitle {
    font-size: clamp(10px, 2vw, 11.5px);
    line-height: 1.6;
    opacity: .88;
    margin: 0;
    max-width: 620px;
}
.gas-block-hero-video__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-3);
    align-items: center;
}
.gas-block-hero-video--align-left .gas-block-hero-video__actions {
    justify-content: flex-start;
}
.gas-block-hero-video__note {
    font-size: 8.75px;
    opacity: .6;
    margin: 0;
    font-style: italic;
}

/* Ken Burns scroll-linked (scale sur fond vidéo + fallback). */
@supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
        @keyframes gas-hero-ken-subtle {
            from { transform: scale(1.04); }
            to   { transform: scale(1); }
        }
        @keyframes gas-hero-ken-marked {
            from { transform: scale(1.12); }
            to   { transform: scale(1); }
        }
        .gas-block-hero-video--ken-subtle .gas-block-hero-video__video,
        .gas-block-hero-video--ken-subtle .gas-block-hero-video__fallback {
            animation: gas-hero-ken-subtle linear both;
            animation-timeline: view();
            animation-range: entry 0% exit 100%;
            will-change: transform;
            transform-origin: center center;
        }
        .gas-block-hero-video--ken-marked .gas-block-hero-video__video,
        .gas-block-hero-video--ken-marked .gas-block-hero-video__fallback {
            animation: gas-hero-ken-marked linear both;
            animation-timeline: view();
            animation-range: entry 0% exit 100%;
            will-change: transform;
            transform-origin: center center;
        }
    }
}

/* Scrub mode : video figée frame-à-frame (JS), fallback visible en reduced-motion. */
.gas-block-hero-video--scrub .gas-block-hero-video__video--scrub {
    /* pas d'autoplay — le JS pose currentTime */
}
@media (prefers-reduced-motion: reduce) {
    .gas-block-hero-video--scrub .gas-block-hero-video__video--scrub { display: none; }
    .gas-block-hero-video--scrub .gas-block-hero-video__fallback { display: block; }
}

/* @gas:block hero_video end *//* @gas:block query start */




/* ===========================================================================
   query — slice déclarative multi-source (cards | list | links | logos)
   Slice figée (sans toolbar/pagination). Cf. blocs/renderers/query.php.
   =========================================================================== */
.gas-block-query__head { margin: 0 0 var(--gas-space-l, 20px); }
.gas-block-query__title { margin: 0; font-size: var(--gas-text-xl, 15px); line-height: 1.2; }
.gas-block-query__lead { margin: var(--gas-space-2, 5px) 0 0; color: var(--gas-color-text-muted, #4a4a4a); }
.gas-block-query__empty { padding: var(--gas-space-2xl, 40px); text-align: center; color: var(--gas-color-text-muted, #4a4a4a); border: 1px dashed var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-l, 12px); }

/* --- layout cards --- */
.gas-block-query__grid { display: grid; gap: var(--gas-space-l, 20px); grid-template-columns: 1fr; }
@media (min-width: 600px) {
    .gas-block-query--cols-2 .gas-block-query__grid,
    .gas-block-query--cols-3 .gas-block-query__grid,
    .gas-block-query--cols-4 .gas-block-query__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
    .gas-block-query--cols-3 .gas-block-query__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .gas-block-query--cols-4 .gas-block-query__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.gas-block-query__card { display: flex; flex-direction: column; border-radius: var(--gas-radius-l, 12px); overflow: hidden; background: var(--gas-white, #fff); color: inherit; text-decoration: none; height: 100%; border: 1px solid var(--gas-neutral-100, #f1f5f9); box-shadow: 0 12px 30px -16px rgba(15, 23, 42, 0.22); transition: transform 0.18s ease; }
a.gas-block-query__card:hover { transform: translateY(-3px); }
.gas-block-query__media { position: relative; margin: 0; aspect-ratio: 16 / 10; overflow: hidden; background: var(--gas-neutral-100, #f1f5f9); }
.gas-block-query__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gas-block-query__body { display: flex; flex-direction: column; gap: var(--gas-space-2, 5px); padding: var(--gas-space-m, 10px); }
.gas-block-query__cat { font-size: var(--gas-text-s, 9px); color: var(--gas-color-primary, #2563eb); font-weight: 600; }
.gas-block-query__card-title { margin: 0; font-size: var(--gas-text-l, 12px); line-height: 1.25; }
.gas-block-query__text { margin: 0; color: var(--gas-color-text-muted, #4a4a4a); }

/* --- layout links : mur de références --- */
.gas-block-query__links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--gas-space-2, 5px) var(--gas-space-m, 10px); }
.gas-block-query__link-item { display: inline-flex; align-items: center; }
.gas-block-query__link-item:not(:last-child)::after { content: "·"; margin-left: var(--gas-space-m, 10px); color: var(--gas-color-border, #cbd5e1); }
.gas-block-query__link { color: var(--gas-color-primary, #2563eb); text-decoration: none; font-weight: 500; }
.gas-block-query__link:hover { text-decoration: underline; }

/* --- layout logos --- */
.gas-block-query__logos { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--gas-space-l, 20px); grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; }
@media (min-width: 600px) { .gas-block-query--cols-3 .gas-block-query__logos { grid-template-columns: repeat(3, minmax(0, 1fr)); } .gas-block-query--cols-4 .gas-block-query__logos { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.gas-block-query__logo { display: flex; align-items: center; justify-content: center; padding: var(--gas-space-m, 10px); filter: grayscale(1); opacity: 0.75; transition: filter 0.18s ease, opacity 0.18s ease; }
.gas-block-query__logo:hover { filter: none; opacity: 1; }
.gas-block-query__logo img { max-width: 100%; height: auto; max-height: 64px; object-fit: contain; display: block; }
.gas-block-query__logo-text { font-weight: 600; color: var(--gas-color-text-muted, #4a4a4a); }

/* --- layout list : lignes compactes --- */
.gas-block-query__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--gas-space-2, 5px); }
.gas-block-query__row-link { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: var(--gas-space-2, 5px) var(--gas-space-m, 10px); padding: var(--gas-space-m, 10px); border-radius: var(--gas-radius-md, 5px); color: inherit; text-decoration: none; border: 1px solid var(--gas-color-border, #e2e8f0); }
a.gas-block-query__row-link:hover { background: var(--gas-color-surface-muted, #f0f1f3); }
.gas-block-query__row-cat { font-size: var(--gas-text-s, 9px); color: var(--gas-color-primary, #2563eb); font-weight: 600; }
.gas-block-query__row-title { font-weight: 600; }
.gas-block-query__row-text { grid-column: 1 / -1; margin: 0; color: var(--gas-color-text-muted, #4a4a4a); }
/* @gas:block query end *//* @gas:block loop start */




/* loop — extras émis (en-têtes de groupe, séparateurs, état vide, voir-tout) */
.gas-block-loop__group { margin: var(--gas-space-l, 20px) 0 var(--gas-space-2, 5px); font-size: var(--gas-text-l, 12px); color: var(--gas-color-primary, #2563eb); }
.gas-block-loop__group:first-child { margin-top: 0; }
.gas-block-loop__sep--line { border: 0; border-top: 1px solid var(--gas-color-border, #e2e8f0); margin: var(--gas-space-m, 10px) 0; }
.gas-block-loop__sep--dot { text-align: center; color: var(--gas-color-border, #cbd5e1); margin: var(--gas-space-2, 5px) 0; }
.gas-block-loop__sep--space { height: var(--gas-space-l, 20px); }
.gas-block-loop__empty { padding: var(--gas-space-2xl, 40px); text-align: center; color: var(--gas-color-text-muted, #4a4a4a); border: 1px dashed var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-l, 12px); }
.gas-block-loop__see-all-wrap { margin-top: var(--gas-space-m, 10px); }
.gas-block-loop__see-all { color: var(--gas-color-primary, #2563eb); font-weight: 600; text-decoration: none; }
.gas-block-loop__see-all:hover { text-decoration: underline; }
/* @gas:block loop end */

/* =============================================================
   Moteur d'animation reveal — IntersectionObserver (IO)
   Lot 3 — text-emphasis-marks / pivot scroll-timeline → IO

   Stratégie d'étanchéité :
   • Tout état initial caché (opacity, transform, filter, clip-path)
     est STRICTEMENT enfermé dans html.gas-anim-js + no-preference.
   • Sans JS → la classe gas-anim-js n'est jamais posée → rien de caché.
   • reduced-motion → gas-block-reveal.js sort sans poser gas-anim-js
     → rien de caché.
   • Tous navigateurs supportés (Chrome, Safari, Firefox) :
     gas-block-reveal.js utilise IntersectionObserver ; les blocs
     above-the-fold s'animent aussi au load (IO fire immédiatement).

   RÈGLE D'OR : aucun opacity:0 / transform / filter en dehors du
   bloc html.gas-anim-js + @media (prefers-reduced-motion: no-preference).
   ============================================================= */

/* ==================================================================
   Reveal au scroll — moteur JS (IntersectionObserver, tous navigateurs)

   DOUBLE GARDE — étanchéité absolue :
     1. @media (prefers-reduced-motion: no-preference)
        → rien de caché si l'utilisateur préfère la réduction de mouvement.
     2. html.gas-anim-js
        → posée par gas-block-reveal.js UNIQUEMENT si le JS a tourné ;
          sans JS, cette classe n'existe pas → aucun opacity:0 ne fuit.

   Déclenchement : gas-block-reveal.js ajoute .gas-anim--in-view (blocs)
   et .gas-rt-mark--in-view (marques) via IntersectionObserver.
   ================================================================== */

@media (prefers-reduced-motion: no-preference) {

    /* ----------------------------------------------------------------
       État initial commun à tous les blocs animés
       ---------------------------------------------------------------- */
    html.gas-anim-js .gas-anim {
        opacity: 0;
        transition: opacity var(--gas-duration-slow, 0.8s) var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1)),
                    transform var(--gas-duration-slow, 0.8s) var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1)),
                    filter var(--gas-duration-slow, 0.8s) var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1));
    }

    /* --- Fade : fondu + léger glissement vertical + flou doux -------- */
    html.gas-anim-js .gas-anim--fade {
        transform: translateY(15px);
        filter: blur(6px);
    }

    /* --- Slide : from-bottom (défaut) -------------------------------- */
    html.gas-anim-js .gas-anim--slide,
    html.gas-anim-js .gas-anim--slide.gas-anim--from-bottom {
        transform: translateY(35px);
    }

    html.gas-anim-js .gas-anim--slide.gas-anim--from-top {
        transform: translateY(-35px);
    }

    html.gas-anim-js .gas-anim--slide.gas-anim--from-right {
        transform: translateX(35px);
    }

    html.gas-anim-js .gas-anim--slide.gas-anim--from-left {
        transform: translateX(-35px);
    }

    /* --- Zoom -------------------------------------------------------- */
    html.gas-anim-js .gas-anim--zoom {
        transform: scale(0.9);
    }

    /* --- Blur : fondu + flou prononcé → net -------------------------- */
    html.gas-anim-js .gas-anim--blur {
        filter: blur(16px);
    }

    /* --- Rotate : rotation + glissement vertical --------------------- */
    html.gas-anim-js .gas-anim--rotate {
        transform: rotate(-5deg) translateY(15px);
    }

    /* --- État final (in-view) --- */
    html.gas-anim-js .gas-anim.gas-anim--in-view {
        opacity: 1;
        transform: none;
        filter: none;
    }

    /* ----------------------------------------------------------------
       Intensité "subtle" (Lot M étage 2 — presets nommés)
       Réduit l'amplitude du déplacement/flou et la durée de transition.
       Défaut historique = "marked" (pas de classe, amplitudes ci-dessus
       inchangées). Doit rester APRÈS les règles de type ci-dessus pour
       gagner en cascade (même spécificité, ordre de source).
       ---------------------------------------------------------------- */
    html.gas-anim-js .gas-anim--subtle {
        transition-duration: var(--gas-duration-base, 0.55s);
    }

    html.gas-anim-js .gas-anim--subtle.gas-anim--fade {
        transform: translateY(6px);
        filter: blur(3px);
    }

    html.gas-anim-js .gas-anim--subtle.gas-anim--slide,
    html.gas-anim-js .gas-anim--subtle.gas-anim--slide.gas-anim--from-bottom {
        transform: translateY(12.5px);
    }

    html.gas-anim-js .gas-anim--subtle.gas-anim--slide.gas-anim--from-top {
        transform: translateY(-12.5px);
    }

    html.gas-anim-js .gas-anim--subtle.gas-anim--slide.gas-anim--from-right {
        transform: translateX(12.5px);
    }

    html.gas-anim-js .gas-anim--subtle.gas-anim--slide.gas-anim--from-left {
        transform: translateX(-12.5px);
    }

    html.gas-anim-js .gas-anim--subtle.gas-anim--zoom {
        transform: scale(0.97);
    }

    html.gas-anim-js .gas-anim--subtle.gas-anim--blur {
        filter: blur(6px);
    }

    html.gas-anim-js .gas-anim--subtle.gas-anim--rotate {
        transform: rotate(-2deg) translateY(6px);
    }

    /* --- Stagger : enfants directs (transitionDelay posé par JS) ----- */
    html.gas-anim-js .gas-anim--stagger > * {
        opacity: 0;
        transition: opacity var(--gas-duration-slow, 0.8s) var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1)),
                    transform var(--gas-duration-slow, 0.8s) var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1)),
                    filter var(--gas-duration-slow, 0.8s) var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1));
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--slide > *,
    html.gas-anim-js .gas-anim--stagger.gas-anim--slide.gas-anim--from-bottom > * {
        transform: translateY(35px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--slide.gas-anim--from-top > * {
        transform: translateY(-35px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--slide.gas-anim--from-right > * {
        transform: translateX(35px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--slide.gas-anim--from-left > * {
        transform: translateX(-35px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--zoom > * {
        transform: scale(0.9);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--blur > * {
        filter: blur(16px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--fade > * {
        transform: translateY(15px);
        filter: blur(6px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--rotate > * {
        transform: rotate(-5deg) translateY(15px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--in-view > * {
        opacity: 1;
        transform: none;
        filter: none;
    }

    /* --- Stagger + intensité "subtle" : mêmes amplitudes réduites que ci-dessus --- */
    html.gas-anim-js .gas-anim--stagger.gas-anim--subtle > * {
        transition-duration: var(--gas-duration-base, 0.55s);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--subtle.gas-anim--slide > *,
    html.gas-anim-js .gas-anim--stagger.gas-anim--subtle.gas-anim--slide.gas-anim--from-bottom > * {
        transform: translateY(12.5px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--subtle.gas-anim--slide.gas-anim--from-top > * {
        transform: translateY(-12.5px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--subtle.gas-anim--slide.gas-anim--from-right > * {
        transform: translateX(12.5px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--subtle.gas-anim--slide.gas-anim--from-left > * {
        transform: translateX(-12.5px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--subtle.gas-anim--zoom > * {
        transform: scale(0.97);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--subtle.gas-anim--blur > * {
        filter: blur(6px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--subtle.gas-anim--fade > * {
        transform: translateY(6px);
        filter: blur(3px);
    }

    html.gas-anim-js .gas-anim--stagger.gas-anim--subtle.gas-anim--rotate > * {
        transform: rotate(-2deg) translateY(6px);
    }

    /* ----------------------------------------------------------------
       Marques de mot — reveal gauche → droite via transition
       Condition : sous un ancêtre [data-gas-anim] ET html.gas-anim-js.
       Sans JS ou sans bloc animé ancêtre : marques pleinement visibles.
       ---------------------------------------------------------------- */

    /* marker : background-size 0% → 100% */
    html.gas-anim-js [data-gas-anim] .gas-rt-mark--marker,
    html.gas-anim-js .gas-rt-mark--marker {
        --_mark-h: 55%;
        background-size: 0% var(--_mark-h);
        transition: background-size var(--gas-duration-base, 0.6s) var(--gas-ease-standard, cubic-bezier(0.22, 1, 0.36, 1));
    }

    html.gas-anim-js .gas-rt-mark--marker.gas-rt-mark--in-view {
        background-size: 100% var(--_mark-h);
    }

    /* underline : background-size 0% → 100% */
    html.gas-anim-js [data-gas-anim] .gas-rt-mark--underline,
    html.gas-anim-js .gas-rt-mark--underline {
        --_mark-h: 3px;
        background-size: 0% var(--_mark-h);
        transition: background-size var(--gas-duration-base, 0.6s) var(--gas-ease-standard, cubic-bezier(0.22, 1, 0.36, 1));
    }

    html.gas-anim-js .gas-rt-mark--underline.gas-rt-mark--in-view {
        background-size: 100% var(--_mark-h);
    }

    /* brush : clip-path sur ::after (wipe gauche → droite) */
    html.gas-anim-js [data-gas-anim] .gas-rt-mark--brush::after,
    html.gas-anim-js .gas-rt-mark--brush::after {
        clip-path: inset(0 100% 0 0);
        transition: clip-path var(--gas-duration-base, 0.6s) var(--gas-ease-standard, cubic-bezier(0.22, 1, 0.36, 1));
    }

    html.gas-anim-js .gas-rt-mark--brush.gas-rt-mark--in-view::after {
        clip-path: inset(0 0% 0 0);
    }

    /* ================================================================
       Animations ambiantes (boucle subtile, CSS pur, Astro-safe)
       Champ réservé `ambient` : { effect, loop }
       Déclenché par les classes gas-ambient + gas-ambient--{effect}
       posées sur le wrapper gas-block-anchor.

       Coexistence reveal + ambient :
         Le reveal (gas-anim) anime `transform` pour l'entrée au scroll.
         Pour éviter tout conflit de propriétés composites, les animations
         ambiantes utilisent les propriétés CSS individuelles `translate`,
         `rotate` et `scale` (CSS Transforms Level 2) qui se composent
         AVEC `transform` sans l'écraser. Résultat : reveal + ambient
         coexistent proprement sur le même wrapper.

       .gas-ambient--once : joue 3 itérations puis s'arrête proprement
         (animation-fill-mode: forwards + keyframes qui reviennent au
         repos, afin que le bloc reste à sa position initiale à la fin).
       ================================================================ */

    /* --- Keyframes --- */

    /* float : translation verticale douce */
    @keyframes gas-ambient-float {
        0%   { translate: 0 0; }
        50%  { translate: 0 -6px; }
        100% { translate: 0 0; }
    }

    /* sway : légère rotation alternée */
    @keyframes gas-ambient-sway {
        0%   { rotate: -1.2deg; }
        50%  { rotate: 1.2deg; }
        100% { rotate: -1.2deg; }
    }

    /* pulse : léger agrandissement */
    @keyframes gas-ambient-pulse {
        0%   { scale: 1; }
        50%  { scale: 1.025; }
        100% { scale: 1; }
    }

    /* breathe : légère variation d'opacité */
    @keyframes gas-ambient-breathe {
        0%   { opacity: 0.82; }
        50%  { opacity: 1; }
        100% { opacity: 0.82; }
    }

    /* drift : dérive horizontale douce */
    @keyframes gas-ambient-drift {
        0%   { translate: -5px 0; }
        50%  { translate: 5px 0; }
        100% { translate: -5px 0; }
    }

    /* --- Keyframes intensité "subtle" (Lot M étage 2) — amplitude ~moitié --- */

    @keyframes gas-ambient-float-subtle {
        0%   { translate: 0 0; }
        50%  { translate: 0 -3px; }
        100% { translate: 0 0; }
    }

    @keyframes gas-ambient-sway-subtle {
        0%   { rotate: -0.6deg; }
        50%  { rotate: 0.6deg; }
        100% { rotate: -0.6deg; }
    }

    @keyframes gas-ambient-pulse-subtle {
        0%   { scale: 1; }
        50%  { scale: 1.012; }
        100% { scale: 1; }
    }

    @keyframes gas-ambient-breathe-subtle {
        0%   { opacity: 0.92; }
        50%  { opacity: 1; }
        100% { opacity: 0.92; }
    }

    @keyframes gas-ambient-drift-subtle {
        0%   { translate: -2.5px 0; }
        50%  { translate: 2.5px 0; }
        100% { translate: -2.5px 0; }
    }

    /* --- Classes d'effet (boucle infinie par défaut) --- */

    .gas-ambient--float {
        animation: gas-ambient-float 4s var(--gas-ease-standard, ease-in-out) infinite;
    }

    .gas-ambient--sway {
        animation: gas-ambient-sway 5s var(--gas-ease-standard, ease-in-out) infinite;
    }

    .gas-ambient--pulse {
        animation: gas-ambient-pulse 3.5s var(--gas-ease-standard, ease-in-out) infinite;
    }

    .gas-ambient--breathe {
        animation: gas-ambient-breathe 4.5s var(--gas-ease-standard, ease-in-out) infinite;
    }

    .gas-ambient--drift {
        animation: gas-ambient-drift 6s var(--gas-ease-standard, ease-in-out) infinite;
    }

    /* --- Intensité "subtle" : mêmes durées, amplitude réduite (~moitié) ---
       Défaut historique = "marked" (pas de classe, règles ci-dessus inchangées).
       Doit rester APRÈS les règles ci-dessus pour gagner en cascade (même
       spécificité, ordre de source — cf. pattern gas-anim--subtle). */
    .gas-ambient--subtle.gas-ambient--float {
        animation-name: gas-ambient-float-subtle;
    }

    .gas-ambient--subtle.gas-ambient--sway {
        animation-name: gas-ambient-sway-subtle;
    }

    .gas-ambient--subtle.gas-ambient--pulse {
        animation-name: gas-ambient-pulse-subtle;
    }

    .gas-ambient--subtle.gas-ambient--breathe {
        animation-name: gas-ambient-breathe-subtle;
    }

    .gas-ambient--subtle.gas-ambient--drift {
        animation-name: gas-ambient-drift-subtle;
    }

    /* --- Modificateur --once : s'arrête après 3 itérations --- */
    /* Le keyframe revient toujours à l'état repos (0%=100%) :
       forwards maintient l'état final = position de repos. */
    .gas-ambient--once {
        animation-iteration-count: 3;
        animation-fill-mode: forwards;
    }

} /* end @media prefers-reduced-motion: no-preference */

/* ===== Scroll-motion (parallax / scrub) — Lot scroll_motion =====
 *
 * CSS-first via animation-timeline: view() (Chrome/Edge/Safari récents).
 * Fallback geometry : gas-block-scroll.js pose transform/opacity ou
 * --gas-scroll-y (section fond image, cible ::before).
 * prefers-reduced-motion : aucune règle active (bloc suivant = no-op).
 *
 * Contrat de classes (PHP + Astro) :
 *   .gas-scroll .gas-scroll--{parallax|rise|scale|fade} [.gas-scroll--subtle]
 *   .gas-scroll--target-bg  → section bg image (pseudo ::before)
 */
/*
 * SDA en filet no-JS uniquement (:not(.gas-scroll--js)).
 * Dès que gas-block-scroll.js charge, il pose .gas-scroll--js et pilote
 * transform / --gas-scroll-y (plus fiable que view() en pratique).
 */
@supports (animation-timeline: view()) {
    @media (prefers-reduced-motion: no-preference) {
        @keyframes gas-scroll-parallax-y {
            from { transform: translate3d(0, -18%, 0); }
            to   { transform: translate3d(0, 18%, 0); }
        }
        @keyframes gas-scroll-rise-y {
            from { transform: translate3d(0, 18%, 0); opacity: 0.75; }
            to   { transform: translate3d(0, 0, 0); opacity: 1; }
        }
        @keyframes gas-scroll-scale {
            from { transform: scale(1.12); }
            to   { transform: scale(1); }
        }
        @keyframes gas-scroll-fade {
            from { opacity: 0.25; }
            to   { opacity: 1; }
        }
        @keyframes gas-scroll-parallax-y-subtle {
            from { transform: translate3d(0, -10%, 0); }
            to   { transform: translate3d(0, 10%, 0); }
        }
        @keyframes gas-scroll-rise-y-subtle {
            from { transform: translate3d(0, 10%, 0); opacity: 0.88; }
            to   { transform: translate3d(0, 0, 0); opacity: 1; }
        }
        @keyframes gas-scroll-scale-subtle {
            from { transform: scale(1.06); }
            to   { transform: scale(1); }
        }
        @keyframes gas-scroll-fade-subtle {
            from { opacity: 0.5; }
            to   { opacity: 1; }
        }

        .gas-scroll--parallax:not(.gas-scroll--target-bg):not(.gas-scroll--js) {
            animation: gas-scroll-parallax-y linear both;
            animation-timeline: view();
            animation-range: entry 0% exit 100%;
            will-change: transform;
        }
        .gas-scroll--rise:not(.gas-scroll--js) {
            animation: gas-scroll-rise-y linear both;
            animation-timeline: view();
            animation-range: entry 0% cover 50%;
            will-change: transform, opacity;
        }
        .gas-scroll--scale:not(.gas-scroll--js) {
            animation: gas-scroll-scale linear both;
            animation-timeline: view();
            animation-range: entry 0% exit 100%;
            will-change: transform;
            transform-origin: center center;
        }
        .gas-scroll--fade:not(.gas-scroll--js) {
            animation: gas-scroll-fade linear both;
            animation-timeline: view();
            animation-range: entry 0% cover 40%;
        }

        .gas-scroll--subtle.gas-scroll--parallax:not(.gas-scroll--target-bg):not(.gas-scroll--js) {
            animation-name: gas-scroll-parallax-y-subtle;
        }
        .gas-scroll--subtle.gas-scroll--rise:not(.gas-scroll--js) {
            animation-name: gas-scroll-rise-y-subtle;
        }
        .gas-scroll--subtle.gas-scroll--scale:not(.gas-scroll--js) {
            animation-name: gas-scroll-scale-subtle;
        }
        .gas-scroll--subtle.gas-scroll--fade:not(.gas-scroll--js) {
            animation-name: gas-scroll-fade-subtle;
        }

        /* sticky_story media_depth — SDA no-JS ; JS n'y touche pas (pas data-gas-scroll) */
        .gas-block-sticky-story--depth-subtle .gas-block-sticky-story__layers,
        .gas-block-sticky-story--depth-marked .gas-block-sticky-story__layers {
            will-change: transform;
            animation: gas-scroll-scale linear both;
            animation-timeline: view();
            animation-range: entry 0% exit 100%;
            transform-origin: center center;
        }
        .gas-block-sticky-story--depth-subtle .gas-block-sticky-story__layers {
            animation-name: gas-scroll-scale-subtle;
        }
    }
}

/* JS path : will-change + origin pour scale */
.gas-scroll--js.gas-scroll--scale {
    transform-origin: center center;
    will-change: transform;
}
.gas-scroll--js.gas-scroll--parallax:not(.gas-scroll--target-bg),
.gas-scroll--js.gas-scroll--rise {
    will-change: transform;
}

/*
 * target-bg : fond image plus grand + translate piloté par JS (--gas-scroll-y).
 * Bleed large pour que le déplacement reste visible sans bords vides.
 */
.gas-scroll--target-bg .gas-block-section--bg-image {
    overflow: hidden;
}
.gas-scroll--target-bg .gas-block-section--bg-image::before {
    inset: -22% 0;
    height: 144%;
    top: -22%;
    bottom: auto;
    transform: translate3d(0, var(--gas-scroll-y, 0px), 0);
    will-change: transform;
}
.gas-scroll--target-bg.gas-scroll--subtle .gas-block-section--bg-image::before {
    inset: -16% 0;
    height: 132%;
    top: -16%;
}
@media (prefers-reduced-motion: reduce) {
    .gas-scroll--target-bg .gas-block-section--bg-image::before {
        transform: none;
        will-change: auto;
    }
}

/* sticky_story depth : overflow pour contenir le scale */
.gas-block-sticky-story--depth-subtle .gas-block-sticky-story__media,
.gas-block-sticky-story--depth-marked .gas-block-sticky-story__media {
    overflow: hidden;
}

@media (max-width: 768px) and (prefers-reduced-motion: no-preference) {
    /* Mobile : amplitudes déjà « subtle » via keyframes ; forcer will-change off si trop. */
    .gas-scroll--parallax:not(.gas-scroll--target-bg),
    .gas-scroll--rise,
    .gas-scroll--scale {
        will-change: auto;
    }
}

/* ===== Accents décoratifs (gas-deco) ===== */

.gas-has-deco {
    position: relative;
}

.gas-deco {
    position: absolute;
    pointer-events: none;
    color: var(--gas-deco-color, var(--gas-accent, currentColor));
    line-height: 0;
    z-index: 0;
    display: block;
}

.gas-deco > svg {
    width: 100%;
    height: 100%;
    display: block;
}

.gas-deco--pos-tl { top: -15px; left: -15px; }
.gas-deco--pos-tr { top: -15px; right: -15px; }
.gas-deco--pos-bl { bottom: -15px; left: -15px; }
.gas-deco--pos-br { bottom: -15px; right: -15px; }
.gas-deco--pos-cl { top: 50%; left: -15px; transform: translateY(-50%); }
.gas-deco--pos-cr { top: 50%; right: -15px; transform: translateY(-50%); }
.gas-deco--pos-tc { top: -15px; left: 50%; transform: translateX(-50%); }
.gas-deco--pos-bc { bottom: -15px; left: 50%; transform: translateX(-50%); }

.gas-deco--size-s  { width: 25px;  height: 25px; }
.gas-deco--size-m  { width: 40px;    height: 40px; }
.gas-deco--size-l  { width: 60px;    height: 60px; }
.gas-deco--size-xl { width: 90px;    height: 90px; }

@media (prefers-reduced-motion: no-preference) {
    @keyframes gas-deco-rotate {
        from { rotate: 0deg; }
        to   { rotate: 360deg; }
    }

    @keyframes gas-deco-float {
        0%, 100% { translate: 0 0; }
        50%       { translate: 0 -5px; }
    }

    @keyframes gas-deco-pulse {
        0%, 100% { scale: 1; }
        50%       { scale: 1.12; }
    }

    .gas-deco--anim-rotate {
        animation: gas-deco-rotate 20s linear infinite;
    }

    .gas-deco--anim-float {
        animation: gas-deco-float 4s ease-in-out infinite;
    }

    .gas-deco--anim-pulse {
        animation: gas-deco-pulse 3s ease-in-out infinite;
    }
}

/* ===== Masque de forme d'image (gas-media-shape) ===== */
.gas-media-shape {
    overflow: hidden;
}

.gas-media-shape img,
img.gas-media-shape {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.gas-media-shape--rounded {
    border-radius: clamp(10px, 3vw, 25px);
}

.gas-media-shape--circle {
    border-radius: 50%;
    aspect-ratio: 1 / 1;
}

.gas-media-shape--oval {
    border-radius: 50%;
    aspect-ratio: 4 / 5;
}

.gas-media-shape--blob {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cpath d='M44.7,-76.4C58.8,-69.2,71.8,-59.1,79.6,-45.8C87.4,-32.5,90,-16.3,88.5,-1C87,14.3,81.3,28.6,73.5,41.5C65.7,54.4,55.8,65.9,43.5,73.8C31.2,81.7,15.6,86,0.4,85.4C-14.8,84.8,-29.6,79.3,-42.6,71.3C-55.7,63.3,-67,52.8,-74.1,39.8C-81.2,26.8,-84.2,11.4,-83.1,-3.5C-82,-18.4,-76.9,-32.9,-69.1,-45.9C-61.3,-58.9,-50.8,-70.4,-38,-76.2C-25.2,-82,-12.6,-82,1.2,-84C15,-86,30.5,-83.6,44.7,-76.4Z' transform='translate(100 100)'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cpath d='M44.7,-76.4C58.8,-69.2,71.8,-59.1,79.6,-45.8C87.4,-32.5,90,-16.3,88.5,-1C87,14.3,81.3,28.6,73.5,41.5C65.7,54.4,55.8,65.9,43.5,73.8C31.2,81.7,15.6,86,0.4,85.4C-14.8,84.8,-29.6,79.3,-42.6,71.3C-55.7,63.3,-67,52.8,-74.1,39.8C-81.2,26.8,-84.2,11.4,-83.1,-3.5C-82,-18.4,-76.9,-32.9,-69.1,-45.9C-61.3,-58.9,-50.8,-70.4,-38,-76.2C-25.2,-82,-12.6,-82,1.2,-84C15,-86,30.5,-83.6,44.7,-76.4Z' transform='translate(100 100)'/%3E%3C/svg%3E");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

/* ===== Blocs système site (footer/header documents) ===== */
.gas-block-site-branding,
.gas-block-site-menu,
.gas-block-link-list {
    color: var(--gas-color-text, inherit);
}/* @gas:block site_menu start */


.gas-block-site-menu.gas-responsive-surface--menu {
    container-type: inline-size;
    container-name: gas-block-menu-responsive;
}

@container gas-block-menu-responsive (min-width: 480px) {
    .gas-block-site-menu.gas-responsive-surface--preset-adaptive_links > .gas-block-site-menu__list {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
        align-items: start;
    }
}
/* @gas:block site_menu end *//* @gas:block site_account start */


.gas-block-site-account {
    color: var(--gas-color-text, inherit);
}

.gas-block-site-account__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--gas-space-s, 12px);
    margin: 0;
    padding: 0;
    list-style: none;
}

.gas-block-site-account--align-right .gas-block-site-account__list {
    justify-content: flex-end;
}

.gas-block-site-account__link {
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-2xs, 4px);
    color: inherit;
    text-decoration: none;
}

.gas-block-site-account__link:hover {
    color: var(--gas-color-primary, currentColor);
}

.gas-block-site-account__item.is-emphasis .gas-block-site-account__link {
    font-weight: 600;
}

.gas-block-site-account__item.is-current .gas-block-site-account__link {
    color: var(--gas-color-primary, currentColor);
}
/* @gas:block site_account end *//* @gas:block site_application start */


.gas-block-site-application__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--gas-space-s, 12px);
    margin: 0;
    padding: 0;
    list-style: none;
}

.gas-block-site-application--align-right .gas-block-site-application__list {
    justify-content: flex-end;
}

.gas-block-site-application__link {
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-2xs, 4px);
    color: inherit;
    text-decoration: none;
}

.gas-block-site-application__link:hover,
.gas-block-site-application__item.is-current .gas-block-site-application__link {
    color: var(--gas-color-primary, currentColor);
}
/* @gas:block site_application end *//* @gas:block site_language_switcher start */


.gas-block-site-language-switcher__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--gas-space-2xs, 6px);
    margin: 0;
    padding: 0;
    list-style: none;
}

.gas-block-site-language-switcher--align-right .gas-block-site-language-switcher__list {
    justify-content: flex-end;
}

.gas-block-site-language-switcher__link {
    display: inline-block;
    color: inherit;
    text-decoration: none;
    text-transform: uppercase;
    font-size: var(--gas-text-s, 13px);
}

.gas-block-site-language-switcher__link:hover {
    color: var(--gas-color-primary, currentColor);
}

.gas-block-site-language-switcher__item.is-current .gas-block-site-language-switcher__link {
    font-weight: 600;
    color: var(--gas-color-primary, currentColor);
}
/* @gas:block site_language_switcher end *//* @gas:block site_theme_toggle start */


.gas-block-site-theme-toggle {
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-3xs, 2px);
}

.gas-block-site-theme-toggle--align-right {
    margin-left: auto;
}

.gas-block-site-theme-toggle__choice {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--gas-space-3xs, 4px);
    background: none;
    border: none;
    color: inherit;
    cursor: pointer;
    border-radius: var(--gas-radius-s, 6px);
    opacity: 0.6;
}

.gas-block-site-theme-toggle__choice:hover,
.gas-block-site-theme-toggle__choice[aria-pressed="true"] {
    opacity: 1;
    color: var(--gas-color-primary, currentColor);
}
/* @gas:block site_theme_toggle end *//* @gas:block site_cart_badge start */


.gas-block-site-cart-badge,
.gas-block-site-notification-badge {
    /* Ces badges ont une largeur intrinsèque calculée depuis l’icône et le
       libellé. Le containment global des racines de bloc annule cette largeur
       lorsqu’ils sont posés directement dans une section (mesuré sur APH :
       lien 0×20 px, contenu visible uniquement par overflow). */
    container-type: normal;
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-2xs, 4px);
    color: inherit;
    text-decoration: none;
}

.gas-block-site-cart-badge:hover,
.gas-block-site-notification-badge:hover {
    color: var(--gas-color-primary, currentColor);
}

/* Compteur AVEC libellé : le positionnement absolu est conçu pour l'icône seule
   (pastille sur le coin). Dès que `show_label` est actif, il se superpose au mot
   — vu sur le panier du header d'aph, « 1 » par-dessus « Panier ». On le remet
   alors dans le flux, APRÈS le libellé (il précède dans le DOM), ce qui donne
   « 🛒 Panier ① ». */
.gas-block-site-cart-badge:has(.gas-block-site-cart-badge__label) .gas-block-site-cart-badge__count,
.gas-block-site-notification-badge:has(.gas-block-site-notification-badge__label) .gas-block-site-notification-badge__count {
    position: static;
    order: 1;
    margin-inline-start: var(--gas-space-2xs, 4px);
}

.gas-block-site-cart-badge__count,
.gas-block-site-notification-badge__count {
    position: absolute;
    top: -6px;
    right: -8px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    color: var(--gas-color-on-primary, #fff);
    background: var(--gas-color-primary, #333);
    border-radius: 999px;
}
/* @gas:block site_cart_badge end *//* @gas:block site_branding start */


.gas-block-site-branding__link {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--gas-space-2xs, 2.5px);
    color: inherit;
    text-decoration: none;
}

.gas-block-site-branding--inline .gas-block-site-branding__link {
    flex-direction: row;
    align-items: center;
    gap: var(--gas-space-s, 7.5px);
}

.gas-block-site-branding.is-align-center .gas-block-site-branding__link {
    align-items: center;
    text-align: center;
}

.gas-block-site-branding__logo img,
.gas-block-site-branding .custom-logo {
    display: block;
    max-height: var(--gas-site-branding-logo-max-height, 54px);
    max-width: var(--gas-site-branding-logo-max-width, none);
    width: auto;
}

.gas-block-site-branding__name {
    font-size: var(--gas-text-l, 11.25px);
    line-height: 1.2;
}

.gas-block-site-branding__tagline {
    color: var(--gas-color-text-muted, currentColor);
    font-size: var(--gas-text-s, 8.75px);
}
/* @gas:block site_branding end */

.gas-block-site-menu__title,
.gas-block-link-list__title {
    font-size: var(--gas-text-m, 10px);
    line-height: 1.3;
    margin: 0 0 var(--gas-space-xs, 5px);
}

.gas-block-site-menu__list,
.gas-block-site-menu__sublist,
.gas-block-link-list__items {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-2xs, 2.5px);
    list-style: none;
    margin: 0;
    padding: 0;
}

.gas-block-site-menu--inline .gas-block-site-menu__list,
.gas-block-link-list--inline .gas-block-link-list__items,
.gas-block-link-list--social .gas-block-link-list__items {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: var(--gas-space-xs, 5px) var(--gas-space-m, 10px);
}/* @gas:block site_menu start */


.gas-block-site-menu--columns .gas-block-site-menu__list {
    display: grid;
    gap: var(--gas-space-xs, 5px) var(--gas-space-l, 15px);
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}

.gas-block-site-menu__sublist {
    margin-top: var(--gas-space-2xs, 2.5px);
    padding-left: var(--gas-space-s, 7.5px);
}
/* @gas:block site_menu end */

.gas-block-site-menu__link,
.gas-block-link-list__link {
    align-items: center;
    color: inherit;
    display: inline-flex;
    gap: var(--gas-space-2xs, 2.5px);
    text-decoration: none;
}/* @gas:block link_list start */


.gas-block-link-list__link--accent,
.gas-block-link-list__link--primary {
    border-radius: var(--gas-radius-control, 999px);
    font-weight: var(--gas-weight-bold, 700);
    min-height: 32px;
    padding: 0 var(--gas-space-m, 10px);
    text-decoration: none;
}

.gas-block-link-list__link--accent {
    background: var(--gas-color-accent, var(--gas-accent, #c56f38));
    color: var(--gas-color-on-accent, var(--gas-text-color-inverse, #fff));
}

.gas-block-link-list__link--primary {
    background: var(--gas-color-primary, var(--gas-primary, #0f766e));
    color: var(--gas-color-on-primary, var(--gas-text-color-inverse, #fff));
}
/* @gas:block link_list end */

.gas-block-site-menu__link:hover,
.gas-block-link-list__link:hover {
    color: var(--gas-color-primary, currentColor);
    text-decoration: underline;
    text-underline-offset: 0.18em;
}/* @gas:block link_list start */


.gas-block-link-list__link--accent:hover,
.gas-block-link-list__link--primary:hover {
    color: var(--gas-text-color-inverse, #fff);
    text-decoration: none;
}

.gas-block-link-list__link--accent:hover {
    background: var(--gas-accent-dark, var(--gas-color-accent, #a65c2d));
}

.gas-block-link-list__link--primary:hover {
    background: var(--gas-primary-dark, var(--gas-color-primary, #0b5d57));
}

.gas-block-link-list--social .gas-block-link-list__link {
    border: 1px solid var(--gas-color-border, currentColor);
    border-radius: var(--gas-radius-control, 999px);
    min-height: 22.5px;
    padding: 0 var(--gas-space-s, 7.5px);
}

.gas-block-link-list__icon {
    color: var(--gas-color-text-muted, currentColor);
    font-size: var(--gas-text-s, 8.75px);
}
/* @gas:block link_list end *//* @gas:block sidebar_subnav start */



/* =============================================================
   Bloc sidebar_subnav — sous-navigation latérale de section
   Liste verticale sobre : filets fins, item actif sur fond
   surface-alt. Conçu pour une colonne étroite de `row`.
   ============================================================= */
.gas-block-sidebar-subnav {
    container-type: inline-size;
    container-name: sidebar_subnav;
    color: var(--gas-color-text, inherit);
}
.gas-block-sidebar-subnav__title {
    margin: 0 0 var(--gas-space-s, 7.5px);
    font-size: var(--gas-text-xs, 7.5px);
    font-weight: var(--gas-weight-bold, 700);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gas-color-text-muted, var(--gas-neutral-600));
}
.gas-block-sidebar-subnav__list {
    margin: 0;
    padding: 0;
    list-style: none;
    border-block-start: 1px solid var(--gas-border-color, var(--gas-neutral-300));
}
.gas-block-sidebar-subnav__item {
    border-block-end: 1px solid var(--gas-border-color, var(--gas-neutral-300));
}
.gas-block-sidebar-subnav__link {
    display: block;
    padding: var(--gas-space-s, 7.5px) var(--gas-space-m, 10px);
    font-size: var(--gas-text-s, 8.75px);
    line-height: 1.4;
    color: var(--gas-color-text, inherit);
    text-decoration: none;
}
a.gas-block-sidebar-subnav__link:hover,
a.gas-block-sidebar-subnav__link:focus-visible {
    background: var(--gas-bg-surface-alt, var(--gas-neutral-50));
}
.gas-block-sidebar-subnav__item--active .gas-block-sidebar-subnav__link {
    background: var(--gas-bg-surface-alt, var(--gas-neutral-50));
    font-weight: var(--gas-weight-semi, 600);
}
/* @gas:block sidebar_subnav end *//* @gas:block specialty_bar start */



/* =============================================================
   Bloc specialty_bar — ruban horizontal de spécialités
   Termes discrets séparés par « • » (li + li::before), trois
   fonds (transparent / surface / primary), wrap propre mobile.
   ============================================================= */
.gas-block-specialty-bar {
    container-type: inline-size;
    container-name: specialty_bar;
    padding-block: var(--gas-space-m, 10px);
    padding-inline: var(--gas-space-m, 10px);
}
.gas-block-specialty-bar--tone-surface {
    background: var(--gas-bg-surface-alt, var(--gas-neutral-50));
}
.gas-block-specialty-bar--tone-primary {
    background: var(--gas-primary, var(--gas-neutral-900));
    color: var(--gas-white, #fff);
}
.gas-block-specialty-bar__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    row-gap: var(--gas-space-2xs, 2.5px);
    max-width: var(--gas-container, var(--gas-container-default, 720px));
    margin: 0 auto;
    padding: 0;
    list-style: none;
}
.gas-block-specialty-bar--align-left .gas-block-specialty-bar__list {
    justify-content: flex-start;
}
.gas-block-specialty-bar__item {
    display: inline-flex;
    align-items: baseline;
    font-size: var(--gas-text-s, 8.75px);
    letter-spacing: 0.02em;
    color: var(--gas-color-text-muted, var(--gas-neutral-600));
}
.gas-block-specialty-bar--tone-primary .gas-block-specialty-bar__item {
    color: inherit;
}
.gas-block-specialty-bar__item + .gas-block-specialty-bar__item::before {
    content: "•";
    margin-inline: var(--gas-space-s, 7.5px);
    opacity: 0.6;
}
.gas-block-specialty-bar__term {
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
}
a.gas-block-specialty-bar__term:hover,
a.gas-block-specialty-bar__term:focus-visible {
    text-decoration: underline;
    text-underline-offset: 0.18em;
}
/* @gas:block specialty_bar end *//* @gas:block tag_columns start */


/* ==========================================================================
   tag_columns — colonnes de tags-pills (navigation éditoriale statique)
   ========================================================================== */
.gas-block-tag-columns {
    padding-block: var(--gas-space-2xl, 48px);
}
.gas-block-tag-columns__inner {
    max-width: var(--gas-container, var(--gas-site-max-width, 1280px));
    margin-inline: auto;
    padding-inline: var(--gas-space-l, 15px);
}
.gas-block-tag-columns.is-align-center .gas-block-tag-columns__header { text-align: center; }
.gas-block-tag-columns.is-align-center .gas-block-tag-columns__tags { justify-content: center; }

.gas-block-tag-columns__header { margin-bottom: var(--gas-space-l, 15px); }
.gas-block-tag-columns__title {
    font-size: var(--gas-text-2xl, 27px);
    margin: 0 0 var(--gas-space-xs, 5px);
}
.gas-block-tag-columns__subtitle {
    margin: 0;
    color: var(--gas-text-muted, #6b7280);
}

.gas-block-tag-columns__columns {
    display: grid;
    grid-template-columns: repeat(var(--gas-tag-columns-cols, 3), minmax(0, 1fr));
    gap: var(--gas-space-l, 15px) var(--gas-space-xl, 24px);
}
.gas-block-tag-columns--cols-1 { --gas-tag-columns-cols: 1; }
.gas-block-tag-columns--cols-2 { --gas-tag-columns-cols: 2; }
.gas-block-tag-columns--cols-3 { --gas-tag-columns-cols: 3; }
.gas-block-tag-columns--cols-4 { --gas-tag-columns-cols: 4; }

.gas-block-tag-columns__col-title {
    font-size: var(--gas-text-m, 16px);
    font-weight: 600;
    margin: 0 0 var(--gas-space-s, 7.5px);
}
.gas-block-tag-columns__tags {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-xs, 5px);
}
.gas-block-tag-columns__tag {
    display: inline-flex;
    align-items: center;
    padding: var(--gas-space-2xs, 3px) var(--gas-space-m, 10px);
    background: var(--gas-bg-surface-alt, #f6f6f6);
    border: 1px solid var(--gas-color-border, #e0e0e0);
    border-radius: var(--gas-radius-full, 999px);
    font-size: var(--gas-text-s, 13px);
    color: var(--gas-color-text, #111827);
    text-decoration: none;
}
a.gas-block-tag-columns__tag:hover,
a.gas-block-tag-columns__tag:focus-visible {
    border-color: var(--gas-color-primary, #2563eb);
    color: var(--gas-color-primary, #2563eb);
}

@media (max-width: 768px) {
    .gas-block-tag-columns__columns { grid-template-columns: 1fr; }
}
/* @gas:block tag_columns end *//* @gas:block button start */


.gas-block-button {
    display: flex;
    margin-block: var(--gas-space-s, 8px);
}

/* Dans un `group`, c'est le `gap` du groupe qui règle l'espacement — la marge
   propre du bouton s'y ajoute et double l'écart (20px pour un gap demandé à 4px,
   mesuré sur le panneau « Devenir membre » d'aph). Le groupe est un conteneur de
   flux : ses enfants n'apportent pas leur propre rythme vertical. */
.gas-block-group__item > .gas-block-anchor > .gas-block-button,
.gas-block-group__item > .gas-block-button {
    margin-block: 0;
}
.gas-block-button--align-left { justify-content: flex-start; }
.gas-block-button--align-center { justify-content: center; }
.gas-block-button--align-right { justify-content: flex-end; }
.gas-block-button__icon {
    display: inline-flex;
    align-items: center;
    line-height: 0;
}
.gas-block-button__icon svg {
    width: 1em;
    height: 1em;
}
/* @gas:block button end *//* @gas:block icon start */


.gas-block-icon {
    display: flex;
    margin-block: var(--gas-space-s, 8px);
}
.gas-block-icon--align-left { justify-content: flex-start; }
.gas-block-icon--align-center { justify-content: center; }
.gas-block-icon--align-right { justify-content: flex-end; }
.gas-block-icon__inner {
    display: inline-flex;
    line-height: 0;
}
.gas-block-icon--size-small .gas-block-icon__inner svg { width: var(--gas-space-l, 24px); height: var(--gas-space-l, 24px); }
.gas-block-icon--size-medium .gas-block-icon__inner svg { width: var(--gas-space-xl, 32px); height: var(--gas-space-xl, 32px); }
.gas-block-icon--size-large .gas-block-icon__inner svg { width: var(--gas-space-2xl, 48px); height: var(--gas-space-2xl, 48px); }
.gas-block-icon--size-xlarge .gas-block-icon__inner svg { width: var(--gas-space-3xl, 64px); height: var(--gas-space-3xl, 64px); }
.gas-block-icon--color-default .gas-block-icon__inner { color: var(--gas-color-text, #111827); }
.gas-block-icon--color-primary .gas-block-icon__inner { color: var(--gas-color-primary, #2563eb); }
.gas-block-icon--color-secondary .gas-block-icon__inner { color: var(--gas-color-secondary, #6b7280); }
.gas-block-icon--color-accent .gas-block-icon__inner { color: var(--gas-color-accent, #d946ef); }
.gas-block-icon--color-success .gas-block-icon__inner { color: var(--gas-color-success, #16a34a); }
.gas-block-icon--color-warning .gas-block-icon__inner { color: var(--gas-color-warning, #f59e0b); }
.gas-block-icon--color-danger .gas-block-icon__inner { color: var(--gas-color-danger, #dc2626); }
.gas-block-icon--color-info .gas-block-icon__inner { color: var(--gas-color-info, #0ea5e9); }
.gas-block-icon--color-muted .gas-block-icon__inner { color: var(--gas-color-text-muted, #6b7280); }
/* @gas:block icon end *//* @gas:block spacer start */


.gas-block-spacer { width: 100%; }
.gas-block-spacer--size-xs  { height: var(--gas-space-xs, 4px); }
.gas-block-spacer--size-s   { height: var(--gas-space-s, 8px); }
.gas-block-spacer--size-m   { height: var(--gas-space-m, 16px); }
.gas-block-spacer--size-l   { height: var(--gas-space-l, 24px); }
.gas-block-spacer--size-xl  { height: var(--gas-space-xl, 32px); }
.gas-block-spacer--size-2xl { height: var(--gas-space-2xl, 48px); }
.gas-block-spacer--size-3xl { height: var(--gas-space-3xl, 64px); }
/* @gas:block spacer end *//* @gas:block divider start */


.gas-block-divider {
    width: 100%;
    border: none;
    border-top-style: solid;
    background: none;
}
.gas-block-divider--style-solid  { border-top-style: solid; }
.gas-block-divider--style-dashed { border-top-style: dashed; }
.gas-block-divider--style-dotted { border-top-style: dotted; }
.gas-block-divider--width-thin   { border-top-width: 1px; }
.gas-block-divider--width-medium { border-top-width: 2px; }
.gas-block-divider--width-thick  { border-top-width: 3px; }
.gas-block-divider--spacing-s { margin-block: var(--gas-space-s, 8px); }
.gas-block-divider--spacing-m { margin-block: var(--gas-space-m, 16px); }
.gas-block-divider--spacing-l { margin-block: var(--gas-space-l, 24px); }
.gas-block-divider--color-default { border-top-color: var(--gas-color-border-default, #e0e0e0); }
.gas-block-divider--color-muted   { border-top-color: var(--gas-color-border-light, #f1f1f1); }
.gas-block-divider--color-primary { border-top-color: var(--gas-color-primary, #2563eb); }
.gas-block-divider--color-accent  { border-top-color: var(--gas-color-accent, #d946ef); }
/* @gas:block divider end *//* @gas:block stat start */


.gas-block-stat {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-2xs, 3px);
    margin-block: var(--gas-space-s, 8px);
}
.gas-block-stat--align-left   { align-items: flex-start; text-align: left; }
.gas-block-stat--align-center { align-items: center; text-align: center; }
.gas-block-stat--align-right  { align-items: flex-end; text-align: right; }
.gas-block-stat__value {
    font-weight: var(--gas-weight-bold, 700);
    color: var(--gas-color-primary, #2563eb);
    line-height: 1.1;
}
.gas-block-stat--size-medium .gas-block-stat__value { font-size: var(--gas-text-l, 24px); }
.gas-block-stat--size-large .gas-block-stat__value  { font-size: var(--gas-text-xl, 32px); }
.gas-block-stat__prefix,
.gas-block-stat__suffix {
    font-size: 0.5em;
    font-weight: var(--gas-weight-medium, 500);
}
.gas-block-stat__label {
    font-size: var(--gas-text-s, 14px);
    color: var(--gas-color-text-muted, #6b7280);
}
/* @gas:block stat end *//* @gas:block badge start */


.gas-block-badge {
    display: inline-flex;
    align-items: center;
    border-radius: var(--gas-radius-full, 9999px);
    font-weight: var(--gas-weight-medium, 500);
    line-height: 1.4;
    white-space: nowrap;
}
.gas-block-badge--size-small {
    padding: var(--gas-space-3xs, 2px) var(--gas-space-s, 8px);
    font-size: var(--gas-text-xs, 12px);
}
.gas-block-badge--size-medium {
    padding: var(--gas-space-2xs, 3px) var(--gas-space-m, 16px);
    font-size: var(--gas-text-s, 14px);
}
.gas-block-badge--tone-neutral {
    background: var(--gas-color-surface-alt, #f3f4f6);
    color: var(--gas-color-text, #111827);
}
.gas-block-badge--tone-primary {
    background: var(--gas-color-intent-primary-soft, #dbeafe);
    color: var(--gas-color-primary, #2563eb);
}
.gas-block-badge--tone-success {
    background: var(--gas-color-success-bg, #dcfce7);
    color: var(--gas-color-success-text, #15803d);
}
.gas-block-badge--tone-warning {
    background: var(--gas-color-warning-bg, #fef3c7);
    color: var(--gas-color-warning-text, #b45309);
}
.gas-block-badge--tone-danger {
    background: var(--gas-color-danger-bg, #fee2e2);
    color: var(--gas-color-danger-text, #b91c1c);
}
.gas-block-badge--tone-info {
    background: var(--gas-color-info-bg, #e0f2fe);
    color: var(--gas-color-info-text, #0369a1);
}
/* @gas:block badge end *//* @gas:block icon_list start */


.gas-block-icon-list {
    list-style: none;
    margin: var(--gas-space-s, 8px) 0;
    padding: 0;
    display: flex;
    gap: var(--gas-space-s, 8px);
}
.gas-block-icon-list--layout-stacked {
    flex-direction: column;
}
.gas-block-icon-list--layout-inline {
    flex-direction: row;
    flex-wrap: wrap;
}
.gas-block-icon-list--layout-columns-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gas-space-s, 8px) var(--gas-space-m, 16px);
}
.gas-block-icon-list__item {
    display: flex;
    align-items: flex-start;
    gap: var(--gas-space-xs, 4px);
}
.gas-block-icon-list__icon {
    display: inline-flex;
    line-height: 0;
    flex-shrink: 0;
}
.gas-block-icon-list--icon-size-small .gas-block-icon-list__icon svg { width: 1em; height: 1em; }
.gas-block-icon-list--icon-size-medium .gas-block-icon-list__icon svg { width: 1.25em; height: 1.25em; }
.gas-block-icon-list--icon-color-default .gas-block-icon-list__icon { color: var(--gas-color-text, #111827); }
.gas-block-icon-list--icon-color-primary .gas-block-icon-list__icon { color: var(--gas-color-primary, #2563eb); }
.gas-block-icon-list--icon-color-success .gas-block-icon-list__icon { color: var(--gas-color-success, #16a34a); }
.gas-block-icon-list--icon-color-accent .gas-block-icon-list__icon { color: var(--gas-color-accent, #d946ef); }
.gas-block-icon-list__text {
    font-size: var(--gas-text-s, 14px);
    color: var(--gas-color-text, #111827);
}

@media (max-width: 640px) {
    .gas-block-icon-list--layout-columns-2 {
        grid-template-columns: 1fr;
    }
}
/* @gas:block icon_list end *//* @gas:block card_archive start */


/* card_archive — facette de plage (range) min/max (C1). */
.gas-block-card-archive__facets--range {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--gas-space-2, 8px);
}
.gas-block-card-archive__range {
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-2, 6px);
}
.gas-block-card-archive__range-input {
    width: 6.5em;
    padding: 4px 8px;
    border: 1px solid var(--gas-color-border, #cbd5e1);
    border-radius: var(--gas-radius-sm, 4px);
    font: inherit;
}
.gas-block-card-archive__range-sep {
    color: var(--gas-color-text-muted, #64748b);
}
/* card_archive — facette de proximité géographique (geo) lat/lng/rayon (C4). */
.gas-block-card-archive__facets--geo {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--gas-space-2, 8px);
}
.gas-block-card-archive__geo {
    display: inline-flex;
    align-items: center;
    gap: var(--gas-space-2, 6px);
    flex-wrap: wrap;
}
.gas-block-card-archive__geo-input {
    width: 7em;
    padding: 4px 8px;
    border: 1px solid var(--gas-color-border, #cbd5e1);
    border-radius: var(--gas-radius-sm, 4px);
    font: inherit;
}
.gas-block-card-archive__geo-input--km {
    width: 5.5em;
}
/* card_archive — carte interactive (show_map), pont GasGeoMap/useEntityGeoSource.
   Toujours en complément de la grille, jamais un remplacement. */
.gas-block-card-archive__map-section {
    margin-block-end: var(--gas-block-gap-l, 24px);
}
.gas-block-card-archive__map {
    position: relative;
    height: 420px;
    border-radius: var(--gas-radius-l, 12px);
    overflow: hidden;
}
.gas-block-card-archive__map .gas-geo-map,
.gas-block-card-archive__map .maplibregl-map {
    height: 100%;
    width: 100%;
}
.gas-block-card-archive__map-message {
    padding: var(--gas-space-4, 16px);
    color: var(--gas-color-text-muted, #64748b);
    text-align: center;
}
/* @gas:block card_archive end *//* @gas:block group start */

.gas-block-group {
    display: flex;
}
.gas-block-group--row { flex-direction: row; }
.gas-block-group--column { flex-direction: column; }
.gas-block-group--wrap { flex-wrap: wrap; }
.gas-block-group--nowrap { flex-wrap: nowrap; }
.gas-block-group--align-start { align-items: flex-start; }
.gas-block-group--align-center { align-items: center; }
.gas-block-group--align-end { align-items: flex-end; }
.gas-block-group--align-stretch { align-items: stretch; }
.gas-block-group--justify-start { justify-content: flex-start; }
.gas-block-group--justify-center { justify-content: center; }
.gas-block-group--justify-end { justify-content: flex-end; }
.gas-block-group--justify-between { justify-content: space-between; }
.gas-block-group--gap-none { gap: 0; }
.gas-block-group--gap-xs { gap: var(--gas-space-xs, 4px); }
.gas-block-group--gap-sm { gap: var(--gas-space-s, 8px); }
.gas-block-group--gap-md { gap: var(--gas-space-m, 16px); }
.gas-block-group--gap-lg { gap: var(--gas-space-l, 24px); }
.gas-block-group__item {
    min-width: 0;
}
/* La règle globale `[data-block-type] { container-type: inline-size }` donne aux
   blocs une taille intrinsèque NULLE (size containment) : dans le contexte
   shrink-to-fit d'une rangée flex, chaque atome s'écraserait à 0px. Dans un
   group, la largeur vient du contenu — on retire donc le containment (les
   @container queries n'ont pas de sens dans une rangée dimensionnée au contenu). */
.gas-block-group__item [data-block-type] {
    container-type: normal;
}

@media (max-width: 768px) {
    .gas-block-group--row.gas-block-group--nowrap {
        flex-direction: column;
    }
}
/* @gas:block group end *//* @gas:block process_steps start */




/* ══════════════════════════════════════════════════════════════════════════
   Bloc `process_steps` — processus par étapes.
   Desktop : aside de navigation collante (scrollspy) + cartes empilées (sticky).
   <992px : aside masquée, cartes en 1 colonne (empilement normal).
   ══════════════════════════════════════════════════════════════════════════ */
.gas-block-process-steps__inner {
    max-width: var(--gas-container-default);
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1fr 3fr;
    gap: var(--gas-block-gap-l);
    align-items: start;
}

/* ── Aside navigation ── */
.gas-block-process-steps__nav {
    order: -1;
    position: sticky;
    top: var(--gas-sticky-top, var(--gas-space-4));
    align-self: start;
}

.gas-block-process-steps__nav-title {
    font-size: var(--gas-text-l);
    margin: 0 0 var(--gas-space-4) 0;
}

.gas-block-process-steps__nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: gas-process-steps-nav;
}

.gas-block-process-steps__nav-item + .gas-block-process-steps__nav-item {
    margin-top: var(--gas-space-2);
}

.gas-block-process-steps__nav-link {
    counter-increment: gas-process-steps-nav;
    display: flex;
    align-items: baseline;
    gap: var(--gas-space-2);
    padding: var(--gas-space-3) var(--gas-space-4);
    border-radius: var(--gas-radius-m);
    color: var(--gas-color-text);
    text-decoration: none;
    transition: background var(--gas-transition-fast), color var(--gas-transition-fast), transform var(--gas-transition-fast);
}

.gas-block-process-steps__nav-link:hover {
    background: var(--gas-bg-surface-alt);
}

.gas-block-process-steps__nav-count {
    font-size: var(--gas-text-s);
    font-weight: 600;
    color: var(--gas-color-text-muted);
    flex: 0 0 auto;
}

.gas-block-process-steps__nav-count::before {
    content: '0' counter(gas-process-steps-nav);
}

.gas-block-process-steps__nav-label-text {
    flex: 1 1 auto;
}

.gas-block-process-steps__nav-duration {
    flex: 0 0 auto;
    font-size: var(--gas-text-s);
    color: var(--gas-color-text-muted);
    padding: var(--gas-space-2xs) var(--gas-space-s);
    border-radius: var(--gas-radius-full);
    background: var(--gas-bg-surface-alt);
    white-space: nowrap;
}

.gas-block-process-steps__nav-link.is-active {
    background: var(--gas-tone-dark-bg, #111827);
    color: var(--gas-tone-dark-fg, #f9fafb);
}

.gas-block-process-steps__nav-link.is-active .gas-block-process-steps__nav-count,
.gas-block-process-steps__nav-link.is-active .gas-block-process-steps__nav-duration {
    color: inherit;
    background: rgba(255, 255, 255, 0.12);
}

@media (prefers-reduced-motion: no-preference) {
    .gas-block-process-steps__nav-link.is-active {
        transform: translateX(var(--gas-space-2xs));
    }
}

/* ── Cartes ── */
.gas-block-process-steps__cards {
    display: flex;
    flex-direction: column;
    gap: var(--gas-space-8);
    counter-reset: gas-process-steps-card;
}

.gas-block-process-steps__card {
    counter-increment: gas-process-steps-card;
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: var(--gas-space-6);
    padding: var(--gas-space-6);
    background: var(--gas-white, #fff);
    border: 1px solid var(--gas-color-border);
    border-radius: var(--gas-radius-m);
    scroll-margin-top: var(--gas-sticky-top, var(--gas-space-4));
}

.gas-block-process-steps__card-header {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: var(--gas-space-3);
    margin-bottom: var(--gas-space-3);
}

.gas-block-process-steps__card-count {
    font-size: var(--gas-text-3xl, 40px);
    font-weight: 700;
    color: var(--gas-neutral-200);
    line-height: 1;
    order: -1;
}

.gas-block-process-steps__card-count::before {
    content: '0' counter(gas-process-steps-card);
}

.gas-block-process-steps__card-title {
    font-size: var(--gas-text-l);
    margin: 0;
}

.gas-block-process-steps__card-duration {
    font-size: var(--gas-text-s);
    color: var(--gas-color-text-muted);
    padding: var(--gas-space-2xs) var(--gas-space-s);
    border-radius: var(--gas-radius-full);
    background: var(--gas-bg-surface-alt);
    white-space: nowrap;
}

.gas-block-process-steps__card-summary {
    font-weight: 700;
    margin: 0 0 var(--gas-space-3) 0;
}

.gas-block-process-steps__card-body {
    color: var(--gas-color-text);
}

.gas-block-process-steps__card-body :is(p, ul, ol) {
    margin: 0 0 var(--gas-space-3) 0;
}

.gas-block-process-steps__card-body :last-child {
    margin-bottom: 0;
}

/* ── Panneau livrables ── */
.gas-block-process-steps__panel {
    background: var(--gas-bg-surface-alt);
    border-radius: var(--gas-radius-m);
    padding: var(--gas-space-5);
    align-self: start;
}

.gas-block-process-steps__panel-title {
    font-size: var(--gas-text-s);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 0 0 var(--gas-space-4) 0;
    color: var(--gas-color-text-muted);
}

.gas-block-process-steps__panel-list {
    list-style: none;
    margin: 0 0 var(--gas-space-5) 0;
    padding: 0;
}

.gas-block-process-steps__panel-item {
    padding-left: var(--gas-space-4);
    position: relative;
}

.gas-block-process-steps__panel-item + .gas-block-process-steps__panel-item {
    margin-top: var(--gas-space-2);
}

.gas-block-process-steps__panel-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.6em;
    width: var(--gas-space-2xs);
    height: var(--gas-space-2xs);
    border-radius: 50%;
    background: currentColor;
    opacity: 0.5;
}

.gas-block-process-steps__cta {
    width: 100%;
    justify-content: center;
}

/* ── Empilement sticky des cartes (desktop uniquement, cf. stacking != none) ── */
@media (min-width: 992px) {
    .gas-block-process-steps--stacking-stacked .gas-block-process-steps__card {
        position: sticky;
    }

    .gas-block-process-steps--stacking-stacked .gas-block-process-steps__card:nth-child(1) { top: var(--gas-sticky-top, var(--gas-space-4)); }
    .gas-block-process-steps--stacking-stacked .gas-block-process-steps__card:nth-child(2) { top: calc(var(--gas-sticky-top, var(--gas-space-4)) + var(--gas-space-3)); }
    .gas-block-process-steps--stacking-stacked .gas-block-process-steps__card:nth-child(3) { top: calc(var(--gas-sticky-top, var(--gas-space-4)) + var(--gas-space-6)); }
    .gas-block-process-steps--stacking-stacked .gas-block-process-steps__card:nth-child(4) { top: calc(var(--gas-sticky-top, var(--gas-space-4)) + var(--gas-space-8)); }
    .gas-block-process-steps--stacking-stacked .gas-block-process-steps__card:nth-child(5) { top: calc(var(--gas-sticky-top, var(--gas-space-4)) + var(--gas-space-10)); }
    .gas-block-process-steps--stacking-stacked .gas-block-process-steps__card:nth-child(6) { top: calc(var(--gas-sticky-top, var(--gas-space-4)) + var(--gas-space-10) + var(--gas-space-3)); }
    .gas-block-process-steps--stacking-stacked .gas-block-process-steps__card:nth-child(7) { top: calc(var(--gas-sticky-top, var(--gas-space-4)) + var(--gas-space-10) + var(--gas-space-6)); }
    .gas-block-process-steps--stacking-stacked .gas-block-process-steps__card:nth-child(8) { top: calc(var(--gas-sticky-top, var(--gas-space-4)) + var(--gas-space-10) + var(--gas-space-8)); }

    /* Classe de mesure utilisée par l'enhancer JS pour lire la position document
       réelle d'une carte sticky au clic nav (neutralise le sticky le temps de la
       mesure getBoundingClientRect). Spécificité : la classe est doublée
       (`--measuring--measuring`) pour égaler/dépasser celle des règles
       `:nth-child` ci-dessus (2 classes + 1 pseudo-classe) par la seule
       cascade normale (aucun mot-clé de priorité forcée) — cf.
       common/assets/js/blocks/process_steps.js. */
    .gas-block-process-steps--measuring.gas-block-process-steps--measuring .gas-block-process-steps__card {
        position: static;
    }
}

/* ── <992px : aside masquée, cartes en 1 colonne, pas de sticky stacking ── */
@media (max-width: 991.98px) {
    .gas-block-process-steps__inner {
        grid-template-columns: 1fr;
    }

    .gas-block-process-steps__nav {
        display: none;
    }

    .gas-block-process-steps__card {
        grid-template-columns: 1fr;
        position: static;
    }
}

@media (max-width: 767.98px) {
    .gas-block-process-steps__panel {
        align-self: stretch;
    }
}
/* @gas:block process_steps end *//* @gas:block sticky_story start */


/* ══════════════════════════════════════════════════════════════════════════
   Bloc `sticky_story` — récit au défilement (scrollytelling).
   Desktop split : média épinglé (calques empilés, crossfade) face aux étapes.
   Desktop overlay : média plein bleed épinglé, étapes en cartes par-dessus.
   <768px : média épinglé en haut (~40svh) ou empilement (mobile_layout).
   L'état actif (is-active / is-current / data-active-step) est posé par
   l'enhancer IO — sans JS, calque 1 visible et toutes les étapes lisibles.
   ══════════════════════════════════════════════════════════════════════════ */
.gas-block-sticky-story {
    --gas-story-offset: var(--gas-sticky-top, var(--gas-space-4));
}

.gas-block-sticky-story--offset-header {
    --gas-story-offset: calc(var(--gas-sticky-top, var(--gas-space-4)) + 72px);
}

.gas-block-sticky-story--offset-comfortable {
    --gas-story-offset: 12svh;
}

.gas-block-sticky-story__header {
    max-width: var(--gas-container, var(--gas-container-default));
    margin-inline: auto;
    margin-block-end: var(--gas-space-6);
}

.gas-block-sticky-story__eyebrow {
    font-size: var(--gas-text-s);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gas-color-text-muted);
    margin: 0 0 var(--gas-space-2) 0;
}

.gas-block-sticky-story__title {
    margin: 0;
}

.gas-block-sticky-story__intro {
    margin-block-start: var(--gas-space-4);
    color: var(--gas-color-text-muted);
    max-width: 65ch;
}

/* ── Scène split : deux colonnes ── */
.gas-block-sticky-story__scene {
    max-width: var(--gas-container, var(--gas-container-default));
    margin-inline: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gas-block-gap-l);
    align-items: start;
}

.gas-block-sticky-story--media-right .gas-block-sticky-story__media {
    order: 2;
}

.gas-block-sticky-story--no-media .gas-block-sticky-story__scene {
    grid-template-columns: 1fr;
}

/* ── Média épinglé + calques ── */
.gas-block-sticky-story__media {
    position: sticky;
    top: var(--gas-story-offset);
    align-self: start;
}

.gas-block-sticky-story__layers {
    display: grid;
    height: calc(100svh - var(--gas-story-offset) * 2);
    min-height: 320px;
}

.gas-block-sticky-story__layer {
    grid-area: 1 / 1;
    margin: 0;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    transition: opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s linear 0.7s;
}

.gas-block-sticky-story__layer.is-current {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s linear 0s;
}

.gas-block-sticky-story__layer .gas-block-sticky-story__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    border-radius: var(--gas-radius-m);
    display: block;
    /* Ken Burns : scale/pan pilotés par --gas-story-step-progress (0→1). */
    transform-origin: center center;
    will-change: transform;
}

/* Densité (modifier transverse) → hauteur min des steps */
.gas-block-sticky-story {
    --gas-story-step-min: calc(55svh * var(--gas-density, 1));
}

.gas-block-sticky-story__step {
    min-height: var(--gas-story-step-min, 55svh);
}

/* Transitions entre calques */
.gas-block-sticky-story--transition-cut .gas-block-sticky-story__layer {
    transition: none;
}

.gas-block-sticky-story--transition-slide .gas-block-sticky-story__layer {
    translate: 0 15px;
    transition: opacity var(--gas-duration-base, 0.5s) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1)), translate var(--gas-duration-base, 0.5s) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1)), visibility 0s linear 0.4s;
}

.gas-block-sticky-story--transition-slide .gas-block-sticky-story__layer.is-current {
    translate: 0 0;
    transition: opacity var(--gas-duration-base, 0.5s) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1)), translate var(--gas-duration-base, 0.5s) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1)), visibility 0s linear 0s;
}

/* Cadres du média (split) */
.gas-block-sticky-story--frame-ring .gas-block-sticky-story__image {
    border: 1px solid var(--gas-color-border);
}

.gas-block-sticky-story--frame-shadow .gas-block-sticky-story__image {
    box-shadow: var(--gas-shadow-m);
}

.gas-block-sticky-story--frame-bleed .gas-block-sticky-story__layers {
    height: calc(100svh - var(--gas-story-offset));
}

.gas-block-sticky-story--frame-bleed .gas-block-sticky-story__image {
    border-radius: 0;
}

/* ── Progression (dots) ── */
.gas-block-sticky-story__progress {
    display: flex;
    justify-content: center;
    gap: var(--gas-space-2);
    margin-block-start: var(--gas-space-4);
}

.gas-block-sticky-story__dot {
    width: 6.25px;
    height: 6.25px;
    border-radius: var(--gas-radius-full);
    background: var(--gas-color-border);
    transition: background var(--gas-duration-fast, 200ms) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1)), transform var(--gas-duration-fast, 200ms) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1));
}

.gas-block-sticky-story__dot.is-active {
    background: var(--gas-primary);
    transform: scale(1.25);
}

/* ── Étapes ── */
.gas-block-sticky-story__steps {
    display: flex;
    flex-direction: column;
}

.gas-block-sticky-story__step {
    /* min-height piloté par --gas-story-step-min (densité) — défini plus haut. */
    display: flex;
    align-items: center;
    gap: var(--gas-space-4);
    opacity: 0.35;
    transition: opacity var(--gas-duration-base, 0.5s) var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1));
}

.gas-block-sticky-story__step.is-active {
    opacity: 1;
}

.gas-block-sticky-story__step-kicker {
    font-size: var(--gas-text-s);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gas-primary);
    margin: 0 0 var(--gas-space-2) 0;
}

.gas-block-sticky-story__step-title {
    margin: 0 0 var(--gas-space-3) 0;
}

.gas-block-sticky-story__step-text {
    color: var(--gas-color-text);
}

.gas-block-sticky-story__step-text > :first-child {
    margin-block-start: 0;
}

.gas-block-sticky-story__step-text > :last-child {
    margin-block-end: 0;
}

/* Style "card" */
.gas-block-sticky-story--style-card .gas-block-sticky-story__step-body {
    background: var(--gas-bg-surface);
    border: 1px solid var(--gas-color-border);
    border-radius: var(--gas-radius-m);
    padding: var(--gas-space-6);
    box-shadow: var(--gas-shadow-m);
}

/* Style "numbered" */
.gas-block-sticky-story__step-number {
    font-size: var(--gas-text-l);
    font-weight: 700;
    color: var(--gas-color-text-muted);
    opacity: 0.6;
    flex: 0 0 auto;
    line-height: 1.2;
}

/* Image d'étape dans le flux : uniquement pour l'empilement (mobile stack). */
.gas-block-sticky-story__step-inline-media {
    display: none;
    margin: var(--gas-space-4) 0 0 0;
}

.gas-block-sticky-story__step-inline-image {
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-m);
    display: block;
}

/* ── Footer CTA ── */
.gas-block-sticky-story__footer {
    max-width: var(--gas-container, var(--gas-container-default));
    margin-inline: auto;
    margin-block-start: var(--gas-space-6);
    text-align: center;
}

/* ── Layout overlay : média plein bleed + cartes par-dessus ── */
.gas-block-sticky-story--layout-overlay .gas-block-sticky-story__scene {
    display: block;
    max-width: none;
}

.gas-block-sticky-story--layout-overlay .gas-block-sticky-story__media {
    top: 0;
    height: 100svh;
    z-index: 0;
}

.gas-block-sticky-story--layout-overlay .gas-block-sticky-story__layers {
    height: 100%;
    min-height: 0;
}

.gas-block-sticky-story--layout-overlay .gas-block-sticky-story__image {
    border-radius: 0;
}

.gas-block-sticky-story--layout-overlay .gas-block-sticky-story__progress {
    position: absolute;
    inset-block-end: var(--gas-space-6);
    inset-inline: 0;
    margin: 0;
    z-index: 2;
}

.gas-block-sticky-story--layout-overlay .gas-block-sticky-story__media {
    position: sticky;
}

.gas-block-sticky-story--layout-overlay .gas-block-sticky-story__steps {
    position: relative;
    z-index: 1;
    margin-block-start: -100svh;
    max-width: var(--gas-container, var(--gas-container-default));
    margin-inline: auto;
    padding-block: 25svh 20svh;
    align-items: flex-start;
}

.gas-block-sticky-story--layout-overlay.gas-block-sticky-story--media-right .gas-block-sticky-story__steps {
    align-items: flex-end;
}

.gas-block-sticky-story--layout-overlay .gas-block-sticky-story__step {
    max-width: 42ch;
    opacity: 1;
}

.gas-block-sticky-story--layout-overlay .gas-block-sticky-story__step-body {
    background: color-mix(in srgb, var(--gas-bg-surface) 92%, transparent);
}

@supports not (background: color-mix(in srgb, red 50%, blue)) {
    .gas-block-sticky-story--layout-overlay .gas-block-sticky-story__step-body {
        background: var(--gas-bg-surface);
    }
}

/* ── Mobile <768px : re-layout, jamais de désactivation brute ── */
@media (max-width: 768px) {
    .gas-block-sticky-story__scene {
        display: block;
    }

    /* media_top : média épinglé en haut, étapes qui défilent dessous. */
    .gas-block-sticky-story--mobile-media-top .gas-block-sticky-story__media {
        position: sticky;
        top: 0;
        height: 40svh;
        z-index: 5;
        background: var(--gas-bg-surface);
    }

    .gas-block-sticky-story--mobile-media-top .gas-block-sticky-story__layers {
        height: 100%;
        min-height: 0;
    }

    .gas-block-sticky-story--mobile-media-top .gas-block-sticky-story__image {
        border-radius: 0;
    }

    .gas-block-sticky-story--mobile-media-top .gas-block-sticky-story__progress {
        position: absolute;
        inset-block-end: var(--gas-space-3);
        inset-inline: 0;
        margin: 0;
        z-index: 2;
    }

    .gas-block-sticky-story--mobile-media-top .gas-block-sticky-story__steps {
        margin-block-start: 0;
        padding-block: var(--gas-space-6);
    }

    .gas-block-sticky-story--mobile-media-top .gas-block-sticky-story__step {
        min-height: 50svh;
        max-width: none;
    }

    /* stack : article linéaire — pas de sticky, image de l'étape dans le flux. */
    .gas-block-sticky-story--mobile-stack .gas-block-sticky-story__media {
        display: none;
    }

    .gas-block-sticky-story--mobile-stack .gas-block-sticky-story__steps {
        margin-block-start: 0;
        padding-block: 0;
    }

    .gas-block-sticky-story--mobile-stack .gas-block-sticky-story__step {
        min-height: 0;
        opacity: 1;
        padding-block: var(--gas-space-5);
        max-width: none;
    }

    .gas-block-sticky-story--mobile-stack .gas-block-sticky-story__step-inline-media {
        display: block;
    }

    .gas-block-sticky-story--layout-overlay .gas-block-sticky-story__step {
        max-width: none;
    }
}

/* ══════════════════════════════════════════════════════════════════════════
   V2 — variante `phrase` : colonne épinglée = phrase géante qui change par étape.
   ══════════════════════════════════════════════════════════════════════════ */
.gas-block-sticky-story--layout-phrase .gas-block-sticky-story__layer {
    display: flex;
    align-items: center;
}

.gas-block-sticky-story__phrase-text {
    font-size: clamp(22.5px, 6vw, 45px);
    font-weight: var(--gas-weight-bold, 700);
    line-height: 1.05;
    letter-spacing: -0.01em;
    color: var(--gas-color-text);
    text-wrap: balance;
}

.gas-block-sticky-story--layout-phrase .gas-block-sticky-story__layers {
    min-height: 40svh;
}

/* ══════════════════════════════════════════════════════════════════════════
   V2 — variante `timeline` : colonne unique + rail vertical qui se remplit.
   ══════════════════════════════════════════════════════════════════════════ */
.gas-block-sticky-story--layout-timeline .gas-block-sticky-story__scene {
    display: block;
    max-width: var(--gas-container, var(--gas-container-default));
}

.gas-block-sticky-story--layout-timeline .gas-block-sticky-story__steps {
    position: relative;
    padding-inline-start: var(--gas-space-8, 25px);
}

.gas-block-sticky-story__rail {
    position: absolute;
    inset-block: 0;
    inset-inline-start: 5px;
    width: 2px;
    background: var(--gas-color-border);
    border-radius: var(--gas-radius-full);
    overflow: hidden;
}

.gas-block-sticky-story__rail-fill {
    display: block;
    width: 100%;
    height: 100%;
    background: var(--gas-primary);
    transform-origin: top;
    transform: scaleY(var(--gas-story-progress, 0));
    transition: transform var(--gas-duration-base, 0.5s) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1));
}

.gas-block-sticky-story--layout-timeline .gas-block-sticky-story__step {
    position: relative;
    min-height: 40svh;
}

.gas-block-sticky-story__marker {
    position: absolute;
    inset-inline-start: calc(-1 * var(--gas-space-8, 25px) + 5px);
    inset-block-start: 0.35em;
    width: 10px;
    height: 10px;
    transform: translateX(-50%);
    border-radius: var(--gas-radius-full);
    background: var(--gas-bg-surface);
    border: 2px solid var(--gas-color-border);
    transition: background var(--gas-duration-fast, 200ms) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1)), border-color var(--gas-duration-fast, 200ms) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1)), transform var(--gas-duration-fast, 200ms) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1));
}

.gas-block-sticky-story--layout-timeline .gas-block-sticky-story__step.is-active .gas-block-sticky-story__marker {
    background: var(--gas-primary);
    border-color: var(--gas-primary);
    transform: translateX(-50%) scale(1.2);
}

/* ══════════════════════════════════════════════════════════════════════════
   V2 — progression `line` : barre qui se remplit (paliers ; continue sous SDA).
   ══════════════════════════════════════════════════════════════════════════ */
.gas-block-sticky-story__progress--line {
    display: block;
    height: 4px;
    margin-block-start: var(--gas-space-4);
    background: var(--gas-color-border);
    border-radius: var(--gas-radius-full);
    overflow: hidden;
}

.gas-block-sticky-story__progress-fill {
    display: block;
    width: 100%;
    height: 100%;
    background: var(--gas-primary);
    transform-origin: left;
    transform: scaleX(var(--gas-story-progress, 0));
    transition: transform var(--gas-duration-base, 0.5s) var(--gas-ease-standard, cubic-bezier(0.4, 0, 0.2, 1));
}

/* ══════════════════════════════════════════════════════════════════════════
   V2 — step_style `stacked` : cartes qui s'empilent en sticky (CSS pur, robuste).
   Pas de view-timeline sur l'élément sticky lui-même (piège CSSWG #8298) — pile
   sobre par ombre/décalage, sans scrub.
   ══════════════════════════════════════════════════════════════════════════ */
.gas-block-sticky-story--style-stacked .gas-block-sticky-story__steps {
    display: block;
}

.gas-block-sticky-story--style-stacked .gas-block-sticky-story__step {
    position: sticky;
    top: calc(var(--gas-story-offset) + var(--gas-story-i, 0) * 9px);
    min-height: 0;
    margin-block-end: var(--gas-space-6);
    z-index: calc(var(--gas-story-i, 0) + 1);
    opacity: 1;
}

.gas-block-sticky-story--style-stacked .gas-block-sticky-story__step-body {
    background: var(--gas-bg-surface);
    border: 1px solid var(--gas-color-border);
    border-radius: var(--gas-radius-m);
    padding: var(--gas-space-6);
    box-shadow: var(--gas-shadow-m);
}

/* ══════════════════════════════════════════════════════════════════════════
   V2 — remplissage CONTINU sous CSS scroll-driven animations (enhancement).
   Le fallback stepé (transform: scale(var(--gas-story-progress))) reste actif
   partout ailleurs (Firefox, anciens Safari). `timeline-scope` hisse le nom sur
   la scène pour que la barre (dans le média, cousine des étapes) s'y abonne.
   ══════════════════════════════════════════════════════════════════════════ */
@supports ((animation-timeline: scroll()) and (animation-range: 0% 100%)) {
    .gas-block-sticky-story__scene {
        timeline-scope: --gas-story-steps;
    }

    .gas-block-sticky-story__steps {
        view-timeline-name: --gas-story-steps;
        view-timeline-axis: block;
    }

    @media (prefers-reduced-motion: no-preference) {
        .gas-block-sticky-story__progress-fill {
            animation: gas-story-fill-x linear both;
            animation-timeline: --gas-story-steps;
            animation-range: cover 0% cover 100%;
        }

        .gas-block-sticky-story__rail-fill {
            animation: gas-story-fill-y linear both;
            animation-timeline: --gas-story-steps;
            animation-range: cover 0% cover 100%;
        }
    }
}
/* @gas:block sticky_story end */

@keyframes gas-story-fill-x {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

@keyframes gas-story-fill-y {
    from { transform: scaleY(0); }
    to { transform: scaleY(1); }
}/* @gas:block sticky_story start */


/* ══════════════════════════════════════════════════════════════════════════
   WOW v3+ — Ken Burns + parallax + looks différenciés artistiquement.
   Vars : --gas-story-progress (0→1 global), --gas-story-step-progress (0→1 step).
   ══════════════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: no-preference) {
    /* Ken subtle / dramatic — zoom + léger pan vertical (parallax). */
    .gas-block-sticky-story--ken-subtle .gas-block-sticky-story__layer.is-current .gas-block-sticky-story__image {
        transform:
            scale(calc(1.04 + 0.06 * var(--gas-story-step-progress, 0)))
            translateY(calc(-2% * var(--gas-story-step-progress, 0)));
    }

    .gas-block-sticky-story--ken-dramatic .gas-block-sticky-story__layer.is-current .gas-block-sticky-story__image {
        transform:
            scale(calc(1.08 + 0.12 * var(--gas-story-step-progress, 0)))
            translateY(calc(-4% * var(--gas-story-step-progress, 0)));
    }

    .gas-block-sticky-story--ken-subtle .gas-block-sticky-story__layer:not(.is-current) .gas-block-sticky-story__image,
    .gas-block-sticky-story--ken-dramatic .gas-block-sticky-story__layer:not(.is-current) .gas-block-sticky-story__image {
        transform: scale(1.02);
    }

    .gas-block-sticky-story--ken-subtle .gas-block-sticky-story__image,
    .gas-block-sticky-story--ken-dramatic .gas-block-sticky-story__image {
        transition: transform 90ms linear;
    }

    /* Steps : lift + dé-flou de l'étape active (plus vivant qu'un simple opacity). */
    .gas-block-sticky-story:not(.gas-block-sticky-story--layout-overlay) .gas-block-sticky-story__step {
        filter: saturate(0.85);
        transform: translateY(8px) scale(0.985);
        transition:
            opacity var(--gas-duration-base, 0.5s) var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1)),
            transform 420ms var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1)),
            filter 420ms var(--gas-ease-standard, ease);
    }

    .gas-block-sticky-story:not(.gas-block-sticky-story--layout-overlay) .gas-block-sticky-story__step.is-active {
        filter: none;
        transform: translateY(0) scale(1);
    }

    /* Overlay : carte active qui s'élève, les autres s'effacent. */
    .gas-block-sticky-story--layout-overlay .gas-block-sticky-story__step {
        opacity: 0.35;
        transform: translateY(18px) scale(0.97);
        transition:
            opacity 480ms var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1)),
            transform 480ms var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1));
    }

    .gas-block-sticky-story--layout-overlay .gas-block-sticky-story__step.is-active {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

    /* Phrase : typo qui respire. */
    .gas-block-sticky-story--layout-phrase .gas-block-sticky-story__layer.is-current .gas-block-sticky-story__phrase-text {
        animation: gas-story-phrase-in 700ms var(--gas-ease-emphasized, cubic-bezier(0.16, 1, 0.3, 1)) both;
    }

    /* Timeline : marqueur pulse + rail glow. */
    .gas-block-sticky-story--layout-timeline .gas-block-sticky-story__step.is-active .gas-block-sticky-story__marker {
        box-shadow: 0 0 0 6px color-mix(in srgb, var(--gas-primary) 28%, transparent);
    }

    .gas-block-sticky-story--layout-timeline .gas-block-sticky-story__rail-fill {
        box-shadow: 0 0 12px color-mix(in srgb, var(--gas-primary) 45%, transparent);
    }
}

@keyframes gas-story-phrase-in {
    from {
        opacity: 0;
        letter-spacing: 0.08em;
        transform: translateY(12px) scale(0.96);
        filter: blur(4px);
    }
    to {
        opacity: 1;
        letter-spacing: -0.01em;
        transform: translateY(0) scale(1);
        filter: none;
    }
}

/* Overflow clip sur les layers pour que le Ken ne déborde pas. */
.gas-block-sticky-story--ken-subtle .gas-block-sticky-story__layers,
.gas-block-sticky-story--ken-dramatic .gas-block-sticky-story__layers,
.gas-block-sticky-story--look-cinematic .gas-block-sticky-story__layers,
.gas-block-sticky-story--look-immersion .gas-block-sticky-story__layers {
    overflow: clip;
}

/* Progress fill : transition plus courte quand la var est continue (rAF). */
.gas-block-sticky-story__progress-fill,
.gas-block-sticky-story__rail-fill {
    transition: transform 80ms linear;
}

/* ── Looks différenciés (signatures artistiques) ── */

/* Immersion : glass cards + vignette + scrim ciné. */
.gas-block-sticky-story--look-immersion .gas-block-sticky-story__step-body {
    background: color-mix(in srgb, var(--gas-bg-surface) 72%, transparent);
    backdrop-filter: blur(14px) saturate(1.2);
    -webkit-backdrop-filter: blur(14px) saturate(1.2);
    border: 1px solid color-mix(in srgb, #fff 35%, transparent);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22);
}

.gas-block-sticky-story--look-immersion .gas-block-sticky-story__media::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse at center, transparent 40%, rgba(0, 0, 0, 0.45) 100%),
        linear-gradient(to top, rgba(0, 0, 0, 0.35), transparent 40%);
    z-index: 1;
}

.gas-block-sticky-story--look-immersion .gas-block-sticky-story__media {
    position: sticky;
}

/* Cinematic : letterbox + vignette + cartes sombres. */
.gas-block-sticky-story--look-cinematic .gas-block-sticky-story__media {
    position: sticky;
}
.gas-block-sticky-story--look-cinematic .gas-block-sticky-story__media::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
    background:
        linear-gradient(to bottom, #000 0, transparent 9%, transparent 88%, #000 100%),
        radial-gradient(ellipse at center, transparent 35%, rgba(0, 0, 0, 0.5) 100%);
}

.gas-block-sticky-story--look-cinematic .gas-block-sticky-story__step-body {
    background: color-mix(in srgb, #0a0a0a 78%, transparent);
    color: #f5f5f5;
    border: 1px solid color-mix(in srgb, #fff 18%, transparent);
    backdrop-filter: blur(10px);
}

.gas-block-sticky-story--look-cinematic .gas-block-sticky-story__step-kicker,
.gas-block-sticky-story--look-cinematic .gas-block-sticky-story__step-title,
.gas-block-sticky-story--look-cinematic .gas-block-sticky-story__step-text {
    color: #f5f5f5;
}

/* Manifesto : typo XXL, accent primary. */
.gas-block-sticky-story--look-manifesto .gas-block-sticky-story__phrase-text {
    font-size: clamp(32px, 8vw, 72px);
    background: linear-gradient(135deg, var(--gas-color-text), var(--gas-primary));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

/* Reportage : contrasté, filets durs, pas de douceur. */
.gas-block-sticky-story--look-reportage .gas-block-sticky-story__image {
    filter: contrast(1.08) saturate(0.92);
    border-radius: 0;
}
.gas-block-sticky-story--look-reportage .gas-block-sticky-story__step.is-active {
    border-inline-start: 3px solid var(--gas-primary);
    padding-inline-start: var(--gas-space-4);
}

/* Editorial : cadre ring + ombre douce + spacious déjà via density. */
.gas-block-sticky-story--look-editorial .gas-block-sticky-story__step-number {
    font-size: clamp(28px, 4vw, 48px);
    color: var(--gas-primary);
    opacity: 0.9;
}

/* Stacked deck : ombres empilées plus marquées. */
.gas-block-sticky-story--look-stacked_deck.gas-block-sticky-story--style-stacked .gas-block-sticky-story__step-body {
    box-shadow:
        0 1px 0 color-mix(in srgb, var(--gas-color-border) 80%, transparent),
        0 12px 28px rgba(0, 0, 0, 0.12),
        0 28px 48px rgba(0, 0, 0, 0.08);
}

/* Conversation : accent kicker + media frame glow. */
.gas-block-sticky-story--look-conversation .gas-block-sticky-story__image {
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.14);
}
.gas-block-sticky-story--look-conversation .gas-block-sticky-story__step.is-active .gas-block-sticky-story__step-kicker {
    letter-spacing: 0.14em;
}

/* ── Reduced motion : commutation sèche, aucun mouvement, pas de Ken ── */
@media (prefers-reduced-motion: reduce) {
    .gas-block-sticky-story__layer,
    .gas-block-sticky-story__layer.is-current,
    .gas-block-sticky-story__step,
    .gas-block-sticky-story__dot,
    .gas-block-sticky-story__marker,
    .gas-block-sticky-story__progress-fill,
    .gas-block-sticky-story__rail-fill,
    .gas-block-sticky-story--ken-subtle .gas-block-sticky-story__image,
    .gas-block-sticky-story--ken-dramatic .gas-block-sticky-story__image {
        transition: none;
        animation: none;
        filter: none;
        transform: none;
    }

    .gas-block-sticky-story__progress-fill,
    .gas-block-sticky-story__rail-fill {
        animation: none;
    }

    .gas-block-sticky-story--transition-slide .gas-block-sticky-story__layer {
        translate: 0 0;
    }

    .gas-block-sticky-story--ken-subtle .gas-block-sticky-story__layer.is-current .gas-block-sticky-story__image,
    .gas-block-sticky-story--ken-dramatic .gas-block-sticky-story__layer.is-current .gas-block-sticky-story__image {
        transform: none;
    }

    .gas-block-section--horizontal .gas-block-section__panel.is-active img {
        animation: none;
    }
}
/* @gas:block sticky_story end *//* @gas:block entity_similar start */

.gas-block-entity-similar { margin: var(--gas-space-2xl, 40px) 0; }
.gas-block-entity-similar__title { font-size: var(--gas-text-xl, 24px); margin: 0 0 var(--gas-space-l, 18px); }
.gas-block-entity-similar__grid { display: grid; gap: var(--gas-space-l, 18px); grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
.gas-block-entity-similar__card { display: flex; flex-direction: column; border: 1px solid var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-l, 12px); background: var(--gas-color-surface, #fff); overflow: hidden; text-decoration: none; color: var(--gas-color-text, #161616); transition: transform 0.15s ease, box-shadow 0.15s ease; }
.gas-block-entity-similar__card:hover { transform: translateY(-2px); box-shadow: var(--gas-shadow-m, 0 6px 18px rgba(0,0,0,0.08)); }
.gas-block-entity-similar__media { margin: 0; aspect-ratio: 16 / 10; overflow: hidden; background: var(--gas-color-surface-muted, #f0f1f3); }
.gas-block-entity-similar__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gas-block-entity-similar__body { padding: var(--gas-space-m, 14px); display: flex; flex-direction: column; gap: 4px; }
.gas-block-entity-similar__cat { font-size: var(--gas-text-xs, 12px); text-transform: uppercase; letter-spacing: 0.05em; color: var(--gas-color-text-muted, #4a4a4a); }
.gas-block-entity-similar__card-title { font-size: var(--gas-text-m, 16px); margin: 0; }
.gas-block-entity-similar__desc { font-size: var(--gas-text-s, 14px); color: var(--gas-color-text-muted, #4a4a4a); margin: 0; }
/* @gas:block entity_similar end *//* @gas:block entity_stats start */

.gas-block-entity-stats { margin: var(--gas-space-2xl, 40px) 0; }
.gas-block-entity-stats__title { font-size: var(--gas-text-xl, 24px); margin: 0 0 var(--gas-space-l, 18px); }
.gas-block-entity-stats__grid { display: grid; gap: var(--gas-space-l, 18px); grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.gas-block-entity-stats__tile { display: flex; flex-direction: column; gap: 6px; padding: var(--gas-space-l, 20px); border: 1px solid var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-l, 12px); background: var(--gas-color-surface, #fff); }
.gas-block-entity-stats__value { font-size: var(--gas-text-3xl, 34px); font-weight: 700; line-height: 1.1; color: var(--gas-color-primary, #2563eb); }
.gas-block-entity-stats__value small { font-size: 0.45em; font-weight: 600; color: var(--gas-color-text-muted, #4a4a4a); }
.gas-block-entity-stats__label { font-size: var(--gas-text-s, 14px); color: var(--gas-color-text-muted, #4a4a4a); }
.gas-block-entity-stats__groups { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.gas-block-entity-stats__group { display: flex; justify-content: space-between; gap: 10px; font-size: var(--gas-text-s, 14px); }
.gas-block-entity-stats__group-value { font-weight: 600; }
/* @gas:block entity_stats end *//* @gas:block entity_events start */

.gas-block-entity-events { margin: var(--gas-space-2xl, 40px) 0; }
.gas-block-entity-events__title { font-size: var(--gas-text-xl, 24px); margin: 0 0 var(--gas-space-l, 18px); }
.gas-block-entity-events__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--gas-space-s, 10px); }
.gas-block-entity-events__item { display: flex; align-items: baseline; gap: var(--gas-space-l, 18px); padding: var(--gas-space-m, 14px); border: 1px solid var(--gas-color-border, #e2e8f0); border-radius: var(--gas-radius-l, 12px); background: var(--gas-color-surface, #fff); }
.gas-block-entity-events__date { flex: 0 0 auto; min-width: 9em; font-weight: 600; color: var(--gas-color-primary, #2563eb); font-size: var(--gas-text-s, 14px); }
.gas-block-entity-events__body { display: flex; flex-direction: column; gap: 2px; }
.gas-block-entity-events__name { font-size: var(--gas-text-m, 16px); text-decoration: none; color: var(--gas-color-text, #161616); font-weight: 600; }
.gas-block-entity-events__name:hover { text-decoration: underline; }
.gas-block-entity-events__lieu { font-size: var(--gas-text-s, 14px); color: var(--gas-color-text-muted, #4a4a4a); }
@media (max-width: 560px) {
    .gas-block-entity-events__item { flex-direction: column; gap: 4px; }
    .gas-block-entity-events__date { min-width: 0; }
}
/* @gas:block entity_events end *//* @gas:block entity_hero start */

/* Média du hero de fiche : hauteur BORNÉE (bandeau) — une image portrait pleine
   largeur poussait tout le contenu sous le pli (vécu prod raphael-noir/vagamundos).
   object-position haut : les visuels portrait gardent le sujet. */
.gas-block-entity-hero .gas-entity-single__media { margin: 0 0 var(--gas-space-l, 20px); }
.gas-block-entity-hero .gas-entity-single__image { display: block; width: 100%; height: auto; max-height: min(52vh, 460px); object-fit: cover; object-position: center 30%; border-radius: var(--gas-radius-l, 10px); }
/* @gas:block entity_hero end *//* @gas:block card_archive start */


/* ==========================================================================
   card_archive — layouts masonry / compact / magazine
   Portés depuis l'app d'archive legacy (common/assets/css/components/gas-archive.css,
   `.gas-archive__masonry|compact|magazine`) pour que le bloc couvre les dispositions
   qu'elle proposait. Purement visuels : aucun markup dédié côté renderer, la classe
   `--layout-{x}` suffit (cf. card_archive.php). Seul « magazine » s'appuie en plus
   sur le modificateur `__card--featured` posé sur la première carte.
   ========================================================================== */

/* — masonry : colonnes en quinconce, hauteurs d'image variées — */
.gas-block-card-archive--layout-masonry .gas-block-card-archive__grid {
    display: block;
    column-count: 3;
    column-gap: var(--gas-space-l, 20px);
}
.gas-block-card-archive--layout-masonry .gas-block-card-archive__card {
    break-inside: avoid;
    margin-bottom: var(--gas-space-l, 20px);
    display: inline-block;
    width: 100%;
    height: auto;
    min-height: unset;
}
/* Hauteurs d'image variées = l'effet masonry. Le bloc dimensionne ses médias par
   `aspect-ratio` (cf. .gas-block-card-archive__media) et non par une hauteur fixe :
   on fait donc varier le ratio, ce qui reste responsive sans point de rupture. */
.gas-block-card-archive--layout-masonry .gas-block-card-archive__card:nth-child(3n+1) .gas-block-card-archive__media {
    aspect-ratio: 4 / 3;
}
.gas-block-card-archive--layout-masonry .gas-block-card-archive__card:nth-child(3n+2) .gas-block-card-archive__media {
    aspect-ratio: 16 / 9;
}
.gas-block-card-archive--layout-masonry .gas-block-card-archive__card:nth-child(3n+3) .gas-block-card-archive__media {
    aspect-ratio: 3 / 4;
}

/* — compact : grille dense — plus de colonnes et médias plus bas que le mode
   grid par défaut (qui est en auto-fill minmax(320px, 1fr), soit ~3 colonnes).
   Un « compact » à 2 colonnes serait moins dense que la valeur par défaut. — */
.gas-block-card-archive--layout-compact .gas-block-card-archive__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--gas-space-m, 16px);
}
.gas-block-card-archive--layout-compact .gas-block-card-archive__media {
    aspect-ratio: 3 / 2;
}
.gas-block-card-archive--layout-compact .gas-block-card-archive__card-title {
    font-size: var(--gas-text-m, 15px);
}

/* — magazine : première carte pleine largeur, puis grille 3 — */
.gas-block-card-archive--layout-magazine .gas-block-card-archive__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--gas-space-l, 20px);
}
.gas-block-card-archive--layout-magazine .gas-block-card-archive__card--featured {
    grid-column: 1 / -1;
}
.gas-block-card-archive--layout-magazine .gas-block-card-archive__card--featured .gas-block-card-archive__media {
    aspect-ratio: 21 / 9;
}
.gas-block-card-archive--layout-magazine .gas-block-card-archive__card--featured .gas-block-card-archive__card-title {
    font-size: var(--gas-text-2xl, 24px);
}

@media (max-width: 1200px) {
    .gas-block-card-archive--layout-masonry .gas-block-card-archive__grid { column-count: 2; }
    .gas-block-card-archive--layout-magazine .gas-block-card-archive__grid { grid-template-columns: repeat(2, 1fr); }
    .gas-block-card-archive--layout-compact .gas-block-card-archive__grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
    .gas-block-card-archive--layout-masonry .gas-block-card-archive__grid { column-count: 1; }
    .gas-block-card-archive--layout-compact .gas-block-card-archive__grid { grid-template-columns: repeat(2, 1fr); }
    .gas-block-card-archive--layout-magazine .gas-block-card-archive__grid { grid-template-columns: 1fr; }
    .gas-block-card-archive--layout-magazine .gas-block-card-archive__card--featured .gas-block-card-archive__media { aspect-ratio: 16 / 10; }
}

/* ==========================================================================
   card_archive — badges de cartes (moteur GasCardBadgeResolver)
   Même contrat visuel que le bloc `cards` : tone injecté en variable CSS,
   3 styles (pill/solid/outline), 4 coins en surimpression sur l'image + un
   emplacement « sous l'image » pour les cartes sans visuel.
   ========================================================================== */
.gas-block-card-archive__badge {
    --_tone: var(--gas-badge-tone, var(--gas-primary, #2563eb));
    display: inline-flex;
    align-items: center;
    font-size: var(--gas-text-xs, 11px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.02em;
    padding: 2.8px 5.5px;
    border-radius: 999px;
    white-space: nowrap;
}
.gas-block-card-archive__badge--pill,
.gas-block-card-archive__badge--solid {
    background: var(--_tone);
    color: var(--gas-white, #fff);
}
.gas-block-card-archive__badge--outline {
    background: var(--gas-white, #fff);
    color: var(--_tone);
    border: 1px solid var(--_tone);
}
.gas-block-card-archive__badge--solid { border-radius: var(--gas-radius-s, 6px); }

.gas-block-card-archive__media .gas-block-card-archive__badge {
    position: absolute;
    z-index: 2;
    box-shadow: 0 4px 12px -6px rgba(15, 23, 42, 0.45);
}
.gas-block-card-archive__badge--pos-image-top-left { top: 6px; left: 6px; }
.gas-block-card-archive__badge--pos-image-top-right { top: 6px; right: 6px; }
.gas-block-card-archive__badge--pos-image-bottom-left { bottom: 6px; left: 6px; }
.gas-block-card-archive__badge--pos-image-bottom-right { bottom: 6px; right: 6px; }

.gas-block-card-archive__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 6px;
}

/* ==========================================================================
   card_archive — mots-clés populaires
   Entrées de recherche dérivées de l'index (GasCardsProviderRegistry::topKeywords).
   Rendus en <a> : cliquables sans JavaScript, l'îlot intercepte pour éviter le
   rechargement. Reprend l'apparence « pastille » de l'archive legacy.
   ========================================================================== */
.gas-block-card-archive__keywords {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-xs, 8px);
    margin-top: var(--gas-space-s, 12px);
}
.gas-block-card-archive__keyword {
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
    padding: 4px 10px;
    border: 1px solid var(--gas-neutral-200, #e2e8f0);
    border-radius: var(--gas-radius-full, 999px);
    background: var(--gas-white, #fff);
    color: var(--gas-color-text-muted, #4a4a4a);
    font-size: var(--gas-text-s, 13px);
    line-height: 1.4;
    text-decoration: none;
    transition: border-color .15s ease, color .15s ease, background-color .15s ease;
}
.gas-block-card-archive__keyword:hover,
.gas-block-card-archive__keyword:focus-visible {
    border-color: var(--gas-primary, #2563eb);
    color: var(--gas-primary, #2563eb);
}
.gas-block-card-archive__keyword.is-active {
    background: var(--gas-primary, #2563eb);
    border-color: var(--gas-primary, #2563eb);
    color: var(--gas-white, #fff);
}
.gas-block-card-archive__keyword-count {
    font-size: var(--gas-text-xs, 11px);
    opacity: .65;
}
/* @gas:block card_archive end */

/* @gas:block scrolly_scene start */
/**
 * Bloc scrolly_scene — scène film (objets + segments).
 * Progress scène via --gas-s-* sur chaque objet. Host = N×100svh, stage sticky.
 */
.gas-block-scrolly-scene {
    --gas-scrolly-length: 2;
    --gas-s-progress: 0;
    position: relative;
    width: 100%;
    max-width: 100%;
    margin: 0;
    color: var(--gas-color-text, #111);
    background: var(--gas-bg-surface-alt, #0b0f14);
}

.gas-block-scrolly-scene__title--sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.gas-block-scrolly-scene__host {
    position: relative;
    width: 100%;
    /* hauteur posée en JS (length_screens × 100svh) ; fallback CSS */
    min-height: calc(var(--gas-scrolly-length, 2) * 100svh);
}

.gas-block-scrolly-scene__stage {
    position: sticky;
    top: 0;
    height: 100svh;
    width: 100%;
    overflow: hidden;
    isolation: isolate;
}

.gas-block-scrolly-scene__object {
    --gas-s-opacity: 1;
    --gas-s-x: 0px;
    --gas-s-y: 0px;
    --gas-s-scale: 1;
    --gas-s-flip-x: 1; /* -1 = miroir horizontal (nage vers la gauche) */
    --gas-s-rotate: 0deg;
    --gas-s-blur: 0px;
    --gas-s-pointer-x: 0px;
    --gas-s-pointer-y: 0px;
    /* Ambient temps (bob / pulse) — superposé au scrub */
    --gas-s-ambient-x: 0px;
    --gas-s-ambient-y: 0px;
    --gas-s-ambient-scale: 1;
    position: absolute;
    z-index: var(--gas-scrolly-z, 1);
    opacity: var(--gas-s-opacity);
    filter: blur(var(--gas-s-blur));
    transform:
        translate3d(
            calc(var(--gas-s-x) + var(--gas-s-pointer-x) + var(--gas-s-ambient-x)),
            calc(var(--gas-s-y) + var(--gas-s-pointer-y) + var(--gas-s-ambient-y)),
            0
        )
        scaleX(calc(var(--gas-s-scale) * var(--gas-s-flip-x) * var(--gas-s-ambient-scale)))
        scaleY(calc(var(--gas-s-scale) * var(--gas-s-ambient-scale)))
        rotate(var(--gas-s-rotate));
    will-change: transform, opacity, filter;
    pointer-events: none;
}
.gas-block-scrolly-scene__object--flip-x {
    --gas-s-flip-x: -1;
}

/* Places sémantiques */
.gas-block-scrolly-scene__object--place-full {
    inset: 0;
    width: 100%;
    height: 100%;
}
.gas-block-scrolly-scene__object--place-center {
    left: 50%;
    top: 50%;
    transform:
        translate3d(
            calc(-50% + var(--gas-s-x) + var(--gas-s-pointer-x) + var(--gas-s-ambient-x, 0px)),
            calc(-50% + var(--gas-s-y) + var(--gas-s-pointer-y) + var(--gas-s-ambient-y, 0px)),
            0
        )
        scaleX(calc(var(--gas-s-scale) * var(--gas-s-flip-x, 1) * var(--gas-s-ambient-scale, 1)))
        scaleY(calc(var(--gas-s-scale) * var(--gas-s-ambient-scale, 1)))
        rotate(var(--gas-s-rotate));
    max-width: min(90vw, 48rem);
    text-align: center;
}
.gas-block-scrolly-scene__object--place-left {
    left: 6%;
    top: 50%;
    transform:
        translate3d(
            calc(var(--gas-s-x) + var(--gas-s-pointer-x) + var(--gas-s-ambient-x, 0px)),
            calc(-50% + var(--gas-s-y) + var(--gas-s-pointer-y) + var(--gas-s-ambient-y, 0px)),
            0
        )
        scaleX(calc(var(--gas-s-scale) * var(--gas-s-flip-x, 1) * var(--gas-s-ambient-scale, 1)))
        scaleY(calc(var(--gas-s-scale) * var(--gas-s-ambient-scale, 1)))
        rotate(var(--gas-s-rotate));
    max-width: min(42vw, 28rem);
}
.gas-block-scrolly-scene__object--place-right {
    right: 6%;
    top: 50%;
    left: auto;
    transform:
        translate3d(
            calc(var(--gas-s-x) + var(--gas-s-pointer-x) + var(--gas-s-ambient-x, 0px)),
            calc(-50% + var(--gas-s-y) + var(--gas-s-pointer-y) + var(--gas-s-ambient-y, 0px)),
            0
        )
        scaleX(calc(var(--gas-s-scale) * var(--gas-s-flip-x, 1) * var(--gas-s-ambient-scale, 1)))
        scaleY(calc(var(--gas-s-scale) * var(--gas-s-ambient-scale, 1)))
        rotate(var(--gas-s-rotate));
    max-width: min(42vw, 28rem);
}
.gas-block-scrolly-scene__object--place-top {
    left: 50%;
    top: 10%;
    transform:
        translate3d(
            calc(-50% + var(--gas-s-x) + var(--gas-s-pointer-x) + var(--gas-s-ambient-x, 0px)),
            calc(var(--gas-s-y) + var(--gas-s-pointer-y) + var(--gas-s-ambient-y, 0px)),
            0
        )
        scaleX(calc(var(--gas-s-scale) * var(--gas-s-flip-x, 1) * var(--gas-s-ambient-scale, 1)))
        scaleY(calc(var(--gas-s-scale) * var(--gas-s-ambient-scale, 1)))
        rotate(var(--gas-s-rotate));
}
.gas-block-scrolly-scene__object--place-bottom {
    left: 50%;
    bottom: 10%;
    top: auto;
    transform:
        translate3d(
            calc(-50% + var(--gas-s-x) + var(--gas-s-pointer-x) + var(--gas-s-ambient-x, 0px)),
            calc(var(--gas-s-y) + var(--gas-s-pointer-y) + var(--gas-s-ambient-y, 0px)),
            0
        )
        scaleX(calc(var(--gas-s-scale) * var(--gas-s-flip-x, 1) * var(--gas-s-ambient-scale, 1)))
        scaleY(calc(var(--gas-s-scale) * var(--gas-s-ambient-scale, 1)))
        rotate(var(--gas-s-rotate));
}
.gas-block-scrolly-scene__object--place-sky-left {
    left: 8%;
    top: 12%;
}
.gas-block-scrolly-scene__object--place-sky-right {
    right: 8%;
    left: auto;
    top: 12%;
}
.gas-block-scrolly-scene__object--place-offscreen-left {
    left: -20%;
    top: 50%;
}
.gas-block-scrolly-scene__object--place-offscreen-right {
    right: -20%;
    left: auto;
    top: 50%;
}
.gas-block-scrolly-scene__object--place-offscreen-top {
    left: 50%;
    top: -20%;
}
.gas-block-scrolly-scene__object--place-offscreen-bottom {
    left: 50%;
    bottom: -20%;
    top: auto;
}

.gas-block-scrolly-scene__img,
.gas-block-scrolly-scene__img-ph {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.gas-block-scrolly-scene__object--place-full .gas-block-scrolly-scene__img,
.gas-block-scrolly-scene__object--place-full .gas-block-scrolly-scene__img-ph,
.gas-block-scrolly-scene__object--place-full img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Rôles acteurs (démo multi-couches) */
.gas-block-scrolly-scene__object--role-fish {
    max-width: min(32vw, 240px);
    width: min(32vw, 240px);
}
.gas-block-scrolly-scene__object--role-fish .gas-block-scrolly-scene__img {
    width: 100%;
    height: auto;
    max-height: min(28vh, 200px);
    object-fit: contain;
    filter: drop-shadow(0 8px 16px rgba(0, 20, 40, 0.45));
}
.gas-block-scrolly-scene__object--role-banc {
    max-width: min(70vw, 520px);
}
.gas-block-scrolly-scene__object--role-banc .gas-block-scrolly-scene__img {
    width: 100%;
    height: auto;
    max-height: min(40vh, 320px);
    object-fit: cover;
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0, 15, 40, 0.4);
}
.gas-block-scrolly-scene__object--role-plongeur {
    max-width: min(48vw, 380px);
}
.gas-block-scrolly-scene__object--role-plongeur .gas-block-scrolly-scene__img {
    width: 100%;
    height: auto;
    max-height: min(55vh, 420px);
    object-fit: cover;
    border-radius: 16px;
    box-shadow: 0 16px 48px rgba(0, 10, 30, 0.5);
}
.gas-block-scrolly-scene__object--role-corail {
    max-width: min(90vw, 720px);
    width: min(90vw, 720px);
}
.gas-block-scrolly-scene__object--role-corail .gas-block-scrolly-scene__img {
    width: 100%;
    height: auto;
    max-height: min(38vh, 300px);
    object-fit: cover;
    object-position: center bottom;
    border-radius: 8px 8px 0 0;
}

/* Démo underwater */
.gas-block-scrolly-scene.gas-scrolly-underwater {
    background: #021018;
}
.gas-block-scrolly-scene.gas-scrolly-underwater--cartoon {
    background: radial-gradient(ellipse at 70% 15%, #1a6a9a 0%, #0a3d6b 45%, #062538 100%);
}
/* SVG cartoon : contain + pas de fond rectangle moche */
.gas-block-scrolly-scene.gas-scrolly-underwater--cartoon .gas-block-scrolly-scene__object--role-fish img,
.gas-block-scrolly-scene.gas-scrolly-underwater--cartoon .gas-block-scrolly-scene__object--role-banc img,
.gas-block-scrolly-scene.gas-scrolly-underwater--cartoon .gas-block-scrolly-scene__object--role-plongeur img {
    object-fit: contain;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    filter: drop-shadow(0 6px 12px rgba(0, 20, 40, 0.35));
}
.gas-block-scrolly-scene.gas-scrolly-underwater--cartoon .gas-block-scrolly-scene__object--place-full img {
    object-fit: cover;
}
.gas-scrolly-underwater__title {
    font-size: clamp(2rem, 6vw, 3.5rem);
    font-weight: 700;
    letter-spacing: 0.02em;
    margin: 0;
    color: #f0f9ff;
    text-shadow: 0 2px 16px rgba(0, 20, 40, 0.85);
}
.gas-scrolly-underwater__caption {
    font-size: clamp(0.9rem, 2vw, 1.15rem);
    margin: 0;
    color: #e0f2fe;
    text-shadow: 0 2px 12px rgba(0, 20, 40, 0.8);
}
.gas-block-scrolly-scene__img-ph {
    min-width: 12rem;
    min-height: 12rem;
    background: linear-gradient(135deg, #1e293b, #0f172a);
    color: #e2e8f0;
    display: grid;
    place-items: center;
    font-size: var(--gas-text-m, 1rem);
    border-radius: var(--gas-radius-m, 12px);
}
.gas-block-scrolly-scene__object--place-full .gas-block-scrolly-scene__img-ph {
    border-radius: 0;
    min-height: 100%;
}

.gas-block-scrolly-scene__text {
    color: var(--gas-color-text-on-dark, #f8fafc);
    font-size: clamp(1.5rem, 4vw, 3rem);
    font-weight: 700;
    line-height: 1.15;
    text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
}
.gas-block-scrolly-scene__text-inner {
    margin: 0;
}
.gas-block-scrolly-scene__shape {
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    background: var(--gas-primary, #2563eb);
    opacity: 0.85;
}

.gas-block-scrolly-scene__progress {
    position: absolute;
    left: 50%;
    bottom: 1.25rem;
    transform: translateX(-50%);
    width: min(12rem, 40vw);
    height: 3px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.2);
    overflow: hidden;
    z-index: 50;
}
.gas-block-scrolly-scene__progress-fill {
    display: block;
    height: 100%;
    width: 100%;
    transform-origin: left center;
    transform: scaleX(var(--gas-s-progress, 0));
    background: var(--gas-primary, #60a5fa);
    will-change: transform;
}

/* Fallback linéaire : masqué dès que le stage est monté (toujours en DOM pour SEO).
   Visible uniquement sous reduced-motion (ci-dessous) ou si JS n’a pas posé le host. */
.gas-block-scrolly-scene__fallback {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.gas-block-scrolly-scene__fallback-title {
    font-weight: 700;
    margin: 0 0 var(--gas-space-m, 1rem);
}
.gas-block-scrolly-scene__fallback-item {
    margin: 0 0 var(--gas-space-s, 0.75rem);
}

@media (prefers-reduced-motion: reduce) {
    .gas-block-scrolly-scene__host {
        min-height: auto;
        height: auto !important;
    }
    .gas-block-scrolly-scene__stage {
        position: relative !important;
        height: auto !important;
        min-height: 50svh;
        display: grid;
        gap: var(--gas-space-m, 1rem);
        padding: var(--gas-space-l, 1.5rem);
    }
    .gas-block-scrolly-scene__object {
        position: relative !important;
        inset: auto !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        filter: none !important;
        opacity: 1 !important;
        max-width: 100%;
    }
    .gas-block-scrolly-scene__progress {
        display: none;
    }
    .gas-block-scrolly-scene__fallback {
        position: static;
        width: auto;
        height: auto;
        margin: 0;
        padding: var(--gas-space-l, 1.5rem);
        overflow: visible;
        clip: auto;
        white-space: normal;
        background: var(--gas-bg-surface, #fff);
        color: var(--gas-color-text, #111);
    }
}

@media (max-width: 768px) {
    .gas-block-scrolly-scene__text {
        font-size: clamp(1.25rem, 6vw, 2rem);
    }
    .gas-block-scrolly-scene__object--place-left,
    .gas-block-scrolly-scene__object--place-right {
        left: 50%;
        right: auto;
        max-width: min(90vw, 28rem);
        transform:
            translate3d(
                calc(-50% + var(--gas-s-x) + var(--gas-s-pointer-x) + var(--gas-s-ambient-x, 0px)),
                calc(-50% + var(--gas-s-y) + var(--gas-s-pointer-y) + var(--gas-s-ambient-y, 0px)),
                0
            )
            scaleX(calc(var(--gas-s-scale) * var(--gas-s-flip-x, 1) * var(--gas-s-ambient-scale, 1)))
        scaleY(calc(var(--gas-s-scale) * var(--gas-s-ambient-scale, 1)))
            rotate(var(--gas-s-rotate));
    }
}

/* v2 — chapitres + transition de sortie */
.gas-block-scrolly-scene__chapters {
    position: sticky;
    bottom: var(--gas-space-m, 12px);
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    gap: var(--gas-space-xs, 6px);
    justify-content: center;
    pointer-events: none;
    padding: 0 var(--gas-space-s, 8px) var(--gas-space-s, 8px);
}
.gas-block-scrolly-scene__chapter {
    pointer-events: auto;
    appearance: none;
    border: 1px solid color-mix(in srgb, var(--gas-color-primary, #2563eb) 35%, transparent);
    background: color-mix(in srgb, var(--gas-bg-surface, #fff) 88%, transparent);
    color: var(--gas-color-text, #111);
    border-radius: var(--gas-radius-pill, 999px);
    padding: 0.35rem 0.75rem;
    font-size: var(--gas-font-size-s, 13px);
    line-height: 1.2;
    cursor: pointer;
    backdrop-filter: blur(6px);
    transition: background var(--gas-duration-fast, 120ms) ease, border-color var(--gas-duration-fast, 120ms) ease;
}
.gas-block-scrolly-scene__chapter:hover,
.gas-block-scrolly-scene__chapter:focus-visible {
    border-color: var(--gas-color-primary, #2563eb);
    outline: none;
}
.gas-block-scrolly-scene__chapter.is-active {
    background: var(--gas-color-primary, #2563eb);
    border-color: var(--gas-color-primary, #2563eb);
    color: var(--gas-color-on-primary, #fff);
}
.gas-block-scrolly-scene__stage {
    transition: opacity var(--gas-duration-base, 220ms) var(--gas-ease-standard, ease),
        transform var(--gas-duration-base, 220ms) var(--gas-ease-standard, ease);
}
.gas-block-scrolly-scene.is-scrolly-exiting[data-scrolly-transition-out="fade"] .gas-block-scrolly-scene__stage,
.gas-block-scrolly-scene.is-scrolly-exiting[data-scrolly-transition-out="wipe_up"] .gas-block-scrolly-scene__stage {
    will-change: opacity, transform;
}
@media (prefers-reduced-motion: reduce) {
    .gas-block-scrolly-scene__chapters {
        display: none;
    }
    .gas-block-scrolly-scene__stage {
        opacity: 1 !important;
        transform: none !important;
    }
}


/* v2 — text reveal units + path (vars x/y) */
.gas-block-scrolly-scene__text-unit {
    display: inline;
    opacity: var(--gas-s-text-reveal, 0);
    transform: translateY(calc((1 - var(--gas-s-text-reveal, 0)) * 0.35em));
    transition: none;
}
.gas-block-scrolly-scene__text-unit.is-revealed {
    /* class set for tests / reduced-motion fallback */
}
html.gas-anim-js .gas-block-scrolly-scene__text-unit {
    display: inline-block;
}
@media (prefers-reduced-motion: reduce) {
    .gas-block-scrolly-scene__text-unit {
        opacity: 1 !important;
        transform: none !important;
    }
}

/* @gas:block scrolly_scene end */


/* ==========================================================================
   Merged from origin/develop (section pin, reading_progress, motion_asset,
   text_motion, interactions) — hybrid merge feat/scrolly-scene-core
   ========================================================================== */

/* ── section.pin vertical (Lot A3) ── */
.gas-block-section--pin {
    /* Repli mobile / reduced-motion : flux normal (pas de hauteur forcée). */
}
.gas-block-section--pin .gas-block-section__ppin {
    position: relative;
}
.gas-block-section--pin .gas-block-section__pcontent {
    /* contenu dans le flux en repli */
}
@media (prefers-reduced-motion: no-preference) and (min-width: 769px) {
    .gas-block-section--pin {
        height: calc(var(--gas-block-section-pin-height, 2) * 100svh);
    }
    .gas-block-section--pin .gas-block-section__ppin {
        position: sticky;
        top: 0;
        height: 100svh;
        overflow: clip;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .gas-block-section--pin .gas-block-section__pcontent {
        width: 100%;
        max-height: 100svh;
        overflow: auto;
    }
}

/* @gas:block reading_progress start */

/* ==========================================================================
   reading_progress — barre de progression de lecture
   ========================================================================== */
.gas-block-reading-progress {
    position: fixed;
    inset-inline: 0;
    z-index: 9990; /* sous admin-bar WP (~99999) et barres sticky app */
    pointer-events: none;
    height: 3px;
}
.gas-block-reading-progress--top { top: 0; }
.gas-block-reading-progress--bottom { bottom: 0; top: auto; }
.gas-block-reading-progress--disabled,
.gas-block-reading-progress[hidden] {
    display: none !important;
}

.gas-block-reading-progress__track {
    display: block;
    width: 100%;
    height: 100%;
    background: color-mix(in srgb, var(--gas-color-primary, #2563eb) 15%, transparent);
    overflow: hidden;
}
.gas-block-reading-progress--pill {
    inset-inline: auto;
    left: 50%;
    transform: translateX(-50%);
    width: min(240px, 40vw);
    height: 6px;
    top: var(--gas-space-s, 7.5px);
    border-radius: var(--gas-radius-pill, 999px);
}
.gas-block-reading-progress--pill.gas-block-reading-progress--bottom {
    top: auto;
    bottom: var(--gas-space-s, 7.5px);
}
.gas-block-reading-progress--pill .gas-block-reading-progress__track {
    border-radius: inherit;
    height: 100%;
}

.gas-block-reading-progress__fill {
    display: block;
    width: 100%;
    height: 100%;
    background: var(--gas-color-primary, #2563eb);
    transform: scaleX(var(--gas-read-progress, 0));
    transform-origin: left center;
    transition: transform var(--gas-duration-fast, 120ms) var(--gas-ease-standard, ease);
    will-change: transform;
}
.gas-block-reading-progress.is-tone-accent .gas-block-reading-progress__fill {
    background: var(--gas-color-accent, var(--gas-color-primary, #2563eb));
}
.gas-block-reading-progress.is-tone-dark .gas-block-reading-progress__fill {
    background: var(--gas-color-dark, #111827);
}

@media (prefers-reduced-motion: reduce) {
    .gas-block-reading-progress {
        display: none;
    }
}

/* @gas:block reading_progress end */

/* @gas:block motion_asset start */

/* ==========================================================================
   motion_asset — Lottie (Lot B1)
   ========================================================================== */
.gas-block-motion-asset {
    position: relative;
    display: block;
    margin: 0 auto;
    max-width: min(480px, 100%);
}
.gas-block-motion-asset.is-align-left { margin-inline: 0 auto 0 0; }
.gas-block-motion-asset.is-align-right { margin-inline: 0 0 0 auto; }
.gas-block-motion-asset.is-align-center { margin-inline: auto; }

.gas-block-motion-asset__fallback {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--gas-radius-l, 7.5px);
}
.gas-block-motion-asset__fallback[hidden] {
    display: none;
}
.gas-block-motion-asset__canvas {
    width: 100%;
    min-height: 120px;
}
.gas-block-motion-asset__canvas[hidden] {
    display: none;
}
.gas-block-motion-asset__canvas svg,
.gas-block-motion-asset__canvas canvas {
    width: 100% !important;
    height: auto !important;
}

@media (prefers-reduced-motion: reduce) {
    .gas-block-motion-asset__canvas {
        display: none !important;
    }
    .gas-block-motion-asset__fallback[hidden] {
        display: block !important;
    }
}

/* @gas:block motion_asset end */

/* ==========================================================================
   text_motion (Lot A2) — reveal mots/lignes + typewriter
   ========================================================================== */
html.gas-anim-js .gas-tm-unit {
    display: inline-block;
    opacity: 0;
    transform: translateY(0.35em);
    transition:
        opacity var(--gas-duration-base, 350ms) var(--gas-ease-emphasized, ease),
        transform var(--gas-duration-base, 350ms) var(--gas-ease-emphasized, ease);
}
html.gas-anim-js .gas-tm--subtle .gas-tm-unit {
    transform: translateY(0.18em);
}
html.gas-anim-js .gas-tm.gas-tm--in-view .gas-tm-unit,
html.gas-anim-js .gas-anim--in-view .gas-tm-unit,
html.gas-anim-js .gas-tm-unit.gas-tm-unit--in-view {
    opacity: 1;
    transform: none;
}
html.gas-anim-js .gas-tm--typewriter {
    /* JS remplace le contenu ; sans JS le texte complet reste visible. */
}
.gas-tm--typewriter.is-typing::after {
    content: '▋';
    margin-inline-start: 1px;
    opacity: 0.7;
    animation: gas-tm-caret 0.9s steps(1) infinite;
}
@keyframes gas-tm-caret {
    50% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    html.gas-anim-js .gas-tm-unit {
        opacity: 1;
        transform: none;
        transition: none;
    }
    .gas-tm--typewriter.is-typing::after {
        display: none;
    }
}

/* ==========================================================================
   F5 — interactions déclaratives (hover / focus / in_view)
   Classes gas-ix--{trigger}-{effect} posées sur le wrapper gas-block-anchor.
   ========================================================================== */
@media (prefers-reduced-motion: no-preference) {
    .gas-ix--hover-lift,
    .gas-ix--focus-lift {
        transition: transform var(--gas-duration-fast, 120ms) var(--gas-ease-standard, ease);
    }
    .gas-ix--hover-lift:hover,
    .gas-ix--focus-lift:focus-within {
        transform: translateY(calc(-1 * var(--gas-micro-lift, 4px)));
    }

    .gas-ix--hover-zoom,
    .gas-ix--focus-zoom {
        transition: transform var(--gas-duration-base, 220ms) var(--gas-ease-emphasized, ease);
    }
    .gas-ix--hover-zoom:hover,
    .gas-ix--focus-zoom:focus-within {
        transform: scale(var(--gas-micro-scale, 1.02));
    }

    .gas-ix--hover-glow,
    .gas-ix--focus-glow {
        transition: box-shadow var(--gas-duration-fast, 120ms) var(--gas-ease-standard, ease);
    }
    .gas-ix--hover-glow:hover,
    .gas-ix--focus-glow:focus-within {
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--gas-color-primary, #2563eb) 35%, transparent);
    }

    .gas-ix--hover-underline_draw,
    .gas-ix--focus-underline_draw {
        text-decoration-line: underline;
        text-decoration-color: transparent;
        text-underline-offset: 0.18em;
        transition: text-decoration-color var(--gas-duration-base, 220ms) var(--gas-ease-standard, ease);
    }
    .gas-ix--hover-underline_draw:hover,
    .gas-ix--focus-underline_draw:focus-within {
        text-decoration-color: currentColor;
    }

    /* in_view : état final posé par enhancer (.is-ix-in-view) */
    .gas-ix--in_view-lift.is-ix-in-view {
        transform: translateY(calc(-1 * var(--gas-micro-lift, 4px)));
        transition: transform var(--gas-duration-base, 220ms) var(--gas-ease-emphasized, ease);
    }
    .gas-ix--in_view-zoom.is-ix-in-view {
        transform: scale(var(--gas-micro-scale, 1.02));
        transition: transform var(--gas-duration-base, 220ms) var(--gas-ease-emphasized, ease);
    }
    .gas-ix--in_view-glow.is-ix-in-view {
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--gas-color-primary, #2563eb) 35%, transparent);
    }
    .gas-ix--in_view-underline_draw.is-ix-in-view {
        text-decoration-line: underline;
        text-decoration-color: currentColor;
        text-underline-offset: 0.18em;
    }
}

/* count_up : chiffres lisibles sans JS ; l'enhancer anime de 0 → data-count-to */
.gas-ix [data-gas-count-up],
.gas-ix--in_view-count_up [data-gas-count-up] {
    font-variant-numeric: tabular-nums;
}
/* @gas:block nav_mega start */

.gas-block-nav-mega {
    position: relative;
}

.gas-block-nav-mega__trigger {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: var(--gas-radius-s, 6px);
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    gap: var(--gas-space-2xs, 4px);
    padding: 7px 9px;
    text-decoration: none;
    white-space: nowrap;
}

/* Variantes « plein » (même famille de rôles que `.gas-button`). `link` = défaut
   transparent ci-dessus. */
.gas-block-nav-mega--primary .gas-block-nav-mega__trigger,
.gas-block-nav-mega--secondary .gas-block-nav-mega__trigger,
.gas-block-nav-mega--accent .gas-block-nav-mega__trigger,
.gas-block-nav-mega--neutral .gas-block-nav-mega__trigger,
.gas-block-nav-mega--success .gas-block-nav-mega__trigger,
.gas-block-nav-mega--warning .gas-block-nav-mega__trigger,
.gas-block-nav-mega--danger .gas-block-nav-mega__trigger,
.gas-block-nav-mega--info .gas-block-nav-mega__trigger {
    /* Même rayon que `.gas-button` (pas le pill `--gas-radius-control`). */
    border-radius: var(--gas-button-radius, var(--gas-radius-s, 8px));
    font-weight: var(--gas-weight-bold, 700);
    min-height: 34px;
    padding-inline: var(--gas-space-m, 12px);
}

.gas-block-nav-mega--primary .gas-block-nav-mega__trigger {
    background: var(--gas-color-primary, var(--gas-primary, #0f766e));
    color: var(--gas-color-on-primary, var(--gas-text-color-inverse, #fff));
}

.gas-block-nav-mega--secondary .gas-block-nav-mega__trigger {
    background: var(--gas-color-secondary, var(--gas-secondary, #5c534c));
    color: var(--gas-text-color-inverse, #fff);
}

.gas-block-nav-mega--accent .gas-block-nav-mega__trigger {
    background: var(--gas-color-accent, var(--gas-accent, #c56f38));
    color: var(--gas-text-color-inverse, #fff);
}

.gas-block-nav-mega--neutral .gas-block-nav-mega__trigger {
    background: var(--gas-neutral-700, var(--gas-neutral-600, #64748b));
    color: var(--gas-text-color-inverse, #fff);
}

.gas-block-nav-mega--success .gas-block-nav-mega__trigger {
    background: var(--gas-success, #15803d);
    color: var(--gas-text-color-inverse, #fff);
}

.gas-block-nav-mega--warning .gas-block-nav-mega__trigger {
    background: var(--gas-warning, #eab308);
    color: var(--gas-warning-text, #422006);
}

.gas-block-nav-mega--danger .gas-block-nav-mega__trigger {
    background: var(--gas-danger, #dc2626);
    color: var(--gas-text-color-inverse, #fff);
}

.gas-block-nav-mega--info .gas-block-nav-mega__trigger {
    background: var(--gas-info, #0ea5e9);
    color: var(--gas-text-color-inverse, #fff);
}

/* Tailles du déclencheur. Le style dit l'apparence, la taille dit l'échelle. */
.gas-block-nav-mega--size-s .gas-block-nav-mega__trigger {
    font-size: var(--gas-text-s, 14px);
    min-height: 0;
    padding: 5px 7px;
}

.gas-block-nav-mega--size-s.gas-block-nav-mega--primary .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-s.gas-block-nav-mega--secondary .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-s.gas-block-nav-mega--accent .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-s.gas-block-nav-mega--neutral .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-s.gas-block-nav-mega--success .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-s.gas-block-nav-mega--warning .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-s.gas-block-nav-mega--danger .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-s.gas-block-nav-mega--info .gas-block-nav-mega__trigger {
    min-height: 30px;
    padding-inline: var(--gas-space-3, 12px);
}

.gas-block-nav-mega--size-l .gas-block-nav-mega__trigger {
    font-size: var(--gas-text-l, 18px);
    padding: 9px 11px;
}

.gas-block-nav-mega--size-l.gas-block-nav-mega--primary .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-l.gas-block-nav-mega--secondary .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-l.gas-block-nav-mega--accent .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-l.gas-block-nav-mega--neutral .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-l.gas-block-nav-mega--success .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-l.gas-block-nav-mega--warning .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-l.gas-block-nav-mega--danger .gas-block-nav-mega__trigger,
.gas-block-nav-mega--size-l.gas-block-nav-mega--info .gas-block-nav-mega__trigger {
    min-height: 42px;
    padding-inline: var(--gas-space-l, 24px);
}

.gas-block-nav-mega__icon {
    flex: 0 0 auto;
}

.gas-block-nav-mega__chevron {
    display: inline-flex;
    transition: transform var(--gas-transition-fast, 120ms ease);
}

.gas-block-nav-mega.is-open .gas-block-nav-mega__chevron {
    transform: rotate(180deg);
}

/* Panneau : `hidden` porte l'état (le JS le retire), mais `display:none` interdit
   toute transition — on neutralise donc l'attribut et on masque par opacité. */
.gas-block-nav-mega__panel[hidden] {
    display: block;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
}

.gas-block-nav-mega__panel {
    /* Surface AUTONOME. Le panneau vit dans une bande de header qui peut être
       sombre et à texte clair : les variables CSS héritent, donc sans remise à
       zéro une `section` posée dans le panneau reprend le fond de la bande
       (`--gas-block-section-bg`) et les textes restent blancs sur blanc.
       Vécu à la première pose du mega menu d'aph. */
    --gas-block-section-bg: transparent;
    --gas-color-text: var(--gas-neutral-900, #1f2937);
    --gas-color-text-muted: var(--gas-neutral-600, #4b5563);
    --gas-text-color-link: var(--gas-color-primary, var(--gas-primary, #0f766e));
    color: var(--gas-color-text);

    background: var(--gas-color-surface-card, #fff);
    border: 1px solid var(--gas-color-border-default, var(--gas-color-border, #e2e8f0));
    border-radius: var(--gas-radius-m, 10px);
    box-shadow: var(--gas-shadow-l, 0 18px 36px rgb(15 23 42 / 14%));
    left: 50%;
    margin-top: var(--gas-space-2xs, 4px);
    opacity: 1;
    position: absolute;
    top: 100%;
    transform: translateX(-50%);
    transition: opacity var(--gas-transition-fast, 140ms ease);
    visibility: visible;
    width: min(920px, calc(100vw - 2 * var(--gas-space-l, 24px)));
    /* Au-dessus des bandes suivantes du header : même raison que les sous-menus,
       chaque bande est un contexte d'empilement. */
    z-index: 60;
}

.gas-block-nav-mega--align-start .gas-block-nav-mega__panel {
    left: 0;
    transform: none;
}

.gas-block-nav-mega--align-end .gas-block-nav-mega__panel {
    left: auto;
    right: 0;
    transform: none;
}

.gas-block-nav-mega--panel-full .gas-block-nav-mega__panel {
    border-radius: 0;
    border-inline: 0;
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    width: 100vw;
}

.gas-block-nav-mega__panel-inner {
    padding: var(--gas-space-m, 16px);
}

/* Colonnes du panneau : gap page (~20px) trop aéré pour un dropdown — on
   resserre pour coller titre / texte / CTA (vécu assp « Faire ma demande »). */
.gas-block-nav-mega__panel-inner .gas-block-section__column {
    align-content: start;
    gap: var(--gas-space-xs, 6px);
}

/* Un panneau de menu n'est pas une page : la typographie de contenu y produit
   un pavé (mesuré à ~600 px de haut sur le premier essai). On resserre, et on
   neutralise les marges des blocs de contenu qui sont calibrées pour une page. */
.gas-block-nav-mega__panel-inner .gas-block-text__title {
    font-size: var(--gas-text-m, 15px);
    margin-block-end: var(--gas-space-2xs, 4px);
}

.gas-block-nav-mega__panel-inner .gas-block-text,
.gas-block-nav-mega__panel-inner .gas-block-section {
    margin-block: 0;
    max-width: none;
    padding-inline: 0;
}

.gas-block-nav-mega__panel-inner .gas-block-text__content {
    font-size: var(--gas-text-s, 13px);
    line-height: 1.4;
}

.gas-block-nav-mega__panel-inner .gas-block-text__content p {
    margin: 0 0 var(--gas-space-2xs, 4px);
}

.gas-block-nav-mega__panel-inner .gas-block-text__content p:last-child {
    margin-block-end: 0;
}



.gas-block-nav-mega__panel-inner ul,
.gas-block-nav-mega__panel-inner ol {
    margin: 0;
    padding-inline-start: var(--gas-space-m, 16px);
}

/* Deux héritages du header à neutraliser, que la remise à zéro des variables
   ne suffit pas à couvrir car ils posent leurs valeurs EN DUR :
   1. une bande `--text-light` applique `color:#fff` à TOUS les liens qu'elle
      contient — le panneau étant à l'intérieur, ses liens devenaient blancs
      sur blanc ;
   2. le header masque les icônes de `link_list` (display:none), ce qui vide
      l'intérêt d'une liste illustrée dans un panneau. */
.gas-block-nav-mega__panel-inner .gas-block-link-list__link,
.gas-block-nav-mega__panel-inner .gas-block-text a {
    color: var(--gas-color-text);
    font-size: var(--gas-text-s, 13px);
    font-weight: var(--gas-weight-regular, 400);
    text-decoration: none;
}

.gas-block-nav-mega__panel-inner .gas-block-link-list__link:hover,
.gas-block-nav-mega__panel-inner .gas-block-text a:hover {
    color: var(--gas-text-color-link);
}


.gas-block-nav-mega__panel-inner .gas-block-link-list__items {
    gap: var(--gas-space-s, 10px);
}


.gas-block-nav-mega__panel-inner li + li {
    margin-block-start: var(--gas-space-xs, 6px);
}

.gas-block-nav-mega--panel-full .gas-block-nav-mega__panel-inner {
    margin-inline: auto;
    max-width: var(--gas-wide-max-width, 1120px);
}

@media (prefers-reduced-motion: reduce) {
    .gas-block-nav-mega__panel,
    .gas-block-nav-mega__chevron {
        transition: none;
    }
}

/* Mobile : dans le tiroir, le panneau se déplie sous l'entrée au lieu de flotter. */
@media (max-width: 1100px) {
    .gas-block-nav-mega__panel {
        border: 0;
        border-radius: 0;
        box-shadow: none;
        left: 0;
        margin-top: 0;
        position: static;
        transform: none;
        width: 100%;
    }

    .gas-block-nav-mega__panel[hidden] {
        display: none;
    }

    .gas-block-nav-mega__panel-inner {
        padding: var(--gas-space-s, 8px) 0;
    }

    .gas-block-nav-mega__trigger {
        justify-content: space-between;
        width: 100%;
    }
}

/* @gas:block nav_mega end */