.elementor-kit-364{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-7f0f8f6:#61CE7057;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Smooth scrolling - keep this always */
html {
    scroll-behavior: smooth;
}

/* Base setup: start hidden & shifted down */
.elementor-widget,
.elementor-section,
.elementor-column,
.elementor-container,
.elementor-inner-section,
.elementor-text-editor,
.elementor-heading {  /* Focus more on text/content for your request */
    opacity: 0;
    transform: translateY(60px);  /* Smaller distance for mobile-friendliness */
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

/* On larger screens: use modern scroll-driven if supported */
@supports (animation-timeline: view()) and (min-width: 768px) {  /* Desktop/tablet only */
    .elementor-widget,
    .elementor-section,
    .elementor-column,
    .elementor-container,
    .elementor-inner-section,
    .elementor-text-editor,
    .elementor-heading {
        animation: reveal-up linear forwards;
        animation-timeline: view();
        animation-range: entry 0% cover 35%;  /* Triggers earlier for smoother mobile-like feel */
    }

    @keyframes reveal-up {
        from {
            opacity: 0;
            transform: translateY(60px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}

/* Fallback for ALL devices (including mobile): force reveal when in view-ish */
/* But we can't truly detect view without JS, so use a trick: reduce shift on small screens + faster transition */
@media (max-width: 767px) {  /* Mobile only */
    .elementor-widget,
    .elementor-section,
    .elementor-column,
    .elementor-container,
    .elementor-inner-section,
    .elementor-text-editor,
    .elementor-heading {
        transform: translateY(30px);      /* Much smaller shift - less jarring on touch scroll */
        transition-duration: 0.6s;        /* Faster so it feels instant-ish but smooth */
        transition-delay: 0.1s;           /* Tiny delay helps flow */
    }

    /* Optional: if you want almost no animation on very small screens (better perf) */
    /* opacity: 1; transform: none; transition: none; */
}

/* Extra: Respect reduced motion preference (good for mobile users) */
@media (prefers-reduced-motion: reduce) {
    .elementor-widget,
    .elementor-section,
    .elementor-column,
    .elementor-container,
    .elementor-inner-section,
    .elementor-text-editor,
    .elementor-heading {
        transition: none !important;
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}/* End custom CSS */