/*
 * Pages refondues : actualités, professionnels, témoignages, partenaires, ressources.
 * Chargé par Controller::loadPageStyles().
 *
 * Deux règles du site à garder en tête :
 *  - _header : a:not(.btn, ...) { color: ... !important } force les liens en vert.
 *    Les liens stylés ici portent donc .btn, sauf dans .actu qui surcharge en !important.
 *  - custom.site.css : article a { color: orange !important }. Pas de balise <article>
 *    ici, sauf le lecteur d'actualités qui surcharge.
 *
 * Plan : variables, base, composants communs (.jm-*), puis une section par page.
 */

:root {
    --jm-ink: #1c2321;
    --jm-ink-soft: #55605c;
    --jm-ink-muted: #6b7671;
    --jm-line: #e3e8e4;
    --jm-line-strong: #c9d2cc;
    --jm-tint: #f4f7f2;
    --jm-tint-green: #eaf6e3;
    --jm-tint-orange: #fdf0e6;
    --jm-orange-ink: #a3520f;
    --jm-deep: #265443;
    --jm-green: #35a806;
    --jm-green-btn: #288204;
    --jm-green-dark: #1f6503;
    --jm-green-light: #8fd65f;
    --jm-yellow: #df9d12;
    --jm-orange: #e8772e;
    --jm-orange-dark: #c96a1c;
    --jm-red: #bc052d;
    --jm-gauge-yellow: #e3bd00;
    --jm-gauge-red: #e0352b;
    --jm-gauge: linear-gradient(90deg, #1f7a30, #8fc31f 30%, #f2c200 52%, #ef8a2b 74%, var(--jm-gauge-red));
    --jm-on-dark-soft: rgba(255, 255, 255, .78);
    --jm-on-dark-line: rgba(255, 255, 255, .14);
    --jm-on-dark-bg: rgba(255, 255, 255, .05);
    --jm-radius: 12px;
    --jm-radius-lg: 16px;
    --jm-shadow: 0 10px 26px rgba(28, 35, 33, .12);
    --jm-shadow-lg: 0 18px 40px rgba(28, 35, 33, .16);
    --jm-gap: 1.25rem;
    --jm-gap-lg: clamp(2rem, 5vw, 4.5rem);
}

/* Base
   ------------------------------------------------------------------ */

/* La barre fixe (134 px) dépasse l'espace réservé par .marg-top (95 px) */
.jm,
.actu {
    margin-top: 39px;
    color: var(--jm-ink);
}

.jm {
    font-size: 1.0625rem;
    line-height: 1.65;
}

@media (prefers-reduced-motion: no-preference) {
    html:has(.jm) {
        scroll-behavior: smooth;
    }
}

/* :where garde une spécificité faible ; le compteur positionne lui-même ses images */
.jm img:where(:not(.justau-body img)) {
    display: block;
    max-width: 100%;
    height: auto;
}

.jm p:last-child {
    margin-bottom: 0;
}

/* Le site met une majuscule à chaque mot des boutons */
.jm .btn {
    text-transform: none;
}

/* custom.site.css : au survol, .btn::after couvre le bouton d'un calque vert, sous le texte.
   Illisible sur nos cartes : chaque composant définit ici son propre état de survol. */
.jm .btn::after,
.actu .btn::after {
    display: none;
}

.jm .btn:focus-visible {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 2px;
}

/* Le mot JUSTAUMETRE garde ses couleurs : son jaune et son rouge ont besoin d'un fond clair */
.jm-dark .justaumetre-bg-white,
.jm-question .justaumetre-bg-white {
    margin-inline: .1em .25em;
    padding: 0 .3em;
    border-radius: 6px;
    background: #fff;
    color: var(--jm-ink);
    white-space: nowrap;
}

/* Composants : structure
   ------------------------------------------------------------------ */
.jm-section {
    --jm-pad: clamp(3.5rem, 7vw, 6rem);
    padding-block: var(--jm-pad);
    /* Après un clic sur le sommaire, le titre s'arrête 32 px sous la barre fixe (103 px une fois réduite).
       custom.site.css ajoute déjà scroll-padding-top: 100px, d'où 35 px et non 135 px. */
    scroll-margin-top: calc(35px - var(--jm-pad));
}

/* Sans marge haute : rien à déduire du décalage d'ancre */
.jm-section.pt-0 {
    scroll-margin-top: 35px;
}

.jm-head {
    max-width: 780px;
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.jm-head-split {
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.jm-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--jm-gap-lg);
    align-items: center;
}

.jm-split--reverse > img {
    order: 2;
}

.jm .jm-split > img {
    width: 100%;
    border-radius: var(--jm-radius-lg);
}

.jm-split p,
.jm-example p {
    color: var(--jm-ink-soft);
}

.jm-intro {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
    gap: clamp(2rem, 6vw, 5rem);
    align-items: start;
}

/* Composants : textes
   ------------------------------------------------------------------ */
.jm-eyebrow {
    margin: 0 0 .75rem;
    color: var(--jm-green-dark);
    font-size: .875rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.jm-eyebrow .justaumetre-bg-white {
    letter-spacing: 0;
}

.jm .jm-h2 {
    margin: 0 0 1.25rem;
    color: var(--jm-ink);
    font-size: clamp(1.625rem, 3vw, 2.375rem);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.015em;
    text-wrap: balance;
}

.jm-lead {
    color: var(--jm-ink-soft);
    font-size: clamp(1.0625rem, 1.5vw, 1.1875rem);
}

.jm-more {
    margin-top: 2rem;
    color: var(--jm-ink-soft);
}

.jm-takeaway {
    padding-left: 1.25rem;
    border-left: 4px solid var(--jm-green);
    color: var(--jm-ink);
    font-weight: 500;
}

.jm-closing {
    max-width: 820px;
    margin: clamp(2.5rem, 5vw, 4rem) auto 0;
    font-size: clamp(1.1875rem, 2vw, 1.5rem);
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
    text-wrap: balance;
}

.jm-c-green { color: var(--jm-green-btn); }
.jm-c-orange { color: var(--jm-orange-dark); }
.jm-c-red { color: var(--jm-red); }

/* Composants : boutons et liens
   ------------------------------------------------------------------ */
.jm-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
}

.jm .jm-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: .8rem 1.5rem;
    border: 2px solid transparent;
    border-radius: 999px;
    font-size: 1rem;
    font-weight: 700;
    transition: background-color .2s, border-color .2s, color .2s;
}

.jm .jm-btn--primary {
    background: var(--jm-green-btn);
    color: #fff;
}

.jm .jm-btn--primary:hover {
    background: var(--jm-green-dark);
    color: #fff;
}

.jm .jm-btn--ghost {
    border-color: var(--jm-ink);
    background: transparent;
    color: var(--jm-ink);
}

.jm .jm-btn--ghost:hover {
    background: var(--jm-ink);
    color: #fff;
}

/* Une phrase entière en lien, donc pas un bouton */
.jm .jm-link {
    display: inline;
    padding: 0;
    border: 0;
    color: var(--jm-green-dark);
    font-size: inherit;
    font-weight: 700;
    line-height: inherit;
    text-align: left;
    text-decoration: underline;
    text-underline-offset: 3px;
    vertical-align: baseline;
    white-space: normal;
}

.jm .jm-link:hover {
    background: transparent;
    color: var(--jm-ink);
}

/* Composants : en-tête de page
   ------------------------------------------------------------------ */
.jm-hero {
    padding-block: clamp(2.5rem, 5vw, 4.5rem) 0;
    background: var(--jm-tint);
}

.jm-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--jm-gap-lg);
    align-items: center;
}

.jm .jm-hero__title {
    margin: 0 0 1.25rem;
    color: var(--jm-ink);
    font-size: clamp(2rem, 4.2vw, 3.25rem);
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -.02em;
}

.jm-hero__lead {
    max-width: 52ch;
    margin-bottom: 2rem;
    color: var(--jm-ink-soft);
    font-size: clamp(1.0625rem, 1.6vw, 1.25rem);
}

.jm .jm-hero__img {
    width: 100%;
    border-radius: var(--jm-radius-lg);
    box-shadow: var(--jm-shadow-lg);
}

.jm-toc {
    display: flex;
    gap: .25rem;
    margin-top: clamp(2rem, 4vw, 3.5rem);
    border-bottom: 4px solid transparent;
    border-image: var(--jm-gauge) 1;
    overflow-x: auto;
    scrollbar-width: none;
}

/* Sans sommaire : seul le filet aux couleurs de la jauge subsiste */
.jm-toc--rule {
    overflow: visible;
}

.jm .jm-toc .btn {
    flex: none;
    padding: .75rem 1rem;
    border: 0;
    border-radius: 8px 8px 0 0;
    color: var(--jm-ink);
    font-size: .9375rem;
    font-weight: 500;
}

.jm .jm-toc .btn:hover {
    background: rgba(28, 35, 33, .07);
}

.jm .jm-toc .btn:focus-visible {
    outline-offset: -3px;
}

/* Composants : recherche, filtres, résultats
   ------------------------------------------------------------------ */
.jm-tools:not([hidden]) {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1.5rem;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.jm-search {
    position: relative;
    flex: 1 1 280px;
    max-width: 420px;
}

.jm-search .bi {
    position: absolute;
    top: 50%;
    left: 1rem;
    color: var(--jm-ink-soft);
    transform: translateY(-50%);
}

.jm-search input {
    width: 100%;
    padding: .6rem 1rem .6rem 2.5rem;
    border: 1px solid var(--jm-line-strong);
    border-radius: 999px;
    background: #fff;
    color: var(--jm-ink);
    font-size: 1rem;
}

.jm-search input:focus-visible {
    border-color: var(--jm-green-dark);
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 1px;
}

.jm-filters:not([hidden]) {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.jm .jm-filters .btn {
    display: inline-flex;
    gap: .5rem;
    align-items: center;
    padding: .5rem 1rem;
    border: 1px solid var(--jm-line-strong);
    border-radius: 999px;
    background: #fff;
    color: var(--jm-ink);
    font-size: .9375rem;
    font-weight: 500;
}

.jm .jm-filters .btn:hover {
    border-color: var(--jm-green-dark);
    background: #fff;
    color: var(--jm-green-dark);
}

.jm .jm-filters .btn[aria-pressed="true"] {
    border-color: var(--jm-green-dark);
    background: var(--jm-green-dark);
    color: #fff;
}

.jm-filters span {
    font-size: .875rem;
    opacity: .7;
}

.jm-count {
    margin-bottom: 1.25rem;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
}

.jm-empty {
    padding: clamp(2rem, 6vw, 4rem) 1.5rem;
    border-radius: var(--jm-radius-lg);
    background: var(--jm-tint);
    text-align: center;
}

.jm-empty__title {
    margin-bottom: .25rem;
    font-size: 1.375rem;
    font-weight: 700;
}

.jm-invite {
    padding: clamp(1.75rem, 5vw, 3.5rem);
    border-radius: var(--jm-radius-lg);
    background: var(--jm-tint);
}

.jm-invite .jm-cta__text {
    max-width: 780px;
}

.jm-cta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--jm-gap-lg);
    align-items: center;
}

.jm-cta p {
    margin-bottom: 1.75rem !important;
    color: var(--jm-ink-soft);
}

.jm .jm-cta img {
    width: 100%;
    border-radius: var(--jm-radius-lg);
}

.jm-cta__text {
    margin-bottom: 1.75rem !important;
    color: var(--jm-ink) !important;
    font-size: clamp(1.25rem, 2.2vw, 1.625rem);
    font-weight: 700;
    line-height: 1.35;
}

/* Composants : contenus
   ------------------------------------------------------------------ */
.jm-point {
    padding-block: 1.5rem;
    border-top: 1px solid var(--jm-line);
}

.jm-point:first-child {
    padding-top: 0;
    border-top: 0;
}

.jm-point:last-child {
    padding-bottom: 0;
}

.jm .jm-point h3,
.jm .jm-pillar h3,
.jm .jm-step h3 {
    margin: 0 0 .5rem;
    color: var(--jm-ink);
    font-size: 1.1875rem;
    font-weight: 700;
    line-height: 1.3;
}

.jm-point p,
.jm-pillar p,
.jm-step p {
    color: var(--jm-ink-soft);
}

.jm-question {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    overflow: hidden;
    border-radius: var(--jm-radius-lg);
    background: var(--jm-deep);
}

.jm .jm-question img {
    width: 100%;
    height: 100%;
    min-height: 240px;
    object-fit: cover;
}

.jm .jm-question p {
    align-self: center;
    margin: 0;
    padding: clamp(1.75rem, 5vw, 4rem);
    color: #fff;
    font-size: clamp(1.375rem, 2.6vw, 2rem);
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -.01em;
    text-wrap: pretty;
}

.jm-question--reverse {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
}

.jm-question--reverse img {
    order: 2;
}

.jm-pillars-wrap {
    display: grid;
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: start;
}

.jm-pillars {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--jm-gap);
}

.jm-pillars--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Le filet suit la jauge, du vert au rouge */
.jm-pillar {
    padding: 1.5rem;
    border: 1px solid var(--jm-line);
    border-top: 4px solid var(--jm-green);
    border-radius: var(--jm-radius);
    font-size: 1rem;
}

.jm-pillar:nth-child(2) { border-top-color: var(--jm-gauge-yellow); }
.jm-pillar:nth-child(3) { border-top-color: var(--jm-orange); }
.jm-pillar:nth-child(4) { border-top-color: var(--jm-gauge-red); }

.jm-example {
    display: grid;
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    gap: clamp(2rem, 5vw, 4rem);
    align-items: start;
}

.jm-example__media {
    margin: 0;
}

.jm .jm-example__media img {
    width: 100%;
    border-radius: var(--jm-radius-lg);
}

.jm-context {
    margin-bottom: 2.25rem;
    padding: 1.25rem 1.5rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint);
}

.jm-context p {
    margin-bottom: .5rem;
}

.jm-steps {
    margin: 0 0 2.25rem;
    padding: 0;
    list-style: none;
    counter-reset: etape;
}

.jm-step {
    position: relative;
    padding: 0 0 1.75rem 3.5rem;
    counter-increment: etape;
}

.jm-step::before {
    content: counter(etape);
    position: absolute;
    top: 0;
    left: 0;
    display: grid;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: var(--jm-green-btn);
    color: #fff;
    font-size: .9375rem;
    font-weight: 700;
}

/* Trait reliant les étapes */
.jm-step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 2.5rem;
    bottom: .25rem;
    left: calc(1.125rem - 1px);
    width: 2px;
    background: var(--jm-line);
}

.jm-step:last-child {
    padding-bottom: 0;
}

.jm-swatch {
    color: var(--jm-ink);
    font-weight: 500;
    white-space: nowrap;
}

.jm-swatch::before {
    content: "";
    display: inline-block;
    width: .7em;
    height: .7em;
    margin-right: .3em;
    border-radius: 50%;
}

.jm-swatch--orange::before { background: var(--jm-orange); }
.jm-swatch--red::before { background: var(--jm-gauge-red); }

/* Fond sombre */
.jm-dark {
    background: var(--jm-deep);
    color: #fff;
}

.jm .jm-dark .jm-h2 {
    color: #fff;
}

.jm-dark .jm-lead {
    color: rgba(255, 255, 255, .8);
}

/* Sur fond sombre, le vert du bouton principal se fondrait dans le fond */
.jm .jm-dark .jm-btn--primary {
    background: var(--jm-green-light);
    color: var(--jm-deep);
}

.jm .jm-dark .jm-btn--primary:hover {
    background: #fff;
    color: var(--jm-deep);
}

.jm-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
    margin: 0;
    padding: 0;
    list-style: none;
}

.jm-benefit {
    display: flex;
    gap: 1rem;
    padding: 1.5rem;
    border: 1px solid var(--jm-on-dark-line);
    border-radius: var(--jm-radius);
    background: var(--jm-on-dark-bg);
    font-size: 1rem;
}

