/* ================================================================
   myCover'Up — Header & Footer custom
   Reproduit le design React sur les pages WordPress/WooCommerce.
   ================================================================ */

/* ── Variables ─────────────────────────────────────────────────── */

:root {
  --mcu-titre: #0A355A;
  --mcu-principale: #5CB1E2;
  --mcu-accent: #F5B700;
  --mcu-texte: #45505F;
  --mcu-fond-1: #F9FBFD;
  --mcu-fond-bleu: #DCEAF2;
  --mcu-fond-2: #FFF8E5;
  --mcu-fond-2-border: #e8dcc5;
}

/* ================================================================
   HEADER
   ================================================================ */

.mcu-header {
  width: 100%;
  position: sticky;
  top: 0;
  z-index: 1000;
}

/* ── Top bar (bandeau promo) ───────────────────────────────────── */

.mcu-topbar {
  background-color: var(--mcu-titre);
  color: #fff;
}

.mcu-topbar__inner {
  width: 100%;
  padding: 10px 46px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.mcu-topbar__promo {
  flex: 1;
  text-align: center;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
}

.mcu-topbar__phone {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 16px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
  transition: opacity 0.2s;
}

.mcu-topbar__phone:hover,
.mcu-topbar__link:hover {
  opacity: 0.8;
  color: #fff;
}

.mcu-topbar__link {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 16px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}

.mcu-topbar__sep {
  color: rgba(255, 255, 255, 0.4);
}

/* ── Navbar ─────────────────────────────────────────────────────── */

.mcu-navbar {
  background-color: #fff;
  border-bottom: 1px solid #f3f4f6;
}

.mcu-navbar__inner {
  width: 100%;
  padding: 0 35px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  height: 96px;
}

.mcu-navbar__nav {
  display: flex;
  align-items: center;
  gap: 28px;
}

.mcu-navbar__link {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: var(--mcu-titre);
  text-decoration: none;
  transition: color 0.2s;
}

.mcu-navbar__link:hover {
  color: var(--mcu-principale);
}

.mcu-navbar__logo-link {
  display: flex;
  justify-content: center;
  padding: 0 16px;
}

.mcu-navbar .mcu-navbar__logo,
img.mcu-navbar__logo {
  height: 44px !important;
  width: auto !important;
  max-width: none !important;
}

.mcu-navbar__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
}

.mcu-navbar__icon {
  position: relative;
  color: var(--mcu-titre);
  transition: color 0.2s;
  display: inline-flex;
}

.mcu-navbar__icon:hover {
  color: var(--mcu-principale);
}

.mcu-cart-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  background-color: var(--mcu-accent);
  color: var(--mcu-titre);
  font-family: 'Space Grotesk', sans-serif;
  font-size: 10px;
  font-weight: 700;
  border-radius: 9999px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* ── CTAs (Support + Créer mon cache) ──────────────────────────── */

.mcu-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  text-decoration: none;
  border-radius: 9999px;
  transition: filter 0.2s, transform 0.05s;
  white-space: nowrap;
}

.mcu-cta:hover {
  filter: brightness(0.95);
}

.mcu-cta:active {
  transform: translateY(1px);
}

.mcu-cta--sm {
  padding: 10px 20px;
  font-size: 14px;
}

.mcu-navbar .mcu-cta--primary,
a.mcu-cta--primary {
  background-color: #DCEAF2 !important;
  color: #0A355A !important;
}

.mcu-navbar .mcu-cta--accent,
a.mcu-cta--accent {
  background-color: #F5B700 !important;
  color: #0A355A !important;
}

/* ================================================================
   FOOTER
   ================================================================ */

.mcu-footer {
  margin-top: auto;
}

/* ── Subfooter (5 colonnes de liens, fond blanc — aligné React) ── */

.mcu-subfooter {
  background-color: #fff;
  color: var(--mcu-titre);
  padding: 56px 0;
}

.mcu-subfooter__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 32px;
}

.mcu-subfooter__title {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--mcu-titre);
  margin: 0 0 16px;
}

.mcu-subfooter__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mcu-subfooter__link {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 14px;
  color: rgba(10, 53, 90, 0.8);
  text-decoration: none;
  transition: color 0.2s;
}

