/*
Theme Name: 		Hema Child
Theme URI: 			https://hema.templateoption.com/
Author: 			TemplateOption Team
Author URI: 		https://www.webtwine.com/
Description: 		hema is ThemeForest WordPress Premium Theme.
Version: 			1.0.0
Requires at least: 	5.9
Tested up to: 		6.0
Requires PHP: 		7
License: 			Themeforest Commercial Licence
License URI: 		https://themeforest.net/licenses/standard
Tags: 				flexible-header, one-column, two-columns, left-sidebar, right-sidebar, custom-colors, custom-menu, editor-style, featured-images, featured-image-header, full-width-template, microformats, post-formats, theme-options, threaded-comments, translation-ready, blog, shop
Template:     		hema
Text Domain: 		hema-child

Theme Custom CSS starts here
------------------------------------------------------------ */

/* ===== Logo do header — trava a proporção (impede qualquer achatamento) =====
   width:auto garante que a altura de 70px NUNCA distorça o desenho;
   object-fit:contain é uma trava extra caso algo force largura+altura. */
.wt-logo img,
.wt-logo img.custom-logo {
	height: 70px !important;
	width: auto !important;
	max-width: none !important;
	max-height: none !important;
	object-fit: contain;
}
@media (max-width: 767px) {
	.wt-logo img,
	.wt-logo img.custom-logo {
		height: 56px !important;
	}
}

/* ===== Banners de categoria (esquerdo 5f373f1 + 3º fda7e4f) — Opção 2:
   card branco semitransparente + texto navy + botão OUTLINE nativo. ===== */
.elementor-element-5f373f1 .bx-wrap-cont,
.elementor-element-bb9fcc6 .bx-wrap-cont,
.elementor-element-fda7e4f .bx-wrap-cont {
	background: rgba(255, 255, 255, 0.55);   /* branco transparente */
	padding: 18px 22px !important;
	border-radius: 8px;
	box-shadow: 0 6px 20px rgba(0,0,0,.18);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}
.elementor-element-5f373f1 .bx-wrap-cont {   /* card no canto superior-esquerdo */
	top: 24px !important;
	left: 24px !important;
	right: auto !important;
	bottom: auto !important;
	margin-top: 0 !important;
	transform: none !important;
}
.elementor-element-bb9fcc6 .bx-wrap-cont { margin-top: -30px !important; } /* banner baixo: sobe menos */
.elementor-element-fda7e4f .bx-wrap-cont { margin-top: -30px !important; } /* banner baixo: sobe menos */
.elementor-element-5f373f1 .bx-title,
.elementor-element-fda7e4f .bx-title {
	color: #2F415D !important;   /* navy da marca */
	text-shadow: none;
}
.elementor-element-5f373f1 .bx-sub_title,
.elementor-element-fda7e4f .bx-sub_title {
	color: #555555 !important;   /* subtítulo em cinza suave */
	text-shadow: none;
}
/* Botões dos 3 banners: mantidos no estilo OUTLINE nativo (sobre o card),
   sem override de cor — padronizados conforme o 2º banner. */

/* ===== Seção "Banheiras em Destaque": fundo cinza ATRÁS da foto do produto.
   mix-blend-mode:multiply funde o fundo branco da foto no painel cinza. ===== */
.elementor-element-604309c .product-image {
	background-color: #f1f2f4;
	border-radius: 8px;
}
.elementor-element-604309c .product-image img {
	mix-blend-mode: multiply;
}
/* Hover no desktop: borda fina cinza (um pouco mais escura que o fundo do card).
   Borda transparente por padrão -> sem "pulo" de layout ao passar o mouse. */
@media (min-width: 992px) {
	.elementor-element-604309c .product-wrap {
		border: 1px solid transparent;
		border-radius: 8px;
		transition: border-color .2s ease;
	}
	.elementor-element-604309c .product-wrap:hover {
		border-color: #c8ccd3;
	}
}
/* Respiro do texto dentro do card (não colar na borda) + esconder estrelas */
.elementor-element-604309c .product-content {
	padding-left: 14px;
	padding-right: 14px;
	padding-bottom: 6px;
}
.elementor-element-604309c .prod-star-rating {
	display: none !important;
}

/* ===== Loja e categorias: MESMO efeito dos "Banheiras em Destaque" da home
   (fundo cinza atrás da foto + mix-blend + borda fina no hover). Escopado às
   páginas de catálogo e só ao grid principal (exclui a sidebar "Novidades"
   mini-list). Espelha as regras de .elementor-element-604309c. ===== */
