/* ============================================================
   PREMIUM ANIMATIONS — Techno4S Smartomation P Ltd
   Companion stylesheet for assets/js/premium-animations.js

   Everything that disables existing behaviour is scoped to
   html.has-gsap, a class only added once GSAP is confirmed
   loaded. Without it this file changes nothing, and the original
   CSS/IntersectionObserver animations run exactly as before.
   ============================================================ */

/* ------------------------------------------------------------
   1. HAND OVER CONTROL TO GSAP
   ------------------------------------------------------------ */

/* The generic reveal transition would fight GSAP's per-frame
   writes, producing a laggy double-eased motion. */
.has-gsap [data-anim] {
    opacity: 1;
    transform: none;
    transition: none !important;
}

/* Hero pieces are driven by the GSAP entrance timeline instead of
   the fadeInUp keyframes. CSS animations override inline styles,
   so these must be switched off explicitly. */
.has-gsap .hero-badge,
.has-gsap .hero-heading,
.has-gsap .hero-subtext,
.has-gsap .hero-cta-group,
.has-gsap .hero-trust,
.has-gsap .hero-visual {
    animation: none !important;
}

/* Word spans produced by splitIntoWords(). Inline elements ignore
   transforms, so each word must become inline-block before it can
   be moved or rotated. Spacing is unaffected: the original
   whitespace text nodes are preserved between the spans. */
.fs-word {
    display: inline-block;
    transform-origin: 50% 100%;
}

/* Compositor hints — kept off mobile, where the memory cost of
   extra layers outweighs the benefit. */
@media (min-width: 769px) {
    .has-gsap [data-anim],
    .has-gsap .hero-content,
    .has-gsap .hero-carousel-slide,
    .has-gsap .hero-heading .fs-word {
        will-change: transform, opacity;
    }
}

/* Tilt cards need a stable 3D context and their own layer. */
.has-gsap .ct-branch-card,
.has-gsap .ct-step-card,
.has-gsap .why-card,
.has-gsap .au-values-box-item,
.has-gsap .bento-card,
.has-gsap .cb-assoc-card,
.has-gsap .cb-matter-item {
    transform-style: preserve-3d;
    backface-visibility: hidden;
}

/* Magnetic buttons are moved via GSAP's x/y — a CSS transition on
   transform would smear the spring return. */
.has-gsap .hero-btn-primary,
.has-gsap .proc-btn-pill,
.has-gsap .cta-btn-outline,
.has-gsap .ct-quick-whatsapp,
.has-gsap .btn-primary {
    transition-property: background-color, border-color, color, box-shadow, filter;
}


/* ------------------------------------------------------------
   2. SCROLL PROGRESS BAR
   Fixed overlay — occupies no space in the document flow.
   ------------------------------------------------------------ */
.fs-scroll-progress {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    z-index: 99999;
    background: linear-gradient(90deg, #A02D57 0%, #C52671 50%, #79333A 100%);
    transform: scaleX(0);
    transform-origin: 0 50%;
    pointer-events: none;
}


/* ------------------------------------------------------------
   3. PREMIUM MICRO-INTERACTIONS
   Pure CSS, independent of GSAP.
   ------------------------------------------------------------ */

/* Links and buttons settle rather than snap. */
.hero-btn-primary,
.hero-btn-secondary,
.proc-btn-pill,
.cta-btn-outline,
.ct-branch-link,
.ct-quick-item {
    transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Sheen sweep across primary buttons on hover. */
.has-gsap .hero-btn-primary,
.has-gsap .proc-btn-pill {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.has-gsap .hero-btn-primary::after,
.has-gsap .proc-btn-pill::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, 0.28) 50%, transparent 70%);
    transform: translateX(-120%);
    transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    pointer-events: none;
}

.has-gsap .hero-btn-primary:hover::after,
.has-gsap .proc-btn-pill:hover::after {
    transform: translateX(120%);
}

/* Branch and step cards get a soft glow on approach. */
.has-gsap .ct-branch-card,
.has-gsap .ct-step-card,
.has-gsap .why-card {
    transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1),
                border-color 0.45s ease;
}

/* Images lift a touch inside their frame on hover. */
.has-gsap .au-who-img,
.has-gsap .au-story-img,
.has-gsap .au-team-img {
    transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

.has-gsap .au-who-visual:hover .au-who-img,
.has-gsap .au-story-visual:hover .au-story-img {
    transform: scale(1.035);
}

/* Focus rings stay instant and unmissable — never animated. */
.has-gsap a:focus-visible,
.has-gsap button:focus-visible,
.has-gsap input:focus-visible,
.has-gsap select:focus-visible,
.has-gsap textarea:focus-visible {
    outline: 3px solid rgba(160, 45, 87, 0.45);
    outline-offset: 3px;
    transition: none;
}


/* ------------------------------------------------------------
   4. REDUCED MOTION
   Overrides everything above, including the JS-set inline styles.
   ------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {

    .fs-scroll-progress { display: none; }

    .has-gsap [data-anim],
    .has-gsap .hero-content > *,
    .has-gsap .fs-word,
    .has-gsap .ct-field,
    .has-gsap .ct-quick-card > *,
    .has-gsap .cb-intro-left,
    .has-gsap .cb-intro-right,
    .has-gsap .cb-intro-statement,
    .has-gsap .cb-matter-item,
    .has-gsap .cb-assoc-card,
    .has-gsap .cb-means-stat,
    .has-gsap .cb-means-copy,
    .has-gsap .cb-means-visual,
    .has-gsap .cb-carousel-wrapper,
    .has-gsap .partners-marquee-row {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        clip-path: none !important;
    }

    .has-gsap *,
    .has-gsap *::before,
    .has-gsap *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}