/*
 * Allpa Home — estilos da nova home.
 * Origem: protótipo aprovado (versão 7), docs/prototipos/nova-home-template.html
 * Cores e fontes seguem os tokens decididos em docs/direcao-visual.md.
 */

/*
 * Medidas em rem: a página inteira acompanha o tamanho de fonte da raiz.
 * No computador a raiz fica em 90% (pedido do Lucas em 13/09/2026: a home ficava melhor com zoom de 90%).
 * No celular continua 100%.
 */
html { font-size: 100%; }
@media (min-width: 761px) { html { font-size: 90%; } }

:root {
  --marrom: #382A23;
  --marrom-70: rgba(56, 42, 35, 0.72);
  --marrom-50: rgba(56, 42, 35, 0.5);
  --laranja: #FF7721;
  --laranja-hover: #F26A12;
  --pink: #F82989;
  --pessego: #F7B193;
  --estrela: #F4A51C;
  --estrela-vazia: #E6DCD5;
  --tinta-1: #FBF4EF;
  --tinta-2: #F8EDE7;
  --linha: #EEE4DE;
  --titulos: "Gloock", Georgia, "Times New Roman", serif;
  --corpo: "Open Sans", "Segoe UI", Arial, sans-serif;
  --raio-btn: 0.5rem;
  --raio-card: 1rem;
  --raio-painel: 1.375rem;
  --h-topo: 5.25rem;
  --largura: 82.5rem;
  --lado: clamp(1.25rem, 5vw, 5.5rem);
  --conteudo: 90rem;
  --borda: max(var(--lado), calc((100vw - var(--conteudo)) / 2));
  --trans: .45s cubic-bezier(.22, .61, .36, 1);
  color-scheme: light;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #FFFFFF; color: var(--marrom); font-family: var(--corpo); font-size: 1rem; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; }
button, input { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--laranja); outline-offset: 3px; }
/* campo de texto já mostra onde está o cursor: sem anel em volta */
input:focus-visible, textarea:focus-visible, select:focus-visible { outline: none; }
h1, h2, h3, h4 { font-family: var(--titulos); font-weight: 400; margin: 0; letter-spacing: -0.01em; text-wrap: balance; }
p { margin: 0; }
.wrap { max-width: calc(var(--conteudo) + 2 * var(--lado)); margin: 0 auto; padding: 0 var(--lado); }
.oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
svg.def { position: absolute; width: 0; height: 0; }

