/* =====================================================================
   CAPIBYTE — css/animations.css
   Los estados iniciales de animación son manejados EXCLUSIVAMENTE
   por GSAP en js/main.js (gsap.set).
   Este archivo NO setea opacity:0 — eso causaba que elementos
   dentro de containers con overflow:hidden quedaran invisibles forever.
===================================================================== */

/* Split title words — solo estructura, sin estado invisible */
.split-title .word {
  display: inline-block;
  overflow: hidden;
  margin-right: 0.2em;
  vertical-align: bottom;
}
.split-title .word .inner { display: inline-block; }

/* Blog reveal — IO nativo */
.will-reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.65s cubic-bezier(0.16,1,0.3,1), transform 0.65s cubic-bezier(0.16,1,0.3,1);
}
.will-reveal[data-reveal="left"]  { transform: translateX(-32px); }
.will-reveal[data-reveal="right"] { transform: translateX(32px); }
.will-reveal[data-reveal="up"]    { transform: translateY(32px); }
.will-reveal.revealed { opacity: 1 !important; transform: none !important; }
.will-reveal:nth-child(2) { transition-delay: 0.08s; }
.will-reveal:nth-child(3) { transition-delay: 0.16s; }
.will-reveal:nth-child(4) { transition-delay: 0.24s; }

/* Pricing card keyboard a11y */
.pricing-card:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }