/* Animate.css scroll-triggered animations */
.animate__animated {
    opacity: 1 !important;
    visibility: visible !important;
}

.animate__animated.animate-hidden {
    opacity: 0 !important;
    visibility: hidden !important;
}

/* Hide backInLeft animation by default */
.animate__backInLeft {
    opacity: 0 !important;
    visibility: hidden !important;
    animation: none !important;
}

/* Show when not hidden */
.animate__backInLeft:not(.animate-hidden) {
    opacity: 1 !important;
    visibility: visible !important;
    animation: backInLeft 1s ease-out !important;
}

/* Header entrance animations */

/* Override Animate.css classes for custom animation */
.header-right.animate__animated,
.header-left .btnTextMe.animate__animated,
.header-left h2.animate__animated,
.header-left h1.animate__animated {
    animation: none !important;
    opacity: 0;
    transform: translateY(-100vh);
    transition: all 0.8s ease-out;
}

/* Animation delays for sequential fall */
.header-right.animate__animated {
    transition-delay: 0.1s;
}

.header-left .btnTextMe.animate__animated {
    transition-delay: 0.3s;
}

.header-left h2.animate__animated {
    transition-delay: 0.5s;
}

.header-left h1.animate__animated {
    transition-delay: 0.7s;
}

/* Animated state when header comes into view */
header.animate .header-right.animate__animated,
header.animate .header-left .btnTextMe.animate__animated,
header.animate .header-left h2.animate__animated,
header.animate .header-left h1.animate__animated {
    opacity: 1;
    transform: translateY(0);
}

/* Form entrance animations - rewritten from scratch */

/* Form elements start hidden and above viewport */
.getInTouch button[type="submit"],
.getInTouch textarea,
.getInTouch input[type="tel"],
.getInTouch input[type="text"] {
    opacity: 0;
    transform: translateY(-100vh);
    transition: all 0.8s ease-out;
}

/* Animation delays for sequential fall */
.getInTouch input[type="text"] {
    transition-delay: 0.1s;
}
.getInTouch input[type="tel"] {
    transition-delay: 0.3s;
}
.getInTouch textarea {
    transition-delay: 0.5s;
}
.getInTouch button[type="submit"] {
    transition-delay: 0.7s;
}

/* Animated state when form comes into view */
.getInTouch.animate button[type="submit"],
.getInTouch.animate textarea,
.getInTouch.animate input[type="tel"],
.getInTouch.animate input[type="text"] {
    opacity: 1;
    transform: translateY(0);
}

/* Hover Effects */

/* Header button hover effect */
.header-left .btnTextMe {
    transition: all 0.3s ease;
    cursor: pointer;
}

.header-left .btnTextMe:hover {
    background-color: #E55600;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(255, 97, 0, 0.3);
}

/* Services cards hover effects */
.services-card {
    transition: all 0.3s ease;
    cursor: pointer;
}

.services-card:hover {
    transform: translateY(-5px);
}

.services-card:hover .services-light {
    filter: blur(15px);
    opacity: 0.8;
}

.services-card:hover h4 {
    color: #FF6100;
}

/* Before & After cards hover effects */
.BeforeAfter-card {
    transition: all 0.3s ease;
    cursor: pointer;
}

.BeforeAfter-card:hover {
    transform: scale(1.02);
    /* box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15); */
}

.BeforeAfter-card:hover img {
    filter: brightness(1.1);
}

/* Learn more button hover effect */
.learnMore {
    transition: all 0.3s ease;
}

.learnMore:hover {
    color: #FF6100;
}

.learnMore:hover svg {
    transform: translateX(3px);
}

/* Form inputs hover effects */


.form-group input:hover,
.form-group textarea:hover {
    border-color: #FF6100;
    box-shadow: 0 0 0 2px rgba(255, 97, 0, 0.1);
}

/* Footer links hover effects */
.footer3col > a {
    transition: color 0.3s ease;
}

.footer3col > a:hover {
    color: #fff;
}

/* Footer payment icons hover effects */
.footer4col > div {
    transition: all 0.3s ease;
    cursor: pointer;
}

.footer4col > div:hover {
    transform: translateY(-2px);
}

.footer4col > div:hover svg {
    filter: brightness(1.2);
}

/* Service areas points hover effects */
.point-wrap > div {
    transition: all 0.3s ease;
    cursor: pointer;
}

.point-wrap > div:hover {
    background-color: #FF6100;
    transform: scale(1.2);
}

.point-wrap:hover p {
    color: #FF6100;
    font-weight: 600;
}

/* Orange bar text hover effect */
.orange-bar-content span:hover {
    opacity: 1;
    transform: scale(1.05);
}

/* Smooth transitions for all interactive elements */
* {
    transition: color 0.3s ease, background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;
}





/* Wave animations for modal */
.modal-wave {
    position: absolute;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 97, 0, 0.3) 0%, rgba(255, 97, 0, 0.1) 50%, transparent 100%);
    animation: modalWave 2s ease-out infinite;
    pointer-events: none;
}

.modal-wave:nth-child(1) {
    animation-delay: 0s;
}

.modal-wave:nth-child(2) {
    animation-delay: 0.5s;
}

.modal-wave:nth-child(3) {
    animation-delay: 1s;
}

@keyframes modalWave {
    0% {
        width: 0;
        height: 0;
        opacity: 1;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    100% {
        width: 300px;
        height: 300px;
        opacity: 0;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
}

/* Wave animations for Text me buttons */
.btnTextMe {
    position: relative;
    overflow: hidden;
}

.btnTextMe::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transform: translateY(-50%);
    animation: buttonWave 3s ease-in-out infinite;
}

@keyframes buttonWave {
    0% {
        left: -100%;
    }
    50% {
        left: 100%;
    }
    100% {
        left: 100%;
    }
}

/* Different delays for different buttons */
.header-left .btnTextMe::before {
    animation-delay: 0s;
}

.modal-content .btnTextMe::before {
    animation-delay: 1.5s;
}