/* Duval County Fire Station #2 — Custom Styles */

/* Custom property overrides */
:root {
    --color-forest-50: #f2f7f2;
    --color-forest-100: #e3ede3;
    --color-forest-200: #c6dbC6;
    --color-forest-300: #9dbe9d;
    --color-forest-400: #6a9e6a;
    --color-forest-500: #4a7c4a;
    --color-forest-600: #3a623a;
    --color-forest-700: #2d4a2d;
    --color-forest-800: #243a24;
    --color-forest-900: #1e301e;
    --color-forest-950: #0f1a0f;
    --color-cream-50: #faf8f4;
    --color-cream-100: #f5f0e8;
}

/* Base reset enhancements */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Selection color */
::selection {
    background: #2d4a2d;
    color: #faf8f4;
}

/* Focus visible for accessibility */
:focus-visible {
    outline: 2px solid #2d4a2d;
    outline-offset: 2px;
}

/* Smooth image rendering */
img {
    image-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

/* Prevent overflow issues */
body {
    overflow-x: hidden;
}

/* Hero magazine layout adjustments */
@media (min-width: 769px) {
    .magazine-grid {
        grid-template-columns: 1fr 1.6fr;
    }
}

/* Print styles */
@media print {
    header, footer, #contactForm, #menuBtn {
        display: none !important;
    }
    body {
        color: #000;
        background: #fff;
    }
    .reveal {
        opacity: 1 !important;
        transform: none !important;
    }
}

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

/* High contrast mode support */
@media (forced-colors: active) {
    .img-zoom {
        border: 1px solid CanvasText;
    }
    button, a {
        border: 1px solid CanvasText;
    }
}

/* Large screen adjustments */
@media (min-width: 1400px) {
    .max-w-7xl {
        max-width: 80rem;
    }
}

/* Touch device adjustments */
@media (hover: none) {
    .group:hover .group-hover\\:text-cream-50 {
        color: inherit;
    }
    .group:hover .group-hover\\:bg-forest-800 {
        background-color: inherit;
    }
    .group:hover .group-hover\\:stroke-cream-50 {
        stroke: inherit;
    }
    .group:hover .group-hover\\:text-forest-300 {
        color: inherit;
    }
    .group:hover .group-hover\\:text-forest-700 {
        color: inherit;
    }
    .group:hover .group-hover\\:translate-x-1 {
        transform: none;
    }
}