/* =============================================================================
   Dimimos — Tema (Bootstrap 5.3 customizado por variáveis CSS)
   Mobile-first. Coral (#FF6B4A) é exclusivo dos botões de compra.
   Verde (#2EC4B6) é exclusivo de selos de confiança, "em estoque" e frete grátis.
   ============================================================================= */

/* -----------------------------------------------------------------------------
   1. Tokens
   ----------------------------------------------------------------------------- */
:root {
    /* Paleta da marca */
    --dm-fundo: #FFF9F3;
    --dm-fundo-card: #FFFFFF;
    --dm-fundo-foto: #FFFDF9;
    --dm-texto: #2D2A32;
    --dm-texto-suave: #5F5A66;
    --dm-pessego: #FFB5A7;
    --dm-pessego-claro: #FFE6DF;
    --dm-ceu: #A8DADC;
    --dm-ceu-claro: #E4F3F4;
    --dm-manteiga: #FFE8A3;
    --dm-manteiga-claro: #FFF5D9;
    --dm-cta: #FF6B4A;
    --dm-cta-hover: #F2532F;
    --dm-cta-ativo: #E0461F;
    --dm-verde: #2EC4B6;
    --dm-verde-claro: #DDF6F3;
    --dm-verde-texto: #0B6B63;       /* versão escura do verde, AA sobre fundos claros */
    --dm-estrela: #E5A50A;
    --dm-erro: #B3261E;
    --dm-borda: #F1E6DA;
    --dm-borda-forte: #E2D3C3;

    /* Forma */
    --dm-raio-sm: 14px;
    --dm-raio: 20px;
    --dm-raio-lg: 24px;
    --dm-sombra: 0 6px 20px rgba(45, 42, 50, .06);
    --dm-sombra-hover: 0 14px 34px rgba(45, 42, 50, .11);
    --dm-sombra-flutuante: 0 10px 30px rgba(45, 42, 50, .18);

    /* Tipografia */
    --dm-fonte: "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --dm-fonte-titulo: "Baloo 2", "Nunito", system-ui, sans-serif;

    /* Layout */
    --dm-header-altura: 128px;
    --dm-transicao: .25s cubic-bezier(.2, .7, .3, 1);

    /* ---- Bootstrap ---- */
    --bs-body-bg: var(--dm-fundo);
    --bs-body-bg-rgb: 255, 249, 243;
    --bs-body-color: var(--dm-texto);
    --bs-body-color-rgb: 45, 42, 50;
    --bs-body-font-family: var(--dm-fonte);
    --bs-body-font-size: 1rem;
    --bs-body-line-height: 1.6;
    --bs-heading-color: var(--dm-texto);
    --bs-secondary-color: var(--dm-texto-suave);
    --bs-emphasis-color: var(--dm-texto);

    --bs-primary: #2D2A32;
    --bs-primary-rgb: 45, 42, 50;
    --bs-primary-text-emphasis: #2D2A32;
    --bs-primary-bg-subtle: var(--dm-ceu-claro);
    --bs-primary-border-subtle: var(--dm-ceu);
    --bs-secondary: #A8DADC;
    --bs-secondary-rgb: 168, 218, 220;
    --bs-success: #0B6B63;
    --bs-success-rgb: 11, 107, 99;
    --bs-warning: #FFE8A3;
    --bs-warning-rgb: 255, 232, 163;
    --bs-danger: #B3261E;
    --bs-danger-rgb: 179, 38, 30;
    --bs-light: #FFF9F3;
    --bs-light-rgb: 255, 249, 243;
    --bs-dark: #2D2A32;
    --bs-dark-rgb: 45, 42, 50;

    --bs-link-color: var(--dm-texto);
    --bs-link-color-rgb: 45, 42, 50;
    --bs-link-hover-color: var(--dm-texto);
    --bs-link-hover-color-rgb: 45, 42, 50;
    --bs-link-decoration: underline;

    --bs-border-color: var(--dm-borda);
    --bs-border-color-translucent: rgba(45, 42, 50, .08);
    --bs-border-radius: 16px;
    --bs-border-radius-sm: 12px;
    --bs-border-radius-lg: 20px;
    --bs-border-radius-xl: 24px;
    --bs-border-radius-xxl: 32px;
    --bs-border-radius-pill: 999px;

    --bs-box-shadow: var(--dm-sombra);
    --bs-box-shadow-sm: 0 2px 8px rgba(45, 42, 50, .05);
    --bs-box-shadow-lg: var(--dm-sombra-hover);

    --bs-focus-ring-width: 4px;
    --bs-focus-ring-opacity: 1;
    --bs-focus-ring-color: rgba(45, 42, 50, .35);
}

@media (min-width: 992px) {
    :root { --dm-header-altura: 150px; }
}

/* -----------------------------------------------------------------------------
   2. Base
   ----------------------------------------------------------------------------- */
