/**

 * FLAME & CO. — Responsive

 * Mobile-first overrides pour plateforme commande

 */



/* ═══════════════════════════════════════

   TABLETTE & MOBILE — ≤991px

   ═══════════════════════════════════════ */

@media (max-width: 991.98px) {

    :root {

        --navbar-height: 64px;

        --section-padding: clamp(48px, 6vw, 80px);

    }



    /* ─── Hero mobile éditorial ─── */

    .hero-order {

        min-height: 100svh;

        min-height: 100dvh;

        display: flex;

        flex-direction: column;

        justify-content: flex-start;

        align-items: stretch;

        padding-top: var(--nav-shell-offset, 120px);

        padding-bottom: 3.5rem;

    }



    .hero-order-inner {

        flex: 1;

        display: flex;

        flex-direction: column;

        justify-content: center;

    }



    .hero-order-grid {

        --bs-gutter-y: 0.75rem;

    }



    .hero-order-visual {

        position: relative;

    }



    .hero-order-copy {

        text-align: left;

        padding-top: 0.25rem;

    }



    .hero-order-copy .delivery-badge {

        margin-bottom: 1rem;

        font-size: 0.8125rem;

    }



    .hero-order-title {

        font-size: clamp(2.85rem, 11.5vw, 4.25rem);

        line-height: 0.92;

        letter-spacing: -0.01em;

        margin-bottom: 0.875rem;

    }



    .hero-order-desc {

        margin-left: 0;

        margin-right: 0;

        max-width: none;

        font-size: 1rem;

        line-height: 1.55;

        margin-bottom: 1.5rem;

    }



    .hero-order-actions {

        justify-content: stretch;

        margin-bottom: 1.25rem;

    }



    .hero-order-actions .btn {

        width: 100%;

        justify-content: center;

        min-height: 52px;

    }



    /* Visuel produit — spotlight */

    .hero-burger-stage {

        min-height: clamp(210px, 36svh, 340px);

        margin-bottom: 0;

        padding: 0.5rem 0 1rem;

    }



    .hero-burger-glow {

        width: 90%;

        height: 70%;

        filter: blur(32px);

        opacity: 0.85;

    }



    .hero-burger-img {

        width: min(74vw, 360px);

        max-width: none;

        border-radius: 1.25rem;

        filter: drop-shadow(0 16px 40px rgba(0, 0, 0, 0.45));

    }



    .hero-quick-order {

        position: absolute;

        bottom: 0;

        left: 50%;

        transform: translateX(-50%);

        margin-top: 0;

        width: calc(100% - 2rem);

        max-width: 320px;

        justify-content: center;

        white-space: normal;

        text-align: center;

        padding-top: 0.75rem;

        padding-bottom: 0.75rem;

    }



    .hero-video {

        object-position: center 35%;

        transform: scale(1.15);

    }



    .hero-video-overlay {

        background:

            linear-gradient(180deg, rgba(8, 8, 8, 0.55) 0%, rgba(8, 8, 8, 0.72) 38%, rgba(8, 8, 8, 0.94) 100%),

            radial-gradient(ellipse at 50% 20%, rgba(230, 57, 70, 0.22) 0%, transparent 55%);

    }



    /* Chips & promos — scroll horizontal premium */

    .hero-menu-chips {

        flex-wrap: nowrap;

        overflow-x: auto;

        -webkit-overflow-scrolling: touch;

        scroll-snap-type: x mandatory;

        scrollbar-width: none;

        gap: 0.5rem;

        margin-left: calc(-1 * var(--bs-gutter-x, 0.75rem) * 0.5);

        margin-right: calc(-1 * var(--bs-gutter-x, 0.75rem) * 0.5);

        padding: 0.15rem calc(var(--bs-gutter-x, 0.75rem) * 0.5) 0.35rem;

        margin-bottom: 1rem;

    }



    .hero-menu-chips::-webkit-scrollbar {

        display: none;

    }



    .hero-menu-chip {

        flex-shrink: 0;

        scroll-snap-align: start;

        padding: 0.5rem 0.95rem;

        font-size: 0.8125rem;

    }



    .promo-strip {

        justify-content: flex-start;

        flex-wrap: nowrap;

        overflow-x: auto;

        -webkit-overflow-scrolling: touch;

        scroll-snap-type: x mandatory;

        scrollbar-width: none;

        gap: 0.5rem;

        margin-left: calc(-1 * var(--bs-gutter-x, 0.75rem) * 0.5);

        margin-right: calc(-1 * var(--bs-gutter-x, 0.75rem) * 0.5);

        padding: 0.15rem calc(var(--bs-gutter-x, 0.75rem) * 0.5) 0.25rem;

    }



    .promo-strip::-webkit-scrollbar {

        display: none;

    }



    .promo-chip {

        flex-shrink: 0;

        scroll-snap-align: start;

    }



    .hero-scroll-cue {

        display: flex;

    }



    /* Checkout stack */

    .checkout-box {

        grid-template-columns: 1fr;

        gap: 2rem;

    }



    .checkout-box-content {

        text-align: center;

    }



    .checkout-perks {

        align-items: center;

    }



    .success-steps {

        flex-direction: column;

        align-items: center;

    }



    .success-actions {

        flex-direction: column;

        width: 100%;

    }



    .success-actions .btn {

        width: 100%;

    }



    /* Footer stack */

    .footer-minimal-inner {

        flex-direction: column;

        text-align: center;

    }



    /* Menu grid */

    .menu-grid {

        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));

        gap: 1rem;

    }



    .menu-section-header {

        flex-direction: column;

        text-align: center;

    }

}



