/* ═══════════════════════════════════════════════
   SISTEMA DE ANIMACIONES — A Comer Gourmet
   Basado en IntersectionObserver + CSS transforms
   Solo anima opacity y transform (GPU-accelerated)
═══════════════════════════════════════════════ */

/* ── RESPETA PREFERENCIA DEL USUARIO ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  [data-anim], [data-anim-child] { opacity: 1 !important; transform: none !important; }
}

/* ══════════════════════════════════════════════
   ANIMACIONES DE CARGA — Hero sections (CSS puro)
   Se disparan al cargar la página, sin JS
══════════════════════════════════════════════ */

@keyframes acg-up {
  from { opacity: 0; transform: translateY(32px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes acg-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes acg-left {
  from { opacity: 0; transform: translateX(-32px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes acg-right {
  from { opacity: 0; transform: translateX(32px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes acg-scale {
  from { opacity: 0; transform: scale(0.95); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes acg-line {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
@keyframes acg-clip {
  from { clip-path: inset(0 100% 0 0); opacity: 0.3; }
  to   { clip-path: inset(0 0% 0 0);   opacity: 1; }
}

/* Easing compartido */
:root {
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --dur-fast:   0.35s;
  --dur-med:    0.5s;
  --dur-slow:   0.7s;
}

/* ── HOMEPAGE HERO ── */
.hero-content > * {
  animation: acg-up var(--dur-med) var(--ease-out-expo) both;
}
.hero-content .hero-eyebrow  { animation-delay: 0.05s; }
.hero-content .hero-title    { animation-delay: 0.1s; }
.hero-content .hero-subtitle { animation-delay: 0.18s; }
.hero-content .hero-actions  { animation-delay: 0.25s; }
.hero-scroll { animation: acg-fade 0.6s 0.5s both; }

/* ── SOBRE EL FESTIVAL HERO ── */
.sf-hero-left .sf-eyebrow { animation: acg-up var(--dur-slow) 0.1s var(--ease-out-expo) both; }
.sf-hero-left .sf-big-title { animation: acg-up var(--dur-slow) 0.22s var(--ease-out-expo) both; }
.sf-hero-right .sf-tagline {
  animation: acg-right var(--dur-slow) 0.15s var(--ease-out-expo) both;
}
.sf-hero-right .sf-stat-pair { animation: acg-right var(--dur-slow) 0.3s var(--ease-out-expo) both; }

/* ── EDICIÓN 2025 HERO ── */
.e25-hero-content .e25-hero-tag { animation: acg-up var(--dur-fast) 0.1s var(--ease-out-expo) both; }
.e25-hero-content .e25-hero-title { animation: acg-up var(--dur-slow) 0.2s var(--ease-out-expo) both; }
.e25-hero-content .e25-hero-sub { animation: acg-up var(--dur-slow) 0.38s var(--ease-out-expo) both; }
.e25-hero-numbers .e25-bg-number {
  animation: acg-fade 2s 0.4s var(--ease-out-expo) both;
}

/* ── GANADORES HERO ── */
.gan-hero-content .gan-hero-label { animation: acg-up var(--dur-fast) 0.1s var(--ease-out-expo) both; }
.gan-hero-content .gan-hero-title { animation: acg-up var(--dur-slow) 0.2s var(--ease-out-expo) both; }
.gan-hero-content .gan-hero-sub { animation: acg-up var(--dur-slow) 0.4s var(--ease-out-expo) both; }

/* ── JURADO HERO ── */
.jur-hero-left .jur-title-label { animation: acg-up var(--dur-fast) 0.15s var(--ease-out-expo) both; }
.jur-hero-left .jur-name { animation: acg-up var(--dur-slow) 0.25s var(--ease-out-expo) both; }
.jur-hero-left .jur-role { animation: acg-up var(--dur-slow) 0.38s var(--ease-out-expo) both; }
.jur-hero-left .jur-bio { animation: acg-up var(--dur-slow) 0.5s var(--ease-out-expo) both; }
.jur-hero-left .jur-stats { animation: acg-up var(--dur-slow) 0.62s var(--ease-out-expo) both; }
.jur-hero-right { animation: acg-fade 1.2s 0.1s both; }

/* ── MUSEO HERO ── */
.mus-hero-content .mus-hero-badge { animation: acg-scale var(--dur-fast) 0.1s var(--ease-out-expo) both; }
.mus-hero-content .mus-hero-title { animation: acg-up var(--dur-slow) 0.22s var(--ease-out-expo) both; }
.mus-hero-content .mus-hero-sub { animation: acg-up var(--dur-slow) 0.38s var(--ease-out-expo) both; }
.mus-hero-content .mus-hero-form { animation: acg-up var(--dur-slow) 0.52s var(--ease-out-expo) both; }

/* ── AR HERO ── */
.ar-hero-left .ar-hero-tag { animation: acg-up var(--dur-fast) 0.1s var(--ease-out-expo) both; }
.ar-hero-left .ar-hero-title { animation: acg-up var(--dur-slow) 0.2s var(--ease-out-expo) both; }
.ar-hero-left .ar-hero-sub { animation: acg-up var(--dur-slow) 0.35s var(--ease-out-expo) both; }
.ar-hero-left > div:last-child { animation: acg-up var(--dur-slow) 0.48s var(--ease-out-expo) both; }
.ar-hero-right { animation: acg-fade 0.9s 0.25s both; }
.ar-big-qr { animation: acg-scale var(--dur-slow) 0.5s var(--ease-out-expo) both; }

/* ── GALERÍA HERO ── */
.gal-hero .gal-hero-title { animation: acg-up var(--dur-slow) 0.1s var(--ease-out-expo) both; }
.gal-hero p { animation: acg-up var(--dur-slow) 0.22s var(--ease-out-expo) both; }
.gal-hero .gal-meta { animation: acg-right var(--dur-slow) 0.15s var(--ease-out-expo) both; }
.gal-filter-bar { animation: acg-fade var(--dur-med) 0.35s both; }

/* ══════════════════════════════════════════════
   ANIMACIONES DE SCROLL — via IntersectionObserver
   El JS añade .is-visible cuando entra al viewport
══════════════════════════════════════════════ */

/* Estado inicial — oculto */
[data-anim] {
  will-change: opacity, transform;
}
[data-anim="up"]    { opacity: 0; transform: translateY(30px); }
[data-anim="left"]  { opacity: 0; transform: translateX(-36px); }
[data-anim="right"] { opacity: 0; transform: translateX(36px); }
[data-anim="scale"] { opacity: 0; transform: scale(0.94); }
[data-anim="fade"]  { opacity: 0; }
[data-anim="line"]  { transform: scaleX(0); transform-origin: left; }
[data-anim="clip"]  { clip-path: inset(0 100% 0 0); opacity: 0.3; }

/* Estado visible — restaurado */
[data-anim].is-visible {
  opacity: 1;
  transform: none;
  clip-path: inset(0 0% 0 0);
  transition:
    opacity   var(--dur-med) var(--ease-out-expo),
    transform var(--dur-med) var(--ease-out-expo),
    clip-path var(--dur-med) var(--ease-out-expo);
}
[data-anim="line"].is-visible {
  transition: transform 0.9s var(--ease-out-expo);
}

/* Delays para stagger (el JS los asigna via --stagger-i) */
[data-anim].is-visible {
  transition-delay: calc(var(--stagger-i, 0) * 80ms);
}

/* ── PARALAJE EN HERO BACKGROUNDS ── */
.hero-bg, .gan-hero-bg, .e25-hero-bg, .mus-hero-glow {
  will-change: transform;
}

/* ── COUNTER — pulso sutil mientras cuenta ── */
[data-count].counting {
  animation: acg-fade 0.3s both;
}

/* ── LÍNEA DECORATIVA ANIMADA ── */
.animated-line {
  display: block; height: 2px;
  background: var(--naranja);
  transform-origin: left;
}
[data-anim="line"].is-visible .animated-line,
.animated-line.is-visible {
  animation: acg-line 0.9s var(--ease-out-expo) both;
  animation-delay: calc(var(--stagger-i, 0) * 80ms);
}

/* ── ETIQUETA LABEL CLIP REVEAL ── */
.section-label[data-anim="clip"],
.inner-label[data-anim="clip"],
.e25-section-label[data-anim="clip"],
.gan-hero-label[data-anim="clip"],
.mus-preview-label[data-anim="clip"] {
  display: inline-block;
}

/* ══════════════════════════════════════════════
   HOMEPAGE — Animaciones específicas
══════════════════════════════════════════════ */
.stats-bar.is-visible .stat-item {
  animation: acg-up var(--dur-med) var(--ease-out-expo) both;
}
.stats-bar.is-visible .stat-item:nth-child(1) { animation-delay: 0ms; }
.stats-bar.is-visible .stat-item:nth-child(2) { animation-delay: 80ms; }
.stats-bar.is-visible .stat-item:nth-child(3) { animation-delay: 160ms; }
.stats-bar.is-visible .stat-item:nth-child(4) { animation-delay: 240ms; }

/* ── AR CARDS HOMEPAGE ── */
.ar-visual.is-visible .ar-card {
  animation: acg-up var(--dur-med) var(--ease-out-expo) both;
}
.ar-visual.is-visible .ar-card:nth-child(1) { animation-delay: 0ms; }
.ar-visual.is-visible .ar-card:nth-child(2) { animation-delay: 100ms; }
.ar-visual.is-visible .ar-card:nth-child(3) { animation-delay: 200ms; }
.ar-visual.is-visible .ar-card:nth-child(4) { animation-delay: 300ms; }

/* ── E25 IMPACT BAR ── */
.e25-impact.is-visible .e25-impact-item {
  animation: acg-up var(--dur-med) var(--ease-out-expo) both;
}
.e25-impact.is-visible .e25-impact-item:nth-child(1) { animation-delay: 0ms; }
.e25-impact.is-visible .e25-impact-item:nth-child(2) { animation-delay: 80ms; }
.e25-impact.is-visible .e25-impact-item:nth-child(3) { animation-delay: 160ms; }
.e25-impact.is-visible .e25-impact-item:nth-child(4) { animation-delay: 240ms; }

/* ── SF VALORES ── */
.sf-valores.is-visible .sf-valor {
  animation: acg-up var(--dur-med) var(--ease-out-expo) both;
}
.sf-valores.is-visible .sf-valor:nth-child(1) { animation-delay: 0ms; }
.sf-valores.is-visible .sf-valor:nth-child(2) { animation-delay: 70ms; }
.sf-valores.is-visible .sf-valor:nth-child(3) { animation-delay: 140ms; }
.sf-valores.is-visible .sf-valor:nth-child(4) { animation-delay: 210ms; }
.sf-valores.is-visible .sf-valor:nth-child(5) { animation-delay: 280ms; }
.sf-valores.is-visible .sf-valor:nth-child(6) { animation-delay: 350ms; }

/* ── GAN GRID ── */
.gan-grid.is-visible .gan-card {
  animation: acg-scale var(--dur-med) var(--ease-out-expo) both;
}
.gan-grid.is-visible .gan-card:nth-child(1) { animation-delay: 0ms; }
.gan-grid.is-visible .gan-card:nth-child(2) { animation-delay: 100ms; }
.gan-grid.is-visible .gan-card:nth-child(3) { animation-delay: 180ms; }
.gan-grid.is-visible .gan-card:nth-child(4) { animation-delay: 260ms; }

/* ── GAN PREMIOS ── */
.gan-premios-row.is-visible .gan-premio-card {
  animation: acg-up var(--dur-med) var(--ease-out-expo) both;
}
.gan-premios-row.is-visible .gan-premio-card:nth-child(1) { animation-delay: 0ms; }
.gan-premios-row.is-visible .gan-premio-card:nth-child(2) { animation-delay: 100ms; }
.gan-premios-row.is-visible .gan-premio-card:nth-child(3) { animation-delay: 200ms; }

/* ── JUR CRITERIOS ── */
.jur-criterios .jur-criterio[data-anim="up"].is-visible {
  transition-delay: calc(var(--ci, 0) * 70ms);
}

/* ── MUS CARDS ── */
.mus-cards.is-visible .mus-card {
  animation: acg-scale var(--dur-med) var(--ease-out-expo) both;
}
.mus-cards.is-visible .mus-card:nth-child(1) { animation-delay: 0ms; }
.mus-cards.is-visible .mus-card:nth-child(2) { animation-delay: 80ms; }
.mus-cards.is-visible .mus-card:nth-child(3) { animation-delay: 160ms; }
.mus-cards.is-visible .mus-card:nth-child(4) { animation-delay: 240ms; }

/* ── E25 PIECES ── */
.e25-pieces.is-visible .e25-piece {
  animation: acg-up var(--dur-med) var(--ease-out-expo) both;
}
.e25-pieces.is-visible .e25-piece:nth-child(1) { animation-delay: 0ms; }
.e25-pieces.is-visible .e25-piece:nth-child(2) { animation-delay: 100ms; }
.e25-pieces.is-visible .e25-piece:nth-child(3) { animation-delay: 200ms; }

/* ── RESTAURANT CARDS — mismo patrón que gan-grid ── */
.restaurants-grid .restaurant-card {
  opacity: 0;
  transform: scale(0.95);
}
.restaurants-grid.is-visible .restaurant-card {
  animation: acg-scale var(--dur-med) var(--ease-out-expo) both;
  animation-delay: calc(var(--si, 0) * 60ms);
}

/* ══════════════════════════════════════════════
   MICROINTERACCIONES PREMIUM
══════════════════════════════════════════════ */

/* Hover lift en info cards */
.info-card {
  transition: transform 0.3s var(--ease-out-quart), border-color 0.3s;
}
.info-card:hover {
  transform: translateY(-4px);
  border-color: rgba(245,157,31,0.2);
}

/* Hover lift en about-cards homepage */
.about-card {
  transition: transform 0.3s var(--ease-out-quart), background 0.2s;
}
.about-card:hover { transform: translateY(-3px); }

/* Nav underline slide */
.nav-links a {
  position: relative;
}
.nav-links a::after {
  content: '';
  position: absolute; bottom: -4px; left: 0;
  width: 0; height: 1px;
  background: var(--amarillo);
  transition: width 0.25s var(--ease-out-quart);
}
.nav-links a:hover::after,
.nav-links a[style*="var(--amarillo)"]::after,
.nav-links a[style*="var(--naranja)"]::after {
  width: 100%;
}

/* Botones — micro elevación */
.btn-primary, .btn-ghost, .nav-cta {
  transition: transform 0.2s var(--ease-out-quart), background 0.2s, box-shadow 0.2s, opacity 0.2s !important;
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(232,61,25,0.25); }
.btn-ghost:hover { transform: translateY(-2px); }
.nav-cta:hover { transform: translateY(-1px); }

/* Restaurant card — scale sutil al hover */
/* hover ya definido en styles.css — sin scale del card */

/* Winner/Mus cards — ya tienen CSS pero lo unificamos */
.gan-card, .mus-card {
  transition: transform 0.4s var(--ease-out-quart) !important;
}

/* AR postal cards */
.ar-postal-card {
  transition: transform 0.3s var(--ease-out-quart), border-color 0.3s !important;
}