/* ===========================================================================
   Pequenalau — camada responsiva unificada
   Carregada depois de style.css. Concentra aqui os ajustes de tela para
   substituir os 14 breakpoints antigos por 4 padrões:
     base (mobile)  ->  480px  ->  768px  ->  1024px  ->  1280px
   =========================================================================== */

:root {
    --page-gutter: 1rem;
    --tabbar-height: 4.25rem;
    --drawer-width: min(86vw, 20rem);
    --tap-target: 2.75rem;
}

@media (min-width: 768px) {
    :root { --page-gutter: 1.75rem; }
}

@media (min-width: 1280px) {
    :root { --page-gutter: 2.5rem; }
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    overflow-x: hidden;
    text-wrap: pretty;
}

img, video, svg, canvas {
    max-width: 100%;
    height: auto;
}

/* Impede que grades e tabelas largas estourem a tela do celular. */
#container, main, section, .home-shell, .card, .row {
    min-width: 0;
}

/* Home: uma largura e um gutter para todos os blocos, incluindo o rodape.
   O ID iguala a especificidade dos estilos legados da home. */
#home_page .home-shell,
#home_page .home-site-header-inner,
#home_page .home-footer-content,
#home_page .footer-bottom {
    width: 100%;
    max-width: 72rem;
    margin-inline: auto;
    padding-inline: var(--page-gutter);
}

#home_page .home-section {
    padding-inline: 0;
}

@media (min-width: 1024px) and (max-width: 1279.98px) {
    #home_page .home-site-header-inner { gap: 0.75rem; }
    #home_page .home-header-logo { width: 10rem; }
    #home_page .home-header-nav { gap: 0.875rem; }
    #home_page .home-header-search { width: 10rem; }
}

@media (max-width: 1023.98px) {
    #home_page .home-site-header-inner {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.5rem;
    }

    #home_page .home-header-nav,
    #home_page .home-header-search { display: none; }

    #home_page .home-header-brand { gap: 0.35rem; }
    #home_page .home-header-logo { width: clamp(6rem, 25vw, 11rem); }
    #home_page .home-header-actions { gap: 0.1rem; }

    #home_page .home-hero-grid,
    #home_page .home-comfort-grid,
    #home_page .newsletter-grid { grid-template-columns: minmax(0, 1fr); }

    #home_page .home-hero-media { justify-self: center; }

    #home_page .home-product-rail,
    #home_page .shortcut-grid,
    #home_page .home-collection-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
    #home_page .home-hero-grid { gap: 1.5rem; }

    #home_page .home-collection-grid,
    #home_page .shortcut-grid,
    #home_page .benefits-grid { grid-template-columns: minmax(0, 1fr); }

    #home_page .home-collection-card.is-featured { grid-column: auto; }

    #home_page .home-product-rail {
        display: grid;
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: min(78%, 17rem);
        gap: 1rem;
        margin-inline: 0;
        padding: 0 0 0.75rem;
        overflow-x: auto;
        scroll-snap-type: x proximity;
    }

    #home_page .home-product-card { min-width: 0; }
}

/* ---------- Acessibilidade ---------- */

.skip-to-content {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, -120%);
    z-index: 2000;
    padding: 0.65rem 1.1rem;
    border-radius: 0 0 0.75rem 0.75rem;
    background: #3d2b34;
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.2s ease;
}

.skip-to-content:focus {
    transform: translate(-50%, 0);
    color: #fff;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid #b5657f;
    outline-offset: 2px;
    border-radius: 0.35rem;
}

.visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* Área de toque mínima recomendada (44px) nos controles principais. */
.home-header-menu-button,
.drawer-trigger-button,
.site-drawer-close,
.pagination .page-link,
.home-header-actions a,
.home-header-actions button {
    min-width: var(--tap-target);
    min-height: var(--tap-target);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Evita o zoom automático do iOS em campos de formulário. */
@media (max-width: 767.98px) {
    input,
    select,
    textarea {
        font-size: 1rem;
    }
}

/* ---------- Menu lateral (drawer) ---------- */

.site-drawer {
    position: fixed;
    inset: 0;
    z-index: 1400;
}

.site-drawer[hidden] { display: none; }

.site-drawer-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(30, 18, 24, 0.5);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.site-drawer.is-open .site-drawer-backdrop { opacity: 1; }

.site-drawer-panel {
    position: absolute;
    inset-block: 0;
    inset-inline-end: 0;
    width: var(--drawer-width);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.15rem 1.15rem calc(1.15rem + env(safe-area-inset-bottom));
    background: #fff;
    box-shadow: -18px 0 40px rgba(61, 43, 52, 0.18);
    transform: translateX(100%);
    transition: transform 0.22s ease;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.site-drawer.is-open .site-drawer-panel { transform: translateX(0); }

.site-drawer-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 2.5rem;
    padding: 0 0.1rem 0.25rem;
    background: transparent;
    border: 0;
    box-shadow: none;
    position: static;
}

.site-drawer-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: #3d2b34;
}

