/* Custom styles for Emergency Response website */

/* Smooth transitions for all interactive elements */
a, button {
    transition: all 0.2s ease;
}

/* Ensure proper spacing for fixed navbar */
section {
    scroll-margin-top: 80px;
}

/* Geometric shapes animation */
@keyframes float {
    0%, 100% { transform: translateY(0px) rotate(0deg); }
    50% { transform: translateY(-20px) rotate(5deg); }
}

@keyframes float-slow {
    0%, 100% { transform: translateY(0px) rotate(45deg); }
    50% { transform: translateY(-15px) rotate(50deg); }
}

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

.geo-diamond {
    animation: float-slow 8s ease-in-out infinite;
}

/* Stagger animations for service cards */
.service-card:nth-child(1) { transition-delay: 0.05s; }
.service-card:nth-child(2) { transition-delay: 0.1s; }
.service-card:nth-child(3) { transition-delay: 0.15s; }
.service-card:nth-child(4) { transition-delay: 0.2s; }
.service-card:nth-child(5) { transition-delay: 0.25s; }
.service-card:nth-child(6) { transition-delay: 0.3s; }

/* Mobile link hover effect */
.mobile-link {
    position: relative;
}

.mobile-link::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: #9333ea;
    transition: width 0.3s ease;
}

.mobile-link:hover::after {
    width: 100%;
}

/* Button ripple effect */
button, a {
    position: relative;
    overflow: hidden;
}

/* Focus visible for accessibility */
*:focus-visible {
    outline: 3px solid #a855f7;
    outline-offset: 2px;
    border-radius: 4px;
}

/* Print styles */
@media print {
    .nav-glass, .geo-shape, #mobile-menu, #menu-overlay {
        display: none !important;
    }
    
    body {
        color: #000;
        background: #fff;
    }
    
    .hero-gradient {
        background: #581c87 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    html {
        scroll-behavior: auto;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .service-card {
        border-width: 2px;
    }
    
    .nav-glass {
        border-bottom-width: 2px;
    }
}

/* Tablet adjustments */
@media (min-width: 768px) and (max-width: 1023px) {
    .geo-shape.geo-circle.w-96 {
        display: none;
    }
}

/* Small phone adjustments */
@media (max-width: 374px) {
    h1 {
        font-size: 2.25rem !important;
    }
    
    .hero-gradient {
        padding: 2rem 1rem;
    }
}