/* Carrinho lateral, pagina de produto e grade de colecao.
   Tudo em px: o CSS portado do Shopify deixa 1rem = ~11px e misturar escalas
   foi o que deixou o site com fonte minuscula no primeiro teste. */

:root {
	--bz-tinta: #1c1c1c;
	--bz-suave: #5b5b5b;
	--bz-borda: #dcdcdc;
	--bz-fundo: #f6f6f4;
	--bz-acao: #1f3a5f;
	--bz-acao-texto: #fff;
	--bz-verde: #0a7d32;
	--bz-fonte: Poppins, -apple-system, "Segoe UI", sans-serif;
}

/* ---------- Carrinho lateral ---------- */

.bz-carrinho { position: fixed; inset: 0; z-index: 9999; visibility: hidden; pointer-events: none; }
.bz-carrinho[aria-hidden="false"] { visibility: visible; pointer-events: auto; }

.bz-carrinho__fundo {
	position: absolute; inset: 0;
	background: rgba(0, 0, 0, 0.45);
	opacity: 0; transition: opacity 0.25s ease;
}
.bz-carrinho[aria-hidden="false"] .bz-carrinho__fundo { opacity: 1; }

.bz-carrinho__painel {
	position: absolute; top: 0; right: 0; height: 100%;
	width: min(420px, 100%);
	background: #fff;
	display: flex; flex-direction: column;
	transform: translateX(100%);
	transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
	font-family: var(--bz-fonte); font-size: 15px; color: var(--bz-tinta);
	box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
}
.bz-carrinho[aria-hidden="false"] .bz-carrinho__painel { transform: translateX(0); }

body.bz-travado { overflow: hidden; }

.bz-carrinho__topo {
	display: flex; align-items: center; justify-content: space-between;
	padding: 18px 20px; border-bottom: 1px solid var(--bz-borda); font-size: 17px;
}

.bz-carrinho__x {
	background: none; border: 0; font-size: 28px; line-height: 1;
	cursor: pointer; color: var(--bz-tinta); padding: 0 4px;
}

.bz-carrinho__corpo { flex: 1; overflow-y: auto; padding: 8px 20px; }
.bz-carrinho__vazio { text-align: center; color: var(--bz-suave); padding: 48px 0; }

.bz-item {
	display: grid; grid-template-columns: 72px 1fr; gap: 12px;
	padding: 16px 0; border-bottom: 1px solid var(--bz-borda);
}
.bz-item img { width: 72px; height: 72px; object-fit: cover; border-radius: 4px; background: var(--bz-fundo); }
.bz-item__nome { margin: 0 0 2px; font-size: 14px; font-weight: 600; line-height: 1.35; }
.bz-item__variacao { margin: 0 0 8px; font-size: 13px; color: var(--bz-suave); }
.bz-item__linha { display: flex; align-items: center; justify-content: space-between; gap: 10px; }

.bz-qtd { display: inline-flex; align-items: center; border: 1px solid var(--bz-borda); border-radius: 4px; overflow: hidden; }
.bz-qtd button { width: 30px; height: 30px; border: 0; background: none; cursor: pointer; font-size: 16px; line-height: 1; color: var(--bz-tinta); }
.bz-qtd span { min-width: 28px; text-align: center; font-size: 14px; }

.bz-item__preco { font-weight: 600; font-size: 14px; }
.bz-item__remover {
	margin-top: 6px; background: none; border: 0; padding: 0;
	font-size: 12px; color: var(--bz-suave); text-decoration: underline; cursor: pointer;
}

/* ---------- Order bump ---------- */

.bz-bump { border-top: 1px solid var(--bz-borda); background: var(--bz-fundo); padding: 14px 20px; }
.bz-bump__titulo {
	margin: 0 0 10px; font-size: 13px; font-weight: 700;
	text-transform: uppercase; letter-spacing: 0.04em; color: var(--bz-suave);
}
.bz-bump__caixa {
	display: flex; align-items: center; gap: 10px;
	background: #fff; border: 1px dashed var(--bz-verde);
	border-radius: 6px; padding: 10px 12px; cursor: pointer;
}
.bz-bump__caixa input { width: 18px; height: 18px; accent-color: var(--bz-verde); }
.bz-bump__caixa img { border-radius: 4px; object-fit: cover; }
.bz-bump__texto { display: flex; flex-direction: column; gap: 2px; }
.bz-bump__nome { font-size: 13px; font-weight: 600; line-height: 1.3; }
.bz-bump__preco { font-size: 14px; font-weight: 700; color: var(--bz-verde); }