.site-drawer-close {
    border: 0;
    background: #f6eef1;
    border-radius: 999px;
    color: #3d2b34;
    font-size: 1.05rem;
}

.site-drawer-search {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 3rem;
    padding: 0 0.95rem;
    border: 1px solid #eadde3;
    border-radius: 999px;
    background: #fdfafb;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.site-drawer-search:focus-within {
    border-color: #d7a5b7;
    box-shadow: 0 0 0 3px rgba(181, 101, 127, 0.14);
}

.site-drawer-search i {
    flex: 0 0 auto;
    color: #a58c96;
    pointer-events: none;
}

.site-drawer-search input {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    min-height: calc(var(--tap-target) - 0.1rem);
    padding: 0;
    border: 0;
    background: transparent;
    color: #3d2b34;
    font-weight: 600;
    outline: 0;
}

.site-drawer-search input:focus,
.site-drawer-search input:focus-visible {
    box-shadow: none;
    outline: 0;
}

.site-drawer-search input::-webkit-search-cancel-button,
.site-drawer-search input::-webkit-search-decoration {
    appearance: none;
    -webkit-appearance: none;
    display: none;
}

.site-drawer-nav {
    display: flex;
    flex-direction: column;
}

.site-drawer-nav a {
    padding: 0.85rem 0.35rem;
    border-bottom: 1px solid #f2e7ec;
    color: #3d2b34;
    font-weight: 600;
    text-decoration: none;
}

.site-drawer-nav a:hover,
.site-drawer-nav a:focus-visible { color: #b5657f; }

.site-drawer-footer {
    margin-top: auto;
    display: grid;
    gap: 0.35rem;
}

.site-drawer-footer a {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-height: var(--tap-target);
    padding: 0.5rem 0.35rem;
    color: #5b4550;
    text-decoration: none;
    font-weight: 600;
}

body.has-drawer-open {
    overflow: hidden;
    touch-action: none;
}

@media (min-width: 1024px) {
    .site-drawer-panel { width: 22rem; }
}

/* ---------- Barra inferior de atalhos (mobile) ---------- */

.mobile-tabbar {
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: 1200;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    padding-bottom: env(safe-area-inset-bottom);
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(8px);
    border-top: 1px solid #f0e2e8;
    box-shadow: 0 -6px 20px rgba(61, 43, 52, 0.08);
}

.mobile-tabbar a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    min-height: var(--tabbar-height);
    padding: 0.4rem 0.15rem;
    color: #7b6470;
    font-size: 0.7rem;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
}

