@keyframes ambientShift{0%{transform:translate3d(-2%,0,0) scale(1)}100%{transform:translate3d(3%,2%,0) scale(1.05)}}
@keyframes gradientDrift{0%{background-position:0% 50%}100%{background-position:100% 50%}}
.gradient-text,.btn.arc{animation:gradientDrift 18s ease-in-out infinite alternate}
.reveal{opacity:0;transform:translate3d(0,18px,0);transition:opacity var(--motion-content) var(--ease-enter),transform var(--motion-content) var(--ease-enter)}.reveal.is-visible{opacity:1;transform:none}.reveal[data-delay="1"]{transition-delay:80ms}.reveal[data-delay="2"]{transition-delay:160ms}.reveal[data-delay="3"]{transition-delay:240ms}.reveal[data-delay="4"]{transition-delay:320ms}
.hero-seq{opacity:0;transform:translate3d(0,16px,0);animation:heroIn var(--motion-hero) var(--ease-enter) forwards}.hero-seq:nth-child(1){animation-delay:40ms}.hero-seq:nth-child(2){animation-delay:140ms}.hero-seq:nth-child(3){animation-delay:250ms}.hero-seq:nth-child(4){animation-delay:360ms}.hero-seq:nth-child(5){animation-delay:450ms}@keyframes heroIn{to{opacity:1;transform:none}}
.card,.service-card,.media-card,.contact-card{will-change:transform}.service-card:hover .learn{transform:translateX(3px)}.service-card .learn{transition:transform var(--motion-micro) var(--ease-state)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero::before,.gradient-text,.btn.arc{animation:none}.reveal,.hero-seq{opacity:1;transform:none;transition:none;animation:none}.btn,.service-card,.site-header,.submenu{transition:none}.btn:hover,.service-card:hover{transform:none}}


/* ============================================================
   D1 · Reveals editoriales (Directriz v1.1 seccion 11)
   ------------------------------------------------------------
   Todas las variantes reutilizan el IntersectionObserver que ya
   vive en site.js: basta anadir .reveal mas la variante. No se
   depende solo de opacity.
   ============================================================ */

/* A · Precision: desplazamiento corto. Variante del baseline. */
.reveal--rise{transform:translate3d(0,26px,0)}

/* B · Mascara editorial: la pieza se descubre desde un borde. */
.reveal--wipe{
  opacity:1;
  transform:none;
  clip-path:inset(0 100% 0 0);
  transition:clip-path var(--motion-editorial) var(--ease-enter);
}
.reveal--wipe.is-visible{clip-path:inset(0 0 0 0)}

.reveal--wipe-up{
  opacity:1;
  transform:none;
  clip-path:inset(100% 0 0 0);
  transition:clip-path var(--motion-reveal) var(--ease-enter);
}
.reveal--wipe-up.is-visible{clip-path:inset(0 0 0 0)}

/* C · Linea a linea: cada hijo se descubre con retardo escalonado.
   El contenedor no anima; animan sus hijos. */
.reveal--lines{opacity:1;transform:none;transition:none}
.reveal--lines>*{
  display:block;
  opacity:0;
  transform:translate3d(0,.5em,0);
  transition:opacity var(--motion-reveal) var(--ease-enter),
             transform var(--motion-reveal) var(--ease-enter);
}
.reveal--lines.is-visible>*{opacity:1;transform:none}
.reveal--lines.is-visible>*:nth-child(2){transition-delay:90ms}
.reveal--lines.is-visible>*:nth-child(3){transition-delay:180ms}
.reveal--lines.is-visible>*:nth-child(4){transition-delay:270ms}
.reveal--lines.is-visible>*:nth-child(5){transition-delay:360ms}

/* Reveal de imagen desde el borde: la caja se descubre y el medio
   compensa con una escala corta, de modo que no "resbala". */
.reveal--media{
  opacity:1;
  transform:none;
  clip-path:inset(0 0 100% 0);
  transition:clip-path var(--motion-editorial) var(--ease-enter);
}
.reveal--media.is-visible{clip-path:inset(0 0 0 0)}
.reveal--media>img,.reveal--media>video{
  transform:scale(1.06);
  transition:transform calc(var(--motion-editorial) + 200ms) var(--ease-enter);
}
.reveal--media.is-visible>img,.reveal--media.is-visible>video{transform:none}

/* Stagger explicito ampliado (el baseline llega a data-delay=4) */
.reveal[data-delay="5"]{transition-delay:400ms}
.reveal[data-delay="6"]{transition-delay:480ms}

/* Desplazamiento de fondo: 20-40px, gobernado por site.js */
[data-parallax]{will-change:transform}

/* ------------------------------------------------------------
   Reduced motion: la informacion y la navegacion permanecen
   completas; solo se retira el movimiento no esencial.
   ------------------------------------------------------------ */
@media(prefers-reduced-motion:reduce){
  .reveal--rise,
  .reveal--wipe,
  .reveal--wipe-up,
  .reveal--media,
  .reveal--lines,
  .reveal--lines>*{
    opacity:1!important;
    transform:none!important;
    clip-path:none!important;
    transition:none!important;
    animation:none!important;
  }
  .reveal--media>img,.reveal--media>video{transform:none!important;transition:none!important}
  [data-parallax]{transform:none!important;will-change:auto}
}