.jm-benefit .bi {
    flex: none;
    color: var(--jm-green-light);
    font-size: 1.5rem;
    line-height: 1.3;
}

.jm .jm-benefit h3 {
    margin: 0 0 .375rem;
    color: #fff;
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.3;
}

.jm-benefit p {
    color: var(--jm-on-dark-soft);
}

.jm-quotes {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
}

.jm-quote {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin: 0;
    padding: 1.75rem;
    border: 1px solid var(--jm-on-dark-line);
    border-radius: var(--jm-radius);
    background: var(--jm-on-dark-bg);
}

/* custom.site.css centre les citations et leur ajoute des guillemets et un trait */
.jm .jm-quote blockquote {
    margin: 0;
    padding: 0;
    color: rgba(255, 255, 255, .9);
    font-size: 1rem;
    line-height: 1.65;
    text-align: left;
}

.jm .jm-quote blockquote::before,
.jm .jm-quote blockquote::after {
    content: none;
}

.jm-quote figcaption {
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid var(--jm-on-dark-line);
    color: #fff;
    font-size: .9375rem;
    font-weight: 500;
}

/* Professionnels : choix de l'environnement
   ------------------------------------------------------------------ */
.jm-audiences {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
}

.jm a.jm-audience {
    display: block;
    overflow: hidden;
    padding: 0;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    color: var(--jm-ink);
    font-size: 1.0625rem;
    font-weight: 700;
    text-align: left;
    white-space: normal;
    transition: border-color .2s, box-shadow .2s;
}

.jm a.jm-audience:hover {
    border-color: var(--jm-green);
    background: #fff;
    box-shadow: var(--jm-shadow);
    color: var(--jm-ink);
}

.jm .jm-audience img {
    width: 100%;
    aspect-ratio: 16 / 10;
    object-fit: cover;
}

.jm-audience span {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    padding: 1rem 1.25rem;
}

.jm-audience .bi {
    color: var(--jm-green-btn);
}

/* Témoignages
   ------------------------------------------------------------------ */
.tmg-head {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 2rem;
    align-items: center;
    justify-content: space-between;
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}

.jm .tmg-head .jm-h2 {
    margin: 0;
}

.tmg-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
}

.tmg-item[hidden] {
    display: none;
}

/* La carte s'affiche aussi dans la fenêtre « Lire la suite », hors de .jm */
.tmg-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    height: 100%;
    margin: 0;
    padding: 1.5rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
    color: var(--jm-ink);
    font-size: 1rem;
    line-height: 1.65;
}

.tmg-card__top {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
    justify-content: space-between;
    min-height: 1.75rem;
}

.tmg-stars {
    display: inline-flex;
    gap: .15rem;
    color: var(--jm-yellow);
    font-size: 1rem;
}

.tmg-badge {
    padding: .15rem .65rem;
    border-radius: 999px;
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
    font-size: .8125rem;
    font-weight: 700;
}

/* custom.site.css centre les citations et leur ajoute des guillemets et un trait */
.tmg-card .tmg-card__text {
    position: static;
    margin: 0;
    padding: 0;
    color: var(--jm-ink);
    font-size: 1rem;
    line-height: 1.65;
    text-align: left;
    overflow-wrap: anywhere;
}

.tmg-card .tmg-card__text::before,
.tmg-card .tmg-card__text::after {
    content: none;
}

.tmg-card .tmg-more {
    align-self: flex-start;
    padding: 0;
    border: 0;
    color: var(--jm-green-dark);
    font-size: .9375rem;
    font-weight: 700;
    text-decoration: underline;
    text-transform: none;
    text-underline-offset: 3px;
}

.tmg-card .tmg-more:hover {
    background: transparent;
    color: var(--jm-ink);
}

.tmg-card__author {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid var(--jm-line);
    font-size: .875rem;
    line-height: 1.4;
}

.tmg-card__author img {
    flex: none;
    width: 48px;
    height: 48px;
    border-radius: 50%;
}

.tmg-card__author :is(strong, span, time) {
    display: block;
    overflow-wrap: anywhere;
}

.tmg-card__author strong {
    font-size: 1rem;
}

.tmg-card__author span {
    color: var(--jm-ink-soft);
}

.tmg-card__author time {
    margin-top: .15rem;
    color: var(--jm-ink-muted);
    font-size: .8125rem;
}

.jm .tmg-rules__title {
    max-width: 20ch;
}

.tmg-rules__lead {
    max-width: 70ch;
}

.tmg-rules {
    display: grid;
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    gap: clamp(2rem, 5vw, 4rem);
    align-items: start;
}

.tmg-rules .jm-context,
.tmg-rules .jm-context p {
    margin-bottom: 0;
}

.tmg-rules__sign {
    margin-top: 1.5rem;
}

/* Partenaires
   ------------------------------------------------------------------ */
.ptn-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
}

.ptn-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
}

.ptn-card[hidden] {
    display: none;
}

.ptn-card__logo {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 130px;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--jm-line);
    background: #fff;
}

.jm .ptn-card__logo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.ptn-card__name {
    color: var(--jm-ink-soft);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    overflow-wrap: anywhere;
}

.ptn-card__flag {
    position: absolute;
    top: .5rem;
    right: .75rem;
    font-size: 1.125rem;
    line-height: 1;
}

.ptn-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 1.25rem 1.5rem 1.5rem;
    font-size: .9375rem;
    line-height: 1.5;
}

.jm .ptn-card h3 {
    margin: 0 0 .25rem;
    color: var(--jm-ink);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.jm .ptn-card__type {
    margin: 0 0 1rem;
    color: var(--jm-green-dark);
    font-size: .875rem;
    font-weight: 500;
}

.ptn-card__infos {
    margin: 0 0 1.25rem;
    padding: 0;
    color: var(--jm-ink-soft);
    list-style: none;
}

.ptn-card__infos li {
    display: flex;
    gap: .625rem;
    margin-bottom: .5rem;
}

.ptn-card__infos .bi {
    flex: none;
    color: var(--jm-green-btn);
}

.ptn-card__infos span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.jm .ptn-card__site {
    display: inline-flex;
    gap: .5rem;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    padding: .5rem 1rem;
    border: 1px solid var(--jm-ink);
    border-radius: 999px;
    color: var(--jm-ink);
    font-size: .9375rem;
    font-weight: 700;
}

.jm .ptn-card__site:hover {
    background: var(--jm-ink);
    color: #fff;
}

/* Parcours partenaire : pourquoi, comment, et après
   ------------------------------------------------------------------ */
.jm-hero__notes {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.5rem;
    margin: 1.5rem 0 0;
    padding: 0;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    list-style: none;
}

.jm-hero__notes .bi {
    color: var(--jm-green-btn);
}

/* Visuel de l'en-tête */
.ptn-visual {
    position: relative;
    padding-block: 2.25rem;
}

.jm .ptn-visual > img {
    width: 100%;
}

.ptn-visual__badge {
    position: absolute;
    display: flex;
    gap: .75rem;
    align-items: center;
    padding: .625rem .875rem;
    border-radius: var(--jm-radius);
    background: #fff;
    box-shadow: var(--jm-shadow);
    color: var(--jm-ink-soft);
    font-size: .8125rem;
    line-height: 1.35;
}

.ptn-visual__badge strong {
    color: var(--jm-ink);
}

.ptn-visual__badge .bi {
    color: var(--jm-green-btn);
    font-size: 1.25rem;
}

.ptn-visual__badge--top {
    top: 0;
    right: 0;
}

/* À droite : la zone blanche de l'image, sans masquer le nom écrit sur la jauge */
.ptn-visual__badge--bottom {
    right: 0;
    bottom: 0;
}

.ptn-visual__logo {
    padding: .375rem .625rem;
    border: 2px dashed var(--jm-line-strong);
    border-radius: 8px;
    color: var(--jm-ink-soft);
    font-size: .75rem;
    font-weight: 700;
    white-space: nowrap;
}

/* Repères */
.ptn-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
    margin: 0;
    padding-block: 2rem;
    border-bottom: 1px solid var(--jm-line);
}

.ptn-facts dt {
    color: var(--jm-ink);
    font-size: clamp(1.375rem, 2.4vw, 1.75rem);
    font-weight: 700;
    line-height: 1.2;
}

.ptn-facts dd {
    margin: 0;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
}

