/* ============================================================
   ANIMACIONES — discretas, con respeto a prefers-reduced-motion
   ============================================================ */

/* Aparición progresiva al hacer scroll (activada por app.js) */
[data-reveal]{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);
  will-change:opacity,transform;
}
[data-reveal].is-visible{opacity:1;transform:none}
[data-reveal][data-reveal-delay="1"]{transition-delay:.09s}
[data-reveal][data-reveal-delay="2"]{transition-delay:.18s}
[data-reveal][data-reveal-delay="3"]{transition-delay:.27s}
[data-reveal][data-reveal-delay="4"]{transition-delay:.36s}

/* Entrada del hero */
.hero-copy > *{animation:riseIn .9s cubic-bezier(.22,.61,.36,1) both}
.hero-copy > *:nth-child(1){animation-delay:.05s}
.hero-copy > *:nth-child(2){animation-delay:.13s}
.hero-copy > *:nth-child(3){animation-delay:.21s}
.hero-copy > *:nth-child(4){animation-delay:.29s}
.hero-copy > *:nth-child(5){animation-delay:.37s}
.hero-figure{animation:fadeIn 1.4s ease both .2s}

@keyframes riseIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* Firma visual: barrido de luz vertical muy lento sobre el hero */
.hero::after{
  content:"";position:absolute;top:-20%;bottom:-20%;width:34vw;
  background:linear-gradient(90deg,transparent,rgba(35,168,224,.09) 45%,rgba(255,255,255,.05) 50%,rgba(35,168,224,.09) 55%,transparent);
  filter:blur(12px);
  animation:sweep 22s linear infinite;
  pointer-events:none;
}
@keyframes sweep{
  0%{transform:translateX(-40vw) skewX(-8deg)}
  100%{transform:translateX(130vw) skewX(-8deg)}
}

/* Hover de tarjetas */
.glass{transition:transform .35s cubic-bezier(.22,.61,.36,1),border-color .35s ease,box-shadow .35s ease}
.track-card:hover,.card:hover,.quote:hover,.resource:hover{
  transform:translateY(-4px);
  border-color:rgba(35,168,224,.42);
}
.track-media img{transition:transform 1.1s cubic-bezier(.22,.61,.36,1),filter .6s ease;filter:saturate(.85)}
.track-item:hover .track-media img{transform:scale(1.04);filter:saturate(1)}

/* Línea luminosa superior en tarjetas destacadas */
.glass--lit::before{
  content:"";position:absolute;top:0;left:14%;right:14%;height:1px;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);
  opacity:.8;
}

/* Parallax muy ligero (app.js escribe --parallax) */
.section--scene{background-position:center calc(50% + var(--parallax,0px))}

/* Estado de envío en botones */
.btn.is-loading{opacity:.65;pointer-events:none}
.btn.is-loading::after{
  content:"";width:15px;height:15px;border-radius:50%;
  border:2px solid rgba(4,18,28,.35);border-top-color:#04121C;
  animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- ACCESIBILIDAD DE MOVIMIENTO ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
  [data-reveal]{opacity:1;transform:none}
  .hero::after{display:none}
  .section--scene{background-position:center}
}
