/**
 * Equipe — ajustes de WordPress/WooCommerce sobre o bundle Tailwind original.
 */

/* ==========================================================================
   Fontes — WOFF2 primeiro, TTF como fallback
   Este @font-face carrega depois do app.css (theme.css depende dele no enqueue),
   então sobrepõe a versão só-TTF do bundle sem recompilar o Tailwind.
   ========================================================================== */
@font-face {
	font-family: "Righteous";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(../fonts/Righteous-Regular.woff2) format("woff2"),
	     url(../fonts/Righteous-Regular.ttf) format("truetype");
}
@font-face {
	font-family: "Titillium Web";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(../fonts/TitilliumWeb-Regular.woff2) format("woff2"),
	     url(../fonts/TitilliumWeb-Regular.ttf) format("truetype");
}

/* ==========================================================================
   Utilitários que o bundle original não trouxe
   (o Tailwind só compilou as classes usadas no site React)
   ========================================================================== */
.mt-14 { margin-top: 3.5rem; }
.mt-16 { margin-top: 4rem; }
.mb-12 { margin-bottom: 3rem; }
.pt-10 { padding-top: 2.5rem; }
.border-0 { border-width: 0; }
.min-w-32 { min-width: 8rem; }
.ml-1\.5 { margin-left: .375rem; }
.text-\[9px\] { font-size: 9px; line-height: 1.2; }
.tracking-normal { letter-spacing: 0; }
.aspect-\[4\/3\] { aspect-ratio: 4 / 3; }

.bg-ink\/50 { background-color: color-mix(in srgb, var(--ink) 50%, transparent); }
.bg-ink\/70 { background-color: color-mix(in srgb, var(--ink) 70%, transparent); }
.bg-bg\/40  { background-color: color-mix(in srgb, var(--bg) 40%, transparent); }
.hover\:bg-bg:hover { background-color: var(--bg); }
.placeholder\:text-ink-soft\/60::placeholder { color: color-mix(in srgb, var(--ink-soft) 60%, transparent); }

@supports not (color: color-mix(in srgb, red 50%, transparent)) {
	.bg-ink\/50 { background-color: rgba(0, 61, 76, .5); }
	.bg-ink\/70 { background-color: rgba(0, 61, 76, .7); }
	.bg-bg\/40  { background-color: rgba(245, 242, 236, .4); }
	.placeholder\:text-ink-soft\/60::placeholder { color: rgba(89, 89, 89, .6); }
}

/* ==========================================================================
   Animações de entrada (substituem o Framer Motion)
   ========================================================================== */
[data-reveal] {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity .6s cubic-bezier(.22, 1, .36, 1), transform .6s cubic-bezier(.22, 1, .36, 1);
	will-change: opacity, transform;
}
[data-reveal="x"]     { transform: translateX(-16px); }
[data-reveal="scale"] { transform: scale(1.05); }
[data-reveal="fade"]  { transform: none; }
[data-reveal].is-visible { opacity: 1; transform: none; }

.equipe-fade-in { animation: equipe-fade-up .6s cubic-bezier(.22, 1, .36, 1) both; }
@keyframes equipe-fade-up {
	from { opacity: 0; transform: translateY(16px); }
	to   { opacity: 1; transform: none; }
}

/* Sem JS o conteúdo continua visível */
.no-js [data-reveal] { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	[data-reveal] { opacity: 1; transform: none; transition: none; }
	.equipe-fade-in { animation: none; }
	.animate-marquee, .animate-blob, .animate-pulse-soft { animation: none !important; }
}

/* ==========================================================================
   Menu lateral (mobile)
   ========================================================================== */
#equipe-drawer .equipe-drawer-panel {
	transform: translateX(100%);
	transition: transform .3s cubic-bezier(.22, 1, .36, 1);
}
#equipe-drawer.is-open .equipe-drawer-panel { transform: translateX(0); }
#equipe-drawer > div:first-child { opacity: 0; transition: opacity .3s ease; }
#equipe-drawer.is-open > div:first-child { opacity: 1; }

/* ==========================================================================
   WhatsApp flutuante
   ========================================================================== */