/* Raisons */
.jm-pillars--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ptn-reasons {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ptn-reasons .bi {
    display: block;
    margin-bottom: .75rem;
    color: var(--jm-green-btn);
    font-size: 1.75rem;
    line-height: 1;
}

/* Formules */
.ptn-offers {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: var(--jm-gap);
    align-items: stretch;
}

.ptn-offer {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: flex-start;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border: 1px solid var(--jm-line-strong);
    border-radius: var(--jm-radius-lg);
    background: #fff;
}

.ptn-offer--featured {
    border: 2px solid var(--jm-green-btn);
    box-shadow: var(--jm-shadow);
}

.jm .ptn-offer .jm-eyebrow {
    margin: 0;
}

.jm .ptn-offer h3 {
    margin: 0;
    color: var(--jm-ink);
    font-size: clamp(1.25rem, 2vw, 1.5rem);
    font-weight: 700;
    line-height: 1.25;
}

.jm .ptn-offer p {
    margin: 0;
}

.jm .ptn-offer .btn {
    margin-top: auto;
}

.jm .ptn-offer__note {
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    font-style: italic;
}

.ptn-offer__badge {
    position: absolute;
    top: 0;
    right: 1.5rem;
    padding: .25rem .75rem;
    border-radius: 999px;
    background: var(--jm-green-btn);
    color: #fff;
    font-size: .8125rem;
    font-weight: 700;
    transform: translateY(-50%);
}

.ptn-checks {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ptn-checks li {
    display: flex;
    gap: .625rem;
    margin-bottom: .75rem;
}

.ptn-checks li:last-child {
    margin-bottom: 0;
}

.ptn-checks .bi {
    flex: none;
    color: var(--jm-green-btn);
}

.ptn-features {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ptn-features li {
    padding: 1rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint-green);
    font-size: .9375rem;
    line-height: 1.4;
}

.ptn-features .bi {
    display: block;
    margin-bottom: .5rem;
    color: var(--jm-green-dark);
    font-size: 1.375rem;
    line-height: 1;
}

.ptn-features strong,
.ptn-features span {
    display: block;
}

.ptn-features span {
    margin-top: .25rem;
    color: var(--jm-ink-soft);
    font-size: .875rem;
}

/* Aperçu du mail */
.ptn-tinted {
    background: var(--jm-tint);
}

.ptn-mail {
    overflow: hidden;
    margin: 0;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
    box-shadow: var(--jm-shadow-lg);
    font-size: .9375rem;
    line-height: 1.55;
}

.ptn-mail--small {
    margin-bottom: 1.5rem;
    box-shadow: none;
}

.ptn-mail__bar {
    display: flex;
    gap: .375rem;
    align-items: center;
    padding: .625rem 1rem;
    background: var(--jm-line);
    color: var(--jm-ink-soft);
    font-size: .8125rem;
}

.ptn-mail__bar i {
    width: .625rem;
    height: .625rem;
    border-radius: 50%;
    background: var(--jm-gauge-red);
}

.ptn-mail__bar i:nth-child(2) { background: var(--jm-gauge-yellow); }
.ptn-mail__bar i:nth-child(3) { background: var(--jm-green); }

.ptn-mail__bar span {
    margin-left: .5rem;
}

.ptn-mail__body {
    padding: clamp(1.25rem, 3vw, 1.75rem);
}

.ptn-mail__body p {
    margin-bottom: .625rem;
}

.ptn-mail__meta {
    margin: 0 0 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--jm-line);
    font-size: .875rem;
}

.ptn-mail__meta div {
    display: grid;
    grid-template-columns: 3.5rem minmax(0, 1fr);
    gap: .5rem;
    margin-bottom: .25rem;
}

.ptn-mail__meta dt {
    color: var(--jm-ink-soft);
    font-weight: 400;
}

.ptn-mail__meta dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.ptn-mail__brands {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.ptn-mail__cta {
    display: inline-block;
    padding: .375rem .875rem;
    border-radius: 999px;
    background: var(--jm-green-btn);
    color: #fff;
    font-size: .875rem;
    font-weight: 700;
}

.ptn-mail figcaption {
    margin-top: 1rem;
    color: var(--jm-ink-soft);
    font-size: .8125rem;
}

.ptn-mail__subject .bi {
    color: var(--jm-ink-soft);
}

.jm-dark .ptn-eyebrow-light {
    color: var(--jm-green-light);
}

.jm-quote figcaption span {
    display: block;
    margin-top: .125rem;
    color: var(--jm-on-dark-soft);
    font-size: .875rem;
    font-weight: 400;
}

/* Logos */
.ptn-logos {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ptn-logos li {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 96px;
    padding: .75rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
}

.jm .ptn-logos img {
    max-height: 100%;
    object-fit: contain;
}

.ptn-logos li.ptn-logos__you {
    padding: 0;
    border: 2px dashed var(--jm-green-btn);
}

.jm .ptn-logos__you .btn {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--jm-green-dark);
    font-size: .9375rem;
    font-weight: 700;
    white-space: normal;
}

.jm .ptn-logos__you .btn:hover {
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
}

.ptn-logos__all {
    margin-top: 1rem;
    font-size: .9375rem;
}

/* Questions fréquentes */
.jm-faq details {
    border-bottom: 1px solid var(--jm-line);
}

.jm-faq details:first-child {
    border-top: 1px solid var(--jm-line);
}

.jm .jm-faq summary {
    position: relative;
    padding: 1rem 2.25rem 1rem 0;
    color: var(--jm-ink);
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.35;
    cursor: pointer;
    list-style: none;
}

.jm-faq summary::-webkit-details-marker {
    display: none;
}

/* custom.site.css donne une marge à details et retire le symbole des questions ouvertes */
.jm .jm-faq details {
    padding: 0;
}

.jm .jm-faq summary::after,
.jm .jm-faq details[open] summary::after {
    content: "\F282";
    position: absolute;
    top: 1rem;
    right: .25rem;
    float: none;
    color: var(--jm-green-btn);
    font-family: bootstrap-icons;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.35;
    transition: transform .2s;
}

.jm .jm-faq details[open] summary::after {
    transform: rotate(180deg);
}

.jm-faq summary:focus-visible {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 2px;
}

.jm-faq p {
    padding-bottom: 1.25rem;
    color: var(--jm-ink-soft);
}

.jm .jm-faq details p:last-child {
    margin-bottom: 0;
}

/* Résumé des étapes dans l'en-tête */
.ptn-summary {
    overflow: hidden;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
    box-shadow: var(--jm-shadow-lg);
}

.jm .ptn-summary .btn {
    display: flex;
    gap: .75rem;
    align-items: center;
    width: 100%;
    padding: .875rem 1.125rem;
    border: 0;
    border-top: 1px solid var(--jm-line);
    border-radius: 0;
    color: var(--jm-ink);
    font-size: .9375rem;
    font-weight: 500;
    line-height: 1.35;
    text-align: left;
    white-space: normal;
}

.jm .ptn-summary .btn:first-child {
    border-top: 0;
}

.jm .ptn-summary .btn:hover {
    background: var(--jm-tint);
    color: var(--jm-ink);
}

.ptn-summary__text {
    flex: 1;
    min-width: 0;
}

/* Qui agit à chaque étape */
.ptn-actor {
    display: inline-flex;
    flex: none;
    gap: .3rem;
    align-items: center;
    padding: .15rem .625rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap;
}

.ptn-actor--vous { background: var(--jm-green-btn); color: #fff; }
.ptn-actor--team { background: var(--jm-deep); color: #fff; }
.ptn-actor--justau,
.ptn-actor--equipes { background: var(--jm-tint-green); color: var(--jm-green-dark); }

/* Étapes */
.ptn-route {
    margin: 0 0 clamp(3rem, 6vw, 4.5rem);
    padding: 0;
    list-style: none;
}

.ptn-route__step {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    gap: var(--jm-gap-lg);
    align-items: center;
    padding-block: clamp(2.5rem, 5vw, 4rem);
    border-bottom: 1px solid var(--jm-line);
    /* Le titre s'arrête sous la barre fixe : custom.site.css ajoute scroll-padding-top: 100px */
    scroll-margin-top: 0;
}

.jm .ptn-route__step > img {
    justify-self: center;
    width: 100%;
    max-width: 360px;
    max-height: 300px;
    object-fit: contain;
}

/* Une étape sur deux, l'illustration passe à droite */
.ptn-route__step:nth-child(even) {
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
}

.ptn-route__step:nth-child(even) > img {
    order: 2;
}

.ptn-route__head {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem .75rem;
    align-items: center;
    margin-bottom: 1rem;
}

.ptn-route__number {
    display: inline-grid;
    flex: none;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: var(--jm-green-btn);
    color: #fff;
    font-size: .9375rem;
    font-weight: 700;
}

.ptn-route__count {
    color: var(--jm-ink-soft);
    font-size: .875rem;
    font-weight: 500;
}

.jm .ptn-route__title {
    margin: 0 0 .75rem;
    color: var(--jm-ink);
    font-size: clamp(1.375rem, 2.4vw, 1.875rem);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.01em;
    text-wrap: balance;
}

.ptn-route__step .jm-context,
.ptn-route__step .ptn-checks,
.ptn-route__step .ptn-features {
    margin-block: 1.25rem 0;
}

.ptn-route__step .jm-context p {
    margin-bottom: 0;
    color: var(--jm-ink);
}

.ptn-route__actions {
    margin-top: 1.5rem;
}

/* Fin de page */
.ptn-final > * {
    max-width: 720px;
}

.ptn-final__signature {
    font-style: italic;
}

.jm .ptn-final .jm-actions {
    margin-top: 1.5rem;
    max-width: none;
}

.ptn-parcours {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
    margin-top: var(--jm-gap);
}

.jm .ptn-parcours .btn {
    display: flex;
    gap: .75rem;
    align-items: center;
    padding: .875rem 1rem;
    border: 1px solid var(--jm-line-strong);
    border-radius: var(--jm-radius);
    background: #fff;
    color: var(--jm-ink);
    font-size: .9375rem;
    font-weight: 500;
    line-height: 1.3;
    text-align: left;
    white-space: normal;
}

.jm .ptn-parcours .btn:hover {
    border-color: var(--jm-green-dark);
    background: #fff;
    color: var(--jm-green-dark);
}

.jm .ptn-parcours .btn[aria-current="page"] {
    border-color: var(--jm-green-dark);
    background: var(--jm-tint-green);
    color: var(--jm-ink);
    font-weight: 700;
}

@media (max-width: 1199.98px) {
    .jm-pillars--4,
    .ptn-logos {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .jm-pillars--4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ptn-offers {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 991.98px) {
    .ptn-route__step,
    .ptn-route__step:nth-child(even) {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.5rem;
    }

    .ptn-route__step:nth-child(even) > img {
        order: 0;
    }

    .jm .ptn-route__step > img {
        max-width: 280px;
        max-height: 200px;
    }
}

@media (max-width: 767.98px) {
    .ptn-facts,
    .ptn-logos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .jm-pillars--4,
    .ptn-features,
    .ptn-parcours {
        grid-template-columns: minmax(0, 1fr);
    }

    .ptn-visual {
        padding-block: 0;
    }

    /* Les badges couvriraient la jauge */
    .ptn-visual__badge {
        display: none;
    }

    .jm .ptn-offer .btn {
        width: 100%;
    }

    .ptn-offer__badge {
        right: 1rem;
    }
}

/* Événements
   ------------------------------------------------------------------ */
.evt-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--jm-gap);
}

.jm a.evt-card {
    display: flex;
    gap: 1.25rem;
    align-items: stretch;
    padding: 1.25rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
    color: var(--jm-ink);
    font-size: .9375rem;
    line-height: 1.45;
    text-align: left;
    white-space: normal;
    transition: border-color .2s, box-shadow .2s;
}

.jm a.evt-card:hover {
    border-color: var(--jm-green);
    background: #fff;
    box-shadow: var(--jm-shadow);
    color: var(--jm-ink);
}

.evt-card__date {
    display: flex;
    flex: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    width: 5rem;
    padding-block: .75rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint);
    line-height: 1.15;
}

.evt-card__day {
    font-size: 1.75rem;
    font-weight: 700;
}

.evt-card__month {
    font-weight: 500;
}

.evt-card__year {
    margin-top: .125rem;
    color: var(--jm-ink-soft);
    font-size: .8125rem;
}

.evt-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: .5rem;
    align-items: flex-start;
    min-width: 0;
}

.evt-type {
    padding: .1rem .625rem;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.5;
}

/* 1 : salon, 2 : conférence */
.evt-type--1 { background: var(--jm-tint-green); color: var(--jm-green-dark); }
.evt-type--2 { background: var(--jm-tint-orange); color: var(--jm-orange-ink); }

.evt-card__title {
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.evt-card__infos {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem 1rem;
    color: var(--jm-ink-soft);
}

.evt-card__infos .bi {
    color: var(--jm-green-btn);
}

.evt-card__more {
    margin-top: auto;
    padding-top: .25rem;
    color: var(--jm-green-dark);
    font-weight: 700;
}

.evt-card__logo {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 6.5rem;
    padding-left: 1.25rem;
    border-left: 1px solid var(--jm-line);
}

.jm .evt-card__logo img {
    max-height: 6rem;
    object-fit: contain;
}

@media (max-width: 991.98px) {
    .evt-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 575.98px) {
    .jm a.evt-card {
        gap: .875rem;
        padding: 1rem;
    }

    .evt-card__date {
        width: 4rem;
        padding-block: .5rem;
    }

    .evt-card__day {
        font-size: 1.375rem;
    }

    /* Trop étroit pour trois colonnes */
    .evt-card__logo {
        display: none;
    }
}

/* Contact
   ------------------------------------------------------------------ */
.ctc-gauge {
    width: min(100%, 380px);
    justify-self: center;
    padding: 1.5rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
    box-shadow: var(--jm-shadow);
    color: var(--jm-ink-soft);
    font-size: .875rem;
}

.ctc-gauge__labels {
    display: flex;
    justify-content: space-between;
    margin-bottom: .625rem;
}

.ctc-gauge__track {
    position: relative;
    height: 12px;
    border-radius: 999px;
    /* De perplexe à ravi : le sens inverse de la jauge du produit */
    background: linear-gradient(270deg, #1f7a30, #8fc31f 30%, #f2c200 52%, #ef8a2b 74%, var(--jm-gauge-red));
}

.ctc-gauge__track span {
    position: absolute;
    top: 50%;
    left: 85%;
    width: 26px;
    height: 26px;
    border: 4px solid var(--jm-ink);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
    transform: translate(-50%, -50%);
}

.jm .ctc-gauge p {
    margin: 1rem 0 0;
    text-align: center;
}

.ctc-tiles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.jm a.ctc-tile {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 1.25rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    line-height: 1.4;
    text-align: left;
    white-space: normal;
    transition: border-color .2s, box-shadow .2s;
}

.jm a.ctc-tile:hover {
    border-color: var(--jm-green);
    background: #fff;
    box-shadow: var(--jm-shadow);
    color: var(--jm-ink-soft);
}

.ctc-tile .bi {
    display: inline-grid;
    flex: none;
    place-items: center;
    width: 3rem;
    height: 3rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
    font-size: 1.25rem;
}

.ctc-tile span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.ctc-tile strong {
    display: block;
    color: var(--jm-ink);
    font-size: 1rem;
}

.jm-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    gap: var(--jm-gap);
    align-items: start;
    scroll-margin-top: 35px;
}

.jm-card {
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
}

.jm-form-intro {
    margin-bottom: 1.5rem;
    color: var(--jm-ink-soft);
}

.jm-required {
    color: var(--jm-red);
}

/* Le site place les libellés de formulaire en position relative et décalée */
.jm-form label {
    position: static;
    display: block;
    margin: 0 0 .375rem;
    color: var(--jm-ink);
    font-size: .9375rem;
    font-weight: 500;
}

.jm-choices {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 0 0 1.5rem;
    padding: 0;
    border: 0;
}

.jm-choices legend {
    float: none;
    width: 100%;
    margin-bottom: .5rem;
    color: var(--jm-ink);
    font-size: .9375rem;
    font-weight: 500;
}

/* Reste focalisable au clavier, seul le libellé est visible */
.jm-choices input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.jm-form .jm-choices label {
    display: inline-flex;
    gap: .375rem;
    align-items: center;
    margin: 0;
    padding: .5rem 1rem;
    border: 1px solid var(--jm-line-strong);
    border-radius: 999px;
    cursor: pointer;
}

.jm-form .jm-choices label:hover {
    border-color: var(--jm-green-dark);
    color: var(--jm-green-dark);
}

.jm-form .jm-choices input:checked + label {
    border-color: var(--jm-green-dark);
    background: var(--jm-green-dark);
    color: #fff;
}

.jm-choices input:focus-visible + label {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 2px;
}

.jm-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem var(--jm-gap);
}

.jm-fields__full {
    grid-column: 1 / -1;
}

.jm-form .form-control,
.jm-form .form-select {
    width: 100%;
    padding: .625rem .875rem;
    border: 1px solid var(--jm-line-strong);
    border-radius: var(--jm-radius);
    font-size: 1rem;
}

/* Laisse la place à la flèche du menu.
   Couleurs explicites : custom.site.css et site.css n'ont pas de numéro de version,
   un navigateur peut garder une ancienne copie où le texte du menu est blanc sur blanc. */
.jm-form .form-select {
    padding-right: 2.25rem;
}

.jm-form .form-select,
.jm-form .form-select option {
    background-color: #fff;
    color: var(--jm-ink);
}

.jm-form .form-control:focus,
.jm-form .form-select:focus {
    border-color: var(--jm-green-dark);
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 1px;
    box-shadow: none;
}

.jm-consent {
    display: flex;
    gap: .625rem;
    align-items: flex-start;
    margin-block: 1.25rem;
}

.jm-consent input {
    flex: none;
    width: 1.125rem;
    height: 1.125rem;
    margin-top: .2rem;
    accent-color: var(--jm-green-dark);
}

.jm-form .jm-consent label {
    margin: 0;
    color: var(--jm-ink-soft);
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.45;
}

/* Champ piège pour les robots, hors de l'écran : display none les alerterait */
.ctc-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.ctc-optional {
    color: var(--jm-ink-muted);
    font-weight: 400;
}

.jm .ctc-error {
    margin: .375rem 0 0;
    color: var(--jm-red);
    font-size: .9375rem;
    font-weight: 500;
    line-height: 1.35;
}

.jm-form .form-control.is-invalid,
.jm-form .form-select.is-invalid {
    border-color: var(--jm-red);
    background-image: none;
}

/* custom.site.css remplace la flèche par deux images, flèche et point d'exclamation */
.jm-form .form-select.is-invalid:not([multiple]):not([size]) {
    padding-right: 2.25rem;
    background-image: var(--bs-form-select-bg-img);
    background-position: right .75rem center;
    background-size: 16px 12px;
}

.jm-form .form-control.is-invalid:focus,
.jm-form .form-select.is-invalid:focus {
    border-color: var(--jm-red);
    box-shadow: 0 0 0 3px rgba(188, 5, 45, .15);
}

.jm .ctc-counter {
    margin: .25rem 0 0;
    color: var(--jm-ink-muted);
    font-size: .875rem;
    text-align: right;
}

.ctc-alert {
    margin-bottom: 1.5rem;
    padding: 1rem 1.25rem;
    border-left: 4px solid var(--jm-red);
    border-radius: var(--jm-radius);
    background: #fdecef;
    color: var(--jm-ink);
    font-size: 1rem;
}

.ctc-alert:focus,
.ctc-done:focus {
    outline: none;
}

.jm .ctc-alert__title {
    margin-bottom: .25rem;
    color: var(--jm-red);
    font-weight: 700;
}

.ctc-alert p:last-child,
.ctc-alert ul:last-child {
    margin-bottom: 0;
}

.ctc-alert ul {
    padding-left: 1.25rem;
}

.ctc-done > .bi {
    display: block;
    margin-bottom: .75rem;
    color: var(--jm-green);
    font-size: 3rem;
    line-height: 1;
}

.ctc-done__subject {
    padding: .75rem 1rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint);
    overflow-wrap: anywhere;
}

.jm [data-ctc-submit]:disabled {
    opacity: .7;
}

.jm .jm-status {
    margin: 1.25rem 0 0;
    padding: 1rem 1.25rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint-green);
    color: var(--jm-ink);
    font-size: .9375rem;
}

.jm-status[hidden] {
    display: none;
}

.jm-form-aside {
    display: grid;
    gap: var(--jm-gap);
}

.jm-card--small {
    padding: 1.5rem;
    font-size: .9375rem;
}

.jm-card--small > .bi {
    display: block;
    margin-bottom: .5rem;
    color: var(--jm-green-btn);
    font-size: 1.5rem;
    line-height: 1;
}

.jm .jm-card--small h2 {
    margin: 0 0 .5rem;
    color: var(--jm-ink);
    font-size: 1.0625rem;
    font-weight: 700;
}

.jm-card--small p {
    color: var(--jm-ink-soft);
}