.products-wrap:not(.mini-list-items) .product-image,
.products-wrap:not(.mini-list-items) .product-image {
	background-color: #f1f2f4;
	border-radius: 8px;
}
.products-wrap:not(.mini-list-items) .product-image img,
.products-wrap:not(.mini-list-items) .product-image img {
	mix-blend-mode: multiply;
}
.products-wrap:not(.mini-list-items) .product-content,
.products-wrap:not(.mini-list-items) .product-content {
	padding-left: 14px;
	padding-right: 14px;
	padding-bottom: 6px;
}
@media (min-width: 992px) {
	.products-wrap:not(.mini-list-items) .product-wrap,
	.products-wrap:not(.mini-list-items) .product-wrap {
		border: 1px solid transparent;
		border-radius: 8px;
		transition: border-color 0.2s ease;
	}
	.products-wrap:not(.mini-list-items) .product-wrap:hover,
	.products-wrap:not(.mini-list-items) .product-wrap:hover {
		border-color: #c8ccd3;
	}
}

/* ===== Ações do card = 2 BOTÕES (outline) que aparecem no HOVER, overlay no
   rodapé da imagem. APLICA SÓ NO DESKTOP (>=992px); no mobile nada disto vale e o
   tema usa o formato ORIGINAL (ícones no canto superior direito, sempre visíveis).
   Escopo: grid principal do catálogo (loja/categorias) + "Banheiras em Destaque"
   da home (widget Elementor 604309c). ===== */
