/* Storefront V2 responsive audit layer — loaded last after page + brand styles. */

html, body { max-width: 100%; overflow-x: clip; }
img, svg, video { max-width: 100%; }

@media (max-width: 1023px) {
    .sf-shell,
    .sf-container { width: min(100% - 1.5rem, 90rem); }

    /* Header: keep identity readable, actions compact, navigation scrollable. */
    .sf-header-v2__announcement-inner {
        justify-content: space-between;
        min-height: 30px;
        gap: .5rem;
        font-size: .67rem;
    }
    .sf-header-v2__announcement-inner > span:not(.sf-header-v2__pulse) {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .sf-header-v2__main {
        grid-template-columns: minmax(0, 1fr) auto;
        min-height: 68px;
        gap: .75rem;
    }
    .sf-header-v2__brand { min-width: 0; }
    .sf-header-v2__logo { width: 44px; height: 44px; border-radius: 14px; }
    .sf-header-v2__logo img { width: 36px; height: 36px; }
    .sf-header-v2__brand-copy strong,
    .sf-header-v2__brand-copy small { max-width: min(42vw, 15rem); }
    .sf-header-v2__brand-copy strong { font-size: .93rem; }
    .sf-header-v2__brand-copy small { font-size: .6rem; }
    .sf-header-v2__main > .sf-header-v2__search { display: none; }
    .sf-header-v2__mobile-search { display: block; }
    .sf-header-v2__mobile-search .sf-header-v2__search { height: 44px; border-radius: 14px; }
    .sf-header-v2__actions { gap: .3rem; }
    .sf-header-v2__icon-action,
    .sf-header-v2__cart,
    .sf-header-v2__currency-static { min-width: 40px; height: 40px; padding-inline: .55rem; }
    .sf-header-v2__icon-action > span:not(.sf-header-v2__currency-code),
    .sf-header-v2__cart-copy { display: none; }
    .sf-header-v2__nav-row {
        position: relative;
        display: flex !important;
        align-items: center;
        min-height: 44px;
        gap: .75rem;
        overflow: visible;
        border-top: 1px solid color-mix(in srgb, var(--brand-500) 10%, #f1f5f9);
    }
    .sf-header-v2__nav-row::after {
        content: "";
        position: absolute;
        inset-block: 0;
        inset-inline-end: 0;
        width: 2.25rem;
        pointer-events: none;
        background: linear-gradient(to left, rgba(255,255,255,.96), transparent);
    }
    [dir="ltr"] .sf-header-v2__nav-row::after {
        background: linear-gradient(to right, rgba(255,255,255,.96), transparent);
    }
    .sf-header-v2__primary-nav {
        display: flex !important;
        align-items: center;
        min-width: 0;
        width: 100%;
        flex: 1 1 auto;
        gap: 1rem;
        overflow-x: auto !important;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-inline: contain;
        scrollbar-width: none;
        white-space: nowrap;
        padding-inline-end: 1.75rem;
    }
    .sf-header-v2__primary-nav::-webkit-scrollbar { display: none; }
    .sf-header-v2__primary-nav a {
        display: inline-flex !important;
        flex: 0 0 auto;
        align-items: center;
        min-height: 42px;
        padding-block: .72rem;
    }
    .sf-header-v2__shop-cta { flex: 0 0 auto; font-size: .68rem; }

    /* Home */
    .sf-home-v2 { gap: clamp(2.5rem, 6vw, 3.5rem); }
    .sf-home-v2__hero,
    .sf-home-v2__hero-content { min-height: 29rem; }
    .sf-home-v2__hero-content { max-width: 100%; padding: clamp(2rem, 6vw, 3rem); }
    .sf-home-v2__hero h1 { font-size: clamp(2.2rem, 8vw, 3.75rem); }
    .sf-home-v2__hero p { max-width: 31rem; font-size: .9rem; }
    .sf-home-v2__trust { max-width: 100%; }

    /* Category discovery */
    .sf-categories-discovery__hero { grid-template-columns: 1fr; align-items: start; }
    .sf-categories-discovery__hero-stat {
        display: flex;
        align-items: baseline;
        gap: .65rem;
        min-width: 0;
        padding-inline-start: 0;
        padding-top: 1rem;
        border-inline-start: 0;
        border-top: 1px solid rgba(255,255,255,.14);
    }
    .sf-categories-discovery__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sf-category-discovery-card:nth-child(7n + 1) { grid-column: span 1; }
    .sf-category-discovery-card:nth-child(7n + 1) .sf-category-discovery-card__media { min-height: 15rem; }
    .sf-categories-discovery__toolbar { align-items: stretch; flex-direction: column; }
    .sf-categories-discovery__controls { width: 100%; flex-wrap: wrap; }
    .sf-categories-discovery__search { flex: 1 1 100%; }

    /* Catalog */
    .sf-catalog__hero,
    .sf-category-v2__hero { min-height: auto; }
    .sf-catalog__toolbar { align-items: stretch; gap: .75rem; }
    .sf-catalog__layout { grid-template-columns: 1fr !important; }
    .sf-catalog__filters {
        position: fixed !important;
        inset: 0 !important;
        z-index: 90;
        display: flex;
        align-items: end;
        padding: 0;
        border: 0 !important;
        border-radius: 0 !important;
        background: rgba(15,23,42,.34) !important;
        backdrop-filter: blur(4px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .2s ease, visibility .2s ease;
    }
    .sf-catalog__filters > form,
    .sf-catalog__filters > .sf-catalog__filters-head { width: 100%; }
    .sf-catalog__filters.is-open { opacity: 1; visibility: visible; pointer-events: auto; }
    .sf-catalog__filters.is-open::before {
        content: "";
        position: absolute;
        inset: auto 0 0;
        height: min(82dvh, 46rem);
        border-radius: 24px 24px 0 0;
        background: #fff;
        box-shadow: 0 -18px 60px -34px rgba(15,23,42,.7);
    }
    .sf-catalog__filters-head,
    .sf-catalog__filters form {
        position: relative;
        z-index: 1;
        background: transparent;
    }
    .sf-catalog__filters-head { padding: 1rem 1rem .6rem; }
    .sf-catalog__filters form {
        max-height: calc(min(82dvh, 46rem) - 4rem);
        overflow-y: auto;
        padding: .4rem 1rem 1.25rem;
    }
    .sf-catalog__filter-actions {
        position: sticky;
        bottom: -.4rem;
        padding-top: .75rem;
        padding-bottom: .4rem;
        background: linear-gradient(180deg, transparent, #fff 24%);
    }
}

@media (max-width: 640px) {
    .sf-shell,
    .sf-container { width: min(100% - 1rem, 90rem); }

    /* Header mobile */
    .sf-header-v2__announcement-inner a { display: none; }
    .sf-header-v2__announcement-inner { justify-content: center; }
    .sf-header-v2__main { min-height: 62px; }
    .sf-header-v2__brand { gap: .55rem; }
    .sf-header-v2__logo { width: 39px; height: 39px; border-radius: 12px; }
    .sf-header-v2__logo img { width: 32px; height: 32px; }
    .sf-header-v2__brand-copy strong { font-size: .84rem; }
    .sf-header-v2__brand-copy small { max-width: 9rem; font-size: .54rem; }
    .sf-header-v2__actions { gap: .2rem; }
    .sf-header-v2__icon-action,
    .sf-header-v2__cart,
    .sf-header-v2__currency-static { min-width: 36px; height: 36px; padding-inline: .42rem; border-radius: 11px; }
    .sf-header-v2__icon-action svg,
    .sf-header-v2__cart svg { width: 17px; height: 17px; }
    .sf-header-v2__currency-code { font-size: .62rem; }
    .sf-header-v2__nav-row {
        display: flex !important;
        min-height: 41px;
        margin-inline: -.1rem;
    }
    .sf-header-v2__primary-nav {
        display: flex !important;
        gap: .9rem;
    }
    .sf-header-v2__primary-nav a { display: inline-flex !important; font-size: .68rem; }
    .sf-header-v2__shop-cta { display: none; }
    .sf-header-v2__mobile-search { padding-bottom: .55rem; }
    .sf-header-v2__mobile-search .sf-header-v2__search { height: 42px; }

    /* Home mobile */
    .sf-home-v2__hero { min-height: 31rem; border-radius: 20px; }
    .sf-home-v2__hero-content { min-height: 31rem; padding: 1.5rem; justify-content: flex-end; }
    .sf-home-v2__hero h1 { font-size: clamp(2rem, 11vw, 3rem); line-height: 1.02; }
    .sf-home-v2__hero p { font-size: .82rem; line-height: 1.75; }
    .sf-home-v2__hero-actions { width: 100%; }
    .sf-home-v2__hero-actions > * { flex: 1 1 auto; justify-content: center; }
    .sf-home-v2__trust { grid-template-columns: 1fr; gap: .2rem; margin-top: 1.25rem; }
    .sf-home-v2__trust div { padding: .5rem 0; }
    .sf-home-v2__section-head { align-items: start; }

    /* Category hub mobile */
    .sf-categories-discovery { padding-block-start: .8rem; }
    .sf-categories-discovery__hero { padding: 1.45rem; border-radius: 20px; }
    .sf-categories-discovery__hero h1 { font-size: 2.35rem; }
    .sf-categories-discovery__hero p { font-size: .78rem; line-height: 1.75; }
    .sf-categories-discovery__grid { grid-template-columns: 1fr; }
    .sf-category-discovery-card { border-radius: 18px; }
    .sf-category-discovery-card__media,
    .sf-category-discovery-card:nth-child(7n + 1) .sf-category-discovery-card__media { min-height: 12.5rem; }
    .sf-categories-discovery__controls { display: grid; grid-template-columns: 1fr 1fr; }
    .sf-categories-discovery__controls > label:not(.sf-categories-discovery__search) { min-width: 0; }
    .sf-categories-discovery__search { grid-column: 1 / -1; }

    /* Catalog mobile */
    .sf-catalog { padding-block-start: .8rem; }
    .sf-catalog__hero,
    .sf-category-v2__hero { padding: 1.35rem !important; border-radius: 20px !important; }
    .sf-catalog__hero h1,
    .sf-category-v2__hero h1 { font-size: 2.15rem !important; }
    .sf-catalog__toolbar { flex-direction: column; padding: .75rem; border-radius: 15px; }
    .sf-catalog__toolbar-main { width: 100%; justify-content: space-between; }
    .sf-catalog__toolbar-sort { width: 100%; justify-content: space-between; }
    .sf-catalog__toolbar-sort select { flex: 1 1 auto; min-width: 0; }
    .sf-catalog__active { gap: .35rem; }
    .sf-catalog__chip { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .sf-product-grid { gap: .7rem !important; }

    /* Product */
    body[data-sf-page="product"] main>div { width: min(100% - 1rem, 90rem); }
    body[data-sf-page="product"] main>div>div:nth-child(2)>div.space-y-6 form>button[type="submit"] { width: 100%; }

    /* Cart / checkout */
    body[data-sf-page="cart"] main>div,
    body[data-sf-page="checkout"] main>div { width: min(100% - 1rem, 90rem); }
    body[data-sf-page="cart"] main aside,
    body[data-sf-page="checkout"] main aside { position: static !important; }
    body[data-sf-page="checkout"] main form>div.space-y-6>div { padding: 1rem; }

    /* Footer */
    .sf-footer-v2 { margin-top: 3rem; }
    .sf-footer-v2__prelude { padding-block: 2rem; }
    .sf-footer-v2__prelude-grid { align-items: stretch; flex-direction: column; gap: 1.25rem; }
    .sf-footer-v2__prelude h2 { font-size: 1.75rem; }
    .sf-footer-v2__prelude p { font-size: .78rem; }
    .sf-footer-v2__cta { width: 100%; justify-content: center; }
    .sf-footer-v2__body { padding-top: 2.5rem; }
    .sf-footer-v2__grid { grid-template-columns: 1fr 1fr; gap: 2rem 1rem; }
    .sf-footer-v2__brand { grid-column: 1 / -1; }
    .sf-footer-v2__bottom { align-items: start; flex-direction: column; margin-top: 2.25rem; }
}

@media (max-width: 380px) {
    .sf-header-v2__brand-copy small { display: none; }
    .sf-header-v2__currency-static { display: none; }
    .sf-footer-v2__grid { grid-template-columns: 1fr; }
    .sf-footer-v2__brand { grid-column: auto; }
}
