/* =========================================================
   MX Branding Global (appliqué partout)
   Scope: body.mx-branding
   ========================================================= */

body.mx-branding{
  --mx-brand:#154734;
  --mx-brand2:#1B5A42;
  --mx-gold:#c8a24b;

  --mx-paper:#fbf7ef;
  --mx-paper2:#f4eee2;

  --mx-ink:#1f2422;
  --mx-muted:rgba(31,36,34,.72);
  --mx-line:rgba(21,71,52,.14);

  --mx-radius:18px;
  --mx-radius2:24px;

  --mx-shadow: 0 14px 40px rgba(2,8,23,.10);
}

/* ✅ 1) Fond global (si le thème force du blanc) */
body.mx-branding{
  background:
    radial-gradient(1200px 600px at 20% 0%, rgba(200,162,75,.10), transparent 60%),
    radial-gradient(900px 500px at 90% 10%, rgba(21,71,52,.10), transparent 55%),
    var(--mx-paper) !important;
  color: var(--mx-ink);
}

/* ✅ 2) Beaucoup de thèmes mettent #page / .site en blanc.
   On neutralise UNIQUEMENT l'arrière-plan pour laisser ton fond apparaître. */
body.mx-branding #page,
body.mx-branding .site,
body.mx-branding .site-content,
body.mx-branding main,
body.mx-branding .content-area{
  background: transparent !important;
}

/* ✅ 3) Conteneur “papier” (optionnel) : si tu veux garder des sections blanches propres */
body.mx-branding .mx-paper{
  border-radius: var(--mx-radius2);
  border:1px solid var(--mx-line);
  background: rgba(255,255,255,.65);
  box-shadow: var(--mx-shadow);
  padding: 22px;
}

/* ✅ 4) Typo globale (safe) */
body.mx-branding h1, body.mx-branding h2, body.mx-branding h3{
  color: var(--mx-brand);
  letter-spacing: .2px;
}
body.mx-branding a{
  color: var(--mx-brand);
}
body.mx-branding a:hover{
  color: var(--mx-brand2);
}

/* ✅ 5) Elementor: certaines pages ont un fond blanc via .elementor-section-wrap */
body.mx-branding .elementor,
body.mx-branding .elementor-section,
body.mx-branding .elementor-section-wrap{
  background-color: transparent;
}

/* ✅ 6) Gutenberg: le wrapper peut forcer du blanc */
body.mx-branding .wp-site-blocks{
  background: transparent !important;
}