/* ============================================================
   SCROLL ANIMATIONS - Estilo AgendaPro
   ============================================================
   Animaciones de entrada suaves al hacer scroll
   ============================================================ */

/* --------------------------------------------------------
   ESTADO INICIAL - Elementos ocultos
   -------------------------------------------------------- */
[data-animate] {
    opacity: 0;
    transform: translateY(40px);
    transition:
        opacity 0.6s ease-out,
        transform 0.6s ease-out;
}

/* --------------------------------------------------------
   ESTADO VISIBLE - Elementos animados
   -------------------------------------------------------- */
[data-animate].is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* --------------------------------------------------------
   VARIACIONES DE ANIMACIÓN
   -------------------------------------------------------- */

/* Fade Up (default) */
[data-animate="fade-up"] {
    transform: translateY(40px);
}

[data-animate="fade-up"].is-visible {
    transform: translateY(0);
}

/* Fade Down */
[data-animate="fade-down"] {
    transform: translateY(-40px);
}

[data-animate="fade-down"].is-visible {
    transform: translateY(0);
}

/* Fade Left */
[data-animate="fade-left"] {
    transform: translateX(40px);
}

[data-animate="fade-left"].is-visible {
    transform: translateX(0);
}

/* Fade Right */
[data-animate="fade-right"] {
    transform: translateX(-40px);
}

[data-animate="fade-right"].is-visible {
    transform: translateX(0);
}

/* Scale Up */
[data-animate="scale-up"] {
    transform: scale(0.9);
}

[data-animate="scale-up"].is-visible {
    transform: scale(1);
}

/* Fade Only (sin movimiento) */
[data-animate="fade"] {
    transform: none;
}

[data-animate="fade"].is-visible {
    transform: none;
}

/* --------------------------------------------------------
   DELAYS PREDEFINIDOS
   -------------------------------------------------------- */
[data-delay="50"] { transition-delay: 0.05s; }
[data-delay="100"] { transition-delay: 0.1s; }
[data-delay="150"] { transition-delay: 0.15s; }
[data-delay="200"] { transition-delay: 0.2s; }
[data-delay="250"] { transition-delay: 0.25s; }
[data-delay="300"] { transition-delay: 0.3s; }
[data-delay="400"] { transition-delay: 0.4s; }
[data-delay="500"] { transition-delay: 0.5s; }

/* --------------------------------------------------------
   DURACIONES PERSONALIZADAS
   -------------------------------------------------------- */
[data-duration="fast"] {
    transition-duration: 0.5s;
}

[data-duration="slow"] {
    transition-duration: 1.2s;
}

/* --------------------------------------------------------
   ELEMENTOS ESPECÍFICOS
   -------------------------------------------------------- */

/* Business Types Cards - entrada escalonada */
.business-types__card[data-animate] {
    transition-duration: 0.6s;
}

/* Plan Cards */
.plan-card[data-animate] {
    transition-duration: 0.7s;
}

/* Feature Tabs */
.features-showcase__tab[data-animate] {
    transition-duration: 0.5s;
}

/* Solutions Cards */
.solutions__card[data-animate] {
    transition-duration: 0.6s;
}

/* Partners Items */
.about-partners__item[data-animate] {
    transition-duration: 0.5s;
}

/* --------------------------------------------------------
   ABOUT / QUIÉNES SOMOS - Animaciones específicas
   -------------------------------------------------------- */

/* About Hero */
.about-hero__content[data-animate] {
    transition-duration: 0.4s;
}

.about-hero__visual[data-animate] {
    transition-duration: 0.5s;
}

/* About Stats Items - entrada escalonada */
.about-stats__item[data-animate] {
    transition-duration: 0.3s;
}

/* About History/Timeline */
.about-history__header[data-animate] {
    transition-duration: 0.4s;
}

.about-timeline__item[data-animate] {
    transition-duration: 0.35s;
}

.about-timeline__track[data-animate] {
    transition-duration: 0.4s;
}

/* About Mission Cards */
.about-mission__card[data-animate] {
    transition-duration: 0.4s;
}

/* About Values */
.about-values__header[data-animate] {
    transition-duration: 0.4s;
}

.about-values__item[data-animate] {
    transition-duration: 0.35s;
}

/* About Partners Header */
.about-partners__header[data-animate] {
    transition-duration: 0.4s;
}

/* About Presence */
.about-presence__header[data-animate] {
    transition-duration: 0.4s;
}

.about-presence__map-col[data-animate] {
    transition-duration: 0.45s;
}

.about-presence__stats-col[data-animate] {
    transition-duration: 0.45s;
}

.about-presence__states-card[data-animate] {
    transition-duration: 0.4s;
}

/* --------------------------------------------------------
   BLOG - Animaciones específicas
   -------------------------------------------------------- */
.blog-hero__content[data-animate] {
    transition-duration: 0.5s;
}

.blog-hero__image[data-animate] {
    transition-duration: 0.6s;
}

.blog-posts__header[data-animate] {
    transition-duration: 0.5s;
}

/* --------------------------------------------------------
   SOLUCIONES - Hero Banners
   -------------------------------------------------------- */
.facturacion-hero__content[data-animate],
.finanzas-hero__content[data-animate],
.agenda-hero__content[data-animate],
.expediente-clientes-hero__content[data-animate],
.punto-de-venta-hero__content[data-animate],
.informes-hero__content[data-animate],
.inventario-hero__content[data-animate] {
    transition-duration: 0.6s;
}