/* ---------- Rodape do carrinho ---------- */

.bz-carrinho__pe { border-top: 1px solid var(--bz-borda); padding: 16px 20px 20px; }
.bz-carrinho__total { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; font-size: 16px; }
.bz-carrinho__total strong { font-size: 20px; }
.bz-carrinho__botao {
	display: block; text-align: center;
	background: var(--bz-acao); color: var(--bz-acao-texto);
	text-decoration: none; font-weight: 700; font-size: 16px;
	padding: 16px; border-radius: 6px;
}
.bz-carrinho__botao:hover { opacity: 0.9; color: var(--bz-acao-texto); }
.bz-carrinho__nota { margin: 10px 0 0; text-align: center; font-size: 12px; color: var(--bz-suave); }

/* ---------- Pagina de produto ---------- */

.bz-pagina { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

.bz-produto {
	display: grid; grid-template-columns: 1fr; gap: 32px;
	padding: 32px 0 56px; font-family: var(--bz-fonte); align-items: start;
}
@media (min-width: 990px) {
	.bz-produto { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 56px; }
}

.bz-galeria__principal { border-radius: 6px; overflow: hidden; background: var(--bz-fundo); }
.bz-galeria__principal img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }

.bz-galeria__miniaturas {
	display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px;
	margin: 8px 0 0; padding: 0; list-style: none;
	/* Todas as fotos a mostra, sem rolagem (pedido do cliente, 2026-09-21). */
}
.bz-galeria__miniaturas button {
	width: 100%; padding: 0; border: 2px solid transparent; border-radius: 4px;
	overflow: hidden; background: none; cursor: pointer; line-height: 0;
}
.bz-galeria__miniaturas button[aria-current="true"] { border-color: var(--bz-tinta); }
.bz-galeria__miniaturas img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }

.bz-info { display: flex; flex-direction: column; gap: 18px; }
.bz-info h1 { margin: 0; font-size: 30px; line-height: 1.18; font-weight: 700; letter-spacing: -0.01em; }
@media (min-width: 750px) { .bz-info h1 { font-size: 38px; } }