.mcu-subfooter__link:hover {
  color: var(--mcu-principale);
}

/* ── Bandeau de reassurance ────────────────────────────────────── */

.mcu-reassurance {
  background-color: var(--mcu-titre);
  color: #fff;
  padding: 40px 0;
}

.mcu-reassurance__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  text-align: center;
}

.mcu-reassurance__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.mcu-reassurance__icon {
  width: 56px;
  height: 56px;
  object-fit: contain;
}

.mcu-reassurance__label {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}

/* ── Bas de page ───────────────────────────────────────────────── */

.mcu-bottombar {
  background-color: #fff;
  border-top: 1px solid rgba(10, 53, 90, 0.1);
  padding: 24px 0;
}

.mcu-bottombar__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.mcu-bottombar__logo-link {
  flex-shrink: 0;
}

/* Sélecteur volontairement spécifique (.logo-link .logo) pour battre la règle
   WooCommerce `.woocommerce-page img { height:auto }` (spécificité 0,1,1) qui,
   sur les pages Woo (espace client, panier, checkout), affichait le logo en
   taille native 538×112 au lieu de 40px. */
.mcu-bottombar__logo-link .mcu-bottombar__logo {
  height: 40px;
  width: auto;
}

.mcu-bottombar__center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.mcu-bottombar__social {
  display: flex;
  align-items: center;
  gap: 16px;
}

.mcu-bottombar__social-link {
  color: var(--mcu-titre);
  display: inline-flex;
  transition: color 0.2s;
}

.mcu-bottombar__social-link:hover {
  color: var(--mcu-principale);
}

.mcu-bottombar__copy {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 14px;
  color: var(--mcu-titre);
  text-align: center;
  margin: 0;
}

.mcu-bottombar__credit {
  font-weight: 700;
  color: var(--mcu-titre);
  text-decoration: none;
  transition: color 0.2s;
}

.mcu-bottombar__credit:hover {
  color: var(--mcu-principale);
}

.mcu-bottombar__payment {
  flex-shrink: 0;
}

.mcu-bottombar__payment-img {
  height: 25px;
  width: auto;
  image-rendering: auto;
}

/* ================================================================
   WOOCOMMERCE — pages My Account, panier, checkout, mot de passe
   ================================================================ */

/* Container global des pages WC : s'aligner sur le contenu React */
.woocommerce,
.woocommerce-page {
  font-family: 'Space Grotesk', sans-serif;
  color: var(--mcu-texte);
}

.woocommerce-account,
.woocommerce-cart,
.woocommerce-checkout {
  background-color: var(--mcu-fond-1);
}

/* Hero / titres de page */
.woocommerce h1,
.woocommerce h2,
.entry-title,
.woocommerce-account-fields legend,
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3 {
  font-family: 'Space Grotesk', sans-serif;
  color: var(--mcu-titre);
  font-weight: 700;
}

.woocommerce h1.entry-title,
.entry-header .entry-title {
  font-family: 'Rammetto One', serif;
  font-size: 36px;
  text-align: center;
  color: var(--mcu-principale);
  padding: 56px 20px 40px;
  margin: 0;
}

/* ── Formulaires : labels, inputs, selects ────────────────────── */

.woocommerce form .form-row label,
.woocommerce-form__label {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--mcu-titre);
  margin-bottom: 6px;
  display: block;
}

.woocommerce form .form-row .required {
  color: var(--mcu-accent);
  text-decoration: none;
}

/* Inputs — strictement alignés sur le React (ContactForm.jsx)
   border #e5e7eb, radius 8px, padding py-3 px-4, focus principale + ring */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-Input--text,
.elementor-widget-woocommerce-checkout-page input.input-text,
.elementor-widget-woocommerce-checkout-page textarea,
.elementor-widget-woocommerce-checkout-page select,
.e-checkout__container input.input-text,
.e-checkout__container textarea,
.e-checkout__container select,
.select2-container--default .select2-selection--single {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 15px !important;
  color: var(--mcu-titre) !important;
  background-color: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  width: 100% !important;
  height: auto !important;
  line-height: 1.4 !important;
  box-shadow: none !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}

