/* Custom overrides and adjustments for the theme */

/* Glassmorphism utility */
.glass-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

/* Modern Grid Background for Hero */
.bg-grid-pattern {
    background-size: 40px 40px;
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    mask-image: radial-gradient(ellipse at center, black 10%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse at center, black 10%, transparent 70%);
}

/* Hero Entrance Animations */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(25px);
        filter: blur(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}

.animate-fade-up {
    animation: fadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    opacity: 0;
}

.delay-100 { animation-delay: 100ms; transition-delay: 100ms; }
.delay-200 { animation-delay: 200ms; transition-delay: 200ms; }
.delay-300 { animation-delay: 300ms; transition-delay: 300ms; }
.delay-400 { animation-delay: 400ms; transition-delay: 400ms; }
.delay-500 { animation-delay: 500ms; transition-delay: 500ms; }

/* Mobile Dropdown Animation */
@keyframes dropdownBlur {
    from {
        opacity: 0;
        transform: translateY(-10px);
        filter: blur(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}

.animate-dropdown {
    animation: dropdownBlur 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    transform-origin: top;
}

/* Smooth Floating Animation */
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

.animate-float {
    animation: float 6s ease-in-out infinite;
}

/* Living Gradient Animations (Top to Bottom Flow) */
@keyframes living1 {
    0%, 100% { transform: translateY(-60%) scale(1); }
    50% { transform: translateY(60%) scale(1.2); }
}

@keyframes living2 {
    0%, 100% { transform: translateY(60%) scale(1.2); }
    50% { transform: translateY(-60%) scale(1); }
}

.animate-living-1 {
    animation: living1 12s ease-in-out infinite;
    will-change: transform;
}

.animate-living-2 {
    animation: living2 16s ease-in-out infinite;
    will-change: transform;
}

/* Hover Interactions */
.service-card {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border-bottom: 3px solid transparent;
}

.service-card:hover {
    transform: translateY(-5px);
    border-bottom-color: #DF2012;
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.1);
}

.icon-bounce {
    transition: transform 0.3s ease;
}

.group:hover .icon-bounce {
    transform: scale(1.15) translateY(-5px);
    color: #DF2012;
}

/* Scroll Animations */
.scroll-animate {
    opacity: 0;
    transform: translateY(30px);
    filter: blur(12px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1), filter 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform, filter;
}

.scroll-animate.is-visible {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

/* Ensures the contact form success message pulses naturally */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .5; }
}
.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Ensure smooth scrolling when clicking anchor links */
html {
    scroll-behavior: smooth;
}

/* Make sure the navbar doesn't block anchor targets */
:target {
    scroll-margin-top: 5rem; /* 80px */
}