/*
 * ADS Borges — enfeite e comportamento visual.
 *
 * Tudo o que é texto, cor, fonte e espaçamento está no Elementor (Kit global).
 * Aqui ficam só as coisas que o editor não faz: ícones de traço, menu lateral,
 * campos do formulário, faixa de cookies e ajustes finos de leitura.
 */

:root {
	--ads-marinho: #041B47;
	--ads-apoio: #2E5B8C;
	--ads-ceu: #9CBFE6;
	--ads-gelo: #F3F6FB;
	--ads-linha: #041B471F;
	--ads-texto: #2A3446;
	--ads-suave: #5C6A80;
}

/* Ícones do site são SVG de traço: o Elementor pinta o preenchimento, não o traço. */
.elementor-widget-icon .elementor-icon svg[stroke],
.elementor-widget-icon-box .elementor-icon svg[stroke],
.elementor-icon-list-icon svg[stroke],
.elementor-button-icon svg[stroke] {
	fill: none !important;
	stroke: currentColor;
}
.elementor-icon-list-icon svg[stroke] {
	width: var(--e-icon-list-icon-size, 18px);
	height: var(--e-icon-list-icon-size, 18px);
}
.ads-icone .elementor-icon { line-height: 0; }

/* ---------- textos ---------- */
.ads-site h1, .ads-site h2, .ads-site h3 { text-wrap: balance; }
.ads-site p { text-wrap: pretty; }
.ads-rotulo .elementor-heading-title { font-variant-numeric: tabular-nums; }
.ads-nota { opacity: .85; }
.ads-legenda { opacity: .85; }
.ads-confirmar { background: #FFF3C4; color: #6A4B00; padding: 1px 6px; border-radius: 2px; font-size: .92em; }
.ads-sep { opacity: .45; margin: 0 2px; }
.ads-migalha a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.35); }
.ads-migalha a:hover { border-bottom-color: currentColor; }

/* ---------- botões ---------- */
.ads-site .ads-btn .elementor-button {
	transition: background-color .22s ease, color .22s ease, border-color .22s ease;
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
}
.ads-site .ads-btn--link .elementor-button { padding: 6px 0; border: 0; }
.ads-site .ads-btn--link .elementor-button:hover { background: transparent !important; }
.ads-site .ads-btn--link .elementor-button:hover .elementor-button-text { border-bottom-color: transparent; }
.ads-btn--link .elementor-button-text { border-bottom: 1px solid currentColor; padding-bottom: 2px; }
/* A seta do link fica depois do texto (o Elementor não aplica a regra quando o ícone é SVG da biblioteca). */
.ads-btn--link .elementor-button-content-wrapper { flex-direction: row-reverse; gap: 10px; }

/* ---------- cabeçalho ---------- */
/* O cabeçalho acompanha a rolagem. O sticky precisa ficar no <header> do tema:
   posto no container do Elementor, ele para no fim do próprio <header>. */
.ads-site header#masthead { position: sticky; top: 0; z-index: 95; }
/* Sem ancoragem de rolagem: o navegador não corrige a posição quando a barra de contatos recolhe. */
html { overflow-anchor: none; }
.ads-cabecalho { transition: border-color .2s ease, box-shadow .25s ease; }
.ads-rolou .ads-cabecalho {
	border-bottom-color: rgba(4, 27, 71, .18) !important;
	box-shadow: 0 10px 30px -18px rgba(4, 27, 71, .45);
}
/* A barra de contatos recolhe ao rolar: o cabeçalho fica mais leve. */
.ads-barra-topo { max-height: 70px; overflow: hidden; transition: max-height .28s ease, opacity .2s ease; }
.ads-rolou .ads-barra-topo { max-height: 0; opacity: 0; }
.ads-barra-topo__lista .elementor-icon-list-item { align-items: center; }
.ads-menu .menu-item a { transition: color .2s ease; }
.ads-abre-menu .elementor-icon { border-color: var(--ads-linha) !important; }
.ads-abre-menu .elementor-icon:hover { border-color: var(--ads-apoio) !important; background: var(--ads-gelo); }

