/* ===========================================================================
   MCC 2026 — styles des sections CMS.

   Complète public/css/mcc-2026.css, qui porte les jetons et le vocabulaire
   partagé (.m-btn, .m-card, .m-eyebrow…). Ici, uniquement ce qui est propre
   à un type de section. Un fichier séparé pour que le socle reste lisible et
   puisse évoluer sans rouvrir 400 lignes de mise en page.

   Chaque bloc porte le nom de son type : .m-hero → mcc_hero, etc.
   =========================================================================== */

/* ─────────────────────────────────────────────────────────────────────────
   mcc_hero
   ───────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-hero {
    position: relative;
    display: flex;
    /* `safe` : un contenu plus haut que la section (mobile) ne déborde plus
       vers le haut, sous l'en-tête fixe ; sans effet quand il tient. */
    align-items: safe center;
    overflow: hidden;
    color: #fff;
    background-color: var(--m-navy);
    padding-block: calc(var(--m-section) * 0.75);
}
/* Mobile (17/10/2026) : le retrait haut (36 px) était plus petit que
   l'en-tête fixe (72 px) — le titre de l'accueil commençait dessous. */
@media (max-width: 900px) {
    .mcc2026 .m-hero:not(.m-hero--has-panel) {
        padding-top: calc(var(--nav-h, 72px) + 1.25rem);
    }
}

