/* ============================================================================
   O'Swiss — Responsive (mobile-first)
   Breakpoints : 480 / 768 / 1024 / 1280
   ============================================================================ */

/* ── Tablette ≥ 768px ──────────────────────────────────────────────────────── */
@media (min-width: 768px) {
    .container { padding: 0 var(--sp-8); }

    .mobile-cta-bar { display: none !important; }
}

/* ── Desktop ≥ 1024px ──────────────────────────────────────────────────────── */
@media (min-width: 1024px) {
    .container { padding: 0 var(--sp-10); }

    .nav__hamburger { display: none; }
    .nav__links { display: flex; }
    .nav__cta { display: flex; }
}

/* ============================================================================
   MOBILE — < 1024px
   ============================================================================ */
@media (max-width: 1023px) {

    /* Nav */
    .nav__links { display: none; }
    .nav__cta   { display: none; }
    .nav__hamburger { display: flex; }

    /* Sticky mobile CTA */
    .mobile-cta-bar {
        display: flex;
    }

    /* Padding bottom pour ne pas cacher le contenu sous la barre sticky */
    body {
        padding-bottom: 80px;
    }

    /* Footer */
    .footer__grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--sp-8);
    }

    /* Info strip */
    .info-strip__grid {
        grid-template-columns: 1fr;
        gap: var(--sp-6);
    }

    /* Contact */
    .contact-grid {
        grid-template-columns: 1fr;
    }

    /* About */
    .about-grid {
        grid-template-columns: 1fr;
        gap: var(--sp-8);
    }
}

/* ============================================================================
   MOBILE — < 768px
   ============================================================================ */
@media (max-width: 767px) {

    :root {
        --nav-height: 64px;
    }

    /* Sections */
    .section    { padding: var(--sp-12) 0; }
    .section-sm { padding: var(--sp-8) 0; }

    /* Hero */
    .hero__ctas {
        flex-direction: column;
    }

    .hero__ctas .btn {
        width: 100%;
        text-align: center;
    }

    .hero__badges {
        gap: var(--sp-2);
    }

    /* Order strip */
    .order-strip__inner {
        grid-template-columns: 1fr;
        gap: var(--sp-3);
    }

    .order-strip__item {
        flex-direction: row;
        text-align: left;
        gap: var(--sp-4);
    }

    /* Specialties */
    .specialties__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--sp-3);
    }

    /* Why cards */
    .why__grid {
        grid-template-columns: 1fr;
    }

    /* Reviews */
    .reviews__meta {
        gap: var(--sp-4);
    }

    .reviews__separator { display: none; }

    .review-card {
        flex: 0 0 calc(100% - var(--sp-4));
    }

    /* Menu */
    .menu-grid {
        grid-template-columns: 1fr;
    }

    .menu-section__header {
        flex-direction: column;
        align-items: flex-start;
    }

    /* Footer */
    .footer__grid {
        grid-template-columns: 1fr;
        gap: var(--sp-8);
    }

    .footer__bottom {
        flex-direction: column;
        text-align: center;
    }

    .footer__legal {
        justify-content: center;
    }

    /* Legal */
    .legal-content {
        padding: var(--sp-8) var(--sp-5);
    }

    /* CTA final */
    .cta-final__buttons {
        flex-direction: column;
    }

    .cta-final__buttons .btn {
        width: 100%;
    }

    /* Contact */
    .contact-ctas {
        gap: var(--sp-2);
    }
}

/* ============================================================================
   MOBILE — < 480px
   ============================================================================ */
@media (max-width: 479px) {

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

    .hero__title {
        font-size: 2.4rem;
    }

    .hero__eyebrow {
        font-size: 0.7rem;
    }

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

    .menu-tabs__inner {
        gap: var(--sp-2);
    }

    .menu-tab-btn {
        padding: 8px 14px;
    }

    .reviews__score-number {
        font-size: 2.5rem;
    }
}

/* ============================================================================
   GRANDS ÉCRANS — > 1280px
   ============================================================================ */
@media (min-width: 1280px) {
    .container {
        padding: 0 var(--sp-12);
    }

    .specialties__grid {
        grid-template-columns: repeat(7, 1fr);
    }
}