.woocommerce form .form-row input.input-text::placeholder,
.woocommerce form .form-row textarea::placeholder,
.elementor-widget-woocommerce-checkout-page input.input-text::placeholder,
.e-checkout__container input.input-text::placeholder {
  color: #9ca3af;
  opacity: 1;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.elementor-widget-woocommerce-checkout-page input.input-text:focus,
.elementor-widget-woocommerce-checkout-page textarea:focus,
.elementor-widget-woocommerce-checkout-page select:focus,
.e-checkout__container input.input-text:focus,
.e-checkout__container textarea:focus,
.e-checkout__container select:focus {
  outline: none !important;
  border-color: var(--mcu-principale) !important;
  box-shadow: 0 0 0 3px rgba(92, 177, 226, 0.2) !important;
}

/* Select2 (pays / région WC) — wrapper aligné sur input */
.select2-container--default .select2-selection--single {
  height: auto !important;
  min-height: 46px;
  display: flex;
  align-items: center;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: normal !important;
  padding-left: 0 !important;
  color: var(--mcu-titre) !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100%;
  top: 0;
}
.select2-dropdown {
  border-color: var(--mcu-principale) !important;
  border-radius: 8px !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: var(--mcu-fond-bleu) !important;
  color: var(--mcu-titre) !important;
}

/* Labels Elementor checkout (au cas où) */
.elementor-widget-woocommerce-checkout-page .form-row label,
.e-checkout__container .form-row label {
  font-family: 'Space Grotesk', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--mcu-titre) !important;
  margin-bottom: 6px !important;
  display: block !important;
}

/* Cases à cocher */
.woocommerce-form__input-checkbox {
  accent-color: var(--mcu-principale);
}

/* ── Boutons WC : reproduire .mcu-cta ──────────────────────────── */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-button,
.woocommerce-Button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  border-radius: 9999px;
  padding: 12px 24px;
  background-color: var(--mcu-fond-bleu);
  color: var(--mcu-titre);
  border: none;
  cursor: pointer;
  transition: filter 0.2s, transform 0.05s;
  text-transform: none;
  letter-spacing: 0;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce-button:hover {
  filter: brightness(0.95);
  background-color: var(--mcu-fond-bleu);
  color: var(--mcu-titre);
}

/* Boutons "alt" (CTA principaux : se connecter, passer commande, ajouter au panier) */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce-form-login__submit,
.woocommerce #place_order,
.checkout-button {
  background-color: var(--mcu-accent);
  color: var(--mcu-titre);
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce-form-login__submit:hover,
.woocommerce #place_order:hover {
  background-color: var(--mcu-accent);
  filter: brightness(0.95);
}

/* ── Cartes de section (login/register) ───────────────────────── */

/* Grille 2 colonnes : override des floats WC par défaut */
.woocommerce-account .u-columns.col2-set,
.woocommerce-account #customer_login {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto 48px;
  float: none;
}

.woocommerce-account .u-columns.col2-set::before,
.woocommerce-account .u-columns.col2-set::after {
  display: none !important;
}

@media (max-width: 767px) {
  .woocommerce-account .u-columns.col2-set,
  .woocommerce-account #customer_login {
    grid-template-columns: 1fr;
  }
}

/* Card pour CHAQUE colonne (pas le wrapper) */
.woocommerce-account .u-columns.col2-set > .col-1,
.woocommerce-account .u-columns.col2-set > .col-2,
.woocommerce-account #customer_login > .col-1,
.woocommerce-account #customer_login > .col-2 {
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  background-color: #fff;
  border: 1px solid var(--mcu-fond-bleu);
  border-radius: 16px;
  padding: 32px;
  box-shadow: 0 1px 3px rgba(10, 53, 90, 0.04);
}

.woocommerce-account #customer_login h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--mcu-principale);
  margin: 0 0 20px;
  padding-bottom: 16px;
  border-bottom: 2px solid var(--mcu-fond-bleu);
}

/* Lien "Mot de passe perdu" */
.woocommerce-LostPassword a,
.woocommerce-form__label a {
  color: var(--mcu-principale);
  text-decoration: none;
  font-weight: 600;
}

.woocommerce-LostPassword a:hover {
  text-decoration: underline;
}