@media (min-width: 992px) {
	/* âncora do overlay */
	.products-wrap:not(.mini-list-items) .product-image,
	.products-wrap:not(.mini-list-items) .product-image,
	.elementor-element-604309c .product-image {
		position: relative;
	}
	/* container: overlay no rodapé da imagem, escondido por padrão, revela no hover */
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons,
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons,
	.elementor-element-604309c .product-image .button-set.button-icons {
		position: absolute !important;
		left: 10px !important;
		right: 10px !important;
		bottom: 10px !important;
		top: auto !important;
		display: flex !important;
		flex-flow: row nowrap !important;   /* lado a lado */
		gap: 8px !important;
		width: auto !important;
		margin: 0 !important;
		box-shadow: none !important;
		z-index: 5 !important;
		opacity: 0 !important;
		visibility: hidden !important;
		transform: translateY(8px) !important;
		transition: opacity .25s ease, transform .25s ease, visibility .25s ease !important;
	}
	.products-wrap:not(.mini-list-items) .product-wrap:hover .button-set.button-icons,
	.products-wrap:not(.mini-list-items) .product-wrap:hover .button-set.button-icons,
	.elementor-element-604309c .product-wrap:hover .button-set.button-icons {
		opacity: 1 !important;
		visibility: visible !important;
		transform: translateY(0) !important;
	}
	/* cada botão: 50%, outline (fundo branco, borda/texto azul) */
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.button,
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.button,
	.elementor-element-604309c .product-image .button-set.button-icons > a.button {
		position: static !important;
		flex: 1 1 0 !important;
		width: auto !important;
		min-width: 0 !important;
		max-width: none !important;
		height: auto !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 4px !important;
		padding: 9px 6px !important;
		margin: 0 !important;
		background: #ffffff !important;      /* fundo branco */
		color: #2F415D !important;           /* texto azul navy */
		border: 1px solid #2F415D !important;/* borda azul navy */
		border-radius: 6px !important;
		font-size: 11px !important;
		font-weight: 600 !important;
		letter-spacing: 0.2px !important;
		line-height: 1.2 !important;
		text-indent: 0 !important;
		white-space: nowrap !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		box-shadow: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.button:hover,
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.button:hover,
	.elementor-element-604309c .product-image .button-set.button-icons > a.button:hover {
		background: #2F415D !important;      /* preenche azul no hover */
		border-color: #2F415D !important;
		color: #ffffff !important;
	}
	/* ícone inline (o tema deixava width:100%, empurrando o texto pra fora) — azul */
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.button::before,
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.button::before,
	.elementor-element-604309c .product-image .button-set.button-icons > a.button::before {
		width: auto !important;
		flex: none !important;
		margin: 0 4px 0 0 !important;
		font-size: 14px !important;
		color: #2F415D !important;
	}
	/* no hover (fundo azul): ícone e texto do ::after ficam brancos */
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.button:hover::before,
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.button:hover::before,
	.elementor-element-604309c .product-image .button-set.button-icons > a.button:hover::before,
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.btn-quickview:hover::after,
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.btn-quickview:hover::after,
	.elementor-element-604309c .product-image .button-set.button-icons > a.btn-quickview:hover::after {
		color: #ffffff !important;
	}
	/* o texto do "Visão rápida" é um tooltip (.text) — escondemos e recolocamos o
	   rótulo inline via ::after, para casar com o botão "Ler mais". */
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.btn-quickview .text,
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.btn-quickview .text,
	.elementor-element-604309c .product-image .button-set.button-icons > a.btn-quickview .text {
		display: none !important;
	}
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.btn-quickview::after,
	.products-wrap:not(.mini-list-items) .product-image .button-set.button-icons > a.btn-quickview::after,
	.elementor-element-604309c .product-image .button-set.button-icons > a.btn-quickview::after {
		content: "Prévia";
		color: #2F415D !important;
		font-size: 11px !important;
		line-height: 1.2 !important;
		letter-spacing: 0.2px;
		white-space: nowrap !important;
	}
}

/* ===== Quick View: remove 3 infos SÓ no modal (a página do produto mantém tudo):
   1) SKU e Categoria (bloco .product_meta);
   2) a última linha da descrição curta ("Acabamento em Gel Coat" = último <p>).
   O :not(:first-child) protege descrições de 1 parágrafo (não some tudo). ===== */
.wt-quickview .product_meta { display: none !important; }

/* ===== Contact Form 7: feedback de "processando" no envio ===== */
.wpcf7-form.hidromax-sending .wpcf7-submit {
	opacity: 0.65 !important;
	cursor: progress !important;
}
/* Spinner nativo do CF7 — deixar bem visível, ao lado do botão */
.wpcf7-spinner {
	visibility: hidden;
	display: inline-block;
	width: 22px;
	height: 22px;
	margin: 0 0 0 12px;
	vertical-align: middle;
	background-color: #2F415D;   /* navy da marca */
	opacity: 0.75;
	border-radius: 100%;
	-webkit-animation: hidromax-spin 1s ease-in-out infinite;
	animation: hidromax-spin 1s ease-in-out infinite;
}
.wpcf7-form.submitting .wpcf7-spinner,
.wpcf7-form.hidromax-sending .wpcf7-spinner {
	visibility: visible;
}
@keyframes hidromax-spin {
	0%   { transform: scale(0);   opacity: 0.75; }
	100% { transform: scale(1.1); opacity: 0; }
}

/* ===== Página do produto: caixa "Medidas disponíveis" (chips), abaixo dos specs.
   Cores neutras (rgba cinza) para funcionar em fundo claro ou escuro. ===== */
.hidromax-medidas {
	border: 1px solid rgba(128, 128, 128, 0.35);
	border-radius: 8px;
	padding: 14px 18px;
	margin: 18px 0;
}
.hidromax-medidas > summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	list-style: none;
	cursor: pointer;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 13px;
	letter-spacing: 0.5px;
}
.hidromax-medidas > summary::-webkit-details-marker { display: none; }
.hidromax-medidas > summary::after {
	content: "\2212";                 /* − */
	font-size: 20px;
	line-height: 1;
	opacity: 0.6;
}
.hidromax-medidas:not([open]) > summary::after { content: "\002B"; } /* + */
.hidromax-medidas-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 14px;
}
.hidromax-medida {
	border: 1px solid rgba(128, 128, 128, 0.4);
	border-radius: 6px;
	padding: 8px 14px;
	font-size: 14px;
	white-space: nowrap;
	transition: border-color 0.2s ease, color 0.2s ease;
}
.hidromax-medida:hover { border-color: #E96F84; color: #E96F84; }

/* Botão "Solicitar Orçamento" (verde WhatsApp) abaixo das medidas */
.hidromax-orcamento-wrap { margin: 18px 0; }
.hidromax-orcamento-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background: #25D366;
	color: #ffffff !important;
	font-weight: 700;
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 14px 40px;
	border-radius: 6px;
	text-decoration: none;
	transition: background-color 0.2s ease, transform 0.15s ease;
}
.hidromax-orcamento-btn:hover,
.hidromax-orcamento-btn:focus {
	background: #1EBE57;
	color: #ffffff !important;
	transform: translateY(-1px);
}
.hidromax-orcamento-btn i { font-size: 19px; line-height: 1; }