.mobile-tabbar a.is-active { color: #b5657f; }

.mobile-tabbar-icon {
    position: relative;
    font-size: 1.15rem;
    line-height: 1;
}

.mobile-tabbar-count {
    position: absolute;
    top: -0.5rem;
    inset-inline-start: 0.7rem;
    min-width: 1.1rem;
    padding: 0 0.25rem;
    border-radius: 999px;
    background: #b5657f;
    color: #fff;
    font-size: 0.62rem;
    line-height: 1.1rem;
    text-align: center;
}

@media (max-width: 1023.98px) {
    body:has(.mobile-tabbar) {
        padding-bottom: calc(var(--tabbar-height) + env(safe-area-inset-bottom));
    }

    /* Botões flutuantes sobem para não ficarem atrás da barra. */
    .whatsapp-float {
        bottom: calc(var(--tabbar-height) + 0.85rem) !important;
    }
}

@media (min-width: 1024px) {
    .mobile-tabbar { display: none; }
}

/* ---------- Estrutura de página ---------- */

.home-shell,
.container,
.container-fluid {
    width: 100%;
    padding-inline: var(--page-gutter);
    margin-inline: auto;
}

.home-shell { max-width: 78rem; }

/* ---------- Catálogo e vitrines ---------- */

/* 2 produtos por linha no celular: menos rolagem e mais comparação. */
@media (max-width: 575.98px) {
    .catalog-grid {
        --bs-gutter-x: 0.75rem;
        --bs-gutter-y: 0.75rem;
    }

    .catalog-grid > * {
        flex: 0 0 50%;
        width: 50%;
        max-width: 50%;
    }

    .catalog-grid .product-card-title,
    .catalog-grid .card-title {
        font-size: 0.92rem;
    }
}

/* Trilhas de produtos da home viram carrossel com encaixe no celular. */
@media (max-width: 767.98px) {
    .home-product-rail {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: 72%;
        gap: 0.85rem;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding-inline: var(--page-gutter);
        margin-inline: calc(var(--page-gutter) * -1);
        scrollbar-width: none;
    }

    .home-product-rail::-webkit-scrollbar { display: none; }
    .home-product-rail > * { scroll-snap-align: start; }
}

@media (max-width: 767.98px) {
    .home-hero-grid,
    .home-comfort-grid,
    .newsletter-grid,
    .home-collection-grid,
    .benefits-grid,
    .shortcut-grid {
        grid-template-columns: 1fr;
    }

    .home-hero-media { order: -1; }

    .home-section-heading {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
}

@media (min-width: 768px) and (max-width: 1023.98px) {
    .shortcut-grid,
    .benefits-grid,
    .home-collection-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Tipografia fluida evita títulos quebrados em telas pequenas. */
h1, .home-hero-copy h1 { font-size: clamp(1.75rem, 5.2vw, 3.25rem); line-height: 1.12; }
h2 { font-size: clamp(1.4rem, 3.6vw, 2.25rem); line-height: 1.18; }
h3 { font-size: clamp(1.15rem, 2.4vw, 1.6rem); }

/* ---------- Página de produto ---------- */

/* O zoom fica recortado na moldura, sem alterar a largura da galeria. */
@media (hover: hover) and (pointer: fine) {
    #product_detail_page .product-main-image.has-hover-zoom {
        cursor: zoom-in;
        overflow: hidden;
    }

    #product_detail_page .product-main-image.has-hover-zoom img {
        transform-origin: var(--product-zoom-x, 50%) var(--product-zoom-y, 50%);
    }

    #product_detail_page .product-main-image.is-zoomed:not(.is-dragging) img {
        transform: scale(2.2);
        transition: none;
    }

    #product_detail_page .product-main-image.is-zoomed {
        cursor: zoom-in;
    }
}

