/* YoD Communication — fond animé du hero (morphing) */
.yod-hero-fond {
  position: relative;
  background: #FFFBF7;
  isolation: isolate;
}

/* Calque du fond, injecté par yod-hero-fond.js */
.yod-hero-fond__layer {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
  pointer-events: none;
}

/* Contenu au-dessus du fond (Divi : lignes et modules) */
.yod-hero-fond > *:not(.yod-hero-fond__layer) {
  position: relative;
  z-index: 1;
}

/* Taches de couleur */
.yod-hero-fond__blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(64px);
  will-change: transform, border-radius;
}
.yod-hero-fond__blob--1 {
  left: 46%; top: -18%; width: 620px; height: 560px;
  background: rgba(255, 214, 178, 0.55);
  animation: yodMoveA 19s ease-in-out infinite, yodMorph 11s ease-in-out infinite;
}
.yod-hero-fond__blob--2 {
  left: 74%; top: 30%; width: 480px; height: 520px;
  background: rgba(255, 196, 150, 0.28);
  animation: yodMoveB 23s ease-in-out infinite, yodMorph 13s ease-in-out -4s infinite reverse;
}
.yod-hero-fond__blob--3 {
  left: 14%; top: -30%; width: 600px; height: 520px;
  background: rgba(255, 236, 220, 0.85);
  animation: yodMoveC 27s ease-in-out infinite, yodMorph 15s ease-in-out -7s infinite;
}
.yod-hero-fond__blob--4 {
  left: -10%; top: 42%; width: 520px; height: 480px;
  background: rgba(255, 224, 200, 0.5);
  animation: yodMoveD 21s ease-in-out infinite, yodMorph 12s ease-in-out -2s infinite reverse;
}

/* Fondu vers le blanc en bas du hero */
.yod-hero-fond__fade {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 220px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #FFFFFF);
}

/* Déformation (morphing) */
@keyframes yodMorph {
  0%, 100% { border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%; }
  25%      { border-radius: 63% 37% 38% 62% / 55% 61% 39% 45%; }
  50%      { border-radius: 35% 65% 55% 45% / 62% 34% 66% 38%; }
  75%      { border-radius: 55% 45% 30% 70% / 40% 60% 40% 60%; }
}

/* Déplacements */
@keyframes yodMoveA {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33%      { transform: translate(-160px, 90px) scale(1.12) rotate(25deg); }
  66%      { transform: translate(70px, 150px) scale(.92); }
}
@keyframes yodMoveB {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%      { transform: translate(-220px, -110px) scale(1.2) rotate(-30deg); }
}
@keyframes yodMoveC {
  0%, 100% { transform: translate(0, 0) scale(1); }
  40%      { transform: translate(180px, 120px) scale(.9) rotate(20deg); }
  75%      { transform: translate(-60px, 60px) scale(1.1); }
}
@keyframes yodMoveD {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50%      { transform: translate(200px, -140px) scale(1.15) rotate(-25deg); }
}

/* Mobile : taches plus petites */
@media (max-width: 767px) {
  .yod-hero-fond__blob { filter: blur(48px); }
  .yod-hero-fond__blob--1 { width: 380px; height: 340px; left: 30%; }
  .yod-hero-fond__blob--2 { width: 300px; height: 320px; left: 60%; }
  .yod-hero-fond__blob--3 { width: 360px; height: 320px; }
  .yod-hero-fond__blob--4 { width: 320px; height: 300px; }
}

/* Accessibilité : fond immobile si l'utilisateur a désactivé les animations */
@media (prefers-reduced-motion: reduce) {
  .yod-hero-fond__blob { animation: none; }
}