/* ===== Página do produto: remove SKU, Categoria e Availability (In Stock) ===== */
.single-product .sku_wrapper,
.single-product .posted_in,
.single-product .availability {
	display: none !important;
}
/* Quick View: dois botões (Detalhes | Orçamento), azuis, texto branco, 50/50 */
.wt-quickview .hidromax-qv-actions {
	display: flex;
	gap: 10px;
	margin-top: 18px;
}
.wt-quickview .hidromax-qv-btn {
	flex: 1 1 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 16px;
	background: #2F415D;              /* azul navy (Detalhes) */
	color: #ffffff !important;
	border: 1px solid #2F415D;
	border-radius: 6px;
	font-weight: 600;
	font-size: 14px;
	text-decoration: none;
	transition: background-color 0.2s ease, border-color 0.2s ease;
}
.wt-quickview .hidromax-qv-btn i {
	font-size: 16px;
	line-height: 1;
	color: #ffffff !important;
}
.wt-quickview .hidromax-qv-detalhes:hover,
.wt-quickview .hidromax-qv-detalhes:focus {
	background: #E96F84;             /* coral no hover */
	border-color: #E96F84;
	color: #ffffff !important;
}
/* Botão Orçamento: verde WhatsApp */
.wt-quickview .hidromax-qv-orcamento {
	background: #25D366;
	border-color: #25D366;
}
.wt-quickview .hidromax-qv-orcamento:hover,
.wt-quickview .hidromax-qv-orcamento:focus {
	background: #1EBE57;
	border-color: #1EBE57;
	color: #ffffff !important;
}

/* ===== Grade "Categorias Principais" (mosaico): borda fina cinza em cada card ===== */
.elementor-element-575e61ef .cat-wrap {
	border: 1px solid #d7dbe0;   /* cinza um pouco mais escuro que o fundo do card */
	border-radius: 6px;
	overflow: hidden;
}

/* ===== Grade "Categorias Principais" (mosaico): botão "Mais Detalhes"
   outline navy (igual aos banners). ===== */
.elementor-element-575e61ef a.hwt-button {
	background-color: transparent !important;
	border: 1px solid #2F415D !important;
	color: #2F415D !important;
}
.elementor-element-575e61ef a.hwt-button:hover,
.elementor-element-575e61ef a.hwt-button:focus {
	background-color: #2F415D !important;
	border-color: #2F415D !important;
	color: #ffffff !important;
}

/* ===== Banner SPA Maresias: "2,00 x 2,00 Mt" à esquerda (alinha com as specs)
   e mais perto do título; + destaque do preço ===== */
.elementor-element-503588ca .bx-content { text-align: left !important; }
.elementor-element-503588ca .hwt-heading { gap: 6px !important; }
.elementor-element-c36b0ba .bx-content {
	font-size: 24px;
	font-weight: 700;
	color: #ffffff;
	margin-top: 4px;
}

/* ===== Banner SPA Maresias: legenda "Foto Ilustrativa" (discreta, sobre o navy) ===== */
.elementor-element-aa50ef0 .bx-content {
	font-size: 13px;
	font-style: italic;
	color: #aeb7c4;
	margin-top: 6px;
}

/* ===== Banner SPA Maresias (seção 9fa6210): o bloco de texto encolhe para a
   largura do título (elemento mais largo) e é centralizado. Assim o título
   (centralizado) e as specs/botão (à esquerda) compartilham a mesma borda
   esquerda — specs e botão alinham com o "B" de BANHEIRA. ===== */
@media (min-width: 768px) {
	.elementor-element-89a3232 {
		width: -moz-fit-content !important;
		width: fit-content !important;
		max-width: 100% !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}
}

/* ===== Rodapé: faixa de bandeiras de pagamento — imagem colorida (cada logo já
   vem no seu próprio card claro), exibida no tamanho controlado. ===== */
.elementor-element-bandpag1 img {
	max-width: 340px;
	width: 100%;
	height: auto;
}
/* Apresentação abaixo do logo: cor clara (o padrão do hema-text é escuro) */
.elementor-element-c8d7cdc .bx-content {
	color: #c3cbd6;
}

/* ===== Página de Contato: campos do formulário (CF7) ocupam TODA a largura da
   coluna esquerda (antes ficavam encolhidos). Widget do form = ba81a8a. ===== */
.elementor-element-ba81a8a .wpcf7-form input[type="text"],
.elementor-element-ba81a8a .wpcf7-form input[type="tel"],
.elementor-element-ba81a8a .wpcf7-form input[type="email"],
.elementor-element-ba81a8a .wpcf7-form textarea {
	width: 100%;
	display: block;
	box-sizing: border-box;
}
.elementor-element-ba81a8a .wpcf7-form p { margin-bottom: 14px; }
.elementor-element-ba81a8a .wpcf7-form textarea { min-height: 130px; }
/* Celular + E-mail lado a lado (o CF7/wpautop envolve os 2 campos num <p>;
   o flex vai nesse <p>). Celular menor, E-mail maior. Empilham no mobile. */
