/* =====================================================================
   DoradaExpo — animaciones extra (se carga después de styles.css)
   ===================================================================== */

/* Luz dorada que sigue al mouse (solo computador) */
.cursor-glow {
    position: fixed; left: 0; top: 0; width: 520px; height: 520px; margin: -260px 0 0 -260px;
    border-radius: 50%; pointer-events: none; z-index: 40; opacity: 0;
    background: radial-gradient(circle, rgba(212, 175, 55, .13), transparent 62%);
    transition: opacity .4s ease; will-change: transform;
}
.cursor-glow.on { opacity: 1; }

/* Títulos de sección: palabra por palabra */
.split-title .sw { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: .12em; margin-bottom: -.12em; }
.split-title .sw > span { display: inline-block; transform: translateY(110%) rotate(4deg); opacity: 0; transition: transform .8s cubic-bezier(.2, .8, .2, 1), opacity .8s ease; transition-delay: calc(var(--wi) * .07s + .15s); }
.visible .split-title .sw > span, .split-title.visible .sw > span { transform: none; opacity: 1; }

/* Iconos que se dibujan solos */
.card .icon svg * { stroke-dasharray: 90; stroke-dashoffset: 90; transition: stroke-dashoffset 1.4s .3s ease; }
.card.visible .icon svg * { stroke-dashoffset: 0; }
.card:not(.reveal) .icon svg * { stroke-dashoffset: 0; }
.card .icon svg [fill="currentColor"], .card .icon svg[fill="currentColor"] * { stroke-dasharray: none; stroke-dashoffset: 0; }

/* Galería: las fotos se destapan una por una */
.gallery.bento a { clip-path: inset(0 100% 0 0 round 18px); transition: clip-path 1s cubic-bezier(.7, 0, .2, 1); }
.gallery.bento.visible a { clip-path: inset(0 0 0 0 round 18px); }
.gallery.bento.visible a:nth-child(2) { transition-delay: .12s; }
.gallery.bento.visible a:nth-child(3) { transition-delay: .24s; }
.gallery.bento.visible a:nth-child(4) { transition-delay: .36s; }
.gallery.bento.visible a:nth-child(5) { transition-delay: .48s; }
.gallery.bento.visible a:nth-child(n+6) { transition-delay: .6s; }

/* Hero: el texto se aleja suavemente al hacer scroll */
.hero-home .hero-grid { will-change: transform, opacity; }

/* Formas doradas flotando en las secciones con fondo alterno */
body.site .section.alt { position: relative; overflow: hidden; }
body.site .section.alt::before, body.site .section.alt::after {
    content: ""; position: absolute; border-radius: 50%; pointer-events: none; filter: blur(60px); opacity: .5;
}
body.site .section.alt::before { width: 420px; height: 420px; left: -120px; top: 10%; background: rgba(212, 175, 55, .13); animation: drift1 14s ease-in-out infinite alternate; }
body.site .section.alt::after { width: 380px; height: 380px; right: -100px; bottom: 5%; background: rgba(229, 35, 27, .12); animation: drift2 17s ease-in-out infinite alternate; }
@keyframes drift1 { from { transform: translate(0, 0); } to { transform: translate(120px, 90px); } }
@keyframes drift2 { from { transform: translate(0, 0); } to { transform: translate(-140px, -70px); } }
body.site .section.alt > .container { position: relative; z-index: 1; }

/* Pasos: los números aparecen en cadena */
.steps .step .n { transform: scale(0); transition: transform .7s cubic-bezier(.3, 1.6, .5, 1); }
.steps.visible .step .n { transform: scale(1); }
.steps.visible .step:nth-child(1) .n { transition-delay: .2s; }
.steps.visible .step:nth-child(2) .n { transition-delay: .7s; }
.steps.visible .step:nth-child(3) .n { transition-delay: 1.2s; }
.steps .step h3, .steps .step p { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.steps.visible .step h3, .steps.visible .step p { opacity: 1; transform: none; }
.steps.visible .step:nth-child(1) h3, .steps.visible .step:nth-child(1) p { transition-delay: .5s; }
.steps.visible .step:nth-child(2) h3, .steps.visible .step:nth-child(2) p { transition-delay: 1s; }
.steps.visible .step:nth-child(3) h3, .steps.visible .step:nth-child(3) p { transition-delay: 1.5s; }
.steps .step:hover .n { animation: wiggle .6s ease; }
@keyframes wiggle { 0%, 100% { rotate: 0deg; } 25% { rotate: -12deg; } 75% { rotate: 12deg; } }

/* Ondas al hacer clic en botones */
.btn .ripple { position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .45); transform: scale(0); animation: ripple .65s ease-out forwards; pointer-events: none; }
@keyframes ripple { to { transform: scale(4); opacity: 0; } }

/* Tarjetas de eventos: la fecha entra girando */
body.site .event-date { transform-origin: center; }
.reveal:not(.visible) .event-date { transform: rotateY(90deg) scale(.7); }
.reveal.visible .event-date { transition: transform .8s .3s cubic-bezier(.3, 1.4, .5, 1); transform: none; }

/* Estadísticas y llamado final con respiración suave */
body.site .stat .value { animation: breathe 4s ease-in-out infinite; }
@keyframes breathe { 0%, 100% { filter: drop-shadow(0 0 0 rgba(212, 175, 55, 0)); } 50% { filter: drop-shadow(0 0 14px rgba(212, 175, 55, .45)); } }
body.site .cta-band .btn.lg { animation: ctaPulse 2.6s ease-in-out infinite; }
@keyframes ctaPulse { 0%, 100% { box-shadow: 0 12px 28px -16px rgba(180, 140, 40, .85); } 50% { box-shadow: 0 0 40px 4px rgba(212, 175, 55, .55); } }

/* Logo del pie: pequeño salto al pasar el mouse */
.footer img { transition: transform .4s cubic-bezier(.3, 1.6, .5, 1); }
.footer img:hover { transform: scale(1.08) rotate(-2deg); }

/* Marquesina: se acelera con el scroll */
.marquee .track { will-change: transform; }

@media (prefers-reduced-motion: reduce) {
    .cursor-glow, body.site .section.alt::before, body.site .section.alt::after { display: none; }
    .split-title .sw > span, .gallery.bento a, .steps .step .n, .steps .step h3, .steps .step p { transition: none; transform: none; opacity: 1; clip-path: none; }
    .card .icon svg * { stroke-dashoffset: 0; transition: none; }
    body.site .stat .value, body.site .cta-band .btn.lg { animation: none; }
}
@media (hover: none) { .cursor-glow { display: none; } }