/* ============================================
   Responsive Stylesheet
   Mobile-first breakpoints
   ============================================ */

/* Extra Small Devices (Phones, < 480px) */
@media (max-width: 479px) {
    .container {
        padding: 0 var(--space-4);
    }

    h1 { font-size: 2.25rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.375rem; }
    h4 { font-size: 1.125rem; }

    .hero {
        min-height: 90vh;
    }

    .hero-tag {
        font-size: 0.7rem;
        padding: var(--space-2) var(--space-3);
    }

    .hero-stats {
        gap: var(--space-4);
        grid-template-columns: repeat(2, 1fr);
        margin-top: var(--space-8);
    }

    .stat-number { font-size: 1.5rem; }
    .stat-label { font-size: 0.65rem; }

    .btn {
        padding: var(--space-3) var(--space-5);
        font-size: 0.8125rem;
    }

    .btn-large {
        padding: var(--space-3) var(--space-6);
        font-size: 0.875rem;
    }

    .card, .service-card {
        padding: var(--space-6);
    }

    .app-card {
        padding: var(--space-5);
    }

    .section-header {
        margin-bottom: var(--space-10);
    }

    .hero-cta {
        flex-direction: column;
        align-items: stretch;
    }

    .hero-cta .btn {
        width: 100%;
    }

    .scroll-indicator {
        display: none;
    }

    .terminal {
        padding: var(--space-4);
        font-size: 0.75rem;
    }

    .feature-row {
        gap: var(--space-6);
        margin-bottom: var(--space-16);
    }

    .stats-row {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-6);
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }

    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }

    .footer-legal {
        justify-content: center;
    }

    .site-footer {
        padding: var(--space-10) 0 var(--space-6);
    }

    .legal-content {
        padding: var(--space-6);
    }

    .legal-content h2 {
        font-size: 1.5rem;
        margin-top: var(--space-8);
    }

    .legal-content h3 {
        font-size: 1.125rem;
        margin-top: var(--space-6);
    }

    .legal-toc {
        padding: var(--space-4);
    }

    .legal-toc ul {
        columns: 1;
    }

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

    .form-row {
        grid-template-columns: 1fr;
    }
}

/* Small Devices (Tablets, 480px - 768px) */
@media (min-width: 480px) and (max-width: 767px) {
    .container {
        padding: 0 var(--space-5);
    }

    .hero-stats {
        grid-template-columns: repeat(2, 1fr);
    }

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

    .legal-toc ul {
        columns: 1;
    }
}

/* Medium Devices (Tablets, 768px - 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .feature-row {
        grid-template-columns: 1fr;
        gap: var(--space-10);
    }

    .feature-row:nth-child(even) .feature-content {
        order: 1;
    }

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

    .footer-brand {
        grid-column: 1 / -1;
    }

    .stats-row {
        grid-template-columns: repeat(4, 1fr);
    }

    .legal-toc ul {
        columns: 2;
    }

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

/* Tablet landscape / Small Desktop */
@media (min-width: 1024px) and (max-width: 1280px) {
    .grid-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Large Devices (Desktops, > 1280px) */
@media (min-width: 1280px) {
    .container {
        padding: 0 var(--space-8);
    }
}

/* Extra Large Devices (Large Desktops, > 1600px) */
@media (min-width: 1600px) {
    :root {
        --container-max: 1440px;
        --container-wide: 1600px;
    }

    h1 { font-size: 5rem; }
    h2 { font-size: 3.75rem; }
}

/* Mobile Navigation */
@media (max-width: 900px) {
    .header-cta .btn {
        display: none;
    }
}

@media (max-width: 640px) {
    .header-cta {
        gap: var(--space-2);
    }
}

/* Print Styles */
@media print {
    .site-header,
    .site-footer,
    .menu-toggle,
    .scroll-indicator {
        display: none !important;
    }

    body {
        color: #000;
        background: #fff;
    }

    a {
        color: #000;
        text-decoration: underline;
    }

    .container {
        max-width: 100%;
        padding: 0;
    }
}

/* High DPI / Retina */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .hero-bg svg {
        image-rendering: -webkit-optimize-contrast;
    }
}

/* Orientation Specific */
@media (orientation: landscape) and (max-height: 500px) {
    .hero {
        min-height: 100vh;
        padding-top: var(--header-height);
    }

    .scroll-indicator {
        display: none;
    }
}

/* Hover Capabilities */
@media (hover: none) {
    .card:hover,
    .service-card:hover,
    .app-card:hover {
        transform: none;
    }

    .card:hover::before {
        opacity: 0;
    }

    .nav-link::after {
        display: none;
    }
}