/* Estilo "doce" (Quero Doce): acolhedor e apetitoso. Cantos bem arredondados, botões em pílula,
   títulos em serifa suave, categorias em círculo e rodapé chocolate. O checkout só herda cores e fontes. */
.est-doce { --raio-banner: 26px; --rodape-destaque: var(--acento); }
.est-doce h1, .est-doce h2, .est-doce h3 { letter-spacing: -.012em; }
.est-doce:not(.is-checkout) .btn { border-radius: 99px; }
.est-doce:not(.is-checkout) .btn-sm { padding: 0 16px; }

/* Cabeçalho branco; busca em pílula com o botão de lupa na cor da marca */
.est-doce .hdr { background: var(--superficie); }
.est-doce .search input { border-radius: 99px; background: var(--fundo); padding-left: 20px; }
.est-doce .search input:focus { border-color: var(--botao); box-shadow: 0 0 0 4px color-mix(in srgb, var(--botao) 12%, transparent); }
.est-doce .search button { right: 5px; width: 36px; height: 36px; border-radius: 99px; background: var(--botao); color: #fff; }
.est-doce .search button:hover { background: color-mix(in srgb, var(--botao) 88%, #000); }
.est-doce .cart-count { background: var(--acento); }
/* Categorias em pílulas centralizadas */
.est-doce .hdr-nav-in { justify-content: center; align-items: center; gap: 4px; }
.est-doce .hdr-nav a { height: 36px; padding: 0 16px; border-radius: 99px; color: var(--texto); font-weight: 600; }
.est-doce .hdr-nav a::after { display: none; }
.est-doce .hdr-nav a:hover, .est-doce .hdr-nav a[aria-current="page"] { background: var(--fundo-suave); }
.est-doce .hdr-nav .nav-all .i { color: var(--acento); }

/* Títulos de seção centralizados, com o selo em morango */
.est-doce .sec-head { flex-direction: column; align-items: center; text-align: center; gap: 10px; }
.est-doce .sec-head h2 { font-size: clamp(26px, 3vw, 38px); font-weight: 600; }
.est-doce .sec-eyebrow, .est-doce .sl-eyebrow { color: var(--acento); }
.est-doce .link-arrow { color: var(--botao); }

/* Carrossel em cartão arredondado */
.est-doce .sl-title { font-weight: 600; }

/* Categorias em círculo com anel ao passar o mouse */
.est-doce .cats-circulos .cat2-img { box-shadow: 0 0 0 4px var(--fundo), 0 0 0 5px var(--linha); transition: box-shadow .2s; }
.est-doce .cats-circulos .cat2:hover .cat2-img { box-shadow: 0 0 0 4px var(--fundo), 0 0 0 6px var(--acento); }

/* Cartões de produto brancos e macios */
.est-doce .pcard { background: var(--superficie); border: 1px solid var(--linha); border-radius: 22px; padding: 8px 8px 16px; transition: box-shadow .25s, border-color .25s; }
.est-doce .pcard:hover { border-color: transparent; box-shadow: 0 18px 36px -22px rgba(59, 36, 24, .45); }
.est-doce .pcard-media { border-radius: 16px; }
.est-doce .pcard-body { padding: 12px 8px 0; }
.est-doce .tag { border-radius: 99px; }
.est-doce .tag:not(.tag-off) { background: var(--acento); color: #fff; }

/* Banners e cartões de receita */
.est-doce .bnrs-cartao .bnr { border-radius: 22px; }
.est-doce .faixa-code { border-radius: 99px; }
.est-doce .faixa-ico { border-radius: 99px; }

/* Vantagens: uma linha limpa entre fios finos, sem caixas. Ícone num círculo morango claro e texto ao lado;
   no desktop os itens vão de ponta a ponta, alinhados à grade da página */
.est-doce .benefits { background: transparent; }
.est-doce .benefits-end { margin-bottom: 44px; }
.est-doce .benefit-ico { width: 38px; height: 38px; border-radius: 99px; background: var(--fundo-suave); border: 0; color: var(--botao); }
.est-doce .benefit-ico .i { width: 19px; height: 19px; }
.est-doce .benefit-txt strong { font-weight: 700; }
@media (max-width: 1023px) {
  .est-doce .benefit, .est-doce .benefit.is-dup { padding: 13px 18px 13px 16px; }
}
@media (min-width: 1024px) {
  .est-doce .benefits-in { display: flex; justify-content: space-between; gap: 28px; }
  .est-doce .benefit { flex: 0 1 auto; padding: 20px 0; } /* largura mínima = título; quem encolhe é o texto de apoio */
  .est-doce .benefit ~ .benefit { border-left: 0; }
  .est-doce .benefit-txt small { white-space: normal; text-wrap: balance; }
  .est-doce .benefits-end { margin-bottom: 60px; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  /* tela média: ícone menor para cada título caber numa linha; o texto de apoio pode quebrar */
  .est-doce .benefits-in { gap: 16px; }
  .est-doce .benefit { gap: 10px; }
  .est-doce .benefit-ico { width: 34px; height: 34px; }
}
.est-doce .faq-wrap .faq, .est-doce .faq-help { border-radius: 24px; }

/* Carrinho: ícones no círculo morango claro (como as vantagens), quantidade em pílula e sugestões num cartão arredondado */
.est-doce .cart-row-ico { width: 34px; height: 34px; border-radius: 99px; background: var(--fundo-suave); }
.est-doce .cart-coupon .ship-row, .est-doce .cart-coupon-msg { margin-left: 46px; }
.est-doce .citem .qty { border-radius: 99px; }
.est-doce .upsell { margin: 20px 12px 16px; padding: 18px 14px 20px; border-radius: 22px; }

@media (min-width: 1024px) {
  .est-doce .hdr-in { height: 84px; }
  .est-doce .search input { height: 48px; }
  .est-doce .pgrid { gap: 28px 22px; }
}

/* Rodapé com borda recortada (festonê de forminha de doce) na cor do rodapé */
.est-doce .ftr-escuro { position: relative; margin-top: 18px; }
.est-doce .ftr-escuro::before { content: ""; position: absolute; left: 0; right: 0; top: -13px; height: 14px; background: radial-gradient(circle at 14px 14px, var(--rodape-fundo, var(--texto)) 13.5px, transparent 14px) repeat-x; background-size: 28px 14px; pointer-events: none; }
.est-doce .ftr-cta { border-radius: 22px; }
.est-doce .ftr-cta-btn { border-radius: 99px; }
