/* ============================================
   Code en ligne - Responsive Design
   ============================================ */

/* Tablet */
@media (max-width: 1024px) {
    .crt-hero-grid { grid-template-columns: 1fr; text-align: center; }
    .crt-hero-content { max-width: 100%; margin: 0 auto; }
    .crt-hero-title { font-size: var(--crt-text-5xl); }
    .crt-hero-actions { justify-content: center; }
    .crt-hero-stats { justify-content: center; }
    .crt-hero-visual { display: none; }
    
    .crt-features-grid { grid-template-columns: repeat(2, 1fr); }
    .crt-steps-grid { grid-template-columns: repeat(2, 1fr); }
    .crt-steps-grid::before { display: none; }
    .crt-testimonials-grid { grid-template-columns: repeat(2, 1fr); }
    
    .crt-footer-grid { grid-template-columns: repeat(2, 1fr); }
    
    .crp-stats-grid { grid-template-columns: repeat(2, 1fr); }
    .crp-dashboard-grid { grid-template-columns: 1fr; }
    
    .crt-about-values { grid-template-columns: repeat(2, 1fr); }
    .crt-about-stats { grid-template-columns: repeat(2, 1fr); }
    
    .crt-contact-grid { grid-template-columns: 1fr; }
    
    .crt-anti-grid { grid-template-columns: 1fr; max-width: 500px; }
    .crt-freemium-grid { grid-template-columns: 1fr; max-width: 500px; }
}

