/* ========================================
   RESPONSIVE / MEDIA QUERIES
   ======================================== */

/* Tablet (768px) */
@media (max-width: 768px) {
    :root {
        --container-padding: 1rem;
        --space-3xl: 4rem;
        --space-2xl: 3rem;
    }

    h1 {
        font-size: 2rem !important;
    }

    h2 {
        font-size: 1.75rem !important;
    }

    h3 {
        font-size: 1.3rem !important;
    }

    .container {
        padding: 0 1rem;
    }

    .grid--3,
    .grid--4 {
        grid-template-columns: 1fr;
    }

    .grid--2 {
        grid-template-columns: 1fr;
    }
}

/* Mobile (480px) */
@media (max-width: 480px) {
    :root {
        --container-padding: 1rem;
        --space-3xl: 2rem;
        --space-2xl: 1.5rem;
        --space-xl: 1.5rem;
        --font-size-2xl: 1.25rem;
        --font-size-3xl: 1.5rem;
    }

    body {
        font-size: 14px;
    }

    h1 {
        font-size: 1.5rem !important;
    }

    h2 {
        font-size: 1.25rem !important;
    }

    h3 {
        font-size: 1rem !important;
    }

    main {
        margin-top: 64px;
    }

    .btn {
        padding: 0.75rem 1rem;
        font-size: var(--font-size-sm);
        width: 100%;
    }

    /* Header Mobile */
    .navbar__container {
        padding: var(--space-base) var(--container-padding);
    }

    .navbar__logo {
        font-size: 1.5rem;
    }

    /* Hero Mobile */
    .hero {
        min-height: auto;
        padding: var(--space-2xl) var(--container-padding);
    }

    .hero__buttons {
        flex-direction: column;
    }

    .hero__buttons .btn {
        width: 100%;
    }

    /* Form Mobile */
    .form-section__container {
        grid-template-columns: 1fr;
    }

    .form-alliance {
        padding: var(--space-base);
    }
}

/* Large Screens (1400px+) */
@media (min-width: 1400px) {
    :root {
        --container-max-width: 1400px;
    }

    .hero__title {
        font-size: 5.5rem;
    }

    .stats__number {
        font-size: 4rem;
    }
}

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    :root {
        --color-background: #1a1a1a;
        --color-surface: #1f1f1f;
        --color-surface-low: #2a2a2a;
        --color-surface-high: #353535;
        --color-text-primary: #f0eddb;
        --color-text-secondary: #d4c4b5;
    }

    .header {
        background-color: rgba(26, 26, 26, 0.8);
    }

    .form-alliance {
        background-color: #2a2a2a;
    }
}

/* Print Styles */
@media print {
    header,
    .navbar__cta,
    .form-section {
        display: none;
    }

    body {
        font-size: 12pt;
        color: #000;
        background: white;
    }

    main {
        margin-top: 0;
    }

    .hero__image-wrapper {
        break-inside: avoid;
    }
}

/* Accessibility - Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Accessibility - High Contrast */
@media (prefers-contrast: more) {
    :root {
        --color-text-secondary: #000;
        --color-outline: #000;
    }

    .btn--secondary {
        border-width: 3px;
    }

    .form-input {
        border-width: 3px;
    }
}

/* Landscape Mobile */
@media (max-height: 600px) and (orientation: landscape) {
    .hero {
        min-height: 100vh;
    }

    .navbar {
        padding: 0.5rem var(--container-padding);
    }

    main {
        margin-top: 60px;
    }
}

/* Ultra-wide screens */
@media (min-width: 2560px) {
    :root {
        --font-size-base: 1.125rem;
        --space-3xl: 8rem;
        --space-2xl: 6rem;
    }

    .hero__title {
        font-size: 8rem;
    }

    .stats__number {
        font-size: 5rem;
    }
}