.bz-preco { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.bz-preco__de { font-size: 19px; color: var(--bz-suave); text-decoration: line-through; }
.bz-preco__por { font-size: 28px; font-weight: 700; }
.bz-economia {
	font-size: 14px; font-weight: 600; color: var(--bz-verde);
	background: rgba(10, 125, 50, 0.1); border-radius: 999px; padding: 5px 12px;
}

.bz-resumo {
	font-size: 16px; line-height: 1.6; font-style: italic; color: var(--bz-suave);
	border-left: 3px solid var(--bz-borda); background: var(--bz-fundo);
	padding: 14px 16px; border-radius: 0 4px 4px 0;
}
.bz-resumo p { margin: 0; }

.bz-opcao { display: flex; flex-direction: column; gap: 8px; }
.bz-opcao__rotulo { font-size: 14px; font-weight: 600; }
.bz-opcao__rotulo span { font-weight: 400; color: var(--bz-suave); }

.bz-cores { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.bz-cores button {
	width: 40px; height: 40px; border-radius: 50%;
	border: 2px solid var(--bz-borda); padding: 2px;
	cursor: pointer; background: #fff; overflow: hidden;
}
.bz-cores button[aria-pressed="true"] { border-color: var(--bz-tinta); }
.bz-cores img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }

/* ---------- Pacotes com desconto (estilo do app da loja de origem) ---------- */

.bz-pacotes { display: grid; gap: 12px; margin: 0 0 22px; }

.bz-pacote {
	position: relative; padding: 14px 16px; border: 1px solid var(--bz-borda);
	border-radius: 10px; background: var(--bz-fundo); cursor: pointer;
}
.bz-pacote--escolhido { border: 2px solid var(--bz-tinta); background: #fff; padding: 13px 15px; }

.bz-pacote__selo {
	position: absolute; top: -1px; right: -1px; padding: 4px 10px;
	border-radius: 0 10px 0 10px; background: var(--bz-tinta); color: #fff;
	font-size: 11px; font-weight: 700; letter-spacing: .04em;
}
.bz-pacote--escolhido .bz-pacote__selo { top: -2px; right: -2px; }

.bz-pacote__cabeca { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: start; }

.bz-pacote__radio {
	width: 20px; height: 20px; margin-top: 2px; border: 1px solid #9a9a9a;
	border-radius: 50%; background: #fff; flex: none;
}
.bz-pacote--escolhido .bz-pacote__radio {
	border-color: var(--bz-tinta);
	box-shadow: inset 0 0 0 4px #fff, inset 0 0 0 20px var(--bz-tinta);
}

.bz-pacote__unit { margin: 0; font-size: 17px; font-weight: 700; line-height: 1.2; }
.bz-pacote__frase { margin: 4px 0 0; font-size: 13px; line-height: 1.4; color: var(--bz-suave); }

.bz-pacote__valores { text-align: right; line-height: 1.2; }
/* O selo fica no canto: o preco desce para nao ficar embaixo dele. */
.bz-pacote--com-selo .bz-pacote__valores { padding-top: 20px; }
.bz-pacote__total { display: block; font-size: 17px; font-weight: 700; }
.bz-pacote__de { display: block; font-size: 13px; color: var(--bz-suave); text-decoration: line-through; }

/* Unidades do pacote, dentro do cartao escolhido. */
.bz-pacote__itens { margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--bz-borda); }
.bz-pacote__itens-titulo { margin: 0 0 8px; font-size: 12px; font-weight: 600; color: var(--bz-suave); }

.bz-pacote__item { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.bz-pacote__item:last-child { margin-bottom: 0; }
.bz-pacote__num { width: 22px; font-size: 13px; font-weight: 700; color: var(--bz-suave); }
.bz-pacote__foto { width: 28px; height: 28px; border-radius: 4px; object-fit: cover; flex: none; }
.bz-pacote__campo {
	flex: 1; min-width: 0; font-family: inherit; font-size: 14px; padding: 8px 10px;
	border: 1px solid var(--bz-borda); border-radius: 6px; background: #fff; color: var(--bz-tinta);
}
.bz-pacote__campo:last-child { flex: 0 0 34%; }

.bz-selecao {
	font-family: inherit; font-size: 16px; padding: 14px 16px;
	border: 1px solid var(--bz-borda); border-radius: 8px; background: #fff;
	color: var(--bz-tinta); width: 100%; cursor: pointer;
}
.bz-selecao:focus { outline: 2px solid var(--bz-tinta); outline-offset: 1px; }

.bz-tamanhos { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.bz-tamanhos button {
	min-width: 52px; height: 44px; padding: 0 12px;
	border: 1px solid var(--bz-borda); border-radius: 4px; background: #fff;
	font-family: inherit; font-size: 15px; cursor: pointer; color: var(--bz-tinta);
}
.bz-tamanhos button[aria-pressed="true"] { border-color: var(--bz-tinta); background: var(--bz-tinta); color: #fff; }
.bz-tamanhos button[disabled] { opacity: 0.35; cursor: not-allowed; text-decoration: line-through; }

.bz-comprar {
	width: 100%; border: 0; border-radius: 6px;
	background: var(--bz-acao); color: var(--bz-acao-texto);
	font-family: inherit; font-size: 16px; font-weight: 700;
	padding: 18px; min-height: 56px; cursor: pointer;
}
.bz-comprar:hover { opacity: 0.9; }
.bz-comprar[disabled] { opacity: 0.45; cursor: not-allowed; }

.bz-aviso { font-size: 14px; color: #b00020; margin: 0; min-height: 20px; }

.bz-selos {
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
	margin: 0; padding: 18px 0 0; border-top: 1px solid var(--bz-borda); list-style: none;
}
.bz-selos li { text-align: center; font-size: 14px; font-weight: 600; line-height: 1.35; }
.bz-selos svg { display: block; margin: 0 auto 6px; width: 26px; height: 26px; stroke: var(--bz-tinta); fill: none; stroke-width: 1.6; }

.bz-sanfona { border-top: 1px solid var(--bz-borda); }
.bz-sanfona details { border-bottom: 1px solid var(--bz-borda); }
.bz-sanfona summary {
	cursor: pointer; list-style: none; padding: 16px 28px 16px 0;
	font-size: 16px; font-weight: 600; position: relative;
}
.bz-sanfona summary::-webkit-details-marker { display: none; }
.bz-sanfona summary::after {
	content: ""; position: absolute; right: 6px; top: 50%;
	width: 9px; height: 9px;
	border-right: 2px solid var(--bz-tinta); border-bottom: 2px solid var(--bz-tinta);
	transform: translateY(-70%) rotate(45deg);
}
.bz-sanfona details[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.bz-sanfona__corpo { padding: 0 0 18px; font-size: 16px; line-height: 1.7; color: var(--bz-suave); }

/* ---------- Grade de colecao ---------- */

.bz-colecao { padding: 32px 0 56px; font-family: var(--bz-fonte); }
.bz-colecao__titulo { font-size: 30px; font-weight: 700; margin: 0 0 6px; }
.bz-colecao__sub { color: var(--bz-suave); margin: 0 0 28px; font-size: 16px; }

.bz-grade { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 750px) { .bz-grade { grid-template-columns: repeat(3, 1fr); gap: 26px; } }
@media (min-width: 990px) { .bz-grade { grid-template-columns: repeat(4, 1fr); } }

.bz-cartao a { text-decoration: none; color: inherit; display: block; }
.bz-cartao__foto { border-radius: 6px; overflow: hidden; background: var(--bz-fundo); margin-bottom: 10px; }
.bz-cartao__foto img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.bz-cartao__nome { font-size: 15px; font-weight: 600; line-height: 1.35; margin: 0 0 4px; }
.bz-cartao__preco { font-size: 15px; }
.bz-cartao__preco del { color: var(--bz-suave); margin-right: 6px; font-size: 14px; }
.bz-cartao__preco ins { text-decoration: none; font-weight: 700; }

.bz-carregando, .bz-vazio { color: var(--bz-suave); font-size: 16px; padding: 40px 0; }

/* ---------- Paginas de texto (politicas) ---------- */

.bz-texto { max-width: 760px; margin: 0 auto; padding: 40px 0 64px; font-family: var(--bz-fonte); font-size: 16px; line-height: 1.7; color: var(--bz-tinta); }
.bz-texto h1 { font-size: 30px; font-weight: 700; line-height: 1.2; margin: 0 0 28px; }
@media (min-width: 750px) { .bz-texto h1 { font-size: 38px; } }
.bz-texto h2 { font-size: 22px; font-weight: 700; line-height: 1.3; margin: 36px 0 12px; }
.bz-texto h3 { font-size: 18px; font-weight: 700; line-height: 1.35; margin: 28px 0 10px; }
.bz-texto h1 + h2 { margin-top: 0; }
.bz-texto p { margin: 0 0 14px; }
.bz-texto ul, .bz-texto ol { margin: 0 0 16px; padding-left: 22px; }
.bz-texto li { margin-bottom: 6px; }
.bz-texto a { color: inherit; text-decoration: underline; }

/* ---------- Contato ---------- */

.bz-contato { margin: 28px 0 36px; padding: 28px; border-radius: 12px; background: var(--bz-fundo); text-align: center; }
.bz-contato__rotulo { margin: 0 0 6px; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--bz-suave); }
.bz-contato__email { margin: 0 0 10px; font-size: 22px; font-weight: 700; word-break: break-word; }
.bz-contato__email a { text-decoration: none; }
.bz-contato__nota { margin: 0; font-size: 14px; color: var(--bz-suave); }

/* ---------- Consulta de pedido ---------- */

.bz-pedido { display: grid; gap: 16px; margin: 28px 0 20px; }
.bz-pedido label { display: grid; gap: 6px; font-size: 14px; font-weight: 600; }
.bz-pedido input {
	font-family: inherit; font-size: 16px; padding: 14px 16px;
	border: 1px solid var(--bz-borda); border-radius: 8px; background: #fff; color: var(--bz-tinta);
}
.bz-pedido input:focus { outline: 2px solid var(--bz-tinta); outline-offset: 1px; }
.bz-pedido__resultado { margin: 0 0 32px; padding: 20px 24px; border-radius: 12px; background: var(--bz-fundo); }
.bz-pedido__resultado p { margin: 0 0 8px; }
.bz-pedido__resultado--erro { background: #fdecee; color: #8a1020; }
.bz-pedido__numero { font-size: 14px; color: var(--bz-suave); }
.bz-pedido__status { font-size: 22px; font-weight: 700; }
.bz-pedido__itens { margin: 10px 0; }

/* Cabecalho e rodape proprios do site em codigo.

   O header portado do Shopify depende do JS do tema (menu drawer, busca
   preditiva, cart drawer deles). Aqui nao ha tema, entao um cabecalho simples
   que funciona sem JS nenhum vale mais que um fiel que nao abre. */

.bz-topo {
	position: sticky; top: 0; z-index: 100;
	background: #fff; border-bottom: 1px solid var(--bz-borda);
	font-family: var(--bz-fonte);
}

.bz-topo__interno {
	max-width: 1200px; margin: 0 auto; padding: 0 20px;
	display: flex; align-items: center; gap: 24px; min-height: 64px;
}

.bz-topo__marca {
	font-size: 22px; font-weight: 700; letter-spacing: -0.02em;
	text-decoration: none; color: var(--bz-tinta);
}

.bz-topo__menu { display: none; gap: 20px; margin-left: auto; }

@media (min-width: 900px) { .bz-topo__menu { display: flex; } }

.bz-topo__menu a {
	font-size: 15px; text-decoration: none; color: var(--bz-tinta);
	padding: 6px 0; border-bottom: 2px solid transparent;
}

.bz-topo__menu a:hover { border-bottom-color: var(--bz-tinta); }

.bz-topo__carrinho {
	margin-left: auto; border: 1px solid var(--bz-borda); border-radius: 4px;
	background: #fff; font-family: inherit; font-size: 15px;
	padding: 9px 16px; cursor: pointer; color: var(--bz-tinta);
}

@media (min-width: 900px) { .bz-topo__carrinho { margin-left: 0; } }

.bz-topo__carrinho span {
	display: inline-block; min-width: 20px; margin-left: 4px;
	background: var(--bz-acao); color: #fff;
	border-radius: 999px; font-size: 12px; font-weight: 700; padding: 1px 6px;
}

.bz-rodape {
	background: var(--bz-fundo); border-top: 1px solid var(--bz-borda);
	margin-top: 48px; font-family: var(--bz-fonte);
}

.bz-rodape__interno { max-width: 1200px; margin: 0 auto; padding: 40px 20px; text-align: center; }
.bz-rodape__marca { font-size: 20px; font-weight: 700; margin: 0 0 16px; }

.bz-rodape__links {
	display: flex; flex-wrap: wrap; justify-content: center;
	gap: 8px 20px; margin-bottom: 20px;
}

.bz-rodape__links a { font-size: 14px; color: var(--bz-suave); text-decoration: none; }
.bz-rodape__links a:hover { color: var(--bz-tinta); text-decoration: underline; }
.bz-rodape__contato { font-size: 14px; color: var(--bz-suave); margin: 0; }
.bz-rodape__contato a { color: var(--bz-tinta); }

/* A home portada traz o proprio cabecalho e rodape embutidos no miolo?
   Nao: o build corta pelo <main>, entao so vem o conteudo. */
.bz-home { display: block; }