/* ================================================================
   PANIER ELEMENTOR (e-cart-layout-two-column) — intégration design
   NB : ne pas toucher au layout grid d'Elementor (cassait les colonnes)
   ================================================================ */

/* Titre de page (« Mon panier », « Votre commande ») — Elementor utilise
   `animated-slow elementor-invisible` (entrance animation). Si le JS
   d'Elementor ne se déclenche pas (cache, page lente), le titre reste
   masqué. On force la visibilité sur les pages WC. */
.woocommerce-cart .elementor-widget-heading.elementor-invisible,
.woocommerce-checkout .elementor-widget-heading.elementor-invisible {
  visibility: visible !important;
  opacity: 1 !important;
  animation: none !important;
}

/* Bouton "Continuer" / proceed-to-checkout → accent jaune (CTA primaire brand) */
.woocommerce .wc-proceed-to-checkout a.checkout-button,
.woocommerce a.checkout-button.button.alt,
.elementor-widget-woocommerce-cart .wc-proceed-to-checkout a.button,
.elementor-widget-woocommerce-cart a.checkout-button {
  background-color: #F5B700 !important;
  color: #0A355A !important;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  border-radius: 9999px;
  padding: 14px 28px;
  width: 100%;
  text-align: center;
  justify-content: center;
  letter-spacing: 0;
  text-transform: none;
}

.woocommerce .wc-proceed-to-checkout a.checkout-button:hover,
.elementor-widget-woocommerce-cart a.checkout-button:hover {
  background-color: #F5B700 !important;
  filter: brightness(0.95);
}

/* Variations produit (Motif, Coloris, Dimensions…) — hiérarchie visuelle claire */
.woocommerce-cart .cart_item .product-name dl.variation,
.woocommerce-cart-form .cart_item .variation {
  margin: 8px 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 10px;
  row-gap: 4px;
  font-size: 13px;
  line-height: 1.5;
}

.woocommerce-cart .cart_item .product-name dl.variation dt,
.woocommerce-cart-form .cart_item .variation dt {
  font-weight: 700;
  color: var(--mcu-titre);
  margin: 0;
  padding: 0;
  float: none;
  clear: none;
}

.woocommerce-cart .cart_item .product-name dl.variation dt::after {
  content: ' :';
}

.woocommerce-cart .cart_item .product-name dl.variation dd,
.woocommerce-cart-form .cart_item .variation dd {
  font-weight: 400;
  color: var(--mcu-texte);
  margin: 0;
  padding: 0;
}

.woocommerce-cart .cart_item .product-name dl.variation dd p {
  margin: 0;
}

/* Nom du produit (« Cache climatiseur/PAC sur mesure ») */
.woocommerce-cart .cart_item .product-name > a {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 15px;
  color: var(--mcu-principale);
  text-decoration: none;
}

.woocommerce-cart .cart_item .product-name > a:hover {
  color: var(--mcu-titre);
}

/* Bloc "récap installation" répété en fin de cellule (fallback texte brut) → atténué */
.woocommerce-cart .cart_item .product-name > *:last-child:not(dl):not(a) {
  font-size: 11px;
  color: var(--mcu-texte);
  opacity: 0.6;
  margin-top: 10px;
  display: block;
}

/* ── Panier & checkout : tables, totaux ───────────────────────── */

.woocommerce-cart-form,
.woocommerce-checkout-review-order,
.cart_totals {
  background-color: #fff;
  border: 1px solid var(--mcu-fond-bleu);
  border-radius: 16px;
  padding: 24px;
}

.woocommerce table.shop_table {
  border-collapse: separate;
  border-spacing: 0;
  border: none;
  font-family: 'Space Grotesk', sans-serif;
}

.woocommerce table.shop_table th {
  background-color: var(--mcu-fond-1);
  color: var(--mcu-titre);
  font-weight: 700;
  border-bottom: 1px solid var(--mcu-fond-bleu);
  padding: 14px 16px;
}

.woocommerce table.shop_table td {
  border-bottom: 1px solid var(--mcu-fond-bleu);
  padding: 14px 16px;
  color: var(--mcu-texte);
}

.woocommerce .quantity .qty {
  border: 1px solid #d6dee8;
  border-radius: 8px;
  padding: 8px 10px;
  width: 80px;
  text-align: center;
  font-family: 'Space Grotesk', sans-serif;
}