.jm-social {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.jm .jm-social .btn {
    display: inline-flex;
    flex: 1 1 auto;
    gap: .375rem;
    align-items: center;
    justify-content: center;
    padding: .5rem .875rem;
    border: 1px solid var(--jm-line-strong);
    border-radius: 999px;
    color: var(--jm-ink);
    font-size: .875rem;
    font-weight: 500;
}

.jm .jm-social .btn:hover {
    border-color: var(--jm-green-dark);
    background: #fff;
    color: var(--jm-green-dark);
}

@media (max-width: 991.98px) {
    .ctc-tiles,
    .jm-form-layout {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 575.98px) {
    .jm-fields {
        grid-template-columns: minmax(0, 1fr);
    }

    .jm .jm-form > .jm-btn {
        width: 100%;
    }
}

/* FAQ
   ------------------------------------------------------------------ */
.faq-count {
    margin: 0;
}

.faq-group {
    display: grid;
    grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
    gap: 1rem clamp(2rem, 5vw, 4rem);
    align-items: start;
    margin-top: clamp(2rem, 4vw, 3rem);
    scroll-margin-top: 35px;
}

.faq-group[hidden] {
    display: none;
}

.jm .faq-group__title {
    margin: 0;
    color: var(--jm-ink);
    font-size: clamp(1.375rem, 2.2vw, 1.75rem);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -.01em;
}

.jm-faq details {
    scroll-margin-top: 35px;
}

.jm-faq details[hidden] {
    display: none;
}

.jm .faq-answer {
    margin: 0;
    padding: 0 2.25rem 1.25rem 0;
    background: none;
    font-size: 1rem;
}

.jm .faq-answer p {
    margin: 0 0 .875rem;
    padding: 0;
    color: var(--jm-ink-soft);
}

.jm .faq-answer p:last-child {
    margin-bottom: 0;
}

.faq-answer strong {
    color: var(--jm-ink);
}

/* La recherche masque parfois le premier élément : le trait du haut reste sur le premier visible */
.jm-faq details:not([hidden]) ~ details:not([hidden]) {
    border-top: 0;
}

.faq-invite {
    margin-top: clamp(3rem, 6vw, 4.5rem);
}

@media (min-width: 992px) and (min-height: 700px) {
    .jm .faq-group__title {
        position: sticky;
        top: 135px;
    }
}

@media (max-width: 991.98px) {
    .faq-group {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Demande de partenariat
   ------------------------------------------------------------------ */
.jm-hero .dem-next {
    justify-self: center;
    max-width: 440px;
}

.jm .dem-next__link {
    margin-top: .75rem;
    font-weight: 700;
}

/* Blocs de liens internes (Views/maillage/_bloc.php)
   ------------------------------------------------------------------ */
.jm-maillage {
    background: var(--jm-tint);
}

.jm-maillage__list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    gap: var(--jm-gap);
    margin: 0;
    padding: 0;
    list-style: none;
}

.jm .jm-maillage__link {
    display: block;
    height: 100%;
    padding: 1.25rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
    color: var(--jm-ink);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.45;
    text-align: left;
    white-space: normal;
}

.jm .jm-maillage__link:is(:hover, :focus) {
    border-color: var(--jm-green-dark);
    background: #fff;
    color: var(--jm-ink);
    box-shadow: var(--jm-shadow);
}

.jm-maillage__link i {
    display: block;
    margin-bottom: .5rem;
    color: var(--jm-green-dark);
    font-size: 1.5rem;
}

.jm-maillage__link strong {
    display: block;
    margin-bottom: .25rem;
    color: var(--jm-green-dark);
    font-size: 1.0625rem;
}

.jm-maillage__link span {
    display: block;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
}

.dem-formules {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    gap: .75rem;
}

.jm-form .dem-formules label {
    display: block;
    padding: .875rem 1rem;
    border-radius: var(--jm-radius);
    font-weight: 400;
}

.dem-formules strong {
    display: block;
    margin-bottom: .25rem;
    font-size: 1rem;
    font-weight: 700;
}

.dem-formules span {
    display: block;
    font-size: .875rem;
    line-height: 1.45;
}

.dem-group {
    margin: 0 0 1.5rem;
    padding: 1.5rem 0 0;
    border: 0;
    border-top: 1px solid var(--jm-line);
}

.dem-group legend {
    float: none;
    width: auto;
    margin: 0;
    padding: 0 .75rem 0 0;
    color: var(--jm-ink);
    font-size: 1.1875rem;
    font-weight: 700;
}

.dem-civility {
    max-width: 220px;
}

.dem-result {
    max-width: 780px;
    margin-inline: auto;
}

/* Émotions ou sentiments
   ------------------------------------------------------------------ */
.ems-c-emotion {
    color: var(--jm-orange-dark);
}

.ems-tinted {
    background: var(--jm-tint);
}

.ems-duo {
    display: grid;
    gap: var(--jm-gap);
}

.ems-duo__card {
    display: flex;
    gap: 1.25rem;
    align-items: center;
    padding: clamp(1.25rem, 3vw, 2rem);
    border-radius: var(--jm-radius-lg);
    box-shadow: var(--jm-shadow);
}

.ems-duo__card--emotion {
    background: var(--jm-tint-orange);
}

.ems-duo__card--sentiment {
    background: var(--jm-tint-green);
}

.ems-duo__card i {
    font-size: 2.5rem;
    line-height: 1;
}

.ems-duo__card--emotion i,
.ems-duo__card--emotion strong {
    color: var(--jm-orange-ink);
}

.ems-duo__card--sentiment i,
.ems-duo__card--sentiment strong {
    color: var(--jm-green-dark);
}

.ems-duo__card strong {
    display: block;
    font-size: clamp(1.25rem, 2vw, 1.5rem);
    line-height: 1.25;
}

.ems-duo__card span {
    color: var(--jm-ink);
}

.ems-table-wrap {
    overflow: hidden;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    box-shadow: var(--jm-shadow);
}

.ems-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
}

.ems-table :is(th, td) {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--jm-line);
    text-align: left;
    vertical-align: top;
}

.ems-table tbody tr:last-child :is(th, td) {
    border-bottom: 0;
}

.ems-table tbody th {
    width: 18%;
    color: var(--jm-ink);
    font-weight: 700;
}

.ems-table thead th {
    font-size: 1.125rem;
    font-weight: 700;
}

.ems-table thead td {
    background: #fff;
}

.ems-table__emotion {
    background: var(--jm-tint-orange);
    color: var(--jm-orange-ink);
}

.ems-table__sentiment {
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
}

.ems-pair,
.ems-trio {
    display: grid;
    gap: var(--jm-gap);
}

.ems-pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ems-trio {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ems-card {
    font-size: 1rem;
}

.ems-card--emotion {
    border-top: 4px solid var(--jm-orange);
}

.ems-card--sentiment {
    border-top: 4px solid var(--jm-green);
}

.jm .ems-card h3 {
    margin: 0 0 1rem;
    color: var(--jm-ink);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.3;
}

.ems-card h3 i {
    margin-right: .25rem;
    color: var(--jm-green-dark);
}

.ems-card--emotion h3 i {
    color: var(--jm-orange-ink);
}

.ems-card p:last-child {
    margin-bottom: 0;
}

.ems-list {
    display: grid;
    gap: 1rem;
    margin: 0 0 1rem;
    padding: 0;
    list-style: none;
}

.ems-card > .ems-list:last-child {
    margin-bottom: 0;
}

.ems-list li {
    padding-left: 1rem;
    border-left: 2px solid var(--jm-line-strong);
    color: var(--jm-ink-soft);
}

.ems-list strong {
    display: block;
    color: var(--jm-ink);
}

.ems-card__more {
    margin-top: 1rem;
    font-weight: 700;
}

.ems-takeaway {
    display: flex;
    gap: 1rem;
    max-width: 900px;
    margin-top: var(--jm-gap-lg);
    padding: clamp(1.25rem, 3vw, 1.75rem);
    border-radius: var(--jm-radius);
    background: var(--jm-tint-green);
    color: var(--jm-ink);
}

.ems-takeaway > i {
    color: var(--jm-green-dark);
    font-size: 1.75rem;
    line-height: 1.2;
}

.ems-takeaway p {
    margin: 0;
}

.jm .ems-takeaway .ems-takeaway__title {
    margin-bottom: .25rem;
    color: var(--jm-green-dark);
    font-weight: 700;
}

.ems-end .container {
    max-width: 900px;
    text-align: center;
}

.ems-end__text {
    margin-bottom: 2rem;
    font-size: clamp(1.125rem, 2vw, 1.375rem);
    line-height: 1.55;
}

@media (max-width: 991.98px) {
    .ems-pair,
    .ems-trio {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Sur téléphone, chaque ligne du comparatif s'empile : le critère, puis les deux réponses étiquetées */
@media (max-width: 575.98px) {
    .ems-table thead {
        display: none;
    }

    .ems-table tbody tr {
        display: block;
        padding: 1rem 1.25rem;
        border-bottom: 1px solid var(--jm-line);
    }

    .ems-table tbody tr:last-child {
        border-bottom: 0;
    }

    .ems-table :is(th, td) {
        display: block;
        width: auto;
        padding: 0;
        border: 0;
    }

    .ems-table tbody th {
        width: auto;
        margin-bottom: .5rem;
    }

    .ems-table td + td {
        margin-top: .5rem;
    }

    .ems-table td::before {
        content: attr(data-label) " : ";
        font-weight: 700;
    }

    .ems-table td:nth-of-type(1)::before {
        color: var(--jm-orange-ink);
    }

    .ems-table td:nth-of-type(2)::before {
        color: var(--jm-green-dark);
    }
}

/* Les émotions
   ------------------------------------------------------------------ */
.emo-tiles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.jm .emo-tile {
    padding: 1rem .5rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
    color: var(--jm-ink);
    font-weight: 700;
}

.jm .emo-tile:is(:hover, :focus) {
    border-color: var(--jm-green-dark);
    background: #fff;
    color: var(--jm-ink);
    box-shadow: var(--jm-shadow);
}

.jm .emo-face {
    width: 96px;
    max-width: 100%;
    margin-inline: auto;
    border-radius: 50%;
}

.emo-tile span {
    display: block;
    margin-top: .5rem;
    text-transform: capitalize;
}

.emo-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
}

.emo-card {
    display: flex;
    flex-direction: column;
    border-top: 4px solid var(--emo-couleur);
    font-size: 1rem;
    /* Lien #joie : la carte s'arrête sous la barre fixe, qui compte déjà 100 px de scroll-padding */
    scroll-margin-top: 35px;
}

.emo-card:target {
    box-shadow: 0 0 0 3px var(--emo-couleur), var(--jm-shadow);
}

.jm .emo-card .emo-face {
    width: 72px;
    margin: 0 0 1rem;
}

.jm .emo-card h3 {
    margin: 0 0 .5rem;
    color: var(--jm-ink);
    font-size: 1.375rem;
    font-weight: 700;
}

.emo-card > p {
    color: var(--jm-ink-soft);
}

.jm .emo-card .emo-card__more {
    margin: auto 0 0;
    padding-top: .5rem;
    font-weight: 700;
}

/* Deux blocs de liens à la suite : le second sur fond blanc pour les distinguer */
.jm:has(.jm-maillage) + .jm .jm-maillage {
    background: #fff;
}

@media (max-width: 991.98px) {
    .emo-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .jm .emo-face {
        width: 64px;
    }

    .emo-tile span {
        font-size: .875rem;
    }

    .emo-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Une émotion en détail
   ------------------------------------------------------------------ */
.emn-brief {
    border-top: 4px solid var(--emo-couleur);
    box-shadow: var(--jm-shadow);
}

.jm .emn-brief .emo-face {
    width: 112px;
    margin: 0 0 1.25rem;
}

.emn-brief .jm-eyebrow {
    margin-bottom: .375rem;
}

.emn-brief__text {
    margin: 0;
    font-size: 1.0625rem;
}

.emn-intro {
    max-width: 780px;
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.emn-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
}

.emn-card {
    border-top: 4px solid var(--emo-couleur);
    font-size: 1rem;
}

.jm .emn-card h2 {
    margin: 0 0 .75rem;
    color: var(--jm-ink);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.3;
}

.emn-card p {
    color: var(--jm-ink-soft);
}

.emn-experience {
    background: var(--jm-tint);
}

.jm .emn-experience .jm-h2 {
    margin-bottom: 0;
}

.emn-experience__text {
    margin: 0;
    border-left-color: var(--emo-couleur);
    font-weight: 400;
}

.emn-tiles {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.emn-tiles .emo-tile span {
    text-transform: none;
}

@media (max-width: 991.98px) {
    .emn-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .emn-tiles {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Guide des émotions
   ------------------------------------------------------------------ */
.jm-card.gui-plan {
    padding: clamp(1.25rem, 3vw, 2rem);
    box-shadow: var(--jm-shadow);
}

.jm .gui-plan__title {
    margin-bottom: .75rem;
    color: var(--jm-ink);
    font-size: 1.25rem;
    font-weight: 700;
}

.gui-plan ol {
    display: grid;
    gap: .5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.jm .gui-plan a {
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    align-items: center;
    padding: .875rem 1rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint);
    color: var(--jm-ink);
    text-align: left;
    white-space: normal;
}

.jm .gui-plan a:is(:hover, :focus) {
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
}

.gui-plan strong {
    font-weight: 700;
}

.gui-plan span {
    flex: none;
    color: var(--jm-ink-soft);
    font-size: .875rem;
    font-weight: 400;
}

.gui-layout {
    display: grid;
    grid-template-columns: minmax(0, 3.5fr) minmax(0, 8.5fr);
    gap: clamp(2rem, 5vw, 4rem);
    align-items: start;
}

/* Marge haute : sous la barre fixe, qui fait 103 px une fois réduite */
.gui-side {
    position: sticky;
    top: 119px;
    z-index: 5;
}

/* custom.site.css habille tous les details : ce sommaire n'en veut pas */
.jm .gui-toc {
    margin: 0;
    padding: 0;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
}

.jm .gui-toc summary {
    display: none;
    gap: .5rem;
    align-items: center;
    padding: .75rem 1rem;
    color: var(--jm-ink);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    cursor: pointer;
    list-style: none;
}

.jm .gui-toc summary::after,
.jm .gui-toc[open] summary::after {
    content: none;
}

.gui-toc summary::-webkit-details-marker {
    display: none;
}

.gui-toc nav {
    position: relative;
    max-height: calc(100vh - 150px);
    padding: 1rem;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.jm .gui-toc__part {
    margin: 1rem 0 .375rem;
    color: var(--jm-ink-muted);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.jm .gui-toc__part:first-child {
    margin-top: 0;
}

.gui-toc ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

.jm .gui-toc a {
    display: block;
    padding: .375rem .625rem;
    border: 0;
    border-left: 3px solid transparent;
    border-radius: 0;
    background: none;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    font-weight: 400;
    line-height: 1.3;
    text-align: left;
    white-space: normal;
}

.jm .gui-toc a:is(:hover, :focus) {
    background: var(--jm-tint);
    color: var(--jm-ink);
}

.jm .gui-toc a[aria-current] {
    border-left-color: var(--jm-green);
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
    font-weight: 700;
}

.gui-intro {
    margin-bottom: clamp(2rem, 4vw, 3rem);
    padding: clamp(1.25rem, 3vw, 2rem);
    border-radius: var(--jm-radius-lg);
    background: var(--jm-tint);
    font-size: 1rem;
}

.jm .gui-intro__welcome {
    color: var(--jm-ink);
    font-size: 1.25rem;
    font-weight: 700;
}

.jm .gui-part {
    margin: clamp(2.5rem, 5vw, 4rem) 0 0;
    padding-bottom: .75rem;
    border-bottom: 2px solid var(--jm-green);
}

.gui-chapter {
    padding-top: clamp(1.5rem, 3vw, 2.5rem);
    color: var(--jm-ink-soft);
    /* Lien depuis le sommaire : 100 px de scroll-padding viennent déjà de custom.site.css */
    scroll-margin-top: 20px;
}

.gui-chapter + .gui-chapter {
    margin-top: clamp(1.5rem, 3vw, 2.5rem);
    border-top: 1px solid var(--jm-line);
}

.jm .gui-chapter .jm-h2 {
    display: flex;
    gap: .75rem;
    align-items: baseline;
    font-size: clamp(1.5rem, 2.6vw, 2rem);
}

.gui-num {
    flex: none;
    color: var(--jm-green-btn);
    font-size: .8em;
}

.jm .gui-chapter h3 {
    margin: 1.75rem 0 .5rem;
    color: var(--jm-ink);
    font-size: 1.1875rem;
    font-weight: 700;
    line-height: 1.3;
}

.gui-chapter > .ems-card__more {
    margin-top: -.25rem;
}

.gui-chapter .ems-takeaway {
    margin-top: 2rem;
}

.gui-emotions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 1.5rem;
}

.jm .gui-emotions h3 {
    margin-top: 0;
}

.jm .gui-tagline {
    margin-bottom: .5rem;
    color: var(--jm-ink);
    font-weight: 500;
}

@media (max-width: 991.98px) {
    .gui-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.5rem;
    }

    .gui-side {
        top: 103px;
    }

    .jm .gui-toc {
        box-shadow: var(--jm-shadow);
    }

    .jm .gui-toc summary {
        display: flex;
    }

    .gui-toc summary span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .gui-toc nav {
        max-height: 60vh;
        border-top: 1px solid var(--jm-line);
    }

    /* La barre du sommaire s'ajoute à la barre fixe */
    .gui-chapter {
        scroll-margin-top: 60px;
    }
}

@media (max-width: 575.98px) {
    .gui-emotions {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Lexique émotionnel
   ------------------------------------------------------------------ */
.lex-args {
    display: grid;
    gap: .75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.lex-args li {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.25rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
    box-shadow: var(--jm-shadow);
}

.lex-args i {
    color: var(--jm-green-dark);
    font-size: 1.75rem;
    line-height: 1.1;
}

.lex-args strong {
    display: block;
    color: var(--jm-ink);
}

.lex-args span {
    color: var(--jm-ink-soft);
    font-size: 1rem;
}

/* Reste visible pendant le défilement, sous la barre fixe (103 px une fois réduite) */
.lex-toolbar {
    position: sticky;
    top: 103px;
    z-index: 5;
    margin-bottom: 1.25rem;
    padding-block: .75rem;
    border-bottom: 1px solid var(--jm-line);
    background: #fff;
}

.lex-toolbar__row {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1.25rem;
    align-items: center;
    margin-bottom: .75rem;
}

.jm .lex-count {
    margin: 0;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
}

.jm .lex-pdf {
    margin-left: auto;
    padding: .5rem 1rem;
    font-size: .9375rem;
}

.lex-letters:not([hidden]) {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
}

.jm .lex-letters a {
    min-width: 2.25rem;
    padding: .25rem .5rem;
    border: 1px solid var(--jm-line);
    border-radius: 8px;
    background: #fff;
    color: var(--jm-ink);
    font-size: .9375rem;
    font-weight: 700;
}

.jm .lex-letters a:is(:hover, :focus) {
    border-color: var(--jm-green-dark);
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
}

.lex-table-wrap {
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
}

.lex-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 1rem;
}

.lex-table :is(th, td) {
    padding: .75rem 1.25rem;
    border-bottom: 1px solid var(--jm-line);
    text-align: left;
    vertical-align: top;
}

.lex-table tbody:last-child tr:last-child > * {
    border-bottom: 0;
}

.lex-table thead th {
    color: var(--jm-ink-soft);
    font-size: .875rem;
    font-weight: 700;
}

.lex-table tbody th {
    width: 22%;
    color: var(--jm-ink);
    font-weight: 700;
}

.lex-table .lex-letter th {
    width: auto;
    padding-block: .375rem;
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
    font-size: 1.125rem;
}

/* Lien vers une lettre ou un mot : la ligne s'arrête sous la barre d'outils.
   --lex-barre est sa hauteur, tenue à jour par lexique.js ; 100 px de scroll-padding viennent de custom.site.css */
.lex-table tr[id] {
    scroll-margin-top: calc(var(--lex-barre, 117px) + 11px);
}

.lex-table tr[data-lex-row]:hover > * {
    background: var(--jm-tint);
}

.lex-table tr:target > * {
    background: var(--jm-tint-green);
}

.lex-table td {
    color: var(--jm-ink-soft);
}

.lex-verbes__label {
    display: none;
}

/* Le PDF reste proposé dans l'en-tête : la barre fixe garde sa place pour la lecture */
@media (max-width: 991.98px) {
    .jm .lex-pdf {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .lex-toolbar {
        padding-block: .5rem;
    }

    .jm .lex-count {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }

    .lex-toolbar__row {
        margin-bottom: .5rem;
    }

    .jm-search {
        flex-basis: 100%;
        max-width: none;
    }

    /* Une seule ligne de lettres, qui défile au doigt, pour ne pas occuper l'écran */
    .lex-letters:not([hidden]) {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .jm .lex-letters a {
        flex: none;
    }

    .lex-table-wrap {
        border: 0;
    }

    .lex-table thead {
        display: none;
    }

    .lex-table tbody,
    .lex-table tr,
    .lex-table :is(th, td) {
        display: block;
        width: auto;
    }

    .lex-table tbody[hidden],
    .lex-table tr[hidden] {
        display: none;
    }

    .lex-table tr[data-lex-row] {
        padding: .875rem 0;
        border-bottom: 1px solid var(--jm-line);
    }

    .lex-table :is(th, td),
    .lex-table tbody:last-child tr:last-child > * {
        padding: 0;
        border: 0;
    }

    .lex-table tbody th {
        width: auto;
        margin-bottom: .25rem;
    }

    .lex-table .lex-letter th {
        padding: .25rem .75rem;
        border-radius: 8px;
    }

    .lex-table .lex-verbes {
        margin-top: .25rem;
        font-size: .9375rem;
    }

    .lex-verbes__label {
        display: inline;
        font-weight: 700;
    }

}

/* Page d'accueil
   ------------------------------------------------------------------ */
.acc-section {
    padding-block: clamp(3.5rem, 7vw, 6rem);
    scroll-margin-top: 35px;
}

.acc-section.pt-0 {
    padding-top: 0 !important;
}

.acc-tint {
    background: var(--jm-tint);
}

.jm .acc-on-dark {
    color: var(--jm-green-light);
}

.jm .acc-btn-outline {
    border-color: rgba(255, 255, 255, .6);
    color: #fff;
}

.jm .acc-btn-outline:hover {
    border-color: #fff;
    background: #fff;
    color: var(--jm-deep);
}

.jm .acc-btn-light {
    background: var(--jm-green-light);
    color: var(--jm-deep);
}

.jm .acc-btn-light:hover {
    background: #fff;
    color: var(--jm-deep);
}

.jm .acc-btn-dark {
    background: var(--jm-ink);
    color: #fff;
}

.jm .acc-btn-dark:hover {
    background: #000;
    color: #fff;
}

/* En-tête : la barre fixe recouvre le haut, sa marge est portée par .jm */
.acc-hero {
    padding-block: clamp(2.5rem, 6vw, 5.5rem);
    background: var(--jm-deep);
    color: #fff;
    scroll-margin-top: 35px;
}

.acc-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--jm-gap-lg);
    align-items: center;
}

.jm .acc-hero__title {
    margin: 0 0 1.25rem;
    color: #fff;
    font-size: clamp(2.375rem, 5vw, 4.25rem);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -.025em;
}

.acc-hero__lead {
    max-width: 34em;
    margin-bottom: 1.75rem;
    color: var(--jm-on-dark-soft);
    font-size: clamp(1.125rem, 1.6vw, 1.3125rem);
    line-height: 1.5;
}

.acc-hero__facts {
    display: flex;
    flex-wrap: wrap;
    gap: .625rem 1.75rem;
    margin: 2rem 0 0;
    padding: 0;
    color: var(--jm-on-dark-soft);
    font-size: .9375rem;
    list-style: none;
}

/* Outil */
.acc-tool {
    padding: clamp(1.25rem, 2.4vw, 2rem);
    border-radius: 20px;
    background: #fff;
    color: var(--jm-ink);
}

.jm .acc-tool__title {
    margin: 0 0 .25rem;
    color: var(--jm-ink);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.25;
}

.acc-tool__help {
    margin-bottom: .75rem;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
}

.acc-gauge {
    display: block;
    width: 100%;
    max-width: 440px;
    margin-inline: auto;
    border-radius: 8px;
}

.acc-gauge:focus-visible {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 4px;
}

.acc-range {
    display: block;
    width: 100%;
    height: 2rem;
    margin-top: .5rem;
    accent-color: var(--jm-green-btn);
    cursor: pointer;
}

.acc-zone {
    display: flex;
    align-items: center;
    gap: .625rem;
    margin: .5rem 0 1rem;
    font-size: 1.125rem;
    font-weight: 700;
}

.acc-zone__dot {
    flex: none;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
}

.acc-emotions {
    margin: 0 0 1.25rem;
    padding: 0;
    border: 0;
}

.acc-emotions legend {
    float: none;
    width: auto;
    margin: 0 0 .5rem;
    padding: 0;
    font-size: .875rem;
    font-weight: 700;
}

.acc-emotions__list {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .5rem;
}

.acc-chip {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .25rem;
    min-height: 44px;
    padding: .5rem .125rem;
    border: 2px solid var(--jm-line);
    border-radius: 12px;
    background: #fff;
    color: var(--jm-ink);
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
    transition: border-color .2s, background-color .2s;
}

.acc-chip:hover {
    border-color: var(--jm-green-btn);
}

.acc-chip[aria-pressed="true"] {
    border-color: var(--jm-green-btn);
    background: var(--jm-tint-green);
}

.acc-chip:focus-visible {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 2px;
}

.jm .acc-chip img {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
}

.jm .acc-tool__cta {
    display: flex;
    width: 100%;
}

.acc-tool__note {
    margin: .625rem 0 0;
    color: var(--jm-ink-soft);
    font-size: .875rem;
    text-align: center;
}

/* Étapes */
.acc-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
    margin: clamp(1.75rem, 3vw, 2.75rem) 0 0;
    padding: 0;
    list-style: none;
}

.acc-step {
    padding: 1.75rem;
    border-radius: var(--jm-radius-lg);
    background: var(--jm-tint);
}

.acc-step__num {
    display: block;
    margin-bottom: .75rem;
    font-size: 2.75rem;
    font-weight: 900;
    line-height: 1;
}

.acc-step--1 .acc-step__num { color: var(--jm-green-dark); }
.acc-step--2 .acc-step__num { color: var(--jm-orange-ink); }
.acc-step--3 .acc-step__num { color: var(--jm-red); }

.jm .acc-step h3 {
    margin: 0 0 .5rem;
    color: var(--jm-ink);
    font-size: 1.3125rem;
    font-weight: 700;
}

.acc-step p {
    margin: 0;
    color: var(--jm-ink-soft);
}

/* En-tête de section avec lien */
.acc-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: .75rem 2.5rem;
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}

.acc-head > div {
    flex: 1 1 28rem;
    max-width: 780px;
}

.jm .acc-head .jm-h2 {
    margin-bottom: .5rem;
}

.jm .acc-head .jm-lead,
.jm .acc-head > .jm-h2 {
    margin-bottom: 0;
}

/* Visages */
.acc-faces {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .875rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.jm .acc-face {
    display: block;
    padding: 1.25rem .75rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
    color: var(--jm-ink);
    font-weight: 700;
    transition: border-color .2s, box-shadow .2s;
}

.jm .acc-face:hover {
    border-color: var(--jm-green-btn);
    background: #fff;
    color: var(--jm-ink);
    box-shadow: var(--jm-shadow);
}

.jm .acc-face img {
    display: block;
    width: 5.5rem;
    max-width: 100%;
    height: auto;
    margin: 0 auto .75rem;
    border-radius: 50%;
}

.acc-further {
    margin: 1.5rem 0 0;
    color: var(--jm-ink-soft);
    font-size: 1rem;
}

/* Contextes */
.acc-contexts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--jm-gap);
    margin-top: clamp(1.75rem, 3vw, 2.75rem);
}

.jm a.acc-context {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    border: 1px solid transparent;
    border-radius: var(--jm-radius-lg);
    background: #fff;
    color: var(--jm-ink);
    font-size: 1rem;
    text-align: left;
    white-space: normal;
    transition: border-color .2s, box-shadow .2s;
}

.jm a.acc-context:hover {
    border-color: var(--jm-green-btn);
    background: #fff;
    color: var(--jm-ink);
    box-shadow: var(--jm-shadow);
}

.jm .acc-context img {
    display: block;
    width: 100%;
    height: 190px;
    padding: 1rem;
    border-radius: 0;
    object-fit: contain;
}

.acc-context__body {
    display: block;
    padding: 0 1.375rem 1.5rem;
}

.acc-context__body strong {
    display: block;
    margin-bottom: .375rem;
    font-size: 1.25rem;
}

.acc-context__body span {
    display: block;
    color: var(--jm-ink-soft);
    font-weight: 400;
    line-height: 1.5;
}

/* Histoire */
.acc-story {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--jm-gap-lg);
    align-items: center;
}

.jm .acc-story > img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--jm-radius-lg);
}

.acc-story__text {
    margin-bottom: 1.5rem;
    color: var(--jm-on-dark-soft);
}

.acc-quote {
    margin: 2rem 0 0;
    padding-top: 1.5rem;
    border-top: 1px solid var(--jm-on-dark-line);
}

.jm .acc-quote blockquote {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    color: #fff;
    font-size: 1.25rem;
    font-style: normal;
    line-height: 1.45;
    text-align: left;
}

.jm .acc-quote blockquote::before,
.jm .acc-quote blockquote::after {
    display: none;
}

.acc-quote figcaption {
    margin-top: .625rem;
    color: var(--jm-on-dark-soft);
    font-size: .9375rem;
}

/* Témoignages */
.acc-testimonials {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
    align-items: start;
}

/* France et boutique */
.acc-duo {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--jm-gap);
}

.acc-duo__card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--jm-radius-lg);
}

