@media (max-width: 1080px) {
    .card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .timeline-grid,
    .trust-items,
    .slider-track {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .slider-track {
        grid-auto-columns: calc(50% - 0.7rem);
    }
}

@media (max-width: 900px) {
    .hero-grid,
    .split-layout,
    .mentor-grid,
    .offer-grid,
    .payment-grid,
    .result-content,
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .nav-toggle {
        display: inline-flex;
    }

    .nav-menu {
        position: absolute;
        top: calc(100% - 0.5rem);
        left: 1rem;
        right: 1rem;
        display: none;
        flex-direction: column;
        align-items: stretch;
        padding: 1rem;
        border-radius: 24px;
        background: rgba(8, 16, 31, 0.96);
        border: 1px solid rgba(123, 227, 255, 0.12);
    }

    .nav-menu.open {
        display: flex;
    }

    .hero {
        padding-top: 1.5rem;
    }
}

@media (max-width: 720px) {
    .section {
        padding: 4.25rem 0;
    }

    .card-grid,
    .timeline-grid,
    .trust-items,
    .countdown {
        grid-template-columns: 1fr;
    }

    .videos-carousel {
        grid-auto-columns: minmax(100vw, 100vw);
    }

    .slider-track {
        grid-auto-columns: 100%;
    }

    .hero-copy h1 {
        font-size: clamp(2.5rem, 12vw, 3.8rem);
    }

    .quiz-meta,
    .hero-actions,
    .quiz-actions,
    .payment-card-top {
        align-items: stretch;
        flex-direction: column;
    }

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

    .button,
    .button-small {
        width: 100%;
    }
}

@media (max-width: 520px) {
    .container {
        width: min(100% - 1.2rem, 100%);
    }

    .metric-card,
    .pulse-card,
    .offer-countdown,
    .result-card,
    .checkout-card,
    .narrative-card,
    .faq-item,
    .guarantee-box,
    .quiz-shell,
    .hero-card,
    .offer-panel,
    .payment-summary,
    .payment-card,
    .timeline-card,
    .testimonial-card,
    .symptom-card,
    .wound-card,
    .bonus-grid article,
    .final-cta .container {
        padding: 1.25rem;
    }

    .hero-highlights li,
    .feature-list li {
        padding-left: 1.15rem;
    }
}