/* ================= botões ================= */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.625rem; min-height: 3rem; padding: 0 1.625rem; border: 0; border-radius: var(--raio-btn); font-weight: 700; font-size: 1rem; line-height: 1; text-decoration: none; cursor: pointer; white-space: nowrap; transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.btn svg { width: 1.125rem; height: 1.125rem; flex: none; }
.btn-primario { background: var(--laranja); color: #FFFFFF; box-shadow: 0 6px 16px -8px rgba(255, 119, 33, 0.75); }
.btn-primario:hover { background: var(--laranja-hover); transform: translateY(-1px); }
.btn-claro { background: #FFFFFF; color: var(--marrom); }
.btn-claro:hover { background: var(--tinta-1); }
.btn-caps { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.92rem; font-weight: 800; }

/* ================= títulos ================= */
.titulo { text-align: center; display: grid; gap: 0.75rem; justify-items: center; margin-bottom: 2.375rem; }
.titulo h2, .cab h2 { font-size: clamp(2.1rem, 4vw, 3.3rem); line-height: 1.04; }
.titulo h2 span, .cab h2 span { color: var(--laranja); }
.titulo p { max-width: 58ch; color: var(--marrom-70); }
.secao { padding: 5.5rem 0; }
.secao.colada { padding-top: 1rem; }

/* ================= barra de anúncio ================= */
.barra { background: var(--marrom); color: #FFFFFF; text-align: center; font-size: 0.82rem; font-weight: 600; letter-spacing: 0.04em; padding: 0.5625rem 1rem; position: relative; z-index: 40; }
.barra b { color: var(--pessego); }

/* ================= topo ================= */
.topo { position: sticky; top: 0; z-index: 30; height: var(--h-topo); color: #FFFFFF; background: rgba(255, 255, 255, 0); box-shadow: 0 1px 0 rgba(255, 255, 255, 0); transition: background-color var(--trans), color var(--trans), box-shadow var(--trans); }
.topo.solido, .topo:hover, .topo:focus-within { background: rgba(255, 255, 255, 1); color: var(--marrom); box-shadow: 0 1px 0 var(--linha), 0 12px 26px -22px rgba(56, 42, 35, 0.5); }
.topo .wrap { height: 100%; max-width: none; padding: 0 var(--borda); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1.5rem; }
.topo-esq { display: flex; align-items: center; gap: 1.5rem; }
.menu { display: flex; gap: 1.625rem; font-size: 0.84rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.menu a { text-decoration: none; padding: 0.375rem 0; background: linear-gradient(currentColor, currentColor) left bottom / 0 2px no-repeat; transition: background-size .3s ease; }
.menu a:hover { background-size: 100% 2px; }
.logo { position: relative; display: block; width: 7.25rem; height: 5.25rem; }
.logo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transition: opacity var(--trans); }
.logo .l-cor { opacity: 0; }
.topo.solido .l-branca, .topo:hover .l-branca, .topo:focus-within .l-branca { opacity: 0; }
.topo.solido .l-cor, .topo:hover .l-cor, .topo:focus-within .l-cor { opacity: 1; }
.topo-dir { display: flex; align-items: center; justify-content: flex-end; gap: 0.25rem; }
.busca { position: relative; display: flex; align-items: center; width: min(20rem, 25vw); height: 2.875rem; margin-right: 0.375rem; background: #FFFFFF; border-radius: var(--raio-btn); padding: 0 0.375rem 0 1rem; box-shadow: inset 0 0 0 1px rgba(56, 42, 35, 0); transition: background-color var(--trans), box-shadow var(--trans); }
.topo.solido .busca, .topo:hover .busca, .topo:focus-within .busca { background: var(--tinta-1); box-shadow: inset 0 0 0 1px var(--linha); }
.busca input { flex: 1; min-width: 0; border: 0; background: transparent; color: var(--marrom); font-size: 0.92rem; }
.busca input::placeholder { color: #8A7C74; }
.busca input:focus { outline: none; }
.busca:focus-within { box-shadow: 0 0 0 3px var(--laranja) !important; }
.busca button { border: 0; background: transparent; width: 2.25rem; height: 2.25rem; display: grid; place-items: center; cursor: pointer; color: var(--marrom); }
.ico { width: 2.75rem; height: 2.75rem; display: grid; place-items: center; border: 0; background: transparent; border-radius: 50%; cursor: pointer; color: inherit; position: relative; transition: background-color .2s ease; }
.ico:hover { background: var(--tinta-2); }
.ico svg, .busca svg { width: 1.4375rem; height: 1.4375rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ico .qtd { position: absolute; top: 3px; right: 2px; min-width: 1.1875rem; height: 1.1875rem; padding: 0 0.3125rem; border-radius: 0.625rem; background: var(--laranja); color: #FFFFFF; font-size: 0.7rem; font-weight: 800; display: grid; place-items: center; }
.so-cel { display: none !important; }

/* ================= herói (dividido, de ponta a ponta) ================= */
.heroi { position: relative; display: grid; margin-top: calc(-1 * var(--h-topo)); min-height: clamp(31rem, 72vh, 46rem); overflow: hidden; background: #FFF1E6; touch-action: pan-y; }
.slide { position: relative; grid-area: 1 / 1; display: grid; grid-template-columns: 1fr 1fr; opacity: 0; visibility: hidden; transition: opacity .8s ease, visibility .8s; }
.slide.ativo { opacity: 1; visibility: visible; }
.slide::after { content: ""; position: absolute; inset: 0 0 auto 0; height: 30%; z-index: 2; pointer-events: none; background: linear-gradient(180deg, rgba(40, 26, 20, 0.42) 0%, rgba(40, 26, 20, 0) 100%); }
.slide-link { position: absolute; inset: 0; z-index: 3; }
.lado-txt { position: relative; display: grid; align-content: center; padding: calc(var(--h-topo) + 2rem) clamp(1.5rem, 4vw, 4rem) 6.25rem var(--borda); }
.s-1 .lado-txt { background: linear-gradient(140deg, #FFF4EB 0%, #FFD9BF 100%); }
.s-2 .lado-txt { background: linear-gradient(140deg, #FFF2F6 0%, #F9D2E0 100%); }
.lado-txt .conteudo { position: relative; z-index: 4; display: grid; gap: 1.375rem; max-width: 35rem; pointer-events: none; }
.lado-txt .conteudo .btn { pointer-events: auto; }
.lado-foto { position: relative; overflow: hidden; }
.lado-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; transform: scale(1.05); transition: transform 7.5s ease-out; -webkit-user-drag: none; }
.slide.ativo .lado-foto img { transform: scale(1); }
.slide h1, .slide .h1 { font-size: clamp(2.2rem, 1.2rem + 3vw, 4.6rem); line-height: 1; }
.slide h1 span, .slide .h1 span { color: var(--laranja); }
.slide .sub { font-size: clamp(1rem, 0.9rem + 0.35vw, 1.2rem); color: var(--marrom-70); max-width: 42ch; }
.slide .acoes { display: flex; flex-wrap: wrap; gap: 0.75rem; padding-top: 0.25rem; }
.pontos { position: absolute; z-index: 5; left: var(--borda); bottom: 2.125rem; display: flex; gap: 0.625rem; }
.ponto { width: 2.75rem; height: 0.3125rem; padding: 0; border: 0; border-radius: 3px; background: rgba(56, 42, 35, 0.2); cursor: pointer; overflow: hidden; position: relative; }
.ponto::after { content: ""; position: absolute; inset: 0; background: var(--laranja); transform: scaleX(0); transform-origin: left; }
.ponto[aria-selected="true"]::after { transform: scaleX(1); }
.ponto.run::after { animation: encher 7s linear forwards; }
.heroi.pausado .ponto.run::after { animation-play-state: paused; }
@keyframes correr { to { transform: translateX(-50%); } }
@keyframes encher { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ================= faixa de confiança ================= */
.confianca { position: relative; overflow: hidden; background: linear-gradient(90deg, #FFF5EC 0%, #FFFFFF 50%, #FDEEF3 100%); border-bottom: 1px solid var(--linha); }
.confianca ul { list-style: none; margin: 0 auto; padding: 1.125rem var(--borda); display: grid; grid-template-columns: repeat(4, 1fr); }
.confianca li { display: flex; align-items: center; justify-content: center; gap: 0.875rem; padding: 2px 0.75rem; }
.confianca li + li { border-left: 1px solid rgba(56, 42, 35, 0.1); }
.confianca li.clone { display: none; }
.c-ico { width: 2.875rem; height: 2.875rem; flex: none; border-radius: 50%; background: #FFFFFF; display: grid; place-items: center; box-shadow: 0 8px 18px -12px rgba(56, 42, 35, 0.55), inset 0 0 0 1px rgba(255, 119, 33, 0.14); }
.c-ico svg { width: 1.4375rem; height: 1.4375rem; fill: none; stroke: var(--laranja); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.confianca li b { display: block; font-size: 0.98rem; font-weight: 800; line-height: 1.2; white-space: nowrap; }
.confianca li small { display: block; font-size: 0.84rem; font-weight: 600; color: var(--marrom-70); line-height: 1.3; white-space: nowrap; }

/* ================= categorias ================= */
.cats { padding: 3.5rem 0 0.5rem; }
.cats ul { list-style: none; margin: 0 auto; padding: 0.25rem 0; display: flex; justify-content: center; gap: clamp(1.25rem, 3vw, 3.5rem); }
.cats a { display: grid; justify-items: center; gap: 0.875rem; text-decoration: none; width: 14.5rem; -webkit-user-drag: none; }
.cats .circ { position: relative; display: block; width: 13.875rem; height: 13.875rem; border-radius: 50%; padding: 0.3125rem; isolation: isolate; transition: transform .35s cubic-bezier(.22, .61, .36, 1); }
.cats .circ::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 50%; background: conic-gradient(from 210deg, var(--laranja), var(--pink), var(--pessego), var(--laranja)); transition: transform 1.2s cubic-bezier(.22, .61, .36, 1); }
.cats a:hover .circ::before { transform: rotate(180deg); }
.cats .circ-midia { display: block; width: 100%; height: 100%; border-radius: 50%; overflow: hidden; border: 4px solid #FFFFFF; background: var(--tinta-1); box-shadow: inset 0 0 0 1px rgba(56, 42, 35, 0.04); }
.cats .circ-midia video { width: 100%; height: 100%; object-fit: cover; display: block; }
.cats .circ-video::after { content: ""; position: absolute; right: 8%; bottom: 8%; width: 0.75rem; height: 0.75rem; border-radius: 50%; background: var(--pink); box-shadow: 0 0 0 3px #FFFFFF; }
.cats .circ img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.cats a:hover .circ img, .cats a:hover .circ video { transform: scale(1.06); }
.cats a:hover .circ { transform: translateY(-3px) scale(1.03); }
.cats .nome { font-weight: 700; font-size: 1.1rem; text-align: center; line-height: 1.25; }

/* ================= carrosséis de produto ================= */
.cab { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.875rem; flex-wrap: wrap; }
.cab-dir { display: flex; align-items: center; gap: 1rem; }
.abas { display: inline-flex; padding: 0.3125rem; gap: 0.25rem; background: var(--tinta-1); border-radius: 0.75rem; }
.aba { border: 0; background: transparent; border-radius: 0.5625rem; padding: 0.6875rem 1.25rem; font-weight: 700; font-size: 0.93rem; cursor: pointer; color: var(--marrom-70); white-space: nowrap; transition: background-color .25s ease, color .25s ease, box-shadow .25s ease; }
.aba:hover { color: var(--marrom); }
.aba[aria-selected="true"] { background: #FFFFFF; color: var(--marrom); box-shadow: 0 4px 14px -8px rgba(56, 42, 35, 0.45); }
.setas { display: flex; gap: 0.5rem; }
.seta { width: 2.875rem; height: 2.875rem; border-radius: 50%; border: 1.5px solid var(--linha); background: #FFFFFF; display: grid; place-items: center; cursor: pointer; transition: border-color .2s ease, opacity .2s ease, background-color .2s ease; }
.seta:hover:not(:disabled) { border-color: var(--marrom); background: var(--tinta-1); }
.seta:disabled { opacity: 0.35; cursor: default; }
.seta svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: var(--marrom); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.painel { transition: opacity .35s ease, transform .35s ease; }
.painel.saindo { opacity: 0; transform: translateY(0.875rem); }
.trilho { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3 * 1.375rem) / 4); gap: 1.375rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 0.25rem 2px 1.25rem; scrollbar-width: none; cursor: grab; }
.trilho::-webkit-scrollbar { display: none; }
.trilho > * { scroll-snap-align: start; }

.arrastando { cursor: grabbing !important; scroll-snap-type: none !important; scroll-behavior: auto !important; user-select: none; }
.arrastando * { pointer-events: none; }

/* ================= card de produto ================= */
.card { background: #FFFFFF; border-radius: var(--raio-card); border: 1px solid var(--linha); overflow: hidden; display: grid; grid-template-rows: auto 1fr; transition: box-shadow .3s ease, transform .3s ease; }
.card:hover { box-shadow: 0 18px 38px -22px rgba(56, 42, 35, 0.42); transform: translateY(-3px); }
.card .foto { position: relative; aspect-ratio: 1 / 1.08; background: var(--tinta-1); overflow: hidden; }
.card .foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; -webkit-user-drag: none; }
.card:hover .foto img { transform: scale(1.05); }
.selos { position: absolute; top: 0.75rem; left: 0.75rem; display: grid; gap: 0.375rem; justify-items: start; }
.selo-off { background: var(--pink); color: #FFFFFF; font-size: 0.82rem; font-weight: 800; padding: 0.3125rem 0.625rem; border-radius: 0.375rem; line-height: 1; }
.selo-gatilho { background: var(--marrom); color: #FFFFFF; font-size: 0.66rem; font-weight: 800; letter-spacing: 0.09em; text-transform: uppercase; padding: 0.3125rem 0.5rem; border-radius: 0.375rem; line-height: 1; }
.card .corpo { padding: 1rem 1.125rem 1.125rem; display: flex; flex-direction: column; gap: 0.5rem; }
.aroma { display: inline-flex; align-items: center; gap: 0.375rem; width: fit-content; padding: 3px 0.625rem 3px 0.5rem; border-radius: 62.4375rem; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.aroma::before { content: ""; width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: currentColor; }
.aroma-coco { background: #F2E8DF; color: #7A5638; }
.aroma-baunilha { background: #FCE6EF; color: #B0266A; }
.aroma-tropical { background: #FFE9D8; color: #B84A0C; }
.nota-estrelas { display: flex; align-items: center; gap: 0.5rem; min-height: 1.25rem; white-space: nowrap; min-width: 0; }
.card .aroma { align-self: flex-start; }
.estr { position: relative; display: inline-flex; flex: none; line-height: 0; }
.estr .estr-fundo, .estr .estr-cheia { display: inline-flex; flex-wrap: nowrap; }
.estr .estr-cheia { position: absolute; inset: 0; width: var(--p); overflow: hidden; white-space: nowrap; }
.estr svg { width: 1rem; height: 1rem; flex: none; margin-right: 2px; }
.estr .estr-fundo svg { fill: var(--estrela-vazia); }
.estr .estr-cheia svg { fill: var(--estrela); }
.nota-estrelas b { font-size: 0.86rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.nota-estrelas .qt { font-size: 0.8rem; color: var(--marrom-50); font-weight: 600; }
.card h3 { font-family: var(--corpo); font-weight: 700; font-size: 1rem; line-height: 1.32; min-height: 2.64em; }
.preco { display: grid; gap: 0; font-variant-numeric: tabular-nums; }
.preco b { font-size: 1.5rem; font-weight: 800; line-height: 1.15; }
.preco s { font-size: 0.86rem; color: #A1948C; }
.parc { display: flex; align-items: center; gap: 0.5rem; font-size: 0.84rem; color: var(--marrom-70); font-variant-numeric: tabular-nums; }
.parc svg { width: 1.125rem; height: 1.125rem; flex: none; fill: none; stroke: var(--laranja); stroke-width: 1.8; stroke-linecap: round; }
.parc b { color: var(--marrom); font-weight: 800; }
.parc em { font-style: normal; color: var(--marrom-50); font-size: 0.76rem; }
.card .btn { width: 100%; margin-top: auto; }
.card .parc { margin-bottom: 0.5rem; }

/* ================= rituais favoritos: cenas compráveis ================= */
.cena-abas { display: flex; justify-content: center; margin: -0.5rem 0 2.25rem; }
.cena-palco { display: grid; }
.cena { grid-area: 1 / 1; display: grid; grid-template-columns: minmax(0, 32.5rem) minmax(0, 1fr); gap: 3.5rem; align-items: center; opacity: 0; visibility: hidden; transform: translateY(0.625rem); transition: opacity .45s ease, transform .45s ease, visibility .45s; }
.cena.ativa { opacity: 1; visibility: visible; transform: none; }
.cena-foto { position: relative; aspect-ratio: 4 / 5; border-radius: 1.625rem; overflow: hidden; background: var(--tinta-2); box-shadow: 0 36px 70px -44px rgba(56, 42, 35, 0.6); }
.cena-foto > img { width: 100%; height: 100%; object-fit: cover; -webkit-user-drag: none; }
.hot { position: absolute; z-index: 2; width: 2.375rem; height: 2.375rem; margin: -1.1875rem 0 0 -1.1875rem; padding: 0; border: 0; border-radius: 50%; background: #FFFFFF; color: var(--laranja); cursor: pointer; display: grid; place-items: center; box-shadow: 0 10px 22px -8px rgba(0, 0, 0, 0.45); transition: transform .3s ease, background-color .3s ease, color .3s ease; }
.hot svg { width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; transition: transform .3s ease; }
.hot::before { content: ""; position: absolute; inset: -0.5625rem; border-radius: 50%; border: 2px solid rgba(255, 255, 255, 0.9); animation: pulsar 2.2s ease-out infinite; }
.hot:hover, .hot.foco { transform: scale(1.12); }
.hot.aberto { background: var(--laranja); color: #FFFFFF; }
.hot.aberto svg { transform: rotate(45deg); }
@keyframes pulsar { 0% { transform: scale(0.7); opacity: 1; } 100% { transform: scale(1.35); opacity: 0; } }
.pop { position: absolute; z-index: 3; width: 15.625rem; background: #FFFFFF; border-radius: 1rem; padding: 0.75rem; display: grid; grid-template-columns: 4rem 1fr; gap: 0.625rem 0.75rem; align-items: center; box-shadow: 0 24px 44px -20px rgba(0, 0, 0, 0.5); opacity: 0; visibility: hidden; transform: translateY(0.5rem) scale(.97); transition: opacity .25s ease, transform .25s ease, visibility .25s; }
.pop.on { opacity: 1; visibility: visible; transform: none; }
.pop img { width: 4rem; height: 4rem; border-radius: 0.625rem; object-fit: cover; }
.pop h4 { font-family: var(--corpo); font-size: 0.86rem; font-weight: 700; line-height: 1.3; }
.pop .preco b { font-size: 1.1rem; }
.pop .btn { grid-column: 1 / -1; min-height: 2.625rem; }
.cena-lista { display: grid; gap: 1.25rem; align-content: center; }
.cena-lista h3 { font-size: clamp(2.2rem, 3.4vw, 3rem); line-height: 1.02; }
.cena-lista > p { color: var(--marrom-70); font-size: 1.05rem; max-width: 46ch; margin-top: -0.5rem; }
.cena-lista ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.25rem; }
.lp { display: grid; grid-template-columns: 5.25rem minmax(0, 1fr) auto; gap: 1rem; align-items: center; padding: 0.75rem; border-radius: 1rem; transition: background-color .25s ease; }
.lp.foco, .lp:hover { background: var(--tinta-1); }
.lp > img { width: 5.25rem; height: 5.25rem; border-radius: 0.75rem; object-fit: cover; background: var(--tinta-1); }
.lp .info { display: grid; gap: 0.25rem; min-width: 0; }
.lp h4 { font-family: var(--corpo); font-size: 0.98rem; font-weight: 700; line-height: 1.3; }
.lp .preco { display: flex; align-items: baseline; gap: 0.625rem; }
.lp .preco b { font-size: 1.2rem; }
.lp .preco s { font-size: 0.82rem; }
.btn-icone { width: 3rem; min-height: 3rem; padding: 0; flex: none; }
.btn-icone svg { width: 1.3125rem; height: 1.3125rem; }
.cena-total { display: grid; gap: 0.875rem; padding: 1.25rem 1.375rem; border-radius: 1.125rem; background: var(--tinta-2); }
.cena-total .soma { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; font-weight: 700; }
.cena-total .soma b { font-size: 1.45rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.cena-total .brinde { display: flex; align-items: center; gap: 0.625rem; font-size: 0.92rem; color: var(--marrom-70); }
.cena-total .brinde svg { width: 1.375rem; height: 1.375rem; flex: none; fill: none; stroke: var(--pink); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cena-total .brinde b { color: var(--marrom); }
.cena-total .btn { width: 100%; min-height: 3.375rem; }

/* ================= quiz ================= */
.quiz { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); border-radius: 1.75rem; overflow: hidden; background: var(--tinta-2); }
.quiz-foto { position: relative; min-height: 32.5rem; }
.quiz-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.quiz-caixa { padding: clamp(1.75rem, 4vw, 3.5rem); display: grid; align-content: center; gap: 1.375rem; }
.quiz-caixa h2 { font-size: clamp(2.1rem, 1.4rem + 2vw, 3.2rem); line-height: 1.04; }
.quiz-caixa h2 span { color: var(--laranja); }
.quiz-caixa > p { color: var(--marrom-70); max-width: 44ch; margin-top: -0.5rem; }
.q-progresso { display: flex; align-items: center; gap: 0.875rem; font-size: 0.85rem; font-weight: 700; color: var(--marrom-70); }
.q-barra { flex: 1; height: 0.375rem; border-radius: 3px; background: rgba(56, 42, 35, 0.12); overflow: hidden; }
.q-barra i { display: block; height: 100%; width: 33%; background: var(--laranja); border-radius: 3px; transition: width .45s ease; }
.q-passo { display: grid; gap: 0.875rem; animation: entrar .4s ease both; }
@keyframes entrar { from { opacity: 0; transform: translateY(0.625rem); } to { opacity: 1; transform: none; } }
.q-passo h3 { font-family: var(--corpo); font-size: 1.25rem; font-weight: 800; }
.q-opcoes { display: grid; gap: 0.625rem; }
.q-op { display: grid; grid-template-columns: 0.875rem 1fr; gap: 0.875rem; align-items: center; text-align: left; width: 100%; padding: 1rem 1.125rem; border: 1.5px solid var(--linha); border-radius: 0.875rem; background: #FFFFFF; cursor: pointer; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.q-op:hover { border-color: var(--laranja); transform: translateY(-1px); box-shadow: 0 10px 22px -16px rgba(56, 42, 35, 0.5); }
.q-op i { width: 0.875rem; height: 0.875rem; border-radius: 50%; }
.q-op b { display: block; font-size: 1rem; }
.q-op span { display: block; font-size: 0.86rem; color: var(--marrom-70); }
.q-voltar { justify-self: start; border: 0; background: transparent; padding: 0.375rem 0; font-weight: 700; color: var(--marrom-70); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.q-resultado { display: grid; gap: 1rem; animation: entrar .45s ease both; }
.q-resultado h3 { font-size: clamp(1.9rem, 1.3rem + 1.6vw, 2.6rem); line-height: 1.05; }
.q-resultado > p { color: var(--marrom-70); }
.q-prod { display: grid; grid-template-columns: 6rem 1fr; gap: 1rem; align-items: center; background: #FFFFFF; border-radius: 1rem; padding: 0.75rem; }
.q-prod img { width: 6rem; height: 6rem; border-radius: 0.75rem; object-fit: cover; }
.q-prod h4 { font-family: var(--corpo); font-size: 1rem; font-weight: 700; margin-bottom: 0.25rem; }
.q-prod .preco { display: flex; gap: 0.625rem; align-items: baseline; }
.q-acoes { display: flex; flex-wrap: wrap; gap: 0.625rem; }
.q-acoes .btn svg { fill: currentColor; stroke: none; }
.q-refazer { border: 0; background: transparent; font-weight: 700; color: var(--marrom-70); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; justify-self: start; }

/* ================= avaliações ================= */
.aval-resumo { display: flex; align-items: center; gap: 0.875rem; }
.aval-resumo .nota-grande { font-family: var(--titulos); font-size: 3rem; line-height: 1; color: var(--laranja); font-variant-numeric: tabular-nums; }
.aval-resumo small { display: block; font-size: 0.86rem; color: var(--marrom-70); font-weight: 600; }
.depo { background: #FFFFFF; border: 1px solid var(--linha); border-radius: var(--raio-card); padding: 1.375rem; display: flex; flex-direction: column; gap: 0.875rem; }
.depo blockquote { margin: 0; font-size: 1rem; line-height: 1.6; }
.depo blockquote::before { content: "“"; display: block; font-family: var(--titulos); font-size: 3rem; line-height: 0.6; color: var(--pessego); margin-bottom: 0.375rem; }
.depo .autor { font-weight: 800; font-size: 0.95rem; }
.depo .de { margin-top: auto; display: grid; grid-template-columns: 3rem 1fr; gap: 0.75rem; align-items: center; padding-top: 0.875rem; border-top: 1px solid var(--linha); text-decoration: none; }
.depo .de img { width: 3rem; height: 3rem; border-radius: 0.625rem; object-fit: cover; }
.depo .de span { font-size: 0.86rem; font-weight: 700; line-height: 1.3; }
.depo .de small { display: block; font-weight: 600; color: var(--marrom-70); }

/* ================= ritual completo ================= */
.passos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.375rem; counter-reset: passo; }
.passos li { counter-increment: passo; display: grid; gap: 0.75rem; align-content: start; }
.passos .img { position: relative; border-radius: var(--raio-card); overflow: hidden; aspect-ratio: 1; background: var(--tinta-1); }
.passos .img img { width: 100%; height: 100%; object-fit: cover; }
.passos .img::before { content: counter(passo); position: absolute; top: 0.875rem; left: 0.875rem; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: #FFFFFF; font-family: var(--titulos); font-size: 1.35rem; display: grid; place-items: center; box-shadow: 0 6px 16px -8px rgba(56, 42, 35, .5); }
.passos h3 { font-size: 1.75rem; }
.passos p { font-size: 0.93rem; color: var(--marrom-70); }

/* ================= sobre ================= */
.sobre { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 4rem; align-items: center; }
.sobre .txt { display: grid; gap: 1.375rem; }
.sobre h2 { font-size: clamp(2.4rem, 4.4vw, 3.8rem); line-height: 1; }
.sobre h2 span { color: var(--laranja); }
.s-abas { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.s-aba { border: 0; border-radius: 62.4375rem; padding: 0.625rem 1.25rem; font-weight: 700; font-size: 0.9rem; cursor: pointer; background: var(--tinta-2); color: var(--marrom-70); transition: background-color .3s ease, color .3s ease; }
.s-aba[aria-selected="true"] { background: var(--laranja); color: #FFFFFF; }
.s-painel { display: grid; }
.s-texto { grid-area: 1 / 1; font-size: 1.12rem; line-height: 1.7; max-width: 46ch; opacity: 0; visibility: hidden; transform: translateY(0.5rem); transition: opacity .45s ease, transform .45s ease, visibility .45s; }
.s-texto.ativo { opacity: 1; visibility: visible; transform: none; }
.s-fecho { font-weight: 700; }
.sobre .foto { border-radius: 1.625rem; overflow: hidden; box-shadow: 0 34px 60px -38px rgba(56, 42, 35, 0.55); aspect-ratio: 3 / 2; }
.sobre .foto img { width: 100%; height: 100%; object-fit: cover; }

/* ================= grupo vip ================= */
.vip { position: relative; min-height: 32.5rem; display: grid; place-items: center; text-align: center; color: #FFFFFF; overflow: hidden; isolation: isolate; }
.vip > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; z-index: -2; }
.vip::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 50% 55%, rgba(40, 26, 20, 0.62) 0%, rgba(40, 26, 20, 0.28) 60%, rgba(40, 26, 20, 0.12) 100%); }
.vip .txt { display: grid; gap: 1.125rem; justify-items: center; padding: 4rem 1.5rem; }
.vip h2 { font-size: clamp(2.6rem, 5.4vw, 4.6rem); line-height: 1; text-shadow: 0 4px 28px rgba(0, 0, 0, 0.35); }
.vip h2 span { color: var(--pessego); }
.vip p { font-size: 1.15rem; max-width: 42ch; text-shadow: 0 2px 16px rgba(0, 0, 0, 0.4); }
.vip .btn { margin-top: 0.375rem; min-height: 3.5rem; padding: 0 2.125rem; }
.vip .btn svg { fill: #FFFFFF; stroke: none; width: 1.375rem; height: 1.375rem; }

/* ================= rodapé ================= */
.rodape { background: radial-gradient(circle at 0% 100%, #FF6A1A 0%, #FF9A52 48%, #F48CA0 100%); color: #FFFFFF; }
.rodape a { color: #FFFFFF; }
.beneficios { background: #FFFFFF; color: var(--marrom); border-radius: 0 0 2rem 2rem; box-shadow: 0 18px 40px -30px rgba(56, 42, 35, 0.45); }
.beneficios ul { list-style: none; margin: 0 auto; padding: 2.125rem var(--borda) 2.375rem; display: grid; grid-template-columns: repeat(5, 1fr); }
.beneficios li { display: flex; gap: 1rem; align-items: flex-start; padding: 0.5rem 1.5rem; }
.beneficios li + li { border-left: 1px solid var(--linha); }
.beneficios .b-ico { width: 3.5rem; height: 3.5rem; border-radius: 0.75rem; background: var(--tinta-1); display: grid; place-items: center; flex: none; }
.beneficios svg { width: 1.75rem; height: 1.75rem; fill: none; stroke: var(--laranja); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.beneficios b { display: block; font-size: 1.08rem; line-height: 1.3; }
.beneficios span { display: block; font-size: 0.93rem; color: var(--marrom-70); line-height: 1.4; margin-top: 2px; }
.r-marca { display: grid; justify-items: center; text-align: center; gap: 0.875rem; padding: 4rem 1.5rem 3rem; }
.r-marca .logo-rodape { width: 10rem; height: auto; }
.r-marca .tag { font-size: 1.25rem; font-weight: 700; text-shadow: 0 1px 14px rgba(160, 60, 10, 0.25); }
.news { display: grid; justify-items: center; gap: 0.75rem; width: 100%; max-width: 35rem; margin-top: 0.375rem; }
.news label { font-size: 0.98rem; font-weight: 600; }
.news .campo { display: flex; gap: 0.375rem; width: 100%; background: #FFFFFF; border-radius: 0.75rem; padding: 0.375rem; box-shadow: 0 14px 30px -20px rgba(120, 40, 0, 0.6); }
.news input { flex: 1; min-width: 0; border: 0; background: transparent; padding: 0 1rem; color: var(--marrom); font-size: 1rem; }
.news input::placeholder { color: #8A7C74; }
.news input:focus { outline: none; }
.news .campo:focus-within { box-shadow: 0 0 0 3px var(--marrom); }
.news .btn { min-height: 3.125rem; }
.r-colunas { display: grid; grid-template-columns: 1.4fr 1fr 1.15fr 1fr 1fr; gap: 2.5rem; padding: 2.75rem 0 2.5rem; border-top: 1px solid rgba(255, 255, 255, 0.35); }
.r-col h4 { font-family: var(--corpo); font-size: 0.8rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 1rem; text-shadow: 0 1px 12px rgba(160, 60, 10, 0.2); }
.r-col p { font-size: 0.95rem; line-height: 1.65; max-width: 34ch; }
.r-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.625rem; }
.r-col li a { font-size: 0.95rem; font-weight: 600; text-decoration: none; background: linear-gradient(#FFFFFF, #FFFFFF) left bottom / 0 1.5px no-repeat; transition: background-size .3s ease; padding-bottom: 1px; }
.r-col li a:hover { background-size: 100% 1.5px; }
.redes { display: grid; gap: 0.625rem; }
.redes a { display: flex; align-items: center; gap: 0.75rem; text-decoration: none; font-weight: 600; font-size: 0.95rem; }
.redes .r-ico { width: 2.375rem; height: 2.375rem; border-radius: 50%; background: #FFFFFF; display: grid; place-items: center; flex: none; transition: transform .25s ease; }
.redes a:hover .r-ico { transform: scale(1.08); }
.redes svg { width: 1.125rem; height: 1.125rem; fill: var(--laranja); }
.r-selos { display: flex; justify-content: center; align-items: center; gap: 2.5rem; flex-wrap: wrap; padding: 1.625rem 0; border-top: 1px solid rgba(255, 255, 255, 0.35); }
.r-selos figure { margin: 0; display: grid; justify-items: center; gap: 0.5rem; }
.r-selos figcaption { font-size: 0.7rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.r-selos img { height: 2.5rem; width: auto; max-width: 100%; object-fit: contain; }
.b-pontos { display: none; }
.r-final { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; padding: 1.25rem 0 1.625rem; border-top: 1px solid rgba(255, 255, 255, 0.35); font-size: 0.8rem; font-weight: 700; letter-spacing: 0.06em; }

/* ================= flutuantes ================= */
.flutuantes { position: fixed; right: 1.75rem; bottom: 5.5rem; z-index: 50; display: grid; gap: 0.75rem; justify-items: center; }
.subir { width: 3rem; height: 3rem; border-radius: 50%; border: 0; background: #FFFFFF; box-shadow: 0 10px 24px -10px rgba(0, 0, 0, .35); display: grid; place-items: center; cursor: pointer; opacity: 0; transform: translateY(0.625rem); pointer-events: none; transition: opacity .3s ease, transform .3s ease; }
.subir.on { opacity: 1; transform: none; pointer-events: auto; }
.subir svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: var(--marrom); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.toast { position: fixed; left: 50%; bottom: 1.875rem; transform: translate(-50%, 1.25rem); z-index: 60; background: var(--marrom); color: #FFFFFF; padding: 0.8125rem 1.25rem; border-radius: 0.625rem; font-size: 0.92rem; opacity: 0; pointer-events: none; transition: opacity .25s ease, transform .25s ease; max-width: calc(100% - 2.5rem); text-align: center; }
.toast.on { opacity: 1; transform: translate(-50%, 0); }

/* ================= tablet ================= */
@media (max-width: 1180px) {
  .menu { display: none; }
  .so-cel { display: grid !important; }
  .busca { width: min(16.25rem, 30vw); }
  .trilho { grid-auto-columns: calc((100% - 2 * 1.375rem) / 3); }
  .cena { grid-template-columns: minmax(0, 26.25rem) minmax(0, 1fr); gap: 2.25rem; }
  .passos { grid-template-columns: repeat(2, 1fr); }
  .beneficios ul { grid-template-columns: repeat(3, 1fr); row-gap: 1.125rem; }
  .beneficios li:nth-child(4) { border-left: 0; }
  .r-colunas { grid-template-columns: repeat(3, 1fr); }
  .r-colunas .r-sobre { grid-column: 1 / -1; }
}

/* ================= celular ================= */
@media (max-width: 760px) {
  :root { --h-topo: 4rem; }
  html { scrollbar-width: none; }
  html::-webkit-scrollbar { display: none; }
  body { font-size: 0.9375rem; }

  .topo .wrap { padding: 0 0.5rem; gap: 0.25rem; }
  .busca { display: none; }
  .logo { width: 5.125rem; height: 3.75rem; }
  .ico { width: 2.625rem; height: 2.625rem; }
  .rolavel { scrollbar-width: none; overscroll-behavior-x: contain; }
  .rolavel::-webkit-scrollbar { display: none; }

  /* herói empilhado: foto em cima, texto embaixo */
  .heroi { height: auto; min-height: 0; }
  .slide { grid-template-columns: 1fr; grid-template-rows: min(34vh, 16.5rem) auto; }
  .lado-foto { order: -1; }
  .lado-foto img { object-position: 50% 24%; }
  .slide::after { height: 20%; }
  .lado-txt { padding: 1.25rem var(--lado) 2.5rem; align-content: start; }
  .lado-txt .conteudo { gap: 0.75rem; }
  .slide h1, .slide .h1 { font-size: 1.9rem; }
  .slide .sub { font-size: 0.95rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .slide .acoes { display: grid; grid-template-columns: 1fr; }
  .slide .acoes .btn-claro { display: none; }
  .pontos { left: var(--lado); bottom: 1rem; }

  /* faixa de confiança: rolagem contínua */
  .confianca ul { display: flex; width: max-content; padding: 0.75rem 0; animation: correr 26s linear infinite; }
  .confianca li, .confianca li.clone { display: flex; margin-right: 2.125rem; padding: 0; justify-content: flex-start; }
  .confianca li + li { border-left: 0; }
  .confianca:active ul { animation-play-state: paused; }
  .c-ico { width: 2.375rem; height: 2.375rem; }
  .c-ico svg { width: 1.25rem; height: 1.25rem; }
  .confianca li b { font-size: 0.9rem; }
  .confianca li small { font-size: 0.76rem; }
  /* quiz */
  .quiz { grid-template-columns: 1fr; border-radius: 1.25rem; }
  .quiz-foto { min-height: 0; height: 8.5rem; }
  .quiz-caixa { padding: 1.25rem 1.125rem 1.375rem; gap: 0.875rem; }
  .quiz-caixa h2 { font-size: clamp(1.5rem, 7vw, 2.05rem); white-space: nowrap; }
  .q-op { padding: 0.75rem 0.875rem; }
  .q-acoes .btn { flex: 1 1 100%; }
  /* avaliações */
  .aval-resumo .nota-grande { font-size: 2.4rem; }

  /* categorias arrastáveis */
  .cats { padding-top: 1.75rem; }
  .cats ul { justify-content: flex-start; overflow-x: auto; gap: 0.875rem; padding: 0.25rem var(--lado) 0.625rem; scroll-padding: 0 var(--lado); scroll-snap-type: x proximity; }
  .cats li { scroll-snap-align: start; }
  .cats a { width: 5.75rem; flex: none; gap: 0.5rem; }
  .cats .circ { width: 5.5rem; height: 5.5rem; padding: 3px; }
  .cats .circ-midia { border-width: 3px; }
  .cats .nome { font-size: 0.78rem; }

  .secao { padding: 3.5rem 0; }
  .titulo { margin-bottom: 1.5rem; }
  .titulo h2, .cab h2 { font-size: 2.05rem; }
  .cab h2 { font-size: clamp(1.5rem, 7vw, 2.05rem); white-space: nowrap; }

  /* carrosséis de produto */
  .cab { display: grid; gap: 0.875rem; margin-bottom: 1.125rem; }
  .cab-dir { display: block; }
  .abas { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; width: 100%; }
  .aba { white-space: normal; text-align: center; line-height: 1.2; padding: 0.625rem 0.5rem; font-size: 0.86rem; min-height: 2.75rem; }
  .cab .setas { display: none; }
  .trilho { grid-auto-columns: 62%; gap: 0.75rem; margin: 0 calc(-1 * var(--lado)); padding: 0.25rem var(--lado) 1.125rem; scroll-padding: 0 var(--lado); }
  .card .corpo { padding: 0.875rem 0.875rem 1rem; gap: 0.4375rem; }
  .card h3 { font-size: 0.95rem; }
  .preco b { font-size: 1.3rem; }
  .trilho .card .foto { aspect-ratio: 1 / 0.9; }
  .trilho .card .corpo { padding: 0.75rem 0.75rem 0.875rem; gap: 0.375rem; }
  .trilho .card h3 { font-size: 0.9rem; min-height: 2.5em; }
  .trilho .card .parc { margin-bottom: 0.25rem; font-size: 0.76rem; gap: 0.375rem; }
  .trilho .card .parc em { font-size: 0.7rem; }
  .trilho .card .parc svg { width: 1rem; height: 1rem; }
  .trilho .card .btn { min-height: 2.75rem; }
  .trilho .nota-estrelas .qt-rot { display: none; }

  /* cenas compráveis */
  .cena-abas { margin: -0.25rem 0 1.25rem; padding: 0; display: block; overflow: visible; }
  .cena { grid-template-columns: 1fr; gap: 1.375rem; }
  .cena-lista { display: none; }
  .cena-foto { border-radius: 1.25rem; }
  .pop { width: 13.75rem; grid-template-columns: 3.375rem 1fr; }
  .pop img { width: 3.375rem; height: 3.375rem; }
  .cena-lista { gap: 0.875rem; }
  .cena-lista h3 { font-size: 1.9rem; }
  .lp { grid-template-columns: 4.375rem minmax(0, 1fr) auto; gap: 0.75rem; padding: 0.625rem 0.375rem; }
  .lp > img { width: 4.375rem; height: 4.375rem; }
  .lp h4 { font-size: 0.9rem; }
  .cena-total { padding: 1rem; }

  /* notas: carrossel com respiro nas bordas */

  /* ritual: carrossel */
  .passos { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 64%; overflow-x: auto; scroll-snap-type: x mandatory; gap: 0.875rem; margin: 0 calc(-1 * var(--lado)); padding: 0 var(--lado) 0.5rem; scroll-padding: 0 var(--lado); -webkit-overflow-scrolling: touch; }
  .passos li { scroll-snap-align: start; }
  .passos h3 { font-size: 1.4rem; }
  .passos .img { aspect-ratio: 5 / 4; }
  .passos li { gap: 0.5rem; }

  /* sobre */
  .sobre { grid-template-columns: 1fr; gap: 1.5rem; }
  .sobre .foto { order: -1; aspect-ratio: 4 / 3; border-radius: 1.25rem; }
  .sobre .txt { gap: 1rem; }
  .sobre h2 { font-size: 2.3rem; }
  .s-abas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.25rem; padding: 0.25rem; background: var(--tinta-1); border-radius: 0.75rem; }
  .s-aba { border-radius: 0.5625rem; padding: 0.6875rem 0.375rem; background: transparent; }
  .s-aba[aria-selected="true"] { background: var(--laranja); }
  .s-texto { font-size: 1.02rem; }
  .sobre .txt > div:last-child .btn { width: 100%; }

  .vip { min-height: 28.75rem; }
  .vip p { font-size: 1rem; }

  /* rodapé: benefícios em carrossel */
  .beneficios { border-radius: 0 0 1.5rem 1.5rem; }
  .beneficios ul { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 100%; gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; padding: 1.375rem 0 0.5rem; }
  .beneficios li { scroll-snap-align: center; flex-direction: row; align-items: center; justify-content: center; gap: 0.875rem; padding: 0.375rem var(--lado); background: transparent; border-radius: 0; }
  .beneficios li + li { border-left: 0; }
  .beneficios .b-ico { width: 3rem; height: 3rem; }
  .beneficios svg { width: 1.5625rem; height: 1.5625rem; }
  .b-pontos { display: flex; justify-content: center; gap: 0.4375rem; padding: 0.375rem 0 1.25rem; }
  .b-pontos span { width: 0.4375rem; height: 0.4375rem; border-radius: 50%; background: #E2D3CA; transition: width .3s ease, background-color .3s ease; }
  .b-pontos span.on { width: 1.25rem; border-radius: 0.25rem; background: var(--laranja); }
  .r-marca { padding: 2.75rem 1.125rem 2.125rem; }
  .r-marca .logo-rodape { width: 8rem; }
  .r-marca .tag { font-size: 1.1rem; }
  .news .campo { flex-direction: column; background: transparent; box-shadow: none; padding: 0; gap: 0.625rem; }
  .news input { background: #FFFFFF; border-radius: 0.625rem; min-height: 3.25rem; }
  .news .btn { width: 100%; }
  .r-colunas { grid-template-columns: 1fr 1fr; gap: 1.875rem 1.25rem; padding: 2.125rem 0 1.875rem; }
  .r-selos { gap: 1.375rem; }
  .r-selos img { height: 1.75rem; }
  .r-final { justify-content: center; text-align: center; }
  .flutuantes { right: 1.25rem; bottom: 4.75rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation: none !important; }
}

/* ==========================================================================
   Integração com o WordPress e o WooCommerce (peças que o protótipo não tinha)
   ========================================================================== */

/* links que substituem os elementos de demonstração */
.card .foto { display: block; }
.card h3 a, .lp h4 a { color: inherit; text-decoration: none; }
.card h3 a:hover, .lp h4 a:hover { color: var(--laranja); }
.lp-foto { display: block; width: 5.25rem; height: 5.25rem; }
.lp-foto img { width: 100%; height: 100%; border-radius: 0.75rem; object-fit: cover; background: var(--tinta-1); display: block; }
.q-prod { color: inherit; text-decoration: none; transition: box-shadow .25s ease; }
.q-prod:hover { box-shadow: inset 0 0 0 1px var(--linha); }
.r-ico-traco svg { width: 1.1875rem; height: 1.1875rem; fill: none; stroke: var(--laranja); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* botões do WooCommerce: carregando, adicionado e esgotado */
.add_to_cart_button.loading, [data-levar-tudo].loading { opacity: .7; pointer-events: none; }
.add_to_cart_button.loading::after, [data-levar-tudo].loading::after { content: ""; width: 0.875rem; height: 0.875rem; margin-left: 0.5rem; border-radius: 50%; border: 2px solid currentColor; border-right-color: transparent; animation: allpa-gira .7s linear infinite; }
.btn-icone.loading svg { display: none; }
.btn-icone.loading::after { margin-left: 0; }
@keyframes allpa-gira { to { transform: rotate(360deg); } }
a.added_to_cart { display: none !important; }
.esgotado { display: inline-flex; align-items: center; justify-content: center; min-height: 3rem; padding: 0 1.125rem; border-radius: 0.5rem; background: var(--tinta-2); color: #8A7C74; font-weight: 700; font-size: 0.82rem; letter-spacing: 0.08em; text-transform: uppercase; }
.news-retorno { min-height: 1.3em; font-size: 0.9rem; font-weight: 600; margin: 0; }

/* gaveta do menu */
.gaveta { position: fixed; inset: 0; z-index: 80; }
.gaveta-fundo { position: absolute; inset: 0; background: rgba(56, 42, 35, 0.45); opacity: 0; transition: opacity .3s ease; }
.gaveta-painel { position: absolute; top: 0; left: 0; bottom: 0; width: min(23.5rem, 88vw); display: flex; flex-direction: column; background: #FFFFFF; color: var(--marrom); overflow-y: auto; overscroll-behavior: contain; transform: translateX(-100%); transition: transform .32s cubic-bezier(.22, .61, .36, 1); box-shadow: 20px 0 40px -30px rgba(56, 42, 35, 0.6); }
.gaveta-painel:focus { outline: none; }
.gaveta.on .gaveta-fundo { opacity: 1; }
.gaveta.on .gaveta-painel { transform: none; }
.gaveta-topo { display: flex; align-items: center; justify-content: space-between; padding: 0.875rem 1rem 0.875rem 1.25rem; border-bottom: 1px solid var(--linha); }
.gaveta-logo { width: 4.5rem; height: auto; }
.gaveta-fechar { color: var(--marrom); }
.gaveta-fechar svg { width: 1.375rem; height: 1.375rem; }
.gaveta nav { padding: 1.25rem 1.25rem 0; }
.gaveta-rotulo { margin: 0 0 0.5rem; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--marrom-50); }
.gaveta-cats, .gaveta-links { list-style: none; margin: 0; padding: 0; }
.gaveta-cats a { display: grid; grid-template-columns: 3rem 1fr auto; align-items: center; gap: 0.875rem; padding: 0.5rem 0.25rem; border-radius: 0.75rem; color: inherit; text-decoration: none; font-weight: 700; font-size: 1rem; transition: background-color .2s ease; }
.gaveta-cats a:hover, .gaveta-cats a:focus-visible { background: var(--tinta-1); }
.gaveta-cats .gc-foto { width: 3rem; height: 3rem; border-radius: 50%; overflow: hidden; background: var(--tinta-2); }
.gaveta-cats .gc-foto img { width: 100%; height: 100%; object-fit: cover; }
.gaveta-cats svg { width: 1.125rem; height: 1.125rem; fill: none; stroke: var(--laranja); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.gaveta-cats .gc-tudo { grid-template-columns: 1fr auto; margin-top: 0.25rem; padding: 0.875rem 0.25rem; color: var(--laranja); }
.gaveta-links { margin-top: 0.75rem; border-top: 1px solid var(--linha); padding-top: 0.5rem; }
.gaveta-links a { display: block; padding: 0.75rem 0.25rem; color: var(--marrom-70); text-decoration: none; font-weight: 600; font-size: 0.95rem; }
.gaveta-links a:hover { color: var(--laranja); }
.gaveta-rodape { margin-top: auto; padding: 1.25rem; display: grid; gap: 1rem; }
.gaveta-whats { display: grid; grid-template-columns: 2.5rem 1fr; align-items: center; gap: 0.75rem; padding: 0.75rem 0.875rem; border-radius: 0.875rem; background: var(--tinta-1); color: var(--marrom); text-decoration: none; font-size: 0.82rem; line-height: 1.35; }
.gaveta-whats svg { width: 2.5rem; height: 2.5rem; padding: 0.5rem; border-radius: 50%; background: #25D366; fill: #FFFFFF; }
.gaveta-whats b { display: block; font-size: 0.92rem; }
.gaveta-redes { display: flex; gap: 0.625rem; }
.gaveta-redes a { width: 2.5rem; height: 2.5rem; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--linha); color: var(--marrom); }
.gaveta-redes svg { width: 1.125rem; height: 1.125rem; fill: currentColor; }

/* busca: resultados enquanto digita */
.busca-resultados { position: absolute; top: calc(100% + 0.5rem); right: 0; width: min(26rem, 90vw); max-height: min(70vh, 32rem); overflow-y: auto; background: #FFFFFF; color: var(--marrom); border-radius: 0.875rem; box-shadow: 0 24px 48px -24px rgba(56, 42, 35, 0.45), 0 0 0 1px var(--linha); padding: 0.5rem; z-index: 40; text-align: left; }
.br-msg { margin: 0; padding: 0.875rem; font-size: 0.9rem; color: var(--marrom-70); }
.br-lista { list-style: none; margin: 0; padding: 0; }
.br-lista a { display: grid; grid-template-columns: 3.5rem 1fr; gap: 0.75rem; align-items: center; padding: 0.5rem; border-radius: 0.625rem; color: inherit; text-decoration: none; }
.br-lista a:hover, .br-lista a:focus-visible { background: var(--tinta-1); }
.br-lista img { width: 3.5rem; height: 3.5rem; border-radius: 0.5rem; object-fit: cover; background: var(--tinta-1); }
.br-info { display: grid; gap: 0.125rem; min-width: 0; }
.br-nome { font-weight: 700; font-size: 0.9rem; line-height: 1.3; }
.br-preco { display: flex; gap: 0.5rem; align-items: baseline; }
.br-preco b { font-size: 0.95rem; }
.br-preco s { font-size: 0.78rem; color: var(--marrom-50); }
.br-todos { display: block; margin-top: 0.25rem; padding: 0.75rem; border-top: 1px solid var(--linha); text-align: center; font-weight: 700; font-size: 0.86rem; color: var(--laranja); text-decoration: none; }

/* busca no celular: campo que desce no topo */
.busca-cel { position: fixed; top: 0; left: 0; right: 0; z-index: 70; padding: 0.625rem var(--lado); background: #FFFFFF; box-shadow: 0 16px 30px -24px rgba(56, 42, 35, 0.6); transform: translateY(-100%); transition: transform .25s ease; }
.busca-cel.on { transform: none; }
.busca-campo { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 0.5rem; height: 3rem; padding-left: 0.875rem; border-radius: var(--raio-btn); background: var(--tinta-1); color: var(--marrom); }
.busca-campo > svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.busca-campo input[type="search"] { min-width: 0; height: 100%; border: 0; background: transparent; font-size: 1rem; color: var(--marrom); }
.busca-campo input[type="search"]:focus { outline: none; }
.busca-campo .busca-resultados { left: 0; right: 0; width: auto; }

@media (max-width: 760px) {
  .lp-foto { width: 4.375rem; height: 4.375rem; }
}
@media (prefers-reduced-motion: reduce) {
  .gaveta-fundo, .gaveta-painel, .busca-cel { transition: none; }
}

/* widgets do tema antigo que o wp_footer ainda imprime: sem o CSS do WoodMart ficariam soltos na página */
body.allpa-home > [class^="wd-"], body.allpa-home > [class*=" wd-"], body.allpa-home > .tvd-toast, body.allpa-home > [class^="af-footer-v53"] { display: none !important; }

/* botão flutuante do plugin de WhatsApp (whatsapp-for-wordpress): menor e mais discreto */
#wa .wa__btn_popup { right: 1.5rem !important; bottom: 1.5rem !important; }
#wa .wa__btn_popup .wa__btn_popup_icon { width: 3.25rem; height: 3.25rem; box-shadow: 0 8px 20px -8px rgba(0, 0, 0, 0.35); }
#wa .wa__btn_popup .wa__btn_popup_icon::before { background-size: 1.625rem auto; }
#wa .wa__popup_chat_box { right: 1.5rem !important; bottom: 5.5rem !important; }
@media (max-width: 760px) {
  #wa .wa__btn_popup { right: 1rem !important; bottom: 1rem !important; }
  #wa .wa__btn_popup .wa__btn_popup_icon { width: 3rem; height: 3rem; }
  #wa .wa__btn_popup .wa__btn_popup_icon::before { background-size: 1.5rem auto; }
  #wa .wa__popup_chat_box { right: 1rem !important; bottom: 4.75rem !important; }
}

/* ==========================================================================
   Loja, categorias, busca e blog (templates/pagina-loja.php, pagina-blog.php, pagina-post.php)
   ========================================================================== */
.topo.fixo { position: sticky; }
.loja { padding: 0 0 5rem; }
.migalhas { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; font-size: 0.84rem; color: var(--marrom-50); }
.migalhas a { color: var(--marrom-70); text-decoration: none; }
.migalhas a:hover { color: var(--laranja); }
.migalhas [aria-current] { color: var(--marrom); font-weight: 600; }

/* banner baixo da coleção: texto à esquerda, foto à direita, produtos já na primeira tela */
.loja-banner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: clamp(15rem, 24vw, 20rem); background: linear-gradient(100deg, #FFF1E6 0%, #FDF0F3 100%); overflow: hidden; }
.loja-banner-texto { display: grid; align-content: center; gap: 0.875rem; padding: 2rem clamp(1.5rem, 4vw, 4rem) 2rem var(--borda); }
.loja-banner h1 { font-size: clamp(2.4rem, 1.4rem + 2.8vw, 3.9rem); line-height: 1; }
.loja-banner h1 span { color: var(--laranja); }
.loja-intro { max-width: 46ch; margin: 0; color: var(--marrom-70); font-size: 1.05rem; }
.loja-banner-foto { position: relative; min-height: 100%; }
.loja-banner-img { position: absolute; inset: 0; opacity: 0; transition: opacity .45s ease; }
.loja-banner-img.on { opacity: 1; }
.loja-banner-img img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; display: block; }
.loja-banner-foto::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 22%; z-index: 1; background: linear-gradient(90deg, #FFF1E6 0%, rgba(255, 241, 230, 0) 100%); pointer-events: none; }

.loja .confianca { margin-bottom: 0.5rem; }

/* coleções e aromas em chips */
.chips { display: flex; align-items: center; gap: 0.625rem; overflow-x: auto; scrollbar-width: none; padding: 2px; }
.chips::-webkit-scrollbar { display: none; }
.chips-colecao { margin-top: 1.75rem; }
.chip { display: inline-flex; align-items: center; gap: 0.5rem; flex: none; min-height: 2.75rem; padding: 0 1.125rem; border-radius: 62.4375rem; border: 1.5px solid var(--linha); background: #FFFFFF; color: var(--marrom); font: inherit; font-weight: 700; font-size: 0.93rem; text-decoration: none; white-space: nowrap; cursor: pointer; transition: border-color .2s ease, background-color .2s ease, color .2s ease; -webkit-user-drag: none; }
.chip:hover { border-color: var(--laranja); }
.chip:focus-visible, .pilula:focus-visible, .loja-btn:focus-visible { outline: 2px solid var(--laranja); outline-offset: 2px; }
.chip[aria-current] { background: var(--marrom); border-color: var(--marrom); color: #FFFFFF; }
.chip-foto { padding-left: 0.3125rem; }
.chip-img { width: 2.125rem; height: 2.125rem; border-radius: 50%; overflow: hidden; background: var(--tinta-1); flex: none; }
.chip-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.chip-foto[aria-current] .chip-img { box-shadow: 0 0 0 2px #FFFFFF; }
.chip-leve { min-height: 2.375rem; padding: 0 0.875rem; font-size: 0.86rem; }
.chip-leve[aria-pressed="true"] { background: var(--tinta-2); border-color: var(--laranja); }
.ponto-aroma { width: 0.625rem; height: 0.625rem; border-radius: 50%; flex: none; }
.ponto-aroma.aroma-coco { background: #B98B66; }
.ponto-aroma.aroma-baunilha { background: #E0468F; }
.ponto-aroma.aroma-tropical { background: #FF7721; }

/* barra no estilo Granado: contagem à esquerda, Filtros e Ordenar à direita */
.loja-ferramentas { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.5rem; padding: 1rem 0; border-top: 1px solid var(--linha); }
.loja-conta { margin: 0; font-size: 0.95rem; color: var(--marrom-70); }
.loja-acoes { display: flex; align-items: center; gap: 0.75rem; }
.loja-btn { position: relative; display: inline-flex; align-items: center; gap: 0.625rem; min-height: 3rem; padding: 0 1.125rem; border: 1.5px solid var(--linha); border-radius: var(--raio-btn); background: #FFFFFF; color: var(--marrom); font: inherit; font-size: 0.95rem; cursor: pointer; transition: border-color .2s ease; }
.loja-btn:hover, .loja-btn:focus-within { border-color: var(--marrom); }
.loja-btn svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.loja-btn-num { min-width: 1.375rem; height: 1.375rem; padding: 0 0.375rem; border-radius: 1rem; background: var(--laranja); color: #FFFFFF; font-size: 0.75rem; display: grid; place-items: center; }
.loja-ordem { margin: 0; }
.loja-btn-select { padding-right: 0.5rem; }
.loja-ordem-rotulo { color: var(--marrom-70); white-space: nowrap; }
.loja-ordem select { border: 0; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23382A23' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 0.25rem center / 1rem; padding: 0 1.75rem 0 0; min-height: 2.75rem; color: var(--marrom); font: inherit; font-weight: 700; cursor: pointer; appearance: none; -webkit-appearance: none; }
.loja-ordem select:focus { outline: none; }
.loja-btn-select:focus-within { box-shadow: 0 0 0 3px rgba(255, 119, 33, 0.35); }

.chips-aroma { margin-bottom: 0.25rem; }
.loja-aplicados { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0.875rem 0 0.25rem; }
.loja-aplicados > span[data-aplicados-lista] { display: contents; }
.pilula { display: inline-flex; align-items: center; gap: 0.375rem; min-height: 2.125rem; padding: 0 0.625rem 0 0.875rem; border: 0; border-radius: 62.4375rem; background: var(--tinta-2); color: var(--marrom); font: inherit; font-size: 0.84rem; font-weight: 700; cursor: pointer; }
.pilula svg { width: 0.875rem; height: 0.875rem; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.pilula:hover { background: #F5DDD0; }
.loja-limpar { border: 0; background: none; padding: 0.25rem 0.5rem; color: var(--marrom-70); font: inherit; font-size: 0.84rem; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

.grade { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.375rem; }
.grade-item { display: grid; }
.grade-item[hidden] { display: none; }
.grade.trocando .grade-item { animation: loja-entra .35s ease both; }
@keyframes loja-entra { from { opacity: 0; transform: translateY(0.5rem); } to { opacity: 1; transform: none; } }

.loja-vazia { display: grid; justify-items: center; gap: 0.75rem; text-align: center; margin-top: 1.25rem; padding: 3.5rem 1rem; border: 1px dashed var(--linha); border-radius: var(--raio-card); background: var(--tinta-1); }
.loja-vazia[hidden] { display: none; }
.loja-vazia h2 { font-size: 1.8rem; }
.loja-vazia p { margin: 0; color: var(--marrom-70); }

/* gaveta de filtros: painel à direita no computador, de baixo para cima no celular */
.gaveta-filtros .gaveta-painel { left: auto; right: 0; width: min(26rem, 92vw); transform: translateX(100%); box-shadow: -20px 0 40px -30px rgba(56, 42, 35, 0.6); }
.gaveta-filtros.on .gaveta-painel { transform: none; }
.filtros-cab { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1rem 1rem 1.5rem; border-bottom: 1px solid var(--linha); }
.filtros-cab h2 { font-size: 1.9rem; }
.filtros-cab .ico svg { width: 1.375rem; height: 1.375rem; }
.filtros-corpo { flex: 1; overflow-y: auto; padding: 0.5rem 1.5rem 1rem; }
.filtro-grupo { border: 0; margin: 0; padding: 1.125rem 0; border-bottom: 1px solid var(--linha); }
.filtro-grupo:last-child { border-bottom: 0; }
.filtro-grupo legend { padding: 0; margin-bottom: 0.625rem; font-size: 0.8rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--marrom-70); }
.filtro-op { display: flex; align-items: center; gap: 0.75rem; min-height: 2.75rem; cursor: pointer; }
.filtro-op input { width: 1.25rem; height: 1.25rem; margin: 0; accent-color: var(--laranja); flex: none; cursor: pointer; }
.filtro-op span { display: inline-flex; align-items: center; gap: 0.5rem; flex: 1; font-weight: 600; }
.filtro-op em { font-style: normal; font-size: 0.84rem; color: var(--marrom-50); font-variant-numeric: tabular-nums; }
.filtro-op em::before { content: "("; } .filtro-op em::after { content: ")"; }
.filtro-op.vazio { opacity: 0.45; }
.filtros-rodape { display: grid; grid-template-columns: auto 1fr; gap: 0.75rem; padding: 1rem 1.5rem calc(1rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--linha); background: #FFFFFF; }
.filtros-rodape .btn-claro { border: 1.5px solid var(--linha); }

/* "Mais sobre" (blog) e leia também */
.mais-sobre { margin-top: 4.5rem; }
.mais-sobre-cab { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.mais-sobre-cab h2 { font-size: clamp(2rem, 1.4rem + 1.6vw, 2.9rem); line-height: 1.04; }
.mais-sobre-cab h2 span { color: var(--laranja); }
.mais-sobre-todos { display: inline-flex; align-items: center; gap: 0.375rem; color: var(--marrom); font-weight: 700; text-decoration: none; white-space: nowrap; }
.mais-sobre-todos svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; transition: transform .2s ease; }
.mais-sobre-todos:hover svg { transform: translateX(3px); }
.trilho-posts { grid-auto-columns: calc((100% - 2 * 1.375rem) / 3); }

.post-card { display: grid; grid-template-rows: auto 1fr; background: #FFFFFF; border: 1px solid var(--linha); border-radius: var(--raio-card); overflow: hidden; transition: box-shadow .3s ease, transform .3s ease; }
.post-card:hover { box-shadow: 0 18px 38px -22px rgba(56, 42, 35, 0.42); transform: translateY(-3px); }
.post-foto { display: block; aspect-ratio: 16 / 10; background: var(--tinta-1); overflow: hidden; }
.post-foto img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
.post-card:hover .post-foto img { transform: scale(1.04); }
.post-foto-vazia { display: grid; place-items: center; width: 100%; height: 100%; color: var(--pessego); }
.post-foto-vazia svg { width: 3rem; height: 3rem; fill: none; stroke: currentColor; stroke-width: 1.4; }
.post-corpo { display: flex; flex-direction: column; gap: 0.625rem; padding: 1.25rem 1.375rem 1.5rem; }
.post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.875rem; margin: 0; font-size: 0.8rem; color: var(--marrom-50); }
.post-cat { padding: 0.1875rem 0.625rem; border-radius: 62.4375rem; background: var(--tinta-2); color: var(--marrom); font-weight: 800; font-size: 0.72rem; letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none; }
.post-card h3 { font-family: var(--corpo); font-size: 1.15rem; font-weight: 800; line-height: 1.3; }
.post-card h3 a { color: inherit; text-decoration: none; }
.post-card h3 a:hover { color: var(--laranja); }
.post-resumo { margin: 0; color: var(--marrom-70); font-size: 0.94rem; line-height: 1.55; }
.post-ler { display: inline-flex; align-items: center; gap: 0.375rem; margin-top: auto; padding-top: 0.25rem; color: var(--marrom); font-weight: 800; text-decoration: none; }
.post-ler svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; transition: transform .2s ease; }
.post-ler:hover svg { transform: translateX(3px); }

.blog-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.375rem; margin-top: 1.75rem; }
.post-card-destaque { grid-column: span 2; grid-template-columns: 1.15fr 1fr; grid-template-rows: none; }
.post-card-destaque .post-foto { aspect-ratio: auto; min-height: 100%; }
.post-card-destaque .post-corpo { justify-content: center; padding: 2rem; }
.post-card-destaque h3 { font-family: var(--titulos); font-weight: 400; font-size: clamp(1.7rem, 1.2rem + 1.2vw, 2.3rem); line-height: 1.08; }

.paginacao { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem; margin-top: 2.5rem; }
.paginacao .page-numbers { display: grid; place-items: center; min-width: 2.75rem; height: 2.75rem; padding: 0 0.75rem; border: 1.5px solid var(--linha); border-radius: var(--raio-btn); color: var(--marrom); font-weight: 700; text-decoration: none; }
.paginacao a.page-numbers:hover { border-color: var(--laranja); }
.paginacao .current { background: var(--marrom); border-color: var(--marrom); color: #FFFFFF; }
.paginacao .dots { border: 0; }
.paginacao svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }

/* texto e perguntas frequentes da categoria (Google) */
.loja-seo { margin-top: 4.5rem; }
.loja-seo .wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 2.5rem 4rem; padding-top: 3rem; border-top: 1px solid var(--linha); }
.loja-seo h2 { font-size: clamp(1.9rem, 1.3rem + 1.4vw, 2.6rem); line-height: 1.06; margin-bottom: 1rem; }
.loja-seo-texto p { margin: 0; color: var(--marrom-70); font-size: 1.02rem; line-height: 1.7; max-width: 52ch; }
.loja-faq h3 { font-family: var(--corpo); font-size: 0.8rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--marrom-70); margin-bottom: 0.5rem; }
.loja-faq details { border-bottom: 1px solid var(--linha); }
.loja-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.125rem 0; font-weight: 700; cursor: pointer; list-style: none; }
.loja-faq summary::-webkit-details-marker { display: none; }
.loja-faq summary svg { width: 1.125rem; height: 1.125rem; flex: none; fill: none; stroke: var(--laranja); stroke-width: 2.4; stroke-linecap: round; transition: transform .25s ease; }
.loja-faq details[open] summary svg { transform: rotate(45deg); }
.loja-faq details p { margin: 0 0 1.125rem; color: var(--marrom-70); line-height: 1.65; }

.loja-ajuda { margin-top: 4.5rem; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem 2.5rem; flex-wrap: wrap; padding: 2.25rem clamp(1.5rem, 4vw, 3.5rem); border-radius: var(--raio-painel); background: linear-gradient(110deg, #FFF1E6 0%, #FDEEF3 100%); }
.loja-ajuda h2 { font-size: clamp(1.9rem, 1.3rem + 1.5vw, 2.6rem); line-height: 1.05; }
.loja-ajuda h2 span { color: var(--laranja); }
.loja-ajuda p { margin: 0.5rem 0 0; max-width: 52ch; color: var(--marrom-70); }
.loja-ajuda-acoes { display: flex; flex-wrap: wrap; gap: 0.75rem; }

/* post */
.post-cab { max-width: calc(48rem + 2 * var(--lado)); padding-top: 2rem; display: grid; gap: 1rem; }
.post-cab h1 { font-size: clamp(2.3rem, 1.5rem + 2.4vw, 3.6rem); line-height: 1.04; }
.post-linha-fina { margin: 0; font-size: 1.15rem; color: var(--marrom-70); line-height: 1.55; }
.post-capa { max-width: calc(64rem + 2 * var(--lado)); margin: 2rem auto 0; }
.post-capa img { width: 100%; max-height: 34rem; object-fit: cover; border-radius: var(--raio-painel); display: block; }
.post-texto { max-width: calc(44rem + 2 * var(--lado)); margin-top: 2.5rem; font-size: 1.08rem; line-height: 1.8; }
.post-texto > * + * { margin-top: 1.25rem; }
.post-texto h2 { font-size: clamp(1.7rem, 1.3rem + 1vw, 2.2rem); line-height: 1.12; margin-top: 2.75rem; }
.post-texto h3 { font-family: var(--corpo); font-size: 1.2rem; font-weight: 800; margin-top: 2rem; }
.post-texto p, .post-texto li { color: #4A3B33; }
.post-texto ul, .post-texto ol { padding-left: 1.375rem; }
.post-texto li + li { margin-top: 0.5rem; }
.post-texto a { color: var(--laranja-hover); text-underline-offset: 3px; }
.post-texto strong { color: var(--marrom); }
.post-texto blockquote { margin-left: 0; padding: 1rem 1.5rem; border-left: 4px solid var(--laranja); background: var(--tinta-1); border-radius: 0 0.75rem 0.75rem 0; }
.post-texto img { border-radius: var(--raio-card); height: auto; }
.post-texto .post-dica { padding: 1.25rem 1.5rem; border-radius: var(--raio-card); background: var(--tinta-2); }
.post-compartilhar { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--linha); }
.post-compartilhar svg { width: 1.25rem; height: 1.25rem; fill: #25D366; }
.post-produtos .trilho { padding-bottom: 1.25rem; }

@media (max-width: 1180px) {
  .grade { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .blog-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trilho-posts { grid-auto-columns: calc((100% - 1.375rem) / 2); }
}
@media (max-width: 760px) {
  .loja { padding-bottom: 3.5rem; }
  .loja-banner { grid-template-columns: 1fr; min-height: 0; }
  .loja-banner-foto { order: -1; height: 11.5rem; }
  .loja-banner-foto::before { inset: auto 0 0 0; width: auto; height: 45%; background: linear-gradient(0deg, #FFF1E6 0%, rgba(255, 241, 230, 0) 100%); }
  .loja-banner-texto { padding: 0 var(--lado) 1.5rem; margin-top: -1.5rem; position: relative; z-index: 2; gap: 0.625rem; }
  .loja-banner h1 { font-size: 2.35rem; }
  .loja-intro { font-size: 0.95rem; }
  .chips { margin-left: calc(-1 * var(--lado)); margin-right: calc(-1 * var(--lado)); padding: 2px var(--lado); }
  .chips-colecao { margin-top: 1.25rem; }
  .loja-ferramentas { flex-wrap: wrap; margin-top: 1rem; padding: 0.75rem 0; }
  .loja-conta { width: 100%; font-size: 0.88rem; }
  .loja-acoes { width: 100%; display: grid; grid-template-columns: auto 1fr; }
  .loja-btn { min-height: 2.875rem; padding: 0 0.875rem; font-size: 0.9rem; }
  .loja-ordem-rotulo { display: none; }
  .loja-btn-select { width: 100%; }
  .loja-ordem select { width: 100%; }
  .grade { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
  .grade .card .corpo { padding: 0.75rem 0.75rem 0.875rem; }
  .grade .card h3 { font-size: 0.88rem; }
  .grade .preco b { font-size: 1.15rem; }
  .grade .parc { font-size: 0.74rem; align-items: flex-start; }
  .grade .card .btn { min-height: 2.75rem; padding: 0 0.5rem; font-size: 0.86rem; }
  .grade .selo-gatilho { font-size: 0.6rem; }
  .grade .nota-estrelas { gap: 0.3125rem; }
  .grade .estr svg { width: 0.8125rem; height: 0.8125rem; margin-right: 1px; }
  .grade .nota-estrelas b { font-size: 0.78rem; }
  .grade .nota-estrelas .qt { font-size: 0.74rem; }
  .grade .qt-rot { display: none; }
  .gaveta-filtros .gaveta-painel { top: auto; left: 0; width: 100%; max-height: 88vh; border-radius: 1.25rem 1.25rem 0 0; transform: translateY(100%); }
  .mais-sobre, .loja-seo, .loja-ajuda { margin-top: 3rem; }
  .mais-sobre-cab { align-items: flex-start; flex-direction: column; gap: 0.5rem; }
  .trilho-posts { grid-auto-columns: 82%; }
  .blog-grade { grid-template-columns: 1fr; gap: 1rem; }
  .post-card-destaque { grid-column: auto; grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .post-card-destaque .post-foto { aspect-ratio: 16 / 10; }
  .post-card-destaque .post-corpo { padding: 1.25rem 1.375rem 1.5rem; }
  .loja-seo .wrap { grid-template-columns: 1fr; gap: 1.5rem; padding-top: 2rem; }
  .loja-ajuda { padding: 1.75rem 1.25rem; }
  .loja-ajuda-acoes, .loja-ajuda-acoes .btn { width: 100%; }
  .post-cab { padding-top: 1.25rem; }
  .post-capa img { border-radius: var(--raio-card); max-height: 18rem; }
  .post-texto { font-size: 1rem; margin-top: 1.75rem; }
}
@media (prefers-reduced-motion: reduce) {
  .grade.trocando .grade-item { animation: none; }
  .loja-banner-img, .gaveta-filtros .gaveta-painel { transition: none; }
}

/* ================= página de produto ================= */
.pdp { padding-bottom: 0; }
.pdp .migalhas { padding-top: 1.25rem; }
.pdp-topo { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: clamp(2rem, 4vw, 4.5rem); align-items: start; margin-top: 1.25rem; }

/* galeria */
.pdp-galeria { position: sticky; top: calc(var(--h-topo) + 1rem); display: grid; gap: 0.875rem; min-width: 0; }
.pdp-palco { position: relative; border-radius: var(--raio-painel); overflow: hidden; background: var(--tinta-1); }
.pdp-fotos { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; overscroll-behavior-x: contain; }
.pdp-fotos::-webkit-scrollbar { display: none; }
.pdp-foto { margin: 0; scroll-snap-align: start; aspect-ratio: 1 / 1; }
.pdp-ampliar { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.pdp-ampliar img { width: 100%; height: 100%; object-fit: cover; -webkit-user-drag: none; transition: transform .6s cubic-bezier(.22, .61, .36, 1); }
@media (hover: hover) { .pdp-ampliar:hover img { transform: scale(1.04); } }
.pdp-ampliar:active img { transform: scale(0.97); transition-duration: .15s; }
.pdp-palco .selos { top: 1rem; left: 1rem; z-index: 2; }
.pdp-seta { position: absolute; top: 50%; z-index: 2; transform: translateY(-50%); box-shadow: 0 8px 20px -12px rgba(56, 42, 35, 0.5); }
.pdp-seta[data-foto="ant"] { left: 1rem; }
.pdp-seta[data-foto="prox"] { right: 1rem; }
.pdp-seta:disabled { opacity: 0; pointer-events: none; }
.pdp-contador { position: absolute; right: 1rem; bottom: 1rem; z-index: 2; padding: 0.25rem 0.625rem; border-radius: 1rem; background: rgba(255, 255, 255, 0.9); font-size: 0.8rem; color: var(--marrom-70); font-variant-numeric: tabular-nums; }
.pdp-contador b { color: var(--marrom); }
.pdp-miniaturas { display: flex; gap: 0.625rem; overflow-x: auto; scrollbar-width: none; padding: 2px; }
.pdp-miniaturas::-webkit-scrollbar { display: none; }
.pdp-mini { flex: none; width: 5.25rem; height: 5.25rem; padding: 0; border: 2px solid transparent; border-radius: 0.75rem; overflow: hidden; background: var(--tinta-1); cursor: pointer; opacity: 0.7; transition: opacity .2s ease, border-color .2s ease; }
.pdp-mini img { width: 100%; height: 100%; object-fit: cover; }
.pdp-mini:hover { opacity: 1; }
.pdp-mini[aria-current="true"] { border-color: var(--laranja); opacity: 1; }

/* coluna de compra */
.pdp-compra { display: grid; gap: 1.125rem; min-width: 0; }
.pdp-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1rem; }
.pdp-nota { text-decoration: none; }
.pdp-nota .qt { text-decoration: underline; text-underline-offset: 3px; }
.pdp-compra h1 { font-size: clamp(2rem, 1.4rem + 1.8vw, 3rem); line-height: 1.05; }

/* notas e intensidade: etiquetas simples e uma escala em três partes com o nível escrito */
.pdp-perfil { display: grid; gap: 1rem; }
.pdp-perfil-notas { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.pdp-nota-tag { padding: 0.3125rem 0.875rem; border: 1px solid var(--linha); border-radius: 62.4375rem; font-size: 0.9rem; color: var(--marrom); background: #FFFFFF; }
.pdp-escala { display: grid; gap: 0.5rem; max-width: 24rem; }
.pdp-escala-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; font-size: 0.88rem; color: var(--marrom-70); }
.pdp-escala-cab b { color: var(--laranja); font-weight: 800; font-size: 0.92rem; }
.pdp-escala-barra { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 0.3125rem; }
.pdp-escala-barra span { display: grid; gap: 0.375rem; }
.pdp-escala-barra i { position: relative; height: 0.5rem; border-radius: 1rem; background: var(--tinta-2); overflow: hidden; }
.pdp-escala-barra .cheio i { background: linear-gradient(90deg, var(--pessego), var(--laranja)); }
.pdp-escala-barra .atual i::after { content: ""; position: absolute; right: 0.1875rem; top: 50%; width: 0.3125rem; height: 0.3125rem; border-radius: 50%; background: #FFFFFF; transform: translateY(-50%); }
.pdp-escala-barra small { font-size: 0.74rem; color: var(--marrom-50); }
.pdp-escala-barra span:nth-child(2) small { text-align: center; }
.pdp-escala-barra span:last-child small { text-align: right; }
.pdp-escala-barra .atual small { color: var(--marrom); font-weight: 700; }

.pdp-descricao-texto { display: grid; gap: 0.75rem; color: var(--marrom-70); font-size: 0.97rem; line-height: 1.65; }
.pdp-descricao-texto p { margin: 0; }
.pdp-descricao.fechada .pdp-descricao-texto { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.pdp-descricao.fechada .pdp-descricao-texto p + p { display: none; }
.pdp-ler-mais { margin-top: 0.25rem; padding: 0; border: 0; background: none; font: inherit; font-size: 0.9rem; font-weight: 700; color: var(--marrom); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

/* caixa de compra (referência Sallve): preço e desconto em R$, compra, frete grátis e pagamento */
.pdp-caixa { border: 1.5px solid var(--linha); border-radius: var(--raio-painel); overflow: hidden; background: #FFFFFF; }
.pdp-caixa-corpo { display: grid; gap: 1rem; padding: 1.375rem 1.375rem 1.25rem; }
.pdp-precos { display: grid; gap: 0.125rem; }
.pdp-de { display: flex; align-items: center; gap: 0.5rem; font-size: 0.92rem; color: #A1948C; }
.pdp-tag { padding: 0.125rem 0.4375rem; border-radius: 0.3125rem; background: var(--pink); color: #FFFFFF; font-style: normal; font-weight: 800; font-size: 0.8rem; line-height: 1.3; }
.pdp-por { font-size: clamp(2.1rem, 1.7rem + 1vw, 2.6rem); font-weight: 800; line-height: 1.05; font-variant-numeric: tabular-nums; }
.pdp-pagamentos { display: grid; gap: 0.125rem; margin-top: -0.375rem; font-size: 0.92rem; color: var(--marrom-70); }
.pdp-pix { color: #2F8A57; }
.pdp-pix b { font-weight: 800; }
.pdp-comprar { display: grid; grid-template-columns: auto 1fr; gap: 0.625rem; }
.pdp-qtd { display: inline-flex; align-items: center; height: 3.5rem; border: 1.5px solid var(--linha); border-radius: var(--raio-btn); background: #FFFFFF; }
.pdp-qtd button { width: 3rem; height: 100%; border: 0; background: none; font-size: 1.375rem; color: var(--marrom); cursor: pointer; border-radius: var(--raio-btn); }
.pdp-qtd button:hover { background: var(--tinta-1); color: var(--laranja); }
.pdp-qtd button:disabled { color: #D5CBC4; cursor: not-allowed; }
.pdp-qtd input { width: 2.5rem; height: 100%; border: 0; background: none; text-align: center; font-weight: 700; font-size: 1.05rem; font-variant-numeric: tabular-nums; -moz-appearance: textfield; }
.pdp-qtd input::-webkit-outer-spin-button, .pdp-qtd input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pdp-add { min-height: 3.5rem; font-size: 1rem; }
.pdp-add.carregando, .pdp-fixo .btn.carregando, [data-ritual-add].carregando { opacity: 0.7; pointer-events: none; }
.pdp-zap { width: 100%; min-height: 3.25rem; background: #FFFFFF; color: #1F8F4E; border: 1.5px solid #25D366; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.86rem; font-weight: 800; }
.pdp-zap:hover { background: #F0FBF4; }
.pdp-zap svg { width: 1.25rem; height: 1.25rem; fill: #25D366; }
.pdp-indisponivel { font-size: 0.95rem; }
.pdp-caixa-faixa { display: flex; align-items: center; justify-content: center; gap: 0.5rem; margin: 0; padding: 0.625rem 1rem; background: var(--tinta-2); font-size: 0.92rem; }
.pdp-caixa-faixa svg { width: 1.125rem; height: 1.125rem; color: var(--laranja); }
.pdp-caixa-faixa b { font-weight: 800; }
.pdp-caixa-rodape { display: grid; justify-items: center; gap: 0.375rem; padding: 0.875rem 1rem 1rem; font-size: 0.86rem; color: var(--marrom-70); }
.pdp-caixa-rodape p { display: flex; align-items: center; gap: 0.375rem; }
.pdp-caixa-rodape svg { width: 1rem; height: 1rem; color: var(--marrom-70); }
.pdp-formas i { width: 1px; height: 0.875rem; margin: 0 0.375rem; background: var(--linha); }

/* frete */
.pdp-frete { display: grid; gap: 0.5rem; }
.pdp-frete label { font-weight: 700; font-size: 0.95rem; }
.pdp-cep { display: grid; grid-template-columns: 1fr auto; height: 3.125rem; border: 1.5px solid var(--linha); border-radius: 62.4375rem; overflow: hidden; background: #FFFFFF; }
.pdp-cep:focus-within { border-color: #B9A89C; }
.pdp-cep input { min-width: 0; height: 100%; padding: 0 1.125rem; border: 0; background: none; font-size: 1rem; font-variant-numeric: tabular-nums; }
.pdp-cep button { margin: 0.25rem; padding: 0 1.25rem; border: 0; border-radius: 62.4375rem; background: var(--marrom); color: #FFFFFF; font: inherit; font-weight: 700; font-size: 0.9rem; cursor: pointer; }
.pdp-cep button:hover { background: #20150F; }
.pdp-nao-sei { justify-self: start; font-size: 0.8rem; color: var(--marrom-70); }
.pdp-fretes:empty { display: none; }
.pdp-fretes { display: grid; gap: 0.375rem; }
.pdp-fretes ul { list-style: none; margin: 0; padding: 0; display: grid; border: 1.5px solid var(--linha); border-radius: 1rem; overflow: hidden; }
.pdp-fretes li { display: grid; grid-template-columns: 1fr auto; gap: 0.125rem 0.75rem; padding: 0.75rem 1rem; font-size: 0.9rem; }
.pdp-fretes li + li { border-top: 1px solid var(--linha); }
.pdp-fretes li[hidden] { display: none; }
.pdp-fretes li b { font-weight: 700; }
.pdp-fretes li b em { margin-left: 0.375rem; padding: 0.0625rem 0.375rem; border-radius: 0.25rem; background: var(--tinta-2); font-style: normal; font-size: 0.72rem; font-weight: 700; color: var(--marrom-70); vertical-align: 1px; }
.pdp-fretes li small { grid-column: 1; color: var(--marrom-70); font-size: 0.84rem; }
.pdp-fretes li span { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-weight: 800; font-variant-numeric: tabular-nums; }
.pdp-fretes li span.gratis { color: #2F8A57; }
.pdp-fretes p { font-size: 0.82rem; color: var(--marrom-70); }
.pdp-fretes p.erro { color: #C4452F; }
.pdp-fretes .pdp-fretes-mais { justify-self: start; padding: 0; border: 0; background: none; font: inherit; font-size: 0.86rem; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pdp-fretes-carregando { display: flex; align-items: center; gap: 0.625rem; padding: 0.875rem 1rem; border-radius: 1rem; background: linear-gradient(90deg, #F3ECE7 20%, #FBF7F4 50%, #F3ECE7 80%); background-size: 200% 100%; animation: pdpBrilho 1.1s linear infinite; font-size: 0.86rem; color: var(--marrom-70); }
@keyframes pdpBrilho { from { background-position: 100% 0; } to { background-position: -100% 0; } }

/* notas da fragrância */
.pdp-piramide { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.375rem; counter-reset: nota; }
.pdp-piramide li { position: relative; display: grid; gap: 0.5rem; align-content: start; padding: 1.75rem 1.5rem; border-radius: var(--raio-card); background: var(--tinta-1); counter-increment: nota; }
.pdp-piramide li::before { content: counter(nota, decimal-leading-zero); font-family: var(--titulos); font-size: 1.1rem; color: var(--laranja); }
.pdp-piramide small { font-size: 0.75rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--marrom-50); }
.pdp-piramide h3 { font-size: 1.75rem; line-height: 1.1; }
.pdp-piramide p { font-size: 0.93rem; color: var(--marrom-70); }

/* ritual */
.pdp-ritual-caixa { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.6fr); gap: 1.375rem; align-items: stretch; }
.pdp-ritual-itens { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.pdp-ritual-item { position: relative; display: grid; grid-template-rows: auto 1fr; gap: 0.75rem; height: 100%; padding: 0.875rem; border: 1.5px solid var(--laranja); border-radius: var(--raio-card); background: #FFFFFF; cursor: pointer; transition: border-color .2s ease, opacity .2s ease; }
.pdp-ritual-item input { position: absolute; opacity: 0; pointer-events: none; }
.pdp-check { position: absolute; top: 1.375rem; right: 1.375rem; z-index: 1; width: 1.625rem; height: 1.625rem; border-radius: 0.375rem; border: 1.5px solid var(--linha); background: #FFFFFF; display: grid; place-items: center; }
.pdp-ritual-item input:checked ~ .pdp-check { background: var(--laranja); border-color: var(--laranja); }
.pdp-ritual-item input:checked ~ .pdp-check::after { content: ""; width: 0.375rem; height: 0.75rem; border: solid #FFFFFF; border-width: 0 2px 2px 0; transform: translateY(-1px) rotate(45deg); }
.pdp-ritual-item input:disabled ~ .pdp-check { opacity: 0.55; }
.pdp-ritual-item input:focus-visible ~ .pdp-check { outline: 2px solid var(--laranja); outline-offset: 2px; }
.pdp-ritual-item:has(input:not(:checked)) { border-color: var(--linha); opacity: 0.7; }
.pdp-ritual-item img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 0.75rem; background: var(--tinta-1); }
.pdp-ritual-info { display: grid; gap: 0.125rem; align-content: start; }
.pdp-ritual-info small { font-size: 0.72rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--laranja); }
.pdp-ritual-info b { font-size: 0.95rem; line-height: 1.3; }
.pdp-ritual-info em { font-style: normal; color: var(--marrom-70); font-variant-numeric: tabular-nums; }
.pdp-ritual-total { display: grid; gap: 0.75rem; align-content: center; padding: 1.5rem; border-radius: var(--raio-card); background: var(--tinta-2); }
.pdp-ritual-off { justify-self: start; padding: 0.3125rem 0.625rem; border-radius: 0.375rem; background: var(--pink); color: #FFFFFF; font-size: 0.82rem; font-weight: 800; }
.pdp-ritual-total .preco b { font-size: 2rem; }
.pdp-ritual-dica { font-size: 0.86rem; color: var(--marrom-70); }
.pdp-ritual-dica:empty { display: none; }
.pdp-ritual-total .btn { width: 100%; }

/* como usar: foto de uso grande + passos com número grande */
.pdp-uso-grade { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); gap: clamp(2rem, 5vw, 5.5rem); align-items: center; }
.pdp-uso-grade.sem-foto { grid-template-columns: 1fr; max-width: calc(56rem + 2 * var(--lado)); }
.pdp-uso-foto { margin: 0; border-radius: var(--raio-painel); overflow: hidden; aspect-ratio: 4 / 5; background: var(--tinta-1); }
.pdp-uso-foto img { width: 100%; height: 100%; object-fit: cover; }
.pdp-uso-texto h2 { font-size: clamp(2.4rem, 1.6rem + 2.4vw, 3.6rem); line-height: 1; margin-bottom: 2rem; }
.pdp-uso-texto h2 span { color: var(--laranja); }
.pdp-passos { list-style: none; margin: 0; padding: 0; display: grid; counter-reset: passo; }
.pdp-passos li { display: grid; grid-template-columns: 4.5rem 1fr; column-gap: 1.25rem; row-gap: 0.375rem; padding: 1.5rem 0; border-top: 1px solid var(--linha); counter-increment: passo; }
.pdp-passos li:last-child { border-bottom: 1px solid var(--linha); }
.pdp-passos li::before { content: counter(passo, decimal-leading-zero); grid-row: 1 / span 2; font-family: var(--titulos); font-size: 3.25rem; line-height: 0.9; color: var(--laranja); }
.pdp-passos h3 { font-size: clamp(1.6rem, 1.3rem + 0.8vw, 2.1rem); line-height: 1.1; }
.pdp-passos p { font-size: 1.05rem; color: var(--marrom-70); max-width: 44ch; }

/* avaliações */
.pdp-av-topo { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; align-items: center; gap: 1.5rem 3rem; padding: 1.75rem 2rem; border-radius: var(--raio-painel); background: var(--tinta-1); }
.pdp-av-media { display: flex; align-items: center; gap: 1rem; }
.pdp-av-media > b { font-family: var(--titulos); font-weight: 400; font-size: 4rem; line-height: 0.9; }
.pdp-av-media div { display: grid; gap: 0.25rem; font-size: 0.9rem; color: var(--marrom-70); }
.pdp-estrelas { display: inline-flex; gap: 2px; }
.pdp-estrelas svg { width: 1.125rem; height: 1.125rem; fill: var(--estrela-vazia); }
.pdp-estrelas svg.on { fill: var(--estrela); }
.pdp-av-recomenda { max-width: 11rem; font-size: 0.9rem; color: var(--marrom-70); line-height: 1.35; }
.pdp-av-recomenda b { display: block; font-family: var(--titulos); font-weight: 400; font-size: 2rem; color: var(--marrom); line-height: 1.1; }
.pdp-av-barras { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.375rem; min-width: 12rem; }
.pdp-av-barras li { display: grid; grid-template-columns: 2rem 1fr 1.5rem; align-items: center; gap: 0.625rem; font-size: 0.84rem; }
.pdp-av-barras span { display: inline-flex; align-items: center; gap: 0.1875rem; font-weight: 700; }
.pdp-av-barras span svg { width: 0.8125rem; height: 0.8125rem; fill: var(--estrela); }
.pdp-av-barras i { height: 0.4375rem; border-radius: 1rem; background: #EFE3DB; overflow: hidden; }
.pdp-av-barras em { display: block; height: 100%; border-radius: 1rem; background: var(--estrela); }
.pdp-av-barras small { text-align: right; color: var(--marrom-70); font-variant-numeric: tabular-nums; }
.pdp-av-acao .btn { white-space: nowrap; }
.pdp-av-vazio, .pdp-av-fechado { font-size: 0.95rem; color: var(--marrom-70); grid-column: 1 / 4; }
.pdp-av-galeria { display: flex; gap: 0.625rem; overflow-x: auto; margin-top: 1.5rem; scrollbar-width: none; }
.pdp-av-galeria img { width: 6rem; height: 6rem; object-fit: cover; border-radius: 0.75rem; }
.pdp-av-ferramentas { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 1.75rem 0 1.25rem; }
.pdp-av-ferramentas .chips { flex: 1; min-width: 0; }
.chip-estrela { width: 0.8125rem; height: 0.8125rem; fill: var(--estrela); margin-left: -0.25rem; }
.chip-leve[aria-pressed="true"] { background: var(--marrom); border-color: var(--marrom); color: #FFFFFF; }
.chip-leve[aria-pressed="true"] .chip-estrela { fill: #FFFFFF; }
.pdp-av-lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.125rem; align-items: start; }
.pdp-av { display: grid; gap: 0.75rem; padding: 1.375rem; border: 1px solid var(--linha); border-radius: var(--raio-card); background: #FFFFFF; }
.pdp-av[hidden] { display: none; }
.pdp-av header { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
.pdp-av time { font-size: 0.8rem; color: var(--marrom-50); }
.pdp-av h3 { font-family: var(--corpo); font-weight: 700; font-size: 1rem; }
.pdp-av-texto { color: var(--marrom); line-height: 1.65; font-size: 0.96rem; }
.pdp-av-texto p { margin: 0; }
.pdp-av-texto p + p { margin-top: 0.5rem; }
.pdp-av-fotos { display: flex; gap: 0.5rem; overflow-x: auto; }
.pdp-av-fotos img { width: 4.5rem; height: 4.5rem; object-fit: cover; border-radius: 0.625rem; }
.pdp-av footer { display: flex; align-items: center; gap: 0.625rem; padding-top: 0.75rem; border-top: 1px solid var(--linha); }
.pdp-av-avatar { width: 2.25rem; height: 2.25rem; flex: none; border-radius: 50%; background: var(--tinta-2); color: var(--laranja); display: grid; place-items: center; font-family: var(--titulos); font-size: 1.1rem; }
.pdp-av-autor { display: grid; line-height: 1.3; }
.pdp-av-autor b { font-size: 0.9rem; }
.pdp-av-autor small { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.76rem; font-weight: 700; color: #2F8A57; }
.pdp-av-autor small svg { width: 0.875rem; height: 0.875rem; }
.pdp-av-nenhuma { padding: 1.5rem 0; color: var(--marrom-70); }
.pdp-av-mais-wrap { display: flex; justify-content: center; margin-top: 1.5rem; }
.pdp-av-mais { border: 1.5px solid var(--marrom); background: #FFFFFF; color: var(--marrom); }
.pdp-av-mais[hidden] { display: none; }

/* blog: "mais sobre", cartões horizontais em carrossel (referência Sallve) */
.pdp-blog { margin-top: 4.5rem; padding: 4.5rem 0 3.5rem; background: var(--tinta-1); }
.pdp-blog .titulo { margin-bottom: 2rem; }
.pdp-blog-palco { position: relative; }
.pdp-blog-trilho { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 1.375rem) / 2); gap: 1.375rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; }
.pdp-blog-trilho::-webkit-scrollbar { display: none; }
.pdp-post { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); min-height: 17rem; border-radius: var(--raio-painel); overflow: hidden; background: #FFFFFF; scroll-snap-align: start; }
.pdp-post-foto { display: block; background: var(--tinta-2); }
.pdp-post-foto img { width: 100%; height: 100%; object-fit: cover; }
.pdp-post-foto .post-foto-vazia { display: grid; place-items: center; width: 100%; height: 100%; color: var(--laranja); }
.pdp-post-corpo { display: grid; align-content: center; gap: 0.875rem; padding: 1.75rem; }
.pdp-post h3 { font-family: var(--corpo); font-weight: 700; font-size: 1.2rem; line-height: 1.3; }
.pdp-post h3 a { color: inherit; text-decoration: none; }
.pdp-post h3 a:hover { color: var(--laranja); }
.pdp-post p { font-size: 0.92rem; color: var(--marrom-70); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.pdp-post-ler { display: inline-flex; align-items: center; gap: 0.5rem; justify-self: start; font-weight: 700; font-size: 0.92rem; color: var(--marrom); text-decoration: none; }
.pdp-post-ler svg { width: 1.125rem; height: 1.125rem; transition: transform .2s ease; }
.pdp-post-ler:hover svg { transform: translateX(3px); }
.pdp-blog-seta { position: absolute; top: 50%; z-index: 2; transform: translateY(-50%); }
.pdp-blog-seta[data-blog-ir="-1"] { left: -1.5rem; }
.pdp-blog-seta[data-blog-ir="1"] { right: -1.5rem; }
.pdp-blog-seta:disabled { opacity: 0.4; cursor: default; }
.pdp-blog-pontos { display: flex; justify-content: center; gap: 0.5rem; margin-top: 1.5rem; }
.pdp-blog-pontos button { width: 0.625rem; height: 0.625rem; padding: 0; border: 0; border-radius: 1rem; background: #E6D6CC; cursor: pointer; transition: width .25s ease, background-color .25s ease; }
.pdp-blog-pontos button.on { width: 2.25rem; background: var(--laranja); }

/* diálogos: foto ampliada e formulário de avaliação */
.pdp-zoom, .pdp-av-dialogo { padding: 0; border: 0; color: var(--marrom); }
.pdp-zoom::backdrop, .pdp-av-dialogo::backdrop { background: rgba(28, 20, 16, 0.72); animation: pdpFundo .3s ease both; }
.pdp-zoom[open] { animation: pdpAbrir .35s cubic-bezier(.22, .61, .36, 1) both; }
.pdp-av-dialogo[open] { animation: pdpSubir .35s cubic-bezier(.22, .61, .36, 1) both; }
.pdp-zoom.fechando, .pdp-av-dialogo.fechando { animation: pdpSair .22s ease both; }
.pdp-zoom.fechando::backdrop, .pdp-av-dialogo.fechando::backdrop { animation: pdpFundo .22s ease reverse both; }
.pdp-zoom img { transition: opacity .2s ease; }
.pdp-zoom img.trocando { opacity: 0; }
@keyframes pdpFundo { from { opacity: 0; } to { opacity: 1; } }
@keyframes pdpAbrir { from { opacity: 0; transform: scale(0.94); } to { opacity: 1; transform: none; } }
@keyframes pdpSubir { from { opacity: 0; transform: translateY(1.5rem); } to { opacity: 1; transform: none; } }
@keyframes pdpSair { to { opacity: 0; transform: scale(0.97); } }
.pdp-zoom { width: min(92vw, 60rem); max-height: 92vh; border-radius: var(--raio-painel); background: #FFFFFF; overflow: hidden; }
.pdp-zoom img { width: 100%; max-height: 92vh; object-fit: contain; background: var(--tinta-1); }
.pdp-zoom-fechar { position: absolute; top: 0.75rem; right: 0.75rem; z-index: 2; width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%; background: #FFFFFF; display: grid; place-items: center; cursor: pointer; box-shadow: 0 6px 16px -10px rgba(0, 0, 0, 0.5); }
.pdp-zoom-fechar svg { width: 1.25rem; height: 1.25rem; }
.pdp-zoom-seta { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; }
.pdp-zoom-seta[data-zoom-ir="-1"] { left: 0.75rem; }
.pdp-zoom-seta[data-zoom-ir="1"] { right: 0.75rem; }
.pdp-av-dialogo { width: min(94vw, 34rem); max-height: 92vh; border-radius: var(--raio-painel); background: #FFFFFF; }
.pdp-av-form { position: relative; display: grid; gap: 1rem; padding: 1.5rem; }
.pdp-av-form-cab h2 { font-size: 1.9rem; padding-right: 3rem; }
.pdp-av-form-cab .pdp-zoom-fechar { top: 1.25rem; right: 1.25rem; background: var(--tinta-1); box-shadow: none; }
.pdp-av-form-produto { margin-top: -0.625rem; color: var(--marrom-70); font-size: 0.92rem; }
.pdp-av-notas { margin: 0; padding: 0; border: 0; min-width: 0; }
.pdp-av-notas legend { margin-bottom: 0.375rem; padding: 0; font-weight: 700; font-size: 0.92rem; }
.pdp-av-notas-estrelas { display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 0.25rem; }
.pdp-av-notas input { position: absolute; opacity: 0; }
.pdp-av-notas label { cursor: pointer; padding: 0.125rem; }
.pdp-av-notas svg { width: 2.25rem; height: 2.25rem; fill: var(--estrela-vazia); transition: fill .15s ease, transform .15s ease; }
.pdp-av-notas label:hover svg, .pdp-av-notas label:hover ~ label svg, .pdp-av-notas input:checked ~ label svg { fill: var(--estrela); }
.pdp-av-notas input:focus-visible + label svg { transform: scale(1.12); }
.pdp-campo { display: grid; gap: 0.375rem; font-size: 0.9rem; font-weight: 700; }
.pdp-campo input, .pdp-campo textarea { width: 100%; padding: 0.75rem 0.875rem; border: 1.5px solid var(--linha); border-radius: var(--raio-btn); font: inherit; font-weight: 400; font-size: 1rem; color: var(--marrom); background: #FFFFFF; resize: vertical; }
.pdp-campo input:focus, .pdp-campo textarea:focus { border-color: #B9A89C; }
.pdp-campo.invalido input, .pdp-campo.invalido textarea { border-color: #C4452F; }
.pdp-campos-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.pdp-arquivo { position: relative; display: flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 3rem; padding: 0.625rem 1rem; border: 1.5px dashed #D9C8BD; border-radius: var(--raio-btn); color: var(--marrom-70); font-size: 0.9rem; font-weight: 600; cursor: pointer; }
.pdp-arquivo:hover { border-color: var(--laranja); color: var(--marrom); }
.pdp-arquivo input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.pdp-arquivo svg { width: 1.125rem; height: 1.125rem; color: var(--laranja); }
.pdp-av-retorno { font-size: 0.9rem; }
.pdp-av-retorno:empty { display: none; }
.pdp-av-retorno.erro { color: #C4452F; }
.pdp-av-retorno.ok { color: #2F8A57; font-weight: 700; }
.pdp-av-form .btn { width: 100%; transition: background-color .25s ease; }
.pdp-av-form .btn.enviando { pointer-events: none; opacity: 0.85; }
.pdp-av-form .btn.enviando::before { content: ""; width: 1.125rem; height: 1.125rem; border-radius: 50%; border: 2px solid rgba(255, 255, 255, 0.45); border-top-color: #FFFFFF; animation: pdpGirar .7s linear infinite; }
.pdp-av-form .btn.enviado { background: #2F8A57; box-shadow: none; pointer-events: none; }
.pdp-av-form .btn.enviado svg { width: 1.25rem; height: 1.25rem; }
@keyframes pdpGirar { to { transform: rotate(360deg); } }
.pdp-av.nova { animation: pdpSubir .5s ease both; border-color: #BFE3CC; }

/* barra de compra fixa (referência Sallve): faixa de frete grátis + preço + COMPRAR */
.pdp-fixo { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; transform: translateY(110%); transition: transform .3s ease; box-shadow: 0 -10px 30px -22px rgba(56, 42, 35, 0.6); }
.pdp-fixo.on { transform: none; }
.pdp-fixo-faixa { margin: 0; padding: 0.375rem 1rem; background: var(--tinta-2); text-align: center; font-size: 0.86rem; }
.pdp-fixo-faixa b { font-weight: 800; }
.pdp-fixo-barra { display: flex; align-items: center; gap: 1.25rem; padding: 0.625rem max(var(--lado), calc((100vw - var(--conteudo)) / 2)) calc(0.625rem + env(safe-area-inset-bottom)); background: #FFFFFF; }
.pdp-fixo-produto { display: flex; align-items: center; gap: 0.75rem; flex: 1; min-width: 0; }
.pdp-fixo-img { width: 3rem; height: 3rem; border-radius: 0.5rem; object-fit: cover; background: var(--tinta-1); }
.pdp-fixo-nome { font-size: 0.95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pdp-fixo-preco { display: grid; line-height: 1.15; }
.pdp-fixo-preco .pdp-de { font-size: 0.8rem; gap: 0.375rem; }
.pdp-fixo-preco .pdp-tag { font-size: 0.72rem; }
.pdp-fixo-preco .pdp-por { font-size: 1.35rem; }
.pdp-fixo .btn { min-height: 3rem; padding: 0 2.25rem; border-radius: 62.4375rem; }
body.pdp-fixo-on .flutuantes, body.pdp-fixo-on .joinchat, body.pdp-fixo-on .ht-ctc, body.pdp-fixo-on .wa__btn_popup, body.pdp-fixo-on #wa-floating-button { transform: translateY(-5.25rem); }
.flutuantes, .joinchat, .ht-ctc, .wa__btn_popup, #wa-floating-button { transition: transform .3s ease; }
body.pdp-fixo-on .rodape { padding-bottom: 6rem; }

@media (max-width: 1180px) {
  .pdp-ritual-caixa { grid-template-columns: 1fr; }
  .pdp-av-topo { grid-template-columns: auto minmax(0, 1fr); }
  .pdp-av-recomenda { display: none; }
  .pdp-av-acao { grid-column: 1 / -1; }
  .pdp-av-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pdp-blog-seta[data-blog-ir="-1"] { left: -0.75rem; }
  .pdp-blog-seta[data-blog-ir="1"] { right: -0.75rem; }
}
@media (max-width: 900px) {
  .pdp-topo { grid-template-columns: 1fr; gap: 1.5rem; }
  .pdp-galeria { position: static; }
  .pdp-uso-grade { grid-template-columns: 1fr; }
  .pdp-uso-foto { aspect-ratio: 4 / 3; }
  .pdp-blog-trilho { grid-auto-columns: 86%; }
}
@media (max-width: 760px) {
  .pdp .migalhas { padding-top: 0.875rem; font-size: 0.78rem; flex-wrap: nowrap; overflow: hidden; white-space: nowrap; }
  .pdp .migalhas [aria-current] { overflow: hidden; text-overflow: ellipsis; }
  .pdp-topo { margin-top: 0.75rem; }
  .pdp-galeria { margin: 0 calc(-1 * var(--lado)); gap: 0.5rem; }
  .pdp-palco { border-radius: 0; }
  .pdp-seta { display: none; }
  .pdp-miniaturas { padding: 0 var(--lado); }
  .pdp-mini { width: 3.75rem; height: 3.75rem; border-radius: 0.5rem; }
  .pdp-compra { gap: 1rem; }
  .pdp-compra h1 { font-size: 1.85rem; }
  .pdp-caixa-corpo { padding: 1.125rem 1rem 1rem; }
  .pdp-escala { max-width: none; }
  .pdp-piramide { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; gap: 0.75rem; margin: 0 calc(-1 * var(--lado)); padding: 0 var(--lado) 0.25rem; scroll-padding: 0 var(--lado); scrollbar-width: none; }
  .pdp-piramide::-webkit-scrollbar { display: none; }
  .pdp-piramide li { scroll-snap-align: start; padding: 1.25rem; }
  .pdp-piramide h3 { font-size: 1.5rem; }
  .pdp-ritual-itens { grid-template-columns: 1fr; gap: 0.625rem; }
  .pdp-ritual-item { grid-template-columns: 4.5rem 1fr; grid-template-rows: none; align-items: center; padding: 0.75rem 3.25rem 0.75rem 0.75rem; }
  .pdp-check { top: 50%; right: 1rem; transform: translateY(-50%); }
  .pdp-ritual-total { padding: 1.25rem; }
  .pdp-uso-texto h2 { margin-bottom: 1.25rem; }
  .pdp-passos li { grid-template-columns: 3.25rem 1fr; padding: 1.125rem 0; }
  .pdp-passos li::before { font-size: 2.5rem; }
  .pdp-passos h3 { font-size: 1.5rem; }
  .pdp-passos p { font-size: 1rem; }
  .pdp-av-topo { grid-template-columns: 1fr; gap: 1.25rem; padding: 1.375rem; }
  .pdp-av-acao .btn { width: 100%; }
  .pdp-av-ferramentas { flex-direction: column; align-items: stretch; }
  .pdp-av-ferramentas .chips { margin: 0 calc(-1 * var(--lado)); padding: 2px var(--lado); }
  .pdp-av-ferramentas .loja-btn { align-self: flex-start; }
  .pdp-av-lista { grid-template-columns: 1fr; }
  .pdp-blog { margin-top: 3rem; padding: 3rem 0 2.5rem; }
  .pdp-blog-seta { top: auto; bottom: -3.375rem; transform: none; width: 2.5rem; height: 2.5rem; }
  .pdp-blog-seta[data-blog-ir="-1"] { left: 0; }
  .pdp-blog-seta[data-blog-ir="1"] { right: 0; }
  .pdp-blog-pontos { min-height: 2.5rem; align-items: center; margin-top: 0.875rem; }
  .pdp-blog-trilho { grid-auto-columns: 86%; gap: 0.75rem; margin: 0 calc(-1 * var(--lado)); padding: 0 var(--lado); scroll-padding: 0 var(--lado); }
  .pdp-post { grid-template-columns: 1fr; min-height: 0; }
  .pdp-post-foto { aspect-ratio: 16 / 10; }
  .pdp-post-corpo { padding: 1.125rem 1.125rem 1.25rem; gap: 0.625rem; }
  .pdp-post h3 { font-size: 1.05rem; }
  .pdp-campos-2 { grid-template-columns: 1fr; }
  .pdp-av-dialogo { width: 100vw; max-width: 100vw; max-height: 94vh; margin: auto 0 0; border-radius: var(--raio-painel) var(--raio-painel) 0 0; }
  .pdp-zoom { width: 100vw; max-width: 100vw; border-radius: 0; }
  .pdp-fixo { display: block; }
  .pdp-fixo-produto { display: none; }
  .pdp-fixo-barra { justify-content: space-between; gap: 0.75rem; }
  .pdp-fixo .btn { padding: 0 2rem; }
  body.allpa-produto { padding-bottom: 6.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pdp-fotos, .pdp-blog-trilho { scroll-behavior: auto; }
  .pdp-fixo { transition: none; }
}

/* ================= vídeos estilo Instagram (home e produto) ================= */
.reels-secao .titulo { margin-bottom: 1.25rem; }
.reels { position: relative; }
.reels-trilho { display: flex; align-items: center; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; padding: 1rem calc(50% - 8.5rem) 1.25rem; }
.reels-trilho::-webkit-scrollbar { display: none; }
.reel { flex: none; width: 17rem; display: grid; gap: 0.75rem; scroll-snap-align: center; transform: scale(0.86); transition: transform .45s cubic-bezier(.22, .61, .36, 1), opacity .45s ease; opacity: 0.9; }
.reel.ativo { transform: none; opacity: 1; }
.reel-midia { position: relative; aspect-ratio: 9 / 15.5; border-radius: var(--raio-painel); overflow: hidden; background: var(--tinta-2); box-shadow: 0 18px 40px -28px rgba(56, 42, 35, 0.55); }
.reel-midia img, .reel-midia video { width: 100%; height: 100%; object-fit: cover; display: block; -webkit-user-drag: none; }
.reel-midia img { transition: transform 6s ease-out; }
.reel.ativo .reel-midia img { transform: scale(1.08); }
.reel-som { position: absolute; right: 0.75rem; top: 0.75rem; width: 2.5rem; height: 2.5rem; border: 0; border-radius: 50%; background: rgba(28, 20, 16, 0.55); color: #FFFFFF; display: grid; place-items: center; cursor: pointer; }
.reel-som svg { width: 1.25rem; height: 1.25rem; }
.reel-som .onda { display: none; }
.reel-som[aria-pressed="true"] .onda { display: inline; }
.reel-som[aria-pressed="true"] .mudo { display: none; }
.reel-produto { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: 0.75rem; align-items: center; margin: 0 0.5rem; padding: 0.5rem; border: 1px solid var(--linha); border-radius: 0.875rem; background: #FFFFFF; text-decoration: none; color: var(--marrom); transition: border-color .2s ease; }
.reel-produto:hover { border-color: var(--laranja); }
.reel-produto img { width: 3rem; height: 3rem; border-radius: 0.5rem; object-fit: cover; background: var(--tinta-1); }
.reel-produto > span { display: grid; min-width: 0; line-height: 1.3; }
.reel-produto b { font-weight: 600; font-size: 0.86rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.reel-preco { font-size: 0.84rem; font-variant-numeric: tabular-nums; }
.reel-preco s { color: #A1948C; font-size: 0.78rem; }
.reel-preco strong { font-weight: 800; }
.reels-seta { position: absolute; top: 45%; z-index: 3; transform: translateY(-50%); box-shadow: 0 8px 20px -12px rgba(56, 42, 35, 0.5); }
.reels-seta[data-reels-ir="-1"] { left: max(1rem, calc((100vw - var(--conteudo)) / 2)); }
.reels-seta[data-reels-ir="1"] { right: max(1rem, calc((100vw - var(--conteudo)) / 2)); }
.reels-seta:disabled { opacity: 0.4; cursor: default; }

/* ================= os mais bem avaliados (home) ================= */
.trilho-avaliados { grid-auto-columns: calc((100% - 1.375rem) / 2); }
.card-av { display: grid; grid-template-columns: minmax(0, 0.42fr) minmax(0, 0.58fr); border-radius: var(--raio-painel); overflow: hidden; background: var(--tinta-1); min-height: 19rem; }
.card-av-foto { display: block; background: #FFFFFF; }
.card-av-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; -webkit-user-drag: none; }
.card-av:hover .card-av-foto img { transform: scale(1.04); }
.card-av-corpo { display: grid; grid-template-rows: auto 1fr auto; gap: 1rem; padding: 1.5rem 1.5rem 1.375rem; }
.card-av-cab { display: grid; gap: 0.375rem; }
.card-av-cab h3 { font-family: var(--corpo); font-weight: 700; font-size: 1.05rem; line-height: 1.3; }
.card-av-cab h3 a { color: inherit; text-decoration: none; }
.card-av-cab h3 a:hover { color: var(--laranja); }
.card-av-citacao { position: relative; margin: 0; padding: 0 0 0 1.75rem; }
.card-av-citacao::before { content: "“"; position: absolute; left: -0.125rem; top: -0.875rem; font-family: var(--titulos); font-size: 3.25rem; line-height: 1; color: var(--laranja); }
.card-av-citacao p { font-family: var(--titulos); font-size: 1.2rem; line-height: 1.35; color: var(--marrom); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.card-av-citacao footer { margin-top: 0.5rem; font-size: 0.84rem; font-weight: 700; color: var(--marrom-70); }
.card-av-citacao footer::before { content: "— "; }
.card-av-rodape { display: flex; align-items: flex-end; justify-content: space-between; gap: 0.75rem; }
.card-av-rodape .preco b { font-size: 1.35rem; }
.card-av-rodape .btn { min-height: 2.75rem; padding: 0 1.25rem; font-size: 0.84rem; }

@media (max-width: 1180px) {
  .trilho-avaliados { grid-auto-columns: 78%; }
}
@media (max-width: 760px) {
  .reels-trilho { gap: 0.5rem; padding: 0.5rem calc(50% - 7.25rem) 1rem; }
  .reel { width: 14.5rem; transform: scale(0.88); }
  .reels-seta { display: none; }
  .trilho-avaliados { grid-auto-columns: 88%; }
  .card-av { grid-template-columns: 7.5rem minmax(0, 1fr); min-height: 0; }
  .card-av-corpo { padding: 1rem; gap: 0.75rem; }
  .card-av-cab h3 { font-size: 0.95rem; }
  .card-av-citacao { padding-left: 1.25rem; }
  .card-av-citacao::before { font-size: 2.5rem; top: -0.625rem; }
  .card-av-citacao p { font-size: 1rem; -webkit-line-clamp: 5; }
  .card-av-rodape { flex-direction: column; align-items: stretch; }
  .card-av-rodape .btn { width: 100%; }
  .card-av .nota-estrelas .qt-rot { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .reel, .reel-midia img, .cats .circ::before { transition: none; }
  .pdp-zoom[open], .pdp-av-dialogo[open], .pdp-zoom::backdrop, .pdp-av-dialogo::backdrop { animation: none; }
}