.acc-duo__card--store {
    background: #fff3d6;
}

.jm .acc-duo__card > img {
    display: block;
    width: 100%;
    height: 260px;
    border-radius: 0;
    object-fit: cover;
}

.jm .acc-duo__card > .acc-duo__france-img {
    padding-top: 1rem;
    object-fit: contain;
}

.jm .acc-duo__card > .acc-duo__store-img {
    object-position: right center;
}

.acc-duo__card > div {
    padding: 1.75rem;
}

.jm .acc-duo__card h2 {
    margin: 0 0 .5rem;
    color: var(--jm-ink);
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.2;
}

.acc-duo__card p {
    margin-bottom: .875rem;
    color: var(--jm-ink-soft);
}

/* Partenaires */
.acc-logos {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.acc-logos li {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 110px;
    padding: .875rem;
    border-radius: var(--jm-radius);
    background: var(--jm-deep);
}

.jm .acc-logos img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* Questions. custom.site.css habille tous les details : on reprend tout ici */
.jm .acc-faq {
    max-width: 820px;
}

.jm .acc-faq details {
    padding: 1rem 0;
    border-top: 1px solid var(--jm-line-strong);
    border-bottom: 0;
}

.jm .acc-faq details:last-child {
    border-bottom: 1px solid var(--jm-line-strong);
}

.jm .acc-faq summary {
    min-height: 1.75rem;
    color: var(--jm-ink);
    font-size: 1.1875rem;
    font-weight: 700;
    cursor: pointer;
}

.jm .acc-faq summary::after {
    content: "\F4FE";
    float: right;
    font-family: "bootstrap-icons";
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.4;
}

.jm .acc-faq details[open] summary::after {
    content: "\F2EA";
}

.jm .acc-faq summary:focus-visible {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 2px;
}

.jm .acc-faq details p {
    margin: .625rem 0 0;
    color: var(--jm-ink-soft);
}

.jm .acc-final .container {
    text-align: center;
}

@media (max-width: 1199.98px) {
    .acc-faces,
    .acc-logos {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .acc-contexts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .acc-hero__grid,
    .acc-story,
    .acc-duo {
        grid-template-columns: minmax(0, 1fr);
    }

    /* Témoignages à faire défiler : trois cartes empilées prendraient trop de hauteur */
    .acc-testimonials {
        display: flex;
        gap: .875rem;
        overflow-x: auto;
        padding-bottom: .5rem;
        scroll-snap-type: x mandatory;
    }

    .acc-testimonials > .tmg-card {
        flex: 0 0 min(85%, 420px);
        scroll-snap-align: start;
    }
}

@media (max-width: 767.98px) {
    .acc-steps {
        grid-template-columns: minmax(0, 1fr);
    }

    .acc-step {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        column-gap: 1rem;
        padding: 1.25rem;
    }

    .acc-step__num {
        grid-row: span 2;
        margin-bottom: 0;
    }

    .acc-emotions__list {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .acc-section {
        padding-block: 2.75rem;
    }

    .acc-contexts {
        grid-template-columns: minmax(0, 1fr);
        gap: .75rem;
    }

    .jm a.acc-context {
        flex-direction: row;
        align-items: center;
    }

    .jm .acc-context img {
        flex: none;
        width: 96px;
        height: 96px;
        padding: .5rem;
    }

    .acc-context__body {
        padding: .75rem 1rem .75rem .25rem;
    }

    .acc-context__body strong {
        margin-bottom: .125rem;
        font-size: 1.0625rem;
    }

    .acc-context__body span {
        font-size: .9375rem;
    }

    .acc-faces {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .625rem;
    }

    .jm .acc-face {
        padding: .75rem .25rem;
        font-size: .875rem;
    }

    .jm .acc-face img {
        width: 3.75rem;
        margin-bottom: .5rem;
    }

    .jm .acc-duo__card > img {
        height: 170px;
    }

    .acc-duo__card > div {
        padding: 1.25rem;
    }

    .acc-logos {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .5rem;
    }

    .acc-logos li {
        height: 80px;
        padding: .5rem;
    }

    .acc-logos li:nth-child(n + 7) {
        display: none;
    }
}

/* Inviter ses proches
   ------------------------------------------------------------------ */
.inv-link {
    box-shadow: var(--jm-shadow);
}

.inv-copy {
    display: flex;
    gap: .5rem;
}

.jm .inv-copy .form-control {
    min-width: 0;
    flex: 1;
    background: var(--jm-tint);
    font-size: .9375rem;
}

.jm .inv-copy .jm-btn {
    flex: none;
    padding: .5rem 1rem;
}

.jm .inv-status {
    min-height: 1.4em;
    margin: .375rem 0 0;
    color: var(--jm-green-dark);
    font-size: .875rem;
    font-weight: 600;
}

.jm .inv-native {
    width: 100%;
    margin-top: .5rem;
}

.inv-grid {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: var(--jm-gap-lg);
    align-items: start;
}

.jm .inv-label {
    display: block;
    margin: 1.25rem 0 .375rem;
    font-weight: 700;
}

.jm #inv-message {
    height: auto;
    min-height: 19rem;
    font-size: 1rem;
    line-height: 1.55;
}

.inv-message-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem 1rem;
    margin-top: .75rem;
}

.jm .inv-message-actions .inv-status {
    margin: 0;
}

.jm .inv-share-title {
    margin: 0 0 1rem;
    color: var(--jm-ink);
    font-size: 1.25rem;
    font-weight: 700;
}

.inv-share {
    display: grid;
    gap: .625rem;
    margin: 0 0 1rem;
    padding: 0;
    list-style: none;
}

.jm a.inv-share__link {
    display: flex;
    align-items: center;
    gap: .75rem;
    width: 100%;
    min-height: 52px;
    padding: .625rem 1rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
    color: var(--jm-ink);
    font-weight: 700;
    text-align: left;
    transition: border-color .2s, box-shadow .2s;
}

.jm a.inv-share__link:hover {
    border-color: var(--jm-green-btn);
    background: #fff;
    color: var(--jm-ink);
    box-shadow: var(--jm-shadow);
}

.inv-share__link .bi {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
    font-size: 1.125rem;
}

@media (max-width: 991.98px) {
    .inv-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 575.98px) {
    .inv-copy {
        flex-direction: column;
    }
}

/* Journal émotionnel : liste et saisie
   ------------------------------------------------------------------ */
.jrn-message {
    display: flex;
    align-items: center;
    gap: .625rem;
    margin-bottom: 1.5rem;
    padding: .875rem 1.125rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint-green);
    color: var(--jm-ink);
    font-weight: 600;
}

