/* ==========================================================================
   RESPONSIVE LAYOUT OVERRIDES - LUXURY AUTO
   ========================================================================== */

@media (max-width: 1200px) {
    .nav-parent-link {
        padding: 10px 10px;
        font-size: 0.72rem;
        letter-spacing: 1.4px;
    }

    .mega-logo .logo-wordmark {
        font-size: 1.45rem;
        letter-spacing: 3px;
    }
}

@media (max-width: 1024px) {
    .slide-content h2 {
        font-size: 3.5rem;
    }

    .car-details-grid, .profile-grid, .contact-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .main-detail-img {
        height: 380px;
    }

    /* Hide nav actions text, keep only essential buttons */
    .mega-nav-actions .btn-outline { display: none; }
}

/* ── Mobile Breakpoint ────────────────────────────────────────────────────── */
@media (max-width: 900px) {

    /* 1. Show hamburger, hide desktop nav */
    .mega-hamburger {
        display: flex !important;
    }

    .mega-nav {
        display: none !important;
    }

    .mega-nav-actions {
        display: none !important;
    }

    .mobile-drawer {
        display: flex !important;
    }

    .nav-overlay {
        display: block !important;
    }

    /* 2. Tighten header */
    header.main-header { padding: 14px 0; }
    header.main-header.scrolled { padding: 10px 0; }

    .header-spacer { height: 70px; }
}

@media (max-width: 768px) {
    /* Hero Slider */
    .slide-content h2 {
        font-size: 2.5rem;
    }

    .slide-content p {
        font-size: 1rem;
        margin-bottom: 30px;
    }

    .slider-control {
        width: 45px;
        height: 45px;
        font-size: 1.1rem;
    }

    .slider-control.prev { left: 15px; }
    .slider-control.next { right: 15px; }

    /* 3. Filter Grid Collapse */
    .search-filter-section { margin-top: -30px; }
    .filter-wrapper { padding: 25px; }
    .filter-grid { grid-template-columns: 1fr; }

    /* 4. Form Grids */
    .form-grid { grid-template-columns: 1fr; }
    .form-group.full-width { grid-column: span 1; }

    /* 5. Car Details Gallery */
    .gallery-thumbs { grid-template-columns: repeat(4, 1fr); gap: 10px; }
    .thumb-img { height: 70px; }
    .details-spec-card { padding: 25px; }
    .spec-list-grid { grid-template-columns: 1fr; }

    /* 6. Dashboard Tables */
    .wishlist-table-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
        padding: 20px 0;
    }

    .wishlist-table-row .btn-outline { width: 100%; }
}

@media (max-width: 480px) {
    .section-title { font-size: 1.8rem; }
    .slide-content h2 { font-size: 2rem; }
    .slide-content { padding: 0 20px; }
    .dynamic-page-content { padding: 30px 20px; }
    .auth-card { padding: 30px 20px; }

    .mobile-drawer { width: 100%; right: -100%; }
}
