/*
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; }

/* ===== 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;
}

/* ===== WhatsApp flutuante (canto inferior DIREITO) — sempre visível ===== */
.hidromax-wa-float {
	position: fixed;
	right: 30px;
	bottom: 40px;
	width: 54px;
	height: 54px;
	background: #25D366;                 /* verde WhatsApp */
	color: #ffffff !important;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 30px;
	line-height: 1;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
	z-index: 445;
	transition: transform 0.2s ease, background-color 0.2s ease;
}
.hidromax-wa-float:hover,
.hidromax-wa-float:focus {
	background: #1EBE57;
	color: #ffffff !important;
	transform: scale(1.06);
}
.hidromax-wa-float .anm-whatsapp { line-height: 1; }
@media (max-width: 767px) {
	.hidromax-wa-float { width: 50px; height: 50px; font-size: 27px; right: 18px; bottom: 18px; }
	#scrollUp { left: 18px !important; }
}
/* Desktop: sobe a posição do WhatsApp e do "voltar ao topo" */
@media (min-width: 768px) {
	.hidromax-wa-float { bottom: 110px; }
	#scrollUp { bottom: 110px !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;
}