/* ==========================================================================
   WalkThru global MOTION SYSTEM — calm, subtle, premium.
   Loaded LAST (after main.css + wt-typography.css) so it governs motion
   site-wide (home + all 180+ pages) without editing templates individually.

   Philosophy: less animation, better animation. Content is the focus; motion
   only supports it. One subtle entrance (short fade + tiny rise), subtle
   hovers, functional transitions kept fast. No continuous/decorative loops.
   Reference for restraint: pixieset.com (motion feel only, not design).

   This file changes MOTION ONLY — no layout, colour, type or content.
   ========================================================================== */

/* ==========================================================================
   0. Accessibility: honour prefers-reduced-motion (near-instant everything).
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ==========================================================================
   1. One consistent entrance for the WOW / animate.css zoo.
   Every fadeIn*/zoomIn/bounceIn/slideIn/rotateIn/flip/lightSpeed variant on a
   .wow element is replaced with a single short fade + 12px rise, no stagger.
   !important beats WOW's inline animation-name / -delay / -duration.
   ========================================================================== */
/* Pixieset-style entrance: a 0.7s ease-in-out opacity fade plus a gentle,
   restrained upward slide (24px — smaller than Pixieset's 50px for extra calm).
   Runs once on scroll-in, no stagger cascade. */
@keyframes wtFade {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}
.wow {
    animation-name: wtFade !important;
    animation-duration: 0.7s !important;
    animation-delay: 0s !important;              /* kills the staggered cascade */
    animation-timing-function: ease-in-out !important;
    animation-iteration-count: 1 !important;
    animation-fill-mode: both !important;
}
/* Any element left with a big animate.css entrance but no .wow: neutralise the
   dramatic ones so nothing zooms/slides/flips far. */
.animated.zoomIn, .animated.zoomInUp, .animated.zoomInDown,
.animated.bounceIn, .animated.bounceInUp, .animated.bounceInDown,
.animated.rotateIn, .animated.flipInX, .animated.flipInY,
.animated.lightSpeedIn, .animated.rollIn, .animated.jackInTheBox,
.animated.fadeInLeftBig, .animated.fadeInRightBig,
.animated.fadeInUpBig, .animated.fadeInDownBig {
    animation-name: wtFade !important;
    animation-duration: 0.55s !important;
}

/* ==========================================================================
   2. Stop continuous / infinite decorative loops (the "constant motion").
   ========================================================================== */
.theme-btn-main .theme-btn-arrow-right img,
.theme-btn-main:hover .theme-btn-arrow-left img,
.theme-btn-main:hover .theme-btn-arrow-right img,
.hero-1 .hero-circle img,
.bounce-x,
.animation-infinite,
.animation-infinite-rtl,
.hero-4 .drop,
.hero-4 .stem,
.float-bob-x,
.float-bob-y {
    animation: none !important;
}
/* Brand "Trusted by" logo strip: was an endless horizontal scroll. Hold it
   still so the logos read as a calm static row. */
.marquee .marquee-group,
.marque-section .marquee-group,
.marque-section-2 .marquee-group {
    animation: none !important;
    transform: none !important;
}

/* ==========================================================================
   3. Image reveals: no dramatic clip/slide/zoom. Show immediately (a short
   fade is provided by the .wow entrance when the wrapper is a .wow element).
   ========================================================================== */
[class*="img-anim"],
.img-animation,
.img-animation img,
.reveal {
    animation: none !important;
    clip-path: none !important;
    opacity: 1 !important;
    transform: none !important;
}

/* ==========================================================================
   4. Defend against GSAP SplitText leaving headings/labels hidden.
   The JS reveals are disabled in main.js; this guarantees text is visible even
   if a split ran before the guard, and keeps chars/lines static.
   ========================================================================== */
.split-title, .tz-sub-tilte, .tz-itm-title, .rr_title_anim,
.split-title .char, .tz-sub-tilte .char, .tz-itm-title .char,
.char, .split-line, .split-line .char {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
}

/* ==========================================================================
   5. Page load: remove the full-screen preloader / cinematic intro.
   Content is usable immediately (a very short fade on the header only).
   ========================================================================== */
#preloader { display: none !important; }
#page { opacity: 1 !important; }
#page.visible .header-section {
    animation: wtFade 0.5s cubic-bezier(0.22, 0.61, 0.36, 1) both !important;
}
#page.visible .hero-1 .hero-content,
#page.visible .hero-1 .hero-thumb,
#page.visible .hero-1 .hero-image,
#page.visible [class*="hero"] [class*="wtIntro"] {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
}

/* ==========================================================================
   6. Blog / news cards: calm, one subtle hover (image scale + shadow lift).
   No combined multi-animations.
   ========================================================================== */
.news-box-items, .news-box-items-2, .blog-box-items, .post-card, .news-card {
    transition: box-shadow 0.3s ease, transform 0.3s ease !important;
}
.news-box-items:hover, .news-box-items-2:hover, .blog-box-items:hover,
.post-card:hover, .news-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 14px 34px rgba(16, 16, 16, 0.10) !important;
}
.news-box-items .post-thumb img, .news-box-items-2 .post-thumb img,
.news-box-items img, .news-box-items-2 img,
.blog-box-items img {
    transition: transform 0.4s ease !important;
}
.news-box-items:hover .post-thumb img, .news-box-items-2:hover .post-thumb img,
.news-box-items:hover img, .news-box-items-2:hover img,
.blog-box-items:hover img {
    transform: scale(1.03) !important;   /* subtle, not a big zoom */
}

/* ==========================================================================
   7. Global image hover cap: any card/thumb image hover zoom stays subtle.
   ========================================================================== */
[class*="thumb"] img,
[class*="image"] img {
    transition: transform 0.4s ease;
}
[class*="thumb"]:hover img,
[class*="image"]:hover img {
    transform: scale(1.03);
}

/* ==========================================================================
   8. Buttons: keep feedback quick and simple (colour/opacity only).
   ========================================================================== */
.theme-btn-main, .theme-btn, .wt-btn, .thems-btn {
    transition: background-color 0.25s ease, color 0.25s ease,
                border-color 0.25s ease, opacity 0.25s ease, box-shadow 0.25s ease !important;
}