@media (max-width: 767.98px) {
    .product-detail-grid,
    .product-page-grid {
        grid-template-columns: 1fr;
    }

    .product-gallery-thumbs {
        display: flex;
        gap: 0.5rem;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .product-gallery-thumbs::-webkit-scrollbar { display: none; }
    .product-gallery-thumbs > * { flex: 0 0 auto; scroll-snap-align: start; }

    .product-size-options,
    .product-variant-options {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .product-size-options label,
    .product-variant-options label {
        min-height: var(--tap-target);
        display: inline-flex;
        align-items: center;
    }
}

/* ---------- Formulários, carrinho e checkout ---------- */

@media (max-width: 767.98px) {
    .row > [class*="col-"] { margin-bottom: 0.25rem; }

    .cart-item,
    .checkout-summary-row {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .btn,
    button[type="submit"] {
        min-height: var(--tap-target);
    }

    /* Ações principais ocupam a largura toda: alvo maior no dedo. */
    .cart-actions .btn,
    .checkout-actions .btn,
    form .btn-block {
        width: 100%;
    }
}

/* ---------- Tabelas do painel ---------- */

.table-responsive {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

@media (max-width: 767.98px) {
    .admin-table th,
    .admin-table td {
        white-space: nowrap;
    }

    .admin-list-controls,
    .admin-filters {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
}

/* ---------- Impressão e preferências do usuário ---------- */

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}

@media print {
    .mobile-tabbar,
    .site-drawer,
    .whatsapp-float,
    header,
    footer {
        display: none !important;
    }
}

/* ---------- Catálogo: filtros no celular ---------- */

@media (max-width: 1023.98px) {
    .catalog-filter-drawer > summary {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        min-height: var(--tap-target);
        cursor: pointer;
        list-style: none;
    }

    .catalog-filter-drawer > summary::-webkit-details-marker { display: none; }

    /* Grupos de filtro em duas colunas: menos rolagem para achar a opção. */
    .catalog-filter-group {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.35rem 0.75rem;
    }

    .catalog-filter-group h3 {
        grid-column: 1 / -1;
        margin-bottom: 0.1rem;
    }

    .catalog-filter-group label {
        min-height: 2.25rem;
        display: flex;
        align-items: center;
        gap: 0.45rem;
    }

    .catalog-filter-group .filter-size-options,
    .catalog-filter-group .catalog-size-options {
        grid-column: 1 / -1;
    }
}

/* ---------- Barra de compra da página de produto ---------- */

@media (max-width: 1023.98px) {
    body.store-chrome-page .product-mobile-buybar {
        bottom: calc(var(--tabbar-height) + env(safe-area-inset-bottom)) !important;
        z-index: 1150;
        box-shadow: 0 -8px 24px rgba(61, 43, 52, 0.12);
    }

    #product_detail_page.store-chrome-page:has(.product-mobile-buybar) {
        padding-bottom: calc(var(--tabbar-height) + 5.5rem + env(safe-area-inset-bottom));
    }

    /* Com a barra de compra visível, o WhatsApp sobe mais um degrau. */
    #product_detail_page .whatsapp-float {
        bottom: calc(var(--tabbar-height) + 5.25rem) !important;
    }
}

/* ---------- Opções de frete na página de produto ---------- */

.product-freight-options {
    display: grid;
    gap: 0.4rem;
    margin: 0.6rem 0 0;
    padding: 0;
    list-style: none;
}

.product-freight-options li {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.5rem 0.65rem;
    border: 1px solid #efe1e7;
    border-radius: 0.65rem;
    background: #fff;
    font-size: 0.9rem;
}

.product-freight-options li span { color: #5b4550; }
.product-freight-options li strong { white-space: nowrap; color: #3d2b34; }

.product-freight-form {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.product-freight-form input { flex: 1 1 10rem; min-height: var(--tap-target); }
.product-freight-form button { min-height: var(--tap-target); }

/* Recomendacoes: cabecalho e cards independentes das grades do catalogo. */
body#product_detail_page .related-products .section-heading {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.5rem;
    text-align: left;
    margin-bottom: 1.25rem;
}

body#product_detail_page .related-products .section-heading p {
    margin: 0;
    font-size: 0.875rem;
}

body#product_detail_page .related-products h2 {
    margin: 0;
    font-size: clamp(1.65rem, 4vw, 2.25rem);
    line-height: 1.2;
}

.related-products-hint { display: none; }

body#product_detail_page .related-products .product-card-image {
    border: 0;
}

body#product_detail_page .related-products .product-card-image-link > img:not(.product-card-sale-badge) {
    object-fit: cover !important;
}

@media (min-width: 768px) and (max-width: 1023.98px) {
    body#product_detail_page .related-products .row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    body#product_detail_page .related-products {
        padding: 1.75rem var(--page-gutter) 2rem;
        min-width: 0;
    }

    body#product_detail_page .related-products .section-heading {
        margin-bottom: 0.5rem;
    }

    body#product_detail_page .related-products-hint {
        display: block;
        margin: 0 0 1rem;
        font-size: 0.8rem;
        color: var(--home-muted);
    }

    body#product_detail_page .related-products .row {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: min(78%, 17rem);
        justify-content: start !important;
        gap: 1rem;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x proximity;
        padding-block: 0.25rem 1rem;
        scrollbar-width: thin;
    }

    body#product_detail_page .related-products .row > .col {
        min-width: 0;
        scroll-snap-align: start;
    }

    body#product_detail_page .related-products .product-card-image {
        aspect-ratio: auto;
    }

    body#product_detail_page .related-products .product-card-image-link {
        aspect-ratio: 2 / 3;
        height: auto;
        position: relative;
    }

    body#product_detail_page .related-products .product-card-actions {
        position: static;
        justify-content: flex-end;
        gap: 0.5rem;
        padding: 0.5rem;
        border-top: 1px solid var(--home-border);
    }

    body#product_detail_page .related-products .product-card-actions form {
        margin: 0;
    }

    body#product_detail_page .related-products .product-card-actions button {
        width: 44px;
        height: 44px;
        min-height: 44px;
    }

    body#product_detail_page .related-products .product-card h6 {
        display: block;
        overflow: visible;
        min-height: 0;
        font-size: 0.9375rem;
        line-height: 1.4;
    }

    body#product_detail_page .related-products .product-card-meta {
        white-space: normal;
        overflow: visible;
        line-height: 1.5;
    }

    body#product_detail_page .related-products .product-price {
        font-size: 1rem;
        line-height: 1.5;
    }

    body#product_detail_page.product-browsing-recommendations .product-mobile-buybar,
    body#product_detail_page.product-browsing-recommendations .whatsapp-float {
        visibility: hidden;
        pointer-events: none;
    }
}