html { scroll-padding-top: calc(var(--dm-header-altura) + 12px); }
body {
    font-family: var(--dm-fonte);
    font-size: 1rem;
    color: var(--dm-texto);
    background: var(--dm-fundo);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, .h1, .h2, .h3, .h4, .fonte-titulo {
    font-family: var(--dm-fonte-titulo);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -.01em;
}
h5, h6, .h5, .h6 { font-weight: 800; }
a { text-underline-offset: .2em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
img { max-width: 100%; height: auto; }
::selection { background: var(--dm-manteiga); color: var(--dm-texto); }
.text-suave { color: var(--dm-texto-suave) !important; }
.small, small { font-size: .9375rem; }

/* Foco visível e consistente (WCAG 2.4.7) */
:focus-visible {
    outline: 3px solid var(--dm-texto);
    outline-offset: 2px;
    box-shadow: 0 0 0 6px var(--dm-ceu);
    border-radius: 8px;
}
.btn:focus-visible, .form-control:focus-visible, .form-select:focus-visible { outline-offset: 2px; }

.pular-conteudo {
    position: absolute; left: 16px; top: -100px; z-index: 2000;
    background: var(--dm-texto); color: #fff; padding: 12px 20px; border-radius: var(--dm-raio-sm);
    font-weight: 700; text-decoration: none;
}
.pular-conteudo:focus { top: 16px; color: #fff; }

.container { --bs-gutter-x: 2rem; }
@media (min-width: 1400px) { .container { max-width: 1280px; } }

/* -----------------------------------------------------------------------------
   3. Botões (área de toque mínima de 44px)
   ----------------------------------------------------------------------------- */
.btn {
    --bs-btn-padding-x: 1.4rem;
    --bs-btn-padding-y: .6rem;
    --bs-btn-font-family: var(--dm-fonte);
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 800;
    --bs-btn-border-radius: var(--bs-border-radius-pill);
    --bs-btn-border-width: 2px;
    min-height: 44px;
    display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
    transition: transform var(--dm-transicao), background-color var(--dm-transicao), box-shadow var(--dm-transicao), border-color var(--dm-transicao);
}
.btn:active { transform: scale(.97); }
.btn-lg { --bs-btn-padding-y: .8rem; --bs-btn-padding-x: 1.8rem; --bs-btn-font-size: 1.0625rem; min-height: 52px; }
.btn-sm { --bs-btn-padding-y: .35rem; --bs-btn-padding-x: 1rem; --bs-btn-font-size: .9375rem; min-height: 44px; }

.btn-primary, .btn-dark {
    --bs-btn-color: #fff; --bs-btn-bg: var(--dm-texto); --bs-btn-border-color: var(--dm-texto);
    --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #45414C; --bs-btn-hover-border-color: #45414C;
    --bs-btn-active-color: #fff; --bs-btn-active-bg: #1F1D23; --bs-btn-active-border-color: #1F1D23;
    --bs-btn-disabled-bg: #8C8892; --bs-btn-disabled-border-color: #8C8892;
}
.btn-outline-dark, .btn-outline-primary {
    --bs-btn-color: var(--dm-texto); --bs-btn-border-color: var(--dm-texto); --bs-btn-bg: transparent;
    --bs-btn-hover-color: var(--dm-texto); --bs-btn-hover-bg: var(--dm-manteiga-claro); --bs-btn-hover-border-color: var(--dm-texto);
    --bs-btn-active-color: var(--dm-texto); --bs-btn-active-bg: var(--dm-manteiga); --bs-btn-active-border-color: var(--dm-texto);
}
.btn-suave {
    --bs-btn-color: var(--dm-texto); --bs-btn-bg: var(--dm-fundo-card); --bs-btn-border-color: var(--dm-borda-forte);
    --bs-btn-hover-color: var(--dm-texto); --bs-btn-hover-bg: var(--dm-fundo); --bs-btn-hover-border-color: var(--dm-texto);
    --bs-btn-active-bg: var(--dm-manteiga-claro); --bs-btn-active-border-color: var(--dm-texto);
}
.btn-link { --bs-btn-color: var(--dm-texto); --bs-btn-hover-color: var(--dm-texto); --bs-btn-font-weight: 700; }

/* CTA de compra — ÚNICO uso do coral. Texto grafite: contraste 5:1 (AA). */
.btn-comprar {
    --bs-btn-color: var(--dm-texto); --bs-btn-bg: var(--dm-cta); --bs-btn-border-color: var(--dm-cta);
    --bs-btn-hover-color: var(--dm-texto); --bs-btn-hover-bg: var(--dm-cta-hover); --bs-btn-hover-border-color: var(--dm-cta-hover);
    --bs-btn-active-color: var(--dm-texto); --bs-btn-active-bg: var(--dm-cta-ativo); --bs-btn-active-border-color: var(--dm-cta-ativo);
    --bs-btn-disabled-color: var(--dm-texto-suave); --bs-btn-disabled-bg: #EDE6DE; --bs-btn-disabled-border-color: #EDE6DE;
    --bs-btn-font-weight: 900;
    box-shadow: 0 6px 16px rgba(255, 107, 74, .28);
}
.btn-comprar:hover { box-shadow: 0 10px 22px rgba(255, 107, 74, .38); transform: translateY(-1px); }
.btn-comprar:disabled, .btn-comprar.disabled { box-shadow: none; }
.btn-comprar.is-pulse { animation: dm-pulse 1.1s ease-out 2; }
.btn-comprar.is-carregando { pointer-events: none; opacity: .85; }

.btn-icone {
    width: 44px; height: 44px; min-height: 44px; padding: 0; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    border: 0; background: transparent; color: var(--dm-texto); font-size: 1.35rem; position: relative;
    text-decoration: none;
    transition: background-color var(--dm-transicao);
}
.btn-icone:hover { background: var(--dm-manteiga-claro); color: var(--dm-texto); }

/* -----------------------------------------------------------------------------
   4. Formulários
   ----------------------------------------------------------------------------- */
.form-control, .form-select {
    min-height: 48px;
    border: 2px solid var(--dm-borda-forte);
    border-radius: var(--dm-raio-sm);
    background-color: #fff;
    font-size: 1rem;
    color: var(--dm-texto);
}
.form-control::placeholder { color: #8A8590; }
.form-control:focus, .form-select:focus {
    border-color: var(--dm-texto);
    box-shadow: 0 0 0 4px var(--dm-ceu-claro);
}
.form-label { font-weight: 700; margin-bottom: .35rem; }
legend.form-label { font-size: 1rem; float: none; width: auto; font-family: var(--dm-fonte); }
.form-check-input { width: 1.35em; height: 1.35em; border: 2px solid var(--dm-borda-forte); margin-top: .15em; }
.form-check-input:checked { background-color: var(--dm-texto); border-color: var(--dm-texto); }
.form-check-input:focus { box-shadow: 0 0 0 4px var(--dm-ceu-claro); border-color: var(--dm-texto); }
.form-check { min-height: 44px; display: flex; gap: .6rem; align-items: flex-start; padding-left: 0; }
.form-check .form-check-input { float: none; margin-left: 0; flex-shrink: 0; }
.is-invalid { border-color: var(--dm-erro) !important; }
.invalid-feedback, .texto-erro { color: var(--dm-erro); font-weight: 700; font-size: .9375rem; }

/* -----------------------------------------------------------------------------
   5. Componentes do Bootstrap (offcanvas, modal, accordion, dropdown, toast, badge)
   ----------------------------------------------------------------------------- */
.offcanvas { --bs-offcanvas-bg: var(--dm-fundo); --bs-offcanvas-width: min(400px, 92vw); border: 0 !important; }
.offcanvas-start { border-radius: 0 var(--dm-raio-lg) var(--dm-raio-lg) 0; }
.offcanvas-end { border-radius: var(--dm-raio-lg) 0 0 var(--dm-raio-lg); }
.offcanvas-header { padding: 1.25rem 1.25rem .75rem; }
.offcanvas-title { font-family: var(--dm-fonte-titulo); font-weight: 700; font-size: 1.5rem; }
.btn-close { width: 44px; height: 44px; padding: 0; border-radius: 50%; background-size: 14px; opacity: .8; }
.btn-close:hover { background-color: var(--dm-manteiga-claro); opacity: 1; }

.modal { --bs-modal-border-radius: var(--dm-raio-lg); --bs-modal-bg: var(--dm-fundo); --bs-modal-border-width: 0; }
.modal-content { box-shadow: var(--dm-sombra-flutuante); overflow: hidden; }
.modal-title { font-family: var(--dm-fonte-titulo); font-weight: 700; }
.modal-backdrop { --bs-backdrop-bg: #2D2A32; --bs-backdrop-opacity: .45; }

.accordion {
    --bs-accordion-bg: transparent; --bs-accordion-border-color: var(--dm-borda);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 4px var(--dm-ceu-claro);
    --bs-accordion-active-bg: var(--dm-manteiga-claro); --bs-accordion-active-color: var(--dm-texto);
    --bs-accordion-border-radius: var(--dm-raio-sm); --bs-accordion-inner-border-radius: var(--dm-raio-sm);
}
.accordion-button { font-weight: 800; min-height: 52px; }

.dropdown-menu {
    --bs-dropdown-border-radius: var(--dm-raio); --bs-dropdown-border-color: var(--dm-borda);
    --bs-dropdown-box-shadow: var(--dm-sombra-hover); --bs-dropdown-link-hover-bg: var(--dm-manteiga-claro);
    --bs-dropdown-link-active-bg: var(--dm-manteiga); --bs-dropdown-link-active-color: var(--dm-texto);
    --bs-dropdown-item-padding-y: .6rem; padding: .5rem; box-shadow: var(--bs-dropdown-box-shadow);
}
.dropdown-item { border-radius: 10px; font-weight: 600; }

.toast {
    --bs-toast-bg: var(--dm-texto); --bs-toast-color: #fff; --bs-toast-border-radius: var(--dm-raio);
    --bs-toast-border-width: 0; --bs-toast-max-width: 380px; --bs-toast-font-size: 1rem;
    box-shadow: var(--dm-sombra-flutuante);
}
.toast .btn-close { filter: invert(1); }

.badge { font-weight: 800; letter-spacing: .01em; border-radius: var(--bs-border-radius-pill); }

.breadcrumb { --bs-breadcrumb-divider-color: var(--dm-texto-suave); --bs-breadcrumb-item-active-color: var(--dm-texto-suave); font-size: .9375rem; }

/* -----------------------------------------------------------------------------
   6. Barra superior rotativa
   ----------------------------------------------------------------------------- */
.barra-topo { background: var(--dm-texto); color: var(--dm-fundo); font-size: .9375rem; font-weight: 700; }
.barra-topo-lista {
    list-style: none; margin: 0; padding: 0; min-height: 36px;
    display: grid; align-items: center; justify-items: center; text-align: center;
}
.barra-topo-lista li { grid-area: 1 / 1; display: flex; align-items: center; gap: .45rem; padding: .35rem 0; opacity: 0; visibility: hidden; transition: opacity .5s ease, visibility .5s; }
.barra-topo-lista li.is-ativa { opacity: 1; visibility: visible; }
.barra-topo-lista i { color: var(--dm-manteiga); }
@media (min-width: 992px) {
    .barra-topo-lista { display: flex; justify-content: center; gap: 2.5rem; }
    .barra-topo-lista li { opacity: 1; visibility: visible; }
}

/* -----------------------------------------------------------------------------
   7. Cabeçalho, busca e navegação
   ----------------------------------------------------------------------------- */
.site-header {
    position: sticky; top: 0; z-index: 1030;
    background: rgba(255, 249, 243, .94);
    backdrop-filter: saturate(1.4) blur(10px);
    -webkit-backdrop-filter: saturate(1.4) blur(10px);
    transition: box-shadow var(--dm-transicao);
}
.site-header.is-rolado { box-shadow: 0 6px 24px rgba(45, 42, 50, .08); }
.header-principal {
    display: grid; align-items: center; gap: .5rem .75rem; padding-block: .6rem;
    grid-template-columns: auto 1fr auto;
    grid-template-areas: "menu logo acoes" "busca busca busca";
}
.header-menu { grid-area: menu; }
.header-logo { grid-area: logo; justify-self: center; }
.header-busca { grid-area: busca; }
.header-acoes { grid-area: acoes; display: flex; align-items: center; gap: .1rem; }
@media (min-width: 992px) {
    .header-principal {
        grid-template-columns: auto minmax(320px, 1fr) auto;
        grid-template-areas: "logo busca acoes";
        gap: 2rem; padding-block: .9rem;
    }
    .header-logo { justify-self: start; }
    .header-menu { display: none; }
}

.logo {
    display: inline-flex; align-items: center; gap: .45rem; text-decoration: none; color: var(--dm-texto);
    font-family: var(--dm-fonte-titulo); font-weight: 700; font-size: 1.75rem; line-height: 1; letter-spacing: -.02em;
}
.logo:hover { color: var(--dm-texto); }
.logo-icone {
    width: 38px; height: 38px; border-radius: 50%; background: var(--dm-pessego); display: grid; place-items: center;
    flex-shrink: 0;
}
.logo-icone svg { width: 22px; height: 22px; }
.logo-ponto { color: var(--dm-cta); }
@media (min-width: 992px) { .logo { font-size: 2rem; } .logo-icone { width: 42px; height: 42px; } }
/* Celulares bem estreitos (320–374px): logo menor para menu + logo + ícones caberem numa linha. */
@media (max-width: 374.98px) {
    .header-principal { gap: .5rem .25rem; }
    .logo { font-size: 1.4rem; gap: .3rem; }
    .logo-icone { width: 30px; height: 30px; }
    .logo-icone svg { width: 18px; height: 18px; }
    .container { --bs-gutter-x: 1.5rem; }
}

/* Busca com autocomplete */
.busca { position: relative; }
.busca-campo {
    width: 100%; min-height: 48px; border: 2px solid var(--dm-borda-forte); border-radius: var(--bs-border-radius-pill);
    padding: .5rem 3.5rem .5rem 1.25rem; background: #fff; font-size: 1rem; color: var(--dm-texto);
    transition: border-color var(--dm-transicao), box-shadow var(--dm-transicao);
}
.busca-campo:focus { outline: none; border-color: var(--dm-texto); box-shadow: 0 0 0 4px var(--dm-ceu-claro); }
.busca-campo::-webkit-search-cancel-button { display: none; }
.busca-botao {
    position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
    width: 44px; height: 44px; border-radius: 50%; border: 0; background: var(--dm-manteiga); color: var(--dm-texto);
    display: grid; place-items: center; font-size: 1.1rem;
}
.busca-botao:hover { background: #FFDD7A; }
.busca-sugestoes {
    position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 1040;
    background: #fff; border-radius: var(--dm-raio); box-shadow: var(--dm-sombra-flutuante);
    padding: .5rem; max-height: min(70vh, 520px); overflow-y: auto;
}
.busca-sugestoes[hidden] { display: none; }
.busca-sugestoes-titulo { font-size: .8125rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--dm-texto-suave); padding: .5rem .75rem .25rem; }
.busca-sugestao {
    display: flex; align-items: center; gap: .75rem; padding: .5rem .75rem; border-radius: 12px;
    text-decoration: none; color: var(--dm-texto); min-height: 44px;
}
.busca-sugestao:hover, .busca-sugestao.is-ativa { background: var(--dm-manteiga-claro); color: var(--dm-texto); }
.busca-sugestao img { width: 52px; height: 52px; border-radius: 10px; object-fit: cover; background: var(--dm-fundo-foto); flex-shrink: 0; }
.busca-sugestao-nome { font-weight: 700; line-height: 1.3; }
.busca-sugestao-preco { font-size: .9375rem; color: var(--dm-texto-suave); }
.busca-vazia { padding: 1rem .75rem; color: var(--dm-texto-suave); }

/* Contadores (carrinho/favoritos) */
.contador {
    position: absolute; top: 2px; right: 0; min-width: 20px; height: 20px; padding: 0 5px;
    border-radius: 10px; background: var(--dm-pessego); color: var(--dm-texto);
    font-size: .75rem; font-weight: 900; line-height: 20px; text-align: center;
    border: 2px solid var(--dm-fundo);
}
.contador[data-quantidade="0"] { display: none; }
.contador.is-bump { animation: dm-bump .55s cubic-bezier(.3, 1.6, .5, 1); }

/* Navegação por categorias (desktop) */
.nav-categorias { border-top: 1px solid var(--dm-borda); }
.nav-categorias-lista { list-style: none; margin: 0; padding: .35rem 0; display: flex; gap: 0; flex-wrap: wrap; justify-content: center; }
.nav-categorias-lista > li > a, .nav-categorias-lista > li > button {
    display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; padding: 0 .8rem;
    border-radius: var(--bs-border-radius-pill); text-decoration: none; color: var(--dm-texto);
    font-weight: 700; background: transparent; border: 0;
}
.nav-categorias-lista > li > a:hover, .nav-categorias-lista > li > button:hover,
.nav-categorias-lista > li > a[aria-current="page"] { background: var(--dm-manteiga-claro); }

/* Menu mobile (offcanvas) */
.menu-mobile-secao { font-size: .8125rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--dm-texto-suave); margin: 1.25rem 0 .5rem; }
.menu-mobile-lista { list-style: none; margin: 0; padding: 0; }
.menu-mobile-lista a, .menu-mobile-lista .accordion-button {
    display: flex; align-items: center; gap: .75rem; min-height: 52px; padding: .5rem .75rem;
    border-radius: var(--dm-raio-sm); text-decoration: none; color: var(--dm-texto); font-weight: 700;
}
.menu-mobile-lista a:hover { background: var(--dm-manteiga-claro); }
.menu-mobile-lista .accordion-button { background: transparent; box-shadow: none; }
.menu-mobile-lista .accordion-item { border: 0; background: transparent; }
.menu-mobile-lista .accordion-body { padding: 0 0 .5rem 3.25rem; }
.menu-mobile-lista .accordion-body a { min-height: 44px; font-weight: 600; }
.icone-bolha {
    width: 36px; height: 36px; border-radius: 50%; display: inline-grid; place-items: center; flex-shrink: 0;
    background: var(--bolha, var(--dm-manteiga-claro)); font-size: 1.05rem;
}
.chips-idade { display: flex; flex-wrap: wrap; gap: .5rem; }
.chip {
    display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; padding: 0 1rem;
    border-radius: var(--bs-border-radius-pill); background: #fff; border: 2px solid var(--dm-borda);
    text-decoration: none; color: var(--dm-texto); font-weight: 700;
}
.chip:hover { border-color: var(--dm-texto); color: var(--dm-texto); }

/* -----------------------------------------------------------------------------
   8. Seções e decoração de fundo
   ----------------------------------------------------------------------------- */
.secao { padding-block: 2.5rem; position: relative; }
@media (min-width: 992px) { .secao { padding-block: 4rem; } }
.secao-cabecalho { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.secao-titulo { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.35rem); margin: 0; position: relative; padding-bottom: .55rem; }
.secao-titulo::after {
    content: ""; position: absolute; left: 0; bottom: 0; width: 72px; height: 10px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 10'%3E%3Cpath d='M2 6c6-5 11-5 17 0s11 5 17 0 11-5 17 0 11 5 17 0' fill='none' stroke='%23FFB5A7' stroke-width='3.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat;
}
.text-center .secao-titulo::after, .secao-titulo.text-center::after { left: 50%; transform: translateX(-50%); }
.secao-subtitulo { color: var(--dm-texto-suave); margin: .5rem 0 0; max-width: 60ch; }
.link-ver-todos { font-weight: 800; display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; }

.fundo-manteiga { background: var(--dm-manteiga-claro); }
.fundo-ceu { background: var(--dm-ceu-claro); }
.fundo-pessego { background: var(--dm-pessego-claro); }

/* Ondas entre seções */
.onda-topo, .onda-base { display: block; width: 100%; height: 32px; }
@media (min-width: 992px) { .onda-topo, .onda-base { height: 48px; } }

/* Nuvens e estrelas como detalhe de fundo (puramente decorativas) */
.deco { position: relative; isolation: isolate; }
.deco::before {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .9;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 60'%3E%3Cpath d='M30 50h62a18 18 0 0 0 0-36 26 26 0 0 0-49-4A20 20 0 0 0 30 50z' fill='%23ffffff'/%3E%3C/svg%3E") no-repeat 4% 12% / 120px auto,
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.6 7.1.6-5.4 4.7 1.6 7L12 17.3 5.8 21l1.6-7L2 9.2l7.1-.6z' fill='%23FFE8A3'/%3E%3C/svg%3E") no-repeat 94% 18% / 28px auto,
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.6 7.1.6-5.4 4.7 1.6 7L12 17.3 5.8 21l1.6-7L2 9.2l7.1-.6z' fill='%23FFB5A7'/%3E%3C/svg%3E") no-repeat 86% 82% / 18px auto;
}

/* Rolagem horizontal com snap (idades e categorias no mobile, carrosséis) */
/* Contêineres com rolagem horizontal precisam de position: relative; sem isso, filhos com
   position: absolute (ex.: textos .visually-hidden das estrelas) escapam do recorte e
   criam rolagem lateral na página inteira. */
.rolagem-x, .carrossel-trilho, .galeria-trilho, .table-responsive { position: relative; }
.avaliacao-card, .categoria-card { position: relative; }

.rolagem-x {
    display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
    padding: .5rem calc(var(--bs-gutter-x, 2rem) * .5) 1rem; margin-inline: calc(var(--bs-gutter-x, 2rem) * -.5); scrollbar-width: none; -webkit-overflow-scrolling: touch;
    list-style: none;
}
.rolagem-x::-webkit-scrollbar { display: none; }
.rolagem-x > * { scroll-snap-align: start; flex-shrink: 0; }

/* -----------------------------------------------------------------------------
   9. Hero
   ----------------------------------------------------------------------------- */
.hero { padding-top: 1rem; }
.hero-cartao {
    position: relative; border-radius: var(--dm-raio-lg); overflow: hidden; background: var(--dm-pessego-claro);
    isolation: isolate;
}
/* Mobile: texto empilhado acima da imagem (nunca sobre a foto). Desktop: texto sobreposto à esquerda.
   Cada banner é um .hero-slide (no slider, também .carousel-item). */
.hero-slide { position: relative; display: flex; flex-direction: column-reverse; }
.hero-slide.carousel-item:not(.active):not(.carousel-item-next):not(.carousel-item-prev) { display: none; }
.hero-slide.carousel-item.active, .hero-slide.carousel-item-next, .hero-slide.carousel-item-prev { display: flex; }
@media (min-width: 768px) {
    .hero-slide.carousel-item.active, .hero-slide.carousel-item-next, .hero-slide.carousel-item-prev { display: block; }
}
.hero-imagem { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: center bottom; background: var(--dm-pessego-claro); }
@media (min-width: 768px) { .hero-slide { display: block; } .hero-imagem { aspect-ratio: 2 / 1; object-position: center; } }
@media (min-width: 1200px) { .hero-imagem { aspect-ratio: 5 / 2; } }
.hero-conteudo { position: relative; padding: 1.75rem 1.5rem .5rem; z-index: 1; background: var(--dm-fundo-card); }
.carousel .hero-conteudo { padding-bottom: 1rem; }
/* Altura de texto fixa no mobile para os slides não "pularem" ao trocar. */
@media (max-width: 767.98px) { .carousel .hero-conteudo { min-height: 21rem; display: flex; flex-direction: column; justify-content: center; } }
@media (min-width: 768px) {
    .hero-conteudo {
        position: absolute; inset: 0 auto 0 0; width: min(580px, 58%); padding: 3rem; display: flex; flex-direction: column; justify-content: center;
        background: linear-gradient(90deg, rgba(255, 249, 243, .96) 0%, rgba(255, 249, 243, .88) 68%, rgba(255, 249, 243, 0) 100%);
    }
    .carousel .hero-conteudo { padding-bottom: 4rem; }
}

/* Controles do slider (área de toque de 44px) */
.hero-controles { position: absolute; right: .75rem; bottom: .75rem; z-index: 3; display: flex; gap: .4rem; }
.hero-controle {
    width: 44px; height: 44px; border-radius: 50%; border: 0; display: grid; place-items: center;
    background: rgba(255, 255, 255, .94); color: var(--dm-texto); font-size: 1.2rem; box-shadow: var(--dm-sombra);
    transition: background-color var(--dm-transicao), transform var(--dm-transicao);
}
.hero-controle:hover { background: var(--dm-manteiga); }
.hero-indicadores { position: absolute; left: 1rem; right: auto; bottom: 1.15rem; margin: 0; padding: 0; z-index: 3; justify-content: flex-start; gap: .1rem; }
/* Botão de 44px de altura (toque) com o ponto visível desenhado no ::after */
.hero-indicadores [data-bs-target] {
    box-sizing: border-box; width: 24px; height: 44px; padding: 0; margin: 0; border: 0;
    background: transparent; opacity: 1; text-indent: 0; position: relative; flex: 0 0 auto;
    transition: width var(--dm-transicao);
}
.hero-indicadores [data-bs-target]::after {
    content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
    width: 10px; height: 10px; border-radius: 5px; background: rgba(45, 42, 50, .3);
    transition: width var(--dm-transicao), background-color var(--dm-transicao);
}
.hero-indicadores .active { width: 40px; }
.hero-indicadores .active::after { width: 28px; background: var(--dm-texto); }
@media (min-width: 768px) { .hero-indicadores { left: 3rem; bottom: 1.5rem; } }
@media (min-width: 1200px) { .hero-conteudo { padding: 4rem; } }
.hero-selo {
    display: inline-flex; align-items: center; gap: .4rem; align-self: flex-start;
    background: #fff; border-radius: var(--bs-border-radius-pill); padding: .3rem .9rem; font-weight: 800; font-size: .9375rem;
    margin-bottom: .9rem;
}
.hero-selo i { color: var(--dm-verde-texto); }
.hero-titulo { font-size: clamp(2rem, 1.3rem + 3.2vw, 3.6rem); margin-bottom: .75rem; }
.hero-texto { font-size: 1.0625rem; max-width: 42ch; margin-bottom: 1.25rem; }
@media (min-width: 992px) { .hero-texto { font-size: 1.1875rem; } }

/* -----------------------------------------------------------------------------
   10. Navegação por idade (círculos) e categorias
   ----------------------------------------------------------------------------- */
.idades-lista { justify-content: flex-start; }
@media (min-width: 768px) { .idades-lista { justify-content: center; overflow: visible; flex-wrap: wrap; gap: 2rem; } }
.idade-link {
    display: flex; flex-direction: column; align-items: center; gap: .6rem; width: 104px;
    text-decoration: none; color: var(--dm-texto); font-weight: 800; text-align: center; line-height: 1.2;
}
.idade-circulo {
    width: 96px; height: 96px; border-radius: 50%; display: grid; place-items: center; position: relative;
    background: var(--cor, var(--dm-manteiga)); font-size: 2.1rem;
    box-shadow: inset 0 -6px 0 rgba(45, 42, 50, .06);
    transition: transform var(--dm-transicao), box-shadow var(--dm-transicao);
}
.idade-circulo::after {
    content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 3px dashed transparent;
    transition: border-color var(--dm-transicao);
}
.idade-link:hover .idade-circulo { transform: translateY(-4px); box-shadow: var(--dm-sombra-hover); }
.idade-link:hover .idade-circulo::after { border-color: var(--dm-texto); }
.idade-link:hover { color: var(--dm-texto); }
@media (min-width: 992px) { .idade-circulo { width: 120px; height: 120px; font-size: 2.6rem; } .idade-link { width: 132px; } }

.categorias-lista > li { width: 132px; }
@media (min-width: 992px) {
    .categorias-lista { display: grid; grid-template-columns: repeat(7, 1fr); overflow: visible; margin: 0; padding: 0; }
    .categorias-lista > li { width: auto; }
}
.categoria-card {
    display: flex; flex-direction: column; align-items: center; gap: .75rem; height: 100%;
    background: var(--dm-fundo-card); border-radius: var(--dm-raio); padding: 1.25rem .75rem 1rem;
    text-decoration: none; color: var(--dm-texto); font-weight: 800; text-align: center; line-height: 1.25;
    box-shadow: var(--dm-sombra); transition: transform var(--dm-transicao), box-shadow var(--dm-transicao);
}
.categoria-card:hover { transform: translateY(-4px); box-shadow: var(--dm-sombra-hover); color: var(--dm-texto); }
.categoria-icone {
    width: 64px; height: 64px; display: grid; place-items: center; font-size: 1.7rem;
    background: var(--cor, var(--dm-manteiga-claro));
    border-radius: 42% 58% 55% 45% / 50% 42% 58% 50%;   /* "blob" orgânico */
}

/* -----------------------------------------------------------------------------
   11. Card de produto
   ----------------------------------------------------------------------------- */
.produto-card {
    position: relative; display: flex; flex-direction: column; height: 100%;
    background: var(--dm-fundo-card); border-radius: var(--dm-raio); overflow: hidden;
    box-shadow: var(--dm-sombra); transition: box-shadow var(--dm-transicao), transform var(--dm-transicao);
}
.produto-card:hover { box-shadow: var(--dm-sombra-hover); }
.produto-card-midia { position: relative; display: block; aspect-ratio: 1; background: var(--dm-fundo-foto); overflow: hidden; }
.produto-card-midia img {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
    transition: transform .6s cubic-bezier(.2, .7, .3, 1), opacity .4s ease;
}
.produto-card-midia .img-uso { opacity: 0; }
@media (hover: hover) {
    .produto-card:hover .produto-card-midia img { transform: scale(1.06); }
    .produto-card:hover .produto-card-midia .img-uso { opacity: 1; }
}
.produto-selos { position: absolute; top: .65rem; left: .65rem; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; }
.selo {
    display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .65rem; border-radius: var(--bs-border-radius-pill);
    font-size: .8125rem; font-weight: 900; line-height: 1.3; color: var(--dm-texto); background: #fff;
}
.selo-novo { background: var(--dm-ceu); }
.selo-mais-vendido { background: var(--dm-manteiga); }
.selo-ultimas { background: var(--dm-pessego); }
.selo-desconto { background: var(--dm-texto); color: #fff; }
.selo-esgotado { background: #E7E2DC; color: var(--dm-texto); }
.selo-presente { background: var(--dm-pessego-claro); }
.selo-confianca { background: var(--dm-verde-claro); color: var(--dm-verde-texto); }

.btn-favorito {
    position: absolute; top: .5rem; right: .5rem; z-index: 2;
    width: 44px; height: 44px; border-radius: 50%; border: 0; display: grid; place-items: center;
    background: rgba(255, 255, 255, .92); color: var(--dm-texto); font-size: 1.2rem;
    box-shadow: 0 2px 10px rgba(45, 42, 50, .1); transition: transform var(--dm-transicao);
}
.btn-favorito:hover { transform: scale(1.08); }
.btn-favorito[aria-pressed="true"] { color: #D6336C; }

.produto-card-corpo { display: flex; flex-direction: column; gap: .35rem; padding: .9rem .9rem 1rem; flex: 1; }
@media (min-width: 768px) { .produto-card-corpo { padding: 1rem 1.1rem 1.15rem; } }
.produto-idade { font-size: .8125rem; font-weight: 800; color: var(--dm-texto-suave); display: inline-flex; align-items: center; gap: .3rem; }
.produto-nome { font-family: var(--dm-fonte); font-size: 1rem; font-weight: 800; line-height: 1.3; margin: 0; }
.produto-nome a {
    color: var(--dm-texto); text-decoration: none;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em;
}
.produto-nome a:hover { text-decoration: underline; }
.estrelas { display: inline-flex; align-items: center; gap: .1rem; color: var(--dm-estrela); font-size: .875rem; }
.avaliacao-linha { display: flex; align-items: center; gap: .35rem; font-size: .875rem; color: var(--dm-texto-suave); min-height: 1.4em; }
.preco-de { font-size: .875rem; color: var(--dm-texto-suave); text-decoration: line-through; }
.preco-por { font-size: 1.15rem; font-weight: 900; line-height: 1.2; }
.preco-pix {
    display: inline-flex; align-items: center; gap: .35rem; align-self: flex-start; flex-wrap: wrap;
    background: var(--dm-manteiga-claro); border-radius: 10px; padding: .2rem .55rem;
    font-weight: 900; font-size: 1rem;
}
.preco-pix small { font-weight: 700; font-size: .8125rem; }
.preco-parcelas { font-size: .875rem; color: var(--dm-texto-suave); }
.produto-card-acoes { margin-top: auto; padding-top: .6rem; }
.produto-card-acoes .btn { width: 100%; }

/* -----------------------------------------------------------------------------
   12. Carrossel (scroll-snap nativo + botões)
   ----------------------------------------------------------------------------- */
.carrossel { position: relative; }
.carrossel-trilho {
    display: grid; grid-auto-flow: column; grid-auto-columns: 72%; gap: 1rem;
    overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain;
    padding: .5rem calc(var(--bs-gutter-x, 2rem) * .5) 1.25rem; margin-inline: calc(var(--bs-gutter-x, 2rem) * -.5); scrollbar-width: none; list-style: none;
}
.carrossel-trilho::-webkit-scrollbar { display: none; }
.carrossel-trilho > * { scroll-snap-align: start; }
@media (min-width: 576px) { .carrossel-trilho { grid-auto-columns: 46%; } }
@media (min-width: 768px) { .carrossel-trilho { grid-auto-columns: 31.5%; gap: 1.25rem; } }
@media (min-width: 1200px) { .carrossel-trilho { grid-auto-columns: calc((100% - 3 * 1.25rem) / 4); margin-inline: 0; padding-inline: 0; } }
.carrossel-botoes { display: none; gap: .5rem; }
@media (min-width: 768px) { .carrossel-botoes { display: flex; } }
.carrossel-botao {
    width: 48px; height: 48px; border-radius: 50%; border: 2px solid var(--dm-texto); background: #fff; color: var(--dm-texto);
    display: grid; place-items: center; font-size: 1.1rem; transition: background-color var(--dm-transicao), opacity var(--dm-transicao);
}
.carrossel-botao:hover:not(:disabled) { background: var(--dm-manteiga); }
.carrossel-botao:disabled { opacity: .3; cursor: default; }

/* -----------------------------------------------------------------------------
   13. Achador de Presentes
   ----------------------------------------------------------------------------- */
.achador {
    border-radius: var(--dm-raio-lg); background: var(--dm-manteiga-claro); padding: 2rem 1.5rem; overflow: hidden;
    display: grid; gap: 1.5rem; align-items: center;
}
@media (min-width: 768px) { .achador { grid-template-columns: 1.2fr 1fr; padding: 3rem; } }
.achador-ilustracao { display: grid; place-items: center; }
.achador-ilustracao svg { width: min(280px, 70%); height: auto; }
.quiz-progresso { display: flex; gap: .4rem; margin-bottom: 1.25rem; }
.quiz-progresso span { flex: 1; height: 6px; border-radius: 3px; background: var(--dm-borda-forte); transition: background-color var(--dm-transicao); }
.quiz-progresso span.is-feito { background: var(--dm-texto); }
.quiz-passo[hidden] { display: none; }
.quiz-pergunta { font-size: 1.4rem; margin-bottom: 1rem; }
.opcoes-grade { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
@media (min-width: 576px) { .opcoes-grade.tres { grid-template-columns: repeat(3, 1fr); } }
.opcao-card {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .4rem; text-align: center;
    min-height: 96px; padding: .9rem .75rem; border-radius: var(--dm-raio); border: 2px solid var(--dm-borda);
    background: #fff; color: var(--dm-texto); font-weight: 800; line-height: 1.25; width: 100%;
    transition: border-color var(--dm-transicao), background-color var(--dm-transicao), transform var(--dm-transicao);
}
.opcao-card i { font-size: 1.6rem; }
.opcao-card:hover { border-color: var(--dm-texto); transform: translateY(-2px); }
.opcao-card[aria-pressed="true"] { border-color: var(--dm-texto); background: var(--dm-manteiga-claro); }
.quiz-resultados .row { --bs-gutter-x: .9rem; --bs-gutter-y: .9rem; }
.quiz-carregando { display: grid; place-items: center; min-height: 200px; }

/* -----------------------------------------------------------------------------
   14. Banner de coleção
   ----------------------------------------------------------------------------- */
.banner-colecao { position: relative; border-radius: var(--dm-raio-lg); overflow: hidden; background: var(--dm-ceu-claro); isolation: isolate; }
.banner-colecao img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: 75% center; }
@media (min-width: 768px) { .banner-colecao img { aspect-ratio: 8 / 3; } }
.banner-colecao-conteudo {
    position: absolute; inset: 0; padding: 1.5rem; display: flex; flex-direction: column; justify-content: flex-start;
    background: linear-gradient(180deg, rgba(228, 243, 244, .95) 0%, rgba(228, 243, 244, .7) 55%, rgba(228, 243, 244, 0) 80%);
}
@media (min-width: 768px) {
    .banner-colecao-conteudo {
        justify-content: center; padding: 3rem; width: min(560px, 55%);
        background: linear-gradient(90deg, rgba(228, 243, 244, .96) 0%, rgba(228, 243, 244, .85) 70%, rgba(228, 243, 244, 0) 100%);
    }
}
.banner-colecao-rotulo { font-weight: 900; text-transform: uppercase; letter-spacing: .08em; font-size: .8125rem; margin-bottom: .5rem; }
.banner-colecao h2 { font-size: clamp(1.6rem, 1.2rem + 2vw, 2.6rem); }

/* -----------------------------------------------------------------------------
   15. Prova social
   ----------------------------------------------------------------------------- */
.resumo-avaliacoes { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.resumo-nota { font-family: var(--dm-fonte-titulo); font-size: 3.25rem; font-weight: 700; line-height: 1; }
.resumo-avaliacoes .estrelas { font-size: 1.25rem; }
.avaliacao-card { background: #fff; border-radius: var(--dm-raio); box-shadow: var(--dm-sombra); overflow: hidden; height: 100%; display: flex; flex-direction: column; }
.avaliacao-foto { aspect-ratio: 4 / 3; width: 100%; object-fit: cover; background: var(--dm-fundo-foto); }
.avaliacao-corpo { padding: 1.1rem 1.2rem 1.25rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.avaliacao-titulo { font-family: var(--dm-fonte); font-weight: 900; font-size: 1.0625rem; margin: 0; }
.avaliacao-texto { margin: 0; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.avaliacao-autor { margin-top: auto; font-size: .9375rem; color: var(--dm-texto-suave); }
.avaliacao-autor strong { color: var(--dm-texto); }
.avaliacao-produto { font-size: .9375rem; font-weight: 700; }
.selo-verificado { color: var(--dm-verde-texto); font-weight: 800; font-size: .875rem; display: inline-flex; gap: .25rem; align-items: center; }
.avaliacoes-trilho { grid-auto-columns: 82%; }
@media (min-width: 576px) { .avaliacoes-trilho { grid-auto-columns: 48%; } }
@media (min-width: 992px) { .avaliacoes-trilho { grid-auto-columns: calc((100% - 2 * 1.25rem) / 3); margin-inline: 0; padding-inline: 0; } }

/* -----------------------------------------------------------------------------
   16. Faixa de confiança (verde = confiança)
   ----------------------------------------------------------------------------- */
.faixa-confianca { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; list-style: none; margin: 0; padding: 0; }
@media (min-width: 992px) { .faixa-confianca { grid-template-columns: repeat(4, 1fr); gap: 1.5rem; } }
.confianca-item { display: flex; flex-direction: column; align-items: flex-start; gap: .6rem; background: #fff; border-radius: var(--dm-raio); padding: 1.1rem; height: 100%; box-shadow: var(--dm-sombra); }
@media (min-width: 768px) { .confianca-item { flex-direction: row; align-items: center; padding: 1.25rem 1.4rem; } }
.confianca-icone { width: 52px; height: 52px; border-radius: 50%; background: var(--dm-verde-claro); color: var(--dm-verde-texto); display: grid; place-items: center; font-size: 1.5rem; flex-shrink: 0; }
.confianca-item strong { display: block; line-height: 1.25; }
.confianca-item span { font-size: .9375rem; color: var(--dm-texto-suave); }

/* -----------------------------------------------------------------------------
   17. Captura de e-mail / WhatsApp
   ----------------------------------------------------------------------------- */
.captura { border-radius: var(--dm-raio-lg); background: var(--dm-pessego-claro); padding: 2rem 1.5rem; display: grid; gap: 1.5rem; align-items: center; }
@media (min-width: 992px) { .captura { grid-template-columns: 1fr 1.1fr; padding: 3rem 3.5rem; } }
.captura-destaque { font-family: var(--dm-fonte-titulo); font-size: clamp(2.4rem, 1.6rem + 3.2vw, 4rem); line-height: 1; font-weight: 700; }
.alternador { display: inline-flex; background: #fff; border-radius: var(--bs-border-radius-pill); padding: 4px; gap: 4px; margin-bottom: 1rem; border: 2px solid var(--dm-borda); }
.alternador input { position: absolute; opacity: 0; pointer-events: none; }
.alternador label {
    display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; padding: 0 1.1rem; border-radius: var(--bs-border-radius-pill);
    font-weight: 800; cursor: pointer; transition: background-color var(--dm-transicao), color var(--dm-transicao);
}
.alternador input:checked + label { background: var(--dm-texto); color: #fff; }
.alternador input:focus-visible + label { outline: 3px solid var(--dm-texto); outline-offset: 2px; }
.cupom-revelado {
    border: 2px dashed var(--dm-texto); border-radius: var(--dm-raio); background: #fff; padding: 1.25rem;
    display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
}
.cupom-codigo { font-family: var(--dm-fonte-titulo); font-size: 1.75rem; font-weight: 700; letter-spacing: .06em; }
.campo-oculto { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* -----------------------------------------------------------------------------
   18. Rodapé
   ----------------------------------------------------------------------------- */
.site-footer { background: var(--dm-texto); color: #F4EEE8; margin-top: 3rem; }
.site-footer .onda-topo { margin-top: -31px; color: var(--dm-texto); }
@media (min-width: 992px) { .site-footer .onda-topo { margin-top: -47px; } }
.site-footer a { color: #FFF9F3; }
.site-footer a:hover { color: var(--dm-manteiga); }
.rodape-titulo { font-family: var(--dm-fonte); font-size: .875rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; color: var(--dm-manteiga); margin-bottom: 1rem; }
.rodape-lista { list-style: none; margin: 0; padding: 0; }
.rodape-lista li { margin-bottom: .15rem; }
.rodape-lista a { display: inline-flex; align-items: center; min-height: 40px; text-decoration: none; }
.rodape-lista a:hover { text-decoration: underline; }
.site-footer .logo { color: #fff; }
.site-footer .logo-icone { background: var(--dm-pessego); }
.redes { display: flex; gap: .5rem; }
.redes a {
    width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; font-size: 1.15rem;
    background: rgba(255, 255, 255, .1); text-decoration: none;
}
.redes a:hover { background: var(--dm-manteiga); color: var(--dm-texto); }
.pagamentos { display: flex; flex-wrap: wrap; gap: .45rem; list-style: none; padding: 0; margin: 0; }
.pagamentos li {
    background: #fff; color: var(--dm-texto); border-radius: 8px; padding: .3rem .6rem; font-size: .8125rem; font-weight: 900;
    display: inline-flex; align-items: center; gap: .3rem; min-height: 32px;
}
.selos-rodape { display: flex; flex-wrap: wrap; gap: .5rem; }
.selo-rodape { display: inline-flex; align-items: center; gap: .4rem; border: 1px solid rgba(255, 255, 255, .2); border-radius: 10px; padding: .4rem .7rem; font-size: .875rem; font-weight: 700; }
.selo-rodape i { color: var(--dm-verde); }
.rodape-legal { border-top: 1px solid rgba(255, 255, 255, .12); font-size: .875rem; color: #D9D2CA; }
.rodape-legal p { margin: 0; }

/* -----------------------------------------------------------------------------
   19. WhatsApp flutuante, cookies, toasts e pop-up de saída
   ----------------------------------------------------------------------------- */
.whatsapp-flutuante {
    position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 1035;
    width: 58px; height: 58px; border-radius: 50%; background: #fff; color: #128C7E;
    display: grid; place-items: center; font-size: 1.85rem; box-shadow: var(--dm-sombra-flutuante);
    text-decoration: none; transition: transform var(--dm-transicao), bottom var(--dm-transicao);
}
.whatsapp-flutuante:hover { transform: scale(1.07); color: #0C6B60; }
@media (max-width: 991.98px) {
    body.tem-barra-fixa .whatsapp-flutuante { bottom: calc(96px + env(safe-area-inset-bottom)); }
    body.tem-barra-fixa .aviso-cookies { bottom: calc(92px + env(safe-area-inset-bottom)); }
}
body.cookies-abertos .whatsapp-flutuante { opacity: 0; pointer-events: none; }

.aviso-cookies {
    position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 1060;
    max-width: 560px; background: #fff; border-radius: var(--dm-raio); box-shadow: var(--dm-sombra-flutuante);
    padding: 1.25rem; border: 1px solid var(--dm-borda);
}
@media (min-width: 768px) { .aviso-cookies { left: 24px; bottom: 24px; padding: 1.5rem; } }
.aviso-cookies[hidden] { display: none; }
.aviso-cookies p { margin-bottom: 1rem; }

.toast-container { z-index: 1090; padding: 1rem; padding-top: calc(var(--dm-header-altura) + .5rem); }

.modal-saida .modal-content { background: var(--dm-fundo); }
.modal-saida-topo { background: var(--dm-manteiga); padding: 2rem 1.5rem 1.5rem; text-align: center; position: relative; }
.modal-saida-topo .btn-close { position: absolute; top: .75rem; right: .75rem; }
.modal-saida-percentual { font-family: var(--dm-fonte-titulo); font-size: 3.5rem; font-weight: 700; line-height: 1; }

/* -----------------------------------------------------------------------------
   20. Páginas institucionais e erro
   ----------------------------------------------------------------------------- */
.conteudo-texto { max-width: 760px; }
.conteudo-texto h2 { font-size: 1.5rem; margin-top: 2rem; }
.conteudo-texto li { margin-bottom: .35rem; }
.cartao { background: #fff; border-radius: var(--dm-raio); box-shadow: var(--dm-sombra); padding: 1.5rem; }
@media (min-width: 768px) { .cartao { padding: 2rem; } }
.destaque-legal { background: var(--dm-ceu-claro); border-radius: var(--dm-raio); padding: 1.25rem 1.5rem; }
.erro-numero { font-family: var(--dm-fonte-titulo); font-size: clamp(4rem, 3rem + 6vw, 7rem); line-height: 1; color: var(--dm-pessego); font-weight: 700; }

/* -----------------------------------------------------------------------------
   21. Listagem e filtros
   ----------------------------------------------------------------------------- */
.subcategorias { padding-bottom: .25rem; }
.listagem-barra { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-bottom: .75rem; }
.listagem-contador { color: var(--dm-texto-suave); }
.listagem-contador strong { color: var(--dm-texto); }
.ordenacao .form-select { min-width: 220px; font-weight: 700; border-radius: var(--bs-border-radius-pill); }
@media (max-width: 575.98px) {
    .listagem-barra > .d-flex { width: 100%; }
    .listagem-barra .ordenacao { flex: 1; min-width: 0; }
    .listagem-barra .ordenacao .form-select { min-width: 0; width: 100%; }
}
.filtros-ativos { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: .5rem; }
.chip-removivel { background: var(--dm-manteiga-claro); border-color: var(--dm-manteiga); }
.chip-removivel i { font-size: .8rem; }
.chip.is-ativo, .chip[aria-pressed="true"] { background: var(--dm-texto); color: #fff; border-color: var(--dm-texto); }
.chip:disabled { opacity: .5; }

.painel-filtros .accordion-button { font-size: 1rem; }
.painel-filtros .accordion-body { padding: .5rem 1rem 1rem; }
@media (min-width: 992px) {
    .painel-filtros { position: sticky; top: calc(var(--dm-header-altura) + 16px); max-height: calc(100vh - var(--dm-header-altura) - 32px); overflow-y: auto; scrollbar-width: thin; }
    .painel-filtros .offcanvas-body { padding: 0; }
    .painel-filtros .accordion { background: #fff; border-radius: var(--dm-raio); box-shadow: var(--dm-sombra); overflow: hidden; }
}
.opcoes-lista { display: flex; flex-direction: column; }
.opcao-filtro { position: relative; }
.opcao-filtro label { display: flex; align-items: center; gap: .55rem; min-height: 44px; cursor: pointer; padding-left: 2rem; font-weight: 600; }
.opcao-filtro .form-check-input { position: absolute; left: 0; top: 50%; transform: translateY(-50%); margin: 0; }
.opcao-filtro.is-vazia label { color: #9C97A0; cursor: not-allowed; }
.opcao-total { color: var(--dm-texto-suave); font-weight: 400; font-size: .9375rem; }
.opcoes-tamanho { display: flex; flex-wrap: wrap; gap: .5rem; }
.opcoes-tamanho .opcao-filtro .form-check-input { position: absolute; opacity: 0; pointer-events: none; }
.opcoes-tamanho .opcao-filtro label {
    padding: 0; min-width: 48px; height: 44px; justify-content: center; border: 2px solid var(--dm-borda-forte);
    border-radius: 12px; background: #fff; padding-inline: .6rem;
}
.opcoes-tamanho .form-check-input:checked + label { background: var(--dm-texto); color: #fff; border-color: var(--dm-texto); }
.opcoes-tamanho .form-check-input:focus-visible + label { outline: 3px solid var(--dm-texto); outline-offset: 2px; }
.opcoes-cor { display: flex; flex-direction: column; }
.amostra-cor {
    width: 26px; height: 26px; border-radius: 50%; background: var(--cor); flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(45, 42, 50, .2);
}
.link-faixa-preco { display: inline-flex; align-items: center; min-height: 40px; font-weight: 600; }
.link-faixa-preco.is-ativa { font-weight: 900; }
.filtros-rodape { display: flex; gap: .5rem; padding-top: 1rem; }
.filtros-rodape .btn { white-space: nowrap; }
@media (max-width: 991.98px) {
    .filtros-rodape { position: sticky; bottom: 0; background: var(--dm-fundo); padding-block: 1rem; margin-top: auto; }
    .form-filtros { display: flex; flex-direction: column; min-height: 100%; }
}
.listagem-vazia > i { font-size: 3rem; color: var(--dm-pessego); }

.paginacao-lista { list-style: none; padding: 0; margin: 0; display: flex; justify-content: center; flex-wrap: wrap; gap: .4rem; }
.paginacao-link {
    min-width: 44px; height: 44px; padding: 0 .5rem; display: inline-grid; place-items: center; border-radius: 12px;
    background: #fff; border: 2px solid var(--dm-borda); text-decoration: none; color: var(--dm-texto); font-weight: 800;
}
a.paginacao-link:hover { border-color: var(--dm-texto); color: var(--dm-texto); }
.paginacao-link.is-atual { background: var(--dm-texto); border-color: var(--dm-texto); color: #fff; }
.paginacao-link.is-desabilitado { opacity: .35; }
.paginacao-reticencias { display: inline-grid; place-items: center; height: 44px; padding: 0 .25rem; }

/* -----------------------------------------------------------------------------
   22. Página de produto
   ----------------------------------------------------------------------------- */
/* Galeria: carrossel com snap no mobile; miniaturas + zoom no desktop */
.galeria-principal { position: relative; border-radius: var(--dm-raio-lg); overflow: hidden; background: var(--dm-fundo-foto); box-shadow: var(--dm-sombra); }
.galeria-trilho {
    display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; list-style: none; margin: 0; padding: 0;
    overscroll-behavior-x: contain;
}
.galeria-trilho::-webkit-scrollbar { display: none; }
.galeria-item { flex: 0 0 100%; scroll-snap-align: center; position: relative; aspect-ratio: 1; }
@media (max-width: 991.98px) {
    .galeria-item { aspect-ratio: auto; height: min(88vw, 38vh); }
    .galeria .galeria-miniaturas { display: none; }
    .pagina-produto .breadcrumb-item.active { display: none; }
    .pagina-produto .produto-topo { padding-top: .75rem !important; }
    .produto-info { gap: .65rem; }
    .produto-precos { padding: .75rem 1rem; }
    .produto-preco-por { font-size: 1.6rem; }
}
.form-compra .btn-comprar { white-space: nowrap; }
@media (max-width: 575.98px) { .form-compra .btn-comprar { --bs-btn-padding-x: .9rem; --bs-btn-font-size: 1rem; } }
.galeria-zoom { all: unset; display: block; width: 100%; height: 100%; cursor: zoom-in; overflow: hidden; }
.galeria-zoom:focus-visible { outline: 3px solid var(--dm-texto); outline-offset: -3px; }
.galeria-zoom img { width: 100%; height: 100%; object-fit: contain; transition: transform .2s ease-out; }
.galeria-zoom.is-zoom img { transform: scale(2); }
.galeria-etiqueta {
    position: absolute; left: .75rem; bottom: .75rem; background: rgba(255, 255, 255, .95); border-radius: var(--bs-border-radius-pill);
    padding: .25rem .75rem; font-weight: 800; font-size: .875rem; pointer-events: none;
}
.galeria-video-play { all: unset; position: relative; display: block; width: 100%; height: 100%; cursor: pointer; background: #000; }
.galeria-video-play img { width: 100%; height: 100%; object-fit: cover; opacity: .85; }
.galeria-play { position: absolute; inset: 0; display: grid; place-items: center; }
.galeria-play i { width: 80px; height: 80px; border-radius: 50%; background: rgba(255, 255, 255, .95); display: grid; place-items: center; font-size: 2.6rem; color: var(--dm-texto); }
.galeria-video iframe { width: 100%; height: 100%; border: 0; }
.galeria-pontos { position: absolute; bottom: .75rem; left: 0; right: 0; display: flex; justify-content: center; gap: .35rem; pointer-events: none; }
.galeria-pontos span { width: 8px; height: 8px; border-radius: 50%; background: rgba(45, 42, 50, .25); transition: width var(--dm-transicao), background-color var(--dm-transicao); }
.galeria-pontos span.is-ativo { width: 22px; border-radius: 4px; background: var(--dm-texto); }
.galeria-miniaturas { display: flex; gap: .6rem; margin-top: .75rem; overflow-x: auto; padding: .25rem; scrollbar-width: thin; }
.galeria-miniatura {
    width: 76px; height: 76px; flex-shrink: 0; border-radius: 14px; overflow: hidden; padding: 0; background: #fff;
    border: 2px solid transparent; box-shadow: var(--dm-sombra);
}
.galeria-miniatura img { width: 100%; height: 100%; object-fit: cover; }
.galeria-miniatura.is-ativa { border-color: var(--dm-texto); }
.galeria-miniatura-video { display: grid; place-items: center; font-size: 2rem; }
.galeria-vazia { width: 100%; aspect-ratio: 1; object-fit: cover; }

.produto-info { display: flex; flex-direction: column; gap: .85rem; }
@media (min-width: 992px) { .produto-info { position: sticky; top: calc(var(--dm-header-altura) + 16px); } }
.produto-selos-topo { display: flex; flex-wrap: wrap; gap: .4rem; }
.produto-selos-topo:empty { display: none; }
.produto-titulo { font-size: clamp(1.55rem, 1.2rem + 1.4vw, 2.25rem); margin: 0; }
.produto-meta { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; }
.produto-avaliacao-link { display: inline-flex; align-items: center; gap: .4rem; text-decoration: none; color: var(--dm-texto); font-weight: 700; min-height: 32px; }
.produto-avaliacao-link .estrelas { font-size: 1rem; }
.produto-precos { background: #fff; border-radius: var(--dm-raio); padding: 1rem 1.15rem; box-shadow: var(--dm-sombra); }
.produto-preco-por { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; font-size: 1.85rem; font-weight: 900; line-height: 1.2; }
.produto-a-partir { font-size: 1rem; font-weight: 700; color: var(--dm-texto-suave); }
.produto-pix { font-size: 1.0625rem; display: inline-flex; align-items: center; gap: .35rem; flex-wrap: wrap; background: var(--dm-manteiga-claro); border-radius: 10px; padding: .25rem .65rem; }
.produto-pix strong { font-size: 1.2rem; }

.seletor { border: 0; padding: 0; margin: 0; }
.seletor-titulo { font-weight: 800; font-size: 1rem; margin-bottom: .5rem; }
.seletor-input { position: absolute; opacity: 0; pointer-events: none; }
.seletor-cores, .seletor-tamanhos { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: .5rem; }
.seletor-cor {
    width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; cursor: pointer;
    border: 2px solid transparent; transition: border-color var(--dm-transicao);
}
.seletor-cor .amostra-cor { width: 36px; height: 36px; }
.seletor-input:checked + .seletor-cor { border-color: var(--dm-texto); }
.seletor-tamanho {
    min-width: 52px; height: 48px; padding: 0 .85rem; display: inline-grid; place-items: center; cursor: pointer;
    border: 2px solid var(--dm-borda-forte); border-radius: 14px; background: #fff; font-weight: 800;
    transition: border-color var(--dm-transicao), background-color var(--dm-transicao);
}
.seletor-tamanho:hover { border-color: var(--dm-texto); }
.seletor-input:checked + .seletor-tamanho { background: var(--dm-texto); color: #fff; border-color: var(--dm-texto); }
.seletor-input:focus-visible + label { outline: 3px solid var(--dm-texto); outline-offset: 3px; }
.seletor-input:disabled + label { opacity: .45; cursor: not-allowed; text-decoration: line-through; }
.seletor-input:disabled + .seletor-cor { text-decoration: none; position: relative; }
.seletor-input:disabled + .seletor-cor::after { content: ""; position: absolute; width: 70%; height: 2px; background: var(--dm-texto); transform: rotate(-45deg); }
.seletor.is-pendente .seletor-titulo { color: var(--dm-erro); }

.produto-estoque { margin: 0; font-weight: 800; min-height: 1.5em; }
.estoque-ok { color: var(--dm-verde-texto); }
.estoque-baixo { color: #9A3412; }
.estoque-esgotado { color: var(--dm-texto-suave); }

.quantidade { display: flex; align-items: center; border: 2px solid var(--dm-borda-forte); border-radius: var(--bs-border-radius-pill); background: #fff; }
.quantidade-botao { width: 40px; height: 48px; border: 0; background: transparent; font-size: 1rem; border-radius: 50%; color: var(--dm-texto); }
.quantidade-botao:hover { background: var(--dm-manteiga-claro); }
.quantidade input { width: 34px; text-align: center; border: 0; font-weight: 800; font-size: 1.05rem; -moz-appearance: textfield; background: transparent; }
.quantidade input::-webkit-inner-spin-button, .quantidade input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.embalagem-presente label { font-weight: 700; }

.frete-box { background: #fff; border-radius: var(--dm-raio); padding: 1rem 1.15rem; box-shadow: var(--dm-sombra); }
.frete-resultado:empty { display: none; }
.frete-resultado { margin-top: .75rem; }
.frete-opcoes { list-style: none; margin: .5rem 0 0; padding: 0; }
.frete-opcoes li { display: flex; justify-content: space-between; gap: .75rem; padding: .55rem 0; border-top: 1px solid var(--dm-borda); }
.frete-opcoes li:first-child { border-top: 0; }
.frete-gratis { color: var(--dm-verde-texto); font-weight: 900; }
.frete-gratis-info { margin-top: .75rem; font-size: .9375rem; color: var(--dm-verde-texto); font-weight: 700; }
.frete-aviso { font-size: .875rem; color: var(--dm-texto-suave); }
.produto-garantias { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; font-size: .9375rem; font-weight: 700; }
.produto-garantias i { color: var(--dm-verde-texto); }

.produto-descricao ul { padding-left: 1.2rem; }
.produto-ficha { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .75rem; margin: 1.25rem 0 0; }
.produto-ficha div { background: var(--dm-fundo); border-radius: 12px; padding: .6rem .8rem; }
.produto-ficha dt { font-size: .8125rem; text-transform: uppercase; letter-spacing: .05em; color: var(--dm-texto-suave); }
.produto-ficha dd { margin: 0; font-weight: 800; }
.seguranca-lista { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .9rem; }
.seguranca-lista li { display: flex; gap: .85rem; align-items: center; }
.seguranca-lista strong, .seguranca-lista span { display: block; }
.seguranca-lista span { color: var(--dm-texto-suave); font-size: .9375rem; }
.seguranca-icone { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--dm-manteiga-claro); font-size: 1.2rem; flex-shrink: 0; }
.seguranca-lista .is-confianca .seguranca-icone { background: var(--dm-verde-claro); color: var(--dm-verde-texto); }
.advertencia { margin-top: 1.25rem; background: var(--dm-pessego-claro); border-radius: 12px; padding: .75rem 1rem; font-size: .9375rem; }

.combo { display: grid; gap: 1.25rem; align-items: center; }
@media (min-width: 992px) { .combo { grid-template-columns: 1fr 300px; } }
.combo-itens { display: flex; flex-direction: column; gap: .75rem; align-items: stretch; }
@media (min-width: 768px) { .combo-itens { flex-direction: row; align-items: center; } }
.combo-produto { display: flex; gap: .85rem; align-items: center; flex: 1; }
.combo-produto img { width: 96px; height: 96px; border-radius: 14px; object-fit: cover; background: var(--dm-fundo-foto); flex-shrink: 0; }
.combo-nome { font-weight: 800; line-height: 1.3; }
.combo-mais { width: 40px; height: 40px; border-radius: 50%; background: var(--dm-manteiga); display: grid; place-items: center; font-size: 1.2rem; align-self: center; flex-shrink: 0; }
.combo-total { background: var(--dm-fundo); border-radius: var(--dm-raio); padding: 1rem 1.15rem; }
.combo-preco strong { font-size: 1.5rem; }

.distribuicao { list-style: none; padding: 0; margin: 0 0 1rem; }
.distribuicao-linha {
    width: 100%; display: grid; grid-template-columns: 44px 1fr 32px; gap: .5rem; align-items: center; min-height: 36px;
    border: 0; background: transparent; padding: 0 .25rem; border-radius: 8px; font-weight: 700; color: var(--dm-texto);
}
.distribuicao-linha:hover:not(:disabled) { background: var(--dm-manteiga-claro); }
.distribuicao-linha i { color: var(--dm-estrela); }
.distribuicao-barra { height: 8px; border-radius: 4px; background: var(--dm-borda); overflow: hidden; }
.distribuicao-barra span { display: block; height: 100%; background: var(--dm-estrela); border-radius: 4px; }
.filtros-avaliacao { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.avaliacao-item { padding: 1.1rem 0; border-top: 1px solid var(--dm-borda); }
.avaliacao-item:first-child { border-top: 0; padding-top: 0; }
.avaliacao-miniatura { padding: 0; border: 0; border-radius: 12px; overflow: hidden; margin-bottom: .5rem; cursor: zoom-in; }
.avaliacao-miniatura img { width: 96px; height: 96px; object-fit: cover; }
.nota-estrelas { display: inline-flex; flex-direction: row-reverse; gap: .15rem; }
.nota-estrelas input { position: absolute; opacity: 0; pointer-events: none; }
.nota-estrelas label { font-size: 2rem; color: var(--dm-borda-forte); cursor: pointer; width: 44px; height: 44px; display: grid; place-items: center; }
.nota-estrelas label:hover, .nota-estrelas label:hover ~ label,
.nota-estrelas input:checked ~ label { color: var(--dm-estrela); }
.nota-estrelas input:focus-visible + label { outline: 3px solid var(--dm-texto); border-radius: 8px; }

.lista-perguntas { margin: 0; }
.pergunta-item { padding: 1rem 0; border-top: 1px solid var(--dm-borda); }
.pergunta-item:first-child { border-top: 0; padding-top: 0; }
.pergunta-item dt { font-weight: 800; }
.pergunta-item dd { margin: .4rem 0 0; padding-left: 1.25rem; }

.barra-compra-fixa {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 1034;
    display: flex; align-items: center; justify-content: space-between; gap: .75rem;
    padding: .65rem 1rem calc(.65rem + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .97);
    box-shadow: 0 -6px 24px rgba(45, 42, 50, .12); border-radius: var(--dm-raio) var(--dm-raio) 0 0;
    transform: translateY(110%); transition: transform var(--dm-transicao);
}
.barra-compra-fixa.is-visivel { transform: none; }
.barra-compra-precos strong { font-size: 1.15rem; }
.barra-compra-fixa .btn { flex-shrink: 0; }
.pagina-produto .site-footer { padding-bottom: 80px; }
@media (min-width: 992px) { .pagina-produto .site-footer { padding-bottom: 0; } }

.lightbox .modal-content { background: rgba(255, 249, 243, .98); }
.lightbox-corpo { display: flex; align-items: center; justify-content: center; position: relative; padding: 0 1rem 1rem; }
.lightbox-corpo img { max-width: 100%; max-height: calc(100vh - 110px); object-fit: contain; border-radius: var(--dm-raio); }
.lightbox-anterior, .lightbox-proximo { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; display: grid; }
.lightbox-anterior { left: 1rem; }
.lightbox-proximo { right: 1rem; }
.tabela-medidas th[scope="row"] { font-weight: 900; }
.tabela-medidas .table { --bs-table-bg: transparent; }

/* -----------------------------------------------------------------------------
   23. Carrinho, mini-carrinho e resumo
   ----------------------------------------------------------------------------- */
[aria-busy="true"] { opacity: .6; pointer-events: none; transition: opacity .15s; }
.barra-frete { background: var(--dm-fundo); border-radius: var(--dm-raio-sm); padding: .75rem 1rem; margin-bottom: 1rem; }
.barra-frete i { color: var(--dm-verde-texto); }
.barra-frete-trilho { height: 10px; border-radius: 5px; background: var(--dm-borda); overflow: hidden; }
.barra-frete-trilho span { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, var(--dm-ceu), var(--dm-verde)); transition: width .6s cubic-bezier(.2, .7, .3, 1); }
.barra-frete.is-completa { background: var(--dm-verde-claro); color: var(--dm-verde-texto); }

.carrinho-lista { list-style: none; padding: 0; margin: 0; }
.carrinho-item { display: grid; grid-template-columns: auto 1fr auto; gap: .85rem; padding: 1rem 0; border-bottom: 1px solid var(--dm-borda); align-items: start; }
.carrinho-item:last-child { border-bottom: 0; }
.carrinho-item-foto img { border-radius: 14px; object-fit: cover; background: var(--dm-fundo-foto); }
.carrinho-item-info { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.carrinho-item-nome { font-weight: 800; color: var(--dm-texto); text-decoration: none; line-height: 1.3; }
.carrinho-item-nome:hover { text-decoration: underline; }
.carrinho-item-variacao { font-size: .9375rem; color: var(--dm-texto-suave); }
.carrinho-item-estoque { font-size: .875rem; color: #9A3412; font-weight: 700; }
.carrinho-item-acoes { display: flex; align-items: center; gap: .5rem; margin-top: .35rem; flex-wrap: wrap; }
.carrinho-item-preco { display: flex; flex-direction: column; align-items: flex-end; text-align: right; gap: .1rem; }
.carrinho-remover { min-height: 44px; color: var(--dm-texto-suave); }
.carrinho-embalagem { min-height: 0; margin-top: .25rem; font-size: .9375rem; }
.carrinho-embalagem label { font-weight: 600; }
.quantidade-sm .quantidade-botao { width: 40px; height: 40px; }
.quantidade-sm .quantidade-botao:disabled { opacity: .35; }
.quantidade-valor { min-width: 28px; text-align: center; font-weight: 800; }
@media (max-width: 575.98px) {
    .carrinho-item { grid-template-columns: auto 1fr; }
    .carrinho-item-preco { grid-column: 2; align-items: flex-start; text-align: left; flex-direction: row; gap: .5rem; align-items: baseline; }
}
.mini-carrinho { display: flex; flex-direction: column; min-height: 100%; }
.mini-carrinho-rodape { position: sticky; bottom: 0; background: var(--dm-fundo); padding: 1rem 0 .25rem; margin-top: auto; border-top: 1px solid var(--dm-borda); }
.carrinho-vazio { text-align: center; padding: 2rem 1rem; }
.carrinho-vazio > i { font-size: 3.5rem; color: var(--dm-pessego); }

.resumo-pedido { position: relative; }
@media (min-width: 992px) { .resumo-pedido { position: sticky; top: calc(var(--dm-header-altura) + 16px); } }
.resumo-pedido form + form { margin-top: 1rem; }
.form-cupom, .form-frete-carrinho { margin-bottom: 1rem; }
.cupom-aplicado { display: flex; justify-content: space-between; align-items: center; gap: .5rem; background: var(--dm-verde-claro); color: var(--dm-verde-texto); border-radius: 12px; padding: .35rem .5rem .35rem 1rem; }
.opcoes-frete { border: 0; padding: 0; margin: 0; }
.opcao-frete {
    display: flex; align-items: center; gap: .75rem; padding: .7rem .9rem; border: 2px solid var(--dm-borda); border-radius: var(--dm-raio-sm);
    background: #fff; cursor: pointer; margin-bottom: .5rem; min-height: 56px; transition: border-color var(--dm-transicao);
}
.opcao-frete:hover { border-color: var(--dm-borda-forte); }
.opcao-frete:has(input:checked) { border-color: var(--dm-texto); background: var(--dm-manteiga-claro); }
.opcao-frete input { width: 1.25rem; height: 1.25rem; accent-color: var(--dm-texto); flex-shrink: 0; }
.opcao-frete-nome { flex: 1; }
.resumo-valores { margin: 1rem 0 .75rem; }
.resumo-valores > div { display: flex; justify-content: space-between; gap: 1rem; padding: .35rem 0; }
.resumo-valores dt { font-weight: 600; }
.resumo-valores dd { margin: 0; font-weight: 800; text-align: right; white-space: nowrap; }
.resumo-valores .is-desconto, .is-desconto { color: var(--dm-verde-texto); }
.resumo-total { border-top: 2px dashed var(--dm-borda-forte); margin-top: .5rem; padding-top: .75rem !important; font-size: 1.25rem; }
.resumo-total dt, .resumo-total dd { font-weight: 900; }
.resumo-pix { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; background: var(--dm-manteiga-claro); border-radius: 12px; padding: .45rem .75rem; margin-bottom: .35rem; }
.resumo-brinde { background: var(--dm-pessego-claro); border-radius: 12px; padding: .5rem .75rem; margin: .75rem 0 0; font-size: .9375rem; }
.resumo-brinde.is-falta { background: var(--dm-fundo); }
.selos-seguranca { list-style: none; padding: 0; margin: 1rem 0 0; display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: .875rem; font-weight: 700; justify-content: center; }
.selos-seguranca i { color: var(--dm-verde-texto); }

/* -----------------------------------------------------------------------------
   24. Checkout e pedido
   ----------------------------------------------------------------------------- */
.checkout-topo { display: flex; justify-content: space-between; align-items: end; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.checkout-etapa { border: 0; margin-bottom: 1.25rem; }
.checkout-etapa-titulo { font-family: var(--dm-fonte-titulo); font-size: 1.4rem; font-weight: 700; display: flex; align-items: center; gap: .6rem; margin-bottom: 1rem; float: left; width: 100%; padding: 0; }
.checkout-etapa-titulo + * { clear: left; }
.opcoes-frete legend { font-size: 1rem; font-weight: 700; float: none; width: auto; margin-bottom: .5rem; }
.checkout-etapa-titulo > span { width: 34px; height: 34px; border-radius: 50%; background: var(--dm-texto); color: #fff; display: inline-grid; place-items: center; font-size: 1rem; font-family: var(--dm-fonte); font-weight: 900; }
.formas-pagamento { display: flex; flex-direction: column; gap: .6rem; margin-bottom: 1rem; }
.forma-pagamento { display: block; cursor: pointer; }
.forma-pagamento input { position: absolute; opacity: 0; pointer-events: none; }
.forma-pagamento-cabecalho {
    display: flex; align-items: center; gap: .85rem; padding: .9rem 1rem; border: 2px solid var(--dm-borda); border-radius: var(--dm-raio-sm);
    background: #fff; min-height: 64px; transition: border-color var(--dm-transicao), background-color var(--dm-transicao);
}
.forma-pagamento-cabecalho > i { font-size: 1.5rem; }
.forma-pagamento input:checked + .forma-pagamento-cabecalho { border-color: var(--dm-texto); background: var(--dm-manteiga-claro); }
.forma-pagamento input:focus-visible + .forma-pagamento-cabecalho { outline: 3px solid var(--dm-texto); outline-offset: 2px; }
.painel-pagamento { background: var(--dm-fundo); border-radius: var(--dm-raio-sm); padding: 1rem; }
.campo-seguro { height: 48px; border: 2px solid var(--dm-borda-forte); border-radius: var(--dm-raio-sm); background: #fff; padding: 0 .75rem; display: flex; align-items: center; }
.campo-seguro iframe { width: 100%; height: 44px; }
.checkout-itens { list-style: none; padding: 0; margin: 0 0 1rem; }
.checkout-itens li { display: flex; gap: .75rem; align-items: center; padding: .55rem 0; border-bottom: 1px solid var(--dm-borda); }
.checkout-item-foto { position: relative; flex-shrink: 0; }
.checkout-item-foto img { border-radius: 12px; object-fit: cover; background: var(--dm-fundo-foto); }
.checkout-item-qtd { position: absolute; top: -6px; right: -6px; min-width: 22px; height: 22px; border-radius: 11px; background: var(--dm-texto); color: #fff; font-size: .75rem; font-weight: 900; display: grid; place-items: center; padding: 0 4px; }
.checkout-item-nome { flex: 1; font-weight: 700; line-height: 1.3; }

.pedido-topo { display: flex; gap: 1.25rem; align-items: center; flex-wrap: wrap; background: var(--dm-manteiga-claro); }
.pedido-topo.is-pago { background: var(--dm-verde-claro); }
.pedido-topo.is-cancelado { background: #F2EDE8; }
.pedido-topo > div { flex: 1; min-width: 240px; }
.pedido-icone { width: 64px; height: 64px; border-radius: 50%; background: #fff; display: grid; place-items: center; font-size: 1.9rem; flex-shrink: 0; }
.pedido-topo.is-pago .pedido-icone { color: var(--dm-verde-texto); }
.pedido-codigo { background: #fff; border-radius: var(--bs-border-radius-pill); padding: .35rem 1rem; }
.pix-qr { width: 220px; height: 220px; max-width: 100%; border-radius: var(--dm-raio-sm); background: #fff; padding: .5rem; box-shadow: var(--dm-sombra); }
.pix-qr-teste { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; font-weight: 800; color: var(--dm-texto-suave); }
.pix-qr-teste i { font-size: 5rem; }
.simulador { border: 2px dashed var(--dm-borda-forte); background: var(--dm-fundo); }
.linha-tempo { list-style: none; padding: 0 0 0 1.25rem; margin: 0 0 1rem; border-left: 3px solid var(--dm-borda); }
.linha-tempo li { position: relative; padding: 0 0 1rem .75rem; }
.linha-tempo li::before { content: ""; position: absolute; left: -1.85rem; top: .35rem; width: 14px; height: 14px; border-radius: 50%; background: var(--dm-texto); border: 3px solid var(--dm-fundo-card); }

/* -----------------------------------------------------------------------------
   25. Área do cliente e listas de presentes
   ----------------------------------------------------------------------------- */
.auth-grade { display: grid; gap: 1.5rem; max-width: 980px; margin-inline: auto; }
@media (min-width: 992px) { .auth-grade { grid-template-columns: 1.1fr .9fr; align-items: start; } }
.auth-lateral { background: var(--dm-manteiga-claro); box-shadow: none; }
.campo-senha { position: relative; }
.campo-senha .form-control { padding-right: 3.25rem; }
.campo-senha .btn-icone { position: absolute; right: 2px; top: 50%; transform: translateY(-50%); }
.lista-beneficios { list-style: none; padding: 0; margin: 0 0 1.25rem; display: flex; flex-direction: column; gap: .6rem; }
.lista-beneficios i { color: var(--dm-verde-texto); margin-right: .4rem; }

.conta-menu-ola { font-size: 1.05rem; margin-bottom: .75rem; }
.conta-menu-lista { gap: .4rem; padding-block: .25rem .75rem; }
.conta-menu-lista a, .conta-menu-lista button {
    display: inline-flex; align-items: center; gap: .55rem; min-height: 44px; padding: 0 1rem; white-space: nowrap;
    border-radius: var(--bs-border-radius-pill); background: #fff; border: 2px solid var(--dm-borda);
    color: var(--dm-texto); font-weight: 700; text-decoration: none; width: 100%;
}
.conta-menu-lista a:hover, .conta-menu-lista button:hover { border-color: var(--dm-texto); }
.conta-menu-lista a.is-ativo { background: var(--dm-texto); color: #fff; border-color: var(--dm-texto); }
@media (min-width: 992px) {
    .conta-menu { position: sticky; top: calc(var(--dm-header-altura) + 16px); }
    .conta-menu-lista { flex-direction: column; overflow: visible; margin: 0; padding: 0; }
    .conta-menu-lista a, .conta-menu-lista button { border-radius: var(--dm-raio-sm); border-color: transparent; background: transparent; }
    .conta-menu-lista a:hover, .conta-menu-lista button:hover { background: var(--dm-manteiga-claro); border-color: transparent; }
}

.atalhos-conta { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
@media (min-width: 768px) { .atalhos-conta { grid-template-columns: repeat(4, 1fr); } }
.atalhos-conta a {
    display: flex; flex-direction: column; gap: .15rem; padding: 1rem 1.15rem; border-radius: var(--dm-raio);
    background: #fff; box-shadow: var(--dm-sombra); color: var(--dm-texto); text-decoration: none; height: 100%;
    transition: transform var(--dm-transicao), box-shadow var(--dm-transicao);
}
.atalhos-conta a:hover { transform: translateY(-3px); box-shadow: var(--dm-sombra-hover); }
.atalhos-conta i { font-size: 1.4rem; }
.atalhos-conta strong { font-family: var(--dm-fonte-titulo); font-size: 1.75rem; line-height: 1.1; }
.atalhos-conta span { color: var(--dm-texto-suave); font-weight: 700; }

.lista-pedidos { list-style: none; padding: 0; margin: 0; }
.pedido-linha {
    display: grid; grid-template-columns: auto 1fr auto auto; gap: .9rem; align-items: center; padding: .85rem 0;
    border-bottom: 1px solid var(--dm-borda); color: var(--dm-texto); text-decoration: none;
}
.lista-pedidos li:last-child .pedido-linha { border-bottom: 0; }
.pedido-linha:hover strong { text-decoration: underline; }
.pedido-linha img { border-radius: 12px; object-fit: cover; background: var(--dm-fundo-foto); }
.pedido-linha-info { display: flex; flex-direction: column; min-width: 0; }
.pedido-linha-fim { display: flex; flex-direction: column; align-items: flex-end; gap: .3rem; }
@media (max-width: 575.98px) {
    .pedido-linha { grid-template-columns: auto 1fr auto; }
    .pedido-linha-fim { grid-column: 2; align-items: flex-start; flex-direction: row; flex-wrap: wrap; }
    .pedido-linha > .bi-chevron-right { grid-row: 1; grid-column: 3; }
}

.endereco-cartao.is-principal { outline: 2px solid var(--dm-verde); outline-offset: -2px; }
.lista-cartao { display: block; color: var(--dm-texto); text-decoration: none; transition: transform var(--dm-transicao), box-shadow var(--dm-transicao); }
.lista-cartao:hover { transform: translateY(-3px); box-shadow: var(--dm-sombra-hover); color: var(--dm-texto); }
.lista-vazia > i, .lista-cartao + i { font-size: 3rem; color: var(--dm-pessego); }
.compartilhar-lista { background: var(--dm-pessego-claro); box-shadow: none; }
.itens-lista { list-style: none; padding: 0; margin: 0; }
.itens-lista > li { display: grid; grid-template-columns: auto 1fr auto; gap: .9rem; padding: 1rem 0; border-bottom: 1px solid var(--dm-borda); align-items: start; }
.itens-lista > li:last-child { border-bottom: 0; }
.itens-lista img { border-radius: 12px; object-fit: cover; background: var(--dm-fundo-foto); }
.itens-lista-info { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.itens-lista .is-completo .itens-lista-info > a::after { content: " ✓"; color: var(--dm-verde-texto); }

.lista-publica-topo { background: var(--dm-pessego-claro); box-shadow: none; }
.lista-mensagem { background: #fff; border-left: 4px solid var(--dm-pessego); border-radius: 0 var(--dm-raio-sm) var(--dm-raio-sm) 0; padding: .9rem 1.1rem; margin: 1rem 0; font-size: 1.0625rem; }
.lista-publica-info { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .4rem; }
.lista-publica-info i { color: var(--dm-verde-texto); margin-right: .35rem; }
.presente-card.is-completo .produto-card-midia img { filter: grayscale(.6); opacity: .7; }

.adicionar-lista .dropdown-menu { max-height: 260px; overflow-y: auto; }
.btn-favorito-produto { font-size: 1.5rem; flex-shrink: 0; background: #fff; box-shadow: var(--dm-sombra); }
.btn-favorito-produto[aria-pressed="true"] { color: #D6336C; }
.entrega-destino .opcao-frete i { color: var(--dm-texto); }

/* -----------------------------------------------------------------------------
   26. Animações (respeitam prefers-reduced-motion)
   ----------------------------------------------------------------------------- */
@keyframes dm-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(255, 107, 74, .55); }
    70%  { box-shadow: 0 0 0 14px rgba(255, 107, 74, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 107, 74, 0); }
}
@keyframes dm-bump {
    0% { transform: scale(1); } 30% { transform: scale(1.4); } 60% { transform: scale(.9); } 100% { transform: scale(1); }
}
@keyframes dm-surgir { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.surgir { animation: dm-surgir .45s ease both; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
    .produto-card:hover .produto-card-midia img,
    .categoria-card:hover, .idade-link:hover .idade-circulo, .btn-comprar:hover { transform: none !important; }
    .carrossel-trilho { scroll-behavior: auto; }
}

/* Celulares de 320px: seletor de quantidade e botão de compra em linhas separadas. */
@media (max-width: 374.98px) {
    .linha-compra { flex-wrap: wrap; }
    .linha-compra .btn-comprar { flex-basis: 100%; }
}