.jrn-message--success .bi {
    color: var(--jm-green-dark);
}

.jrn-message--warning {
    background: var(--jm-tint-orange);
}

.jrn-message--warning .bi {
    color: var(--jm-orange-ink);
}

.jrn-message:focus {
    outline: 0;
}

.jrn-filters {
    margin-bottom: 1.5rem;
    scroll-margin-top: 35px;
}

.jm .jrn-month {
    margin: 2rem 0 .75rem;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.jrn-entries {
    display: grid;
    gap: .75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.jrn-entry {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: start;
    padding: 1.125rem 1.25rem;
    border: 1px solid var(--jm-line);
    border-left: 5px solid var(--jrn-couleur);
    border-radius: var(--jm-radius);
    background: #fff;
    scroll-margin-top: 140px;
}

.jrn-entry.is-new {
    box-shadow: 0 0 0 3px var(--jm-green-light);
}

.jrn-entry__face {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background: var(--jm-tint);
    color: var(--jm-ink-soft);
    font-size: 1.25rem;
}

.jm .jrn-entry__face img {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
}

.jm .jrn-entry__meta {
    margin: 0 0 .125rem;
    color: var(--jm-ink-soft);
    font-size: .875rem;
}

.jm .jrn-entry__title {
    margin: 0 0 .25rem;
    color: var(--jm-ink);
    font-size: 1.125rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.jm .jrn-entry__text {
    margin: 0;
    font-size: .9375rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.jrn-entry__actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .375rem;
}

.jm .jrn-entry__open {
    padding: .375rem 1rem;
    font-size: .9375rem;
}

.jrn-delete summary {
    padding: .25rem .25rem;
    color: var(--jm-ink-soft);
    font-size: .875rem;
    cursor: pointer;
    list-style: none;
}

.jrn-delete summary::-webkit-details-marker {
    display: none;
}

.jm .jrn-delete summary::after {
    content: none;
}

.jrn-delete summary:hover {
    color: var(--jm-red);
}

.jrn-delete[open] {
    padding: .75rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
}

.jm .jrn-delete p {
    margin: .25rem 0 .5rem;
    font-size: .875rem;
}

.jm .jrn-delete__confirm {
    padding: .375rem .875rem;
    border: 0;
    border-radius: 999px;
    background: var(--jm-red);
    color: #fff;
    font-size: .875rem;
    font-weight: 700;
}

.jm .jrn-delete__confirm:hover {
    background: #8f0322;
    color: #fff;
}

.jrn-pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: .75rem 1.25rem;
    margin-top: 2rem;
    color: var(--jm-ink-soft);
}

/* Saisie */
.jrn-alert {
    margin-bottom: 1.5rem;
}

.jrn-form__grid {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: var(--jm-gap);
    align-items: start;
}

.jrn-step-card {
    display: grid;
    gap: 1.75rem;
}

.jrn-fieldset {
    margin: 0;
    padding: 0;
    border: 0;
    scroll-margin-top: 140px;
}

.jm .jrn-fieldset legend,
.jm .jrn-field > label {
    display: flex;
    align-items: center;
    gap: .5rem;
    float: none;
    width: auto;
    margin: 0 0 .375rem;
    padding: 0;
    color: var(--jm-ink);
    font-size: 1.0625rem;
    font-weight: 700;
}

.jrn-step-num {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 50%;
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
    font-size: .875rem;
    font-weight: 700;
}

.jrn-gauge {
    display: block;
    width: 100%;
    max-width: 420px;
    margin: .5rem auto 0;
    border-radius: 8px;
}

.jrn-gauge:focus-visible {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 4px;
}

.jm .jrn-zone {
    margin: .375rem 0 0;
    color: var(--jm-ink);
    font-weight: 700;
    text-align: center;
}

.jrn-emotions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
}

.jrn-emotion__input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.jm .jrn-emotion {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .25rem;
    min-height: 44px;
    margin: 0;
    padding: .625rem .25rem;
    border: 2px solid var(--jm-line);
    border-radius: 12px;
    background: #fff;
    color: var(--jm-ink);
    font-size: .875rem;
    font-weight: 700;
    cursor: pointer;
}

.jm .jrn-emotion img {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
}

.jrn-emotion:hover {
    border-color: var(--jm-green-btn);
}

.jrn-emotion__input:checked + .jrn-emotion {
    border-color: var(--jm-green-btn);
    background: var(--jm-tint-green);
}

.jrn-emotion__input:focus-visible + .jrn-emotion {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 2px;
}

.jrn-field {
    scroll-margin-top: 140px;
}

.jrn-help {
    margin-top: .5rem;
}

.jm .jrn-help summary {
    color: var(--jm-green-dark);
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
}

.jm .jrn-help summary::after {
    content: none;
}

.jm .jrn-help p {
    margin: .5rem 0 0;
    color: var(--jm-ink-soft);
    font-size: .875rem;
    line-height: 1.5;
}

.jrn-form__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1rem;
    margin-top: 1.5rem;
}

.jm .jrn-form__actions .cpt-note {
    margin: 0;
}

