/* Ajustes deliberados do clone, carregados DEPOIS de todas as folhas do
   Elementor. Cada regra existe por um motivo registrado no README. */

/* O tema Hello Elementor dimensiona titulo por TAG no reset.css
   (h1 = 2.5rem, h2 = 2rem) e este widget nao define tamanho proprio no
   Elementor. Ao promover o titulo da condicao de <h2> para <h1> -- para a
   pagina ter um <h1>, que e o que buscadores esperam -- o texto saltaria de
   32px para 40px. Estas regras devolvem o tamanho original: a mudanca e
   semantica, nao visual. */
.elementor-element-af6d1c6 .elementor-heading-title {
	font-size: 2rem;
}

/* ------------------------------------------------------------------ *
 * Menu mobile em tela cheia
 *
 * Substitui o dropdown do Elementor Pro, que dependia de um "stretch"
 * feito em JS pelo plugin: sem esse JS a caixa ficava com largura de
 * conteudo e vazava para fora da tela. Aqui o painel e `position: fixed`
 * cobrindo a viewport, entao nao ha largura a calcular.
 *
 * Vale ate 767px -- o mesmo ponto em que o Elementor troca o menu
 * horizontal pelo burger.
 * ------------------------------------------------------------------ */

.menu-mobile {
	--menu-fundo: #3b5280;
	--menu-fundo-2: #2f4269;
	--menu-linha: rgb(255 255 255 / 14%);
	--menu-texto: #fff;

	position: fixed;
	inset: 0;
	z-index: 10000;              /* acima do cabecalho fixo (9997) */
	display: flex;
	flex-direction: column;
	background: linear-gradient(160deg, var(--menu-fundo) 0%, var(--menu-fundo-2) 100%);
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.28s ease, visibility 0s linear 0.28s;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

.menu-mobile[data-aberto='true'] {
	visibility: visible;
	opacity: 1;
	transition: opacity 0.28s ease;
}

/* Acima do breakpoint do burger o painel nao existe para o leitor de tela
   nem para o mouse. */
@media (min-width: 768px) {
	.menu-mobile { display: none; }
}

.menu-mobile__topo {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 22px;
	border-bottom: 1px solid var(--menu-linha);
}

.menu-mobile__logo img {
	display: block;
	width: 148px;
	height: auto;
}

.menu-mobile__fechar {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 44px;                 /* alvo de toque confortavel */
	height: 44px;
	padding: 0;
	border: 1px solid var(--menu-linha);
	border-radius: 50%;
	background: transparent;
	color: var(--menu-texto);
	cursor: pointer;
	transition: background-color 0.2s ease, transform 0.2s ease;
}

.menu-mobile__fechar svg { width: 17px; height: 17px; fill: currentColor; }
.menu-mobile__fechar:hover,
.menu-mobile__fechar:focus-visible { background: rgb(255 255 255 / 12%); }
.menu-mobile__fechar:active { transform: scale(0.94); }

/* Centraliza a lista na sobra vertical: com cinco itens, encostada no topo
   ela deixa um vazio grande sobre o rodape. */
.menu-mobile__nav {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	padding: 6px 0;
}

.menu-mobile__nav > .menu-mobile__lista { width: 100%; }

.menu-mobile__lista {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* A separacao pedida: uma linha por item, sem fechar a lista embaixo. */
.menu-mobile__item + .menu-mobile__item { border-top: 1px solid var(--menu-linha); }

.menu-mobile__link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 20px 24px;
	color: var(--menu-texto);
	font-family: 'Montserrat', sans-serif;
	font-size: 17px;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color 0.2s ease, padding-left 0.2s ease;
}

.menu-mobile__link:hover,
.menu-mobile__link:focus-visible {
	background: rgb(255 255 255 / 8%);
	padding-left: 30px;
	color: var(--menu-texto);
}

.menu-mobile__seta {
	flex: 0 0 auto;
	width: 9px;
	height: 14px;
	fill: currentColor;
	opacity: 0.45;
}

.menu-mobile__rodape {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 18px;
	padding: 20px 24px 26px;
	border-top: 1px solid var(--menu-linha);
}

.menu-mobile__contato {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: rgb(255 255 255 / 82%);
	font-size: 15px;
	text-decoration: none;
}

.menu-mobile__contato:hover,
.menu-mobile__contato:focus-visible { color: var(--menu-texto); }

.menu-mobile__uf {
	display: inline-grid;
	place-items: center;
	min-width: 26px;
	padding: 2px 6px;
	border: 1px solid var(--menu-linha);
	border-radius: 4px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
}

/* Enquanto o painel esta aberto, o conteudo atras nao rola. */
body.menu-mobile-aberto { overflow: hidden; }

/* ...e o botao flutuante de WhatsApp sai de cena: ele fica acima do rodape do
   painel e cobre o telefone do RJ. */
body.menu-mobile-aberto #wws-layout-4 { display: none; }

/* O dropdown do Elementor sai de cena: quem abre agora e o painel. */
.elementor-nav-menu--dropdown { display: none !important; }

@media (prefers-reduced-motion: reduce) {
	.menu-mobile,
	.menu-mobile__link,
	.menu-mobile__fechar { transition: none; }
}