.equipe-whatsapp {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 998;
	width: 56px;
	height: 56px;
	border-radius: 999px;
	background-color: var(--brand-red);
	color: #fff;
	display: grid;
	place-items: center;
	box-shadow: 0 6px 20px rgba(0, 0, 0, .2);
	transition: transform .25s cubic-bezier(.22, 1, .36, 1), background-color .25s ease;
	animation: equipe-pulse 2.6s ease-out infinite;
}
.equipe-whatsapp:hover {
	background-color: var(--brand-red-hover);
	color: #fff;
	transform: scale(1.06);
}
.equipe-whatsapp svg { width: 30px; height: 30px; fill: #fff; }
@keyframes equipe-pulse {
	0%, 100% { box-shadow: 0 6px 20px rgba(0,0,0,.2), 0 0 0 0 rgba(147,40,44,.5); }
	50%      { box-shadow: 0 6px 20px rgba(0,0,0,.2), 0 0 0 14px rgba(147,40,44,0); }
}
@media (prefers-reduced-motion: reduce) {
	.equipe-whatsapp { animation: none; }
}

/* ==========================================================================
   Página de produto — formulário de compra
   ========================================================================== */
.equipe-atc form.cart {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem;
}
.equipe-atc form.variations_form { display: block; }
.equipe-atc .variations { width: 100%; margin-bottom: 1.25rem; border: 0; }
.equipe-atc .variations th,
.equipe-atc .variations td {
	display: block;
	width: 100%;
	padding: 0;
	text-align: left;
	border: 0;
}
.equipe-atc .variations th.label { margin-bottom: .5rem; }
.equipe-atc .variations th.label label {
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ink);
}
.equipe-atc .variations td.value { margin-bottom: 1rem; }
.equipe-atc .variations select {
	width: 100%;
	min-height: 48px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	padding: .6rem .8rem;
	font-size: .95rem;
	color: var(--ink);
}
.equipe-atc .variations select:focus {
	outline: none;
	border-color: var(--brand-red);
	box-shadow: 0 0 0 3px rgba(147, 40, 44, .12);
}
.equipe-atc .reset_variations { font-size: .75rem; color: var(--ink-soft); }
.equipe-atc .woocommerce-variation-price { margin-bottom: 1rem; }
.equipe-atc .woocommerce-variation-price .price {
	font-family: var(--font-display, "Righteous", sans-serif);
	font-size: 1.75rem;
	color: var(--ink);
}
.equipe-atc .woocommerce-variation-add-to-cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem;
}
.equipe-atc .single_add_to_cart_button,
.woocommerce div.product .equipe-atc form.cart .button {
	flex: 1 1 200px;
	min-height: 48px;
	padding: 0 1.5rem;
	border-radius: 4px;
	background-color: var(--ink);
	color: var(--bg);
	font-size: .875rem;
	font-weight: 600;
	letter-spacing: .025em;
	text-transform: none;
	transition: background-color .25s ease;
}
.equipe-atc .single_add_to_cart_button:hover,
.woocommerce div.product .equipe-atc form.cart .button:hover {
	background-color: var(--brand-red);
	color: var(--bg);
}
.equipe-atc .single_add_to_cart_button.disabled,
.equipe-atc .single_add_to_cart_button:disabled { opacity: .5; }
.equipe-atc .woocommerce-grouped-product-list { width: 100%; margin-bottom: 1rem; }
.equipe-atc .woocommerce-grouped-product-list td {
	padding: .75rem .5rem;
	border-top: 1px solid var(--border);
	vertical-align: middle;
}

/* Preço no topo da coluna: o antigo já aparece separado */
.equipe-price .price,
.equipe-price ins,
.equipe-price bdi {
	font-family: var(--font-display, "Righteous", sans-serif);
	color: var(--ink);
	text-decoration: none;
	font-size: inherit;
}
.equipe-price del { display: none; }

/* Faixa de preço (variáveis) no card */
.equipe-price-html del {
	font-size: .75rem;
	font-weight: 400;
	color: var(--ink-soft);
	margin-right: .35rem;
}
.equipe-price-html ins { text-decoration: none; }

.equipe-related h2,
.equipe-reviews h2 {
	font-family: var(--font-display, "Righteous", sans-serif);
	color: var(--ink);
	letter-spacing: .02em;
}

/* ==========================================================================
   WooCommerce — carrinho, checkout e conta na identidade da marca
   ========================================================================== */
.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
	background-color: var(--brand-red);
	color: #fff;
	border: 0;
	border-radius: 4px;
	font-family: var(--font-sans, "Titillium Web", system-ui, sans-serif);
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
	padding: .75em 1.5em;
	transition: background-color .25s ease;
}
.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
	background-color: var(--brand-red-hover);
	color: #fff;
}
.woocommerce .button.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button:disabled[disabled] {
	opacity: .5;
	background-color: var(--brand-red);
	color: #fff;
}

.woocommerce table.shop_table,
.woocommerce-cart table.cart,
.woocommerce .cart-collaterals .cart_totals table {
	border-color: var(--border);
	border-radius: 10px;
}
.woocommerce table.shop_table th {
	font-family: var(--font-display, "Righteous", sans-serif);
	letter-spacing: .06em;
	text-transform: uppercase;
	font-size: .8rem;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border-top-color: var(--brand-red);
	background-color: var(--surface);
	border-radius: 8px;
}
.woocommerce-message::before,
.woocommerce-info::before { color: var(--brand-red); }

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container .select2-selection--single {
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--surface);
	padding: .65em .8em;
	min-height: 44px;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
	outline: none;
	border-color: var(--brand-red);
	box-shadow: 0 0 0 3px rgba(147, 40, 44, .12);
}

.woocommerce .star-rating span::before,
.woocommerce .woocommerce-product-rating .star-rating span::before { color: var(--brand-yellow); }