/* Mobile */
@media (max-width: 768px) {
    :root {
        --crt-header-height: 64px;
    }

    h1 { font-size: var(--crt-text-3xl); }
    h2 { font-size: var(--crt-text-2xl); }

    .crt-container { padding: 0 var(--crt-space-4); }

    /* Header */
    .crt-nav-links { display: none; }
    .crt-mobile-toggle { display: flex; }
    .crt-mobile-menu { display: block; }
    .crt-nav-actions .crt-btn-ghost,
    .crt-nav-actions .crt-btn-outline:not(.crt-btn-full) { display: none; }

    /* Hero */
    .crt-hero { padding-top: calc(var(--crt-header-height) + var(--crt-space-12)); padding-bottom: var(--crt-space-16); }
    .crt-hero-title { font-size: var(--crt-text-4xl); }
    .crt-hero-subtitle { font-size: var(--crt-text-base); }
    .crt-hero-stats { flex-direction: column; gap: var(--crt-space-4); }
    .crt-hero-actions { flex-direction: column; }
    .crt-hero-actions .crt-btn { width: 100%; }

    /* Features */
    .crt-features-grid { grid-template-columns: 1fr; }
    .crt-section { padding: var(--crt-space-16) 0; }
    .crt-section-title { font-size: var(--crt-text-3xl); }

    /* Steps */
    .crt-steps-grid { grid-template-columns: 1fr; gap: var(--crt-space-8); }

    /* Pricing */
    .crt-pricing-grid { grid-template-columns: 1fr; }
    .crt-pricing-card.featured { transform: none; }

    /* Testimonials */
    .crt-testimonials-grid { grid-template-columns: 1fr; }

    /* Footer */
    .crt-footer-grid { grid-template-columns: 1fr; gap: var(--crt-space-8); }
    .crt-footer-bottom { flex-direction: column; text-align: center; }

    /* Quiz */
    .crp-quiz-header { flex-direction: column; align-items: stretch; }
    .crp-question-text { font-size: var(--crt-text-lg); }
    .crp-results-stats { grid-template-columns: 1fr; }
    .crp-results-actions { flex-direction: column; }
    .crp-results-score { font-size: var(--crt-text-5xl); }

    /* Dashboard */
    .crp-stats-grid { grid-template-columns: 1fr; }
    .crp-quick-actions { grid-template-columns: 1fr; }

    /* Auth */
    .crt-auth-card { padding: var(--crt-space-6); }

    /* About */
    .crt-about-values { grid-template-columns: 1fr; }
    .crt-about-stats { grid-template-columns: repeat(2, 1fr); padding: var(--crt-space-8); }
    .crt-about-hero h1 { font-size: var(--crt-text-3xl); }

    /* Legal */
    .crt-legal-header h1 { font-size: var(--crt-text-3xl); }

    /* Category grid */
    .crp-category-grid { grid-template-columns: 1fr; }

    /* FAQ */
    .crt-faq-question { font-size: var(--crt-text-sm); padding: var(--crt-space-4); }

    /* Social Proof */
    .crt-social-proof { flex-direction: column; gap: var(--crt-space-3); padding: var(--crt-space-4); }
    .crt-social-proof-divider { width: 100%; height: 1px; }

    /* Cookie Banner */
    .crt-cookie-inner { flex-direction: column; text-align: center; }
    .crt-cookie-content { flex-direction: column; align-items: center; }
    .crt-cookie-actions { width: 100%; justify-content: center; }

    /* Anti-Ornikar & Freemium */
    .crt-anti-section { padding: var(--crt-space-16) 0; }
    .crt-anti-grid { grid-template-columns: 1fr; max-width: 100%; }
    .crt-anti-card { padding: var(--crt-space-6); }
    .crt-freemium-section { padding: var(--crt-space-16) 0; }
    .crt-freemium-grid { grid-template-columns: 1fr; max-width: 100%; }
    .crt-freemium-card { padding: var(--crt-space-6); }
    .crt-freemium-price { font-size: var(--crt-text-4xl); }

    /* Comparison Table */
    .crt-comparison-table { font-size: var(--crt-text-xs); display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .crt-comparison-table th,
    .crt-comparison-table td { padding: var(--crt-space-2) var(--crt-space-3); white-space: nowrap; }

    /* Scroll to Top */
    .crt-scroll-top { bottom: var(--crt-space-4); right: var(--crt-space-4); }
    .crt-cookie-banner + .crt-scroll-top.visible { bottom: 100px; }
}

/* Small Mobile */
@media (max-width: 480px) {
    .crt-hero-title { font-size: var(--crt-text-3xl); }
    .crt-logo-text { font-size: var(--crt-text-lg); }
    .crp-stat-card { padding: var(--crt-space-4); }
    .crp-stat-card-value { font-size: var(--crt-text-2xl); }
}

/* Admin bar adjustment */
.admin-bar .crt-header {
    top: 32px;
}

@media (max-width: 782px) {
    .admin-bar .crt-header {
        top: 46px;
    }
}

/* Print */
@media print {
    .crt-header, .crt-footer, .crt-mobile-menu { display: none !important; }
    body.crt-theme { padding-top: 0; }
    .crt-main { min-height: auto; }
}

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

/* Dark mode prep (future) */
@media (prefers-color-scheme: dark) {
    /* Reserved for future dark mode */
}

@media (max-width: 1024px) {
    .crt-process-grid-rich,
    .crt-practice-hero-grid,
    .crp-public-gate,
    .crt-preview-grid {
        grid-template-columns: 1fr;
    }

    .crt-command-center {
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .crt-page-hero {
        padding: calc(var(--crt-header-height) + 2.5rem) 0 3rem;
    }

    .crt-page-hero-content-left {
        text-align: center;
    }

    .crt-page-hero-content-left .crt-page-subtitle {
        margin-left: auto;
        margin-right: auto;
    }

    .crt-command-top,
    .crt-command-footer {
        grid-template-columns: 1fr;
        display: grid;
    }

    .crt-command-top {
        gap: 0.75rem;
    }

    .crt-command-pill {
        width: fit-content;
    }

    .crt-hero-home .crt-hero-title {
        max-width: none;
    }

    .crt-feature-row,
    .crt-preview-card,
    .crt-preview-panel,
    .crp-public-gate-copy,
    .crp-public-gate-card,
    .crt-process-card,
    .crt-benefit-card,
    .crt-program-card,
    .crt-trust-chip,
    .crt-testimonial {
        padding: 1.35rem;
        border-radius: 22px;
    }
}

@media (max-width: 1024px) {
    .crt-road-card-grid,
    .crt-road-sign-grid,
    .crt-route-plan-steps,
    .crt-sign-cluster,
    .crt-public-stage,
    .crt-road-module-card,
    .crt-road-module-card-alt {
        grid-template-columns: 1fr 1fr;
    }

    .crt-road-card-grid,
    .crt-road-card-grid-2,
    .crt-public-stage,
    .crt-road-module-card,
    .crt-road-module-card-alt,
    .crt-route-plan-steps {
        grid-template-columns: 1fr;
    }

    .crt-road-module-card-alt .crt-road-module-media,
    .crt-road-module-card-alt .crt-road-module-copy {
        order: initial;
    }

    .crt-road-proof-strip {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .crt-road-lane {
        display: none;
    }

    .crt-road-story-card {
        grid-template-rows: 220px 1fr;
    }

    .crt-road-sign-grid,
    .crt-sign-cluster,
    .crt-preview-panel-signs {
        grid-template-columns: 1fr;
    }

    .crt-preview-panel-signs img:last-child {
        max-width: none;
    }

    .crt-public-stage-media,
    .crt-scene-frame-main,
    .crt-road-module-media {
        min-height: 280px;
    }

    .crt-scene-overlay-card,
    .crt-public-stage-card {
        position: static;
        width: auto;
        margin: 1rem;
    }

    .crt-route-plan {
        padding: 1.35rem;
    }

    .crt-route-plan-steps::before {
        display: none;
    }

    .crt-route-step {
        padding-top: 4rem;
    }
}