@media (max-width: 991.98px) {
    .jrn-form__grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 575.98px) {
    .jrn-entry {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .jrn-entry__actions {
        grid-column: 1 / -1;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

/* Journal émotionnel : présentation
   ------------------------------------------------------------------ */
.jm .jrn-cover {
    width: min(420px, 100%);
    margin-inline: auto;
    border-radius: 0;
    filter: drop-shadow(0 18px 30px rgba(28, 35, 33, .18));
}

.jrn-philo {
    margin: 0;
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border-radius: var(--jm-radius-lg);
    background: var(--jm-tint-green);
}

/* Le site habille tous les blockquote : guillemets, centrage, filet */
.jm .jrn-philo {
    border: 0;
    font-style: normal;
    text-align: left;
}

.jm .jrn-philo::before,
.jm .jrn-philo::after {
    display: none;
}

.pcp-grid.jrn-reasons {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 991.98px) {
    .pcp-grid.jrn-reasons {
        grid-template-columns: minmax(0, 1fr);
    }
}

.jm .jrn-philo p {
    color: var(--jm-ink);
    font-size: clamp(1.0625rem, 1.6vw, 1.25rem);
    line-height: 1.6;
}

.jm .jrn-philo p:first-child {
    font-weight: 600;
}

.jrn-num {
    display: block;
    margin-bottom: .5rem;
    color: var(--jm-green-dark);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
}

.jrn-manual {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: var(--jm-gap-lg);
    align-items: start;
}

.jrn-manual .acc-faq {
    max-width: none;
}

.jm .jrn-manual summary .jrn-step {
    display: inline-block;
    min-width: 2rem;
    color: var(--jm-green-dark);
}

.jrn-tips {
    display: grid;
    gap: .75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.jrn-tips li {
    display: flex;
    gap: .75rem;
    font-size: 1rem;
    line-height: 1.5;
}

.jrn-tips .bi {
    flex: none;
    color: var(--jm-green-dark);
}

.jm .jrn-slogan {
    margin: 0 0 1rem;
    color: #fff;
    font-size: clamp(1.5rem, 3.2vw, 2.25rem);
    font-weight: 900;
    letter-spacing: .02em;
    line-height: 1.2;
}

.jm .jrn-slogan strong {
    color: var(--jm-green-light);
}

.jrn-slogan-note {
    margin-bottom: 1.75rem;
    color: var(--jm-on-dark-soft);
    font-size: .9375rem;
}

@media (max-width: 991.98px) {
    .jrn-manual {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Pourquoi créer un compte
   ------------------------------------------------------------------ */
.pcp-example {
    box-shadow: var(--jm-shadow);
}

.pcp-example .esp-view__top {
    margin-bottom: .75rem;
}

.jm .pcp-example .esp-view__emotion img {
    border-radius: 50%;
}

.jm .pcp-example__context {
    margin: 0;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    text-align: center;
}

.pcp-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--jm-gap);
}

.jm .pcp-benefit {
    padding: 1.5rem;
}

.jm .pcp-benefit h3 {
    margin: 0 0 .5rem;
    color: var(--jm-ink);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.3;
}

.pcp-benefit p {
    margin: 0;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    line-height: 1.5;
}

.pcp-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--jm-gap-lg);
    align-items: center;
}

.pcp-questions {
    display: grid;
    gap: .75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pcp-questions li {
    display: flex;
    gap: .75rem;
    padding: 1rem 1.25rem;
    border-radius: var(--jm-radius);
    background: #fff;
    font-size: 1rem;
    line-height: 1.45;
}

.pcp-questions .bi {
    flex: none;
    color: var(--jm-green-dark);
}

@media (max-width: 1199.98px) {
    .pcp-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .pcp-split {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 575.98px) {
    .pcp-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Création de compte
   ------------------------------------------------------------------ */
.cpt-narrow {
    max-width: 640px;
    scroll-margin-top: 35px;
}

.jm .cpt-narrow [data-dem-submit] {
    margin-top: 1.25rem;
}

.jm .cpt-help,
.jm .cpt-note {
    margin: .375rem 0 0;
    color: var(--jm-ink-soft);
    font-size: .875rem;
    line-height: 1.45;
}

.jm .cpt-note {
    margin-block: 1rem;
}

.jm .cpt-status {
    margin: .25rem 0 0;
    font-size: .875rem;
    font-weight: 600;
}

.jm .cpt-status:empty {
    display: none;
}

.cpt-status.is-ok {
    color: var(--jm-green-dark);
}

.cpt-status.is-ko {
    color: var(--jm-red);
}

.cpt-password {
    position: relative;
}

.jm .cpt-password .form-control {
    padding-right: 3rem;
}

.cpt-eye {
    position: absolute;
    top: 0;
    right: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: var(--jm-radius);
    background: transparent;
    color: var(--jm-ink-soft);
    cursor: pointer;
}

.cpt-eye[hidden] {
    display: none;
}

.cpt-eye:hover {
    color: var(--jm-ink);
}

.cpt-eye:focus-visible {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: -3px;
}

.cpt-rules {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .25rem 1rem;
    margin: .5rem 0 0;
    padding: 0;
    color: var(--jm-ink-soft);
    font-size: .875rem;
    list-style: none;
}

.cpt-rules[hidden] {
    display: none;
}

.cpt-rules li::before {
    content: "\F28A";
    margin-right: .375rem;
    font-family: "bootstrap-icons";
    vertical-align: -.125em;
}

.cpt-rules li.is-ok {
    color: var(--jm-green-dark);
    font-weight: 600;
}

.cpt-rules li.is-ok::before {
    content: "\F26B";
}

.cpt-benefits {
    display: grid;
    gap: .625rem;
    margin: .5rem 0 0;
    padding: 0;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    line-height: 1.4;
    list-style: none;
}

.cpt-benefits .bi {
    margin-right: .25rem;
    color: var(--jm-green-dark);
}

.cpt-fail > .bi {
    color: var(--jm-orange-ink);
}

@media (max-width: 575.98px) {
    .cpt-rules {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Newsletter
   ------------------------------------------------------------------ */
.nl-tinted {
    background: var(--jm-tint);
}

.nl-reasons {
    margin: 0;
    padding: 0;
    list-style: none;
}

.nl-unsubscribe {
    max-width: 780px;
    margin-inline: auto;
}

.jm .nl-unsubscribe [data-dem-submit] {
    margin-top: 1.25rem;
}

/* Espace membre : accueil
   ------------------------------------------------------------------ */

/* L'en-tête de la page passe sous la barre fixe : pas de marge à ajouter ici */
.jm.esp {
    margin-top: 0;
}

.esp-section {
    padding-block: clamp(2.5rem, 5vw, 4rem);
}

.jm .esp-action {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .55rem 1.1rem;
    border: 0;
    border-radius: 999px;
    background: var(--jm-green-btn);
    color: #fff;
    font-size: .9375rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: left;
    white-space: normal;
    transition: background-color .2s;
}

.jm .esp-action:hover {
    background: var(--jm-green-dark);
    color: #fff;
}

.jm .esp-action--light {
    background: #fff;
    color: var(--jm-deep);
}

.jm .esp-action--light:hover {
    background: var(--jm-tint-green);
    color: var(--jm-deep);
}

.jm .esp-sublink {
    padding: .25rem 0;
    border: 0;
    color: var(--jm-green-dark);
    font-size: .9375rem;
    font-weight: 700;
    text-align: left;
    text-decoration: underline;
    text-underline-offset: 3px;
    white-space: normal;
}

.jm .esp-sublink:hover {
    background: transparent;
    color: var(--jm-ink);
}

/* Chiffres clés. Hors de .jm : ce bloc est dans l'en-tête de la page.
   Deux ou quatre colonnes selon la place réelle, pour ne jamais laisser une tuile seule sur sa ligne :
   de 768 à 1199 px, la jauge occupe la moitié de la largeur. */
.esp-kpis {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin: 0 0 1.5rem;
}

.esp-kpi {
    display: flex;
    flex-direction: column;
    /* Sur la tuile la plus étroite (118 px), « Justaumétries » doit tenir sur une ligne */
    padding: .875rem .75rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
}

/* Le libellé précède la valeur pour les lecteurs d'écran, et la suit à l'écran */
.esp-kpi__label {
    order: 2;
    margin: .25rem 0 0;
    color: var(--jm-ink);
    font-size: .8125rem;
    font-weight: 600;
    line-height: 1.3;
}

/* Un très grand nombre fait passer l'icône à la ligne plutôt que de déborder */
.esp-kpi__value {
    display: flex;
    flex-wrap: wrap;
    order: 1;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin: 0;
    color: var(--jm-ink);
    font-size: 1.5rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.esp-kpi__icon {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
    font-size: 1rem;
}

.esp-kpi__note {
    order: 3;
    margin: .125rem 0 0;
    color: var(--jm-ink-soft);
    font-size: .8125rem;
    line-height: 1.3;
}

@media (min-width: 576px) and (max-width: 767.98px), (min-width: 1200px) {
    .esp-kpis {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    /* Cinq tuiles : trois puis deux, les tuiles restant assez larges pour leurs libellés */
    .esp-kpis--5 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .esp-kpis--5 .esp-kpi {
        grid-column: span 2;
    }

    .esp-kpis--5 .esp-kpi:nth-child(n+4) {
        grid-column: span 3;
    }
}

/* Sur deux colonnes, une tuile seule en dernière ligne prend toute la largeur */
@media (max-width: 575.98px), (min-width: 768px) and (max-width: 1199.98px) {
    .esp-kpis--5 .esp-kpi:last-child {
        grid-column: 1 / -1;
    }
}

.esp-kpi a.esp-kpi__link {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: 0;
    border: 0;
    color: var(--jm-green-dark);
    font-size: inherit;
    font-weight: 700;
    text-decoration: underline;
    text-transform: none;
    text-underline-offset: 2px;
}

.esp-kpi a.esp-kpi__link:hover {
    color: var(--jm-ink);
}

/* Choix de la jauge. Un seul style : .btn-outline-primary du site paraît toujours sélectionné. */
[data-justau-jauge] .jau-choice {
    padding: .3rem .75rem;
    border: 1px solid var(--jm-line-strong);
    border-radius: 999px;
    background: #fff;
    color: var(--jm-ink);
    font-weight: 600;
    text-transform: none;
}

[data-justau-jauge] .jau-choice::after {
    display: none;
}

[data-justau-jauge] .jau-choice:hover {
    border-color: var(--jm-green-btn);
    background: var(--jm-tint-green);
    color: var(--jm-ink);
}

[data-justau-jauge] .btn-check:checked + .jau-choice {
    border-color: var(--jm-green-btn);
    background: var(--jm-green-btn);
    color: #fff;
}

[data-justau-jauge] .btn-check:focus-visible + .jau-choice {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 2px;
    box-shadow: none;
}

#justaumetrieExpress {
    scroll-margin-top: 1rem;
}

/* Le focus y est placé pour les lecteurs d'écran : ce message n'est pas interactif */
[data-justau-retour]:focus {
    outline: 0;
}

/* Justaumétrie sans émotion choisie : même format que l'icône d'émotion */
.esp-sans-emotion {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40%;
    aspect-ratio: 1;
    border: 2px solid var(--bs-dark);
    border-radius: 50%;
    color: #fff;
    font-size: 1.25rem;
}

/* Cartes des dernières justaumétries : un lien qui garde l'apparence de la carte */
a.esp-jcard {
    display: block;
    height: 100%;
    padding: 0;
    border: 0;
    border-radius: 1rem;
    color: inherit !important;
    font-size: inherit;
    font-weight: 400;
    text-transform: none;
    white-space: normal;
    transition: box-shadow .2s, transform .2s;
}

a.esp-jcard::after {
    display: none;
}

a.esp-jcard:hover {
    background: transparent;
    box-shadow: var(--jm-shadow);
    transform: translateY(-2px);
}

a.esp-jcard:focus-visible {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 2px;
    box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
    a.esp-jcard {
        transition: none;
    }

    a.esp-jcard:hover {
        transform: none;
    }
}

/* Consultation d'une justaumétrie. Hors de .jm dans la fenêtre : les couleurs sont donc fixées ici. */
.esp-view {
    color: var(--jm-ink);
}

.esp-view-page .esp-view {
    max-width: 640px;
}

.esp-view__top {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
    gap: 1.25rem 2rem;
    margin-bottom: 1.25rem;
}

.esp-view__block {
    text-align: center;
}

.esp-view__gauge {
    display: block;
    width: min(260px, 100%);
    max-width: 100%;
    margin-inline: auto;
}

.esp-view__emotion img,
.esp-view__no-emotion {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 5.5rem;
    height: 5.5rem;
    border-radius: 50%;
    object-fit: cover;
}

.esp-view__no-emotion {
    background: var(--jm-tint);
    color: var(--jm-ink-soft);
    font-size: 2rem;
}

.esp-view__caption {
    margin: .5rem 0 0;
    font-weight: 700;
}

.esp-view__details {
    display: grid;
    gap: 1rem;
    margin: 0 0 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--jm-line);
}

.esp-view__details dt {
    margin-bottom: .125rem;
    color: var(--jm-ink-soft);
    font-size: .875rem;
    font-weight: 600;
}

.esp-view__details dd {
    margin: 0;
    overflow-wrap: anywhere;
    white-space: pre-line;
}

a.esp-view__more {
    padding: .25rem 0;
    border: 0;
    color: var(--jm-green-dark) !important;
    font-size: .9375rem;
    font-weight: 700;
    text-align: left;
    text-decoration: underline;
    text-transform: none;
    text-underline-offset: 3px;
    white-space: normal;
}

a.esp-view__more::after {
    display: none;
}

a.esp-view__more:hover {
    background: transparent;
    color: var(--jm-ink) !important;
}

.esp-view__missing {
    margin: 0;
    color: var(--jm-ink);
}

/* Modules */
.esp-modules {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
    margin: 0 0 var(--jm-gap);
    padding: 0;
    list-style: none;
}

.esp-module {
    display: flex;
    flex-direction: column;
    padding: 1.5rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
}

.esp-module__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    margin-bottom: 1rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint-green);
    color: var(--jm-green-dark);
    font-size: 1.375rem;
}

.jm .esp-module__title {
    margin-bottom: .375rem;
    font-size: 1.125rem;
    font-weight: 700;
}

.esp-module__text {
    margin-bottom: 1.25rem;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    line-height: 1.5;
}

.esp-module__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem 1rem;
    margin-top: auto;
}

/* Boutique */
.esp-store {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
}

.esp-store__text {
    padding: clamp(1.5rem, 3vw, 2.25rem);
}

.esp-store__text p {
    margin-bottom: 1rem;
}

.esp-store__name {
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 700;
    line-height: 1.1;
}

.jm .esp-store__img {
    width: 100%;
    height: 100%;
    max-height: 240px;
    border-radius: 0;
    object-fit: cover;
    object-position: right center;
}

/* Colonnes */
.esp-columns {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: var(--jm-gap);
    align-items: start;
    padding-top: 0;
}

.esp-main,
.esp-aside {
    display: grid;
    gap: var(--jm-gap);
    min-width: 0;
}

.esp-panel {
    padding: clamp(1.25rem, 2.5vw, 1.75rem);
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
}

.esp-panel--tint {
    border-color: transparent;
    background: var(--jm-tint-green);
}

.esp-panel--dark {
    border-color: transparent;
    background: var(--jm-deep);
    color: #fff;
}

.esp-panel--dark .esp-panel__title,
.esp-panel--dark .esp-panel__text {
    color: #fff;
}

.esp-panel__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: .25rem 1rem;
    margin-bottom: 1rem;
}

.jm .esp-panel__title {
    margin-bottom: .5rem;
    font-size: 1.25rem;
    font-weight: 700;
}

.esp-panel__head .esp-panel__title {
    margin-bottom: 0;
}

.esp-panel__sub {
    margin-bottom: 1.25rem;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
}

.esp-panel__text {
    margin-bottom: 1rem;
    font-size: .9375rem;
    line-height: 1.5;
}

.jm .esp-panel p.esp-panel__text:last-child {
    margin-bottom: 0;
}

.esp-tag {
    display: inline-block;
    margin-bottom: .75rem;
    padding: .125rem .625rem;
    border-radius: 999px;
    background: var(--jm-green-light);
    color: var(--jm-deep);
    font-size: .8125rem;
    font-weight: 700;
}

.jm .esp-word {
    margin-bottom: .5rem;
    font-size: 1.625rem;
    font-weight: 700;
}

/* Repères */
.esp-bars {
    display: grid;
    gap: .75rem;
    margin: 0 0 1.25rem;
    padding: 0;
    list-style: none;
}

.esp-bar {
    display: grid;
    grid-template-columns: 2.25rem 5.5rem minmax(0, 1fr) 2rem;
    align-items: center;
    gap: .75rem;
    font-size: .9375rem;
}

.jm .esp-bar__icon {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    object-fit: cover;
}

.esp-bar__track {
    display: block;
    overflow: hidden;
    height: .75rem;
    border-radius: 999px;
    background: var(--jm-tint);
}

.esp-bar__track span {
    display: block;
    height: 100%;
    border-radius: 999px;
}

.esp-bar__count {
    font-weight: 700;
    text-align: right;
}

.esp-note {
    display: flex;
    gap: .75rem;
    margin: 0;
    padding: .875rem 1rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint);
    font-size: .9375rem;
    line-height: 1.5;
}

.esp-note .bi {
    color: var(--jm-green-dark);
    font-size: 1.125rem;
}

.esp-empty {
    padding: 1.5rem;
    border-radius: var(--jm-radius);
    background: var(--jm-tint);
}

/* Journal */
.esp-journal {
    display: grid;
    gap: 1.25rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.esp-journal__page {
    padding-left: 1rem;
    border-left: 4px solid var(--esp-couleur, var(--jm-line-strong));
}

.esp-journal__meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .25rem 1rem;
    margin-bottom: .25rem;
    color: var(--jm-ink-soft);
    font-size: .875rem;
}

.jm .esp-journal__title {
    margin-bottom: .25rem;
    font-size: 1.0625rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.esp-journal__text {
    margin-bottom: 0;
    font-size: .9375rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

/* Ressources */
.esp-resources .res-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Émotions */
.esp-emotions {
    background: var(--jm-tint);
}

@media (max-width: 991.98px) {
    .esp-modules {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .esp-columns {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 575.98px) {
    .esp-modules,
    .esp-resources .res-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .esp-store {
        grid-template-columns: minmax(0, 1fr);
    }

    .jm .esp-store__img {
        max-height: 180px;
    }
}

/* Pages légales
   ------------------------------------------------------------------ */
.legal-update {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-self: center;
    max-width: 420px;
    padding: 1.25rem 1.5rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    line-height: 1.4;
}

.legal-update .bi {
    color: var(--jm-green-btn);
    font-size: 1.5rem;
}

.legal-update strong {
    display: block;
    color: var(--jm-ink);
}

.legal {
    display: grid;
    grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
    gap: clamp(2rem, 5vw, 4rem);
    align-items: start;
}

/* Le contenu du sommaire vient du script de _footer.php */
.legal__toc > .tb > div:first-child {
    margin: 0 !important;
    padding: 1.25rem !important;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: var(--jm-tint) !important;
}

.jm .legal__toc h3 {
    margin: 0 0 .625rem;
    color: var(--jm-ink);
    font-size: 1rem;
    font-weight: 700;
}

.legal__toc ul {
    margin: 0;
    font-size: .9375rem;
    line-height: 1.35;
}

.legal__toc li {
    margin-bottom: .5rem;
}

.legal__toc li:last-child {
    margin-bottom: 0;
}

.legal__prose {
    max-width: 72ch;
    color: var(--jm-ink-soft);
    font-size: 1rem;
}

.jm .legal__prose h2 {
    margin: 2.5rem 0 .75rem;
    color: var(--jm-ink);
    font-size: clamp(1.25rem, 2vw, 1.5rem);
    font-weight: 700;
    line-height: 1.25;
    /* Sous la barre fixe : custom.site.css ajoute déjà scroll-padding-top: 100px */
    scroll-margin-top: 35px;
}

.jm .legal__prose h2:first-child {
    margin-top: 0;
}

.jm .legal__prose h2 strong {
    font-weight: inherit;
}

.jm .legal__prose p:last-child {
    margin-bottom: 1rem;
}

.legal__prose strong {
    color: var(--jm-ink);
}

.legal__prose ul {
    margin-bottom: 1rem;
    padding-left: 1.25rem;
}

.legal__prose li {
    margin-bottom: .375rem;
}

/* Test en ligne
   ------------------------------------------------------------------ */
.jm-hero .tst-gauge {
    padding: clamp(1rem, 2.5vw, 1.75rem);
    box-shadow: var(--jm-shadow);
}

.tst-gauge a {
    font-size: .9375rem;
}

.jm .tst-intro {
    margin-bottom: .5rem;
    color: var(--jm-ink);
    font-weight: 500;
}

.tst-questions {
    margin: 0 0 1.75rem;
    padding-left: 1.25rem;
    color: var(--jm-ink-soft);
}

.tst-questions li {
    margin-bottom: .25rem;
}

.tst-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--jm-gap);
    margin: 0;
    padding: 0;
    list-style: none;
}

.tst-benefits li {
    display: flex;
    gap: .875rem;
    padding: 1.25rem;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    font-size: 1rem;
    line-height: 1.4;
}

.tst-benefits .bi {
    flex: none;
    color: var(--jm-green-btn);
    font-size: 1.375rem;
    line-height: 1.1;
}

.tst-invite {
    margin-top: clamp(2.5rem, 5vw, 4rem);
}

.jm .tst-sign {
    margin: 1.5rem 0 0;
    color: var(--jm-ink-soft);
}

@media (max-width: 991.98px) {
    .legal {
        grid-template-columns: minmax(0, 1fr);
    }

    .tst-benefits {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .tst-benefits {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Ressources
   ------------------------------------------------------------------ */
.res-goal {
    margin-bottom: 0;
    color: var(--jm-ink);
    font-size: clamp(1.0625rem, 1.6vw, 1.25rem);
}

.res-propose {
    padding: clamp(1.5rem, 3vw, 2.25rem);
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
}

.jm .res-propose h2 {
    margin: 0 0 .75rem;
    color: var(--jm-ink);
    font-size: 1.375rem;
    font-weight: 700;
}

.res-propose p {
    margin-bottom: 1.25rem !important;
    color: var(--jm-ink-soft);
}

.res-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--jm-gap);
}

.jm a.res-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius);
    background: #fff;
    color: var(--jm-ink);
    font-size: 1rem;
    text-align: left;
    white-space: normal;
    transition: border-color .2s, box-shadow .2s;
}

.jm a.res-card:hover {
    border-color: var(--jm-green);
    background: #fff;
    box-shadow: var(--jm-shadow);
    color: var(--jm-ink);
}

.jm a.res-card[hidden] {
    display: none;
}

.res-card__media {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: var(--jm-tint);
}

/* En absolu : une infographie très haute ne doit pas agrandir la vignette */
.jm .res-card__media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Icône de type de fichier : ne pas l'agrandir ni la recadrer */
.jm .res-card__media--file img {
    padding: 1.5rem;
    object-fit: contain;
}

.res-badge,
.res-duration {
    position: absolute;
    display: inline-flex;
    gap: .3rem;
    align-items: center;
    padding: .15rem .55rem;
    border-radius: 999px;
    color: #fff;
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.5;
}

.res-badge {
    top: .5rem;
    left: .5rem;
}

.res-badge--image { background: var(--jm-green-dark); }
.res-badge--video { background: var(--jm-red); }
.res-badge--pdf { background: var(--jm-deep); }

.res-duration {
    right: .5rem;
    bottom: .5rem;
    background: rgba(0, 0, 0, .75);
}

.res-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: .5rem;
    padding: 1rem;
}

.res-card__title {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.res-card__text {
    color: var(--jm-ink-soft);
    font-size: .875rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.res-card__stats {
    display: flex;
    gap: 1rem;
    margin-top: auto;
    padding-top: .5rem;
    color: var(--jm-ink-soft);
    font-size: .8125rem;
}

.res-more {
    margin-top: 2rem;
    text-align: center;
}

.res-more[hidden] {
    display: none;
}

/* Actualités
   ------------------------------------------------------------------ */
.actu {
    padding-block: clamp(2rem, 5vw, 4rem) clamp(3rem, 6vw, 5rem);
}

.actu-head {
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.actu-head__title {
    margin: 0 0 .75rem;
    color: var(--jm-ink);
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.02em;
}

.actu-head__lead {
    max-width: 62ch;
    margin: 0;
    color: var(--jm-ink-soft);
    font-size: clamp(1.0625rem, 1.6vw, 1.25rem);
    line-height: 1.55;
}

/* Mots-clés : même apparence que .jm-filters */
.actu-chips {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: 1.5rem;
}

.actu a.actu-chip {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: .25rem 1rem;
    border: 1px solid var(--jm-line-strong);
    border-radius: 999px;
    background: #fff;
    color: var(--jm-ink) !important;
    font-size: .9375rem;
    font-weight: 500;
    text-decoration: none !important;
    transition: border-color .15s, background-color .15s, color .15s;
}

.actu a.actu-chip:is(:hover, :focus) {
    border-color: var(--jm-green-dark);
    color: var(--jm-green-dark) !important;
    text-decoration: none !important;
}

.actu a.actu-chip[aria-current="page"] {
    border-color: var(--jm-green-dark);
    background: var(--jm-green-dark);
    color: #fff !important;
}

.actu-chips--small {
    margin: 0 0 1.25rem;
}

.actu .actu-chips--small a.actu-chip {
    min-height: 32px;
    padding-inline: .75rem;
    font-size: .8125rem;
}

.actu-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--jm-line);
    border-radius: var(--jm-radius-lg);
    background: #fff;
    transition: transform .2s ease, box-shadow .2s ease;
}

.actu-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--jm-shadow);
}

.actu-card:has(a:focus-visible) {
    outline: 3px solid var(--jm-green-dark);
    outline-offset: 2px;
}

.actu-card a:focus-visible {
    outline: none;
}

.actu-card__media {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--jm-tint);
}