.woocommerce nav.woocommerce-pagination ul {
	border: 0;
	display: flex;
	gap: .5rem;
	justify-content: center;
}
.woocommerce nav.woocommerce-pagination ul li { border: 0; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	border: 1px solid var(--border);
	border-radius: 6px;
	padding: .55em .95em;
	background: var(--surface);
	color: var(--ink);
	transition: all .25s ease;
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
	background: var(--brand-red);
	border-color: var(--brand-red);
	color: #fff;
}

/* Paginação do WordPress (blog/busca) */
.wp-block-query-pagination, .navigation.pagination { display: flex; justify-content: center; }
.navigation.pagination .page-numbers {
	border: 1px solid var(--border);
	border-radius: 6px;
	padding: .55em .95em;
	margin: 0 .25rem;
	background: var(--surface);
	color: var(--ink);
	text-decoration: none;
}
.navigation.pagination .page-numbers.current,
.navigation.pagination .page-numbers:hover {
	background: var(--brand-red);
	border-color: var(--brand-red);
	color: #fff;
}

/* ==========================================================================
   Conteúdo do editor
   ========================================================================== */
.equipe-prose h1, .equipe-prose h2, .equipe-prose h3, .equipe-prose h4 {
	font-family: var(--font-display, "Righteous", sans-serif);
	color: var(--ink);
	letter-spacing: .02em;
	margin-top: 2rem;
	margin-bottom: .75rem;
	line-height: 1.1;
}
.equipe-prose h1 { font-size: clamp(2rem, 5vw, 3.5rem); }
.equipe-prose h2 { font-size: clamp(1.6rem, 3.5vw, 2.5rem); }
.equipe-prose h3 { font-size: 1.35rem; }
.equipe-prose p,
.equipe-prose li { color: var(--ink-soft); line-height: 1.75; margin-bottom: 1rem; }
.equipe-prose a { color: var(--brand-red); text-decoration: underline; }
.equipe-prose ul, .equipe-prose ol { padding-left: 1.25rem; margin-bottom: 1.25rem; }
.equipe-prose ul { list-style: disc; }
.equipe-prose ol { list-style: decimal; }
.equipe-prose img { border-radius: 12px; max-width: 100%; height: auto; }
.equipe-prose blockquote {
	border-left: 3px solid var(--brand-red);
	padding-left: 1rem;
	font-style: italic;
	color: var(--ink);
}
.equipe-prose table { width: 100%; border-collapse: collapse; margin-bottom: 1.5rem; }
.equipe-prose th, .equipe-prose td { border: 1px solid var(--border); padding: .6rem .8rem; }

/* Link "pular para o conteúdo" */
.sr-only:focus,
.focus\:not-sr-only:focus {
	position: fixed;
	top: 12px;
	left: 12px;
	z-index: 1000;
	width: auto;
	height: auto;
	padding: .75rem 1.25rem;
	background: var(--brand-red);
	color: #fff;
	border-radius: 4px;
	clip: auto;
	clip-path: none;
	white-space: normal;
}


/* Utilitários usados pelas páginas institucionais */
.-mt-1 { margin-top: -.25rem; }
.pb-5 { padding-bottom: 1.25rem; }
.pb-6 { padding-bottom: 1.5rem; }
.w-24 { width: 6rem; }
.h-24 { height: 6rem; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.object-contain { object-fit: contain; }

/* Acordeão do FAQ (<details>) */
details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }
details[open] .group-open\:rotate-45 { transform: rotate(45deg); }

@media (min-width: 640px) {
	.sm\:grid-cols-\[auto_1fr\] { grid-template-columns: auto minmax(0, 1fr); }
	.sm\:mb-10 { margin-bottom: 2.5rem; }
	.sm\:mb-12 { margin-bottom: 3rem; }
	.sm\:mx-0 { margin-left: 0; margin-right: 0; }
	.sm\:pb-6 { padding-bottom: 1.5rem; }
	.sm\:pb-8 { padding-bottom: 2rem; }
	.sm\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
	.sm\:rounded-\[2rem\] { border-radius: 2rem; }
}

/* ==========================================================================
   Mapa do Brasil — representantes (compre-no-atacado)
   ========================================================================== */
[data-equipe-mapa] .equipe-uf {
	fill: #9BB7BE;
	stroke: var(--bg);
	stroke-width: 1.2;
	cursor: pointer;
	transition: fill .2s ease;
	/* O estado ativo é comunicado pelo fill (.is-selected); o anel de foco do
	   navegador desenharia um retângulo azul sobre a bounding box do path. */
	outline: none;
	-webkit-tap-highlight-color: transparent;
}
[data-equipe-mapa] .equipe-uf:focus,
[data-equipe-mapa] .equipe-uf:focus-visible,
[data-equipe-mapa] .equipe-uf:active {
	outline: none;
}
[data-equipe-mapa] .equipe-uf.is-dedicado { fill: var(--brand-teal); }
[data-equipe-mapa] .equipe-uf:hover,
[data-equipe-mapa] .equipe-uf:focus-visible { fill: var(--brand-yellow); }
[data-equipe-mapa] .equipe-uf.is-selected { fill: var(--brand-red); }
.min-h-12 { min-height: 3rem; }
@media (min-width: 640px) {
	.sm\:w-auto { width: auto; }
}
@media (min-width: 1024px) {
	.lg\:grid-cols-\[1\.2fr_1fr\] { grid-template-columns: 1.2fr 1fr; }
}

