/* ── Groupe : couleurs de fond ─────────────────────────────────────────── */

.wp-block-group:is(
    .is-style-jm-bleu,
    .is-style-jm-nuit,
    .is-style-jm-violet,
    .is-style-jm-cyan,
    .is-style-jm-mint,
    .is-style-jm-sand,
    .is-style-jm-rose,
    .is-style-jm-gris,
    .is-style-jm-blanc
) {
    margin-top: var(--jm-block-margin-y, clamp(24px, 4vw, 48px)) !important;
    margin-bottom: var(--jm-block-margin-y, clamp(24px, 4vw, 48px)) !important;
}

.wp-block-group:is(
    .is-style-jm-bleu,
    .is-style-jm-nuit,
    .is-style-jm-violet,
    .is-style-jm-cyan,
    .is-style-jm-mint,
    .is-style-jm-sand,
    .is-style-jm-rose,
    .is-style-jm-gris,
    .is-style-jm-blanc
) + .wp-block-group:is(
    .is-style-jm-bleu,
    .is-style-jm-nuit,
    .is-style-jm-violet,
    .is-style-jm-cyan,
    .is-style-jm-mint,
    .is-style-jm-sand,
    .is-style-jm-rose,
    .is-style-jm-gris,
    .is-style-jm-blanc
) {
    margin-top: 0 !important;
}