/* ===========================================================================
   Matriz responsiva final
   Esta camada fica por ultimo para neutralizar larguras rigidas herdadas sem
   duplicar o desenho de cada pagina.
   =========================================================================== */

/* Conteudo textual e componentes flex/grid nunca devem forcar overflow. */
:where(
    .home-site-header-inner,
    .home-header-brand,
    .home-header-actions,
    .home-footer-content,
    .catalog-layout,
    .catalog-results,
    .product-detail-grid,
    .product-info,
    .cart-layout,
    .checkout-layout,
    .order-customer-grid,
    .account-layout,
    .admin-layout,
    .admin-content
) > * {
    min-width: 0;
}

:where(p, li, dd, td, th, label, .alert, .shipping-message) {
    overflow-wrap: anywhere;
}

:where(input, select, textarea, button) {
    max-width: 100%;
}

:where(.table-responsive, .order-document-table-wrap, .admin-table-wrap) {
    max-width: 100%;
    overflow-x: auto;
    scrollbar-gutter: stable;
    -webkit-overflow-scrolling: touch;
}

/* Monitores largos: limita o comprimento das linhas e aproveita o espaco. */
@media (min-width: 1280px) {
    body.store-chrome-page :where(
        .home-site-header-inner,
        .home-footer-content,
        .catalog-content,
        .product-detail-layout,
        .cart-content,
        .checkout-content
    ) {
        max-width: 78rem;
        margin-inline: auto;
    }

    body.store-chrome-page .catalog-grid.row {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* Notebook e tablet horizontal. */
@media (min-width: 1024px) and (max-width: 1279.98px) {
    body.store-chrome-page .home-site-header-inner {
        gap: 0.75rem;
    }

    body.store-chrome-page .home-header-nav {
        gap: clamp(0.75rem, 1.7vw, 1.35rem);
    }

    body.store-chrome-page .home-header-logo {
        width: 10rem;
    }

    body.store-chrome-page .home-header-search {
        width: clamp(10rem, 18vw, 13rem);
    }

    body.store-chrome-page .catalog-layout {
        gap: 1.75rem;
        grid-template-columns: 14rem minmax(0, 1fr);
    }

    body.store-chrome-page .product-detail-grid {
        gap: clamp(1.75rem, 4vw, 3rem);
        grid-template-columns: minmax(0, 1fr) minmax(20rem, 23rem);
    }
}

/* Tablet: navegacao compacta e layouts principais em uma coluna. */
/* A partir de 1024px, restaura tambem a posicao dos filhos da grade.
   O breakpoint legado de 1100px os mantinha presos na primeira coluna. */
@media (min-width: 1024px) and (max-width: 1100px) {
    body#product_detail_page.store-chrome-page .product-media-column {
        grid-column: 1;
        grid-row: 1;
        order: 0;
    }

    body#product_detail_page.store-chrome-page .product-info {
        grid-column: 2;
        grid-row: 1 / span 2;
        order: 0;
    }

    body#product_detail_page.store-chrome-page .product-info-panels {
        grid-column: 1;
        grid-row: 2;
        order: 0;
    }
}