/* Utilitários das páginas full-bleed (quem-somos, compre-no-atacado) */
.h-28 { height: 7rem; }
.w-28 { width: 7rem; }
.pt-8 { padding-top: 2rem; }
.pb-12 { padding-bottom: 3rem; }
.py-14 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
.inline-block { display: inline-block; }
.text-brand-teal { color: var(--brand-teal); }
.leading-\[1\.0\] { line-height: 1; }
.text-\[clamp\(2\.5rem\,7vw\,5rem\)\] { font-size: clamp(2.5rem, 7vw, 5rem); }
.text-\[clamp\(2rem\,5\.5vw\,4\.5rem\)\] { font-size: clamp(2rem, 5.5vw, 4.5rem); }
.text-\[clamp\(2rem\,5vw\,3\.5rem\)\] { font-size: clamp(2rem, 5vw, 3.5rem); }
.text-\[clamp\(1\.75rem\,4\.5vw\,3\.25rem\)\] { font-size: clamp(1.75rem, 4.5vw, 3.25rem); }

@media (min-width: 640px) {
	.sm\:pb-16 { padding-bottom: 4rem; }
	.sm\:mt-20 { margin-top: 5rem; }
	.sm\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
	.sm\:py-14 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
	.sm\:py-16 { padding-top: 4rem; padding-bottom: 4rem; }
	.sm\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
}
@media (min-width: 1024px) {
	.lg\:grid-cols-\[1\.5fr_1fr\] { grid-template-columns: 1.5fr 1fr; }
}

/* ==========================================================================
   Imagens de produto sempre quadradas
   (independe da proporção do arquivo enviado na Biblioteca de Mídia)
   ========================================================================== */
.aspect-square { aspect-ratio: 1 / 1; }

[data-equipe-gallery] > div:first-child {
	aspect-ratio: 1 / 1;
}
[data-equipe-gallery] [data-gallery-main] {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
[data-equipe-gallery] [data-gallery-thumb] {
	aspect-ratio: 1 / 1;
}
[data-equipe-gallery] [data-gallery-thumb] img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
article.product a.aspect-square img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	aspect-ratio: 1 / 1;
}

/* ==========================================================================
   Minha conta (WooCommerce My Account)
   ========================================================================== */
.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1px solid var(--border);
	border-radius: 12px;
	overflow: hidden;
	background: var(--surface);
}
.woocommerce-MyAccount-navigation li { margin: 0; }
.woocommerce-MyAccount-navigation li + li { border-top: 1px solid var(--border); }
.woocommerce-MyAccount-navigation li a {
	display: block;
	padding: .9rem 1.15rem;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ink);
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
}
.woocommerce-MyAccount-navigation li a:hover {
	background: var(--bg);
	color: var(--brand-red);
}
.woocommerce-MyAccount-navigation li.is-active a {
	color: var(--brand-red);
	background: var(--bg);
	box-shadow: inset 3px 0 0 var(--brand-red);
}

.woocommerce-MyAccount-content {
	color: var(--ink-soft);
	font-size: .95rem;
	line-height: 1.7;
}
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
	font-family: var(--font-display, "Righteous", sans-serif);
	color: var(--ink);
	letter-spacing: .02em;
	margin: 1.5rem 0 .75rem;
}
.woocommerce-MyAccount-content > h2:first-child,
.woocommerce-MyAccount-content > p:first-child { margin-top: 0; }
.woocommerce-MyAccount-content a:not(.button) { color: var(--brand-red); }
.woocommerce-MyAccount-content fieldset {
	border: 1px solid var(--border);
	border-radius: 10px;
	padding: 1rem 1.25rem;
	margin: 1.25rem 0;
}
.woocommerce-MyAccount-content legend {
	font-family: var(--font-display, "Righteous", sans-serif);
	color: var(--ink);
	padding: 0 .5rem;
}

/* Títulos do conteúdo da conta em tamanho civilizado
   (sem isto, h2/h3 do WooCommerce herdam escala de display gigante) */
.woocommerce-MyAccount-content h2 { font-size: 1.5rem; line-height: 1.2; }
.woocommerce-MyAccount-content h3 { font-size: 1.2rem; line-height: 1.25; }

