/* ═══ Día de Muertos (temporada) ═══
   Lo arma js/muertos.js solo del 28 oct al 3 nov (agrega html.dm-on).
   Decoración discreta: no tapa textos ni botones y no recibe clics. */

/* Cempasúchil junto a la laptop (abajo a la izquierda, lejos del botón de WhatsApp) */
.dm-on .hero2-visual{position:relative}
.dm-flowers{position:absolute;left:4%;bottom:0;display:flex;align-items:flex-end;pointer-events:none;z-index:2}
.dm-flower{width:clamp(48px,5vw,74px);height:auto;filter:drop-shadow(0 6px 10px rgba(201,85,0,.22));animation:dmBloom 5s ease-in-out infinite}
.dm-flowers .dm-flower:nth-child(2){width:clamp(36px,3.8vw,54px);margin-left:-12px;animation-delay:-1.6s}
.dm-flowers .dm-flower:nth-child(3){width:clamp(42px,4.4vw,62px);margin-left:-8px;animation-delay:-3.1s}
@keyframes dmBloom{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(8deg) scale(1.04)}}

/* Pétalos y flores que caen al bajar por la página */
.dm-fall{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:55}
.dm-drop{position:absolute;top:-30px;left:var(--x);animation:dmFall var(--dur) cubic-bezier(.35,.1,.55,1) forwards}
.dm-drop-petal{width:13px;height:10px;border-radius:60% 40% 60% 40%;background:radial-gradient(circle at 35% 35%,#ffa94d,#e8590c);opacity:.85}
.dm-drop-petal:nth-child(3n){background:radial-gradient(circle at 35% 35%,#ffd43b,#f59f00)}
.dm-drop-flower .dm-flower{width:28px;filter:drop-shadow(0 3px 5px rgba(201,85,0,.2));animation:none}
@keyframes dmFall{
  0%{transform:translate(0,0) rotate(0) scale(var(--s));opacity:0}
  8%{opacity:.9}
  85%{opacity:.85}
  100%{transform:translate(var(--drift),calc(100vh + 60px)) rotate(var(--rot)) scale(var(--s));opacity:0}
}

/* Catrina con su MacBook recorriendo la pantalla */
.dm-fly{position:fixed;left:0;top:0;width:clamp(96px,8.5vw,138px);z-index:60;pointer-events:none;will-change:transform;transform:translate(70vw,35vh)}
.dm-catrina{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 16px 20px rgba(29,29,31,.22));animation:dmBob 2.6s ease-in-out infinite}
.dm-catrina .dm-skirt{transform-origin:50% 0;animation:dmSkirt 1.8s ease-in-out infinite alternate}
.dm-catrina .dm-hand{transform-box:fill-box;transform-origin:center;animation:dmType .45s ease-in-out infinite alternate}
.dm-catrina .dm-hand-r{animation-delay:.22s}
.dm-catrina .dm-hatflowers{transform-box:fill-box;transform-origin:50% 100%;animation:dmHat 3.2s ease-in-out infinite}
.dm-catrina .dm-glow{animation:dmGlow 2.4s ease-in-out infinite}
.dm-catrina .dm-spark{transform-box:fill-box;transform-origin:center;animation:dmTwinkle 1.9s ease-in-out infinite}
.dm-catrina .dm-spark2{animation-delay:.95s}
@keyframes dmBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes dmSkirt{from{transform:skewX(-3deg)}to{transform:skewX(3deg)}}
@keyframes dmType{from{transform:translateY(0)}to{transform:translateY(-3px)}}
@keyframes dmHat{0%,100%{transform:rotate(0)}50%{transform:rotate(-4deg)}}
@keyframes dmGlow{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes dmTwinkle{0%,100%{transform:scale(.6);opacity:.5}50%{transform:scale(1.15);opacity:1}}

@media(max-width:640px){
  .dm-fly{width:84px}
  .dm-catrina{filter:none}
  .dm-flowers{left:0}
}
/* Sin animaciones: la catrina queda quieta en una esquina */
@media(prefers-reduced-motion:reduce){
  .dm-fly{transform:none;left:auto;right:16px;top:auto;bottom:96px}
  .dm-catrina,.dm-catrina *,.dm-flower{animation:none!important}
}
.dm-catrina .dm-tassel{animation:dmTassel 2.2s ease-in-out infinite alternate}
.dm-catrina .dm-tassel:nth-of-type(2){animation-delay:-1.1s}
@keyframes dmTassel{from{transform:rotate(-6deg)}to{transform:rotate(6deg)}}
.dm-fly{width:clamp(110px,9.5vw,150px)}
@media(max-width:640px){.dm-fly{width:92px}}