.wp-block-group.is-style-jm-bleu {
    background-color: var(--jm-blue, #08598E) !important;
    color: var(--jm-surface, #ffffff) !important;
}
.wp-block-group.is-style-jm-bleu h1, .wp-block-group.is-style-jm-bleu h2, .wp-block-group.is-style-jm-bleu h3,
.wp-block-group.is-style-jm-bleu h4, .wp-block-group.is-style-jm-bleu h5, .wp-block-group.is-style-jm-bleu h6,
.wp-block-group.is-style-jm-bleu p, .wp-block-group.is-style-jm-bleu a, .wp-block-group.is-style-jm-bleu li {
    color: var(--jm-surface, #ffffff);
}

.wp-block-group.is-style-jm-nuit {
    background-color: var(--jm-night, #10294f) !important;
    color: var(--jm-surface, #ffffff) !important;
}
.wp-block-group.is-style-jm-nuit h1, .wp-block-group.is-style-jm-nuit h2, .wp-block-group.is-style-jm-nuit h3,
.wp-block-group.is-style-jm-nuit h4, .wp-block-group.is-style-jm-nuit h5, .wp-block-group.is-style-jm-nuit h6,
.wp-block-group.is-style-jm-nuit p, .wp-block-group.is-style-jm-nuit a, .wp-block-group.is-style-jm-nuit li {
    color: var(--jm-surface, #ffffff);
}

.wp-block-group.is-style-jm-violet {
    background-color: var(--jm-violet, #7358b3) !important;
    color: var(--jm-surface, #ffffff) !important;
}
.wp-block-group.is-style-jm-violet h1, .wp-block-group.is-style-jm-violet h2, .wp-block-group.is-style-jm-violet h3,
.wp-block-group.is-style-jm-violet h4, .wp-block-group.is-style-jm-violet h5, .wp-block-group.is-style-jm-violet h6,
.wp-block-group.is-style-jm-violet p, .wp-block-group.is-style-jm-violet a, .wp-block-group.is-style-jm-violet li {
    color: var(--jm-surface, #ffffff);
}

.wp-block-group.is-style-jm-cyan {
    background-color: var(--jm-cyan, #dff4ff) !important;
    color: var(--jm-ink, #0e1c2f) !important;
}

.wp-block-group.is-style-jm-mint {
    background-color: var(--jm-mint, #e6f7ef) !important;
    color: var(--jm-ink, #0e1c2f) !important;
}

.wp-block-group.is-style-jm-sand {
    background-color: var(--jm-sand, #f8f0de) !important;
    color: var(--jm-ink, #0e1c2f) !important;
}

.wp-block-group.is-style-jm-rose {
    background-color: var(--jm-rose, #f8e4ea) !important;
    color: var(--jm-ink, #0e1c2f) !important;
}

.wp-block-group.is-style-jm-gris {
    background-color: var(--jm-bg, #f3f4f8) !important;
    color: var(--jm-ink, #0e1c2f) !important;
}

.wp-block-group.is-style-jm-blanc {
    background-color: var(--jm-surface, #ffffff) !important;
    background-image: none !important;
    color: #000000 !important;
}
.wp-block-group.is-style-jm-blanc h1, .wp-block-group.is-style-jm-blanc h2, .wp-block-group.is-style-jm-blanc h3,
.wp-block-group.is-style-jm-blanc h4, .wp-block-group.is-style-jm-blanc h5, .wp-block-group.is-style-jm-blanc h6,
.wp-block-group.is-style-jm-blanc p, .wp-block-group.is-style-jm-blanc li, .wp-block-group.is-style-jm-blanc a {
    color: #000000;
}
.wp-block-group.is-style-jm-blanc .wp-block-button__link,
.wp-block-button.is-style-jm-blanc .wp-block-button__link {
    background: var(--jm-blue, #08598E) !important;
    color: var(--jm-surface, #ffffff) !important;
    border-width: 2px;
    border-style: solid;
    border-color: var(--jm-blue, #08598E);
}
.wp-block-group.is-style-jm-blanc .wp-block-button__link:hover,
.wp-block-button.is-style-jm-blanc .wp-block-button__link:hover {
    background: var(--jm-night, #10294f) !important;
    border-color: var(--jm-night, #10294f) !important;
}


/* ── Groupe : largeurs (dans un parent flex — classe jm-flex) ──────────── */

/* Usage : donner la classe jm-flex au groupe parent, puis choisir
   le style ½ / ⅓ / ¼ sur chaque groupe enfant. */

.jm-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: stretch;
}

.is-style-jm-demi {
    flex: 1 1 calc(50% - 12px);
    min-width: 280px;
}

.is-style-jm-tiers {
    flex: 1 1 calc(33.333% - 16px);
    min-width: 220px;
}

.is-style-jm-quart {
    flex: 1 1 calc(25% - 18px);
    min-width: 180px;
}


/* ── Bouton : variantes couleur ────────────────────────────────────────── */

.wp-block-button.is-style-jm-nuit .wp-block-button__link {
    background: var(--jm-night, #10294f) !important;
    color: var(--jm-surface, #ffffff) !important;
    border-width: 2px;
    border-style: solid;
    border-color: var(--jm-night, #10294f);
}
.wp-block-button.is-style-jm-nuit .wp-block-button__link:hover {
    background: var(--jm-blue, #08598E) !important;
    border-color: var(--jm-blue, #08598E) !important;
}

.wp-block-button.is-style-jm-ghost .wp-block-button__link {
    background: transparent !important;
    color: var(--jm-blue, #08598E) !important;
    border-width: 2px;
    border-style: solid;
    border-color: var(--jm-blue, #08598E);
    box-shadow: none !important;
}
.wp-block-button.is-style-jm-ghost .wp-block-button__link:hover {
    background: var(--jm-blue, #08598E) !important;
    color: var(--jm-surface, #ffffff) !important;
}

.wp-block-button.is-style-jm-violet .wp-block-button__link {
    background: var(--jm-violet, #7358b3) !important;
    color: var(--jm-surface, #ffffff) !important;
    border-width: 2px;
    border-style: solid;
    border-color: var(--jm-violet, #7358b3);
}
.wp-block-button.is-style-jm-violet .wp-block-button__link:hover {
    background: var(--jm-night, #10294f) !important;
    border-color: var(--jm-night, #10294f) !important;
}


/* ── Titre : variantes couleur ─────────────────────────────────────────── */


.wp-block-heading.is-style-jm-bleu  { color: var(--jm-blue,  #08598E) !important; }
.wp-block-heading.is-style-jm-nuit  { color: var(--jm-night, #10294f) !important; }
.wp-block-heading.is-style-jm-violet { color: var(--jm-violet, #7358b3) !important; }
.wp-block-heading.is-style-jm-muted { color: var(--jm-muted, #5c6678) !important; }
