/* =============================================
   Responsive - Mobile First
   ============================================= */

/* --- Mobile (< 768px) --- */
@media (max-width: 767px) {
    /* Header */
    .header__nav,
    .header__actions .btn {
        display: none;
    }

    .header__burger {
        display: flex;
    }

    /* Hero */
    .hero {
        min-height: 500px;
    }

    .hero__title {
        font-size: clamp(1.8rem, 7vw, 2.5rem);
    }

    .hero__subtitle {
        font-size: var(--fs-sm);
    }

    .hero__actions {
        flex-direction: column;
    }

    .hero .swiper-button-prev,
    .hero .swiper-button-next {
        display: none;
    }

    /* Search bar */
    .search-bar {
        margin-top: calc(-1 * var(--space-xl));
        padding: var(--space-md);
    }

    .search-bar__form {
        flex-direction: column;
    }

    .search-bar__btn {
        width: 100%;
    }

    /* Grilles */
    .grid--2,
    .grid--3,
    .grid--4 {
        grid-template-columns: 1fr;
    }

    .vehicles-grid {
        grid-template-columns: 1fr !important;
    }

    /* Cartes vehicules : actions visibles en permanence sur mobile (pas de hover tactile) */
    .card__actions {
        opacity: 1 !important;
        transform: none !important;
    }

    .card__action {
        background: rgba(10, 10, 10, 0.85);
    }

    .process-steps {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
    }

    /* Footer */
    .footer__main {
        grid-template-columns: 1fr;
        gap: var(--space-xl);
    }

    .footer__car-deco {
        width: 70%;
        right: -25%;
        opacity: 0.15;
    }

    .footer__bottom {
        flex-direction: column;
        gap: var(--space-md);
        text-align: center;
    }

    /* Booking */
    .vehicle-detail__grid {
        grid-template-columns: 1fr;
    }

    .vehicle-detail__specs {
        grid-template-columns: 1fr;
    }

    .booking-form__row {
        grid-template-columns: 1fr;
    }

    .booking-summary__row {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space-xs);
    }

    /* Category tabs */
    .category-tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
        justify-content: flex-start;
        padding-bottom: var(--space-sm);
        -webkit-overflow-scrolling: touch;
    }

    .category-tab {
        flex-shrink: 0;
    }

    /* Steps indicator */
    .steps {
        gap: var(--space-sm);
    }

    .step__label {
        display: none;
    }

    .step__line {
        width: 30px;
    }

    /* Phone lookup */
    .phone-lookup__input-group {
        flex-direction: column;
    }

    /* Confirmation */
    .confirmation__actions {
        flex-direction: column;
    }
}

/* --- Tablet (768px - 1023px) --- */
@media (min-width: 768px) and (max-width: 1023px) {
    .header__nav {
        gap: var(--space-md);
    }

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

    .vehicles-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

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

    .process-steps {
        gap: var(--space-lg);
    }
}

/* --- Desktop (1024px+) --- */
@media (min-width: 1024px) {
    .header__burger {
        display: none;
    }

    .vehicles-grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}