/* Endereços em cartões — grid no lugar dos floats do WooCommerce */
.woocommerce-MyAccount-content .u-columns,
.woocommerce-Addresses {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1rem;
}
.woocommerce-MyAccount-content .u-columns::before,
.woocommerce-MyAccount-content .u-columns::after { display: none; }
.woocommerce-Addresses .col-1,
.woocommerce-Addresses .col-2,
.woocommerce-MyAccount-content .u-column1,
.woocommerce-MyAccount-content .u-column2 {
	float: none !important;
	width: auto !important;
	max-width: none !important;
	border: 1px solid var(--border);
	border-radius: 12px;
	background: var(--surface);
	padding: 1.25rem 1.5rem;
	margin: 0 !important;
}
.woocommerce-Addresses .woocommerce-Address,
.woocommerce-MyAccount-content address {
	font-style: normal;
	line-height: 1.7;
}

/* Cabeçalho do cartão: título à esquerda, link "Adicionar/Editar" à direita */
.woocommerce-Address-title {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: .25rem .75rem;
	margin-bottom: .75rem;
	border-bottom: 1px solid var(--border);
	padding-bottom: .6rem;
}
.woocommerce-Address-title h2,
.woocommerce-Address-title h3 {
	font-size: 1.15rem !important;
	line-height: 1.25;
	margin: 0;
}
.woocommerce-Address-title .edit {
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--brand-red);
	white-space: nowrap;
	text-decoration: none;
}
.woocommerce-Address-title .edit:hover { text-decoration: underline; }

/* Larguras: navegação enxuta, conteúdo respirando */
@media (min-width: 769px) {
	.woocommerce-MyAccount-navigation { width: 26%; }
	.woocommerce-MyAccount-content { width: 70%; }
}
@media (max-width: 768px) {
	.woocommerce-MyAccount-navigation,
	.woocommerce-MyAccount-content {
		width: 100%;
		float: none;
	}
	.woocommerce-MyAccount-navigation { margin-bottom: 1.5rem; }
}

/* ==========================================================================
   Botões dos blocos do WooCommerce
   Cobre os botões dos blocos (carrinho, checkout, grades de produto) e os
   botões clássicos do WooCommerce. Sem estas regras eles herdam o cinza padrão
   do core (rgb 50,55,60) e o link bordô sublinhado de .equipe-prose a.
   ========================================================================== */

/* --- Primário --- */
.wp-block-button__link,
.wc-block-components-button:not(.is-link),
.wc-block-cart__submit-button,
.wc-block-cart__submit-container a,
.wc-block-components-checkout-place-order-button,
.woocommerce-Button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.equipe-prose .wc-block-components-button:not(.is-link),
.equipe-prose .woocommerce a.button {
	background-color: var(--brand-red);
	color: var(--bg);
	border: 0;
	border-radius: .25rem;
	height: 3rem;
	padding: 0 1.75rem;
	font-family: var(--font-sans, "Titillium Web", system-ui, sans-serif);
	font-size: .875rem;
	font-weight: 600;
	line-height: 1;
	text-transform: none;
	text-decoration: none !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-shadow: none;
	cursor: pointer;
	transition: background-color .2s ease;
}
.wp-block-button__link:hover,
.wc-block-components-button:not(.is-link):hover,
.wc-block-cart__submit-button:hover,
.wc-block-cart__submit-container a:hover,
.wc-block-components-checkout-place-order-button:hover,
.woocommerce-Button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
	background-color: var(--brand-red-hover);
	color: var(--bg);
	text-decoration: none !important;
}
.wc-block-components-button__text { color: inherit; }

/* Botões de largura total (finalizar compra / pedido) */
.wc-block-cart__submit-container a,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	width: 100%;
}

/* --- Secundário (contorno): "Continuar comprando", "Voltar para a loja" --- */
.wc-block-components-button.is-link,
.wc-block-components-button--outlined,
.woocommerce a.button.wc-backward,
.woocommerce .button.alt.wc-backward,
.wc-block-cart__submit-container .wc-block-components-button.outlined {
	background-color: transparent;
	color: var(--ink);
	border: 1px solid var(--ink);
	border-radius: .25rem;
	height: 3rem;
	padding: 0 1.75rem;
	font-weight: 600;
	text-decoration: none !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color .2s ease, color .2s ease;
}
.wc-block-components-button.is-link:hover,
.wc-block-components-button--outlined:hover,
.woocommerce a.button.wc-backward:hover,
.woocommerce .button.alt.wc-backward:hover {
	background-color: var(--ink);
	color: var(--bg);
	text-decoration: none !important;
}

/* --- Desabilitado --- */
.wp-block-button__link[disabled],
.wc-block-components-button:disabled,
.wc-block-components-button.wc-block-components-button--loading,
.woocommerce a.button.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button[disabled] {
	opacity: .55;
	cursor: not-allowed;
	background-color: var(--brand-red);
	color: var(--bg);
}
.wc-block-components-button:disabled:hover,
.woocommerce button.button:disabled:hover { background-color: var(--brand-red); }

/* --- Links de ação que o Woo renderiza como texto (não como botão) --- */
.woocommerce-info a:not(.button),
.woocommerce-message a:not(.button),
.woocommerce-error a:not(.button),
.wc-block-components-notice-banner a {
	color: var(--brand-red);
	text-decoration: underline;
	font-weight: 600;
}
.woocommerce-info a.button,
.woocommerce-message a.button { text-decoration: none !important; color: var(--bg); }