@media (min-width: 768px) and (max-width: 1023.98px) {
    /* Miniaturas verticais dentro da coluna de 72px, sem a grade antiga
       de quatro colunas de 88px vazando para a foto principal. */
    body#product_detail_page .product-gallery.has-thumbnails .product-thumbnails {
        grid-column: 1;
        grid-row: 1;
        grid-template-columns: minmax(0, 1fr);
        align-content: start;
        margin-top: 0;
        max-height: 620px;
        overflow-x: hidden;
        overflow-y: auto;
        padding: 0;
    }

    body.store-chrome-page .home-site-header-inner {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    body.store-chrome-page .home-header-menu-button {
        display: inline-flex;
    }

    body.store-chrome-page .home-header-nav,
    body.store-chrome-page .home-header-search {
        display: none;
    }

    body.store-chrome-page .home-header-logo {
        width: clamp(8.5rem, 22vw, 11rem);
    }

    body.store-chrome-page :where(.catalog-layout, .cart-layout, .checkout-layout) {
        grid-template-columns: minmax(0, 1fr);
    }

    body.store-chrome-page .catalog-sidebar,
    body.store-chrome-page :where(.cart-summary-box, .checkout-summary) {
        position: static;
    }

    body.store-chrome-page .catalog-grid.row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.store-chrome-page .product-detail-grid,
    body.store-chrome-page .product-info-panels,
    .order-customer-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.store-chrome-page .product-info {
        position: static;
    }

    body:is(#home_page, .store-chrome-page) .home-footer-content {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body:is(#home_page, .store-chrome-page) .home-footer-brand,
    body:is(#home_page, .store-chrome-page) .home-footer-trust,
    body:is(#home_page, .store-chrome-page) .home-footer-payments {
        grid-column: 1 / -1;
    }
}

/* Celular. */
@media (max-width: 767.98px) {
    :root {
        --page-gutter: clamp(0.875rem, 4vw, 1.25rem);
    }

    body.store-chrome-page .home-site-header-inner {
        gap: 0.5rem;
        grid-template-columns: minmax(0, 1fr) auto;
        padding-inline: var(--page-gutter);
    }

    body.store-chrome-page .home-header-brand {
        gap: 0.35rem;
    }

    body.store-chrome-page .home-header-menu-button {
        display: inline-flex;
        flex: 0 0 auto;
    }

    body.store-chrome-page .home-header-logo {
        width: clamp(7rem, 34vw, 8.5rem);
    }

    body.store-chrome-page .home-header-nav,
    body.store-chrome-page .home-header-search {
        display: none;
    }

    body.store-chrome-page .home-header-actions {
        gap: 0.1rem;
    }

    body.store-chrome-page .home-header-actions :where(a, button),
    body.store-chrome-page .home-header-icon {
        width: var(--tap-target);
        height: var(--tap-target);
    }

    .site-drawer-panel {
        width: min(92vw, 22rem);
    }

    .home-hero-grid {
        gap: 1.5rem;
    }

    .home-section,
    body.store-chrome-page :where(
        .catalog-content,
        .product-detail-layout,
        .cart-content,
        .checkout-content
    ) {
        padding-inline: var(--page-gutter);
    }

    .home-hero-stats,
    body.store-chrome-page :where(.catalog-results-toolbar, .cart-page-heading, .checkout-page-heading) {
        align-items: stretch;
        flex-wrap: wrap;
    }

    body.store-chrome-page :where(.catalog-layout, .cart-layout, .checkout-layout) {
        gap: 1.25rem;
        grid-template-columns: minmax(0, 1fr);
    }

    body.store-chrome-page .catalog-sidebar,
    body.store-chrome-page :where(.cart-summary-box, .checkout-summary, .product-info) {
        position: static;
    }

    body.store-chrome-page .catalog-results-toolbar {
        gap: 0.75rem;
        grid-template-columns: minmax(0, 1fr);
    }

    body.store-chrome-page .catalog-sort-control,
    body.store-chrome-page .catalog-sort-control select {
        width: 100%;
    }

    body.store-chrome-page .catalog-grid.row {
        display: grid;
        gap: 1.25rem 0.75rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        margin-inline: 0;
    }

    body.store-chrome-page .catalog-grid > * {
        max-width: none;
        padding-inline: 0;
        width: auto;
    }

    body.store-chrome-page .product-detail-grid,
    body.store-chrome-page .product-info-panels,
    .order-customer-grid,
    .order-customer-delivery-layout {
        gap: 1rem;
        grid-template-columns: minmax(0, 1fr);
    }

    body.store-chrome-page .product-gallery.has-thumbnails {
        grid-template-columns: minmax(0, 1fr);
    }

    body.store-chrome-page .product-gallery.has-thumbnails .product-thumbnails {
        display: flex;
        grid-row: auto;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
    }

    body.store-chrome-page .product-thumbnails button {
        flex: 0 0 4rem;
        scroll-snap-align: start;
    }

    body.store-chrome-page :where(.product-info, .cart-items-list, .cart-summary-box, .checkout-panel, .checkout-summary),
    .order-customer-card {
        padding: clamp(0.875rem, 4vw, 1.25rem);
    }

    body.store-chrome-page .checkout-site-header-inner {
        grid-template-columns: var(--tap-target) minmax(0, 1fr) auto;
        padding-inline: var(--page-gutter);
    }

    body.store-chrome-page .checkout-secure-label {
        font-size: 0.75rem;
    }

    .order-document-topbar,
    .order-document-actions,
    .admin-page-heading,
    .admin-heading-actions,
    .admin-list-controls,
    .admin-filters {
        align-items: stretch;
        flex-direction: column;
    }

    .order-document-actions :where(.btn, button),
    .admin-heading-actions :where(.btn, button, a) {
        width: 100%;
    }

    body:is(#home_page, .store-chrome-page) .home-footer-content {
        gap: 1.75rem;
        grid-template-columns: minmax(0, 1fr);
        padding-inline: var(--page-gutter);
    }

    body:is(#home_page, .store-chrome-page) :where(.home-footer-brand, .home-footer-trust, .home-footer-payments) {
        grid-column: auto;
    }

    body:is(#home_page, .store-chrome-page) .footer-bottom {
        align-items: center;
        flex-direction: column;
        gap: 0.4rem;
        padding-inline: var(--page-gutter);
        text-align: center;
    }
}

/* O rodape e irmao do #container: nao precisa do deslocamento de 50vw. */
body:is(#home_page, .store-chrome-page) > footer {
    left: auto;
    margin-inline: 0;
    min-width: 0;
    width: 100%;
}

body:is(#home_page, .store-chrome-page) .home-footer-content > * {
    min-width: 0;
}

@media (max-width: 767.98px) {
    body:is(#home_page, .store-chrome-page) .home-footer-content {
        padding-block: 2rem;
        text-align: center;
    }

    body:is(#home_page, .store-chrome-page) .home-footer-brand {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    body:is(#home_page, .store-chrome-page) .home-footer-payments ul {
        justify-content: center;
        max-width: none;
        margin-inline: auto;
    }

    body:is(#home_page, .store-chrome-page) .footer-bottom p {
        margin: 0;
        max-width: 100%;
    }
}

/* Celulares estreitos e zoom elevado. */
@media (max-width: 359.98px) {
    :root {
        --page-gutter: 0.75rem;
        --tap-target: 2.625rem;
    }

    .mobile-tabbar a {
        font-size: 0.625rem;
    }

    body.store-chrome-page .home-header-logo {
        width: 6.5rem;
    }

    body.store-chrome-page .catalog-grid.row {
        grid-template-columns: minmax(0, 1fr);
    }

    .catalog-filter-group {
        grid-template-columns: minmax(0, 1fr);
    }

    .catalog-filter-group h3,
    .catalog-filter-group .filter-size-options,
    .catalog-filter-group .catalog-size-options {
        grid-column: auto;
    }

    .product-freight-options li {
        align-items: flex-start;
        flex-direction: column;
    }

    .product-freight-options li strong {
        white-space: normal;
    }

    body.store-chrome-page .checkout-secure-label {
        max-width: 4.5rem;
        text-align: right;
    }
}

/* Altura curta (celular deitado): preserva area util. */
@media (max-height: 520px) and (orientation: landscape) {
    :root { --tabbar-height: 3.5rem; }

    .mobile-tabbar a {
        flex-direction: row;
        font-size: 0.65rem;
        min-height: var(--tabbar-height);
    }

    .site-drawer-panel {
        gap: 0.5rem;
        padding-block: 0.65rem;
    }
}