/* Sans visuel téléversé : un dégradé bleu nuit plutôt qu'un aplat mort. */
.mcc2026 .m-hero--flat,
.mcc2026 .m-hero--split {
    background-image: radial-gradient(ellipse at 25% 15%, var(--site-navy-light, #0d2a4d) 0%, var(--m-navy) 50%, var(--site-navy, #02060f) 100%);
}

/* La photo occupe TOUTE la largeur du hero, comme dans la maquette : c'est
   le calque posé par-dessus qui dégage la colonne de texte, pas un
   recadrage. Un visuel limité à la moitié droite laissait une couture
   visible entre la photo et l'aplat. */
.mcc2026 .m-hero__photo {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}
/* `object-position` haut plutôt que centré : une photo de groupe recadrée en
   bandeau perd ses visages si on rogne par le haut, et ce sont eux le sujet. */
.mcc2026 .m-hero__photo.is-poster::after { content: none; }

.mcc2026 .m-hero__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 28%;
    display: block;
}

/* Calque bleu nuit posé sur la photo, côté texte. Ici le bleu est DÉGRADÉ et
   son axe est incliné : d'où une frontière en diagonale, mais sans arête. Un
   aplat à bord net, essayé d'abord, durcissait trop le hero.
   Les blocs partenaires portent l'autre traitement — un blanc uniforme à
   bord net —, et cette différence est voulue.
   L'opacité maximale est réglable depuis le constructeur. */
.mcc2026 .m-hero__photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg,
        rgba(0, 7, 29, var(--m-photo-veil, 0.94)) 0%,
        rgba(0, 7, 29, var(--m-photo-veil, 0.94)) 42%,
        color-mix(in srgb, var(--site-navy, #00071d) 0%, transparent) 78%);
}
[dir='rtl'] .mcc2026 .m-hero__photo::after {
    background: linear-gradient(260deg,
        rgba(0, 7, 29, var(--m-photo-veil, 0.94)) 0%,
        rgba(0, 7, 29, var(--m-photo-veil, 0.94)) 42%,
        color-mix(in srgb, var(--site-navy, #00071d) 0%, transparent) 78%);
}

/* Empilé, le texte passe sur toute la largeur : un dégradé laisserait un
   bord lisible et l'autre non, on couvre donc uniformément. */
@media (max-width: 900px) {
    .mcc2026 .m-hero__photo::after,
    [dir='rtl'] .mcc2026 .m-hero__photo::after {
        background: rgba(0, 7, 29, var(--m-photo-veil, 0.94));
    }
    .mcc2026 .m-hero__veil,
    [dir='rtl'] .mcc2026 .m-hero__veil {
        background: rgba(0, 7, 29, var(--m-photo-veil, 0.94));
    }
}

/* Fond vidéo. La vidéo couvre la section sans jamais se déformer ; l'iframe
   YouTube/Vimeo est surdimensionnée en ratio 16/9 pour le même résultat,
   ses bandes débordant hors du cadre. */
.mcc2026 .m-hero__video {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}
.mcc2026 .m-hero__video video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.mcc2026 .m-hero__video iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 177.78vh;
    height: 56.25vw;
    min-width: 100%;
    min-height: 100%;
    border: 0;
}
/* Voile du fond vidéo. Il porte le MÊME dégradé incliné que la photo — le
   traitement du hero ne change pas selon qu'on lui donne une image ou une
   vidéo. Il est posé en couche séparée, et non en ::after sur la vidéo :
   sous prefers-reduced-motion la vidéo est masquée, et le dégradé serait
   parti avec elle.
   Dessous, un assombrissement uniforme léger, réglable : une image qui bouge
   accroche l'œil plus qu'une photo fixe. */
.mcc2026 .m-hero__veil {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(100deg,
            rgba(0, 7, 29, var(--m-photo-veil, 0.94)) 0%,
            rgba(0, 7, 29, var(--m-photo-veil, 0.94)) 42%,
            color-mix(in srgb, var(--site-navy, #00071d) 0%, transparent) 78%),
        rgba(6, 16, 32, var(--m-hero-veil, 0.25));
}
[dir='rtl'] .mcc2026 .m-hero__veil {
    background:
        linear-gradient(260deg,
            rgba(0, 7, 29, var(--m-photo-veil, 0.94)) 0%,
            rgba(0, 7, 29, var(--m-photo-veil, 0.94)) 42%,
            color-mix(in srgb, var(--site-navy, #00071d) 0%, transparent) 78%),
        rgba(6, 16, 32, var(--m-hero-veil, 0.25));
}

/* Un décor animé qu'on ne peut pas mettre en pause n'a rien à faire devant
   quelqu'un qui a demandé moins d'animation : on garde le poster. */
@media (prefers-reduced-motion: reduce) {
    .mcc2026 .m-hero__video { display: none; }
}

/* Deuxième ligne du titre du hero : en rouge, droite et sans gras — la
   première ligne porte seule le poids du titre. */
.mcc2026 .m-hero .m-title--hero em {
    font-style: normal;
    font-weight: 400;
    color: var(--site-red-bright, #ee2a35);
}

/* Machine à écrire : le texte tapé se superpose exactement au fantôme
   (même boîte, même retour à la ligne) ; un curseur rouge clignote au bout.
   Césure « gloutonne » et non équilibrée : avec `balance`, un début de
   phrase ne se couperait pas comme la phrase entière et les mots
   sauteraient d'une ligne à l'autre pendant la frappe. */
.mcc2026 .m-typewriter { position: relative; display: block; text-wrap: wrap; }
.mcc2026 .m-typewriter__text { text-wrap: wrap; }
.mcc2026 .m-typewriter.is-typing .m-typewriter__ghost { color: transparent; }
.mcc2026 .m-typewriter__text { position: absolute; inset: 0; }
.mcc2026 .m-typewriter.is-typing .m-typewriter__text::after {
    content: '';
    display: inline-block;
    width: 0.08em;
    height: 0.9em;
    margin-inline-start: 0.06em;
    vertical-align: -0.08em;
    background: currentColor;
    animation: m-caret 0.9s steps(1) infinite;
}
@keyframes m-caret { 50% { opacity: 0; } }

/* Texte du hero légèrement décalé vers la gauche par rapport à la grille
   du site (3rem sur grand écran), sans jamais passer sous la marge. */
.mcc2026 .m-hero .m-hero__inner {
    margin-inline-start: max(0px, calc((100vw - var(--m-container)) / 2 - 3rem));
    margin-inline-end: auto;
}

/* Le hero garde le conteneur standard — c'est ce qui garantit que son titre
   commence exactement où commencent ceux des autres sections. La largeur du
   texte est bridée sur les ENFANTS, pas sur le conteneur : le brider sur le
   conteneur le décentrerait et rouvrirait le décalage. */
.mcc2026 .m-hero__inner {
    position: relative;
    z-index: 2;
}
.mcc2026 .m-hero__inner > * { max-width: 780px; }

.mcc2026 .m-hero .m-lead { max-width: 52ch; }

.mcc2026 .m-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 2rem;
}

.mcc2026 .m-hero__chips {
    list-style: none;
    margin: 2.5rem 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 2.25rem;
}
.mcc2026 .m-hero__chips .m-chip { color: rgba(255, 255, 255, 0.92); }

/* Rangée d'atouts sur toute la largeur du header, sur une seule ligne :
   elle échappe à la largeur de la colonne de texte, et chaque atout prend
   une part égale, séparé du suivant par un filet. En dessous de 1100 px,
   la rangée repasse à la ligne. */
.mcc2026 .m-hero__inner > .m-hero__chips {
    max-width: none;
    /* Du bord gauche du texte jusqu'à la marge droite de l'écran. */
    width: calc(100vw - max(0px, calc((100vw - var(--m-container)) / 2 - 3rem)) - 2 * var(--m-gutter, 1.5rem));
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    gap: 0;
}
.mcc2026 .m-hero__chips .m-chip {
    align-items: flex-start;
    padding-inline: 0.8rem;
    border-inline-start: 1px solid rgba(255, 255, 255, 0.18);
}
.mcc2026 .m-hero__chips .m-chip:first-child { padding-inline-start: 0; border-inline-start: 0; }
.mcc2026 .m-chip__title { display: block; font-weight: 600; font-size: 0.8rem; white-space: nowrap; }
.mcc2026 .m-chip__text { display: block; margin-top: 0.3rem; font-size: 0.7rem; line-height: 1.35; color: rgba(255, 255, 255, 0.72); }
@media (max-width: 1100px) {
    .mcc2026 .m-hero__inner > .m-hero__chips {
        grid-auto-flow: row;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        row-gap: 1rem;
    }
    .mcc2026 .m-hero__chips .m-chip:nth-child(3n + 1) { padding-inline-start: 0; border-inline-start: 0; }
}
@media (max-width: 560px) {
    .mcc2026 .m-hero__inner > .m-hero__chips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mcc2026 .m-hero__chips .m-chip:nth-child(3n + 1) { padding-inline-start: 0.8rem; border-inline-start: 1px solid rgba(255, 255, 255, 0.18); }
    .mcc2026 .m-hero__chips .m-chip:nth-child(2n + 1) { padding-inline-start: 0; border-inline-start: 0; }
    /* Deux colonnes étroites : le titre passe à la ligne au lieu de déborder
       sur le filet de la colonne voisine (17/10/2026). */
    .mcc2026 .m-hero__chips .m-chip { min-width: 0; }
    .mcc2026 .m-hero__chips .m-chip__title { white-space: normal; }
}

/* Annotation manuscrite : posée en bas à droite du visuel sur grand écran,
   masquée sous 900px où elle n'aurait plus de place pour respirer. */
.mcc2026 .m-hero__annotation {
    position: absolute;
    right: clamp(1rem, 4vw, 4rem);
    bottom: clamp(3rem, 12vh, 7rem);
    z-index: 2;
    max-width: 18rem;
    text-align: center;
}
[dir='rtl'] .mcc2026 .m-hero__annotation {
    right: auto;
    left: clamp(1rem, 4vw, 4rem);
}
@media (max-width: 900px) {
    .mcc2026 .m-hero__annotation { display: none; }
}

/* ─────────────────────────────────────────────────────────────────────────
   mcc_quick_access
   ───────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-quick__grid {
    display: grid;
    grid-template-columns: minmax(0, 22rem) minmax(0, 1fr);
    gap: clamp(1.5rem, 3vw, 3.5rem);
    align-items: start;
}
@media (max-width: 1000px) {
    .mcc2026 .m-quick__grid { grid-template-columns: minmax(0, 1fr); }
}

.mcc2026 .m-quick__intro .m-lead { font-size: 0.98rem; margin-top: 0.85rem; }

/* `auto-fill` plutôt qu'un nombre fixe de colonnes : la grille recense tous
   les services de MCC, et leur nombre change au fil du temps. Six tuiles
   comme quatorze doivent se ranger sans qu'on retouche la feuille. */
.mcc2026 .m-quick__tiles {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
    gap: 0.75rem;
}
@media (max-width: 640px) {
    .mcc2026 .m-quick__tiles { grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); }
}
@media (max-width: 380px) {
    .mcc2026 .m-quick__tiles { grid-template-columns: minmax(0, 1fr); }
}

.mcc2026 .m-quick__tile {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    height: 100%;
    padding: 1.1rem 1rem 1rem;
    border: 1px solid var(--m-border);
    border-radius: var(--m-radius);
    background: var(--m-surface);
    color: var(--m-ink);
    text-decoration: none;
    transition: border-color 0.2s, box-shadow 0.25s var(--m-ease), transform 0.25s var(--m-ease);
}
.mcc2026 .m-quick__tile:hover {
    border-color: color-mix(in srgb, var(--m-red) 35%, transparent);
    box-shadow: var(--m-shadow-md);
    transform: translateY(-3px);
}
.mcc2026 .m-quick__tile:focus-visible { outline: 2px solid var(--m-red); outline-offset: 3px; }

/* La tuile mise en avant reprend le rouge de la marque, en fond très léger —
   elle doit se distinguer sans devenir un second bouton d'appel à l'action. */
.mcc2026 .m-quick__tile.is-highlight {
    background: var(--m-red-soft);
    border-color: color-mix(in srgb, var(--m-red) 25%, transparent);
}

.mcc2026 .m-quick__icon { color: var(--m-navy); }
.mcc2026 .m-quick__icon svg { width: 1.6rem; height: 1.6rem; }
.mcc2026 .m-quick__tile.is-highlight .m-quick__icon { color: var(--m-red); }

.mcc2026 .m-quick__label {
    font-size: 0.86rem;
    font-weight: 600;
    line-height: 1.3;
    flex: 1;
}

.mcc2026 .m-quick__tile .m-arrow { width: 1.9rem; height: 1.9rem; align-self: flex-start; }
.mcc2026 .m-quick__tile .m-arrow svg { width: 0.85rem; height: 0.85rem; }

@supports not (color: color-mix(in srgb, red 50%, transparent)) {
    .mcc2026 .m-quick__tile:hover { border-color: color-mix(in srgb, var(--m-red, #cc0000) 35%, transparent); }
    .mcc2026 .m-quick__tile.is-highlight { border-color: color-mix(in srgb, var(--m-red, #cc0000) 25%, transparent); }
}

/* ─────────────────────────────────────────────────────────────────────────
   mcc_partner_feature
   ───────────────────────────────────────────────────────────────────────── */

/* Une carte blanche par partenaire, posée sur le fond clair de la page :
   texte à gauche, photo arrondie à droite (ou l'inverse avec is-reversed).
   Les blocs se suivent serrés — ils forment un seul groupe. */
.mcc2026 .m-partner {
    position: relative;
    padding-block: clamp(0.6rem, 1.2vw, 1rem);
    background: var(--m-canvas, #faf8f4);
}
.mcc2026 .m-partner.has-group-head { padding-top: clamp(2.5rem, 5vw, 4.5rem); }
.mcc2026 .m-partner:not(.m-partner + .m-partner) { padding-top: clamp(2.5rem, 5vw, 4.5rem); }
.mcc2026 .m-partner:not(:has(+ .m-partner)) { padding-bottom: clamp(2.5rem, 5vw, 4.5rem); }

/* En-tête du groupe, avec une trame de points en guise de carte du monde. */
.mcc2026 .m-partner__group-head {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    margin-bottom: clamp(1.25rem, 2.5vw, 2rem);
}
.mcc2026 .m-partner__group-copy { position: relative; z-index: 1; max-width: 42rem; }
.mcc2026 .m-partner__group-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--m-red);
}
.mcc2026 .m-partner__group-eyebrow svg { width: 1rem; height: 1rem; }
.mcc2026 .m-partner__group-title {
    margin: 0.6rem 0 0;
    font-family: var(--m-font-display);
    font-size: clamp(2rem, 1.4rem + 2vw, 3.1rem);
    font-weight: 700;
    line-height: 1.08;
    color: var(--m-navy, #00071d);
}
.mcc2026 .m-partner__group-text {
    margin: 0.75rem 0 0;
    font-size: 1rem;
    line-height: 1.55;
    color: var(--m-muted);
}
.mcc2026 .m-partner__map {
    position: relative;
    flex: none;
    width: clamp(14rem, 36vw, 32rem);
    aspect-ratio: 720 / 270;
}
.mcc2026 .m-partner__map img {
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0.32;
}
.mcc2026 .m-partner__pin {
    position: absolute;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: var(--m-red);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--m-red, #cc0000) 15%, transparent);
    transform: translate(-50%, -50%);
}

.mcc2026 .m-partner__card {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: clamp(1.25rem, 3vw, 2.5rem);
    align-items: stretch;
    padding: clamp(1.25rem, 2.5vw, 2rem);
    background: var(--m-surface, #fff);
    border-radius: 1.1rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 16px 40px -24px rgba(15, 23, 42, 0.22);
}
.mcc2026 .m-partner.is-reversed .m-partner__body { order: 2; }
.mcc2026 .m-partner.is-flat .m-partner__card { grid-template-columns: minmax(0, 1fr); }

.mcc2026 .m-partner__body { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }

.mcc2026 .m-partner__meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--m-ink);
}
.mcc2026 .m-partner__num { color: var(--m-red); font-size: 0.95rem; font-weight: 700; letter-spacing: 0; }
.mcc2026 .m-partner__num + .m-partner__eyebrow { padding-inline-start: 0.75rem; border-inline-start: 1px solid color-mix(in srgb, var(--site-ink, #0f172a) 20%, transparent); }

.mcc2026 .m-partner__brand {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
    margin-top: 1.1rem;
}
.mcc2026 .m-partner__logo { height: clamp(2.8rem, 4vw, 3.6rem); width: auto; max-width: 16rem; object-fit: contain; }
.mcc2026 .m-partner__name {
    margin: 0;
    font-family: var(--m-font-display);
    font-size: clamp(1.25rem, 1rem + 0.8vw, 1.6rem);
    font-weight: 700;
    line-height: 1.15;
    color: var(--m-navy, #00071d);
    max-width: 18em;
}
.mcc2026 .m-partner__country {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.82rem;
    color: var(--m-ink);
}
.mcc2026 .m-partner__country img { width: 1.6rem; height: auto; border-radius: 2px; box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.08); }

.mcc2026 .m-partner__tagline {
    margin: 1.1rem 0 0;
    font-size: clamp(1.02rem, 0.95rem + 0.3vw, 1.2rem);
    line-height: 1.4;
    color: var(--m-navy, #00071d);
    max-width: 32ch;
}
.mcc2026 .m-partner__text { margin: 0.75rem 0 0; font-size: 0.92rem; line-height: 1.55; color: var(--m-muted); }
.mcc2026 .m-partner__checklist { margin-top: 1rem; }
.mcc2026 .m-partner__cta { margin-top: 1.4rem; }

.mcc2026 .m-partner__media { position: relative; min-height: clamp(16rem, 26vw, 22rem); }
.mcc2026 .m-partner__photo {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: 0.9rem;
    background: var(--m-navy, #00071d);
}
.mcc2026 .m-partner__photo > img,
.mcc2026 .m-partner__photo > video,
.mcc2026 .m-partner__photo > iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 0;
}
.mcc2026 .m-partner__play {
    position: absolute;
    inset-inline-end: 1.1rem;
    inset-block-end: 1.1rem;
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 1.1rem 0.45rem 0.45rem;
    border: 0;
    border-radius: 999px;
    background: var(--site-surface, #fff);
    color: var(--m-navy, #00071d);
    font: inherit;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 8px 24px -12px rgba(0, 7, 29, 0.5);
    transition: transform var(--m-ease-fast, 0.2s ease);
}
.mcc2026 .m-partner__play:hover,
.mcc2026 .m-partner__play:focus-visible { transform: translateY(-1px); }
.mcc2026 .m-partner__play-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: var(--m-navy, #00071d);
    color: #fff;
}
.mcc2026 .m-partner__play-icon svg { width: 0.85rem; height: 0.85rem; fill: currentColor; margin-inline-start: 0.1rem; }

@media (max-width: 860px) {
    .mcc2026 .m-partner__card { grid-template-columns: minmax(0, 1fr); }
    .mcc2026 .m-partner.is-reversed .m-partner__body { order: 0; }
    .mcc2026 .m-partner__map { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .mcc2026 .m-partner__play { transition: none; }
}

/* ─────────────────────────────────────────────────────────────────────────
   mcc_formations_tabs
   ───────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-formations__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
}
.mcc2026 .m-formations__all { white-space: nowrap; }

/* La carte entière est cliquable : le lien enveloppe le contenu, il doit donc
   redevenir un conteneur de blocs. */
.mcc2026 .m-formations__link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
}
.mcc2026 .m-formations__link:focus-visible { outline: 2px solid var(--m-red); outline-offset: 3px; }
.mcc2026 .m-formations__link .m-card__media { display: block; }
.mcc2026 .m-formations__link .m-card__body { display: flex; }
.mcc2026 .m-formations__link .m-card__title,
.mcc2026 .m-formations__link .m-card__text { display: block; }
.mcc2026 .m-formations__link .m-meta { display: flex; }
.mcc2026 .m-formations__link .m-card__footer { display: flex; }

.mcc2026 .m-formations__panel[hidden] { display: none; }

/* ─────────────────────────────────────────────────────────────────────────
   mcc_journey
   ───────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-journey { position: relative; overflow: hidden; }
.mcc2026 .m-journey > .m-container { position: relative; z-index: 1; }

/* Photo à droite, fondue dans le bleu nuit — la timeline garde un fond uni
   sous elle, sans quoi les libellés blancs se perdraient dans l'image. */
.mcc2026 .m-journey__photo {
    position: absolute;
    inset-block: 0;
    inset-inline-end: 0;
    width: 38%;
    z-index: 0;
    pointer-events: none;
}
.mcc2026 .m-journey__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Même dégradé angulaire que le hero et les blocs partenaires. */
.mcc2026 .m-journey__photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 7, 29, var(--m-photo-veil, 0.92));
    clip-path: polygon(0 0, 42% 0, 22% 100%, 0 100%);
}
[dir='rtl'] .mcc2026 .m-journey__photo::after {
    clip-path: polygon(58% 0, 100% 0, 100% 100%, 78% 100%);
}
@media (max-width: 900px) {
    .mcc2026 .m-journey__photo { width: 100%; }
    .mcc2026 .m-journey__photo::after,
    [dir='rtl'] .mcc2026 .m-journey__photo::after { clip-path: none; }
}

.mcc2026 .m-journey__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem 3rem;
    flex-wrap: wrap;
    margin-bottom: clamp(2rem, 4vw, 3.5rem);
}
.mcc2026 .m-journey__quote {
    font-family: var(--m-font-display);
    font-style: italic;
    font-size: clamp(0.98rem, 0.85rem + 0.5vw, 1.2rem);
    color: rgba(255, 255, 255, 0.8);
    max-width: 24rem;
    margin: 0;
}

.mcc2026 .m-journey__steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(var(--m-journey-cols, 5), minmax(0, 1fr));
    gap: 1rem;
    position: relative;
}
@media (max-width: 1100px) { .mcc2026 .m-journey__steps { --m-journey-cols: 3; row-gap: 2.5rem; } }
@media (max-width: 680px)  { .mcc2026 .m-journey__steps { --m-journey-cols: 1; row-gap: 1.75rem; } }

.mcc2026 .m-journey__step {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    position: relative;
    padding-top: 3.75rem;
}
/* Le fil qui relie les étapes est décoratif : en ::before plutôt qu'en
   balise, et retiré dès que les étapes s'empilent. */
.mcc2026 .m-journey__step::before {
    content: "";
    position: absolute;
    top: 1.4rem;
    inset-inline-start: 2.8rem;
    inset-inline-end: -1rem;
    height: 1px;
    background: rgba(255, 255, 255, 0.22);
}
.mcc2026 .m-journey__step:last-child::before { display: none; }
@media (max-width: 680px) { .mcc2026 .m-journey__step::before { display: none; } }

.mcc2026 .m-journey__dot {
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.28);
    color: #fff;
}
.mcc2026 .m-journey__dot svg { width: 1.25rem; height: 1.25rem; }
.mcc2026 .m-journey__step.is-current .m-journey__dot {
    background: var(--m-red);
    border-color: var(--m-red);
}

.mcc2026 .m-journey__title {
    font-family: var(--m-font-display);
    font-size: 1.05rem;
    font-weight: 600;
    color: #fff;
}
.mcc2026 .m-journey__step.is-current .m-journey__title { color: #ff8a8a; }
.mcc2026 .m-journey__text { font-size: var(--m-small); color: rgba(255, 255, 255, 0.72); line-height: 1.5; }

/* ─────────────────────────────────────────────────────────────────────────
   mcc_stats + carte d'inscription (partagée avec mcc_newsletter)
   ───────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-stats__head { margin-bottom: clamp(1.5rem, 3vw, 2.5rem); }

.mcc2026 .m-stats__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(1.5rem, 3vw, 3rem);
    align-items: center;
}
.mcc2026 .m-stats__row.has-aside { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
@media (max-width: 1000px) {
    .mcc2026 .m-stats__row.has-aside { grid-template-columns: minmax(0, 1fr); }
}

.mcc2026 .m-stats__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--m-gap);
}
@media (max-width: 900px) { .mcc2026 .m-stats__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .mcc2026 .m-stats__list { grid-template-columns: minmax(0, 1fr); } }

/* Un chiffre ne se coupe pas : « 2 000+ » réparti sur deux lignes ne se lit
   plus comme une valeur. Limité à cette rangée — les « valeurs » des blocs
   partenaires sont des mots, qui doivent pouvoir passer à la ligne. */
.mcc2026 .m-stats__list .m-stat__value { white-space: nowrap; }

.mcc2026 .m-newsletter {
    background: var(--m-red);
    color: #fff;
    border-radius: var(--m-radius);
    padding: clamp(1.25rem, 2.5vw, 2rem);
    box-shadow: var(--m-shadow-md);
}
.mcc2026 .m-newsletter__head { display: flex; align-items: center; gap: 0.75rem; }
.mcc2026 .m-newsletter__icon svg { width: 1.6rem; height: 1.6rem; }
.mcc2026 .m-newsletter__title {
    font-family: var(--m-font-display);
    font-size: 1.15rem;
    font-weight: 600;
    line-height: 1.25;
    margin: 0;
    /* La feuille de base du site colore tous les titres (h1…h6). Une couleur
       posée sur l'élément l'emporte sur l'héritage quelle que soit la
       spécificité : sans ce `inherit`, le titre ressort gris foncé sur le
       fond rouge de la carte. */
    color: inherit;
}
.mcc2026 .m-newsletter__text {
    font-size: var(--m-small);
    color: rgba(255, 255, 255, 0.88);
    margin: 0.85rem 0 1.25rem;
}

.mcc2026 .m-newsletter__form {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--site-surface, #fff);
    border-radius: var(--m-radius-btn);
    padding-block: 0.3rem;
    padding-inline: 1rem 0.3rem;
}
.mcc2026 .m-newsletter__form input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: var(--m-small);
    color: var(--m-ink);
    padding: 0.55rem 0;
}
.mcc2026 .m-newsletter__form input:focus { outline: none; }
/* Le contour de focus est porté par le conteneur : l'input n'a pas de bord
   propre, un outline dessus flotterait au milieu de la pilule. */
.mcc2026 .m-newsletter__form:focus-within { outline: 2px solid #fff; outline-offset: 2px; }
.mcc2026 .m-newsletter__form button {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    border: 0;
    border-radius: var(--site-radius-btn, 999px);
    background: var(--m-red);
    color: #fff;
    cursor: pointer;
    transition: background-color 0.2s;
}
.mcc2026 .m-newsletter__form button:hover { background: var(--m-red-dark); }
.mcc2026 .m-newsletter__form button svg { width: 1rem; height: 1rem; }

.mcc2026 .m-newsletter__fallback { margin-top: 0.25rem; }

/* ─────────────────────────────────────────────────────────────────────────
   mcc_testimonials
   ───────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-testi__head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}
.mcc2026 .m-testi__nav { display: flex; gap: 0.5rem; }

.mcc2026 .m-testi__track {
    list-style: none;
    margin: 0;
    padding: 0.25rem;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(min(21rem, 82vw), 1fr);
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    /* La piste déborde volontairement des gouttières pour que la carte
       suivante s'amorce au bord de l'écran. */
    margin-inline: calc(var(--m-gutter) * -1);
    padding-inline: var(--m-gutter);
}
.mcc2026 .m-testi__track::-webkit-scrollbar { display: none; }
.mcc2026 .m-testi__track:focus-visible { outline: 2px solid var(--m-red); outline-offset: 2px; }

.mcc2026 .m-testi__card {
    scroll-snap-align: start;
    padding: 1.25rem;
    gap: 0.9rem;
}

.mcc2026 .m-testi__person { display: flex; align-items: center; gap: 0.75rem; }
.mcc2026 .m-testi__photo {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999px;
    object-fit: cover;
    flex: none;
}
.mcc2026 .m-testi__photo--empty {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--m-navy);
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
}
.mcc2026 .m-testi__name { display: block; font-weight: 600; font-size: 0.92rem; }
.mcc2026 .m-testi__role { display: block; font-size: var(--m-tiny); color: var(--m-muted); }

.mcc2026 .m-testi__quote {
    margin: 0;
    font-size: var(--m-small);
    line-height: 1.6;
    color: var(--m-ink);
}

.mcc2026 .m-testi__rating { margin-top: auto; color: var(--site-accent, #b8860b); display: flex; }
.mcc2026 .m-testi__rating svg { width: 0.95rem; height: 0.95rem; fill: none; }
.mcc2026 .m-testi__rating svg.is-on { fill: currentColor; }

/* ──────────────────────────────────────────────────────────────────────────
   mcc_partners_strip — bandeau de logos
   ────────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-logos__head {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}
.mcc2026 .m-logos__title {
    font-family: var(--m-font-display);
    font-size: clamp(1.2rem, 1rem + 0.9vw, 1.75rem);
    font-weight: 600;
    line-height: 1.2;
    color: var(--m-ink);
    margin: 0;
}

/* Grille plutôt que flex : des logos de largeurs très inégales (un sigle
   carré à côté d'un logotype large) occupent alors la même case, et la
   rangée reste régulière. `auto-fit` évite d'avoir à fixer un nombre de
   colonnes qui dépendrait du nombre de partenaires du moment. */
.mcc2026 .m-logos__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: clamp(1.25rem, 3vw, 2.75rem);
    align-items: center;
}
.mcc2026 .m-logos__item {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 3.5rem;
}
.mcc2026 .m-logos__item a { display: block; line-height: 0; }
.mcc2026 .m-logos__item img {
    max-height: 3.25rem;
    max-width: 100%;
    width: auto;
    object-fit: contain;
    display: block;
}

/* Désaturés au repos : une rangée de logos multicolores tire l'œil plus
   que le contenu au-dessus d'elle. La couleur revient au survol, et au
   focus clavier — sinon la même information ne serait accessible qu'à la
   souris. */
.mcc2026 .m-logos.is-gray .m-logos__item img {
    filter: grayscale(1);
    opacity: 0.62;
    transition: filter var(--m-ease-fast, 0.2s ease), opacity var(--m-ease-fast, 0.2s ease);
}
.mcc2026 .m-logos.is-gray .m-logos__item img:hover,
.mcc2026 .m-logos.is-gray .m-logos__item a:focus-visible img {
    filter: grayscale(0);
    opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
    .mcc2026 .m-logos.is-gray .m-logos__item img { transition: none; }
}

@media (max-width: 600px) {
    .mcc2026 .m-logos__list { grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr)); }
    .mcc2026 .m-logos__item img { max-height: 2.5rem; }
}

/* ─────────────────────────────────────────────────────────────────────────
   mcc_why — « Pourquoi choisir MCC ? »
   ───────────────────────────────────────────────────────────────────────── */

/* Trois colonnes : discours, photo inclinée, cartes. Les proportions
   reprennent la maquette ; en dessous de 1100 px la grille de cartes passe
   sous le discours, en dessous de 700 px tout s'empile. */
/* Section plus large que le conteneur standard : trois colonnes dont une
   grille de trois cartes n'y tiendraient qu'à l'étroit. */
.mcc2026 .m-why__layout {
    max-width: 1520px;
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(0, 0.9fr) minmax(0, 3.1fr);
    gap: clamp(1.25rem, 2.5vw, 2rem);
    align-items: center;
}
.mcc2026 .m-why__layout.is-no-photo { grid-template-columns: minmax(0, 1.2fr) minmax(0, 2.4fr); }

.mcc2026 .m-why__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.9rem;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--m-red);
}
.mcc2026 .m-why__eyebrow::before {
    content: '';
    width: 2.75rem;
    height: 2px;
    background: currentColor;
}
.mcc2026 .m-why__title {
    font-family: var(--m-font-display);
    font-size: clamp(2rem, 1.35rem + 1.9vw, 3.1rem);
    font-weight: 700;
    line-height: 1.08;
    color: var(--m-navy, #00071d);
    margin: 1rem 0 0;
}
.mcc2026 .m-why__lead {
    margin: 1rem 0 0;
    font-size: clamp(1rem, 0.95rem + 0.2vw, 1.12rem);
    line-height: 1.55;
    color: var(--m-muted);
}
.mcc2026 .m-why__cta { margin-top: 1.5rem; }

.mcc2026 .m-why__stats {
    display: flex;
    margin: clamp(1.5rem, 3vw, 2.25rem) 0 0;
}
.mcc2026 .m-why__stat { padding-inline: 1.1rem; border-inline-start: 1px solid color-mix(in srgb, var(--site-ink, #0f172a) 12%, transparent); }
.mcc2026 .m-why__stat:first-child { padding-inline-start: 0; border-inline-start: 0; }
.mcc2026 .m-why__stat-value {
    font-size: clamp(1.3rem, 1.1rem + 0.6vw, 1.65rem);
    font-weight: 700;
    color: var(--m-navy, #00071d);
    line-height: 1.1;
}
.mcc2026 .m-why__stat-label { margin: 0.35rem 0 0; font-size: 0.82rem; line-height: 1.35; color: var(--m-muted); }

/* Photo en parallélogramme : le cadre est incliné, l'image contre-inclinée
   et agrandie pour rester droite et couvrir les coins. Un aplat rose et un
   trait rouge, inclinés pareil, l'accompagnent comme sur la maquette. */
/* L'inclinaison fait déborder le bas de la photo vers la gauche : la marge
   l'empêche de mordre sur les chiffres de la colonne voisine. */
.mcc2026 .m-why__visual {
    position: relative;
    align-self: stretch;
    margin-inline-start: clamp(1.5rem, 3.5vw, 3.5rem);
    min-height: clamp(22rem, 34vw, 32rem);
}
.mcc2026 .m-why__photo,
.mcc2026 .m-why__visual-accent {
    position: absolute;
    border-radius: 1.25rem;
    transform: skewX(-12deg);
}
.mcc2026 .m-why__photo {
    inset: 0 0 0 8%;
    overflow: hidden;
    box-shadow: 0 24px 48px -24px rgba(0, 7, 29, 0.35);
}
.mcc2026 .m-why__photo img {
    position: absolute;
    inset: 0 -40%;
    width: 180%;
    max-width: none;
    height: 100%;
    object-fit: cover;
    transform: skewX(12deg);
}
.mcc2026 .m-why__visual-accent {
    top: 10%;
    left: -2%;
    width: 30%;
    height: 32%;
    background: #fbd5da;
}
.mcc2026 .m-why__visual-line {
    position: absolute;
    left: -22%;
    bottom: 3%;
    width: 3px;
    height: 38%;
    background: var(--m-red);
    border-radius: 2px;
    transform: skewX(-12deg);
    transform-origin: bottom;
}

.mcc2026 .m-why__grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(0.75rem, 1.5vw, 1.25rem);
}

/* Pas d'état de survol : ces cartes ne sont pas cliquables, et un survol
   promettrait une action qui n'existe pas. */
.mcc2026 .m-why__card {
    padding: clamp(1rem, 1.5vw, 1.4rem);
    background: var(--m-surface);
    border-radius: 1rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 32px -18px rgba(15, 23, 42, 0.18);
}
.mcc2026 .m-why__card-head { display: flex; align-items: center; gap: 0.85rem; min-width: 0; }

.mcc2026 .m-why__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
}
.mcc2026 .m-why__icon svg { width: 1.4rem; height: 1.4rem; stroke-width: 1.75; }
.mcc2026 .m-why__icon--red { background: var(--site-red-soft, #fde2e5); color: var(--site-red, #e0283d); }
.mcc2026 .m-why__icon--blue { background: #e1ebff; color: #2563eb; }
.mcc2026 .m-why__icon--green { background: #dcf5e4; color: #16a34a; }
.mcc2026 .m-why__icon--amber { background: #fdf0d3; color: #d97706; }
.mcc2026 .m-why__icon--pink { background: var(--site-red-soft, #fde2ea); color: var(--site-red, #e0283d); }
.mcc2026 .m-why__icon--violet { background: #ece6fe; color: #6d3fe0; }

.mcc2026 .m-why__card-title {
    margin: 0;
    font-size: 0.98rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--m-navy, #00071d);
}
.mcc2026 .m-why__card-text {
    margin: 1rem 0 0;
    font-size: 0.88rem;
    line-height: 1.6;
    color: var(--m-muted);
}

@media (max-width: 1100px) {
    .mcc2026 .m-why__layout,
    .mcc2026 .m-why__layout.is-no-photo { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
    .mcc2026 .m-why__grid { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
    .mcc2026 .m-why__layout,
    .mcc2026 .m-why__layout.is-no-photo { grid-template-columns: minmax(0, 1fr); }
    .mcc2026 .m-why__visual { min-height: 16rem; margin-inline: 1.5rem; }
    .mcc2026 .m-why__grid { grid-template-columns: minmax(0, 1fr); }
    .mcc2026 .m-why__stats { flex-wrap: wrap; row-gap: 1rem; }
}
@media (min-width: 701px) and (max-width: 900px) {
    .mcc2026 .m-why__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Pleine largeur : le bandeau court d'un bord à l'autre de l'écran, sans
   marge ni coins arrondis ; le texte, lui, s'aligne sur la grille du site
   (padding calculé sur la largeur du conteneur standard). */
.mcc2026 .m-why--banner { padding-block: 0; }
.mcc2026 .m-why--banner .m-container { max-width: none; padding-inline: 0; }

/* Disposition « bandeau » : une carte bleu nuit arrondie, la photo occupe la
   droite et se fond dans le bleu vers la gauche ; les engagements courent
   en ligne en bas, les chiffres tiennent dans un panneau blanc biseauté. */
.mcc2026 .m-whyb {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: clamp(1.5rem, 3vw, 2.5rem);
    min-height: clamp(20rem, 26vw, 24rem);
    padding: clamp(2rem, 4vw, 3rem) 0 0 max(var(--m-gutter, 1.5rem), calc((100vw - var(--m-container)) / 2 + var(--m-gutter, 1.5rem)));
    background: var(--m-navy, #00071d);
}
.mcc2026 .m-whyb__photo { position: absolute; inset: 0 0 0 30%; z-index: 0; }
.mcc2026 .m-whyb__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mcc2026 .m-whyb__photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(to right, var(--m-navy, #00071d) 0%, color-mix(in srgb, var(--site-navy, #00071d) 55%, transparent) 30%, color-mix(in srgb, var(--site-navy, #00071d) 10%, transparent) 60%, color-mix(in srgb, var(--site-navy, #00071d) 0%, transparent) 100%),
        linear-gradient(to top, color-mix(in srgb, var(--site-navy, #00071d) 92%, transparent) 0%, color-mix(in srgb, var(--site-navy, #00071d) 70%, transparent) 40%, color-mix(in srgb, var(--site-navy, #00071d) 0%, transparent) 75%);
}

.mcc2026 .m-whyb__head { position: relative; z-index: 1; max-width: 36rem; }
.mcc2026 .m-whyb__title {
    margin: 0.6rem 0 0;
    font-family: var(--m-font-display);
    font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.6rem);
    font-weight: 700;
    line-height: 1.1;
    color: #fff;
}
.mcc2026 .m-whyb__lead { margin: 0.6rem 0 0; font-size: clamp(0.98rem, 0.9rem + 0.3vw, 1.15rem); color: rgba(255, 255, 255, 0.9); }
.mcc2026 .m-whyb__cta { margin-top: 1.1rem; }

/* Engagements et chiffres ne partagent jamais la même ligne : à côté du
   panneau, six colonnes n'ont pas la place et les libellés se chevauchent.
   Les engagements prennent toute la largeur de la grille du site, le
   panneau de chiffres se range dessous, dans le coin droit. */
.mcc2026 .m-whyb__foot {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.5rem;
}

.mcc2026 .m-whyb__items {
    list-style: none;
    margin: 0;
    padding: 0 max(var(--m-gutter, 1.5rem), calc((100vw - var(--m-container)) / 2 + var(--m-gutter, 1.5rem))) clamp(0.5rem, 1.5vw, 1rem) 0;
    display: grid;
    /* Colonnes égales, mais jamais plus étroites que leur contenu : un titre
       plus long (« Accompagnement / des jeunes diplômés ») élargit sa colonne
       au lieu de passer sur trois lignes ou de déborder sur la voisine. */
    grid-template-columns: repeat(6, minmax(min-content, 1fr));
    row-gap: 1.25rem;
}
.mcc2026 .m-whyb__foot.is-no-stats .m-whyb__items { padding-bottom: clamp(1.5rem, 3vw, 2.25rem); }
.mcc2026 .m-whyb__item {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    min-width: min-content;
    padding-inline: 0.75rem;
    border-inline-start: 1px solid rgba(255, 255, 255, 0.18);
}
.mcc2026 .m-whyb__item:first-child { padding-inline-start: 0; border-inline-start: 0; }
.mcc2026 .m-whyb__icon {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    border: 1.5px solid rgba(255, 255, 255, 0.85);
    color: #fff;
}
.mcc2026 .m-whyb__icon svg { width: 1.25rem; height: 1.25rem; stroke-width: 1.75; }
.mcc2026 .m-whyb__item-title { display: block; font-size: 0.85rem; font-weight: 700; line-height: 1.3; color: #fff; white-space: nowrap; }
.mcc2026 .m-whyb__item-text { display: block; margin-top: 0.45rem; font-size: 0.72rem; line-height: 1.4; color: rgba(255, 255, 255, 0.8); }

/* Panneau blanc biseauté, collé au coin bas-droit de la carte. */
.mcc2026 .m-whyb__stats {
    justify-self: end;
    display: flex;
    margin: 0;
    padding: 1.5rem clamp(1.25rem, 2.5vw, 2rem) 1.5rem 5.5rem;
    background: var(--site-surface, #fff);
    padding-inline-end: max(var(--m-gutter, 1.5rem), calc((100vw - var(--m-container)) / 2 + var(--m-gutter, 1.5rem)));
    /* Biseau de largeur fixe : en pourcentage, il s'élargissait avec le
       panneau et finissait par couper le premier chiffre. */
    clip-path: polygon(4.5rem 0, 100% 0, 100% 100%, 0 100%);
    color: var(--m-navy, #00071d);
}
.mcc2026 .m-whyb__stat { padding-inline: 0.85rem; border-inline-start: 1px solid color-mix(in srgb, var(--site-ink, #0f172a) 15%, transparent); }
.mcc2026 .m-whyb__stat:first-child { border-inline-start: 0; }
.mcc2026 .m-whyb__stat-value { font-size: clamp(1.3rem, 1.1rem + 0.6vw, 1.6rem); font-weight: 700; line-height: 1.1; }
.mcc2026 .m-whyb__stat-label { margin: 0.3rem 0 0; max-width: 6.5rem; font-size: 0.72rem; line-height: 1.35; color: var(--m-muted); }

@media (max-width: 1180px) {
    .mcc2026 .m-whyb__items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .mcc2026 .m-whyb__item:nth-child(3n + 1) { padding-inline-start: 0; border-inline-start: 0; }
}
@media (max-width: 640px) {
    .mcc2026 .m-whyb__photo { inset: 0; }
    .mcc2026 .m-whyb__photo::after { background: color-mix(in srgb, var(--site-navy, #00071d) 78%, transparent); }
    .mcc2026 .m-whyb__items { grid-template-columns: minmax(0, 1fr); }
    .mcc2026 .m-whyb__item { min-width: 0; padding-inline-start: 0; border-inline-start: 0; }
    .mcc2026 .m-whyb__item-title { white-space: normal; }
    .mcc2026 .m-whyb__stats { justify-self: stretch; clip-path: none; border-radius: 0; padding-inline-start: 1.25rem; }
}

/* ─────────────────────────────────────────────────────────────────────────
   mcc_video_quote — extrait vidéo + parole signée
   ───────────────────────────────────────────────────────────────────────── */

/* Bandeau bleu nuit pleine largeur : la photo part du bord gauche de
   l'écran et se fond dans le bleu, la citation tient la droite. Le bandeau
   est la section elle-même, sans marge verticale autour. */
.mcc2026 .m-vq {
    padding-block: 0;
    background: var(--m-navy, #00071d);
}
.mcc2026 .m-vq__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    align-items: stretch;
    min-height: clamp(16rem, 24vw, 22rem);
}

.mcc2026 .m-vq__media,
.mcc2026 .m-vq__poster,
.mcc2026 .m-vq__player {
    position: relative;
    min-height: 14rem;
    height: 100%;
}
.mcc2026 .m-vq__poster img,
.mcc2026 .m-vq__player video,
.mcc2026 .m-vq__player iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 45%;
    border: 0;
    display: block;
}
/* Fondu vers le bleu nuit côté citation, et voile à gauche pour que le
   bouton et sa légende restent lisibles sur la photo. */
.mcc2026 .m-vq__poster::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(to right, color-mix(in srgb, var(--site-navy, #00071d) 78%, transparent) 0%, color-mix(in srgb, var(--site-navy, #00071d) 25%, transparent) 38%, color-mix(in srgb, var(--site-navy, #00071d) 0%, transparent) 60%, var(--m-navy, #00071d) 100%);
}

/* Le bouton couvre toute l'affiche : la cible est l'image entière et non le
   petit rond seul, ce qui la rend atteignable au doigt. */
.mcc2026 .m-vq__play {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 1rem;
    padding: clamp(1.25rem, 3vw, 2.25rem);
    background: none;
    border: 0;
    color: #fff;
    text-align: start;
    font: inherit;
    cursor: pointer;
}
.mcc2026 .m-vq__play.is-static { cursor: default; }
.mcc2026 .m-vq__play-ring {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.9);
    background: rgba(255, 255, 255, 0.06);
    transition: background var(--m-ease-fast, 0.2s ease), transform var(--m-ease-fast, 0.2s ease);
}
.mcc2026 .m-vq__play:not(.is-static):hover .m-vq__play-ring,
.mcc2026 .m-vq__play:not(.is-static):focus-visible .m-vq__play-ring {
    background: rgba(255, 255, 255, 0.2);
    transform: scale(1.06);
}
.mcc2026 .m-vq__play-ring svg { width: 1.35rem; height: 1.35rem; fill: currentColor; margin-inline-start: 0.15rem; }

.mcc2026 .m-vq__play-label {
    font-size: 0.9rem;
    line-height: 1.4;
    max-width: 14rem;
    color: #fff;
}

@media (prefers-reduced-motion: reduce) {
    .mcc2026 .m-vq__play-ring { transition: none; }
}

/* Le bord droit de la citation s'aligne sur celui du conteneur du site,
   même quand le bandeau, lui, court jusqu'au bord de l'écran. */
.mcc2026 .m-vq__quote {
    margin: 0;
    padding-block: clamp(1.75rem, 4vw, 3rem);
    padding-inline: clamp(1.5rem, 4vw, 3.25rem) max(var(--m-gutter, 1.5rem), calc((100vw - var(--m-container)) / 2 + var(--m-gutter, 1.5rem)));
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1.25rem;
}
.mcc2026 .m-vq__quote blockquote {
    margin: 0;
    font-family: var(--m-font-display);
    font-style: italic;
    font-weight: 400;
    font-size: clamp(1.15rem, 0.95rem + 0.9vw, 1.7rem);
    line-height: 1.4;
    color: #fff;
}
.mcc2026 .m-vq__mark {
    font-family: var(--m-font-display);
    font-style: normal;
    font-size: 1.6em;
    line-height: 0;
    vertical-align: -0.28em;
    margin-inline-end: 0.2em;
    color: rgba(255, 255, 255, 0.9);
}
.mcc2026 .m-vq__mark--close { margin-inline: 0.08em 0; }
.mcc2026 .m-vq__author { display: flex; align-items: center; gap: 0.85rem; }
.mcc2026 .m-vq__author img {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    object-fit: cover;
    flex: none;
}
.mcc2026 .m-vq__author-name,
.mcc2026 .m-vq__author-role { display: block; }
.mcc2026 .m-vq__author-name { font-weight: 600; color: #fff; font-size: 0.9rem; }
.mcc2026 .m-vq__author-role { font-size: 0.8rem; color: rgba(255, 255, 255, 0.7); }

/* Mode « vidéo en fond » : la vidéo couvre toute la section, un voile part
   du coin bas-droit — là où se pose la citation — et s'efface vers le
   haut-gauche pour laisser voir l'image. */
.mcc2026 .m-vq--bg {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    min-height: clamp(24rem, 42vw, 40rem);
    padding-block: clamp(2rem, 4vw, 3.5rem);
}
.mcc2026 .m-vq__bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; container-type: size; }
.mcc2026 .m-vq__bg img,
.mcc2026 .m-vq__bg-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; display: block; }
.mcc2026 .m-vq__bg-video--embed {
    inset: auto;
    top: 50%;
    left: 50%;
    width: max(100cqw, 177.78cqh);
    height: max(100cqh, 56.25cqw);
    transform: translate(-50%, -50%);
}
.mcc2026 .m-vq__bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top left,
        rgba(0, 7, 29, var(--m-vq-veil, 0.7)) 0%,
        rgba(0, 7, 29, calc(var(--m-vq-veil, 0.7) * 0.55)) 45%,
        color-mix(in srgb, var(--site-navy, #00071d) 10%, transparent) 100%);
}
@media (prefers-reduced-motion: reduce) {
    .mcc2026 .m-vq__bg-video { display: none; }
}
.mcc2026 .m-vq__bg-inner {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: flex-end;
}
.mcc2026 .m-vq--bg .m-vq__quote {
    max-width: 34rem;
    padding: 0;
    text-align: end;
}
/* Sur la vidéo, la citation passe en gras pour rester lisible sur l'image. */
.mcc2026 .m-vq--bg .m-vq__quote blockquote { font-weight: 400; text-shadow: 0 2px 12px rgba(0, 7, 29, 0.6); }

/* Sans media, une seule colonne : sinon la citation occuperait la moitie
   gauche et laisserait la droite vide. */
.mcc2026 .m-vq__grid.is-solo { grid-template-columns: minmax(0, 1fr); }
.mcc2026 .m-vq__grid.is-solo .m-vq__quote { max-width: 46rem; margin-inline: auto; padding-inline: var(--m-gutter, 1.5rem); }

/* Mobile : la photo passe au-dessus et se fond vers le bas. */
@media (max-width: 800px) {
    .mcc2026 .m-vq__grid { grid-template-columns: minmax(0, 1fr); }
    .mcc2026 .m-vq__poster::after {
        background: linear-gradient(to bottom, color-mix(in srgb, var(--site-navy, #00071d) 35%, transparent) 0%, color-mix(in srgb, var(--site-navy, #00071d) 10%, transparent) 45%, var(--m-navy, #00071d) 100%);
    }
    .mcc2026 .m-vq__play { justify-content: flex-end; }
    .mcc2026 .m-vq__media { min-height: 15rem; }
    .mcc2026 .m-vq__quote { padding-inline: var(--m-gutter, 1.5rem); }
}

/* ─────────────────────────────────────────────────────────────────────────
   mcc_community_cta — bandeau communauté
   ───────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-ccta {
    position: relative;
    overflow: hidden;
    background: var(--m-navy, #00071d);
    padding-block: clamp(2.5rem, 5vw, 4rem);
}

.mcc2026 .m-ccta__photo { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.mcc2026 .m-ccta__photo img,
.mcc2026 .m-ccta__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; border: 0; }
/* Une iframe ne connaît pas object-fit : on la surdimensionne en 16/9 pour
   qu'elle couvre le bandeau quel que soit son ratio. Le calque photo a une
   taille définie (inset: 0), il peut donc servir de conteneur de requête. */
.mcc2026 .m-ccta__photo { container-type: size; }
.mcc2026 .m-ccta__video--embed {
    inset: auto;
    top: 50%;
    left: 50%;
    width: max(100cqw, 177.78cqh);
    height: max(100cqh, 56.25cqw);
    transform: translate(-50%, -50%);
}
@media (prefers-reduced-motion: reduce) {
    .mcc2026 .m-ccta__video { display: none; }
}

/* Format 16:9 : le bandeau a les proportions de la vidéo, le contenu est
   centré verticalement. `aspect-ratio` n'est qu'un minimum : sur mobile,
   si le texte ne tient pas, le bandeau s'allonge au lieu de le couper. */
.mcc2026 .m-ccta.is-16-9,
.mcc2026 .m-ccta.is-21-9,
.mcc2026 .m-ccta.is-3-1 {
    display: flex;
    align-items: flex-end;
}
.mcc2026 .m-ccta.is-16-9 { aspect-ratio: 16 / 9; }
.mcc2026 .m-ccta.is-21-9 { aspect-ratio: 21 / 9; }
.mcc2026 .m-ccta.is-3-1 { aspect-ratio: 3 / 1; }
/* Texte en bas : le voile s'épaissit vers le bas pour qu'il reste lisible. */
.mcc2026 .m-ccta.is-16-9 .m-ccta__photo::after,
.mcc2026 .m-ccta.is-21-9 .m-ccta__photo::after,
.mcc2026 .m-ccta.is-3-1 .m-ccta__photo::after {
    background: linear-gradient(to top,
        rgba(0, 7, 29, min(1, calc(var(--m-ccta-veil, 0.78) + 0.3))) 0%,
        rgba(0, 7, 29, var(--m-ccta-veil, 0.78)) 35%,
        rgba(0, 7, 29, calc(var(--m-ccta-veil, 0.78) * 0.3)) 75%);
}

/* Voile en dégradé : plein bleu nuit sous le texte à gauche, la salle se
   devine à droite derrière le bouton. `overlay_opacity` règle le côté
   texte ; le côté photo garde toujours un voile pour le bouton. */
.mcc2026 .m-ccta__photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to right,
        rgba(0, 7, 29, min(1, calc(var(--m-ccta-veil, 0.78) + 0.18))) 0%,
        rgba(0, 7, 29, var(--m-ccta-veil, 0.78)) 55%,
        rgba(0, 7, 29, calc(var(--m-ccta-veil, 0.78) * 0.5)) 100%);
}

.mcc2026 .m-ccta__inner { position: relative; z-index: 1; }

.mcc2026 .m-ccta__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(1.25rem, 3vw, 2.5rem);
    flex-wrap: wrap;
}
.mcc2026 .m-ccta__copy { flex: 1 1 24rem; min-width: 0; max-width: 40rem; }
.mcc2026 .m-ccta__title {
    font-family: var(--m-font-display);
    font-size: clamp(1.25rem, 1rem + 1vw, 1.85rem);
    font-weight: 600;
    line-height: 1.2;
    color: #fff;
    margin: 0;
    max-width: 22em;
}
.mcc2026 .m-ccta__text {
    margin: 0.6rem 0 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.82);
    max-width: 60ch;
}
.mcc2026 .m-ccta__cta { flex: none; }

.mcc2026 .m-ccta__stats {
    list-style: none;
    margin: clamp(1.25rem, 2.5vw, 2rem) 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem clamp(1.5rem, 5vw, 4.5rem);
}
.mcc2026 .m-ccta__stat { display: flex; align-items: center; gap: 0.75rem; }
.mcc2026 .m-ccta__stat-icon { display: inline-flex; color: #fff; flex: none; }
.mcc2026 .m-ccta__stat-icon svg { width: 1.75rem; height: 1.75rem; stroke-width: 1.5; }
.mcc2026 .m-ccta__stat-value,
.mcc2026 .m-ccta__stat-label { display: block; }
.mcc2026 .m-ccta__stat-value {
    font-size: clamp(1.1rem, 0.95rem + 0.6vw, 1.45rem);
    font-weight: 700;
    color: #fff;
    line-height: 1.1;
}
.mcc2026 .m-ccta__stat-label { font-size: 0.8rem; color: rgba(255, 255, 255, 0.8); margin-top: 0.15rem; }

@media (max-width: 800px) {
    .mcc2026 .m-ccta__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mcc2026 .m-ccta__cta { width: 100%; justify-content: center; }
    .mcc2026 .m-ccta__photo::after { background: rgba(0, 7, 29, var(--m-ccta-veil, 0.78)); }
}

/* ─────────────────────────────────────────────────────────────────────────
   mcc_video_testimonials — témoignages vidéo + avis des participants
   ───────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-vt__top {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 2.3fr);
    gap: clamp(1.5rem, 3vw, 2.5rem);
    align-items: center;
}
.mcc2026 .m-vt__top.is-no-video { grid-template-columns: minmax(0, 1fr); }

.mcc2026 .m-vt__title {
    margin: 0.7rem 0 0;
    font-family: var(--m-font-display);
    font-size: clamp(1.8rem, 1.3rem + 1.5vw, 2.6rem);
    font-weight: 700;
    line-height: 1.08;
    color: var(--m-navy, #00071d);
}
.mcc2026 .m-vt__text { margin: 1rem 0 0; font-size: 0.95rem; line-height: 1.6; color: var(--m-muted); max-width: 34ch; }
.mcc2026 .m-vt__stats { display: flex; gap: 1.5rem; margin: 1.5rem 0 0; }
.mcc2026 .m-vt__stat + .m-vt__stat { padding-inline-start: 1.5rem; border-inline-start: 1px solid color-mix(in srgb, var(--site-ink, #0f172a) 12%, transparent); }
.mcc2026 .m-vt__stat dt { font-size: clamp(1.4rem, 1.2rem + 0.6vw, 1.75rem); font-weight: 700; color: var(--m-navy, #00071d); }
/* Compteur animé (19/10/2026) : chiffres à chasse fixe, valeur lue une
   seule fois par les lecteurs d'écran (m-vt__sr), pas les étapes. */
.mcc2026 .m-vt__num { display: inline-block; font-variant-numeric: tabular-nums; text-align: end; }
.mcc2026 .m-vt__sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.mcc2026 .m-vt__stat dd { margin: 0.25rem 0 0; font-size: 0.78rem; line-height: 1.35; color: var(--m-muted); max-width: 12rem; }
.mcc2026 .m-vt__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem; margin-top: 1.5rem; }
.mcc2026 .m-vt__share {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--m-navy, #00071d);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.mcc2026 .m-vt__share svg { width: 1rem; height: 1rem; }

/* Scène vidéo : la première vidéo est la principale (2 rangées de haut),
   les deux suivantes s'empilent à droite ; au-delà, elles attendent leur
   tour (les flèches font tourner l'ordre). */
.mcc2026 .m-vt__stage { position: relative; }
.mcc2026 .m-vt__videos {
    display: grid;
    grid-template-columns: minmax(0, 2.3fr) minmax(0, 1fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
    height: clamp(18rem, 26vw, 22rem);
}
.mcc2026 .m-vt__video {
    position: relative;
    overflow: hidden;
    border-radius: 0.9rem;
    background: var(--m-navy, #00071d);
    color: #fff;
}
.mcc2026 .m-vt__video:first-child { grid-row: 1 / 3; }
.mcc2026 .m-vt__video:nth-child(n + 4) { display: none; }
.mcc2026 .m-vt__videos:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
.mcc2026 .m-vt__videos:has(> :nth-child(2):last-child) .m-vt__video:nth-child(2) { grid-row: 1 / 3; }
.mcc2026 .m-vt__video > img,
.mcc2026 .m-vt__video > video,
.mcc2026 .m-vt__video > iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 0;
}
.mcc2026 .m-vt__overlay {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0.9rem;
    background: linear-gradient(to top, color-mix(in srgb, var(--site-navy, #00071d) 88%, transparent) 0%, color-mix(in srgb, var(--site-navy, #00071d) 20%, transparent) 50%, color-mix(in srgb, var(--site-navy, #00071d) 10%, transparent) 100%);
}
.mcc2026 .m-vt__video:first-child .m-vt__overlay { padding: 1.25rem 1.4rem; }
.mcc2026 .m-vt__tags { display: flex; justify-content: space-between; gap: 0.5rem; }
.mcc2026 .m-vt__badge,
.mcc2026 .m-vt__location {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.65rem;
    border-radius: 0.4rem;
    font-size: 0.68rem;
    font-weight: 600;
    background: color-mix(in srgb, var(--site-navy, #00071d) 60%, transparent);
    backdrop-filter: blur(4px);
}
.mcc2026 .m-vt__badge { text-transform: uppercase; letter-spacing: 0.06em; }
.mcc2026 .m-vt__location { margin-inline-start: auto; background: rgba(255, 255, 255, 0.18); }
.mcc2026 .m-vt__location svg { width: 0.8rem; height: 0.8rem; }
.mcc2026 .m-vt__video:not(:first-child) .m-vt__tags,
.mcc2026 .m-vt__video:not(:first-child) .m-vt__quote { display: none; }
.mcc2026 .m-vt__play {
    position: absolute;
    top: 50%;
    left: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border: 0;
    border-radius: 50%;
    background: var(--site-surface, #fff);
    color: var(--m-red);
    cursor: pointer;
    transform: translate(-50%, -50%);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.6);
    transition: transform var(--m-ease-fast, 0.2s ease);
}
.mcc2026 .m-vt__video:first-child .m-vt__play { width: 4rem; height: 4rem; }
.mcc2026 .m-vt__play:hover,
.mcc2026 .m-vt__play:focus-visible { transform: translate(-50%, -50%) scale(1.07); }
.mcc2026 .m-vt__play svg { width: 40%; height: 40%; fill: currentColor; margin-inline-start: 8%; }
.mcc2026 .m-vt__quote {
    margin: 0 0 0.9rem;
    padding-inline-start: 0.9rem;
    border-inline-start: 3px solid var(--m-red);
    font-size: clamp(0.95rem, 0.85rem + 0.4vw, 1.2rem);
    font-weight: 600;
    line-height: 1.35;
    max-width: 30rem;
}
.mcc2026 .m-vt__who { display: flex; align-items: flex-end; justify-content: space-between; gap: 0.75rem; font-size: 0.78rem; }
.mcc2026 .m-vt__who strong { display: block; font-size: 0.85rem; }
.mcc2026 .m-vt__who span span { color: rgba(255, 255, 255, 0.8); }
.mcc2026 .m-vt__duration { flex: none; padding: 0.2rem 0.45rem; border-radius: 0.3rem; background: color-mix(in srgb, var(--site-navy, #00071d) 75%, transparent); font-size: 0.7rem; font-weight: 600; }
.mcc2026 .m-vt__arrow {
    position: absolute;
    top: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border: 0;
    border-radius: 50%;
    background: var(--site-surface, #fff);
    color: var(--m-navy, #00071d);
    cursor: pointer;
    transform: translateY(-50%);
    box-shadow: 0 6px 20px -8px rgba(0, 7, 29, 0.45);
}
.mcc2026 .m-vt__arrow--prev { inset-inline-start: -1.25rem; }
.mcc2026 .m-vt__arrow--next { inset-inline-end: -1.25rem; }
.mcc2026 .m-vt__arrow svg { width: 1.1rem; height: 1.1rem; }

.mcc2026 .m-vt__notice {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 1.5rem 0 0;
    padding: 0.8rem 1rem;
    border-radius: 0.75rem;
    background: #e8f7ee;
    color: #166534;
    font-size: 0.9rem;
}
.mcc2026 .m-vt__notice svg { width: 1.1rem; height: 1.1rem; flex: none; }

.mcc2026 .m-vt__reviews {
    list-style: none;
    margin: clamp(1.5rem, 3vw, 2rem) 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 1rem;
}
.mcc2026 .m-vt__review {
    padding: 1.4rem;
    border-radius: 1rem;
    background: var(--m-surface, #fff);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 32px -20px rgba(15, 23, 42, 0.2);
}
.mcc2026 .m-vt__review-head { display: flex; align-items: center; gap: 0.85rem; }
.mcc2026 .m-vt__avatar {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background: var(--m-navy, #00071d);
    color: #fff;
    font-weight: 700;
    font-size: 0.9rem;
    overflow: hidden;
}

/* Photo de profil du participant retrouvé en base (19/10/2026). */
.mcc2026 .m-vt__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.mcc2026 .m-vt__review-head > span { min-width: 0; }
.mcc2026 .m-vt__review-head strong { display: block; overflow-wrap: anywhere; font-size: 0.92rem; color: var(--m-navy, #00071d); }
.mcc2026 .m-vt__role { display: block; font-size: 0.75rem; color: var(--m-muted); }
.mcc2026 .m-vt__stars { display: block; margin-top: 0.15rem; color: var(--site-accent, #f5a623); letter-spacing: 0.08em; }
.mcc2026 .m-vt__review-text { overflow-wrap: anywhere; margin: 1rem 0 0; font-size: 0.9rem; line-height: 1.55; color: var(--m-ink); }
.mcc2026 .m-vt__review-text::before { content: '\201C  '; font-family: var(--m-font-display); font-size: 1.6em; line-height: 0; color: rgba(15, 23, 42, 0.25); vertical-align: -0.3em; }
.mcc2026 .m-vt__review-formation { margin: 1rem 0 0; padding-top: 0.75rem; border-top: 1px solid color-mix(in srgb, var(--site-ink, #0f172a) 8%, transparent); font-size: 0.78rem; font-weight: 600; color: var(--m-navy, #00071d); }
.mcc2026 .m-vt__review--empty { grid-column: 1 / -1; display: flex; align-items: center; gap: 0.9rem; color: var(--m-muted); }
.mcc2026 .m-vt__review--empty p { margin: 0; }
.mcc2026 .m-vt__review--empty svg { width: 1.5rem; height: 1.5rem; flex: none; color: var(--m-red); }

/* Avis en défilement continu (18/10/2026) — modèle « marquee » : une ou
   deux rangées (la seconde en sens inverse), chaque liste dupliquée pour
   une boucle sans saut (translateX -50 %). Pause au survol et au focus ;
   fondu sur les bords ; grille horizontale si animations réduites. */
.mcc2026 .m-vt__marquee {
    display: grid;
    gap: 1rem;
    margin: clamp(1.5rem, 3vw, 2rem) 0 0;
    /* Les cartes débordent du conteneur jusqu'aux bords de l'écran. */
    margin-inline: calc(50% - 50vw);
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 12%, #000 88%, transparent 100%);
}
.mcc2026 .m-vt__mq-row { overflow: hidden; padding-block: 0.5rem 1.25rem; }
.mcc2026 .m-vt__mq-track {
    display: flex;
    width: max-content;
    animation: m-vt-marquee var(--vt-dur, 40s) linear infinite;
}
.mcc2026 .m-vt__mq-row.is-reverse .m-vt__mq-track { animation-direction: reverse; }
.mcc2026 .m-vt__marquee:hover .m-vt__mq-track,
.mcc2026 .m-vt__marquee:focus-within .m-vt__mq-track { animation-play-state: paused; }
.mcc2026 .m-vt__mq-list {
    display: flex;
    gap: 1rem;
    margin: 0;
    padding: 0 0.5rem;
    list-style: none;
}
.mcc2026 .m-vt__mq-list .m-vt__review {
    flex: none;
    width: 20rem;
    display: flex;
    flex-direction: column;
    border: 1px solid color-mix(in srgb, var(--site-ink, #0f172a) 8%, transparent);
    transition: transform 0.25s, box-shadow 0.25s;
}
.mcc2026 .m-vt__mq-list .m-vt__review:hover {
    transform: translateY(-3px);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), 0 18px 36px -20px rgba(15, 23, 42, 0.32);
}
.mcc2026 .m-vt__mq-list .m-vt__review-text {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.mcc2026 .m-vt__mq-list .m-vt__review-formation { margin-top: auto; }
.mcc2026 .m-vt__mq-list .m-vt__review-text + .m-vt__review-formation { margin-top: 1rem; }
@keyframes m-vt-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
[dir="rtl"] .mcc2026 .m-vt__mq-track { animation-name: m-vt-marquee-rtl; }
@keyframes m-vt-marquee-rtl {
    from { transform: translateX(0); }
    to { transform: translateX(50%); }
}
@media (max-width: 640px) {
    .mcc2026 .m-vt__mq-list .m-vt__review { width: 16.5rem; }
}
@media (prefers-reduced-motion: reduce) {
    .mcc2026 .m-vt__marquee { -webkit-mask-image: none; mask-image: none; margin-inline: 0; }
    .mcc2026 .m-vt__mq-row { overflow-x: auto; }
    .mcc2026 .m-vt__mq-track { animation: none; }
    .mcc2026 .m-vt__mq-list[aria-hidden="true"] { display: none; }
}

/* Formulaire de dépôt, replié par défaut. */
.mcc2026 .m-vt__form { margin-top: 1.25rem; }
.mcc2026 .m-vt__form > summary { list-style: none; cursor: pointer; width: max-content; }
.mcc2026 .m-vt__form > summary::-webkit-details-marker { display: none; }
.mcc2026 .m-vt__fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem 1rem;
    margin-top: 1rem;
    padding: clamp(1.25rem, 2.5vw, 1.75rem);
    border-radius: 1rem;
    background: var(--m-surface, #fff);
    box-shadow: 0 12px 32px -20px rgba(15, 23, 42, 0.2);
}
.mcc2026 .m-vt__fields label { display: flex; flex-direction: column; gap: 0.35rem; font-size: 0.82rem; font-weight: 600; color: var(--m-navy, #00071d); }
.mcc2026 .m-vt__fields small { font-weight: 400; color: var(--m-muted); }
.mcc2026 .m-vt__fields input:not([type=checkbox]),
.mcc2026 .m-vt__fields select,
.mcc2026 .m-vt__fields textarea {
    width: 100%;
    padding: 0.6rem 0.75rem;
    border: 1px solid color-mix(in srgb, var(--site-ink, #0f172a) 18%, transparent);
    border-radius: 0.6rem;
    font: inherit;
    font-weight: 400;
    background: var(--site-surface, #fff);
}
.mcc2026 .m-vt__fields .is-wide { grid-column: 1 / -1; }
.mcc2026 .m-vt__fields label.m-vt__consent { flex-direction: row; align-items: flex-start; font-weight: 400; color: var(--m-ink); }
.mcc2026 .m-vt__consent input { margin-top: 0.2rem; }
.mcc2026 .m-vt__fields button.is-wide { justify-self: start; }
.mcc2026 .m-vt__errors { margin: 0; padding: 0.75rem 1rem 0.75rem 2rem; border-radius: 0.6rem; background: #fdecec; color: #991b1b; font-size: 0.85rem; }
.mcc2026 .m-vt__trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 1000px) {
    .mcc2026 .m-vt__top { grid-template-columns: minmax(0, 1fr); }
    .mcc2026 .m-vt__arrow--prev { inset-inline-start: 0.5rem; }
    .mcc2026 .m-vt__arrow--next { inset-inline-end: 0.5rem; }
}
@media (max-width: 640px) {
    .mcc2026 .m-vt__videos { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); height: 14rem; }
    .mcc2026 .m-vt__video:not(:first-child) { display: none; }
    .mcc2026 .m-vt__fields { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
    .mcc2026 .m-vt__play { transition: none; }
}

/* ─────────────────────────────────────────────────────────────────────────
   mcc_partners_strip — disposition « premium » (logos groupés sur photo)
   ───────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-lp {
    position: relative;
    overflow: hidden;
    background: var(--m-navy, #00071d);
    padding-block: clamp(2.5rem, 5vw, 4rem) clamp(1.5rem, 3vw, 2.25rem);
}
.mcc2026 .m-lp__bg { position: absolute; inset: 0; z-index: 0; }
.mcc2026 .m-lp__bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mcc2026 .m-lp__bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, color-mix(in srgb, var(--site-navy, #00071d) 92%, transparent) 0%, color-mix(in srgb, var(--site-navy, #00071d) 70%, transparent) 45%, color-mix(in srgb, var(--site-navy, #00071d) 45%, transparent) 100%);
}
.mcc2026 .m-lp__inner { position: relative; z-index: 1; }
.mcc2026 .m-lp__head { max-width: 38rem; }
.mcc2026 .m-lp__title {
    margin: 0.6rem 0 0;
    font-family: var(--m-font-display);
    font-size: clamp(1.8rem, 1.3rem + 1.5vw, 2.5rem);
    font-weight: 700;
    line-height: 1.1;
    color: #fff;
}
.mcc2026 .m-lp__text { margin: 0.75rem 0 0; font-size: 0.95rem; line-height: 1.55; color: rgba(255, 255, 255, 0.85); }

.mcc2026 .m-lp__stage { position: relative; margin-top: clamp(1.5rem, 3vw, 2.25rem); }
.mcc2026 .m-lp__stage .m-vt__arrow--prev { inset-inline-start: -1.25rem; }
.mcc2026 .m-lp__stage .m-vt__arrow--next { inset-inline-end: -1.25rem; }

/* Carte blanche : les groupes défilent horizontalement (flèches, doigt,
   clavier), chacun séparé du suivant par un filet vertical. */
.mcc2026 .m-lp__card {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: clamp(1rem, 2vw, 1.5rem) 0.5rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 24px 48px -24px rgba(0, 0, 0, 0.5);
}
.mcc2026 .m-lp__card::-webkit-scrollbar { display: none; }
.mcc2026 .m-lp__group {
    flex: none;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0;
    padding: 0 clamp(1rem, 2vw, 1.5rem);
    list-style: none;
    scroll-snap-align: start;
}
.mcc2026 .m-lp__group + .m-lp__group { border-inline-start: 1px solid color-mix(in srgb, var(--site-ink, #0f172a) 10%, transparent); }
.mcc2026 .m-lp__logo a,
.mcc2026 .m-lp__logo > img,
.mcc2026 .m-lp__logo > .m-lp__name { display: flex; }
.mcc2026 .m-lp__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(6.5rem, 9vw, 8.25rem);
    height: 4rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid color-mix(in srgb, var(--site-ink, #0f172a) 8%, transparent);
    border-radius: 0.6rem;
    background: var(--site-surface, #fff);
}
.mcc2026 .m-lp__logo img { max-width: 100%; max-height: 2.6rem; width: auto; height: auto; object-fit: contain; }
.mcc2026 .m-lp__name {
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    color: var(--m-navy, #00071d);
}

.mcc2026 .m-lp__dots { display: flex; justify-content: center; gap: 0.5rem; margin-top: 1.1rem; }
.mcc2026 .m-lp__dots span { width: 0.5rem; height: 0.5rem; border-radius: 50%; background: rgba(255, 255, 255, 0.4); }
.mcc2026 .m-lp__dots span.is-active { background: var(--m-red); }

@media (max-width: 1000px) {
    .mcc2026 .m-lp__stage .m-vt__arrow--prev { inset-inline-start: 0.25rem; }
    .mcc2026 .m-lp__stage .m-vt__arrow--next { inset-inline-end: 0.25rem; }
    .mcc2026 .m-lp__group { flex-wrap: wrap; width: 100%; justify-content: center; }
}

/* ─────────────────────────────────────────────────────────────────────────
   mcc_partners_strip — disposition « claire » (carte du monde + rangée)
   ───────────────────────────────────────────────────────────────────────── */

.mcc2026 .m-ll { position: relative; overflow: hidden; background: var(--site-canvas, #fbfaf8); }
.mcc2026 .m-ll__photo { position: absolute; top: 0; right: 0; bottom: 0; width: min(38%, 38rem); z-index: 0; }
.mcc2026 .m-ll__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mcc2026 .m-ll__photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(to right, var(--site-canvas, #fbfaf8) 0%, rgba(251, 250, 248, 0.55) 40%, rgba(251, 250, 248, 0.1) 100%),
        linear-gradient(to top, var(--site-canvas, #fbfaf8) 0%, rgba(251, 250, 248, 0) 45%);
}
.mcc2026 .m-ll__map { position: absolute; top: 0; right: 20%; width: min(40%, 38rem); height: auto; z-index: 1; pointer-events: none; opacity: 0.8; }
.mcc2026 .m-ll__inner { position: relative; z-index: 2; }
.mcc2026 .m-ll__head { max-width: 34rem; }
.mcc2026 .m-ll__rule { display: block; width: 2.25rem; height: 2px; background: var(--m-red); }
.mcc2026 .m-ll__title {
    margin: 1rem 0 0;
    font-family: var(--m-font-display);
    font-size: clamp(1.8rem, 1.3rem + 1.5vw, 2.5rem);
    font-weight: 700;
    line-height: 1.1;
    color: var(--m-navy, #00071d);
}
.mcc2026 .m-ll__text { margin: 0.6rem 0 0; font-size: 0.95rem; line-height: 1.55; color: var(--m-muted); }

/* Bandeau défilant : deux copies de la liste côte à côte, la piste glisse
   de -50 %, ce qui ramène exactement la seconde copie à la place de la
   première. Les bords s'effacent en fondu. */
.mcc2026 .m-ll__marquee {
    overflow: hidden;
    margin-top: clamp(1.75rem, 3.5vw, 2.5rem);
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
            mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.mcc2026 .m-ll__track {
    display: flex;
    width: max-content;
    animation: m-ll-scroll var(--m-ll-duration, 40s) linear infinite;
}
.mcc2026 .m-ll__marquee:hover .m-ll__track,
.mcc2026 .m-ll__marquee:focus-within .m-ll__track { animation-play-state: paused; }
@keyframes m-ll-scroll { to { transform: translateX(-50%); } }
.mcc2026 .m-ll__row {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0.5rem 0;
    list-style: none;
}
.mcc2026 .m-ll__logo {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 3.25rem;
    padding-inline: clamp(0.9rem, 1.4vw, 1.4rem);
    border-inline-end: 1px solid color-mix(in srgb, var(--site-ink, #0f172a) 12%, transparent);
}
.mcc2026 .m-ll__logo a { display: flex; }
.mcc2026 .m-ll__logo img { display: block; width: 7rem; height: 2.4rem; object-fit: contain; }
.mcc2026 .m-ll { padding-block: clamp(2.5rem, 4vw, 3.5rem) clamp(2rem, 3.5vw, 2.75rem); }

@media (prefers-reduced-motion: reduce) {
    .mcc2026 .m-ll__track { animation: none; }
    .mcc2026 .m-ll__marquee { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
    .mcc2026 .m-ll__row[aria-hidden="true"] { display: none; }
}

@media (max-width: 900px) {
    .mcc2026 .m-ll__map { display: none; }
    .mcc2026 .m-ll__photo { width: 100%; opacity: 0.25; }
}

/* « Pourquoi choisir MCC » posée sur la vidéo de la section précédente :
   la section vidéo passe en colonne (citation puis engagements), la vidéo
   la couvre entièrement et le voile s'épaissit vers le bas. */
.mcc2026 .m-vq--bg.has-why {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-end;
    gap: clamp(1.5rem, 3vw, 2.5rem);
    min-height: clamp(36rem, 50vw, 50rem);
    padding-bottom: 0;
}
.mcc2026 .m-vq--bg.has-why .m-vq__bg::after {
    background: linear-gradient(to top,
        color-mix(in srgb, var(--site-navy, #00071d) 95%, transparent) 0%,
        color-mix(in srgb, var(--site-navy, #00071d) 80%, transparent) 40%,
        color-mix(in srgb, var(--site-navy, #00071d) 35%, transparent) 70%,
        color-mix(in srgb, var(--site-navy, #00071d) 15%, transparent) 100%);
}
.mcc2026 .m-vq--bg.has-why .m-vq__bg-inner { width: 100%; }
.mcc2026 .m-why.is-merged { position: relative; z-index: 1; padding: 0; background: none; }
.mcc2026 .m-why.is-merged .m-whyb { background: none; min-height: 0; }
.mcc2026 .m-why.is-merged .m-whyb__photo { display: none; }

/* ─────────────────────────────────────────────────────────────────────────
   mcc_hero — thème clair : fond ivoire, photo fondue dans le blanc à droite,
   titre bleu nuit, atouts dans des pastilles roses, encadré en bas à droite.
   ───────────────────────────────────────────────────────────────────────── */
.mcc2026 .m-hero.m-hero--light { background: var(--site-canvas, #f4f6f9); background-image: none; color: var(--m-navy, #00071d); }
.mcc2026 .m-hero--light .m-hero__photo { left: 38%; }
.mcc2026 .m-hero--light .m-hero__photo img { object-position: center 30%; }
.mcc2026 .m-hero--light .m-hero__photo::after,
[dir='rtl'] .mcc2026 .m-hero--light .m-hero__photo::after {
    background: linear-gradient(to right, var(--site-canvas, #f4f6f9) 0%, rgba(244, 246, 249, 0.7) 18%, rgba(244, 246, 249, 0) 45%);
}
.mcc2026 .m-hero--light .m-title,
.mcc2026 .m-hero--light .m-title--hero em { color: var(--m-navy, #00071d); }
.mcc2026 .m-hero--light .m-lead { color: var(--site-ink, #334155); }
.mcc2026 .m-hero--light .m-eyebrow { color: var(--m-red); }
.mcc2026 .m-hero--light .m-eyebrow__num,
.mcc2026 .m-hero--light .m-eyebrow__sep { display: none; }
.mcc2026 .m-hero--light .m-eyebrow::before {
    content: '';
    width: 2.25rem;
    height: 2px;
    background: currentColor;
}
.mcc2026 .m-hero--light .m-hero__inner > .m-hero__chips { width: auto; max-width: 780px; }
.mcc2026 .m-hero--light .m-hero__chips .m-chip { color: var(--m-navy, #00071d); border-inline-start-color: color-mix(in srgb, var(--site-ink, #0f172a) 12%, transparent); }
.mcc2026 .m-hero--light .m-chip__icon {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    background: #fde2e5;
    color: var(--m-red);
}
.mcc2026 .m-hero--light .m-chip__icon svg { width: 1.2rem; height: 1.2rem; }
.mcc2026 .m-hero--light .m-chip__title { font-size: 0.75rem; }

.mcc2026 .m-hero__card {
    position: absolute;
    right: clamp(1rem, 3vw, 3rem);
    bottom: clamp(1.25rem, 3vw, 2.5rem);
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 0.9rem;
    max-width: 24rem;
    padding: 0.75rem 0.75rem 0.75rem 1rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(6px);
    color: var(--m-navy, #00071d);
    text-decoration: none;
    box-shadow: 0 14px 36px -18px rgba(0, 7, 29, 0.5);
}
.mcc2026 .m-hero__card-icon { display: inline-flex; color: var(--m-red); }
.mcc2026 .m-hero__card-icon svg { width: 1.5rem; height: 1.5rem; }
.mcc2026 .m-hero__card-text { font-size: 0.85rem; font-weight: 600; line-height: 1.3; }
.mcc2026 .m-hero__card-go {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    background: var(--m-red);
    color: #fff;
}
.mcc2026 .m-hero__card-go svg { width: 1rem; height: 1rem; }

@media (max-width: 900px) {
    .mcc2026 .m-hero--light .m-hero__photo { left: 0; opacity: 0.18; }
    .mcc2026 .m-hero__card { position: relative; right: auto; bottom: auto; margin: 1.5rem var(--m-gutter, 1.5rem) 0; }
}
.mcc2026 .m-hero--light .m-title--hero { font-size: clamp(2.2rem, 1.5rem + 2.4vw, 3.4rem); }

/* ── Hero centré (option « Alignement : centré ») ──────────────────────
   Texte, boutons et atouts centrés dans la page. La photo reste pleine :
   plus de dégradé bleu nuit orienté vers le texte, seulement un voile noir
   uniforme — au moins 45 % pour garder le texte blanc lisible. */
.mcc2026 .m-hero.m-hero--center { background-color: #000; background-image: none; text-align: center; }
.mcc2026 .m-hero--center .m-hero__photo::after,
.mcc2026 .m-hero--center .m-hero__veil,
[dir='rtl'] .mcc2026 .m-hero--center .m-hero__photo::after,
[dir='rtl'] .mcc2026 .m-hero--center .m-hero__veil { background: rgba(0, 0, 0, max(0.45, var(--m-hero-veil, 0.55))); }
.mcc2026 .m-hero--center .m-hero__photo img { object-position: center; }
.mcc2026 .m-hero.m-hero--center .m-hero__inner { margin-inline: auto; }
.mcc2026 .m-hero--center .m-hero__inner > * { margin-inline: auto; }
.mcc2026 .m-hero--center .m-hero__actions { justify-content: center; }
.mcc2026 .m-hero--center .m-hero__inner > .m-hero__chips { width: 100%; max-width: 1100px; }
.mcc2026 .m-hero--center .m-hero__chips .m-chip { justify-content: center; text-align: start; }
@media (max-width: 1100px) {
    .mcc2026 .m-hero--center .m-hero__chips .m-chip { justify-content: flex-start; }
}

/* ── Accueil, variante 2 ──────────────────────────────────────────────────
   Panneau « Que recherchez-vous ? » en bas du hero, bande d'atouts sous le
   hero, section « Notre mission », bandeau « universités » sombre. */
.mcc2026 .m-hero__inner > .m-hero__panel { max-width: 1000px; }
.mcc2026 .m-hero__panel {
    margin-top: 2.5rem;
    padding: 1.6rem 1.6rem 1.75rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 18px;
    background: color-mix(in srgb, var(--site-navy, #00071d) 72%, transparent);
    backdrop-filter: blur(10px);
    text-align: center;
}
.mcc2026 .m-hero__panel-title { margin: 0; font-family: var(--m-font-display); font-size: clamp(1.25rem, 1rem + 0.8vw, 1.6rem); font-weight: 600; color: #fff; }
.mcc2026 .m-hero__panel-text { margin: 0.4rem auto 1.3rem; max-width: 60ch; font-size: 0.85rem; color: rgba(255, 255, 255, 0.72); }
.mcc2026 .m-hero__panel-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; text-align: start; }
.mcc2026 .m-hero__tile {
    display: flex; align-items: center; gap: 1rem;
    min-height: 5.5rem; padding: 1.1rem 1.2rem;
    border-radius: 12px; color: #fff; text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.12);
    transition: transform 0.2s var(--m-ease), box-shadow 0.2s;
}
.mcc2026 .m-hero__tile:hover { transform: translateY(-2px); box-shadow: 0 16px 30px -18px rgba(0, 0, 0, 0.7); }
.mcc2026 .m-hero__tile:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.mcc2026 .m-hero__tile--red { background: linear-gradient(120deg, var(--site-red-bright, #e3001b) 0%, var(--m-red-dark, #a30000) 100%); }
.mcc2026 .m-hero__tile--navy { background: linear-gradient(120deg, var(--site-navy, #0c2350) 0%, var(--site-navy, #071634) 100%); }
.mcc2026 .m-hero__tile-icon { display: inline-flex; flex: none; }
.mcc2026 .m-hero__tile-icon svg { width: 2.4rem; height: 2.4rem; stroke-width: 1.4; }
.mcc2026 .m-hero__tile-body { flex: 1; min-width: 0; }
.mcc2026 .m-hero__tile-body strong { display: block; font-family: var(--m-font-display); font-size: 1.05rem; font-weight: 600; }
.mcc2026 .m-hero__tile-body span { display: block; margin-top: 0.25rem; font-size: 0.75rem; line-height: 1.4; color: rgba(255, 255, 255, 0.82); }
.mcc2026 .m-hero__tile-go { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 2.2rem; height: 2.2rem; border-radius: 50%; }
.mcc2026 .m-hero__tile--red .m-hero__tile-go { background: var(--site-surface, #fff); color: var(--m-red); }
.mcc2026 .m-hero__tile--navy .m-hero__tile-go { background: #1d6fe0; color: #fff; }
.mcc2026 .m-hero__tile-go svg { width: 1rem; height: 1rem; }
@media (max-width: 700px) {
    .mcc2026 .m-hero__panel-tiles { grid-template-columns: minmax(0, 1fr); }
    .mcc2026 .m-hero__panel { padding: 1.2rem; }
}

.mcc2026 .m-hero-strip { background: var(--site-surface, #fff); border-bottom: 1px solid var(--m-border); }
.mcc2026 .m-hero-strip__list { list-style: none; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 1rem; margin: 0 auto; padding-block: 1.4rem; }
.mcc2026 .m-hero-strip__list li { display: flex; align-items: center; gap: 0.8rem; font-size: 0.82rem; font-weight: 500; line-height: 1.3; color: var(--m-ink); }
.mcc2026 .m-hero-strip__icon { display: inline-flex; flex: none; color: var(--m-navy); }
.mcc2026 .m-hero-strip__icon svg { width: 1.6rem; height: 1.6rem; stroke-width: 1.5; }
@media (max-width: 800px) { .mcc2026 .m-hero-strip__list { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.mcc2026 .m-mission { position: relative; overflow: hidden; background: var(--site-canvas, #f6f7f9); }
.mcc2026 .m-mission__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: clamp(20rem, 30vw, 26rem); align-items: center; }
.mcc2026 .m-mission__copy { padding-block: clamp(3rem, 6vw, 4.5rem); padding-inline-end: 2rem; }
.mcc2026 .m-mission__eyebrow { display: inline-flex; align-items: center; gap: 0.7rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--m-navy); }
.mcc2026 .m-mission__eyebrow::before { content: ''; width: 1.6rem; height: 2px; background: var(--m-red); }
.mcc2026 .m-mission__title { margin: 1rem 0 0; font-family: var(--m-font-display); font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.4rem); font-weight: 600; line-height: 1.15; color: var(--m-navy); }
.mcc2026 .m-mission__title em { display: block; font-style: normal; color: var(--m-red); }
.mcc2026 .m-mission__text { margin: 1rem 0 0; max-width: 52ch; font-size: 0.92rem; line-height: 1.65; color: var(--site-muted, #475569); }
.mcc2026 .m-mission__link { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: 1.4rem; padding-bottom: 0.3rem; border-bottom: 2px solid var(--m-red); font-size: 0.85rem; font-weight: 600; color: var(--m-navy); text-decoration: none; }
.mcc2026 .m-mission__link svg { width: 1rem; height: 1rem; color: var(--m-red); transition: transform 0.2s var(--m-ease); }
.mcc2026 .m-mission__link:hover svg { transform: translateX(3px); }
.mcc2026 .m-mission__photo { position: absolute; inset: 0 0 0 50%; }
.mcc2026 .m-mission__photo img { width: 100%; height: 100%; object-fit: cover; }
.mcc2026 .m-mission__photo::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to right, var(--site-canvas, #f6f7f9) 0%, rgba(246, 247, 249, 0) 30%); }
@media (max-width: 800px) {
    .mcc2026 .m-mission__grid { grid-template-columns: minmax(0, 1fr); }
    .mcc2026 .m-mission__photo { position: relative; inset: auto; height: 16rem; }
    .mcc2026 .m-mission__photo::before { background: linear-gradient(to bottom, var(--site-canvas, #f6f7f9) 0%, rgba(246, 247, 249, 0) 25%); }
}

.mcc2026 .m-unis { background: var(--m-navy); color: #fff; text-align: center; }
.mcc2026 .m-unis__title { display: inline-flex; align-items: center; gap: 0.9rem; margin: 0; font-family: var(--m-font-display); font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2rem); font-weight: 600; color: #fff; }
.mcc2026 .m-unis__rule { width: 2rem; height: 3px; background: var(--m-red); }
.mcc2026 .m-unis__text { margin: 0.6rem auto 0; max-width: 60ch; font-size: 0.88rem; color: rgba(255, 255, 255, 0.7); }
.mcc2026 .m-unis__row { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 1.5rem 3.5rem; margin: 2.5rem 0 0; padding: 0; }
.mcc2026 .m-unis__row img { height: 3rem; width: auto; max-width: 12rem; object-fit: contain; filter: brightness(0) invert(1); opacity: 0.88; transition: opacity 0.2s; }
.mcc2026 .m-unis__row a:hover img { opacity: 1; }
.mcc2026 .m-unis__row span { font-family: var(--m-font-display); font-size: 1.05rem; font-weight: 600; color: #fff; }
/* Avec le panneau, le hero est plus haut que l'écran : on laisse respirer le
   titre sous l'en-tête fixe au lieu de centrer verticalement. */
.mcc2026 .m-hero.m-hero--has-panel { align-items: flex-end; padding-top: calc(var(--nav-h, 72px) + clamp(2rem, 5vw, 4rem)); padding-bottom: clamp(2rem, 4vw, 3rem); }
.mcc2026 .m-hero--has-panel .m-title--hero { font-size: clamp(2.2rem, 1.4rem + 2.6vw, 3.4rem); }
/* Panneau centré dans la page, posé directement sur la photo (sans fond
   bleu ni cadre) : seules les deux tuiles portent de la couleur. */
.mcc2026 .m-hero__inner > .m-hero__panel { margin-inline: auto; }
.mcc2026 .m-hero__panel { border: 0; background: none; backdrop-filter: none; padding-inline: 0; }
.mcc2026 .m-hero__panel-title,
.mcc2026 .m-hero__panel-text { text-shadow: 0 1px 12px rgba(0, 0, 0, 0.55); }
/* Le texte du hero est décalé de 3rem vers la gauche (voir .m-hero__inner) :
   on rend ce décalage au panneau pour qu'il soit centré sur l'écran. */
.mcc2026 .m-hero__inner > .m-hero__panel { position: relative; left: min(3rem, max(0px, (100vw - var(--m-container)) / 2)); }

/* ── Accueil, variante 1 : « Choisissez votre parcours » ─────────────────── */
.mcc2026 .m-paths { background: var(--site-surface, #fff); padding-top: clamp(3rem, 6vw, 4.5rem); }
.mcc2026 .m-paths__head { text-align: center; max-width: 46rem; margin: 0 auto; }
.mcc2026 .m-paths__eyebrow { display: inline-flex; align-items: center; gap: 0.7rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--m-navy); }
.mcc2026 .m-paths__eyebrow::before { content: ''; width: 1.6rem; height: 2px; background: var(--m-red); }
.mcc2026 .m-paths__title { margin: 0.9rem 0 0; font-family: var(--m-font-display); font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.4rem); font-weight: 600; line-height: 1.15; color: var(--m-navy); }
.mcc2026 .m-paths__title em { font-style: normal; color: var(--m-red); }
.mcc2026 .m-paths__text { margin: 0.8rem auto 0; max-width: 60ch; font-size: 0.9rem; line-height: 1.6; color: var(--site-muted, #475569); }
.mcc2026 .m-paths__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; margin-top: 2.2rem; padding-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.mcc2026 .m-paths__card { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 34rem; overflow: hidden; border-radius: 16px; background: var(--m-navy); color: #fff; box-shadow: 0 24px 50px -30px rgba(0, 7, 29, 0.6); }
.mcc2026 .m-paths__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mcc2026 .m-paths__card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, color-mix(in srgb, var(--site-navy, #00071d) 5%, transparent) 0%, color-mix(in srgb, var(--site-navy, #00071d) 55%, transparent) 40%, color-mix(in srgb, var(--site-navy, #00071d) 97%, transparent) 68%); }
.mcc2026 .m-paths__body { position: relative; z-index: 1; padding: 1.6rem 1.6rem 1.6rem; }
.mcc2026 .m-paths__icon { display: inline-flex; align-items: center; justify-content: center; width: 3.3rem; height: 3.3rem; border-radius: 10px; color: #fff; margin-bottom: 1rem; }
.mcc2026 .m-paths__icon svg { width: 1.7rem; height: 1.7rem; stroke-width: 1.6; }
.mcc2026 .m-paths__icon--red { background: var(--m-red); }
.mcc2026 .m-paths__icon--navy { background: var(--site-navy, #0c2350); border: 1px solid rgba(255, 255, 255, 0.2); }
.mcc2026 .m-paths__kicker { display: block; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255, 255, 255, 0.78); }
.mcc2026 .m-paths__card-title { margin: 0.3rem 0 0; font-family: var(--m-font-display); font-size: clamp(1.4rem, 1.1rem + 0.8vw, 1.8rem); font-weight: 600; color: #fff; }
.mcc2026 .m-paths__card-text { margin: 0.6rem 0 0; font-size: 0.88rem; line-height: 1.55; color: rgba(255, 255, 255, 0.85); }
.mcc2026 .m-paths__checks { list-style: none; margin: 0.9rem 0 0; padding: 0; display: grid; gap: 0.35rem; font-size: 0.82rem; color: rgba(255, 255, 255, 0.9); }
.mcc2026 .m-paths__checks li { display: flex; align-items: center; gap: 0.55rem; }
.mcc2026 .m-paths__checks svg { width: 1rem; height: 1rem; flex: none; color: var(--site-red-bright, #ff3b47); stroke-width: 2.6; }
.mcc2026 .m-paths__cta { display: flex; align-items: center; justify-content: center; gap: 0.5rem; margin-top: 1.3rem; min-height: 3rem; border-radius: 8px; background: var(--m-red); color: #fff; font-size: 0.9rem; font-weight: 600; text-decoration: none; transition: background 0.2s; }
.mcc2026 .m-paths__cta:hover { background: var(--m-red-dark); }
.mcc2026 .m-paths__cta:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.mcc2026 .m-paths__cta svg { width: 1rem; height: 1rem; }
.mcc2026 .m-paths__stats { background: var(--m-navy); color: #fff; }
.mcc2026 .m-paths__stats ul { list-style: none; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 1rem; margin: 0 auto; padding-block: 1.8rem; }
.mcc2026 .m-paths__stats li { display: flex; align-items: center; gap: 0.9rem; }
.mcc2026 .m-paths__stat-icon { display: inline-flex; flex: none; }
.mcc2026 .m-paths__stat-icon svg { width: 1.9rem; height: 1.9rem; stroke-width: 1.4; }
.mcc2026 .m-paths__stats strong { display: block; font-family: var(--m-font-display); font-size: 1.5rem; font-weight: 600; line-height: 1.1; }
.mcc2026 .m-paths__stats small { display: block; font-size: 0.75rem; line-height: 1.35; color: rgba(255, 255, 255, 0.72); }
@media (max-width: 860px) {
    .mcc2026 .m-paths__grid { grid-template-columns: minmax(0, 1fr); }
    .mcc2026 .m-paths__card { min-height: 30rem; }
    .mcc2026 .m-paths__stats ul { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Boutons des cartes « parcours » : contour rouge seul, remplis au survol. */
.mcc2026 .m-paths__cta { background: transparent; border: 2px solid var(--m-red); }
.mcc2026 .m-paths__cta:hover { background: var(--m-red); }

/* ── Page « Notre mission » (variante 3) ─────────────────────────────────── */
/* En-tête pleine hauteur : le texte au centre, les chiffres collés en bas. */
.mcc2026 .m-phero { position: relative; display: flex; flex-direction: column; min-height: 100vh; min-height: 100svh; overflow: hidden; background: var(--m-navy); color: #fff; }
.mcc2026 .m-phero__photo { position: absolute; inset: 0; }
.mcc2026 .m-phero__photo img { width: 100%; height: 100%; object-fit: cover; }
.mcc2026 .m-phero__photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, color-mix(in srgb, var(--site-navy, #00071d) 96%, transparent) 0%, color-mix(in srgb, var(--site-navy, #00071d) 82%, transparent) 38%, color-mix(in srgb, var(--site-navy, #00071d) 25%, transparent) 75%, color-mix(in srgb, var(--site-navy, #00071d) 15%, transparent) 100%), linear-gradient(to top, color-mix(in srgb, var(--site-navy, #00071d) 85%, transparent) 0%, color-mix(in srgb, var(--site-navy, #00071d) 0%, transparent) 35%); }
.mcc2026 .m-phero__inner { position: relative; z-index: 1; flex: 1; display: flex; align-items: center; width: 100%; padding-top: calc(var(--nav-h, 72px) + 2.5rem); padding-bottom: 2.5rem; }
.mcc2026 .m-phero__copy { max-width: 40rem; }
.mcc2026 .m-phero__eyebrow,
.mcc2026 .m-pillars__eyebrow,
.mcc2026 .m-ctab__eyebrow { display: inline-flex; align-items: center; gap: 0.7rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.mcc2026 .m-phero__eyebrow::before,
.mcc2026 .m-pillars__eyebrow::before,
.mcc2026 .m-ctab__eyebrow::before { content: ''; width: 1.6rem; height: 2px; background: var(--m-red); }
.mcc2026 .m-phero__title { margin: 1.1rem 0 0; font-family: var(--m-font-display); font-size: clamp(2.4rem, 1.4rem + 3.2vw, 4.2rem); font-weight: 600; line-height: 1.05; color: #fff; letter-spacing: -0.02em; }
.mcc2026 .m-phero__title em { display: block; font-style: normal; color: var(--site-red-bright, #ee2a35); }
.mcc2026 .m-phero__text { margin: 1.3rem 0 0; max-width: 34rem; font-size: 1rem; line-height: 1.6; color: rgba(255, 255, 255, 0.85); }
.mcc2026 .m-phero__cta { margin-top: 1.8rem; }
.mcc2026 .m-phero__stats { position: relative; z-index: 1; border-top: 1px solid rgba(255, 255, 255, 0.14); background: color-mix(in srgb, var(--site-navy, #00071d) 55%, transparent); backdrop-filter: blur(6px); }
.mcc2026 .m-phero__stats ul { list-style: none; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); margin: 0 auto; padding-block: 1.6rem; }
.mcc2026 .m-phero__stats li { text-align: center; padding-inline: 0.8rem; border-inline-start: 1px solid rgba(255, 255, 255, 0.16); }
.mcc2026 .m-phero__stats li:first-child { border-inline-start: 0; }
.mcc2026 .m-phero__stats strong { display: block; font-family: var(--m-font-display); font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.3rem); font-weight: 600; line-height: 1.1; }
.mcc2026 .m-phero__stats span { display: block; margin-top: 0.35rem; font-size: 0.75rem; line-height: 1.35; color: rgba(255, 255, 255, 0.72); }
@media (max-width: 800px) {
    .mcc2026 .m-phero__stats ul { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.2rem; }
    .mcc2026 .m-phero__stats li:nth-child(odd) { border-inline-start: 0; }
}

/* Texte + photo à bord en biais (variante « diagonale » de .m-mission). */
.mcc2026 .m-mission--diagonal { background: var(--site-surface, #fff); }
.mcc2026 .m-mission--diagonal .m-mission__photo { inset: 0 0 0 48%; clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%); }
.mcc2026 .m-mission--diagonal .m-mission__photo::before { content: none; }
.mcc2026 .m-mission--diagonal .m-mission__title em { display: block; }
@media (max-width: 800px) { .mcc2026 .m-mission--diagonal .m-mission__photo { inset: auto; clip-path: none; } }

.mcc2026 .m-pillars { position: relative; overflow: hidden; background: var(--site-surface, #fff); padding-block: clamp(3rem, 6vw, 4.5rem); }
.mcc2026 .m-pillars__eyebrow { color: var(--m-navy); }
.mcc2026 .m-pillars__title { margin: 0.9rem 0 0; font-family: var(--m-font-display); font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.4rem); font-weight: 600; line-height: 1.15; color: var(--m-navy); max-width: 20ch; }
.mcc2026 .m-pillars__list { list-style: none; display: grid; grid-template-columns: repeat(var(--m-pillars, 4), minmax(0, 1fr)); margin: 2rem 0 0; padding: 0; }
.mcc2026 .m-pillars__list li { padding-inline: 1.3rem; border-inline-start: 1px solid var(--m-border); }
.mcc2026 .m-pillars__list li:first-child { padding-inline-start: 0; border-inline-start: 0; }
.mcc2026 .m-pillars__list strong { display: block; font-family: var(--m-font-display); font-size: 1rem; font-weight: 600; color: var(--m-navy); }
.mcc2026 .m-pillars__list p { margin: 0.5rem 0 0; font-size: 0.85rem; line-height: 1.55; color: var(--site-muted, #475569); }
.mcc2026 .m-pillars--dark { background: var(--m-navy); color: #fff; }
.mcc2026 .m-pillars__photo { position: absolute; inset: 0; }
.mcc2026 .m-pillars__photo img { width: 100%; height: 100%; object-fit: cover; }
.mcc2026 .m-pillars__photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, color-mix(in srgb, var(--site-navy, #00071d) 96%, transparent) 0%, color-mix(in srgb, var(--site-navy, #00071d) 90%, transparent) 55%, color-mix(in srgb, var(--site-navy, #00071d) 70%, transparent) 100%); }
.mcc2026 .m-pillars__inner { position: relative; z-index: 1; }
.mcc2026 .m-pillars--dark .m-pillars__eyebrow,
.mcc2026 .m-pillars--dark .m-pillars__title,
.mcc2026 .m-pillars--dark .m-pillars__list strong { color: #fff; }
.mcc2026 .m-pillars--dark .m-pillars__list li { border-inline-start-color: rgba(255, 255, 255, 0.18); }
.mcc2026 .m-pillars--dark .m-pillars__list p { color: rgba(255, 255, 255, 0.75); }
@media (max-width: 860px) {
    .mcc2026 .m-pillars__list { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.5rem; }
    .mcc2026 .m-pillars__list li:nth-child(odd) { padding-inline-start: 0; border-inline-start: 0; }
}

.mcc2026 .m-ctab { position: relative; overflow: hidden; background: var(--m-navy); color: #fff; }
.mcc2026 .m-ctab__photo { position: absolute; inset: 0; }
.mcc2026 .m-ctab__photo img { width: 100%; height: 100%; object-fit: cover; }
.mcc2026 .m-ctab__photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, color-mix(in srgb, var(--site-navy, #00071d) 95%, transparent) 0%, color-mix(in srgb, var(--site-navy, #00071d) 80%, transparent) 50%, color-mix(in srgb, var(--site-navy, #00071d) 45%, transparent) 100%); }
.mcc2026 .m-ctab__inner { position: relative; z-index: 1; padding-block: clamp(3rem, 6vw, 4.5rem); }
.mcc2026 .m-ctab__title { margin: 0.9rem 0 0; font-family: var(--m-font-display); font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.4rem); font-weight: 600; color: #fff; }
.mcc2026 .m-ctab__text { margin: 0.8rem 0 0; max-width: 56ch; font-size: 0.92rem; line-height: 1.6; color: rgba(255, 255, 255, 0.8); }
.mcc2026 .m-ctab__actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: 1.6rem; }
.mcc2026 .m-mission--diagonal .m-mission__title em { color: var(--m-navy); }

/* ── Page « Notre mission », version claire ─────────────────────────────── */
.mcc2026 .m-phero--light { background: var(--site-surface, #fff); color: var(--m-navy); }
.mcc2026 .m-phero--light .m-phero__photo { inset: 0 0 0 42%; }
.mcc2026 .m-phero--light .m-phero__photo::after { background: linear-gradient(90deg, var(--site-surface, #fff) 0%, color-mix(in srgb, var(--site-surface, #ffffff) 55%, transparent) 22%, color-mix(in srgb, var(--site-surface, #ffffff) 0%, transparent) 48%); }
.mcc2026 .m-phero--light .m-phero__photo::before { content: ''; position: absolute; right: 0; bottom: 0; z-index: 1; width: 16%; height: 24%; background: linear-gradient(135deg, transparent 49.5%, color-mix(in srgb, var(--m-red, #cc0000) 90%, transparent) 50%); }
.mcc2026 .m-phero--light .m-phero__eyebrow { color: var(--m-navy); }
.mcc2026 .m-phero--light .m-phero__title { color: var(--m-navy); }
.mcc2026 .m-phero--light .m-phero__title em { color: var(--m-red); }
.mcc2026 .m-phero--light .m-phero__text { color: var(--site-muted, #475569); }
.mcc2026 .m-phero__tag { position: absolute; right: 4%; bottom: 12%; z-index: 2; display: inline-flex; align-items: center; gap: 1.2rem; padding: 0.75rem 1.1rem; border-radius: 8px; background: color-mix(in srgb, var(--site-navy, #00071d) 55%, transparent); backdrop-filter: blur(8px); color: #fff; font-size: 0.8rem; font-weight: 600; }
.mcc2026 .m-phero__tag::after { content: ''; width: 1.2rem; height: 2px; background: var(--m-red); }
@media (max-width: 900px) {
    .mcc2026 .m-phero--light .m-phero__photo { inset: 0; opacity: 0.18; }
    .mcc2026 .m-phero__tag { display: none; }
}

.mcc2026 .m-mission--card { background: var(--site-surface, #fff); }
.mcc2026 .m-mission--card .m-mission__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 4vw, 3.5rem); padding-block: clamp(3rem, 6vw, 4.5rem); min-height: 0; }
.mcc2026 .m-mission--card .m-mission__copy { padding: 0; }
.mcc2026 .m-mission--left .m-mission__copy { order: 2; }
.mcc2026 .m-mission--card .m-mission__title em { display: block; color: var(--m-navy); }
.mcc2026 .m-mission__card { position: relative; margin: 0; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 14px; box-shadow: 0 24px 50px -30px rgba(0, 7, 29, 0.55); }
.mcc2026 .m-mission__card img { width: 100%; height: 100%; object-fit: cover; }
.mcc2026 .m-mission__card figcaption { position: absolute; left: 1rem; bottom: 1rem; display: inline-flex; align-items: center; gap: 1rem; padding: 0.55rem 0.9rem; border-radius: 6px; background: color-mix(in srgb, var(--site-navy, #00071d) 72%, transparent); color: #fff; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.mcc2026 .m-mission__card figcaption::after { content: ''; width: 1.1rem; height: 2px; background: var(--m-red); }
.mcc2026 .m-mission__highlights { position: absolute; z-index: 2; left: 52%; top: 50%; transform: translateY(-50%); list-style: none; margin: 0; padding: 1.2rem 1.3rem; display: grid; gap: 1.1rem; width: min(17rem, 30vw); border-radius: 12px; background: rgba(100, 116, 139, 0.55); backdrop-filter: blur(10px); color: #fff; font-size: 0.78rem; line-height: 1.35; }
.mcc2026 .m-mission__highlights li { display: flex; align-items: center; gap: 0.8rem; }
.mcc2026 .m-mission__highlights svg { width: 1.5rem; height: 1.5rem; flex: none; stroke-width: 1.4; }
@media (max-width: 800px) {
    .mcc2026 .m-mission--card .m-mission__grid { grid-template-columns: minmax(0, 1fr); }
    .mcc2026 .m-mission--left .m-mission__copy { order: 0; }
    .mcc2026 .m-mission__highlights { position: relative; left: auto; top: auto; transform: none; width: auto; margin: 1rem var(--m-gutter, 1rem); background: var(--m-navy); }
}

.mcc2026 .m-pillars--center .m-pillars__head { text-align: center; }
.mcc2026 .m-pillars--center .m-pillars__title { margin-inline: auto; max-width: none; }
.mcc2026 .m-pillars__icon { display: inline-flex; margin-bottom: 0.9rem; color: var(--m-red); }
.mcc2026 .m-pillars__icon svg { width: 2rem; height: 2rem; stroke-width: 1.4; }
.mcc2026 .m-pillars--cards .m-pillars__list { gap: 1.2rem; }
.mcc2026 .m-pillars--cards .m-pillars__list li,
.mcc2026 .m-pillars--cards .m-pillars__list li:first-child { padding: 1.4rem 1.3rem; border: 1px solid var(--m-border); border-radius: 12px; background: var(--site-surface, #fff); box-shadow: 0 10px 30px -24px rgba(0, 7, 29, 0.4); }
@media (max-width: 860px) { .mcc2026 .m-pillars--cards .m-pillars__list li:nth-child(odd) { padding-inline-start: 1.3rem; border-inline-start: 1px solid var(--m-border); } }

.mcc2026 .m-ctab__play { display: inline-flex; align-items: center; gap: 1rem; margin-top: 1.6rem; padding: 0; border: 0; background: none; color: #fff; font: 600 0.9rem/1.3 var(--m-font-body); text-align: start; cursor: pointer; max-width: 12rem; }
.mcc2026 .m-ctab__play span { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 3.4rem; height: 3.4rem; border-radius: 50%; background: var(--site-surface, #fff); color: var(--m-navy); transition: transform 0.2s var(--m-ease); }
.mcc2026 .m-ctab__play:hover span { transform: scale(1.06); }
.mcc2026 .m-ctab__play svg { width: 1.2rem; height: 1.2rem; fill: currentColor; margin-inline-start: 3px; }
.mcc2026 .m-ctab--light { background: var(--site-surface, #fff); color: var(--m-navy); padding-block: clamp(2rem, 4vw, 3rem); }
.mcc2026 .m-ctab--light .m-ctab__box { position: relative; overflow: hidden; border-radius: var(--site-radius, 16px); background: var(--site-canvas, #f4f5f8); }
.mcc2026 .m-ctab--light .m-ctab__photo { inset: 0 0 0 45%; }
.mcc2026 .m-ctab--light .m-ctab__photo::after { background: linear-gradient(90deg, var(--site-canvas, #f4f5f8) 0%, rgba(244, 245, 248, 0) 45%); }
.mcc2026 .m-ctab--light .m-ctab__photo::before { content: ''; position: absolute; right: 0; bottom: 0; z-index: 1; width: 22%; height: 55%; background: linear-gradient(135deg, transparent 49.5%, color-mix(in srgb, var(--m-red, #cc0000) 85%, transparent) 50%); }
.mcc2026 .m-ctab--light .m-ctab__inner { padding: clamp(2rem, 4vw, 3rem); max-width: 36rem; }
.mcc2026 .m-ctab--light .m-ctab__eyebrow { color: var(--m-navy); }
.mcc2026 .m-ctab--light .m-ctab__title { color: var(--m-navy); }
.mcc2026 .m-ctab--light .m-ctab__text { color: var(--site-muted, #475569); }
@media (max-width: 800px) { .mcc2026 .m-ctab--light .m-ctab__photo { opacity: 0.15; inset: 0; } }

/* Texte + photo sur fond bleu nuit : la photo se fond dans le bleu. */
.mcc2026 .m-mission--dark { background: var(--m-navy); }
.mcc2026 .m-mission--dark .m-mission__eyebrow,
.mcc2026 .m-mission--dark .m-mission__title,
.mcc2026 .m-mission--dark .m-mission__link { color: #fff; }
.mcc2026 .m-mission--dark .m-mission__title em { color: var(--site-red-bright, #ff4a55); }
.mcc2026 .m-mission--dark .m-mission__text { color: rgba(255, 255, 255, 0.78); }
.mcc2026 .m-mission--dark .m-mission__photo::before { background: linear-gradient(to right, var(--m-navy) 0%, color-mix(in srgb, var(--site-navy, #00071d) 55%, transparent) 30%, color-mix(in srgb, var(--site-navy, #00071d) 10%, transparent) 70%); }
.mcc2026 .m-mission--dark .m-mission__highlights { background: color-mix(in srgb, var(--site-navy, #00071d) 60%, transparent); border: 1px solid rgba(255, 255, 255, 0.14); }
@media (max-width: 800px) { .mcc2026 .m-mission--dark .m-mission__photo::before { background: linear-gradient(to bottom, var(--m-navy) 0%, color-mix(in srgb, var(--site-navy, #00071d) 0%, transparent) 30%); } }

/* Bande de chiffres seule (section « parcours » sans carte). */
.mcc2026 .m-paths--stats-only { padding-top: 0; }

/* ── Partenariat institutionnel : en-tête (.m-pship) ─────────────────── */
.mcc2026 .m-pship { position: relative; background: var(--site-canvas, #f7f7f5); color: var(--m-navy); padding-top: calc(var(--nav-h, 72px) + clamp(2rem, 4vw, 3rem)); padding-bottom: clamp(2rem, 4vw, 3rem); overflow: hidden; }
.mcc2026 .m-pship__photo { position: absolute; inset: 0 0 5.5rem 42%; }
.mcc2026 .m-pship__photo img { width: 100%; height: 100%; object-fit: cover; }
.mcc2026 .m-pship__photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, var(--site-canvas, #f7f7f5) 0%, rgba(247, 247, 245, 0.85) 18%, rgba(247, 247, 245, 0) 55%); }
.mcc2026 .m-pship__inner { position: relative; }
.mcc2026 .m-pship__copy { max-width: 36rem; min-height: 22rem; }
.mcc2026 .m-pship__eyebrow, .mcc2026 .m-split__eyebrow, .mcc2026 .m-numc__eyebrow { display: inline-flex; align-items: center; gap: 0.8rem; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--m-navy); }
.mcc2026 .m-pship__eyebrow { color: var(--m-red); }
.mcc2026 .m-pship__eyebrow::before, .mcc2026 .m-split__eyebrow::before, .mcc2026 .m-numc__eyebrow::before { content: ''; width: 1.8rem; height: 2px; background: var(--m-red); }
.mcc2026 .m-pship__title { margin: 1rem 0 0; font-family: var(--m-font-display); font-size: clamp(2rem, 1.3rem + 2.6vw, 3.2rem); font-weight: 700; line-height: 1.08; color: var(--m-navy); }
.mcc2026 .m-pship__subtitle { margin: 1.2rem 0 0; font-size: clamp(1.05rem, 1rem + 0.3vw, 1.25rem); line-height: 1.4; }
.mcc2026 .m-pship__text { margin: 1rem 0 0; font-size: 0.92rem; line-height: 1.65; color: var(--site-ink, #334155); }
.mcc2026 .m-pship__band { position: relative; display: flex; align-items: center; justify-content: space-around; gap: 1.5rem; margin-top: 2rem; padding: 1.3rem 2rem; border-radius: 10px; background: rgba(255, 255, 255, 0.94); box-shadow: 0 16px 40px -18px rgba(0, 7, 29, 0.28); }
.mcc2026 .m-pship__party { display: flex; align-items: center; gap: 1.1rem; min-width: 0; }
.mcc2026 .m-pship__party img { height: 4.2rem; width: auto; max-width: 12rem; object-fit: contain; }
.mcc2026 .m-pship__party strong { display: block; max-width: 16rem; font-size: 0.95rem; line-height: 1.3; }
.mcc2026 .m-pship__party small { display: block; margin-top: 0.35rem; font-size: 0.78rem; color: var(--site-muted, #64748b); }
.mcc2026 .m-pship__times { display: inline-flex; padding-inline: 1.5rem; border-inline: 1px solid var(--site-border, #e2e8f0); color: #94a3b8; }
.mcc2026 .m-pship__times svg { width: 1.8rem; height: 1.8rem; stroke-width: 1.3; }
@media (max-width: 860px) {
    .mcc2026 .m-pship__photo { position: relative; inset: auto; height: 16rem; margin-top: 1.5rem; order: 2; }
    .mcc2026 .m-pship { display: flex; flex-direction: column; }
    .mcc2026 .m-pship__photo::after { background: linear-gradient(180deg, var(--site-canvas, #f7f7f5) 0%, rgba(247, 247, 245, 0) 35%); }
    .mcc2026 .m-pship__inner { display: contents; }
    .mcc2026 .m-pship__copy { order: 1; min-height: 0; padding-inline: 16px; }
    .mcc2026 .m-pship__band { order: 3; flex-direction: column; gap: 1rem; margin: -2rem 16px 0; padding: 1.2rem; }
    .mcc2026 .m-pship__party img { height: 3.2rem; }
    .mcc2026 .m-pship__times { border: 0; padding: 0; }
}

/* ── Photo + texte (.m-split) ─────────────────────────────────────────── */
.mcc2026 .m-split { position: relative; background: var(--site-surface, #fff); color: var(--m-navy); }
.mcc2026 .m-split__photo { position: absolute; top: 0; bottom: 0; inset-inline-start: 0; width: 44%; }
.mcc2026 .m-split--right .m-split__photo { inset-inline-start: auto; inset-inline-end: 0; }
.mcc2026 .m-split__photo img { width: 100%; height: 100%; object-fit: cover; }
.mcc2026 .m-split__grid { display: grid; grid-template-columns: 44% 1fr; min-height: 22rem; }
.mcc2026 .m-split__copy { grid-column: 2; padding-block: clamp(2rem, 4vw, 3rem); padding-inline: clamp(1.5rem, 3vw, 2.5rem) 0; align-self: center; }
.mcc2026 .m-split--right .m-split__grid { grid-template-columns: 1fr 44%; }
.mcc2026 .m-split--right .m-split__copy { grid-column: 1; grid-row: 1; padding-inline: 0 clamp(1.5rem, 3vw, 2.5rem); }
.mcc2026 .m-split--noimg .m-split__grid { grid-template-columns: 1fr; min-height: 0; }
.mcc2026 .m-split--noimg .m-split__copy { grid-column: 1; padding-inline-start: 0; }
.mcc2026 .m-split__title { margin: 0.9rem 0 0; font-family: var(--m-font-display); font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.2rem); font-weight: 600; line-height: 1.18; color: var(--m-navy); }
.mcc2026 .m-split__text { margin-top: 1.1rem; font-size: 0.9rem; line-height: 1.65; color: var(--site-ink, #334155); }
.mcc2026 .m-split__text p { margin: 0; }
.mcc2026 .m-split__text--cols { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.mcc2026 .m-split__list { list-style: none; margin: 1.3rem 0 0; padding: 0; display: grid; gap: 0.9rem; font-size: 0.86rem; line-height: 1.55; color: var(--site-muted, #475569); }
.mcc2026 .m-split__list li { position: relative; padding-inline-start: 2rem; }
.mcc2026 .m-split__list li::before { content: ''; position: absolute; inset-inline-start: 0; top: 0.72em; width: 1rem; height: 2px; background: var(--m-red); }
.mcc2026 .m-split__list strong { color: var(--m-navy); font-weight: 700; }
@media (max-width: 860px) {
    .mcc2026 .m-split__photo { position: relative; width: 100%; height: 15rem; }
    .mcc2026 .m-split__grid, .mcc2026 .m-split--right .m-split__grid { grid-template-columns: 1fr; min-height: 0; }
    .mcc2026 .m-split__copy, .mcc2026 .m-split--right .m-split__copy { grid-column: 1; padding: 1.8rem 0 2.2rem; }
    .mcc2026 .m-split__text--cols { grid-template-columns: 1fr; gap: 1rem; }
}

/* ── Points numérotés (.m-numc) ───────────────────────────────────────── */
.mcc2026 .m-numc { background: var(--site-surface, #fff); color: var(--m-navy); padding-block: clamp(2.2rem, 4vw, 3.2rem); }
.mcc2026 .m-numc__title { margin: 0.9rem 0 0; font-family: var(--m-font-display); font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.2rem); font-weight: 600; line-height: 1.18; }
.mcc2026 .m-numc__list { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(min(var(--m-numc, 4), 4), minmax(0, 1fr)); gap: 0.9rem; }
.mcc2026 .m-numc__list h3 { margin: 0; font-family: var(--m-font-display); font-size: 1rem; font-weight: 700; line-height: 1.3; color: var(--m-navy); }
.mcc2026 .m-numc__list p { margin: 0.8rem 0 0; font-size: 0.84rem; line-height: 1.6; color: var(--site-muted, #475569); }
.mcc2026 .m-numc--cards .m-numc__list li { padding: 1.3rem 1.2rem 1.5rem; border-radius: 6px; background: var(--site-canvas, #f5f4f1); }
.mcc2026 .m-numc__num { display: block; font-family: var(--m-font-display); font-size: 1.9rem; font-weight: 300; line-height: 1; color: #94a3b8; }
.mcc2026 .m-numc__num::after { content: ''; display: block; width: 1.8rem; height: 2px; margin: 1rem 0 1.1rem; background: var(--m-red); }
.mcc2026 .m-numc--columns .m-numc__list { gap: 0; }
.mcc2026 .m-numc--columns .m-numc__list li { padding: 0.3rem 2rem; border-left: 1px solid var(--site-border, #e2e8f0); }
.mcc2026 .m-numc--columns .m-numc__list li:first-child { padding-left: 0; border-left: 0; }
@media (max-width: 960px) { .mcc2026 .m-numc__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) {
    .mcc2026 .m-numc__list { grid-template-columns: 1fr; }
    .mcc2026 .m-numc--columns .m-numc__list li { padding: 1rem 0; border-left: 0; border-top: 1px solid var(--site-border, #e2e8f0); }
    .mcc2026 .m-numc--columns .m-numc__list li:first-child { border-top: 0; }
}
.mcc2026 .m-pship--noband .m-pship__photo { bottom: 0; }

/* En-tête partenariat, thème bleu nuit. */
.mcc2026 .m-pship--dark { background: var(--m-navy); color: #fff; }
.mcc2026 .m-pship--dark .m-pship__photo::after { background: linear-gradient(90deg, var(--m-navy) 0%, color-mix(in srgb, var(--site-navy, #00071d) 85%, transparent) 22%, color-mix(in srgb, var(--site-navy, #00071d) 25%, transparent) 60%, color-mix(in srgb, var(--site-navy, #00071d) 10%, transparent) 100%); }
.mcc2026 .m-pship--dark .m-pship__title { color: #fff; }
.mcc2026 .m-pship--dark .m-pship__subtitle { color: rgba(255, 255, 255, 0.92); }
.mcc2026 .m-pship--dark .m-pship__text { color: rgba(255, 255, 255, 0.75); }
@media (max-width: 860px) {
    .mcc2026 .m-pship--dark .m-pship__photo::after { background: linear-gradient(180deg, var(--m-navy) 0%, color-mix(in srgb, var(--site-navy, #00071d) 0%, transparent) 40%); }
}
/* Photo + texte : marge blanche au-dessus et au-dessous, la photo ne colle
   plus à la section précédente (ex. l'en-tête de la page partenariat). */
.mcc2026 .m-split { --m-split-gap: clamp(2.5rem, 5vw, 4rem); padding-block: var(--m-split-gap); }
.mcc2026 .m-split__photo { top: var(--m-split-gap); bottom: var(--m-split-gap); }
@media (max-width: 860px) { .mcc2026 .m-split { padding-bottom: 0; } }

/* Parcours : étape conditionnelle (ex. rattrapage) — pastille en pointillé. */
.mcc2026 .m-journey__step.is-optional .m-journey__dot { border-style: dashed; background: transparent; }
.mcc2026 .m-journey__step.is-optional .m-journey__title::after { content: ' (si besoin)'; font-weight: 400; opacity: 0.7; }
@media (max-width: 1100px) { .mcc2026 .m-journey__steps[style*="--m-journey-cols"] { --m-journey-cols: 2 !important; } }
@media (max-width: 680px) { .mcc2026 .m-journey__steps[style*="--m-journey-cols"] { --m-journey-cols: 1 !important; } }

/* ── Parcours, variante « frise » (.m-jtl) ────────────────────────────── */
.mcc2026 .m-jtl { position: relative; overflow: hidden; background: radial-gradient(120% 90% at 85% 0%, color-mix(in srgb, var(--site-red-bright, #e53935) 14%, transparent), transparent 55%), var(--m-navy); color: #fff; padding-block: clamp(3rem, 6vw, 5rem); }
.mcc2026 .m-jtl__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 2rem; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.mcc2026 .m-jtl__eyebrow { display: inline-flex; align-items: center; gap: 0.7rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.12em; color: var(--m-red); }
.mcc2026 .m-jtl__eyebrow::before { content: ""; width: 1.6rem; height: 2px; background: var(--m-red); }
.mcc2026 .m-jtl__title { margin: 0.8rem 0 0; font-family: var(--m-font-display); font-size: clamp(2rem, 1.3rem + 2.6vw, 3.4rem); font-weight: 700; line-height: 1.08; color: #fff; }
.mcc2026 .m-jtl__sub { margin: 0.9rem 0 0; max-width: 40rem; font-size: clamp(0.95rem, 0.9rem + 0.25vw, 1.1rem); line-height: 1.55; color: rgba(255, 255, 255, 0.72); }
.mcc2026 .m-jtl__quote { position: relative; max-width: 26rem; margin: 0.4rem 0 0; padding: 0 1.4rem; font-size: clamp(1rem, 0.9rem + 0.4vw, 1.25rem); font-style: italic; line-height: 1.5; color: rgba(255, 255, 255, 0.92); }
.mcc2026 .m-jtl__quote span { position: absolute; font-family: Georgia, serif; font-size: 2.6rem; font-style: normal; line-height: 1; color: var(--m-red); }
.mcc2026 .m-jtl__quote span:first-child { top: -0.4rem; left: -0.2rem; }
.mcc2026 .m-jtl__quote span:last-child { bottom: -1.4rem; right: 0; }

.mcc2026 .m-jtl__track { position: relative; --m-jtl-top: 1.9rem; }
.mcc2026 .m-jtl__line { position: absolute; left: 0; right: 0; top: calc(var(--m-jtl-top) + 1rem); width: 100%; height: 76px; }
.mcc2026 .m-jtl__start { position: absolute; left: -0.35rem; top: calc(var(--m-jtl-top) + 1rem + 24px - 0.35rem); width: 0.7rem; height: 0.7rem; border-radius: 50%; background: var(--m-red); }
.mcc2026 .m-jtl__arrow { position: absolute; right: -0.2rem; top: calc(var(--m-jtl-top) + 1rem + var(--m-jtl-last-y, 24px) - 0.45rem); width: 0; height: 0; border-block: 0.45rem solid transparent; border-left: 0.7rem solid var(--m-red); }
.mcc2026 .m-jtl__track:has(.m-jtl__step.is-low:last-child) { --m-jtl-last-y: 52px; }
.mcc2026 .m-jtl__steps { position: relative; display: grid; grid-template-columns: repeat(var(--m-jtl-n, 8), minmax(0, 1fr)); gap: 0.75rem; margin: 0; padding: 0; list-style: none; }
.mcc2026 .m-jtl__step { display: flex; flex-direction: column; align-items: center; text-align: center; }
.mcc2026 .m-jtl__step.is-low { padding-top: 28px; }
.mcc2026 .m-jtl__num { height: var(--m-jtl-top); font-size: 0.85rem; font-weight: 600; color: rgba(255, 255, 255, 0.6); }
.mcc2026 .m-jtl__step.is-edge .m-jtl__num { color: #ff5a55; font-weight: 800; }
.mcc2026 .m-jtl__dot { display: inline-flex; align-items: center; justify-content: center; width: 4.6rem; height: 4.6rem; border-radius: 50%; background: var(--site-surface, #fff); color: var(--m-navy); box-shadow: 0 12px 28px -10px rgba(0, 0, 0, 0.55); }
.mcc2026 .m-jtl__dot svg { width: 1.8rem; height: 1.8rem; stroke-width: 1.6; }
.mcc2026 .m-jtl__step.is-edge .m-jtl__dot { background: var(--m-red); color: #fff; box-shadow: 0 0 0 8px color-mix(in srgb, var(--site-red-bright, #e53935) 18%, transparent), 0 14px 30px -10px color-mix(in srgb, var(--site-red-bright, #e53935) 70%, transparent); }
.mcc2026 .m-jtl__step.is-optional .m-jtl__dot { background: var(--m-navy); color: #fff; border: 2px dashed rgba(255, 255, 255, 0.6); box-shadow: none; }
.mcc2026 .m-jtl__label { position: relative; margin-top: 1.3rem; padding-top: 0.9rem; font-size: 0.98rem; font-weight: 700; line-height: 1.3; color: #fff; }
.mcc2026 .m-jtl__label::before { content: ""; position: absolute; top: 0; left: 50%; width: 1.8rem; height: 2px; margin-left: -0.9rem; background: var(--m-red); opacity: 0; }
.mcc2026 .m-jtl__step.is-edge .m-jtl__label::before, .mcc2026 .m-jtl__step.is-optional .m-jtl__label::before { opacity: 1; }
.mcc2026 .m-jtl__label small { display: block; font-size: 0.85rem; font-weight: 500; color: rgba(255, 255, 255, 0.7); }
.mcc2026 .m-jtl__text { margin-top: 0.5rem; font-size: 0.82rem; line-height: 1.5; color: rgba(255, 255, 255, 0.66); }

@media (max-width: 900px) {
    .mcc2026 .m-jtl__head { flex-direction: column; gap: 1.5rem; }
    .mcc2026 .m-jtl__line, .mcc2026 .m-jtl__start, .mcc2026 .m-jtl__arrow { display: none; }
    .mcc2026 .m-jtl__steps { grid-template-columns: 1fr; gap: 0; }
    .mcc2026 .m-jtl__steps::before { content: ""; position: absolute; top: 1.5rem; bottom: 1.5rem; left: 1.75rem; width: 2px; background: linear-gradient(var(--m-red), rgba(255, 255, 255, 0.25) 30%, rgba(255, 255, 255, 0.25) 70%, var(--m-red)); }
    .mcc2026 .m-jtl__step, .mcc2026 .m-jtl__step.is-low { display: grid; grid-template-columns: 3.5rem 1fr; column-gap: 1rem; align-items: start; padding: 0 0 1.4rem; text-align: left; }
    .mcc2026 .m-jtl__dot { position: relative; grid-row: 1 / span 3; width: 3.5rem; height: 3.5rem; }
    .mcc2026 .m-jtl__dot svg { width: 1.35rem; height: 1.35rem; }
    .mcc2026 .m-jtl__num { grid-column: 2; height: auto; font-size: 0.75rem; }
    .mcc2026 .m-jtl__label { grid-column: 2; margin-top: 0.1rem; padding-top: 0; }
    .mcc2026 .m-jtl__label::before { display: none; }
    .mcc2026 .m-jtl__text { grid-column: 2; margin-top: 0.25rem; }
    .mcc2026 .m-jtl__step.is-edge .m-jtl__dot { box-shadow: 0 0 0 5px color-mix(in srgb, var(--site-red-bright, #e53935) 18%, transparent); }
}
@media (prefers-reduced-motion: reduce) { .mcc2026 .m-jtl__step { transition: none; } }

/* Frise : titre de section un peu plus grand. */
.mcc2026 .m-jtl .m-jtl__title { font-size: clamp(2.2rem, 1.4rem + 3vw, 3.8rem); }

/* Forme unique des boutons (réglage du thème « rayon des boutons »). */
.mcc2026 .m-paths__cta, .mcc2026 .m-newsletter__form button { border-radius: var(--m-radius-btn, 6px); }

/* ── Parcours, variante « étapes numérotées » (mcc_journey, layout = steps) ── */
.mcc2026 .m-jst { background: transparent; }
.mcc2026 .m-jst__card {
    position: relative; overflow: hidden;
    padding: clamp(2.5rem, 5vw, 4.25rem) clamp(1.25rem, 4vw, 3.5rem) clamp(2.25rem, 4vw, 3rem);
    border-radius: 18px;
    background: var(--site-canvas, #faf9f8);
    box-shadow: 0 20px 60px -30px rgba(0, 7, 29, 0.25);
    text-align: center;
}
.mcc2026 .m-jst__eyebrow {
    display: inline-flex; align-items: center; gap: 1rem;
    margin: 0 0 1rem;
    font-size: 12.5px; font-weight: 700; letter-spacing: 0.32em; text-transform: uppercase; color: #a0182a;
}
.mcc2026 .m-jst__eyebrow::before, .mcc2026 .m-jst__eyebrow::after { content: ''; width: 30px; height: 1.5px; background: #a0182a; }
.mcc2026 .m-jst__title { margin: 0 0 0.9rem; font-family: var(--m-font-display, 'Fraunces', Georgia, serif); font-size: clamp(2rem, 4.2vw, 3.4rem); font-weight: 500; line-height: 1.05; letter-spacing: -0.02em; color: var(--site-navy, #0b1733); }
.mcc2026 .m-jst__sub { margin: 0 auto; max-width: 52rem; font-family: var(--m-font-display, 'Fraunces', Georgia, serif); font-size: clamp(1.05rem, 1.6vw, 1.35rem); color: var(--site-muted, #5b6477); }

.mcc2026 .m-jst__steps {
    list-style: none; margin: clamp(2.5rem, 5vw, 4rem) 0 0; padding: 0;
    display: grid; grid-template-columns: repeat(var(--m-jst-n, 6), minmax(0, 1fr)); gap: 0 1rem;
}
.mcc2026 .m-jst__step { position: relative; display: flex; flex-direction: column; align-items: center; }
/* Filet entre deux cercles : du bord droit de ce cercle au bord gauche du suivant. */
.mcc2026 .m-jst__step:not(:last-child)::after {
    content: ''; position: absolute; top: 1.8rem; left: calc(50% + 1.9rem); width: calc(100% + 1rem - 3.8rem); height: 1.5px;
    background: #c9ccd4;
}
.mcc2026 .m-jst__step:nth-last-child(2)::after { background: var(--site-red, #c81e32); }
.mcc2026 .m-jst__num {
    display: grid; place-items: center;
    width: 3.6rem; height: 3.6rem; border-radius: 50%;
    background: var(--site-surface, #fff); border: 1.5px solid var(--site-border, #c9ccd4);
    font-family: var(--m-font-display, 'Fraunces', Georgia, serif); font-size: 1.35rem; color: var(--site-navy, #0b1733);
}
.mcc2026 .m-jst__step.is-last .m-jst__num { background: var(--site-red, #c81e32); border-color: var(--site-red, #c81e32); color: #fff; box-shadow: 0 0 0 5px color-mix(in srgb, var(--site-red, #c81e32) 12%, transparent); }
.mcc2026 .m-jst__label { margin: 1.4rem 0 0.8rem; font-family: var(--m-font-display, 'Fraunces', Georgia, serif); font-size: clamp(1.1rem, 1.5vw, 1.4rem); font-weight: 600; line-height: 1.25; color: var(--site-navy, #0b1733); }
.mcc2026 .m-jst__text { margin: 0; font-family: var(--m-font-display, 'Fraunces', Georgia, serif); font-size: 15.5px; line-height: 1.55; color: var(--site-muted, #5b6477); }

.mcc2026 .m-jst__cta { margin-top: clamp(2.25rem, 4vw, 3.25rem); padding-top: clamp(2rem, 3vw, 2.5rem); border-top: 1px solid var(--site-border, #eceae7); }
.mcc2026 .m-jst__bar { display: block; width: 40px; height: 2px; margin: 0 auto 1.4rem; background: var(--site-red, #c81e32); }
.mcc2026 .m-jst__cta-title { margin: 0 0 1.4rem; font-family: var(--m-font-display, 'Fraunces', Georgia, serif); font-size: clamp(1.5rem, 2.4vw, 2rem); font-weight: 600; color: var(--site-navy, #0b1733); }
.mcc2026 .m-jst__btn {
    display: inline-flex; align-items: center; gap: 1.2rem;
    padding: 1.05rem 2.6rem; border-radius: var(--site-radius-btn, 8px);
    background: #a0182a; color: #fff; text-decoration: none;
    font-family: var(--m-font-display, 'Fraunces', Georgia, serif); font-size: 1.15rem;
    box-shadow: 0 12px 26px -12px rgba(160, 24, 42, 0.7);
    transition: background 0.2s, transform 0.2s;
}
.mcc2026 .m-jst__btn:hover { background: #83121f; transform: translateY(-1px); color: #fff; }
.mcc2026 .m-jst__btn svg.lucide { width: 20px; height: 20px; }

@media (max-width: 900px) {
    .mcc2026 .m-jst__steps { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; text-align: left; }
    .mcc2026 .m-jst__step { display: grid; grid-template-columns: 3.6rem minmax(0, 1fr); column-gap: 1.1rem; align-items: start; }
    .mcc2026 .m-jst__num { grid-row: 1 / 3; }
    .mcc2026 .m-jst__label { margin: 0.35rem 0 0.35rem; }
    .mcc2026 .m-jst__step:not(:last-child)::after { top: 3.9rem; left: 1.8rem; width: 1.5px; height: calc(100% - 2.6rem); }
}

/* ── Parcours, variante « vague » (mcc_journey, layout = wave — maquette variante 4) ── */
.mcc2026 .m-jwv { background: var(--site-surface, #fff); }
/* La colonne d'intro ne descend jamais sous son mot le plus long : avec un
   minimum fixe (15rem), « accompagnement » débordait sur l'étape 01. */
.mcc2026 .m-jwv__grid { display: grid; grid-template-columns: minmax(min-content, 0.85fr) minmax(0, 3fr); gap: 2.5rem; align-items: start; }
.mcc2026 .m-jwv__eyebrow { margin: 0 0 0.6rem; font-size: 11.5px; font-weight: 600; letter-spacing: 0.3em; text-transform: uppercase; color: var(--site-muted, #6b7280); }
.mcc2026 .m-jwv__title { margin: 0 0 0.9rem; font-family: var(--m-font-display, 'Fraunces', Georgia, serif); font-size: clamp(1.5rem, 2vw, 1.85rem); font-weight: 500; line-height: 1.12; color: var(--site-navy, #0b1733); }
.mcc2026 .m-jwv__text { margin: 0 0 1.3rem; font-size: 15px; line-height: 1.55; color: var(--site-muted, #4b5563); }
.mcc2026 .m-jwv__btn {
    display: inline-flex; align-items: center; gap: 0.7rem;
    padding: 0.75rem 1.2rem; border-radius: var(--site-radius-btn, 4px);
    background: var(--site-red, #d11124); color: #fff; text-decoration: none; font-size: 14px; font-weight: 600;
    transition: background 0.2s;
}
.mcc2026 .m-jwv__btn:hover { background: var(--site-red-dark, #a90d1d); color: #fff; }
.mcc2026 .m-jwv__btn svg.lucide { width: 16px; height: 16px; }

.mcc2026 .m-jwv__track { position: relative; padding-right: 2.5rem; }
.mcc2026 .m-jwv__line { position: absolute; left: 0; right: 2.5rem; top: calc(1.4rem - 2px); width: calc(100% - 2.5rem); height: 92px; }
.mcc2026 .m-jwv__arrow { position: absolute; right: 0; top: 0.3rem; width: 52px; height: 22px; }
.mcc2026 .m-jwv__steps { position: relative; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--m-jwv-n, 6), minmax(0, 1fr)); gap: 0 1rem; }
.mcc2026 .m-jwv__step { display: flex; flex-direction: column; align-items: flex-start; }
.mcc2026 .m-jwv__step.is-low { margin-top: 48px; }
.mcc2026 .m-jwv__num { height: 1.4rem; font-size: 11.5px; font-weight: 700; color: var(--site-muted, #4b5563); }
.mcc2026 .m-jwv__step.is-first .m-jwv__num { color: var(--site-red, #d11124); }
.mcc2026 .m-jwv__dot {
    display: grid; place-items: center;
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--site-surface, #fff); color: var(--site-navy, #0b1733);
    box-shadow: 0 6px 16px -6px rgba(0, 7, 29, 0.25);
}
.mcc2026 .m-jwv__step.is-first .m-jwv__dot { background: var(--site-red, #d11124); color: #fff; box-shadow: 0 0 0 7px color-mix(in srgb, var(--site-red, #d11124) 12%, transparent); }
.mcc2026 .m-jwv__dot svg.lucide { width: 18px; height: 18px; }
.mcc2026 .m-jwv__label { margin: 0.85rem 0 0.35rem; font-size: 14.5px; font-weight: 700; line-height: 1.3; color: var(--site-navy, #0b1733); }
.mcc2026 .m-jwv__desc { margin: 0; font-size: 13px; line-height: 1.5; color: var(--site-muted, #6b7280); }

/* Survol : la pastille se soulève et l'étape passe au rouge. */
.mcc2026 .m-jwv__dot { position: relative; transition: transform 0.25s var(--m-ease), box-shadow 0.25s, color 0.25s; }
.mcc2026 .m-jwv__label { transition: color 0.25s; }
.mcc2026 .m-jwv__step:hover .m-jwv__dot { transform: translateY(-3px); color: var(--site-red, #d11124); box-shadow: 0 12px 22px -8px rgba(0, 7, 29, 0.35); }
.mcc2026 .m-jwv__step.is-first:hover .m-jwv__dot { color: #fff; box-shadow: 0 0 0 7px color-mix(in srgb, var(--site-red, #d11124) 18%, transparent), 0 12px 22px -8px color-mix(in srgb, var(--site-red, #d11124) 50%, transparent); }
.mcc2026 .m-jwv__step:hover .m-jwv__label { color: var(--site-red, #d11124); }

/* Première étape : halo qui pulse, pour marquer le point de départ. */
.mcc2026 .m-jwv__step.is-first .m-jwv__dot::after {
    content: ""; position: absolute; inset: 0; border-radius: 50%;
    animation: m-jwv-pulse 2.4s ease-out infinite;
}
@keyframes m-jwv-pulse {
    0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--site-red, #d11124) 35%, transparent); }
    70%, 100% { box-shadow: 0 0 0 16px color-mix(in srgb, var(--site-red, #d11124) 0%, transparent); }
}

/* Entrée à l'écran, armée par le script de journey-wave (.is-armed puis
   .is-on). La ligne se dévoile de gauche à droite en --m-jwv-draw ; chaque
   étape attend que le trait atteigne sa colonne (--m-jwv-i / --m-jwv-n),
   puis la flèche arrive. Sans .is-armed (pas de JS, animations réduites),
   rien n'est masqué. */
.mcc2026 .m-jwv { --m-jwv-draw: 1.6s; }
.mcc2026 .m-jwv.is-armed .m-jwv__line { clip-path: inset(0 100% 0 0); }
.mcc2026 .m-jwv.is-armed .m-jwv__step { opacity: 0; transform: translateY(14px); }
.mcc2026 .m-jwv.is-armed .m-jwv__arrow { opacity: 0; transform: translateX(-12px); }
/* Les transitions ne portent que sur l'état final : le masquage initial est
   instantané, seule l'apparition est animée. */
.mcc2026 .m-jwv.is-on .m-jwv__line { clip-path: inset(0 0 0 0); transition: clip-path var(--m-jwv-draw) cubic-bezier(0.45, 0, 0.25, 1); }
.mcc2026 .m-jwv.is-on .m-jwv__step {
    opacity: 1; transform: none;
    transition: opacity 0.5s var(--m-ease), transform 0.5s var(--m-ease);
    transition-delay: calc(var(--m-jwv-draw) * var(--m-jwv-i, 0) / var(--m-jwv-n, 6));
}
.mcc2026 .m-jwv.is-on .m-jwv__arrow { opacity: 1; transform: none; transition: opacity 0.4s, transform 0.4s var(--m-ease); transition-delay: calc(var(--m-jwv-draw) - 0.1s); }
.mcc2026 .m-jwv.is-on .m-jwv__dot {
    animation: m-jwv-pop 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) backwards;
    animation-delay: calc(var(--m-jwv-draw) * var(--m-jwv-i, 0) / var(--m-jwv-n, 6) + 0.08s);
}
@keyframes m-jwv-pop { from { transform: scale(0.4); } }

@media (prefers-reduced-motion: reduce) {
    .mcc2026 .m-jwv__step.is-first .m-jwv__dot::after { animation: none; }
}

@media (max-width: 1200px) {
    .mcc2026 .m-jwv__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
    .mcc2026 .m-jwv__line, .mcc2026 .m-jwv__arrow { display: none; }
    .mcc2026 .m-jwv__track { padding-right: 0; }
    .mcc2026 .m-jwv__steps { grid-template-columns: minmax(0, 1fr); gap: 1.4rem; }
    .mcc2026 .m-jwv__step, .mcc2026 .m-jwv__step.is-low { margin-top: 0; display: grid; grid-template-columns: 40px minmax(0, 1fr); column-gap: 1rem; }
    .mcc2026 .m-jwv__num { grid-column: 2; height: auto; }
    .mcc2026 .m-jwv__dot { grid-column: 1; grid-row: 1 / 4; }
    .mcc2026 .m-jwv__label { grid-column: 2; margin-top: 0.1rem; }
    .mcc2026 .m-jwv__desc { grid-column: 2; }
}

/* Bande de logos partenaires dans le hero MCC (optionnelle, pilotée par
   data.partners_logos). Scale jusqu'à 6 logos sur une ligne, wrap en-dessous. */
.m-hero__partners {
    position: relative;
    z-index: 2;
    margin-top: clamp(1.5rem, 1rem + 1.5vw, 2.5rem);
    padding: 0.9rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    align-items: center;
    text-align: center;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.m-hero__partners-label {
    font-family: var(--m-font-body, 'Montserrat', Helvetica, Arial, sans-serif);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.6);
}
.m-hero__partners-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 1.75rem 2.5rem;
    width: 100%;
}
.m-hero__partners-list li { display: flex; align-items: center; min-width: 0; }
.m-hero__partners-list a,
.m-hero__partners-list > li > span {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.m-hero__partners-list img {
    max-height: 42px;
    max-width: 150px;
    width: auto;
    height: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 0.78;
    transition: opacity 0.25s ease, filter 0.25s ease;
}
.m-hero__partners-list a:hover img {
    opacity: 1;
    filter: none;
}
.m-hero__partners-list > li > span {
    font-family: var(--m-font-body, 'Montserrat', sans-serif);
    font-size: 0.9rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.78);
}
/* Hero clair : logos foncés */
.m-hero--light .m-hero__partners { border-top-color: color-mix(in srgb, var(--site-navy, #0a1e3c) 10%, transparent); }
.m-hero--light .m-hero__partners-label { color: rgba(10, 30, 60, 0.55); }
.m-hero--light .m-hero__partners-list img { filter: grayscale(1); }
.m-hero--light .m-hero__partners-list a:hover img { filter: none; }
@media (max-width: 640px) {
    .m-hero__partners-list { gap: 1.25rem 1.75rem; }
    .m-hero__partners-list img { max-height: 32px; max-width: 110px; }
}

/* ───────────────────────────────────────────────────────────────────────────
   mcc_hero — logos partenaires remontés sous le titre.
   Quand la bande `.m-hero__partners--inline` est placée dans `.m-hero__inner`,
   on retire la bordure supérieure et on serre les marges : ce n'est plus un
   pied de section mais un rappel aligné sur le texte.
   ─────────────────────────────────────────────────────────────────────────── */
.m-hero__inner .m-hero__partners--inline {
    border-top: none;
    padding: 0;
    align-items: flex-start;
    text-align: start;
    margin-top: clamp(0.75rem, 0.5rem + 0.8vw, 1.25rem);
    margin-bottom: clamp(1rem, 0.75rem + 0.8vw, 1.5rem);
}
.m-hero__inner .m-hero__partners--inline .m-hero__partners-list {
    justify-content: flex-start;
    gap: 1.25rem 2rem;
}
.m-hero__inner .m-hero__partners--inline .m-hero__partners-list img {
    /* `height` fixe plutôt que `max-height` : un SVG sans attributs `width`/
       `height` (seulement un viewBox) rend 0×0 sous un `max-height` + `height:
       auto`. Le logo UCAM est exactement dans ce cas. */
    height: 36px;
    width: auto;
    max-width: 130px;
}

/* ─────────────────────────────────────────────────────────────────────────
   Sections génériques sur une page MCC 2026 (16/10/2026) : titre, texte,
   image, galerie, vidéo, colonnes, appel à l'action, FAQ, HTML, espace.
   Vues : resources/views/visitors/cms-sections/{type}.blade.php
   ───────────────────────────────────────────────────────────────────────── */

/* Contenu rédigé (éditeur riche, « Contenu » de la page, HTML libre). */
.mcc2026 .m-prose { color: var(--m-ink); font-size: 1.0625rem; line-height: 1.75; }
.mcc2026 .m-prose > * + * { margin-top: 1em; }
.mcc2026 .m-prose h2, .mcc2026 .m-prose h3, .mcc2026 .m-prose h4 { font-family: var(--m-font-display); color: var(--m-navy); line-height: 1.2; margin-top: 1.6em; }
.mcc2026 .m-prose h2 { font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.2rem); }
.mcc2026 .m-prose h3 { font-size: 1.4rem; }
.mcc2026 .m-prose a { color: var(--m-red); text-decoration: underline; text-underline-offset: 3px; }
.mcc2026 .m-prose ul, .mcc2026 .m-prose ol { padding-inline-start: 1.4em; }
.mcc2026 .m-prose ul { list-style: disc; }
.mcc2026 .m-prose ol { list-style: decimal; }
.mcc2026 .m-prose li + li { margin-top: .35em; }
.mcc2026 .m-prose blockquote { border-inline-start: 3px solid var(--m-accent); padding: .2em 0 .2em 1.1em; font-family: var(--m-font-display); font-size: 1.25rem; color: var(--m-navy); }
.mcc2026 .m-prose img { max-width: 100%; height: auto; border-radius: var(--m-radius); }
.mcc2026 .m-prose table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.mcc2026 .m-prose th, .mcc2026 .m-prose td { border: 1px solid var(--m-border); padding: .55em .8em; text-align: start; }

.mcc2026 .m-gen__heading { margin: 0; }
.mcc2026 .m-gen__heading--h1 { font-size: clamp(2.2rem, 1.5rem + 2.4vw, 3.4rem); }
.mcc2026 .m-gen__heading--h3 { font-size: clamp(1.4rem, 1.2rem + .8vw, 1.8rem); }
.mcc2026 .m-gen__heading--h4 { font-size: 1.3rem; }

.mcc2026 .m-gen__text--media { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; }
.mcc2026 .m-gen__text-media { margin: 0; }
.mcc2026 .m-gen__text-media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--m-radius); box-shadow: var(--m-shadow-md); }

.mcc2026 .m-gen__figure { margin: 0; max-width: 960px; }
.mcc2026 .m-gen__figure--center { margin-inline: auto; }
.mcc2026 .m-gen__figure--right { margin-inline-start: auto; }
.mcc2026 .m-gen__figure img { width: 100%; height: auto; border-radius: var(--m-radius); box-shadow: var(--m-shadow-md); }
.mcc2026 .m-gen figcaption { margin-top: .7rem; font-size: var(--m-small); color: var(--m-muted); text-align: center; }

.mcc2026 .m-gen__gallery { display: grid; grid-template-columns: repeat(var(--m-gen-cols, 3), minmax(0, 1fr)); gap: var(--m-gap); margin-top: 1.5rem; }
.mcc2026 .m-gen__gallery figure { margin: 0; overflow: hidden; border-radius: var(--m-radius); }
.mcc2026 .m-gen__gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform var(--m-dur) var(--m-ease); }
.mcc2026 .m-gen__gallery figure:hover img { transform: scale(1.04); }

.mcc2026 .m-gen__video { margin: 0; }
.mcc2026 .m-gen__video-frame { position: relative; aspect-ratio: 16 / 9; border-radius: var(--m-radius); overflow: hidden; background: var(--m-navy); box-shadow: var(--m-shadow-lg); }
.mcc2026 .m-gen__video-frame iframe, .mcc2026 .m-gen__video-frame video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.mcc2026 .m-gen__cols { display: grid; grid-template-columns: repeat(var(--m-gen-cols, 3), minmax(0, 1fr)); gap: var(--m-gap); margin-top: 2rem; }
.mcc2026 .m-gen__col { background: var(--m-surface); border: 1px solid var(--m-border); border-radius: var(--m-radius); padding: 1.6rem; box-shadow: var(--m-shadow-sm); }
.mcc2026 .m-gen__col h3 { font-family: var(--m-font-display); font-size: 1.3rem; color: var(--m-navy); margin: 0 0 .6rem; }
.mcc2026 .m-gen__col p { color: var(--m-muted); line-height: 1.65; margin: 0; }

.mcc2026 .m-gen__cta { text-align: center; }
.mcc2026 .m-gen__cta .m-lead { margin-inline: auto; }
.mcc2026 .m-gen__cta .m-btn { margin-top: 1.6rem; }

.mcc2026 .m-gen__faq { margin-top: 1.6rem; border-top: 1px solid var(--m-border); }
.mcc2026 .m-gen__faq details { border-bottom: 1px solid var(--m-border); }
.mcc2026 .m-gen__faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem; padding: 1.15rem 0; font-weight: 600; color: var(--m-navy); font-size: 1.05rem; }
.mcc2026 .m-gen__faq summary::-webkit-details-marker { display: none; }
.mcc2026 .m-gen__faq summary::after { content: "+"; color: var(--m-red); font-size: 1.4rem; line-height: 1; transition: transform .2s ease; }
.mcc2026 .m-gen__faq details[open] summary::after { transform: rotate(45deg); }
.mcc2026 .m-gen__faq details .m-prose { padding: 0 0 1.2rem; color: var(--m-muted); font-size: 1rem; }

@media (max-width: 900px) {
    .mcc2026 .m-gen__text--media { grid-template-columns: 1fr; }
    .mcc2026 .m-gen__cols { grid-template-columns: 1fr; }
    .mcc2026 .m-gen__gallery { grid-template-columns: repeat(min(var(--m-gen-cols, 3), 2), minmax(0, 1fr)); }
}

/* Vidéo de fond de l'en-tête de page (mcc_page_hero, 16/10/2026) : posée
   sur la photo, sous le voile (::after). Une vidéo YouTube/Vimeo est
   agrandie pour couvrir le cadre comme object-fit: cover. */
.mcc2026 .m-phero__photo.has-video { container-type: size; }
.mcc2026 .m-phero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; display: block; }
.mcc2026 .m-phero__video--embed { inset: auto; top: 50%; left: 50%; width: max(100cqw, 177.78cqh); height: max(100cqh, 56.25cqw); transform: translate(-50%, -50%); pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .mcc2026 .m-phero__video { display: none; } }

/* Contraste des logos (App\Support\LogoContrast, 17/10/2026) : faute de
   variante adaptée au fond, un logo clair sur fond clair est assombri, un
   logo sombre sur fond sombre est éclairci. */
.mcc2026 .m-logo--to-dark { filter: brightness(0) !important; }
.mcc2026 .m-logo--to-light { filter: brightness(0) invert(1) !important; }
