/* Tema Pavio (premium, 4a onda): velas e aromas com cara de atelie - gesso, carvao e ambar, Cormorant Garamond nos
   titulos e Jost no texto, sem cantos, muito respiro. Topo da familia "dividido": logotipo fino no centro com o menu dividido
   dos dois lados. Abertura em tela dividida (foto em pe e texto), manifesto, colecao em 3, ambientes lado a lado, familias
   olfativas e rodape de gesso com a chama desenhada. Carregado depois do CSS do Vitrine e do premium.css. */

.tema-pavio { --pv-carvao: var(--titulos, #2b2420); --pv-ambar: var(--loja, #a8642c); --pv-gesso: #f3eee7; --pv-gesso2: #e9e1d6; --pv-fio: #ddd2c4; --pv-sub: #8a7d72; }
body.tema-pavio { background: var(--pv-gesso); }

/* ---------- topo dividido: menu | logotipo | menu */
.pv-topo .vt-aviso { font-size: 11.5px; letter-spacing: .18em; text-transform: uppercase; }
.pv-topo .vt-marca img { width: auto; height: var(--logo-altura, 54px); max-width: 260px; border: 0; border-radius: 0; background: none; object-fit: contain; }
.pv-topo .vt-acao { padding: 8px; }
.pv-topo .vt-acao:hover { background: transparent; color: var(--pv-ambar) !important; }
.pv-topo .vt-sacola .counter { background: var(--pv-ambar); }
body.vitrine .pv-topo .vt-busca input { height: 36px; border: 0; border-bottom: 1px solid var(--pv-fio); border-radius: 0; background: transparent; font-size: 13px; }
body.vitrine .pv-topo .vt-busca button { background: transparent !important; color: var(--pv-carvao) !important; }
.pv-nav { display: flex; gap: 30px; }
.pv-nav a { color: var(--pv-carvao) !important; font-size: 12.5px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; text-decoration: none !important; white-space: nowrap; }
.pv-nav a:hover { color: var(--pv-ambar) !important; }
.pv-nav a.vt-ofertas { color: var(--pv-ambar) !important; }
/* telas medias (992 a 1279): o menu dividido nao cabe; o logotipo fica no centro e o menu vai numa linha embaixo */
@media (max-width: 1279px) {
	.pv-nav { display: none !important; }
	.pv-topo .vt-menu .container { justify-content: safe center; }
	.pv-topo .vt-menu-dep { display: none; }
	.pv-topo .vt-menu a { border-radius: 0; color: var(--pv-carvao) !important; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; }
}
@media (min-width: 992px) and (max-width: 1279px) { .pv-topo .vt-marca { margin: 0 auto; } }
@media (min-width: 1280px) {
	.pv-topo .vt-barra .container { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 40px; min-height: 104px; }
	.pv-topo .vt-marca { grid-column: 2; grid-row: 1; justify-self: center; }
	.pv-nav-esq { grid-column: 1; grid-row: 1; justify-self: end; }
	.pv-nav-dir { grid-column: 3; grid-row: 1; justify-self: start; }
	/* busca e icones sobem para a faixa de cima, discretos */
	body.vitrine .pv-topo .vt-busca { position: absolute; top: 8px; left: max(15px, calc((100vw - 1280px) / 2 + 15px)); width: 200px; margin: 0; }
	.pv-topo .vt-acoes { position: absolute; top: 2px; right: max(15px, calc((100vw - 1280px) / 2 + 15px)); }
	.pv-topo .vt-barra { position: relative; padding-top: 34px; border-bottom: 1px solid var(--pv-fio); }
	.pv-topo .vt-menu { display: none; }
	.pv-topo .vt-aviso .vt-aviso-links { display: none; }
}

/* ---------- titulos de secao: serifa grande centralizada */
.tema-pavio .vt-secao-cab { flex-direction: column; align-items: center; gap: 6px; margin-bottom: 40px; text-align: center; }
.tema-pavio .vt-secao-cab h2 { font-size: 46px; font-weight: 400 !important; letter-spacing: -.01em; color: var(--pv-carvao); }
.tema-pavio .vt-secao-cab a { color: var(--pv-sub) !important; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; }

/* ---------- cartao de atelie: foto alta, nome em serifa, preco discreto, sem botao */
.tema-pavio .vt-card { border: 0; border-radius: 0; background: transparent; box-shadow: none !important; }
.tema-pavio .vt-card-img { aspect-ratio: 4 / 5; border-radius: 0; background: var(--pv-gesso2); }
.tema-pavio .vt-card-info { align-items: center; padding: 18px 4px 0; text-align: center; }
.tema-pavio .ppc-marca { display: none; }
.tema-pavio .vt-card-nome { font-family: var(--fonte-titulos), serif; font-size: 22px; font-weight: 500; line-height: 1.15; color: var(--pv-carvao); }
.tema-pavio .vt-card-preco { justify-content: center; }
.tema-pavio .vt-card-preco strong { font-size: 14px; font-weight: 500; letter-spacing: .08em; color: var(--pv-sub); }
.tema-pavio .ppc-parc { display: none; }
.tema-pavio .vt-card-botao { display: none; }
.tema-pavio .ppc .ppc-ver { border-radius: 0; background: var(--pv-gesso); color: var(--pv-carvao); font-size: 11.5px; letter-spacing: .2em; text-transform: uppercase; }
.tema-pavio .vt-selo { border-radius: 0; background: var(--pv-carvao); color: var(--pv-gesso); font-size: 11px; letter-spacing: .1em; }

/* ---------- abertura em tela dividida, manifesto e ambientes */
@media (min-width: 992px) { .tema-pavio .hdl-b-imagem-texto:first-child .hdl-it { gap: 90px; } }
body.vitrine.tema-pavio .hdl-it-img, body.vitrine.tema-pavio .hdl-it-img img, body.vitrine.tema-pavio .hdl-hero { border-radius: 0 !important; box-shadow: none !important; }
.tema-pavio .hdl-it-chamada { color: var(--pv-ambar); font-size: 12px; letter-spacing: .24em; text-transform: uppercase; }
body.vitrine.tema-pavio .hdl-it h2 { font-size: clamp(40px, 4.6vw, 66px); font-weight: 400; line-height: 1.02; letter-spacing: -.015em; }
.tema-pavio .hdl-it-txt p { font-size: 17px; line-height: 1.8; color: #5c5047; }
body.vitrine.tema-pavio .hdl-it a, body.vitrine.tema-pavio .hdl-hero a { border-radius: 0 !important; background: var(--pv-carvao) !important; color: var(--pv-gesso) !important; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; padding: 16px 30px; }
body.vitrine.tema-pavio .hdl-texto h2 { max-width: 760px; margin-left: auto; margin-right: auto; font-size: clamp(34px, 4vw, 54px); font-style: italic; font-weight: 400; color: var(--pv-carvao); }
.tema-pavio .hdl-texto p { max-width: 560px; margin-left: auto; margin-right: auto; color: var(--pv-sub); font-size: 16px; }
body.vitrine.tema-pavio .hdl-hero h2 { font-size: 40px; font-weight: 400; color: var(--pv-carvao) !important; text-shadow: none; }
body.vitrine.tema-pavio .hdl-hero p { color: #5c5047 !important; text-shadow: none; }

/* ---------- guia de aromas (bloco Destaques) */
.pv-aromas { display: grid; justify-items: center; gap: 40px; padding: 60px 0; border-top: 1px solid var(--pv-fio); border-bottom: 1px solid var(--pv-fio); text-align: center; }
.pv-aromas-cab small { color: var(--pv-ambar); font-size: 12px; letter-spacing: .24em; text-transform: uppercase; }
body.vitrine .pv-aromas-cab h2 { margin: 10px 0 0; font-family: var(--fonte-titulos), serif; font-size: 50px; font-weight: 400; color: var(--pv-carvao); }
.pv-familias { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); width: 100%; }
.pv-familia { display: grid; gap: 8px; padding: 10px 26px; color: inherit; text-decoration: none !important; }
.pv-familia + .pv-familia { border-left: 1px solid var(--pv-fio); }
.pv-familia b { font-family: var(--fonte-titulos), serif; font-size: 38px; font-style: italic; font-weight: 400; color: var(--pv-carvao); transition: color .2s; }
.pv-familia:hover b { color: var(--pv-ambar); }
.pv-familia span { font-size: 14.5px; color: #5c5047; }
.pv-familia small { color: var(--pv-sub); font-size: 11.5px; letter-spacing: .18em; text-transform: uppercase; }
.pv-aromas-link { color: var(--pv-carvao) !important; font-size: 12.5px; letter-spacing: .2em; text-transform: uppercase; text-decoration: none !important; border-bottom: 1px solid var(--pv-ambar); padding-bottom: 4px; }
@media (max-width: 767px) {
	.pv-familias { grid-auto-flow: row; grid-template-columns: 1fr 1fr; gap: 24px 0; }
	.pv-familia:nth-child(odd) { border-left: 0; }
	.pv-familia b { font-size: 30px; }
	body.vitrine .pv-aromas-cab h2 { font-size: 36px; }
}

/* ---------- depoimentos: cartas em gesso */
.tema-pavio .hdl-depo > * { border: 0; border-radius: 0; background: var(--pv-gesso2); box-shadow: none; padding: 32px; }
.tema-pavio .hdl-depo p { font-family: var(--fonte-titulos), serif; font-size: 21px; font-style: italic; line-height: 1.45; color: var(--pv-carvao); }
.tema-pavio .hdl-depo-nota { color: var(--pv-ambar); }

/* ---------- carrinho: o copo de vela que vai enchendo de cera */
.pv-frete { display: flex; align-items: center; gap: 18px; padding: 16px 20px; border: 1px solid var(--pv-fio); background: #fbf8f4; }
.pv-frete p { margin: 0; color: var(--pv-carvao); }
.pv-copo { position: relative; flex: none; width: 34px; height: 44px; margin-top: 14px; border: 2px solid var(--pv-carvao); border-top-width: 0; border-radius: 0 0 6px 6px; overflow: visible; }
.pv-copo i { position: absolute; left: 0; right: 0; bottom: 0; background: #e8d3b4; transition: height .6s; }
.pv-copo b { position: absolute; left: 50%; top: -16px; width: 10px; height: 14px; margin-left: -5px; border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%; background: var(--pv-ambar); opacity: 0; transition: opacity .4s; }
.pv-frete-ok .pv-copo b { opacity: 1; }

/* ---------- rodape de gesso com a chama */
.pv-rodape { border-top: 1px solid var(--pv-fio); }
.pv-chama { display: grid; justify-items: center; gap: 16px; padding-top: 64px; padding-bottom: 34px; text-align: center; }
.pv-chama-desenho { width: 22px; height: 40px; border: 1.5px solid var(--pv-ambar); border-radius: 50% 50% 50% 50% / 64% 64% 36% 36%; }
.pv-chama p { max-width: 680px; margin: 0; font-family: var(--fonte-titulos), serif; font-size: clamp(30px, 3.6vw, 46px); font-style: italic; line-height: 1.1; color: var(--pv-carvao); }
.pv-chama small { color: var(--pv-sub); font-size: 11.5px; letter-spacing: .2em; text-transform: uppercase; }
.pv-rodape .vt-rodape-grade h3 { font-family: var(--fonte-titulos), serif; font-size: 22px; font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--pv-carvao); }