.facturacion-hero__image[data-animate],
.finanzas-hero__image[data-animate],
.agenda-hero__image[data-animate],
.expediente-clientes-hero__image[data-animate],
.punto-de-venta-hero__image[data-animate],
.informes-hero__image[data-animate],
.inventario-hero__image[data-animate] {
    transition-duration: 0.7s;
    transition-delay: 0.15s;
}

/* --------------------------------------------------------
   SOLUCIONES - Features
   -------------------------------------------------------- */
.facturacion-feature__content[data-animate],
.finanzas-feature__content[data-animate],
.agenda-feature__content[data-animate],
.expediente-clientes-feature__content[data-animate],
.punto-de-venta-feature__content[data-animate],
.informes-feature__content[data-animate],
.inventario-feature__content[data-animate] {
    transition-duration: 0.6s;
}

.facturacion-feature__image[data-animate],
.finanzas-feature__image[data-animate],
.agenda-feature__image[data-animate],
.expediente-clientes-feature__image[data-animate],
.punto-de-venta-feature__image[data-animate],
.informes-feature__image[data-animate],
.inventario-feature__image[data-animate] {
    transition-duration: 0.6s;
    transition-delay: 0.1s;
}

/* Pricing Banners */
.agenda-pricing-banner__card[data-animate] {
    transition-duration: 0.7s;
}

/* --------------------------------------------------------
   PÁGINA DE CONTACTO
   -------------------------------------------------------- */
.contact-hero__content[data-animate] {
    transition-duration: 0.6s;
}

.contact-hero__form-wrapper[data-animate] {
    transition-duration: 0.7s;
    transition-delay: 0.15s;
}

.contact-faq__header[data-animate] {
    transition-duration: 0.5s;
}

.contact-faq__item[data-animate] {
    transition-duration: 0.5s;
}

.contact-solutions__header[data-animate] {
    transition-duration: 0.5s;
}

.contact-solutions__item[data-animate] {
    transition-duration: 0.5s;
}

/* Hero - animación más rápida */
.hero__content[data-animate],
.hero__media[data-animate] {
    transition-duration: 1s;
    transition-delay: 0.2s;
}

/* CTA App mockup */
.cta-app__mockup[data-animate] {
    transform: translateY(60px) scale(0.95);
    transition-duration: 1s;
}

.cta-app__mockup[data-animate].is-visible {
    transform: translateY(0) scale(1);
}

/* Coverage map */
.coverage__map[data-animate] {
    transform: translateY(30px) scale(0.98);
    transition-duration: 0.9s;
}

.coverage__map[data-animate].is-visible {
    transform: translateY(0) scale(1);
}

/* Platform Items - entrada escalonada */
.platform__item[data-animate] {
    transition-duration: 0.5s;
}

.platform__header[data-animate] {
    transition-duration: 0.7s;
}

/* FAQ Items */
.faq__item[data-animate] {
    transition-duration: 0.5s;
}

.faq__header[data-animate] {
    transition-duration: 0.7s;
}

/* Plans Pricing Page - Mobile/Tablet */
.plans-pricing__header[data-animate] {
    transition-duration: 0.7s;
}

.plans-pricing__tabs[data-animate] {
    transition-duration: 0.6s;
    transition-delay: 0.1s;
}

.plans-pricing__card[data-animate] {
    transition-duration: 0.6s;
}

.plans-pricing__bottom-cta[data-animate] {
    transition-duration: 0.7s;
}

/* Plans Pricing Page - Desktop */
.plans-pricing-desktop__header[data-animate] {
    transition-duration: 0.7s;
}

.plans-pricing-desktop__tabs[data-animate] {
    transition-duration: 0.6s;
    transition-delay: 0.1s;
}

.plans-pricing-desktop__card[data-animate] {
    transition-duration: 0.6s;
}

.plans-pricing-desktop__bottom-cta[data-animate] {
    transition-duration: 0.7s;
}

/* Plans - Benefits Bar */
.plans-benefits-bar__item[data-animate] {
    transition-duration: 0.5s;
}

/* Plans - Comparison */
.plans-comparison__title[data-animate] {
    transition-duration: 0.7s;
}

.plans-comparison__table-wrapper[data-animate] {
    transition-duration: 0.8s;
    transition-delay: 0.1s;
}

.plans-comparison__faq-title[data-animate] {
    transition-duration: 0.7s;
}

.plans-comparison__faq-item[data-animate] {
    transition-duration: 0.5s;
}

/* --------------------------------------------------------
   REDUCIR MOVIMIENTO (Accesibilidad)
   -------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    [data-animate] {
        opacity: 1;
        transform: none;
        transition: none;
    }

    [data-animate].is-visible {
        transform: none;
    }
}

/* --------------------------------------------------------
   MOBILE - Animaciones más sutiles
   -------------------------------------------------------- */
@media (max-width: 767px) {
    [data-animate] {
        transform: translateY(20px);
        transition-duration: 0.4s;
    }

    [data-animate="fade-left"],
    [data-animate="fade-right"] {
        transform: translateY(20px);
    }

    .cta-app__mockup[data-animate] {
        transform: translateY(25px);
    }
}