/* Animaciones comunes de la web de Godi.
   - Portadas (.qhero): entrada escalonada y rápida del texto; formas de fondo que flotan.
   - Secciones y tarjetas: aparecen al bajar (godi-animaciones.js agrega .ga-hide y luego .ga-in).
   - Preguntas frecuentes: se abren y cierran con animación (godi-animaciones.js).
   Solo se animan opacity y transform (las propiedades que el navegador mueve sin recalcular la página).
   No se mueven formas detrás de elementos con desenfoque de fondo (backdrop-filter), porque eso
   obliga a recalcular el desenfoque en cada cuadro y produce tirones.
   Todo se desactiva si el visitante pidió reducir el movimiento. */

@keyframes gaUp{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
@keyframes gaFloat{ 0%,100%{ transform:translate3d(0,0,0) rotate(0deg); } 50%{ transform:translate3d(-14px,16px,0) rotate(4deg); } }
@keyframes gaFloatB{ 0%,100%{ transform:translate3d(0,0,0); } 50%{ transform:translate3d(16px,-12px,0); } }

/* Portadas de las páginas internas */
.qhero .eyebrow{ animation:gaUp .5s cubic-bezier(.2,.7,.2,1) .02s backwards; }
.qhero h1{ animation:gaUp .55s cubic-bezier(.2,.7,.2,1) .07s backwards; }
.qhero p{ animation:gaUp .55s cubic-bezier(.2,.7,.2,1) .13s backwards; }
.qhero .tech-pill, .qhero .blog-meta{ animation:gaUp .55s cubic-bezier(.2,.7,.2,1) .18s backwards; }
.qhero .tech-hero-actions{ animation:gaUp .55s cubic-bezier(.2,.7,.2,1) .22s backwards; }
.qhero::before{ animation:gaFloat 16s ease-in-out infinite; will-change:transform; }
.qhero::after{ animation:gaFloatB 19s ease-in-out infinite; will-change:transform; }

/* Páginas legales */
.policy-title{ animation:gaUp .55s cubic-bezier(.2,.7,.2,1) .05s backwards; }

/* Formas de fondo de las secciones (ninguna está detrás de un elemento con desenfoque) */
.showcase-blob.s1, .svc-extras::before, .tech-steps-sec::before, .web-process::before{ animation:gaFloat 18s ease-in-out infinite; will-change:transform; }
.showcase-blob.s2, .svc-band::after{ animation:gaFloatB 15s ease-in-out infinite; will-change:transform; }

/* Aparición al bajar */
.ga-hide{
  opacity:0; transform:translate3d(0,16px,0); will-change:opacity, transform;
  transition:opacity .45s cubic-bezier(.2,.7,.2,1) var(--ga-delay, 0ms), transform .45s cubic-bezier(.2,.7,.2,1) var(--ga-delay, 0ms) !important;
}
.ga-hide.ga-in{ opacity:1; transform:none; }

/* Piezas del portafolio */
.pf-grid .pf-tile{ animation:gaUp .4s cubic-bezier(.2,.7,.2,1) backwards; }
.pf-grid .pf-tile:nth-child(2){ animation-delay:.03s; } .pf-grid .pf-tile:nth-child(3){ animation-delay:.06s; }
.pf-grid .pf-tile:nth-child(4){ animation-delay:.09s; } .pf-grid .pf-tile:nth-child(5){ animation-delay:.12s; }
.pf-grid .pf-tile:nth-child(6){ animation-delay:.15s; } .pf-grid .pf-tile:nth-child(7){ animation-delay:.18s; }
.pf-grid .pf-tile:nth-child(n+8){ animation-delay:.2s; }

/* Preguntas frecuentes: el contenido se anima al abrir y cerrar */
.faq-item .faq-a{ overflow:hidden; }
.faq-item summary::after{ transition:transform .28s cubic-bezier(.2,.7,.2,1); }
.faq-item.is-closing{ background:var(--gris-nube, #EEF1F5); border-color:transparent; box-shadow:none; }
.faq-item.is-closing summary::after{ transform:none; }

/* Detalles de interacción */
.btn-primary .icon, .plan-cta .icon, .svc-link .arrow{ transition:transform .18s ease; }
.btn-primary:hover .icon, .plan:hover .plan-cta .icon, .svc-link:hover .arrow{ transform:translateX(4px); }

@media (prefers-reduced-motion: reduce){
  .qhero *, .policy-title, .qhero::before, .qhero::after, .pf-grid .pf-tile,
  .showcase-blob, .svc-extras::before, .tech-steps-sec::before, .web-process::before, .svc-band::after{ animation:none !important; }
  .ga-hide{ opacity:1 !important; transform:none !important; transition:none !important; }
}