.actu-card__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}

.actu-card:hover .actu-card__media img {
    transform: scale(1.04);
}

/* Le visuel de remplacement contient du texte : on ne le recadre pas */
.actu-card__media img.is-placeholder {
    object-fit: contain;
}

.actu-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 1.25rem;
}

.actu-card .jm-eyebrow {
    margin-bottom: .5rem;
    font-size: .75rem;
}

.actu-card__title {
    margin: 0 0 .5rem;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.actu .actu-card__title a,
.actu .actu-card__title a:is(:hover, :focus) {
    color: var(--jm-ink) !important;
    text-decoration: none !important;
}

.actu .actu-card:hover .actu-card__title a {
    color: var(--jm-green-dark) !important;
}

.actu-card__lead {
    display: -webkit-box;
    margin: 0 0 1rem;
    overflow: hidden;
    color: var(--jm-ink-soft);
    font-size: .9375rem;
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
}

.actu-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem .5rem;
    margin: auto 0 0;
    color: var(--jm-ink-soft);
    font-size: .8125rem;
    line-height: 1.5;
}

.actu-meta strong {
    color: var(--jm-ink);
    font-weight: 500;
}

.actu-front {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.actu-front__side {
    display: grid;
    grid-template-rows: 1fr 1fr;
    gap: 1.5rem;
    min-width: 0;
}

.actu-card--featured .actu-card__media {
    aspect-ratio: 16 / 9;
}

.actu-card--featured .actu-card__body {
    padding: 1.5rem 1.75rem 1.75rem;
}

.actu-card--featured .actu-card__title {
    font-size: clamp(1.375rem, 2.4vw, 1.875rem);
    line-height: 1.2;
    letter-spacing: -.01em;
}

.actu-card--featured .actu-card__lead {
    font-size: 1.0625rem;
}

.actu-card--row .actu-card__media {
    aspect-ratio: 4 / 3;
}

.actu-card--row .actu-card__title {
    font-size: 1.0625rem;
}

.actu-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.actu-more {
    display: flex;
    justify-content: center;
    margin-top: 2.5rem;
}

.actu-pages {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem .75rem;
    justify-content: center;
    margin-top: 1rem;
    font-size: .9375rem;
}

.actu-pages [aria-current] {
    font-weight: 700;
    text-decoration: underline;
}

.actu-more__end {
    margin: 0;
    color: var(--jm-ink-soft);
}

.actu-btn.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 46px;
    padding: .5rem 1.5rem;
    border-radius: 999px;
    font-weight: 700;
    text-transform: none;
}

/* Couleurs écrites en dur : custom.site.css fixe background-color sur .btn-primary,
   les variables --bs-btn-* de Bootstrap 5.3 n'auraient aucun effet */
.actu .actu-btn.btn-primary {
    border-color: var(--jm-green-btn);
    background-color: var(--jm-green-btn);
}

.actu .actu-btn.btn-primary:is(:hover, :focus-visible, :active) {
    border-color: var(--jm-green-dark);
    background-color: var(--jm-green-dark);
}

/* Le site force article a { color: orange !important } */
.actu a.actu-btn.btn-primary {
    color: #fff !important;
    text-decoration: none !important;
}

.actu-more__btn.btn {
    border: 1px solid var(--jm-green-dark);
    background: #fff;
    color: var(--jm-green-dark);
}

.actu-more__btn.btn:is(:hover, :focus-visible) {
    border-color: var(--jm-green-dark);
    background: var(--jm-green-dark);
    color: #fff;
}

.actu-more__spinner {
    display: none;
    width: 1em;
    height: 1em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: actu-spin .7s linear infinite;
}

.actu-more__btn.htmx-request {
    opacity: .75;
    pointer-events: none;
}

.actu-more__btn.htmx-request .actu-more__spinner {
    display: inline-block;
}

@keyframes actu-spin {
    to {
        transform: rotate(360deg);
    }
}

.actu-band {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 2rem;
    margin-top: clamp(2.5rem, 5vw, 4rem);
    padding: 1.5rem clamp(1.5rem, 3vw, 2.5rem);
    border-radius: var(--jm-radius-lg);
    background: var(--jm-tint);
}

.actu-band__title {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
}

.actu-band__text {
    margin: 0;
    color: var(--jm-ink-soft);
}

/* Lecteur d'article */
.actu--article {
    padding-bottom: 0;
}

.actu-progress {
    position: fixed;
    inset: 0 0 auto;
    z-index: 2000;
    height: 4px;
    pointer-events: none;
}

.actu-progress span {
    display: block;
    height: 100%;
    /* Les trois couleurs de la marque, sur toute la largeur de la barre */
    background: linear-gradient(90deg, var(--jm-green) 0 40%, var(--jm-yellow) 40% 60%, var(--jm-red) 60% 100%);
    transform: scaleX(0);
    transform-origin: left;
}

.actu-article__head,
.actu-prose,
.actu-engage {
    max-width: 720px;
    margin-inline: auto;
}

.actu a.actu-back {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-height: 40px;
    margin-bottom: 1rem;
    color: var(--jm-ink-soft) !important;
    font-size: .9375rem;
    text-decoration: none !important;
}

.actu a.actu-back:is(:hover, :focus) {
    color: var(--jm-green-dark) !important;
    text-decoration: none !important;
}

.actu-article__title {
    margin: 0 0 1rem;
    color: var(--jm-ink);
    font-size: clamp(1.75rem, 4.2vw, 2.75rem);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -.015em;
    overflow-wrap: anywhere;
}

.actu-article__lead {
    margin: 0 0 1.25rem;
    color: var(--jm-ink-soft);
    font-size: clamp(1.125rem, 2vw, 1.3125rem);
    line-height: 1.5;
}

.actu-article__head .actu-meta {
    padding-top: 1rem;
    border-top: 1px solid var(--jm-line);
    font-size: .875rem;
}

/* Le visuel n'est jamais recadré : beaucoup contiennent du texte */
.actu-article__visual {
    display: flex;
    justify-content: center;
    max-width: 960px;
    margin: clamp(1.5rem, 4vw, 2.5rem) auto;
    overflow: hidden;
    border-radius: var(--jm-radius-lg);
    background: var(--jm-tint);
}

.actu-article__visual img {
    display: block;
    max-width: 100%;
    max-height: 560px;
    object-fit: contain;
}

/* Contenu saisi dans le back office */
.actu-prose {
    color: var(--jm-ink);
    font-size: 1.125rem;
    line-height: 1.75;
    overflow-wrap: break-word;
}

/* Harmonise les tailles et polices collées depuis d'autres sources */
.actu-prose :is(p, li, span, font, div, td) {
    font-family: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
}

.actu-prose > :first-child {
    margin-top: 0;
}

.actu-prose p {
    margin-bottom: 1.25em;
}

.actu-prose :is(h2, h3, h4) {
    margin: 2em 0 .6em;
    color: var(--jm-ink);
    font-weight: 700;
    line-height: 1.25;
}

.actu-prose h2 {
    font-size: 1.625rem;
}

.actu-prose h3 {
    font-size: 1.3125rem;
}

.actu .actu-prose a,
.actu .actu-prose a:is(:hover, :focus) {
    color: var(--jm-green-dark) !important;
    text-decoration: underline !important;
    text-underline-offset: .18em;
}

.actu-prose img {
    max-width: 100%;
    height: auto !important;
    border-radius: 10px;
}

.actu-prose iframe {
    display: block;
    width: 100% !important;
    max-width: 100%;
    margin-block: 1.5em;
    border: 0;
    border-radius: 10px;
}

.actu-prose iframe:is([src*="youtube"], [src*="vimeo"], [src*="dailymotion"]) {
    height: auto !important;
    aspect-ratio: 16 / 9;
}

.actu-prose table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
}

.actu-prose blockquote {
    margin: 1.5em 0;
    padding-left: 1.25em;
    border-left: 3px solid var(--jm-green);
    color: var(--jm-ink-soft);
}

.actu-engage {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 2.5rem;
}

.actu-engage__block {
    padding: 1.25rem 1.5rem;
    border-radius: var(--jm-radius-lg);
    background: var(--jm-tint);
}

.actu-engage__title {
    margin: 0;
    font-weight: 700;
}

.actu-engage__text {
    margin: 0;
    color: var(--jm-ink-soft);
    font-size: .875rem;
}

.actu-engage__like {
    margin-top: .875rem;
    font-size: .9375rem;
}

.actu-engage__like .btn {
    margin-inline: 0 !important;
}

.actu-share {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-top: .875rem;
}

.actu-share .social-buttons {
    display: flex !important;
    flex-wrap: wrap;
    gap: .5rem;
}

.actu-share .social-buttons a,
.actu-share__copy {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--jm-line);
    border-radius: 50%;
    background: #fff !important;
    color: var(--jm-ink) !important;
    font-size: 1.0625rem;
    text-decoration: none !important;
    transition: background-color .15s, border-color .15s, color .15s;
}

.actu-share .social-buttons a:is(:hover, :focus-visible),
.actu-share__copy:is(:hover, :focus-visible) {
    border-color: var(--jm-green-dark);
    background: var(--jm-green-dark) !important;
    color: #fff !important;
}

.actu-share__status {
    margin: .5rem 0 0;
    color: var(--jm-green-dark);
    font-size: .875rem;
}

.actu-share__status:empty {
    display: none;
}

.actu-related {
    margin-top: clamp(3rem, 6vw, 4.5rem);
    padding-block: clamp(2.5rem, 5vw, 4rem);
    border-top: 1px solid var(--jm-line);
}

.actu-related__title {
    margin: 0 0 1.5rem;
    font-size: clamp(1.5rem, 3vw, 1.875rem);
    font-weight: 700;
    letter-spacing: -.01em;
}

/* Responsive
   ------------------------------------------------------------------ */
@media (min-width: 992px) and (min-height: 780px) {
    .jm-example__media,
    .tmg-rules__aside {
        position: sticky;
        top: 150px;
    }
}

@media (min-width: 576px) {
    .actu-card--row {
        flex-direction: row;
    }

    .actu-card--row .actu-card__media {
        flex: 0 0 42%;
        aspect-ratio: auto;
    }

    .actu-card--row .actu-card__body {
        min-width: 0;
        padding: 1rem 1.125rem;
    }

    .actu-card--row .actu-card__lead {
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }
}

@media (max-width: 1199.98px) {
    .jm-benefits,
    .ptn-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .res-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .jm-pillars-wrap,
    .jm-quotes,
    .jm-pillars--3 {
        grid-template-columns: minmax(0, 1fr);
    }

    .jm .jm-gauge {
        max-width: min(100%, 420px);
    }
}

@media (max-width: 991.98px) {
    .jm-hero__grid,
    .jm-intro,
    .jm-example,
    .jm-cta,
    .jm-split,
    .jm-question,
    .jm-question--reverse,
    .tmg-rules,
    .actu-front {
        grid-template-columns: minmax(0, 1fr);
    }

    .jm-split--reverse > img,
    .jm-question--reverse img {
        order: 0;
    }

    .jm .jm-question img {
        height: 220px;
        min-height: 0;
    }

    /* Photo verticale : on en montre une bande pour ne pas repousser les étapes */
    .jm .jm-example__media img {
        height: 260px;
        object-fit: cover;
        object-position: center 55%;
    }

    .tmg-grid,
    .res-grid,
    .actu-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .actu-front__side {
        grid-template-rows: none;
    }
}

@media (max-width: 767.98px) {
    .jm {
        font-size: 1rem;
    }

    .jm .jm-question img {
        height: 170px;
    }

    .jm-pillars,
    .jm-benefits,
    .jm-audiences,
    .tmg-grid,
    .ptn-grid,
    .actu-engage {
        grid-template-columns: minmax(0, 1fr);
    }

    .jm .jm-audience img {
        aspect-ratio: 16 / 7;
    }

    .jm-actions .btn,
    .jm .jm-invite .btn {
        width: 100%;
    }

    .jm-step {
        padding-left: 3rem;
    }

    .jm-search {
        max-width: none;
    }

    /* 48 cartes en pile : logo à côté du texte pour raccourcir la page */
    .ptn-grid {
        gap: .75rem;
    }

    .ptn-card {
        flex-direction: row;
    }

    .ptn-card__logo {
        flex: none;
        align-self: stretch;
        width: 92px;
        height: auto;
        padding: .625rem;
        border-right: 1px solid var(--jm-line);
        border-bottom: 0;
    }

    .jm .ptn-card__logo img {
        max-height: 72px;
    }

    .ptn-card__name {
        font-size: .6875rem;
    }

    .ptn-card__flag {
        display: none;
    }

    .ptn-card__body {
        min-width: 0;
        padding: .875rem 1rem;
        font-size: .875rem;
    }

    .jm .ptn-card h3 {
        font-size: 1rem;
    }

    .jm .ptn-card__type {
        margin-bottom: .5rem;
        font-size: .8125rem;
    }

    .ptn-card__infos {
        margin-bottom: .625rem;
    }

    .ptn-card__infos li {
        margin-bottom: .25rem;
    }

    .jm .ptn-card__site {
        align-self: flex-start;
        margin-top: 0;
        padding: .3rem .875rem;
        font-size: .875rem;
    }
}

@media (max-width: 575.98px) {
    .res-grid,
    .actu-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    /* Vignette à côté du texte pour raccourcir la page */
    .res-grid {
        gap: .75rem;
    }

    .jm a.res-card {
        flex-direction: row;
    }

    .res-card__media {
        flex: none;
        width: 112px;
        aspect-ratio: auto;
    }

    .jm .res-card__media--file img {
        padding: .75rem;
    }

    .res-badge {
        top: .375rem;
        left: .375rem;
        padding: .1rem .45rem;
        font-size: .6875rem;
    }

    .res-card__body {
        min-width: 0;
        padding: .75rem;
    }

    .res-card__title {
        font-size: .9375rem;
    }

    .res-card__text {
        font-size: .8125rem;
    }

    /* Les mots-clés défilent sur une ligne au lieu d'occuper l'écran */
    .actu-head .actu-chips {
        flex-wrap: nowrap;
        margin-inline: -12px;
        padding-inline: 12px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .actu-head .actu-chip {
        flex: none;
    }

    .actu-band .actu-btn {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .actu-card,
    .actu-card__media img {
        transition: none;
    }

    .actu-card:hover,
    .actu-card:hover .actu-card__media img {
        transform: none;
    }
}