/* Nuages animés de Nuage Gourmand : doux, lents, jamais devant le contenu. */
.ng-clouds{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.ng-clouds--band{inset:auto 0 0 0;height:140px}
/* Nuages qui traversent : plus légers, pour ne jamais gêner la lecture */
.ng-clouds--sky{opacity:.55}
.ng-cloud{position:absolute;display:block;line-height:0}
.ng-cloud svg{width:100%;height:auto;overflow:visible;display:block}
.ng-cloud__float{display:block}

/* Flotter : léger va-et-vient vertical et « respiration » de la crème */
.ng-cloud--float .ng-cloud__float{animation:ng-float 9s ease-in-out infinite alternate, ng-breathe 6s ease-in-out infinite alternate}
.ng-cloud--slow .ng-cloud__float{animation-duration:13s, 8s}
.ng-cloud--late .ng-cloud__float{animation-delay:-4s, -2s}
@keyframes ng-float{from{transform:translate3d(0,0,0)}to{transform:translate3d(6px,-14px,0)}}
@keyframes ng-breathe{from{scale:1}to{scale:1.035}}

/* Dériver : traverse la section de gauche à droite, très lentement */
.ng-cloud--drift{left:0;animation:ng-drift var(--ng-drift,120s) linear var(--ng-delay,0s) infinite}
.ng-cloud--drift .ng-cloud__float{animation:ng-float 10s ease-in-out infinite alternate}
@keyframes ng-drift{from{transform:translateX(-30vw)}to{transform:translateX(110vw)}}

/* Le contenu de la section reste au-dessus des nuages */
.ng-has-clouds{position:relative;isolation:isolate}
.ng-has-clouds > :not(.ng-clouds){position:relative;z-index:1}

@media (max-width:640px){.ng-clouds--sky .ng-cloud:nth-child(3){display:none}.ng-clouds--band{height:90px}.ng-clouds--band .ng-cloud{max-width:36vw}.ng-clouds--hero .ng-cloud{max-width:42vw}}
@media (prefers-reduced-motion:reduce){.ng-cloud,.ng-cloud__float{animation:none!important}}