/* ============================================================
   EUNO × MUNDAÏ — Base
   Réglages globaux, fonds décoratifs, animations, révélation au
   défilement, helpers responsive et message de succès.
   ============================================================ */

body {
  -webkit-font-smoothing: antialiased;
}

:focus-visible {
  outline: 2px solid var(--color-fuchsia);
  outline-offset: 3px;
}

/* Fonds décoratifs — blobs flous fixes (Home / Précommande / Contact). */
.euno-bg-blob {
  position: fixed;
  border-radius: 50%;
  pointer-events: none;
  z-index: -1;
  filter: blur(90px);
}
.euno-bg-blob-1 { width: 620px; height: 620px; top: -180px; left: -200px; background: #F8B5C8; opacity: .16; }
.euno-bg-blob-2 { width: 520px; height: 520px; top: 38%; right: -220px; background: #F5CB42; opacity: .15; }
.euno-bg-blob-3 { width: 680px; height: 680px; bottom: -260px; left: 20%; background: #EDE8F5; opacity: .20; }

@media (max-width: 640px) {
  .euno-bg-blob-1 { width: 320px; height: 320px; top: -100px; left: -140px; }
  .euno-bg-blob-2 { display: none; }
  .euno-bg-blob-3 { width: 360px; height: 360px; bottom: -160px; left: 0; }
}

/* Le contenu passe au-dessus des blobs. */
.wp-site-blocks { position: relative; z-index: 1; }

/* Pages légales (mentions, CGV, politique).
   Layout & style graphique = Claude Design ; tailles px = Figma.
   Conteneur à la largeur du site (marge identique à l'accueil),
   colonne de texte alignée à gauche (comme Figma), pas centrée. */
.euno-legal {
  max-width: 1200px;
  margin: 0 auto;
  padding: 64px 56px 96px;
  box-sizing: border-box;
}
.euno-legal > * {
  max-width: 800px;
}
/* Titre H1 : taille fixe (pas de fluid typography), 56px desktop / 40px mobile. */
.euno-legal-h1 {
  font-size: 56px;
}
@media (max-width: 640px) {
  .euno-legal { padding: 48px 24px 72px; }
  .euno-legal-h1 { font-size: 40px; }
}

.euno-legal-content {
  font-size: 16px;
  line-height: 1.7;
  color: var(--color-text);
}
/* Titre de section : taille Figma (H4 18px / 700). */
.euno-legal-content h2 {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
}
.euno-legal-content p { margin: 0; }
.euno-legal-content p + p { margin-top: 8px; }
.euno-legal-content ul { margin: 8px 0 0; padding-left: 22px; }
.euno-legal-content li + li { margin-top: 2px; }

/* Animations. */
@keyframes euFloat  { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes euHint   { 0%, 100% { opacity: .4; transform: rotate(0); } 50% { opacity: .9; transform: rotate(150deg); } }
@keyframes euFadeUp { 0% { opacity: 0; transform: translateY(18px); } 100% { opacity: 1; transform: translateY(0); } }
@keyframes euPopIn  { 0% { opacity: 0; transform: scale(.92) translateY(8px); } 100% { opacity: 1; transform: scale(1) translateY(0); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Sections : padding latéral mobile. */
@media (max-width: 640px) {
  .euno-section { padding-left: 24px !important; padding-right: 24px !important; }
}

/* Grilles 2 colonnes qui s'empilent en mobile (héro, formulaires). */
@media (max-width: 900px) {
  .euno-grid-2 { grid-template-columns: 1fr !important; }
}

/* Message succès (contact / newsletter). */
.euno-success {
  text-align: center;
  padding: 20px 0;
  animation: euPopIn .5s ease both;
}
.euno-success .euno-success-icon {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: var(--color-success-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  color: var(--color-success);
}