/* Notices (info, succes, erreur) */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews {
  font-family: 'Space Grotesk', sans-serif;
  border-radius: 12px;
  padding: 14px 18px;
  border-left-width: 4px;
}

.woocommerce-message {
  background-color: #ecf7ee;
  border-left-color: #3a9d4e;
  color: #1e5e2f;
}

.woocommerce-info {
  background-color: #eaf4fb;
  border-left-color: var(--mcu-principale);
  color: var(--mcu-titre);
}

.woocommerce-error {
  background-color: #fdecec;
  border-left-color: #d23737;
  color: #6c1717;
}

/* My Account : sidebar de navigation */
.woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  background-color: #fff;
  border: 1px solid var(--mcu-fond-bleu);
  border-radius: 16px;
  overflow: hidden;
}

.woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 14px 18px;
  color: var(--mcu-texte);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid var(--mcu-fond-bleu);
  transition: background-color 0.15s, color 0.15s;
}

.woocommerce-MyAccount-navigation li:last-child a {
  border-bottom: none;
}

.woocommerce-MyAccount-navigation li a:hover,
.woocommerce-MyAccount-navigation li.is-active a {
  background-color: var(--mcu-fond-bleu);
  color: var(--mcu-titre);
}

/* Page entry-title custom (h1 par défaut "Espace Client") */
.page-template-default .entry-title,
.woocommerce-account .entry-title {
  font-family: 'Rammetto One', serif;
  font-size: 36px;
  text-align: center;
  color: var(--mcu-principale);
  padding: 56px 20px 40px;
  margin: 0;
}

/* ================================================================
   BADGE SOCIETE DES AVIS GARANTIS — repositionnement bottom-right
   Le widget est injecté en JS via $('body').append('<div class="agJsWidget"></div>')
   ================================================================ */

.agJsWidget {
  position: fixed !important;
  bottom: 16px !important;
  right: 16px !important;
  top: auto !important;
  left: auto !important;
  z-index: 999 !important;
  transform: scale(0.7);
  transform-origin: bottom right;
  opacity: 0.85;
  transition: opacity 0.2s, transform 0.2s;
}

.agJsWidget:hover {
  opacity: 1;
  transform: scale(0.85);
}

/* Iframe interne du widget */
.agJsWidget iframe {
  border: none;
}

@media (max-width: 767px) {
  .agJsWidget {
    transform: scale(0.55);
    bottom: 8px !important;
    right: 8px !important;
  }
}

/* ================================================================
   RESPONSIVE
   ================================================================ */

/* ── Tablet < 1024px : masque la nav desktop + CTAs ────────────── */

@media (max-width: 1023px) {
  .mcu-navbar__nav,
  .mcu-cta {
    display: none;
  }

  .mcu-navbar__inner {
    grid-template-columns: 1fr auto 1fr;
  }

  .mcu-subfooter__inner {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ── Mobile < 768px ────────────────────────────────────────────── */

@media (max-width: 767px) {
  /* Top bar */
  .mcu-topbar__inner {
    padding: 8px 16px;
    flex-direction: column;
    gap: 4px;
  }

  .mcu-topbar__promo {
    font-size: 12px;
  }

  .mcu-topbar__phone,
  .mcu-topbar__link {
    font-size: 14px;
  }

  .mcu-topbar__sep {
    display: none;
  }

  /* Navbar */
  .mcu-navbar__inner {
    padding: 0 16px;
    height: 72px;
  }

  .mcu-navbar__logo {
    height: 40px;
  }

  .mcu-navbar__actions {
    gap: 12px;
  }

  /* Subfooter — 2 colonnes sur mobile */
  .mcu-subfooter {
    padding: 32px 0;
  }

  .mcu-subfooter__inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }

  /* Reassurance */
  .mcu-reassurance {
    padding: 24px 0;
  }

  .mcu-reassurance__inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }

  .mcu-reassurance__icon {
    width: 40px;
    height: 40px;
  }

  .mcu-reassurance__label {
    font-size: 12px;
  }

  /* Bottom bar */
  .mcu-bottombar__inner {
    flex-direction: column;
    text-align: center;
    gap: 16px;
  }
}