/* =============================================
   Responsive Design
   ============================================= */

@media (max-width: 1200px) {
    .container { padding: 0 32px; }
}

@media (max-width: 992px) {
    .section { padding: 80px 0; }
    .section-lg { padding: 100px 0; }
    h1 { font-size: clamp(2rem, 5vw, 3rem); }
    h2 { font-size: clamp(1.75rem, 4vw, 2.5rem); }
    h3 { font-size: clamp(1.25rem, 3vw, 1.75rem); }

    .header-inner { padding: 0 24px; }
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 40px;
    }
    .split { gap: 60px; }
    .legal-content { padding: 60px 24px; }
}

@media (max-width: 768px) {
    :root { --header-height: 60px; }
    .container { padding: 0 20px; }
    .section { padding: 60px 0; }
    .section-lg { padding: 80px 0; }
    .section-header { margin-bottom: 60px; }
    .feature-card, .app-card, .value-card { padding: 32px 24px; }
    .split { grid-template-columns: 1fr; gap: 40px; }
    .split-image { aspect-ratio: 16/10; }
    .contact-grid { grid-template-columns: 1fr; gap: 40px; }
    .footer-grid { grid-template-columns: 1fr; gap: 40px; }
    .footer-bottom { flex-direction: column; text-align: center; }
    .footer-legal { justify-content: center; }
    .news-grid { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .hero { min-height: 90vh; }
    .hero-actions { flex-direction: column; align-items: stretch; max-width: 300px; margin: 0 auto; }
    .hero-actions .btn { width: 100%; }
    .legal-toc { padding: 24px; }
    .legal-toc ol { columns: 1; }
    .page-header { padding: calc(var(--header-height) + 60px) 0 60px; }
}

@media (max-width: 480px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.5rem; }
    .container { padding: 0 16px; }
    .header-inner { padding: 0 16px; }
    .brand-text { display: none; }
    .footer { padding: 60px 0 24px; }
    .stats-grid { gap: 16px; }
    .stat-number { font-size: 2rem; }
    .marquee-item { font-size: 1.1rem; }
    .back-to-top {
        bottom: 20px;
        right: 20px;
        width: 40px;
        height: 40px;
    }
}

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

/* 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;
    }
}

/* Print styles */
@media print {
    .site-header,
    .site-footer,
    .back-to-top,
    .scroll-progress,
    .loader { display: none; }
    body { color: #000; background: #fff; }
    .legal-content { padding: 0; max-width: 100%; }
}

/* Dark mode support (optional, but Tesla-style is typically light/dark sections) */
@media (prefers-color-scheme: dark) {
    :root {
        --color-bg: #ffffff;
        --color-bg-gray: #f4f4f4;
    }
}
