/* Subscription journey only; retain the site's tokens, logo and native controls. */
.mv-subscription-page .mv-header { position: relative; top: auto; }
.mv-subscription-page .mv-header .mv-search,
.mv-subscription-page .mv-header__tagline,
.mv-subscription-page .mv-silobar,
.mv-subscription-page .mv-header__actions > :not(.mv-action--toggle),
.mv-subscription-page .mv-newsletter { display: none; }
.mv-subscription-page .mv-header__row { justify-content: space-between; min-height: var(--mv-space-8); }
.mv-subscription-page .mv-header__actions { margin-inline-start: auto; }
.mv-sub [hidden] { display: none !important; }
.mv-sub-main { max-width: 1120px; padding-block: var(--mv-space-5) var(--mv-space-7); }
.mv-sub :is(h1,h2,h3,p,dl) { margin: 0; }
.mv-sub :is(h1,h2,h3) { color: var(--mv-text); font-family: var(--mv-font-heading); }
.mv-sub h1 { font-size: clamp(1.65rem, 3vw, 2.25rem); line-height: 1.15; letter-spacing: -.025em; }
.mv-sub h2 { font-size: 1.35rem; line-height: 1.25; }
.mv-sub h3 { font-size: 1.125rem; line-height: 1.3; }
.mv-sub a:not(.mv-btn) { color: var(--mv-text); text-underline-offset: 3px; }
.mv-sub a:focus-visible, .mv-sub summary:focus-visible, .mv-sub .mv-btn:focus-visible { outline: 2px solid var(--mv-focus); outline-offset: var(--mv-focus-offset); }
.mv-sub-back { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--mv-space-2); margin-bottom: var(--mv-space-3); }
.mv-sub-back a { display: inline-flex; align-items: center; min-height: 44px; }
.mv-sub-back span { display: inline-flex; align-items: center; gap: var(--mv-space-1); }
.mv-sub-back span, .mv-sub-small, .mv-sub-renewal { color: var(--mv-text-muted); font-size: .875rem; line-height: 1.5; }
.mv-sub-intro { display: flex; align-items: center; gap: var(--mv-space-4); margin-bottom: var(--mv-space-5); }
.mv-sub-intro p { margin-top: var(--mv-space-2); color: var(--mv-text-muted); line-height: 1.5; }
.mv-sub-intro-art { width: var(--mv-space-8); height: var(--mv-space-8); object-fit: contain; flex-shrink: 0; }
.mv-sub-grid { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: var(--mv-space-5); align-items: start; }
.mv-sub-summary, .mv-sub-panel { min-width: 0; padding: var(--mv-space-5); border: 1px solid var(--mv-border); border-radius: var(--mv-radius-md); background: var(--mv-surface); }
.mv-sub-summary { display: grid; gap: var(--mv-space-3); }
.mv-sub-offer-heading { display: grid; grid-template-columns: var(--mv-space-8) minmax(0,1fr) auto; align-items: center; gap: var(--mv-space-3); }
.mv-sub-art { display: block; width: var(--mv-space-8); height: var(--mv-space-8); object-fit: contain; }
.mv-sub-eyebrow { color: var(--mv-text-muted); font-size: .875rem; line-height: 1.4; }
.mv-sub-offer-heading h2 { margin-top: var(--mv-space-1); }
.mv-sub-edit { display: inline-flex; align-items: center; min-height: 44px; font-size: .875rem; text-decoration: underline; }
.mv-sub-price { font-size: 1.75rem; font-weight: 750; line-height: 1.2; font-variant-numeric: tabular-nums; }
.mv-sub-price span { font-size: 1rem; font-weight: 400; color: var(--mv-text-muted); }
.mv-sub-benefits { border-top: 1px solid var(--mv-border); }
.mv-sub-benefits summary { display: list-item; padding-block: var(--mv-space-3); min-height: 44px; font-size: .875rem; font-weight: 700; cursor: pointer; }
.mv-sub-benefits > div { display: grid; gap: var(--mv-space-3); padding-bottom: var(--mv-space-1); }
.mv-sub-benefits ul { margin: 0; padding-inline-start: var(--mv-space-5); font-size: .875rem; line-height: 1.5; }
.mv-sub-benefits li + li { margin-top: var(--mv-space-2); }
.mv-sub-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--mv-space-3); margin-bottom: var(--mv-space-5); }
.mv-sub-panel > p + p { margin-top: var(--mv-space-3); }
.mv-sub-actions { display: flex; flex-wrap: wrap; gap: var(--mv-space-3); margin-block: var(--mv-space-5); }
.mv-sub-button { max-width: 100%; }
/* Blocksy also styles buttons, so these rules retain the native MaVitamine tokens. */
.mv-sub .mv-btn { min-height: 48px; padding: var(--mv-space-3) var(--mv-space-4); border-radius: var(--mv-radius-sm); font: inherit; font-weight: 700; line-height: 1.4; white-space: normal; }
.mv-sub .mv-btn--primary { background: var(--mv-silo-fill); color: var(--mv-silo-contrast); }
.mv-sub .mv-btn--primary:hover { background: color-mix(in srgb, var(--mv-silo-fill) 90%, black); color: var(--mv-silo-contrast); }
.mv-sub .mv-btn--outline { background: transparent; color: var(--mv-text); border: 1px solid var(--mv-border-strong); }
.mv-sub .mv-btn--outline:hover { background: var(--mv-interactive-hover); border-color: var(--mv-silo); color: var(--mv-silo-text); }
.mv-sub-notice { padding: var(--mv-space-4); margin-bottom: var(--mv-space-4); background: var(--mv-bg-soft); border-left: 3px solid var(--mv-danger); overflow-wrap: anywhere; }
.mv-sub-notice button { margin-top: var(--mv-space-3); }
.mv-sub label { display: block; margin-bottom: var(--mv-space-2); font-weight: 650; }
.mv-sub form > button { width: 100%; margin-top: var(--mv-space-4); }
.mv-sub-total { display: flex; justify-content: space-between; gap: var(--mv-space-4); margin-top: var(--mv-space-5) !important; padding-top: var(--mv-space-4); border-top: 1px solid var(--mv-border); }
#mv-pay-help { margin-top: var(--mv-space-2); text-align: center; }
.mv-sub-footer-note { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--mv-space-2); border-top: 1px solid var(--mv-border); padding-top: var(--mv-space-3); margin-top: var(--mv-space-5); font-size: .875rem; color: var(--mv-text-muted); }
.mv-sub-footer-note a { display: inline-flex; align-items: center; min-height: 44px; }
.mv-sub:not(.mv-sub--paiement) .mv-sub-grid { grid-template-columns: minmax(0,1.65fr) minmax(0,1fr); }
.mv-sub-guidance { padding: var(--mv-space-5); display: grid; gap: var(--mv-space-3); color: var(--mv-text-muted); font-size: .9375rem; line-height: 1.6; }
.mv-sub-guidance h2 { font-size: 1.125rem; }
.mv-sub-guidance a { min-height: 44px; display: inline-flex; align-items: center; text-decoration: underline; }
#mv-state { display: grid; gap: var(--mv-space-4); }
#mv-state:empty { display: none; }
#mv-state .mv-btn { justify-self: start; }
#mv-loading { color: var(--mv-text-muted); padding-block: var(--mv-space-4); }
.mv-sub dl > div { display: flex; justify-content: space-between; align-items: start; gap: var(--mv-space-4); border-bottom: 1px solid var(--mv-border); padding-block: var(--mv-space-3); }
.mv-sub dt { color: var(--mv-text-muted); }
.mv-sub dd { margin: 0; text-align: right; font-weight: 700; max-width: 65%; overflow-wrap: anywhere; }
@media (max-width: 760px) {
 .mv-sub-main { padding-block: var(--mv-space-3) var(--mv-space-6); }
 .mv-sub-back { margin-bottom: var(--mv-space-2); font-size: .875rem; }
 .mv-sub-back span { font-size: .875rem; }
 .mv-sub-intro { gap: var(--mv-space-3); margin-bottom: var(--mv-space-4); }
 .mv-sub-intro p { font-size: .9375rem; }
 .mv-sub-intro-art { width: var(--mv-space-7); height: var(--mv-space-7); }
 .mv-sub-grid, .mv-sub:not(.mv-sub--paiement) .mv-sub-grid { grid-template-columns: 1fr; gap: var(--mv-space-4); }
 .mv-sub-summary, .mv-sub-panel { padding: var(--mv-space-4); }
 .mv-sub-summary { gap: var(--mv-space-2); }
 .mv-sub-offer-heading { grid-template-columns: var(--mv-space-7) minmax(0,1fr) auto; }
 .mv-sub-art { width: var(--mv-space-7); height: var(--mv-space-7); }
 .mv-sub-price { font-size: 1.5rem; }
 .mv-sub-panel-heading { margin-bottom: var(--mv-space-4); }
 .mv-sub-panel-heading h2 { font-size: 1.2rem; }
 .mv-sub-guidance { padding: var(--mv-space-4); }
 .mv-sub-actions { flex-direction: column; }
}

/* Keep consent controls available in the footer without covering payment fields. */
.mv-subscription-page #consentpilot-floating-btn { position: static !important; margin: var(--mv-space-4); width: auto; min-width: 44px; min-height: 44px; padding: var(--mv-space-3) var(--mv-space-4); border-radius: var(--mv-radius-sm); display: inline-flex; gap: var(--mv-space-2); align-items: center; }
.mv-subscription-page #consentpilot-floating-btn::after { content: "Gérer mes cookies"; font-family: var(--mv-font-body); font-size: .875rem; }
