.elementor-40 .elementor-element.elementor-element-8a6d05d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-40 .elementor-element.elementor-element-bd00a19{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-591dde6 *//* 1. Global Smooth Scroll & Reveal */
html {
    scroll-behavior: smooth;
}

/* 2. Hero Section Subtle Zoom & Motion */
section.relative.min-h-\[600px\] img {
    animation: hero-zoom 20s infinite alternate;
}

@keyframes hero-zoom {
    from { transform: scale(1); }
    to { transform: scale(1.1); }
}

.kinetic-gradient {
    background-size: 200% 200% !important;
    animation: gradient-move 8s ease infinite;
}

@keyframes gradient-move {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* 3. Who We Are - Image Interaction */
.aspect-square.rounded-\[3rem\] {
    transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.aspect-square.rounded-\[3rem\]:hover {
    transform: scale(1.02) rotate(-1deg);
    box-shadow: 0 40px 80px -20px rgba(49, 46, 129, 0.25);
}

/* 4. Timeline (Our Journey) Animations */
/* Timeline Line Grow on Scroll (Modern Browsers) */
.absolute.left-1\/2.w-0\.5 {
    height: 0;
    animation: line-grow linear forwards;
    animation-timeline: view();
    animation-range: entry 10% exit 90%;
}

@keyframes line-grow {
    to { height: 100%; }
}

/* Timeline Cards Reveal */
.bg-surface-container-lowest.p-6.rounded-3xl {
    opacity: 0.5;
    transform: translateY(20px);
    transition: all 0.8s ease;
}

.bg-surface-container-lowest.p-6.rounded-3xl:hover {
    opacity: 1;
    transform: translateY(0);
    border-color: #00675d;
}

/* 5. Service Cards (Solutions) - Kinetic Hover */
.group.p-8.bg-surface-container-lowest {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.group.p-8.bg-surface-container-lowest:hover {
    transform: translateY(-15px);
    background: #ffffff;
    box-shadow: 0 25px 50px -12px rgba(49, 46, 129, 0.1);
}

/* Icon rotation inside cards */
.group:hover .material-symbols-outlined {
    transform: scale(1.2) rotate(8deg);
    transition: transform 0.3s ease;
}

/* 6. Stats Section Counter Glow */
.text-teal-custom {
    text-shadow: 0 0 20px rgba(109, 245, 225, 0.3);
}

/* 7. Why Choose Us - Icon Pulse */
.flex.items-start.p-10:hover .material-symbols-outlined {
    animation: icon-pulse 1s infinite;
}

@keyframes icon-pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

/* 8. Team Member Interaction */
.group .relative.overflow-hidden img {
    transition: transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.group:hover .relative.overflow-hidden img {
    transform: scale(1.15);
}

/* 9. Vision & Mission Glow Effect */
.kinetic-gradient.group:hover, .bg-secondary.group:hover {
    box-shadow: 0 30px 60px -15px rgba(0, 0, 0, 0.3);
}

/* 10. Industry Icons Hover */
.flex.flex-col.items-center.p-6 {
    transition: all 0.3s ease;
}

.flex.flex-col.items-center.p-6:hover {
    background: #ffffff;
    border-color: #6df5e1;
    transform: scale(1.05);
}

/* 11. CTA Button Shine Effect */
button {
    position: relative;
    overflow: hidden;
}

button::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
    transition: 0.5s;
}

button:hover::before {
    left: 100%;
}

/* 12. WhatsApp Floating Animation */
a.fixed.bottom-8.right-8 {
    animation: float-wa 3s ease-in-out infinite;
}

@keyframes float-wa {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}/* End custom CSS */