/* ---------- menu lateral (gaveta) ---------- */
.ads-gaveta {
	position: fixed !important; top: 0; right: 0; bottom: 0;
	width: min(420px, 88vw); max-width: 100vw;
	overflow-y: auto; overscroll-behavior: contain;
	flex-wrap: nowrap !important; align-content: flex-start; justify-content: flex-start;
	transform: translateX(102%);
	transition: transform .34s cubic-bezier(.4, 0, .2, 1);
	z-index: 9999;
	box-shadow: -18px 0 50px rgba(2, 12, 33, .28);
}
.ads-menu-aberto .ads-gaveta { transform: translateX(0); }
.ads-gaveta-veu {
	position: fixed; inset: 0; background: rgba(3, 14, 36, .55);
	opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s ease; z-index: 9998;
	backdrop-filter: blur(2px);
}
.ads-menu-aberto .ads-gaveta-veu { opacity: 1; visibility: visible; }
.ads-menu-aberto { overflow: hidden; }
.ads-gaveta__nav .menu-item a { padding-left: 0 !important; padding-right: 0 !important; }
.ads-gaveta__nav .sub-menu { padding-left: 14px; }
.ads-gaveta__nav .sub-menu a { font-size: 15px !important; opacity: .85; }
.ads-gaveta__fechar .elementor-icon { border-color: rgba(255, 255, 255, .35) !important; }
.ads-gaveta__fechar .elementor-icon:hover { border-color: #fff !important; }

/* ---------- itens (o que era cartão) ---------- */
/* Quem separa os itens é o espaço e a régua de cima, não um fio a toda a volta.
   No hover nada se move: muda a cor do título e a régua escurece. */
.ads-item, .ads-servico, .ads-servico-bloco, .ads-frente, .ads-etapa, .ads-relacionada {
	transition: border-color .2s ease;
}
a.ads-item, a.ads-servico, a.ads-frente, a.ads-relacionada { text-decoration: none; }
a.ads-item:hover, a.ads-servico:hover, a.ads-frente:hover, a.ads-relacionada:hover,
.ads-servico-bloco:hover {
	border-top-color: var(--ads-apoio) !important;
}
a.ads-item:hover .elementor-heading-title,
a.ads-servico:hover .elementor-heading-title,
a.ads-frente:hover .elementor-heading-title,
a.ads-relacionada:hover .elementor-heading-title {
	color: var(--ads-apoio) !important;
	transition: color .2s ease;
}
.ads-escuro a.ads-item:hover, .ads-item--escuro:hover { border-top-color: var(--ads-ceu) !important; }
.ads-frente .elementor-widget-image img { display: block; }
.ads-mais p { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.ads-mais p::after { content: "→"; }

/* ---------- listas ---------- */
.ads-check .elementor-icon-list-item { align-items: flex-start; }
.ads-check .elementor-icon-list-icon { margin-top: .28em; }
.ads-canais .elementor-icon-list-item { align-items: flex-start; }
.ads-canais .elementor-icon-list-icon { margin-top: .22em; }
.ads-canais a { text-decoration: none; }
.ads-passos-contato .elementor-icon-list-item { align-items: flex-start; }

/* ---------- linha do tempo ---------- */
.ads-tempo__item:last-child > .e-con-inner, .ads-tempo__item:last-child { border-bottom: 0 !important; }
.ads-tempo__item p { margin-bottom: 0; }
.ads-tempo__item .elementor-widget-text-editor + .elementor-widget-text-editor { margin-top: 6px; }

/* ---------- FAQ ---------- */
.ads-faq .e-n-accordion-item { border-bottom: 1px solid var(--ads-linha); }
.ads-faq summary { cursor: pointer; }
.ads-faq .e-n-accordion-item-title { transition: color .2s ease; }

/* ---------- destaque de resposta ---------- */
.ads-resposta { }
.ads-dor-bloco p { border-left: 2px solid var(--ads-ceu); padding-left: 16px; }

/* ---------- texto legal ---------- */
.ads-texto-legal h2 { font-size: 21px; margin: 34px 0 12px; }
.ads-texto-legal h2:first-child { margin-top: 0; }
.ads-texto-legal p { margin-bottom: 14px; }

/* ---------- formulário ---------- */
.ads-form {
	--adsf-campo: #FFFFFF;
	--adsf-linha: #C9D4E6;
	--adsf-texto: #2A3446;
	--adsf-rot: #5C6A80;
	--adsf-botao: #041B47;
	--adsf-botao-txt: #FFFFFF;
}
.ads-form--escuro {
	--adsf-campo: rgba(255,255,255,.06);
	--adsf-linha: rgba(255,255,255,.28);
	--adsf-texto: #FFFFFF;
	--adsf-rot: #9CBFE6;
	--adsf-botao: #FFFFFF;
	--adsf-botao-txt: #041B47;
}
.ads-form__corpo { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px; }
.ads-form__campo--largo, .ads-form__consent, .ads-form__base, .ads-form__erro { grid-column: 1 / -1; }
.ads-form__campo { position: relative; margin: 0; }
.ads-form input:not([type="checkbox"]), .ads-form select, .ads-form textarea {
	width: 100%; background: var(--adsf-campo); color: var(--adsf-texto);
	border: 1px solid var(--adsf-linha); border-radius: 2px;
	padding: 22px 14px 9px; font: inherit; font-size: 15px; line-height: 1.4;
	transition: border-color .2s ease, box-shadow .2s ease;
	appearance: none;
}
.ads-form textarea { padding-top: 24px; resize: vertical; min-height: 118px; }
.ads-form select { cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235C6A80' stroke-width='1.4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px; }
.ads-form--escuro select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%239CBFE6' stroke-width='1.4'/%3E%3C/svg%3E"); }
.ads-form select.is-vazio { color: transparent; }
.ads-form input:not([type="checkbox"]):focus, .ads-form select:focus, .ads-form textarea:focus {
	outline: none; border-color: var(--ads-apoio); box-shadow: 0 0 0 3px rgba(46, 91, 140, .16);
}
.ads-form__rot {
	position: absolute; left: 14px; top: 15px; color: var(--adsf-rot);
	font-size: 15px; pointer-events: none; transition: all .16s ease; max-width: calc(100% - 46px);
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ads-form input:focus + .ads-form__rot,
.ads-form input:not(:placeholder-shown) + .ads-form__rot,
.ads-form textarea:focus + .ads-form__rot,
.ads-form textarea:not(:placeholder-shown) + .ads-form__rot,
.ads-form select:focus + .ads-form__rot,
.ads-form select:not(.is-vazio) + .ads-form__rot {
	top: 6px; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; opacity: .9;
}
.ads-form__campo.is-erro input, .ads-form__campo.is-erro select, .ads-form__campo.is-erro textarea { border-color: #C0392B; }
.ads-form__consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.6; color: var(--adsf-rot); }
.ads-form__consent input[type="checkbox"] { width: 18px; height: 18px; min-width: 18px; margin-top: 1px; padding: 0; flex: none; appearance: auto; accent-color: var(--ads-apoio); border-radius: 0; }
.ads-form__consent.is-erro span { color: #C0392B; }
.ads-form__consent a { color: inherit; }
.ads-form__isca { position: absolute; left: -9999px; }
.ads-form__erro { color: #C0392B; font-size: 14px; margin: 0; }
.ads-form__base { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.ads-form__enviar {
	background: var(--adsf-botao); color: var(--adsf-botao-txt); border: 0; border-radius: 3px;
	padding: 16px 32px; font: inherit; font-size: 14px; font-weight: 600;
	cursor: pointer; transition: opacity .2s ease;
}
.ads-form__enviar:hover { opacity: .88; }
.ads-form.is-enviando .ads-form__enviar { opacity: .6; pointer-events: none; }
.ads-form__sigilo { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--adsf-rot); flex: 1 1 220px; }
.ads-form__ok { padding: 30px 0; }
.ads-form__ok-t { font-size: 22px; font-weight: 600; color: var(--adsf-texto); margin: 0 0 10px; }
.ads-form__ok-x { color: var(--adsf-rot); margin: 0 0 20px; }
.ads-form__wa {
	display: inline-block; background: var(--adsf-botao); color: var(--adsf-botao-txt);
	padding: 14px 26px; border-radius: 3px; text-decoration: none;
	font-size: 14px; font-weight: 600;
}
@media (max-width: 767px) {
	.ads-form__corpo { grid-template-columns: 1fr; }
	.ads-form__enviar { width: 100%; }
}

/* ---------- WhatsApp flutuante ---------- */
.ads-wa {
	position: fixed; right: 20px; bottom: 20px; z-index: 9990;
	display: inline-flex; align-items: center; gap: 10px;
	background: #128C7E; color: #fff; text-decoration: none;
	padding: 13px 20px 13px 17px; border-radius: 40px;
	box-shadow: 0 10px 28px rgba(4, 27, 71, .26);
	font-size: 14px; font-weight: 600;
	transition: background-color .2s ease;
}
/* A cor de link do Kit (.elementor-kit-N a) vence uma classe sozinha: sem o
   !important o ícone sai azul-marinho sobre o verde e some. */
.ads-wa, .ads-wa:hover, .ads-wa:focus, .ads-wa span { color: #FFFFFF !important; }
.ads-wa:hover { background: #0F7A6C; }
.ads-wa svg { width: 22px; height: 22px; fill: #FFFFFF; }
@media (max-width: 767px) {
	.ads-wa { padding: 14px; right: 16px; bottom: 16px; }
	.ads-wa span { display: none; }
}

/* ---------- aviso de cookies ---------- */
/* O «display: flex» abaixo vencia o atributo hidden: a faixa aparecia sempre
   e o «Entendi» não a fechava. O hidden manda. */
.ads-cookies[hidden] { display: none !important; }
.ads-cookies {
	position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 9995;
	max-width: 620px; margin: 0 auto;
	display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
	background: #fff; color: var(--ads-texto);
	border: 1px solid var(--ads-linha); border-radius: 2px;
	padding: 16px 20px; box-shadow: 0 14px 40px rgba(4, 27, 71, .16);
}
.ads-cookies p { margin: 0; font-size: 13px; line-height: 1.6; flex: 1 1 280px; }
.ads-cookies a { color: var(--ads-apoio); }
.ads-cookies button {
	background: var(--ads-marinho); color: #fff; border: 0; border-radius: 3px;
	padding: 11px 22px; font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer;
}
@media (max-width: 767px) {
	.ads-com-cookies .ads-wa { bottom: 112px; }
}

/* ---------- crédito do rodapé ---------- */
.ads-credito a { display: inline-flex; align-items: center; gap: 8px; color: inherit; text-decoration: none; opacity: .75; transition: opacity .2s ease; }
.ads-credito a:hover { opacity: 1; }
.ads-credito img { height: 18px; width: auto; display: inline-block; vertical-align: middle; filter: brightness(0) invert(1); opacity: .9; }

/* ---------- acessibilidade e foco ---------- */
.ads-site a:focus-visible, .ads-site button:focus-visible, .ads-form input:focus-visible {
	outline: 2px solid var(--ads-apoio); outline-offset: 3px;
}
.ads-escuro a:focus-visible, .ads-escuro button:focus-visible { outline-color: var(--ads-ceu); }

@media (prefers-reduced-motion: reduce) {
	.ads-site *, .ads-gaveta, .ads-gaveta-veu { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* ---------- ajustes de leitura no celular ---------- */
@media (max-width: 767px) {
	.ads-rodape .elementor-icon-list-item { font-size: 14px; }
	.ads-heroi .ads-numeros { gap: 22px 18px; }
}

/* ---------- herói: o corte diagonal do manual da marca ---------- */
/* No brandboard o bloco azul e a foto se encontram numa diagonal; é isso que
   dá a cara da ADS Borges ao topo, em vez de um véu chapado. */
/* O véu do herói é o ::before do próprio container (é assim que o Elementor 4
   desenha o «overlay»): recortá-lo na diagonal revela a foto do lado direito.
   Apagar esse pseudo-elemento apagaria o véu inteiro — no telemóvel ele volta
   a cobrir tudo, senão o texto branco cai sobre a parte clara da foto. */
.ads-heroi { position: relative; overflow: hidden; }
/* A foto encosta na base, mas subindo o tanto da faixa de números: assim o
   caminhão fica visível acima dela, e não escondido atrás. */
@media (min-width: 1025px) {
	.ads-heroi { background-position: center calc(100% - 165px) !important; }
}
/* Degradê em diagonal: o azul da marca abre para a foto, sem corte seco. */
.ads-heroi::before {
	background-image: linear-gradient(112deg,
		#041B47 0%,
		#041B47 38%,
		rgba(4, 27, 71, .88) 52%,
		rgba(4, 27, 71, .55) 68%,
		rgba(4, 27, 71, .18) 88%,
		rgba(4, 27, 71, .06) 100%) !important;
	opacity: 1 !important;
}
.ads-heroi > .e-con-inner, .ads-heroi > .elementor-widget, .ads-heroi > .e-con { position: relative; z-index: 1; }
/* A faixa de números fecha o herói de ponta a ponta: resolve o contraste sobre
   a parte clara da foto e dá base à diagonal. */
.ads-faixa-numeros {
	margin-left: calc(-50vw + 50%) !important;
	margin-right: calc(-50vw + 50%) !important;
	padding-left: calc(50vw - 50%) !important;
	padding-right: calc(50vw - 50%) !important;
	width: 100vw; max-width: 100vw;
	box-sizing: border-box;
}

/* ---------- herói: no tablet e no celular a foto cede lugar ao texto ---------- */
/* No celular e no tablet a foto continua no fundo, presa à base: o degradê
   cobre a área do texto e abre embaixo, onde a foto aparece inteira. */
@media (max-width: 1024px) {
	/* «contain» encaixa a foto inteira na faixa de baixo: o caminhão aparece,
	   em vez de um pedaço de chão ampliado pelo «cover». */
	.ads-heroi {
		background-position: center bottom !important;
		background-size: contain !important;
		background-repeat: no-repeat !important;
		padding-bottom: 430px !important;
	}
	.ads-heroi::before {
		clip-path: none;
		background-image: linear-gradient(180deg,
			#041B47 0%,
			#041B47 46%,
			rgba(4, 27, 71, .94) 62%,
			rgba(4, 27, 71, .62) 78%,
			rgba(4, 27, 71, .18) 100%) !important;
		opacity: 1 !important;
	}
	.ads-faixa-numeros { background: #041B47 !important; }
}
@media (max-width: 767px) {
	.ads-heroi { padding-bottom: 225px !important; }
}

/* ---------- página 404 ---------- */
.ads-404 { padding: 110px 20px 120px; background: #fff; }
.ads-404__caixa { max-width: 760px; margin: 0 auto; }
.ads-404__rotulo {
	display: flex; align-items: center; gap: 12px; margin: 0 0 18px;
	font-size: 11.5px; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; color: var(--ads-apoio);
}
.ads-404__rotulo::before { content: ""; width: 26px; height: 2px; background: currentColor; }
.ads-404__titulo { font-size: clamp(28px, 4vw, 44px); line-height: 1.15; letter-spacing: -.03em; color: var(--ads-marinho); margin: 0 0 18px; }
.ads-404__texto { color: var(--ads-suave); font-size: 17px; line-height: 1.7; margin: 0 0 34px; max-width: 620px; }
.ads-404__links { display: flex; flex-wrap: wrap; gap: 10px 26px; padding: 24px 0; border-top: 1px solid var(--ads-linha); border-bottom: 1px solid var(--ads-linha); }
.ads-404 .ads-404__links a { color: var(--ads-marinho); text-decoration: none; font-weight: 500; }
.ads-404 .ads-404__links a:hover { color: var(--ads-apoio); }
.ads-404__botoes { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.ads-404 a.ads-404__btn {
	display: inline-block; background: var(--ads-marinho); color: #fff; text-decoration: none;
	padding: 17px 32px; border: 1px solid var(--ads-marinho); border-radius: 2px;
	font-size: 14px; font-weight: 600;
	transition: background-color .2s ease, color .2s ease;
}
.ads-404 a.ads-404__btn:hover { background: var(--ads-apoio); border-color: var(--ads-apoio); color: #fff; }
.ads-404 a.ads-404__btn--linha { background: transparent; color: var(--ads-marinho); }
.ads-404 a.ads-404__btn--linha:hover { background: var(--ads-marinho); color: #fff; }
@media (max-width: 767px) {
	.ads-404 { padding: 64px 20px 72px; }
	.ads-404__btn { width: 100%; text-align: center; }
}

/* ---------- seta do submenu desenhada em CSS (sem fonte de ícones) ---------- */
.ads-menu .sub-arrow i, .ads-menu .hfe-menu-toggle i { display: none; }
.ads-menu .sub-arrow, .ads-menu .hfe-menu-toggle {
	display: inline-flex; align-items: center; justify-content: center;
	width: 18px; height: 18px; margin-left: 4px;
}
.ads-menu .sub-arrow::after, .ads-menu .hfe-menu-toggle::after {
	content: ""; width: 7px; height: 7px; margin-top: -3px;
	border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor;
	transform: rotate(45deg); transition: transform .2s ease;
}
.ads-menu .menu-item-has-children:hover > a .sub-arrow::after { transform: rotate(225deg); margin-top: 2px; }
.ads-gaveta__nav .sub-arrow::after { width: 8px; height: 8px; }

/* ---------- área de toque: links de lista e de «ver mais» ---------- */
.ads-canais .elementor-icon-list-item > a,
.ads-rodape .elementor-icon-list-item > a {
	padding: 5px 0;
}
.ads-mais-linha p { padding: 4px 0; }
.ads-linha-final a { color: #9CBFE6; text-decoration: underline; text-underline-offset: 3px; }
.ads-linha-final a:hover { color: #fff; }
.ads-texto-legal a { text-underline-offset: 3px; }

/* ---------- itens no celular: régua com respiro, sem apertar ---------- */
@media (max-width: 767px) {
	.ads-item, .ads-servico, .ads-servico-bloco, .ads-relacionada { padding-top: 22px !important; }
	.ads-frente .elementor-widget-image img { height: 200px; object-fit: cover; }
}
@media (max-width: 1024px) {
	.ads-heroi .ads-numeros { gap: 28px 24px; }
}

/* ---------- divisória entre as colunas das grades ---------- */
/* A régua de cima marca o começo do item; a divisória vertical separa as
   colunas. No celular a grade vira uma coluna e só a régua fica. */
@media (min-width: 1025px) {
	.ads-div > .e-con, .ads-div > .elementor-widget { padding-left: 32px !important; padding-right: 32px !important; }
	.ads-div--2 > *:nth-child(2n+1), .ads-div--3 > *:nth-child(3n+1),
	.ads-div--4 > *:nth-child(4n+1), .ads-div--5 > *:nth-child(5n+1) { padding-left: 0 !important; }
	.ads-div--2 > *:nth-child(2n), .ads-div--3 > *:nth-child(3n),
	.ads-div--4 > *:nth-child(4n), .ads-div--5 > *:nth-child(5n) { padding-right: 0 !important; }
	.ads-div--2 > *:not(:nth-child(2n+1)),
	.ads-div--3 > *:not(:nth-child(3n+1)),
	.ads-div--4 > *:not(:nth-child(4n+1)),
	.ads-div--5 > *:not(:nth-child(5n+1)) {
		border-left: 1px solid var(--ads-linha) !important;
	}
	.ads-div--escuro > * { border-left-color: rgba(255, 255, 255, .18) !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
	.ads-div > .e-con, .ads-div > .elementor-widget { padding-left: 28px !important; padding-right: 28px !important; }
	.ads-div > *:nth-child(2n+1) { padding-left: 0 !important; }
	.ads-div > *:nth-child(2n) { padding-right: 0 !important; }
	.ads-div > *:not(:nth-child(2n+1)) { border-left: 1px solid var(--ads-linha) !important; }
	.ads-div--escuro > * { border-left-color: rgba(255, 255, 255, .18) !important; }
}

/* ---------- profundidade: fundos com degradê em vez de cor chapada ---------- */
.ads-site .e-con.e-parent { background-attachment: scroll; }
.ads-fundo-claro { background-image: linear-gradient(180deg, #FFFFFF 0%, #F7F9FC 100%) !important; }
.ads-fundo-gelo { background-image: linear-gradient(180deg, #F3F6FB 0%, #FBFCFE 62%, #FFFFFF 100%) !important; }
.ads-fundo-escuro {
	background-image:
		radial-gradient(120% 90% at 82% 0%, rgba(46, 91, 140, .38) 0%, rgba(4, 27, 71, 0) 58%),
		linear-gradient(170deg, #041B47 0%, #06255A 48%, #041B47 100%) !important;
}

/* ---------- cards: fundo que acende no hover, sem levantar nem sombrear ---------- */
.ads-item, .ads-servico, .ads-servico-bloco, .ads-relacionada {
	transition: border-color .2s ease, background-color .2s ease;
}
a.ads-item:hover, a.ads-servico:hover, a.ads-relacionada:hover, .ads-servico-bloco:hover {
	background-color: rgba(46, 91, 140, .05);
}
.ads-item--escuro:hover, .ads-escuro a.ads-item:hover { background-color: rgba(255, 255, 255, .05); }

/* ---------- soluções: capa com a foto, número e título por cima ---------- */
.ads-frente__capa { overflow: hidden; }
.ads-frente__icone { margin-bottom: auto !important; }
.ads-frente:hover .ads-frente__capa { filter: saturate(1.06); }

/* ==================================================================
   FORMAS DE SEÇÃO
   Cada seção tem um corpo diferente de propósito: grade de cartões em
   todas é o que faz uma página parecer gerada.
   ================================================================== */

/* ---------- lista larga: nome | texto, com régua entre as linhas ---------- */
.ads-lista-larga__linha { transition: background-color .22s ease; }
.ads-lista-larga__linha a,
.ads-lista-larga__linha > .e-con-inner { text-decoration: none; }
a.ads-lista-larga__linha:hover,
.ads-lista-larga__linha:hover { background-color: rgba(46, 91, 140, .045); }
.ads-lista-larga--escuro .ads-lista-larga__linha:hover { background-color: rgba(255, 255, 255, .05); }
.ads-lista-larga__linha .ads-saida { max-width: 62ch; }

/* ---------- índice numerado: número | nome | descrição ---------- */
.ads-indice__linha { transition: background-color .22s ease; }
.ads-indice__linha:hover { background-color: rgba(46, 91, 140, .045); }
.ads-indice__n { flex: 0 0 44px !important; width: 44px !important; }
.ads-indice__titulo { flex: 0 0 30% !important; width: 30% !important; }
.ads-indice__texto { flex: 1 1 auto !important; width: auto !important; }
.ads-indice__linha:hover .ads-indice__titulo .elementor-heading-title { color: var(--e-global-color-secondary); }
@media (max-width: 1024px) {
	.ads-indice__titulo { flex: 0 0 34% !important; width: 34% !important; }
}
@media (max-width: 767px) {
	.ads-indice__n { flex: 0 0 auto !important; width: auto !important; }
	.ads-indice__titulo { flex: 0 0 auto !important; width: auto !important; }
}

/* ---------- marcos: o numeral manda, sem ícone e sem caixa ---------- */
.ads-marco__n .elementor-heading-title { line-height: 1; letter-spacing: -.02em; }

/* ---------- definições: prosa, para dar respiro entre as grades ---------- */
.ads-definicao strong { color: var(--e-global-color-primary); font-weight: 600; }
.ads-escuro .ads-definicao strong { color: #FFFFFF; }

/* ---------- compromissos: título à esquerda, lista à direita ---------- */
.ads-compromisso p { max-width: 42ch; }

/* ---------- o menu do computador nunca quebra linha ----------
   A folga era de 20px: bastava um zoom do sistema ou a fonte ainda por
   carregar para o «Contato» cair para a segunda linha. */
.ads-cabecalho .hfe-nav-menu__layout-horizontal .hfe-nav-menu { flex-wrap: nowrap !important; }
.ads-cabecalho .hfe-nav-menu__layout-horizontal .hfe-menu-item { white-space: nowrap; }

/* ---------- chamada rápida: atalhos de WhatsApp ---------- */
.ads-rapida { border-bottom: 1px solid var(--e-global-color-adslinha); }
.ads-rapida__btn .elementor-button { font-size: 13.5px; }
.ads-rapida__btn .elementor-button-icon svg { width: 15px; height: 15px; }
@media (max-width: 767px) {
	/* No celular os quatro atalhos ficam em grelha 2×2, não em coluna:
	   quatro botões de largura inteira empurravam o conteúdo uma tela para baixo. */
	.ads-rapida__botoes { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px !important; width: 100%; }
	.ads-rapida__botoes > .elementor-widget { width: 100%; max-width: 100%; }
	.ads-rapida__btn .elementor-button { width: 100%; padding: 13px 8px !important; font-size: 13px; justify-content: center; }
	.ads-rapida__btn .elementor-button-content-wrapper { gap: 7px; }
	.ads-rapida__btn .elementor-button-icon svg { width: 14px; height: 14px; }
}

/* ---------- a marca: símbolo em imagem, nome e descrição em texto ---------- */
.ads-marca { text-decoration: none !important; }
.ads-marca__nome .elementor-heading-title { white-space: nowrap; }
.ads-marca__nome strong { font-weight: 700; }
.ads-marca__apoio .elementor-heading-title { display: block; }

/* ---------- opção «selo» (24/09): a marca num bloco azul-marinho ----------
   O bloco ocupa a altura toda do cabeçalho (margens negativas iguais ao
   respiro do cabeçalho) e emenda na barra de contatos, também marinho: a
   marca fica assentada no azul, com uma régua azul-clara na base. */
.ads-cabecalho .ads-marca--selo {
	align-self: stretch !important;
	background: var(--ads-marinho);
	margin: -18px 0 !important;
	padding: 14px 30px 14px 26px !important;
	position: relative;
}
.ads-cabecalho .ads-marca--selo::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
	background: var(--ads-ceu);
}
.ads-marca--selo .ads-marca__apoio .elementor-heading-title { color: var(--ads-ceu) !important; }
/* Dos 1025 aos 1200px o selo inteiro deixa o menu sem espaço (e o scale
   de .ads-marca não devolve largura ao layout): aqui ele encolhe de fato. */
@media (min-width: 1025px) and (max-width: 1200px) {
	.ads-cabecalho .ads-marca--selo { transform: none; padding: 12px 18px 12px 16px !important; gap: 10px !important; }
	.ads-marca--selo .elementor-widget-image { width: 50px !important; }
	.ads-marca--selo .ads-marca__nome .elementor-heading-title { font-size: 19px !important; }
	.ads-marca--selo .ads-marca__apoio .elementor-heading-title { font-size: 8px !important; }
}
@media (max-width: 1024px) {
	.ads-cabecalho .ads-marca--selo { margin: -14px 0 !important; padding: 12px 22px 12px 20px !important; }
}
@media (max-width: 767px) {
	.ads-cabecalho .ads-marca--selo { margin: -12px 0 -12px -20px !important; padding: 10px 16px 10px 20px !important; }
}

/* ---------- ícones de traço sobre azul ----------
   Os ícones são desenhados com currentColor. A cor de ícone do Elementor só
   chega ao `fill` do <svg>, então o traço herdava a cor do link (azul de apoio)
   e sumia no fundo escuro. Aqui diz-se a cor do texto do próprio ícone. */
.ads-barra-topo__lista .elementor-icon-list-icon,
.ads-escuro .ads-canais .elementor-icon-list-icon { color: #FFFFFF; }

/* ---------- cabeçalho estreito: entre o tablet e o desktop largo ----------
   Dos 1025px aos 1200px o menu de seis itens mais o botão não cabem ao lado
   do logotipo e o «Contato» caía para uma segunda linha. */
@media (min-width: 1025px) and (max-width: 1200px) {
	.ads-cabecalho .ads-marca { transform: scale(.9); transform-origin: left center; }
	.ads-cabecalho .hfe-nav-menu a.hfe-menu-item { padding-left: 9px !important; padding-right: 9px !important; }
	.ads-cabecalho .ads-btn--topo .elementor-button { padding-left: 18px !important; padding-right: 18px !important; }
}

/* ---------- bloco de largura fixa com conteúdo centrado ----------
   O Elementor fixa a largura mas não centra a caixa: sem isto o texto
   fica centrado dentro de um bloco encostado à esquerda da seção. */
.ads-centrada { margin-left: auto !important; margin-right: auto !important; }

/* ---------- fecho: o rodapé se separa da chamada final ---------- */
.ads-rodape { border-top: 1px solid rgba(255, 255, 255, .14); }
.ads-cta { position: relative; }

/* ---------- ícones: um pouco mais de presença nas capas escuras ---------- */
.ads-frente__capa .elementor-icon { opacity: .92; }

/* ==================================================================
   MOVIMENTO — continuidade e resposta ao mouse (rodada 9, 23/09)
   O site estava parado: nada respondia ao mouse e as seções entravam
   secas. Regra: nada levanta nem ganha sombra (isso é template). O que
   se mexe é o conteúdo — a régua que corre, a linha que se abre, a foto
   que aparece por trás de uma cortina, o número que conta.
   A classe .ads-js é posta no <html> antes da primeira pintura (script
   no <head>); sem JS, no editor ou com «reduzir movimento» nada fica
   escondido e nada se mexe.
   ================================================================== */
:root { --ads-ease: cubic-bezier(.22, .61, .36, 1); }

/* ---------- entrada por rolagem ---------- */
/* O JS dá .ads-rev a cada bloco e .is-in quando ele entra na tela. Irmãos
   que entram juntos recebem --ads-atraso em cascata. Depois da entrada o
   JS tira as classes, para o hover voltar a ter as transições normais. */
.ads-js .ads-rev {
	opacity: 0; transform: translate3d(0, 22px, 0);
	transition: opacity .7s var(--ads-ease), transform .7s var(--ads-ease);
	transition-delay: var(--ads-atraso, 0s);
}
.ads-js .ads-rev.is-in { opacity: 1; transform: none; }
/* cortina: a foto aparece da esquerda para a direita, em vez de subir */
.ads-js .ads-rev--cortina {
	clip-path: inset(0 100% 0 0);
	transition: clip-path 1s var(--ads-ease);
	transition-delay: var(--ads-atraso, 0s);
}
.ads-js .ads-rev--cortina.is-in { clip-path: inset(0 0 0 0); }
/* a régua corre: um traço azul percorre a linha de cima quando ela entra e
   depois se apaga, deixando a régua cinza de sempre */
.ads-js .ads-rev--traco::after {
	content: ""; position: absolute; left: 0; right: 0;
	top: calc(-1 * var(--ads-regua, 1px)); height: 2px;
	background: var(--ads-apoio); opacity: 0;
	transform: scaleX(0); transform-origin: left center; pointer-events: none;
}
.ads-marco, .ads-item, .ads-servico-bloco, .ads-relacionada { --ads-regua: 2px; }
.ads-escuro .ads-rev--traco::after, .ads-item--escuro.ads-rev--traco::after { background: var(--ads-ceu); }
.ads-js .ads-rev--traco.is-in::after { animation: ads-traco 1.5s var(--ads-ease) both; animation-delay: var(--ads-atraso, 0s); }
@keyframes ads-traco {
	0% { transform: scaleX(0); opacity: 1; }
	55% { transform: scaleX(1); opacity: 1; }
	100% { transform: scaleX(1); opacity: 0; }
}
/* rede de segurança: sem observador, ou passados 6 s, tudo aparece */
.ads-rev-tudo .ads-rev, .ads-rev-tudo .ads-rev--cortina { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
.ads-rev-tudo .ads-rev--traco::after { animation: none !important; }
@media print {
	.ads-rev, .ads-rev--cortina { opacity: 1 !important; transform: none !important; clip-path: none !important; }
}

/* ---------- herói e capas internas: o texto entra em cascata ---------- */
/* Aqui é CSS puro (sem esperar o JS), porque está na primeira tela. */
@keyframes ads-entra {
	from { opacity: 0; transform: translate3d(0, 26px, 0); }
	to { opacity: 1; transform: none; }
}
.ads-js :is(.ads-heroi, .ads-capa) .elementor-widget { animation: ads-entra .85s var(--ads-ease) both; }
.ads-js :is(.ads-heroi, .ads-capa) .ads-migalha { animation-delay: 0s; }
.ads-js :is(.ads-heroi, .ads-capa) .ads-rotulo { animation-delay: .06s; }
.ads-js :is(.ads-heroi, .ads-capa) .elementor-widget-heading:not(.ads-rotulo) { animation-delay: .16s; }
.ads-js :is(.ads-heroi, .ads-capa) .elementor-widget-text-editor:not(.ads-migalha) { animation-delay: .28s; }
.ads-js :is(.ads-heroi, .ads-capa) .elementor-widget-button { animation-delay: .4s; }
.ads-js :is(.ads-heroi, .ads-capa) .elementor-widget-button + .elementor-widget-button { animation-delay: .48s; }
.ads-js .ads-heroi .ads-numeros > .e-con > .elementor-widget { animation-delay: .58s; }
.ads-js .ads-heroi .ads-numeros > .e-con:nth-child(2) > .elementor-widget { animation-delay: .68s; }
.ads-js .ads-heroi .ads-numeros > .e-con:nth-child(3) > .elementor-widget { animation-delay: .78s; }
.ads-js .ads-heroi .ads-numeros > .e-con:nth-child(4) > .elementor-widget { animation-delay: .88s; }
.ads-rev-tudo :is(.ads-heroi, .ads-capa) .elementor-widget { animation: none !important; }

/* ---------- linha de progresso: quanto da página já foi lido ---------- */
/* Fica na base do cabeçalho fixo e só aparece depois de rolar. */
.ads-progresso {
	position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; z-index: 3;
	background: var(--ads-apoio); pointer-events: none;
	transform: scaleX(var(--ads-lido, 0)); transform-origin: left center;
	opacity: 0; transition: opacity .3s ease;
}
.ads-rolou .ads-progresso { opacity: 1; }

/* ---------- botões: a cor do hover entra da esquerda, numa varredura ---------- */
/* O fundo do próprio botão fica parado no hover; quem traz a cor nova é o
   ::before, que desliza por baixo do texto. */
@media (hover: hover) {
	.ads-site .ads-btn:not(.ads-btn--link) .elementor-button { position: relative; overflow: hidden; isolation: isolate; }
	.ads-site .ads-btn:not(.ads-btn--link) .elementor-button::before {
		content: ""; position: absolute; inset: 0; z-index: -1;
		transform: translate3d(-101%, 0, 0); transition: transform .45s var(--ads-ease);
	}
	.ads-site .ads-btn:not(.ads-btn--link) .elementor-button:hover::before,
	.ads-site .ads-btn:not(.ads-btn--link) .elementor-button:focus-visible::before { transform: none; }
	.ads-site .ads-btn .elementor-button-content-wrapper { position: relative; z-index: 1; }
	.ads-site .ads-btn--cheio .elementor-button:hover { background-color: var(--ads-marinho) !important; }
	.ads-site .ads-btn--cheio .elementor-button::before { background: var(--ads-apoio); }
	.ads-site .ads-btn--apoio .elementor-button:hover { background-color: var(--ads-apoio) !important; }
	.ads-site .ads-btn--apoio .elementor-button::before { background: var(--ads-marinho); }
	.ads-site .ads-btn--claro .elementor-button:hover { background-color: #FFFFFF !important; }
	.ads-site .ads-btn--claro .elementor-button::before { background: #E3EAF5; }
	.ads-site .ads-btn--contorno .elementor-button:hover { background-color: transparent !important; }
	.ads-site .ads-btn--contorno .elementor-button::before { background: var(--ads-marinho); }
	.ads-site .ads-btn--contornoClaro .elementor-button:hover { background-color: transparent !important; }
	.ads-site .ads-btn--contornoClaro .elementor-button::before { background: #FFFFFF; }
}
/* link com seta: a seta avança */
.ads-btn--link .elementor-button-icon { transition: transform .3s var(--ads-ease); }
.ads-btn--link .elementor-button:hover .elementor-button-icon { transform: translateX(5px); }

/* ---------- linhas e cartões: respondem ao mouse sem levantar ---------- */
@media (hover: hover) {
	/* desafios: «O que sai» fica recolhido e abre quando a linha recebe o mouse
	   (ou o foco do teclado). No toque fica sempre aberto. */
	.ads-js .ads-lista-larga__linha .ads-saida {
		display: grid; grid-template-rows: 0fr; opacity: 0;
		transition: grid-template-rows .5s var(--ads-ease), opacity .35s ease;
	}
	.ads-js .ads-lista-larga__linha .ads-saida > * { min-height: 0; overflow: hidden; }
	.ads-js .ads-lista-larga__linha:hover .ads-saida,
	.ads-js .ads-lista-larga__linha:focus .ads-saida,
	.ads-js .ads-lista-larga__linha:focus-within .ads-saida { grid-template-rows: 1fr; opacity: 1; }

	/* índice de serviços: a seta aparece depois do nome */
	.ads-indice__titulo .elementor-heading-title::after {
		content: "→"; display: inline-block; margin-left: 8px; color: var(--ads-apoio);
		opacity: 0; transform: translateX(-6px);
		transition: opacity .3s ease, transform .35s var(--ads-ease);
	}
	.ads-indice__linha:hover .ads-indice__titulo .elementor-heading-title::after { opacity: 1; transform: none; }

	/* soluções: a foto abre por trás do véu e a seta avança */
	.ads-frente__capa { isolation: isolate; }
	.ads-frente__foto {
		position: absolute; inset: 0; z-index: -2; display: block;
		background-size: cover; background-repeat: no-repeat;
		transform: scale(1.001); transition: transform 1.2s var(--ads-ease);
	}
	.ads-frente:hover .ads-frente__foto { transform: scale(1.06); }
	.ads-frente:hover .ads-frente__capa { --overlay-opacity: .8; }
	/* o título da capa fica branco: a regra dos cartões pintava-o de azul de apoio sobre a foto */
	a.ads-frente:hover .ads-frente__capa .elementor-heading-title { color: #FFFFFF !important; }
	.ads-frente .ads-mais p::after { display: inline-block; transition: transform .3s var(--ads-ease); }
	.ads-frente:hover .ads-mais p::after { transform: translateX(5px); }

	/* método e compromissos: a régua e o numeral acendem */
	.ads-marco, .ads-compromisso { transition: border-color .35s ease; }
	.ads-marco:hover, .ads-compromisso:hover { border-top-color: var(--ads-ceu) !important; }
	.ads-marco .ads-marco__n .elementor-heading-title { transition: color .35s ease; }
	.ads-marco:hover .ads-marco__n .elementor-heading-title { color: #FFFFFF; }
	.ads-compromisso h3.elementor-heading-title { transition: color .3s ease; }
	.ads-compromisso:hover h3.elementor-heading-title { color: var(--ads-ceu); }

	/* perguntas: o título responde ao mouse */
	.ads-faq .e-n-accordion-item-title:hover { color: var(--ads-apoio); }

	/* faixas escuras: um brilho discreto acompanha o mouse */
	.ads-luz > .e-con-inner { position: relative; z-index: 1; }
	.ads-luz::after {
		content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
		background: radial-gradient(560px circle at var(--ads-x, 50%) var(--ads-y, 50%), rgba(156, 191, 230, .16), rgba(156, 191, 230, 0) 62%);
		opacity: 0; transition: opacity .6s ease;
	}
	.ads-luz:hover::after { opacity: 1; }
}

/* ---------- fotos: leve deslocamento ao rolar ---------- */
.ads-foto-coluna, .ads-linha-foto { overflow: hidden; }
.ads-js .ads-paralaxe { transform: translate3d(0, var(--ads-py, 0px), 0) scale(1.08); will-change: transform; }