/* ═══════════════════════════════════════

   MOBILE — ≤767px

   ═══════════════════════════════════════ */

@media (max-width: 767.98px) {

    .hero-order {

        padding-bottom: 3rem;

    }



    .hero-order-title {

        font-size: clamp(2.65rem, 13vw, 3.75rem);

    }



    .hero-burger-stage {

        min-height: clamp(200px, 34svh, 300px);

    }



    .hero-burger-img {

        width: min(78vw, 320px);

    }



    .menu-grid {

        grid-template-columns: 1fr;

    }



    .combo-card {

        padding: 1.25rem;

    }



    /* Cart panel pleine largeur */

    .cart-panel {

        width: 100vw;

    }



    .cart-panel-header,

    .cart-panel-body,

    .cart-panel-footer {

        padding-left: 1rem;

        padding-right: 1rem;

    }



    /* Sticky cart */

    .sticky-cart-inner {

        padding: 0.75rem 1rem;

    }



    .sticky-cart-total {

        font-size: 1.25rem;

    }



    .sticky-cart .btn-flame {

        padding: 0.6rem 1rem;

        font-size: 0.85rem;

    }



    .category-nav-scroll {

        padding: 0 0.75rem;

        gap: 0.4rem;

    }



    .category-nav-scroll .category-pill {

        padding: 0.4rem 0.85rem;

        font-size: 0.8rem;

    }



    /* Navbar compact */

    .navbar-brand {

        font-size: 1.25rem;

    }



    .brand-icon {

        width: 32px;

        height: 32px;

        font-size: 1rem;

    }



    .btn-cart {

        width: 40px;

        height: 40px;

    }



    /* Promo chips wrap */

    .promo-chip {

        font-size: 0.75rem;

    }



    /* Checkout padding bas pour sticky cart */

    .section-checkout {

        padding-bottom: calc(var(--section-padding) + var(--sticky-cart-height) + 1rem);

    }



    #back-to-top {

        right: 1rem;

        width: 40px;

        height: 40px;

    }

}



/* ═══════════════════════════════════════

   PETIT MOBILE — ≤480px

   ═══════════════════════════════════════ */

@media (max-width: 480px) {

    .hero-order-copy .delivery-badge {

        width: 100%;

        justify-content: center;

    }



    .hero-order-title br {

        display: none;

    }



    .hero-order-title .text-gradient {

        display: block;

    }



    .hero-burger-img {

        width: min(82vw, 300px);

    }



    .hero-quick-order {

        max-width: none;

        width: calc(100% - 1rem);

        font-size: 0.875rem;

    }



    .order-card-footer {

        flex-wrap: wrap;

    }



    .btn-add {

        flex: 1;

        justify-content: center;

    }

}



/* ═══════════════════════════════════════

   TRÈS PETIT — ≤380px

   ═══════════════════════════════════════ */

@media (max-width: 380px) {

    .hero-order-title {

        font-size: clamp(2.35rem, 14vw, 3rem);

    }



    .hero-menu-chip {

        font-size: 0.75rem;

        padding: 0.45rem 0.75rem;

    }

}



/* ═══════════════════════════════════════

   TOUCH — désactiver effets 3D

   ═══════════════════════════════════════ */

@media (hover: none) and (pointer: coarse) {

    .menu-card-3d .order-card-inner,

    .combo-card.menu-card-3d {

        transform: none !important;

        box-shadow: var(--shadow-card) !important;

    }



    .hero-burger-3d {

        transform: none !important;

    }



    .btn-glow:hover {

        animation: none;

        transform: none;

    }



    .order-card:hover .order-card-img img {

        transform: none;

    }



    .btn-flame:hover {

        transform: none;

    }



    .btn-add:hover {

        transform: none;

    }



    .hero-scroll-cue i {

        animation: none;

    }

}



/* ═══════════════════════════════════════

   DESKTOP LARGE — ≥1400px

   ═══════════════════════════════════════ */

@media (min-width: 1400px) {

    .menu-grid {

        grid-template-columns: repeat(4, 1fr);

    }



    .hero-order-title {

        font-size: 5.5rem;

    }

}



/* ═══════════════════════════════════════

   SAFE AREAS — iPhone notch

   ═══════════════════════════════════════ */

@supports (padding: env(safe-area-inset-bottom)) {

    .sticky-cart {

        padding-bottom: env(safe-area-inset-bottom);

    }



    .cart-panel {

        padding-bottom: env(safe-area-inset-bottom);

    }



    .hero-order {

        padding-left: max(0px, env(safe-area-inset-left));

        padding-right: max(0px, env(safe-area-inset-right));

    }

}



/* ═══════════════════════════════════════

   PRINT — masquer UI interactive

   ═══════════════════════════════════════ */

@media print {

    #page-loader,

    #sauce-pour,

    #section-bg,

    #scroll-progress,

    #main-navbar,

    .category-nav-mobile,

    .cart-panel,

    .cart-overlay,

    .sticky-cart,

    #back-to-top {

        display: none !important;

    }



    body {

        background: white;

    }

}