/* Painéis, cupom e quantidade dos blocos na identidade da marca */
.wc-block-components-totals-wrapper,
.wc-block-components-panel { border-color: var(--border); }
.wc-block-components-panel__button,
.wc-block-components-totals-coupon-link { color: var(--ink); font-weight: 600; }
.wc-block-components-quantity-selector {
	border: 1px solid var(--border) !important;
	border-radius: 4px;
}
.wc-block-components-product-name { color: var(--ink); font-weight: 600; }
.wc-block-components-product-metadata__description,
.wc-block-components-product-details { color: var(--ink-soft); }
.wc-block-components-sale-badge {
	background: var(--brand-red);
	color: #fff;
	border: 0;
	border-radius: 999px;
}
.wc-block-cart-item__image img { border-radius: 8px; aspect-ratio: 1 / 1; object-fit: cover; }

/* ==========================================================================
   MOBILE
   Ajustes específicos para telas pequenas. O layout já é responsivo pelo
   Tailwind; aqui tratamos alvos de toque, overflow e o que o WooCommerce
   entrega em tabela.
   ========================================================================== */

/* Nunca rolar na horizontal */
html, body { max-width: 100%; overflow-x: hidden; }
img, video, iframe, table { max-width: 100%; }

/* O cursor customizado atrapalha em toque */
@media (hover: none) {
	html, body, button, a, [role="button"], label, summary, select {
		cursor: auto !important;
	}
	a, button, [role="button"] { -webkit-tap-highlight-color: rgba(147, 40, 44, .15); }
}

@media (max-width: 767px) {

	/* Alvos de toque com no mínimo 44px */
	.equipe-atc .single_add_to_cart_button,
	.woocommerce a.button,
	.woocommerce button.button,
	.woocommerce input.button,
	.equipe-atc .woocommerce-variation-add-to-cart .button {
		min-height: 48px;
		width: 100%;
		justify-content: center;
	}
	.equipe-atc form.cart,
	.equipe-atc .woocommerce-variation-add-to-cart { gap: .75rem; }
	.equipe-atc .quantity { width: 100%; justify-content: space-between; }
	.equipe-atc .quantity .qty { width: 100%; }

	/* Evita o zoom automático do iOS ao focar um campo */
	input[type="text"], input[type="email"], input[type="tel"],
	input[type="number"], input[type="password"], input[type="search"],
	select, textarea {
		font-size: 16px;
	}

	/* Tabelas do WooCommerce viram blocos */
	.woocommerce table.shop_table_responsive thead,
	.woocommerce-page table.shop_table_responsive thead { display: none; }
	.woocommerce table.shop_table_responsive tr,
	.woocommerce-page table.shop_table_responsive tr {
		display: block;
		border: 1px solid var(--border);
		border-radius: 10px;
		margin-bottom: .75rem;
		padding: .5rem;
		background: var(--surface);
	}
	.woocommerce table.shop_table_responsive tr td,
	.woocommerce-page table.shop_table_responsive tr td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 1rem;
		text-align: right;
		border: 0;
		border-bottom: 1px solid var(--border);
		padding: .6rem .4rem;
	}
	.woocommerce table.shop_table_responsive tr td:last-child { border-bottom: 0; }
	.woocommerce table.shop_table_responsive tr td::before {
		content: attr(data-title) ": ";
		font-weight: 700;
		color: var(--ink);
		text-align: left;
	}
	.woocommerce table.shop_table_responsive tr td.product-remove::before,
	.woocommerce table.shop_table_responsive tr td.actions::before { content: ""; }
	.woocommerce td.product-thumbnail img { max-width: 72px; }

	/* Totais e cupom */
	.woocommerce .cart-collaterals,
	.woocommerce-page .cart-collaterals { width: 100%; }
	.woocommerce .cart-collaterals .cart_totals,
	.woocommerce-page .cart-collaterals .cart_totals { width: 100%; float: none; }
	.woocommerce form .form-row-first,
	.woocommerce form .form-row-last { width: 100%; float: none; margin-right: 0; }

	/* Checkout: resumo abaixo do formulário, sem colunas apertadas */
	.woocommerce .col2-set .col-1,
	.woocommerce .col2-set .col-2,
	.woocommerce-page .col2-set .col-1,
	.woocommerce-page .col2-set .col-2 { width: 100%; float: none; }

	/* Cards de produto um pouco mais compactos */
	.woocommerce ul.products li.product,
	article.product .pt-4 { padding-top: .75rem; }

	/* Miniaturas da galeria: 4 por linha cabem melhor */
	[data-equipe-gallery] .grid-cols-5 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

	/* Setas do hero um pouco maiores para o dedo */
	[data-equipe-hero] [data-hero-prev],
	[data-equipe-hero] [data-hero-next] { width: 44px; height: 44px; }
	[data-equipe-hero] [data-hero-dot] { min-height: 12px; padding: 4px 0; background-clip: content-box; }

	/* WhatsApp flutuante sem cobrir botões */
	.equipe-whatsapp { right: 14px; bottom: 14px; width: 52px; height: 52px; }
	.equipe-whatsapp svg { width: 27px; height: 27px; }

	/* Paginação com alvos maiores */
	.woocommerce nav.woocommerce-pagination ul li a,
	.woocommerce nav.woocommerce-pagination ul li span,
	.navigation.pagination .page-numbers { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

	/* Rodapé mais respirável */
	.site-footer, footer .container-x { text-align: left; }
}