.elementor-element-ba81a8a .cf7-2col > p {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-bottom: 14px;
}
.elementor-element-ba81a8a .cf7-2col span[data-name="your-tel"]   { flex: 0 1 34%; }
.elementor-element-ba81a8a .cf7-2col span[data-name="your-email"] { flex: 1 1 58%; }
@media (max-width: 560px) {
	.elementor-element-ba81a8a .cf7-2col span[data-name="your-tel"],
	.elementor-element-ba81a8a .cf7-2col span[data-name="your-email"] { flex: 1 1 100%; }
}

/* ===== Botão "voltar ao topo" (#scrollUp) movido para o canto inferior ESQUERDO ===== */
#scrollUp {
	left: 30px !important;
	right: auto !important;
}

/* ===== Widget de captura de leads no WhatsApp (botão flutuante + formulário) ===== */
.hidromax-wa-widget { font-family: inherit; }
.hidromax-wa-widget__button {
	position: fixed; right: 30px; bottom: 110px; z-index: 445;
	width: 58px; height: 58px; padding: 0; border: 0; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: #25D366; color: #fff; font-size: 30px; line-height: 1; cursor: pointer;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28);
	transition: transform 0.2s ease, background-color 0.2s ease;
}
.hidromax-wa-widget__button:hover { background: #1EBE57; transform: translateY(-2px); }
.hidromax-wa-widget__button .anm-whatsapp { line-height: 1; }
.hidromax-wa-widget.is-open .hidromax-wa-widget__button { display: none !important; }

.hidromax-wa-widget__panel {
	position: fixed; right: 30px; bottom: 110px; z-index: 446;
	width: min(360px, calc(100vw - 32px));
	max-height: calc(100vh - 150px); overflow-y: auto; overflow-x: hidden;
	-webkit-overflow-scrolling: touch; overscroll-behavior: contain;
	box-sizing: border-box; padding: 18px 20px;
	background: #fff; border: 1px solid rgba(47, 65, 93, 0.12); border-radius: 10px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
	opacity: 0; visibility: hidden; transform: translateY(8px);
	transition: opacity 0.16s ease, transform 0.16s ease, visibility 0.16s ease;
}
.hidromax-wa-widget.is-open .hidromax-wa-widget__panel { opacity: 1; visibility: visible; transform: none; }
.hidromax-wa-widget__close { position: absolute; top: 8px; right: 12px; width: 28px; height: 28px; border: 0; background: transparent; color: #9aa1ac; font-size: 24px; line-height: 1; cursor: pointer; }
.hidromax-wa-widget__close:hover { color: #2F415D; }
.hidromax-wa-widget__eyebrow { display: block; margin: 0 26px 14px 0; color: #2F415D; font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.hidromax-wa-widget__form label { display: block; margin-bottom: 9px; }
.hidromax-wa-widget__form label > span { display: block; margin-bottom: 4px; color: #4a5568; font-size: 12.5px; font-weight: 600; }
.hidromax-wa-widget__form label small { font-weight: 400; color: #9aa1ac; }
.hidromax-wa-widget__form input, .hidromax-wa-widget__form textarea {
	width: 100%; min-height: 38px; padding: 8px 11px; box-sizing: border-box;
	border: 1px solid rgba(47, 65, 93, 0.18); border-radius: 6px; background: #fff; color: #2F415D; font-size: 14px;
}
.hidromax-wa-widget__form input:focus, .hidromax-wa-widget__form textarea:focus { outline: none; border-color: #2F415D; box-shadow: 0 0 0 2px rgba(47, 65, 93, 0.12); }
.hidromax-wa-widget__form textarea { min-height: 56px; resize: vertical; }
.hidromax-wa-widget__form [hidden] { display: none !important; }
.hidromax-wa-widget__feedback { margin-bottom: 12px; padding: 10px 12px; border-radius: 6px; background: rgba(47, 65, 93, 0.08); color: #2F415D; font-size: 13px; line-height: 1.45; }
.hidromax-wa-widget__feedback.is-error { background: rgba(190, 50, 40, 0.1); color: #a4332a; }
.hidromax-wa-widget__submit { width: 100%; min-height: 44px; border: 0; border-radius: 6px; background: #25D366; color: #fff; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; cursor: pointer; transition: background 0.2s ease; }
.hidromax-wa-widget__submit:hover:not([disabled]) { background: #1EBE57; }
.hidromax-wa-widget__submit[disabled] { opacity: 0.65; cursor: default; }
.hidromax-wa-widget__priv { margin: 10px 0 0; font-size: 11px; color: #9aa1ac; line-height: 1.4; }
.hidromax-wa-widget__priv a { color: #2F415D; text-decoration: underline; }
.hidromax-wa-widget__toggle { margin-bottom: 9px; }
.hidromax-wa-widget__switch { display: flex; align-items: center; gap: 10px; margin: 0; cursor: pointer; user-select: none; }
.hidromax-wa-widget__switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.hidromax-wa-widget__switch-track { position: relative; flex: 0 0 auto; width: 40px; height: 22px; border-radius: 999px; background: rgba(47, 65, 93, 0.22); transition: background 0.2s ease; }
.hidromax-wa-widget__switch-track::after { content: ""; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25); transition: transform 0.2s ease; }
.hidromax-wa-widget__switch input:checked + .hidromax-wa-widget__switch-track { background: #25D366; }
.hidromax-wa-widget__switch input:checked + .hidromax-wa-widget__switch-track::after { transform: translateX(18px); }
.hidromax-wa-widget__switch-label { color: #4a5568; font-size: 13px; font-weight: 600; }

/* posição do "voltar ao topo": esquerda, alinhado com o widget */
@media (min-width: 768px) { #scrollUp { bottom: 110px !important; } }
@media (max-width: 767px) {
	/* A barra fixa .mobile-bottom-navbar ocupa 47px no rodape (z-index 999) e
	   cobria o botao do WhatsApp, que ficava em bottom:18px com z-index 445.
	   Os 47px sao a altura que o proprio tema usa para compensar o rodape
	   (.wt-mob-bot-navbar .footer{padding-bottom:47px}).
	   O env(safe-area-inset-bottom) acrescenta a faixa do indicador de home
	   nos iPhone sem botao. */
	:root { --wa-offset: calc(47px + 14px + env(safe-area-inset-bottom, 0px)); }

	/* O botao flutuante sai do mobile: o WhatsApp agora fica na barra inferior
	   (ver aquadesign_mobile_bottom_navbar em functions.php). O elemento continua
	   no DOM de proposito — a barra dispara o .click() dele para abrir o
	   formulario de captura de leads. */
	.hidromax-wa-widget__button { display: none !important; }
	.hidromax-wa-widget__panel { right: 14px; left: 14px; bottom: var(--wa-offset); width: auto; max-height: calc(100vh - 130px); }
	#scrollUp { left: 18px !important; bottom: var(--wa-offset) !important; }
}

/* ===== Popup de saída (exit-intent) — só desktop, 1x por sessão. Começa oculto;
   o JS adiciona .is-open. ===== */
.hidromax-exit-popup {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 99999;
}
.hidromax-exit-popup.is-open { display: block; }
.hidromax-exit-overlay {
	position: absolute;
	inset: 0;
	background: rgba(20, 28, 44, 0.6);
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}
.hidromax-exit-box {
	position: relative;
	z-index: 1;
	width: min(92%, 460px);
	margin: 12vh auto 0;
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
	padding: 34px 30px 30px;
	text-align: center;
	border-top: 6px solid #E96F84;   /* coral da marca */
	animation: hidromaxExitIn 0.25s ease;
}
@keyframes hidromaxExitIn {
	from { transform: translateY(-14px); opacity: 0; }
	to   { transform: translateY(0);     opacity: 1; }
}
.hidromax-exit-box h3 {
	color: #2F415D;                  /* navy da marca */
	font-size: 24px;
	margin: 0 0 10px;
}
.hidromax-exit-box p {
	color: #555;
	font-size: 15px;
	line-height: 1.6;
	margin: 0 0 22px;
}
.hidromax-exit-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: #25D366;             /* verde WhatsApp */
	color: #fff !important;
	font-weight: 600;
	padding: 13px 26px;
	border-radius: 8px;
	text-decoration: none;
	transition: background-color 0.2s ease;
}
.hidromax-exit-btn:hover,
.hidromax-exit-btn:focus { background: #1EBE57; color: #fff !important; }
.hidromax-exit-btn .anm-whatsapp { font-size: 18px; line-height: 1; }
.hidromax-exit-dismiss {
	display: block;
	margin: 14px auto 0;
	background: none;
	border: 0;
	color: #9aa1ac;
	font-size: 13px;
	cursor: pointer;
	text-decoration: underline;
}
.hidromax-exit-dismiss:hover { color: #6b7280; }
.hidromax-exit-close {
	position: absolute;
	top: 10px;
	right: 12px;
	background: none;
	border: 0;
	font-size: 26px;
	line-height: 1;
	color: #b7bcc4;
	cursor: pointer;
}
.hidromax-exit-close:hover { color: #2F415D; }
body.hidromax-exit-open { overflow: hidden; }

/* ===== Sidebar da loja: banner de destaque = PRODUTO (imagem + nome + link) ===== */
.hidromax-cat-banner {
	display: block;
	text-decoration: none;
}
.hidromax-cat-banner img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 6px;
}
.hidromax-cat-banner-title {
	display: block;
	margin-top: 10px;
	text-align: center;
	color: #2F415D;                  /* navy da marca */
	font-weight: 600;
	font-size: 14px;
	line-height: 1.4;
	transition: color 0.2s ease;
}
.hidromax-cat-banner:hover .hidromax-cat-banner-title,
.hidromax-cat-banner:focus .hidromax-cat-banner-title {
	color: #E96F84;                  /* coral no hover */
}

/* ===== Loja/categorias: carrossel de categorias movido para o rodapé da página
   (antes do footer) — espaçamento vertical. ===== */
.hidromax-bottom-cats {
	margin-top: 40px;
	margin-bottom: 50px;
}

/* ===== SÓ na /loja/ (body.woocommerce-shop): remove o banner de topo (título
   "Loja" + breadcrumb); no lugar dele o carrossel de categorias fica no topo. ===== */
body.woocommerce-shop .page-header { display: none; }
body.woocommerce-shop .shop-top-cats { margin-top: 30px; }

/* ===== Rodapé: linha jurídica (razão social/CNPJ/endereço) discreta na barra inferior ===== */
.footer-legal {
	display: inline-block;
	margin-top: 6px;
	font-size: 12px;
	opacity: 0.7;
}

/* ===== Rodapé: faixa CTA "Fale com um Especialista" — no desktop, textos em
   uma linha e botão empurrado para a extrema direita. ===== */
@media (min-width: 992px) {
	.elementor-element-c1feeab { align-items: center !important; }
	.elementor-element-5e52d62e {          /* coluna do texto: largura do conteúdo */
		width: auto !important;
		flex: 0 1 auto !important;
	}
	.elementor-element-1fe07eae .bx-title,
	.elementor-element-1fe07eae .bx-content {
		white-space: nowrap !important;    /* sem quebra de linha no desktop */
	}
	.elementor-element-54ed4c8a {          /* coluna do botão: encostada à direita */
		width: auto !important;
		flex: 0 0 auto !important;
		margin-left: auto !important;
		align-items: flex-end !important;
	}
}

/* ===== Botão "Orçamento" (WhatsApp) no header ===== */
.wt-orcamento-btn a.hwt-button {
	background-color: #25D366 !important;   /* verde WhatsApp */
	border-color: #25D366 !important;
	color: #ffffff !important;
	border-radius: 6px;
	padding: 10px 20px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
	transition: background-color .2s ease, border-color .2s ease;
}
.wt-orcamento-btn a.hwt-button:hover,
.wt-orcamento-btn a.hwt-button:focus {
	background-color: #1EBE57 !important;   /* hover: verde um pouco mais escuro */
	border-color: #1EBE57 !important;
	color: #ffffff !important;
}
.wt-orcamento-btn a.hwt-button .list-icon.anm-whatsapp {
	color: #ffffff !important;
	font-size: 18px;
	line-height: 1;
}

/* ===== Subtítulos (ex.: "Elegant design") — trocar a fonte cursiva
   "Edu VIC WA NT Beginner" pela fonte NORMAL do site (mesma do texto do corpo,
   igual a "We accept all major credit cards"). Vale em todo o site. ===== */
.bx-sub_title {
	font-family: var(--wt-body-font-family, "Poppins"), sans-serif !important;
}

/* ===== Hero: vídeo de fundo (no container 1ad4918b). A imagem do demo vira
   espaçador invisível (mantém a altura do hero) e o vídeo aparece atrás.
   Textos/botões ficam acima do overlay escuro. ===== */
.elementor-element-fb1b2fa .post-image {
	opacity: 0 !important;        /* imagem do demo invisível — só define a altura */
	pointer-events: none !important; /* não capta o mouse -> sem tooltip "demo1-banner1" */
}
/* Textos do hero em branco (sobre o vídeo escuro) */
.elementor-element-fb1b2fa .bx-sub_title,
.elementor-element-fb1b2fa .bx-title,
.elementor-element-fb1b2fa .bx-content {
	color: #ffffff !important;
	text-shadow: 0 1px 6px rgba(0,0,0,.45);
}
.elementor-element-fb1b2fa .hwt-banner-bx {
	position: relative;
}
.elementor-element-fb1b2fa .hwt-banner-bx::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;                 /* overlay escuro sobre o vídeo, abaixo do texto */
	pointer-events: none;
	background: linear-gradient(90deg, rgba(0,0,0,.22) 0%, rgba(0,0,0,.05) 55%, rgba(0,0,0,0) 100%);
}
.elementor-element-fb1b2fa .bx-wrap-cont {
	position: relative;
	z-index: 3;              /* texto/botões acima do overlay do vídeo */
}

/* ===== Hero: botão 1 (WhatsApp) fica azul parado e VERDE no hover
   (padrão do tema deixaria coral no hover). ===== */
.elementor-element-fb1b2fa a.hwt-button:not(.hwt-button2):hover,
.elementor-element-fb1b2fa a.hwt-button:not(.hwt-button2):focus {
	background-color: #25D366 !important;   /* verde WhatsApp */
	border-color: #25D366 !important;
	color: #ffffff !important;
}
.elementor-element-fb1b2fa a.hwt-button:not(.hwt-button2):hover .list-icon.anm-whatsapp,
.elementor-element-fb1b2fa a.hwt-button:not(.hwt-button2):focus .list-icon.anm-whatsapp {
	color: #ffffff !important;
}


/* ===== Topbar: ícone de "Minha Conta" =====
   O tema não tem widget de conta (só compare, currancy, language, logo,
   mobile-menu, navigation, search, wc-cart, wishlist), então usamos o widget
   nativo `icon` do Elementor com a fonte de ícones do tema (anm-user-l).

   O controle primary_color do Elementor só gera CSS para as views "framed" e
   "stacked". Na view "default" — a nossa — a cor tem que vir daqui, senão o
   ícone sai na cor padrão e destoa dos outros dois sobre o fundo #2F415D. */
.aqd-conta-icone .elementor-icon {
	color: #fff;
	display: flex;
	align-items: center;
	line-height: 1;
	transition: opacity .2s ease;
}
.aqd-conta-icone .elementor-icon:hover { color: #fff; opacity: .75; }
.aqd-conta-icone .elementor-icon-wrapper { display: flex; align-items: center; }


/* ===== Barra inferior do mobile: destaque do WhatsApp =====
   Os outros quatro itens sao icone + label empilhados. O WhatsApp fica sem
   label e com o icone maior, no verde oficial (#25D366), para virar a acao
   mais visivel da barra — e por ser a que gera lead.
   Sem o label, o conteudo do item fica mais baixo que o dos vizinhos: o
   justify-content:center recentraliza verticalmente. */
.mobile-bottom-navbar .aqd-wa-item a {
	justify-content: center;
}
/* O glifo anm-whatsapp da fonte do tema e vazado (so o contorno). Para ter um
   icone solido sem depender de outro glifo, o proprio .icon vira um disco verde
   preenchido e o simbolo fica branco por cima — que e a marca oficial. */
.mobile-bottom-navbar .aqd-wa-item .icon {
	width: 32px;
	height: 32px;
	padding: 0;
	border-radius: 50%;
	background: #25D366;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 6px rgba(37, 211, 102, 0.35);
	transition: background-color .2s ease;
}
.mobile-bottom-navbar .aqd-wa-item .icon i {
	color: #fff;
	font-size: 18px;
	line-height: 1;
}
.mobile-bottom-navbar .aqd-wa-item a:hover .icon,
.mobile-bottom-navbar .aqd-wa-item a:active .icon {
	background: #1EBE57;
}


/* ===== reCAPTCHA v3: selo oculto =====
   O selo do Google fica em position:fixed, bottom:14px, right:14px com
   z-index 2000000000 — passaria por cima da barra inferior do mobile
   (z-index 999), cobrindo os icones de Instagram e Contato.

   O Google PERMITE ocultar o selo desde que a atribuicao apareca no
   formulario. Ela foi adicionada ao texto do proprio Contact Form 7 —
   se voce remover a atribuicao, precisa voltar a exibir o selo. */
.grecaptcha-badge {
	visibility: hidden;
}

/* atribuicao exigida pelo Google, no rodape do formulario */
.cf7-recaptcha-aviso {
	margin-top: 12px;
	font-size: 11px;
	line-height: 1.5;
	color: #6b7280;
}
.cf7-recaptcha-aviso a {
	color: #6b7280;
	text-decoration: underline;
}