@media (max-width: 400px) {
	/* Telas bem pequenas: hero e títulos sem estourar */
	[data-equipe-hero] { min-height: 480px; }
	.font-display { word-break: break-word; }
}

/* ==========================================================================
   RODADA 2 — conversão e correções
   ========================================================================== */

/* B1 — Preço no Pix (página de produto) */
.equipe-pix-preco {
	margin-top: .5rem;
	font-size: .95rem;
	color: var(--ink-soft);
}
.equipe-pix-preco .woocommerce-Price-amount,
.equipe-pix-preco bdi {
	color: var(--brand-red);
	font-weight: 700;
}
.equipe-pix-preco__tag {
	font-size: .85em;
	color: var(--ink-soft);
	font-weight: 400;
}

/* B2 — Toast "produto adicionado" */
.equipe-toast {
	position: fixed;
	left: 50%;
	bottom: 20px;
	z-index: 1000;
	transform: translateX(-50%) translateY(24px);
	opacity: 0;
	pointer-events: none;
	display: inline-flex;
	align-items: center;
	gap: 1rem;
	max-width: calc(100vw - 32px);
	padding: .85rem 1.15rem;
	border-radius: .5rem;
	background: var(--ink);
	color: var(--bg);
	font-size: .9rem;
	box-shadow: 0 8px 30px rgba(0, 0, 0, .22);
	transition: opacity .25s ease, transform .25s ease;
}
.equipe-toast.is-visible {
	opacity: 1;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
}
.equipe-toast__link {
	color: var(--brand-yellow);
	font-weight: 700;
	text-decoration: underline;
	white-space: nowrap;
}
.equipe-toast__link:hover { color: #fff; }
@media (prefers-reduced-motion: reduce) {
	.equipe-toast { transition: opacity .25s ease; }
}

/* B3 — Headings da descrição subordinados ao H1 do produto */
.equipe-descricao .equipe-prose h1,
.equipe-descricao .equipe-prose h2,
.equipe-descricao .equipe-prose h3,
.equipe-descricao .equipe-prose h4,
#tab-description h2,
#tab-description h3,
.woocommerce-Tabs-panel h2,
.woocommerce-Tabs-panel h3 {
	font-family: var(--font-display, "Righteous", sans-serif);
	color: var(--ink);
	line-height: 1.2;
	margin-top: 1.5rem;
	margin-bottom: .5rem;
}
.equipe-descricao .equipe-prose h1,
.equipe-descricao .equipe-prose h2,
#tab-description h2,
.woocommerce-Tabs-panel h2 { font-size: 1.4rem; }
.equipe-descricao .equipe-prose h3,
.equipe-descricao .equipe-prose h4,
#tab-description h3,
.woocommerce-Tabs-panel h3 { font-size: 1.15rem; }
.equipe-descricao-corpo { max-width: 68ch; }

/* B4 — Bloco de destaques (utilitários não presentes no bundle) */
.equipe-destaques .gap-2\.5 { gap: .625rem; }
.equipe-destaques .gap-x-8 { column-gap: 2rem; }
.equipe-destaques {
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: .75rem;
	padding: 1.25rem 1.5rem;
}
.equipe-destaques h3 { margin: 0 0 1rem; }

/* B6 — Nota administrativa do endereço (texto de ajuda dos campos de checkout).
   Escopado às áreas de billing/shipping; NÃO afeta erros de validação
   (.woocommerce-error) nem o aviso de cupom (.woocommerce-form-coupon-toggle). */
.woocommerce-checkout .woocommerce-billing-fields .description,
.woocommerce-checkout .woocommerce-shipping-fields .description,
.woocommerce-checkout .woocommerce-additional-fields .description {
	display: none;
}

/* B7 — Ícones de pagamento quebrados (sem src válido) + alinhamento do label */
.wc_payment_methods img[src=""],
.wc_payment_methods img:not([src]),
.payment_box img[src=""],
.wc-block-components-payment-method-icons img[src=""] {
	display: none;
}
.wc_payment_methods label {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
}
.wc_payment_methods label img { max-height: 24px; width: auto; }

/* B8 — Status "Calculando frete..." do SuperFrete some quando há resultado.
   Usa :has() (Chrome/Safari/Firefox atuais). Sem tocar no JS do plugin. */
.single-product:has(#superfrete-results-container:not(:empty)) .superfrete-calculating,
.single-product:has(#superfrete-results-container:not(:empty)) .superfrete-loading,
#superfrete-results-container:not(:empty) ~ .superfrete-calculating {
	display: none !important;
}

/* ==========================================================================
   Salvaguardas de overflow (Tarefa 5)
   Garantem que mapa e marquee nunca gerem scroll horizontal em nenhuma largura.
   ========================================================================== */
[data-equipe-mapa] svg { max-width: 100%; height: auto; }
[data-equipe-mapa] { min-width: 0; }
.animate-marquee { will-change: transform; }
.equipe-woo-page { min-width: 0; }
.equipe-woo-page .woocommerce { max-width: 100%; }

/* ==========================================================================
   C4 — Grade de produtos dos BLOCOS do WooCommerce (carrinho vazio "Novidade
   na loja", e qualquer bloco de produtos). O core usa display:block com
   has-N-columns; aqui vira grid responsivo e as imagens ficam padronizadas.
   ========================================================================== */
.wc-block-grid__products,
.wp-block-woocommerce-handpicked-products .wc-block-grid__products,
.wc-block-product-template,
ul.wc-block-grid__products {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
@media (min-width: 640px) {
	.wc-block-grid__products,
	ul.wc-block-grid__products,
	.wc-block-product-template { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
	.wc-block-grid__products,
	ul.wc-block-grid__products,
	.wc-block-product-template { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; }
}
.wc-block-grid__product,
.wc-block-grid__products > li {
	margin: 0 !important;
	padding: 0;
	width: auto !important;
	float: none !important;
	display: flex;
	flex-direction: column;
	text-align: left;
}

/* Imagens SEMPRE quadradas e sem distorção — carrinho vazio, loja, categoria,
   relacionados e home. object-fit: contain (nunca fill) + fundo uniforme, para
   fotos de tamanhos diferentes na Biblioteca ficarem visualmente iguais. */
.wc-block-grid__product-image,
.wc-block-grid__product-image a {
	display: block;
	width: 100%;
}
.wc-block-grid__product-image img,
.wc-block-components-product-image img,
ul.products li.product a > img,
article.product a img,
.equipe-related ul.products li.product img {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: contain !important;
	background: var(--surface);
	border-radius: 10px;
	border: 1px solid var(--border);
}

/* Título, preço e botão no padrão do tema */
.wc-block-grid__product-title {
	font-size: .95rem;
	font-weight: 500;
	color: var(--ink);
	margin: .75rem 0 .25rem;
	line-height: 1.3;
}
.wc-block-grid__product-price {
	color: var(--ink);
	font-weight: 700;
	margin-bottom: .75rem;
}
.wc-block-grid__product-price del { color: var(--ink-soft); font-weight: 400; margin-right: .35rem; }
.wc-block-grid__product .wp-block-button__link,
.wc-block-grid__product .wc-block-components-button {
	margin-top: auto;
	min-height: 44px;
	width: 100%;
	justify-content: center;
}

/* C1 — utilitários do Mapa do site não presentes no bundle */
.break-inside-avoid { break-inside: avoid; }
.gap-x-10 { column-gap: 2.5rem; }
.gap-y-10 { row-gap: 2.5rem; }
@media (min-width: 768px) {
	.md\:col-span-2 { grid-column: span 2 / span 2; }
}

/* ==========================================================================
   C4 (correção definitiva) — o wc-blocks (all-products.css) aplica nos itens
   `.wc-block-grid__product { flex:1 0 25%; max-width:25% }`. Ao virar grid, o
   max-width:25% passa a valer sobre a COLUNA (25% de ~350px ≈ 87px) — daí itens
   minúsculos e vãos enormes. Aqui zeramos flex/max-width/margens dos itens para
   que o grid controle o tamanho, e forçamos o container à largura toda.
   ========================================================================== */
.wc-block-grid,
.wp-block-woocommerce-product-new,
.wp-block-woocommerce-empty-cart-block .wc-block-grid {
	width: 100%;
	max-width: 100%;
	align-self: stretch;
	box-sizing: border-box;
	text-align: left;
}
.wp-block-woocommerce-empty-cart-block > * { max-width: 100%; }

ul.wc-block-grid__products {
	width: 100%;
	max-width: 100%;
	margin: 0 !important;
	padding: 0 !important;
	box-sizing: border-box;
}
.wc-block-grid .wc-block-grid__product,
.wc-block-grid.has-1-columns .wc-block-grid__product,
.wc-block-grid.has-2-columns .wc-block-grid__product,
.wc-block-grid.has-3-columns .wc-block-grid__product,
.wc-block-grid.has-4-columns .wc-block-grid__product,
.wc-block-grid.has-5-columns .wc-block-grid__product,
.wc-block-grid.has-6-columns .wc-block-grid__product,
ul.wc-block-grid__products > li.wc-block-grid__product {
	flex: initial !important;
	width: auto !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	text-align: left;
	font-size: 1rem !important;
}

/* Imagem do card com um teto de altura, para não ficar gigante em telas largas */
.wc-block-grid__product-image img {
	max-height: 320px;
	margin-inline: auto;
}