/*
 * Insight Signal: estilos do tema (layout aprovado em 25/09/2026).
 *
 * Base no celular (360–430 px), crescendo com min-width nos cortes 621,
 * 901 e 1061 px. Identidade tirada do logo: degradê do azul #4B56FE ao
 * azul-marinho #0C1E3A, com o ciano #00E0FF só sobre fundo escuro. Fonte
 * Archivo, servida pelo próprio site. Elemento próprio: as barras de sinal
 * (1, 2 ou 3 acesas = estágios Presença, Posicionamento e Autoridade).
 */

/* ------------------------------------------------------------- fontes */

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url("../fonts/archivo-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url("../fonts/archivo-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ------------------------------------------------------------- tokens */

:root {
	--marinho: #0c1e3a;
	--marinho-2: #102455;
	--marinho-3: #0a1830;
	--azul: #4b56fe;
	--azul-2: #2a36a8;
	--acao: #3a45e8;
	--ciano: #00e0ff;
	--whats: #15803d;
	--estrela: #e8a317;

	--texto: #0c1e3a;
	--texto-2: #2b3a55;
	--suave: #46536b;
	--fraco: #5b6780;
	--nota: #5d6983;
	--linha: #dce2ec;
	--linha-2: #e6eaf1;
	--fundo: #fff;
	--fundo-alt: #f3f5fb;
	--fundo-caixa: #f6f7fb;
	--claro: #b9c3d6;
	--claro-2: #dce2f5;
	--tinta: #eef0ff;

	--degrade: linear-gradient(145deg, #4b56fe 0%, #2a36a8 50%, #0c1e3a 100%);
	--degrade-cartao: linear-gradient(145deg, #4b56fe 0%, #2a36a8 55%, #1a2a6e 100%);
	--degrade-escuro: linear-gradient(180deg, #0c1e3a 0%, #102455 100%);

	--fonte: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
	--raio: 12px;
	--raio-p: 6px;
	--sombra: 0 24px 60px rgba(4, 10, 40, .45);
	--foco: 0 0 0 3px #fff, 0 0 0 6px var(--acao);

	--topo: 72px;
	--topo-rolou: 64px;
	--barra: 72px;
	--respiro: clamp(56px, 8vw, 120px);
	--margem: clamp(16px, 5.5vw, 80px);
}

/* --------------------------------------------------------------- base */

*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--topo-rolou) + 16px);
}

body {
	margin: 0;
	padding-bottom: calc(var(--barra) + env(safe-area-inset-bottom));
	background: var(--fundo);
	color: var(--texto);
	font-family: var(--fonte);
	font-size: 17px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
img, svg, video { display: block; max-width: 100%; height: auto; }
a { color: var(--acao); text-underline-offset: .2em; }
a:hover { color: var(--marinho); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }

:focus-visible { outline: 3px solid var(--acao); outline-offset: 3px; border-radius: 4px; }
.secao--escura :focus-visible,
.hero :focus-visible,
.topo :focus-visible,
.nav :focus-visible,
.pagina-topo :focus-visible,
.final :focus-visible,
.rodape :focus-visible { outline-color: var(--ciano); }

h1, h2, h3 { font-weight: 900; letter-spacing: -.03em; line-height: 1.04; text-wrap: balance; }
h2 { font-size: clamp(30px, 4.4vw, 60px); }
h3 { font-size: 22px; letter-spacing: -.015em; line-height: 1.2; font-weight: 800; }

.so-leitor {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap;
}

.pular {
	position: absolute; left: 12px; top: -60px; z-index: 100;
	padding: 12px 18px; border-radius: var(--raio-p);
	background: #fff; color: var(--marinho); font-weight: 700;
}
.pular:focus { top: 12px; }

.envelope { width: 100%; max-width: 1440px; margin-inline: auto; padding-inline: var(--margem); }
.envelope--texto { max-width: calc(760px + 2 * var(--margem)); }

.icone { width: 20px; height: 20px; flex-shrink: 0; }

/* barras de sinal */
.barras { width: 22px; height: 18px; flex-shrink: 0; }
.barras rect { fill: currentColor; opacity: .22; }
.barras rect.aceso { opacity: 1; }

/* ------------------------------------------------------------ botões */

.botao {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	min-height: 52px; padding: 0 24px;
	border: 1.5px solid transparent; border-radius: var(--raio-p);
	font-size: 16px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none;
	transition: background-color .2s, color .2s, border-color .2s;
}
.botao .icone { width: 18px; height: 18px; transition: transform .2s; }
.botao:hover .icone:last-child:not(:first-child) { transform: translateX(3px); }
.botao--grande { min-height: 58px; padding: 0 28px; font-size: 17px; }
.botao--pequeno { min-height: 46px; padding: 0 18px; font-size: 15px; }
.botao--largo { display: flex; width: 100%; }

.botao--ciano { background: var(--ciano); color: var(--marinho); font-weight: 800; }
.botao--ciano:hover { background: #5ceaff; color: var(--marinho); }
.botao--acao { background: var(--acao); color: #fff; }
.botao--acao:hover { background: #2a34c9; color: #fff; }
.botao--branco { background: #fff; color: var(--marinho); font-weight: 800; }
.botao--branco:hover { background: var(--tinta); color: var(--marinho); }
.botao--escuro { background: var(--marinho); color: #fff; }
.botao--escuro:hover { background: var(--acao); color: #fff; }
.botao--contorno { border-color: var(--marinho); color: var(--marinho); background: transparent; }
.botao--contorno:hover { background: var(--marinho); color: #fff; }
.botao--contorno-claro { border-color: rgba(255, 255, 255, .55); color: #fff; background: transparent; }
.botao--contorno-claro:hover { background: #fff; border-color: #fff; color: var(--marinho); }
.botao--whats { background: var(--whats); color: #fff; }
.botao--whats:hover { background: #106430; color: #fff; }

.botao-icone {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 44px; height: 44px; border: 1.5px solid var(--marinho); border-radius: var(--raio-p);
	color: var(--marinho);
}
.botao-icone:hover { background: var(--marinho); color: #fff; }
.botao-icone .icone { width: 18px; height: 18px; }

.acoes { display: flex; flex-wrap: wrap; gap: 12px; }
.acoes > .botao { flex: 1 1 100%; }

.so-desktop { display: none !important; }

/* ------------------------------------------------------------ seções */

.secao { padding-block: var(--respiro); }
.secao--alt { background: var(--fundo-alt); }
.secao--escura { background: var(--degrade-escuro); color: #fff; }

.secao__topo { display: grid; gap: 16px; margin-bottom: 32px; }
.secao__lead { font-size: 17px; line-height: 1.55; color: var(--suave); max-width: 60ch; }
.secao--escura .secao__lead { color: var(--claro); }

.rotulo {
	display: flex; align-items: center; gap: 8px;
	margin-bottom: 14px;
	font-size: 15px; font-weight: 700; color: var(--acao);
}
.rotulo .icone { width: 18px; height: 18px; }
.secao--escura .rotulo { color: var(--ciano); }

.etiqueta {
	display: inline-block; padding: 5px 10px; border-radius: 4px;
	background: var(--tinta); color: var(--acao);
	font-size: 13px; font-weight: 700; white-space: nowrap;
}

/* carrossel do celular: rolagem lateral com encaixe; vira grade no desktop */
.rolo {
	display: flex; gap: 12px;
	margin-inline: calc(-1 * var(--margem));
	padding: 4px var(--margem) 8px;
	overflow-x: auto; overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory; scroll-padding-inline: var(--margem);
	scrollbar-width: none;
}
.rolo::-webkit-scrollbar { display: none; }
.rolo > * { position: relative; flex: 0 0 min(300px, 84vw); scroll-snap-align: start; }

.deslize {
	display: flex; align-items: center; gap: 8px; margin-bottom: 14px;
	font-size: 14px; font-weight: 600; color: var(--fraco);
}
.secao--escura .deslize { color: var(--claro-2); }
.deslize .icone { width: 18px; height: 18px; }

/* ------------------------------------------------------------- topo */

.topo {
	position: fixed; inset: 0 0 auto; z-index: 50;
	height: var(--topo);
	color: #fff;
	border-bottom: 1px solid rgba(255, 255, 255, .14);
	transition: height .25s ease, background-color .25s ease, box-shadow .25s ease;
}
.topo.rolou,
.menu-aberto .topo {
	height: var(--topo-rolou);
	background: rgba(12, 30, 58, .97);
	border-bottom-color: transparent;
	box-shadow: 0 10px 30px rgba(4, 10, 40, .28);
}
@supports (backdrop-filter: blur(1px)) {
	.topo.rolou { background: rgba(12, 30, 58, .9); backdrop-filter: blur(12px); }
}

.topo__dentro { height: 100%; display: flex; align-items: center; gap: 16px; }
.marca { display: flex; flex-shrink: 0; margin-right: auto; }
.marca img { width: 88px; height: 44px; object-fit: contain; transition: width .25s, height .25s; }

.topo__fone, .topo__cta { display: none; }

.topo__menu {
	display: inline-flex; align-items: center; justify-content: center;
	width: 48px; height: 48px;
	border: 1px solid rgba(255, 255, 255, .3); border-radius: var(--raio-p);
	background: transparent; color: #fff;
}
.topo__menu .icone { width: 22px; height: 22px; }
.topo__menu .icone--fechar,
.topo__lupa .icone--fechar { display: none; }
.topo__menu[aria-expanded="true"] .icone--abrir,
.topo__lupa[aria-expanded="true"] .icone--abrir { display: none; }
.topo__menu[aria-expanded="true"] .icone--fechar,
.topo__lupa[aria-expanded="true"] .icone--fechar { display: block; }

/* busca: a lupa abre um painel logo abaixo da barra */
.topo__lupa {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 48px; height: 48px; margin-right: -8px;
	border-radius: var(--raio-p); color: #fff;
}
.topo__lupa:hover { color: var(--ciano); }
.topo__lupa .icone { width: 22px; height: 22px; }
.topo__busca {
	position: absolute; inset: 100% 0 auto;
	padding: 16px 0 20px;
	background: var(--marinho);
	border-top: 1px solid #1e3354;
	box-shadow: 0 16px 30px rgba(4, 10, 40, .28);
}
.topo__busca[hidden] { display: none; }
.topo__busca .form-busca { margin: 0; }
.topo__busca .form-busca input { border-color: transparent; }
.busca-aberta .topo { background: rgba(12, 30, 58, .97); }

/* menu do celular: tela cheia abaixo da barra */
.nav {
	position: fixed; inset: var(--topo-rolou) 0 0; z-index: 49;
	display: flex; flex-direction: column; gap: 24px;
	padding: 16px var(--margem) calc(var(--barra) + 24px);
	background: var(--marinho);
	overflow-y: auto;
	visibility: hidden; opacity: 0; transform: translateY(-8px);
	transition: opacity .2s, transform .2s, visibility 0s .2s;
}
.nav.aberto { visibility: visible; opacity: 1; transform: none; transition: opacity .2s, transform .2s; }
.menu-aberto { overflow: hidden; }

.nav__lista > li > a,
.nav__sub-botao {
	display: flex; align-items: center; justify-content: space-between; width: 100%;
	min-height: 58px; padding: 0;
	border: 0; border-bottom: 1px solid #1e3354; background: none;
	color: #fff; font-size: 21px; font-weight: 700; text-decoration: none; text-align: left;
}
.nav__seta { width: 18px; height: 18px; color: var(--ciano); transform: rotate(90deg); transition: transform .2s; }
.nav__sub-botao[aria-expanded="true"] .nav__seta { transform: rotate(-90deg); }
.nav__sub { display: none; padding: 8px 0 12px; }
.nav__sub-botao[aria-expanded="true"] + .nav__sub { display: block; }
.nav__sub a {
	display: flex; align-items: center; gap: 14px;
	min-height: 56px; padding: 6px 0;
	color: #fff; text-decoration: none;
}
.nav__sub a:hover { color: var(--ciano); }
.nav__sub-icone {
	display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
	width: 40px; height: 40px; border-radius: 8px;
	background: rgba(255, 255, 255, .1); color: var(--ciano);
}
.nav__sub strong { display: block; font-size: 17px; }
.nav__sub small { display: block; font-size: 14px; color: var(--claro); }
.nav__cta { margin-top: auto; min-height: 56px; flex-shrink: 0; }

/* --------------------------------------------------------------- hero */

.hero {
	position: relative; overflow: hidden; isolation: isolate;
	padding: calc(var(--topo) + 44px) 0 40px;
	background: var(--marinho); color: #fff;
}
.hero__fundo img {
	position: absolute; inset: 0; z-index: -2;
	width: 100%; height: 100%; object-fit: cover; object-position: 60% 30%;
	transform-origin: 60% 40%;
	/* zoom lento só a partir de 621 px (ver lá): no celular a foto fica
	   parada, a tela "termina" de desenhar antes e o Speed Index cai */
}
.hero::after {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: linear-gradient(170deg, rgba(12, 30, 58, .95) 0%, rgba(20, 36, 110, .9) 60%, rgba(75, 86, 254, .7) 100%);
}
@keyframes zoom-lento {
	from { transform: scale(1); }
	to { transform: scale(1.14) translate(-1.5%, -1%); }
}

.hero__dentro { display: grid; gap: 40px; }
.hero__texto { display: flex; flex-direction: column; gap: 20px; }
.hero__rotulo { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; color: #cfd6ff; }
.hero__rotulo .barras { color: var(--ciano); }
.hero h1 { font-size: clamp(40px, 6.2vw, 80px); line-height: 1.02; }
.hero__lead { font-size: clamp(17px, 1.6vw, 21px); line-height: 1.5; color: var(--claro-2); max-width: 620px; }
.hero .acoes { padding-top: 4px; }

/* card de resultados que gira */
.destaques {
	display: flex; flex-direction: column; gap: 14px;
	padding: 16px 20px 20px; border-radius: 10px;
	background: #fff; color: var(--marinho);
	box-shadow: var(--sombra);
}
.destaques__topo { display: flex; align-items: center; justify-content: space-between; min-height: 44px; }
.destaques__rotulo { font-size: 13px; font-weight: 700; color: var(--acao); }
.destaques__pontos { display: flex; margin-right: -14px; }
.destaques__pontos button {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; margin-left: -14px; padding: 0; border: 0; background: none;
}
.destaques__pontos span { display: block; width: 10px; height: 10px; border-radius: 5px; background: #c9d1de; transition: width .25s, background-color .25s; }
.destaques__pontos [aria-current="true"] span { width: 26px; background: var(--acao); }

.destaque { display: flex; flex-direction: column; gap: 14px; }
.destaque.entrando { animation: entra .45s ease both; }
@keyframes entra { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.destaque__cliente { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 40px; font-size: 13px; color: var(--fraco); }
.destaque__logo { width: auto; max-width: 150px; height: 40px; object-fit: contain; object-position: left; }
.destaque__numero { font-size: clamp(40px, 4vw, 52px); font-weight: 900; letter-spacing: -.03em; line-height: 1; }
.destaque__legenda { font-size: 16px; color: var(--suave); margin-top: -6px; }
.destaque__linhas { border-top: 1px solid var(--linha-2); }
.destaque__linhas div { display: flex; justify-content: space-between; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--linha-2); font-size: 15px; }
.destaque__linhas dt { color: var(--suave); }
.destaque__linhas dd { font-weight: 700; text-align: right; }
.destaque__fonte { font-size: 12px; color: var(--nota); }
.destaques__proximo { align-self: flex-start; }

/* ------------------------------------------------------------ clientes */

.clientes { display: flex; flex-direction: column; gap: 24px; padding: 40px 0; border-bottom: 1px solid var(--linha-2); overflow: hidden; }
.clientes__titulo { padding-inline: var(--margem); font-size: 15px; font-weight: 600; letter-spacing: 0; line-height: 1.4; color: var(--fraco); text-align: center; }

.faixa {
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.faixa__trilho {
	display: flex; align-items: center; gap: 40px;
	width: max-content; padding-right: 40px;
	animation: faixa-esquerda 70s linear infinite;
}
.faixa--direita .faixa__trilho { animation-name: faixa-direita; }
.faixa:hover .faixa__trilho,
.faixa:focus-within .faixa__trilho { animation-play-state: paused; }
@keyframes faixa-esquerda { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes faixa-direita { from { transform: translateX(-50%); } to { transform: translateX(0); } }

.faixa__logo { width: auto; height: 38px; max-width: 124px; object-fit: contain; opacity: .8; }

/* -------------------------------------------------------------- planos */

.planos__lista { align-items: stretch; }
.plano {
	display: flex; flex-direction: column; gap: 16px;
	padding: 24px 20px; border-radius: var(--raio);
	background: #fff; color: var(--marinho);
}
.plano--topo { background: var(--degrade-cartao); color: #fff; border: 1px solid rgba(255, 255, 255, .25); }
.plano__cabeca { display: flex; align-items: center; justify-content: space-between; }
.plano__icone {
	display: inline-flex; align-items: center; justify-content: center;
	width: 48px; height: 48px; border-radius: 10px;
	background: var(--tinta); color: var(--acao);
}
.plano__icone .icone { width: 24px; height: 24px; }
.plano--topo .plano__icone { background: rgba(255, 255, 255, .14); color: #fff; }
.plano__estagio { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--fraco); }
.plano__estagio .barras { color: var(--acao); }
.plano--topo .plano__estagio { color: var(--claro-2); }
.plano--topo .plano__estagio .barras { color: var(--ciano); }
.plano h3 { font-size: clamp(26px, 2.6vw, 36px); font-weight: 900; letter-spacing: -.02em; }
.plano__frase { font-size: 18px; font-weight: 600; color: var(--acao); }
.plano--topo .plano__frase { color: var(--ciano); }
.plano__inclui {
	align-self: flex-start; display: flex; align-items: center; gap: 6px;
	padding: 6px 12px; border-radius: 20px;
	background: var(--tinta); color: var(--acao);
	font-size: 13px; font-weight: 700;
}
.plano__inclui .icone { width: 14px; height: 14px; }
.plano--topo .plano__inclui { background: rgba(255, 255, 255, .16); color: #fff; }
.plano__sinais { padding: 16px; border-radius: 8px; background: var(--fundo-caixa); }
.plano--topo .plano__sinais { background: rgba(255, 255, 255, .1); }
.plano__sinais p, .plano__entregas p { font-size: 14px; font-weight: 700; margin-bottom: 10px; }
.plano__sinais ul { display: grid; gap: 8px; font-size: 15px; line-height: 1.45; color: var(--texto-2); }
.plano--topo .plano__sinais ul { color: #e3e8f8; }
.plano__entregas ul { display: grid; gap: 10px; font-size: 15px; line-height: 1.4; }
.plano__entregas li { display: flex; gap: 10px; }
.plano__entregas .icone { width: 20px; height: 20px; color: var(--acao); }
.plano--topo .plano__entregas .icone { color: var(--ciano); }
.plano__botao { margin-top: auto; }

.planos__frase {
	display: grid; gap: 20px; margin-top: 32px;
	padding: 24px 20px; border-radius: var(--raio);
	background: #fff; color: var(--marinho);
}
.planos__frase p { font-size: clamp(18px, 1.7vw, 22px); line-height: 1.4; font-weight: 600; }

/* --------------------------------------------------------------- cases */

.navegador { overflow: hidden; border-radius: 8px 8px 0 0; background: #fff; box-shadow: 0 -2px 16px rgba(12, 30, 58, .08); }
.navegador__barra { display: flex; align-items: center; gap: 6px; height: 26px; padding: 0 12px; background: var(--fundo-alt); }
.navegador__barra i { width: 8px; height: 8px; border-radius: 50%; background: #c9d1de; }
.navegador__barra span { margin-left: 8px; font-size: 11px; color: var(--nota); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.navegador img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; }

.case { position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--linha); border-radius: var(--raio); background: #fff; }
.case__imagem { padding: 14px 14px 0; background: #eef1f6; }
.case__corpo { display: flex; flex-direction: column; gap: 12px; flex-grow: 1; padding: 20px; }
.case__titulo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.case__titulo h3 { font-size: 18px; }
.case__resultado { display: grid; gap: 6px; }
.case__numero { font-size: clamp(40px, 4.2vw, 56px); font-weight: 900; letter-spacing: -.03em; line-height: 1; }
.case__resultado p:last-child { font-size: 15px; line-height: 1.45; color: var(--suave); }
.case__fonte { font-size: 13px; color: var(--nota); }
.case .botao { align-self: flex-start; margin-top: auto; }
.cases .botao--largo,
.blog .botao--largo { margin-top: 24px; }

/* ------------------------------------------------------------ portfólio */

.projeto { display: flex; flex-direction: column; gap: 12px; }
.projeto .navegador { border: 1px solid var(--linha); border-radius: 10px; box-shadow: none; }
.projeto__rodape { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.projeto h3 { font-size: 17px; }
.projeto__rodape p { font-size: 14px; color: var(--fraco); }
.projeto--chamada {
	justify-content: space-between; gap: 16px;
	padding: 28px 24px; border-radius: 10px;
	background: var(--degrade); color: #fff;
}
.projeto--chamada .barras { width: 32px; height: 26px; color: var(--ciano); }
.projeto--chamada h3 { font-size: 24px; font-weight: 900; }
.projeto--chamada p { font-size: 15px; color: var(--claro-2); }

/* ------------------------------------------------------------ busca e IA */

.ia__grade { display: grid; gap: 32px; }
.ia__texto { display: flex; flex-direction: column; gap: 18px; }
.ia__texto .rotulo { margin-bottom: 0; }
.ia h2 { font-size: clamp(30px, 3.8vw, 52px); }

.conversa { display: flex; flex-direction: column; gap: 14px; padding: 20px; border-radius: 16px; background: var(--degrade); }
.conversa__pergunta {
	align-self: flex-end; max-width: 85%;
	padding: 12px 16px; border-radius: 14px 14px 4px 14px;
	background: #fff; color: var(--marinho); font-size: 15px; line-height: 1.45;
}
.conversa__resposta {
	display: flex; flex-direction: column; gap: 10px; max-width: 94%;
	padding: 16px; border-radius: 14px 14px 14px 4px;
	background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .2);
	color: #fff; font-size: 15px; line-height: 1.5;
}
.conversa__quem { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: #cfd6ff; }
.conversa__quem .icone { width: 16px; height: 16px; }
.conversa__voce { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 8px; background: #fff; color: var(--marinho); font-weight: 800; }
.conversa__voce .barras { color: var(--acao); }
.conversa__resto { color: var(--claro); }
.conversa figcaption { font-size: 12px; color: var(--claro); }
.conversa__tela,
.conversa__mensagens { display: flex; flex-direction: column; gap: 14px; }
.conversa__pensando { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 14px; color: var(--claro-2); }
.conversa__pensando[hidden],
.conversa [hidden] { display: none; }
.conversa__pontos { display: inline-flex; gap: 4px; }
.conversa__pontos i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: pulsar 1.2s ease-in-out infinite; }
.conversa__pontos i:nth-child(2) { animation-delay: .15s; }
.conversa__pontos i:nth-child(3) { animation-delay: .3s; }
.conversa__campo {
	display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 6px 6px 6px 16px;
	border: 1px solid rgba(255, 255, 255, .22); border-radius: 999px; background: rgba(255, 255, 255, .1);
	color: #fff; font-size: 14px;
}
/* com a pergunta longa, o JS rola o campo para o fim do que está sendo digitado */
.conversa__digitado { display: flex; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; }
.conversa__digitado:empty::before { content: attr(data-vazio); color: var(--claro); }
.conversa.digitando .conversa__digitado::after { content: ""; flex: none; width: 2px; height: 1.15em; margin-left: 2px; background: #fff; animation: piscar 1s steps(1) infinite; }
.conversa__enviar { display: grid; flex: none; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(255, 255, 255, .25); color: #fff; transition: background-color .2s, color .2s; }
.conversa__enviar .icone { width: 18px; height: 18px; transform: rotate(-90deg); }
.conversa.digitando .conversa__enviar { background: #fff; color: var(--acao); }
.conversa .entra { animation: surgir .4s ease-out both; }
@keyframes surgir { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes pulsar { 0%, 80%, 100% { opacity: .35; transform: scale(.75); } 40% { opacity: 1; transform: none; } }
@keyframes piscar { 50% { opacity: 0; } }

.ia__rodape { display: flex; flex-direction: column; gap: 18px; margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--linha); }
.ia__rodape > p { font-size: 14px; font-weight: 700; color: var(--fraco); }
.ia__rodape .faixa { margin-inline: calc(-1 * var(--margem)); }
.ia__rodape .faixa__trilho { gap: 36px; padding-right: 36px; animation-duration: 30s; }
.ia__marca { display: flex; align-items: center; gap: 10px; flex-shrink: 0; font-size: 15px; font-weight: 700; color: var(--texto-2); white-space: nowrap; opacity: .85; }
.ia__marca img { width: 24px; height: 24px; }
.ia--pagina { padding-block: 36px; border-bottom: 1px solid var(--linha); }
.ia--pagina .ia__rodape { gap: 20px; margin: 0; padding: 0; border: 0; }
.ia--pagina .ia__rodape > p { text-align: center; letter-spacing: .02em; }

/* -------------------------------------------------------------- método */

/* --------------------------------------------------------------- sobre */

.sobre__grade { display: grid; gap: 40px; }
.sobre__foto { position: relative; margin: 0 16px 16px 0; }
.sobre__foto::before {
	content: ""; position: absolute; inset: 16px -16px -16px 16px;
	border-radius: 14px; background: var(--degrade);
}
.sobre__foto img { position: relative; width: 100%; aspect-ratio: 4 / 5; max-height: 460px; object-fit: cover; object-position: 50% 18%; border-radius: 14px; }
.sobre__texto { display: flex; flex-direction: column; gap: 16px; }
.sobre__texto .rotulo { margin-bottom: 0; }
.sobre h2 { font-size: clamp(38px, 4.4vw, 60px); line-height: 1; }
.sobre__cargo { font-size: 18px; font-weight: 600; }
.sobre__texto > p:not([class]) { font-size: 17px; line-height: 1.65; color: var(--texto-2); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chips li { padding: 7px 14px; border: 1px solid var(--linha); border-radius: 20px; font-size: 14px; font-weight: 600; }
.numeros { padding-top: 20px; border-top: 1px solid var(--linha); }
.numeros ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; font-size: 13px; line-height: 1.35; color: var(--suave); }
.numeros strong { display: block; font-size: clamp(26px, 3vw, 40px); font-weight: 900; letter-spacing: -.02em; color: var(--acao); }
.numeros figcaption { margin-top: 12px; font-size: 12px; color: var(--nota); }

/* --------------------------------------------------------- avaliações */

.depoimento {
	display: flex; flex-direction: column; gap: 16px;
	padding: 24px 20px; border: 1px solid var(--linha); border-radius: var(--raio);
	background: #fff;
}
.depoimento__nota { display: flex; gap: 3px; color: var(--estrela); }
.depoimento__nota .icone { width: 18px; height: 18px; }
.depoimento blockquote { flex-grow: 1; font-size: 16px; line-height: 1.6; }
.depoimento figcaption { display: flex; align-items: center; gap: 12px; font-size: 14px; line-height: 1.35; color: var(--nota); }
.depoimento figcaption strong { display: block; font-size: 15px; color: var(--marinho); }
.depoimento__avatar, .depoimento__foto { width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%; }
.depoimento__avatar { display: inline-flex; align-items: center; justify-content: center; background: var(--marinho); color: #fff; font-weight: 800; font-size: 15px; }
.depoimento__avatar--1 { background: var(--acao); }
.depoimento__avatar--2 { background: var(--azul-2); }
.depoimento__fonte { margin-left: auto; font-size: 13px; font-weight: 600; white-space: nowrap; }

/* carrossel: rolagem lateral com encaixe em todas as larguras; 1 cartão
   no celular (com a ponta do próximo aparecendo), 2 no tablet, 3 no desktop.
   Setas e contador vêm do tema.js. */
.carrossel { --por-vez: 1; --vao: 12px; }
.carrossel__trilho {
	display: flex; gap: var(--vao);
	margin-inline: calc(-1 * var(--margem));
	padding: 4px var(--margem) 8px;
	overflow-x: auto; overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory; scroll-padding-inline: var(--margem); scroll-behavior: smooth;
	scrollbar-width: none;
}
.carrossel__trilho::-webkit-scrollbar { display: none; }
.carrossel__trilho:focus-visible { outline: 3px solid var(--acao); outline-offset: 2px; border-radius: var(--raio); }
.carrossel__trilho > * { flex: 0 0 min(320px, 86%); scroll-snap-align: start; }
.carrossel__controles { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 20px; }
.carrossel__controles[hidden] { display: none; }
.carrossel__seta {
	display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
	border: 1px solid var(--linha); background: #fff; color: var(--marinho); cursor: pointer;
	transition: background .2s, color .2s, border-color .2s, opacity .2s;
}
.carrossel__seta .icone { width: 20px; height: 20px; }
.carrossel__seta:hover:not(:disabled) { background: var(--marinho); border-color: var(--marinho); color: #fff; }
.carrossel__seta:focus-visible { outline: 3px solid var(--acao); outline-offset: 3px; }
.carrossel__seta:disabled { opacity: .35; cursor: default; }
.carrossel__contador { min-width: 9ch; margin: 0; text-align: center; font-size: 14px; font-weight: 600; color: var(--nota); font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------- blog */

.blog__grade { display: grid; gap: 28px; }
.artigo h3 { font-size: 21px; line-height: 1.22; }
.artigo h3 a { color: inherit; text-decoration: none; }
.artigo h3 a:hover { color: var(--acao); }
.artigo { position: relative; }
.artigo--destaque { display: flex; flex-direction: column; gap: 12px; }
.artigo--destaque > p:last-child { font-size: 16px; color: var(--suave); }
.artigo__imagem { display: block; overflow: hidden; border-radius: 10px; background: var(--fundo-alt); }
.artigo__imagem img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .4s; }
.artigo:hover .artigo__imagem img,
.cartao:hover .cartao__imagem img { transform: scale(1.03); }
.artigo__vazio { display: flex; align-items: center; justify-content: center; aspect-ratio: 16 / 9; background: var(--degrade); color: #fff; }
.artigo__vazio .barras { width: 44px; height: 36px; color: var(--ciano); }
.artigo__vazio .icone { width: 30px; height: 30px; }
.artigo__meta { display: flex; flex-wrap: wrap; gap: 10px; font-size: 13px; color: var(--fraco); }
.artigo__meta span { font-weight: 700; color: var(--acao); }
.blog__lista { display: grid; }
.artigo--linha { display: grid; grid-template-columns: 104px 1fr; gap: 14px; padding: 18px 0; border-top: 1px solid var(--linha); }
.artigo--linha .artigo__imagem img,
.artigo--linha .artigo__vazio { aspect-ratio: 13 / 10; }
.artigo--linha h3 { font-size: 16px; line-height: 1.3; }
.artigo--linha .artigo__meta { margin-bottom: 4px; font-size: 12px; }

/* ----------------------------------------------------------------- FAQ */

.faq__grade { display: grid; gap: 28px; }
.faq h2,
.blog h2,
.depoimentos h2 { font-size: clamp(30px, 3.8vw, 52px); }
.faq__nota { margin-top: 16px; font-size: 16px; color: var(--suave); }
.faq__lista { border-top: 2px solid var(--marinho); }
.faq__lista > h2, .faq__lista > h3 { display: none; }
.faq__lista details, .conteudo details { border-bottom: 1px solid var(--linha); }
.faq__lista summary, .conteudo summary {
	display: flex; align-items: center; justify-content: space-between; gap: 16px;
	min-height: 64px; padding: 16px 0;
	font-size: 18px; font-weight: 700; line-height: 1.35; color: var(--marinho);
	list-style: none; cursor: pointer;
}
.faq__lista summary::-webkit-details-marker,
.conteudo summary::-webkit-details-marker { display: none; }
.faq__lista summary::after,
.conteudo summary::after {
	content: ""; flex-shrink: 0; width: 22px; height: 22px;
	background: var(--acao);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform .25s;
}
.faq__lista details[open] summary::after,
.conteudo details[open] summary::after { transform: rotate(45deg); }
.faq__lista details > :not(summary),
.conteudo details > :not(summary) { padding-bottom: 18px; font-size: 16px; line-height: 1.65; color: var(--suave); }

/* ------------------------------------------------------ chamada final */

.final { position: relative; overflow: hidden; isolation: isolate; padding-block: var(--respiro); color: #fff; background: var(--marinho); }
.final__fundo { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.final::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(110deg, rgba(12, 30, 58, .97) 0%, rgba(30, 44, 140, .9) 55%, rgba(75, 86, 254, .7) 100%); }
.final__grade { display: grid; gap: 28px; }
.final__texto { display: flex; flex-direction: column; gap: 16px; }
.final h2 { font-size: clamp(32px, 4.4vw, 60px); line-height: 1.02; }
.final__texto > p { font-size: 17px; line-height: 1.55; color: var(--claro-2); max-width: 580px; }
.final__acoes { display: grid; gap: 12px; }
.aviso-envio { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-radius: 8px; background: rgba(255, 255, 255, .12); font-weight: 600; }
.aviso-envio--ok { background: rgba(26, 158, 75, .25); }

/* -------------------------------------------------------------- rodapé */

.rodape { padding: 48px 0 24px; background: var(--marinho-3); color: #fff; }
.rodape__grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; }
.rodape__marca, .rodape__contato { grid-column: 1 / -1; }
.rodape__marca { display: flex; flex-direction: column; gap: 12px; }
.rodape__marca img { width: 112px; height: 56px; object-fit: contain; object-position: left; }
.rodape__marca p { max-width: 300px; font-size: 15px; line-height: 1.55; color: var(--claro); }
.rodape__titulo { margin-bottom: 4px; font-size: 13px; font-weight: 700; letter-spacing: 0; line-height: 1.3; color: #8c9ab5; }
.rodape__links a { display: flex; align-items: center; gap: 10px; min-height: 44px; color: #fff; text-decoration: none; font-size: 16px; }
.rodape__links a:hover { color: var(--ciano); }
.rodape__links--icone .icone { width: 18px; height: 18px; color: var(--ciano); }
.rodape__coluna { padding-top: 24px; border-top: 1px solid #1e3354; }
.rodape__base { display: flex; flex-direction: column; gap: 6px; margin-top: 32px; padding-top: 20px; border-top: 1px solid #1e3354; font-size: 13px; color: #8c9ab5; }
.rodape__base a { color: var(--claro); }

/* barra de ações rápidas do celular */
.barra-celular {
	position: fixed; inset: auto 0 0; z-index: 48;
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: center;
	height: calc(var(--barra) + env(safe-area-inset-bottom));
	padding: 6px 8px calc(10px + env(safe-area-inset-bottom));
	background: #fff; border-top: 1px solid var(--linha);
	box-shadow: 0 -6px 20px rgba(12, 30, 58, .12);
}
.barra-celular a {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
	height: 56px; color: var(--texto-2); font-size: 12px; font-weight: 700; text-decoration: none;
}
.barra-celular .icone,
.barra-celular .barras { width: 22px; height: 22px; }
.barra-celular .barra-celular__whats { color: var(--whats); }
.barra-celular .barra-celular__principal { margin-inline: 2px; border-radius: 10px; background: linear-gradient(145deg, var(--azul), var(--azul-2)); color: #fff; font-weight: 800; }
.barra-celular__principal .barras { color: var(--ciano); }
.barra-celular__principal .barras rect { opacity: 1; }

/* ---------------------------------------------------- páginas internas */

.pagina-topo {
	position: relative; overflow: hidden;
	padding: calc(var(--topo) + 32px) 0 48px;
	background: var(--degrade-escuro); color: #fff;
}
.pagina-topo::before {
	content: ""; position: absolute; right: -10%; top: -30%; width: 60%; height: 160%;
	background: radial-gradient(closest-side, rgba(75, 86, 254, .35), transparent);
	pointer-events: none;
}
.pagina-topo__grade { position: relative; display: grid; gap: 32px; }
.pagina-topo__texto { display: flex; flex-direction: column; gap: 16px; max-width: 820px; }
.pagina-topo h1 { font-size: clamp(34px, 5vw, 64px); line-height: 1.04; }
.pagina-topo__resumo { font-size: 18px; line-height: 1.55; color: var(--claro-2); max-width: 640px; }
.pagina-topo__rotulo { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 600; color: var(--ciano); }
.pagina-topo__rotulo .barras { color: var(--ciano); }
.pagina-topo .acoes { padding-top: 4px; }

.trilha ol { display: flex; flex-wrap: wrap; gap: 6px; font-size: 14px; color: var(--claro); }
.trilha li + li::before { content: "/"; margin-right: 6px; color: #52668c; }
.trilha a { color: var(--claro); text-decoration: none; }
.trilha a:hover { color: #fff; text-decoration: underline; }
.trilha [aria-current] { color: #fff; }

/* escada dos estágios na página de um plano */
.escada { display: grid; gap: 8px; }
.escada a {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	min-height: 64px; padding: 14px 18px; border-radius: 8px;
	background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .16);
	color: #fff; text-decoration: none; font-size: 14px; line-height: 1.3;
}
.escada a:hover { background: rgba(255, 255, 255, .14); color: #fff; }
.escada strong { display: block; font-size: 17px; }
.escada span { color: var(--claro); }
.escada span strong { color: #fff; }
.escada small { font-size: 13px; color: var(--claro); white-space: nowrap; }
.escada .atual a { background: #fff; border-color: #fff; color: var(--marinho); }
.escada .atual span { color: var(--suave); }
.escada .atual span strong { color: var(--marinho); }
.escada .atual small { color: var(--acao); font-weight: 700; }

.planos--pagina { padding-top: 40px; }

/* conteúdo do editor */
.conteudo { font-size: 18px; line-height: 1.7; color: var(--texto-2); }
.conteudo > * + * { margin-top: 1.1em; }
.conteudo > :first-child { margin-top: 0; }
.conteudo h2 { margin-top: 2em; font-size: clamp(26px, 3vw, 36px); color: var(--marinho); }
.conteudo h3 { margin-top: 1.6em; font-size: 22px; color: var(--marinho); }
.conteudo h2 + *,
.conteudo h3 + * { margin-top: .6em; }
.conteudo ul,
.conteudo ol { display: grid; gap: 10px; }
.conteudo ul li { position: relative; padding-left: 28px; }
.conteudo ul li::before { content: ""; position: absolute; left: 4px; top: .62em; width: 10px; height: 10px; border-radius: 2px; background: var(--acao); }
.conteudo ol { counter-reset: item; }
.conteudo ol li { position: relative; padding-left: 32px; counter-increment: item; }
.conteudo ol li::before { content: counter(item); position: absolute; left: 0; font-weight: 800; color: var(--acao); }
.conteudo strong { color: var(--marinho); }
.conteudo img { border-radius: 10px; }
.conteudo blockquote { padding: 20px 24px; border-radius: 10px; background: var(--fundo-alt); font-size: 19px; }
.conteudo .wp-block-table { overflow-x: auto; margin-inline: calc(-1 * var(--margem)); padding-inline: var(--margem); }
.conteudo table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 15px; line-height: 1.4; }
.conteudo th,
.conteudo td { padding: 12px 10px; border-bottom: 1px solid var(--linha); text-align: center; }
.conteudo thead th { background: var(--marinho); color: #fff; font-weight: 700; }
.conteudo thead th:first-child { border-radius: 8px 0 0 0; text-align: left; }
.conteudo thead th:last-child { border-radius: 0 8px 0 0; }
.conteudo tbody th { text-align: left; font-weight: 600; color: var(--marinho); }
.conteudo td { color: var(--acao); font-weight: 800; }
.conteudo tbody tr:nth-child(even) { background: var(--fundo-caixa); }
.conteudo details { margin-top: 0; }
.conteudo h2 + details { margin-top: .8em; border-top: 2px solid var(--marinho); }

.post-meta { display: flex; flex-wrap: wrap; gap: 16px; font-size: 14px; color: var(--fraco); }
.post-meta span { display: inline-flex; align-items: center; gap: 6px; }
.post-meta .icone { width: 16px; height: 16px; }
.post-capa img { border-radius: 10px; }
.post-capa .navegador { border: 1px solid var(--linha); border-radius: 10px; }
.post-capa .navegador img { border-radius: 0; }

/* ------------------------------------------------------------ artigo */

.pagina-topo--artigo h1 { font-size: clamp(30px, 4.2vw, 48px); line-height: 1.08; max-width: 920px; }
.pagina-topo--artigo .pagina-topo__resumo { font-size: 17px; max-width: 720px; }
.post-meta--topo { align-items: center; gap: 8px 18px; color: var(--claro); }
.post-meta--topo .icone { color: var(--ciano); }
.post-meta__categoria {
	padding: 5px 12px; border-radius: 999px; background: rgba(0, 224, 255, .12);
	color: var(--ciano); font-size: 13px; font-weight: 700; text-decoration: none;
}
.post-meta__categoria:hover { background: rgba(0, 224, 255, .22); color: #fff; }

.secao--artigo { padding-top: 32px; }
.artigo-grade { display: grid; gap: 24px; }
.artigo-texto { min-width: 0; }

/* sumário: aberto no desktop, recolhido no celular (tema.js) */
.indice { border: 1px solid var(--linha); border-radius: var(--raio); background: var(--fundo-caixa); }
.indice summary {
	display: flex; align-items: center; justify-content: space-between; min-height: 48px; padding: 12px 18px;
	font-weight: 700; color: var(--marinho); cursor: pointer; list-style: none;
}
.indice summary::-webkit-details-marker { display: none; }
.indice summary::after { content: "+"; font-size: 22px; line-height: 1; color: var(--acao); transition: transform .2s; }
.indice[open] summary::after { transform: rotate(45deg); }
.indice ol { display: grid; gap: 2px; margin: 0; padding: 0 8px 12px; list-style: none; counter-reset: indice; }
.indice li { counter-increment: indice; }
.indice a {
	position: relative; display: block; padding: 11px 10px 11px 34px; border-radius: 6px;
	font-size: 15px; line-height: 1.35; color: var(--texto-2); text-decoration: none;
}
.indice a::before { content: counter(indice); position: absolute; left: 12px; top: 11px; font-size: 13px; font-weight: 800; color: var(--acao); }
.indice a:hover,
.indice a.ativo { background: #fff; color: var(--acao); }

.compartilhar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; }
.compartilhar p { margin-right: 6px; font-size: 14px; font-weight: 600; color: var(--fraco); }
.compartilhar a,
.compartilhar button {
	display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
	border: 1px solid var(--linha); background: #fff; color: var(--marinho); cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
}
.compartilhar .icone { width: 20px; height: 20px; }
.compartilhar a:hover,
.compartilhar button:hover { background: var(--marinho); border-color: var(--marinho); color: #fff; }
.compartilhar__ok { font-size: 13px; font-weight: 600; color: var(--whats); }

.assuntos { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--linha); }
.assuntos p { font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--fraco); }
.conteudo .assuntos ul { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.conteudo .assuntos li { padding: 0; }
.conteudo .assuntos li::before { display: none; }
.assuntos a { display: inline-block; padding: 11px 16px; border-radius: 999px; background: var(--tinta); color: var(--acao); font-size: 14px; font-weight: 600; text-decoration: none; }
.assuntos a:hover { background: var(--acao); color: #fff; }

/* chamada no meio do artigo (bloco insightsignal/cta) */
.conteudo .cta-artigo { margin-block: 2em; }
.cta-artigo {
	display: grid; gap: 10px; padding: 26px 22px; border-radius: var(--raio);
	background: var(--degrade-cartao); color: #fff;
}
.cta-artigo > * { margin: 0; }
.cta-artigo__rotulo { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ciano); }
.cta-artigo__rotulo .barras { color: var(--ciano); }
.cta-artigo__titulo { font-size: 23px; font-weight: 800; line-height: 1.2; color: #fff; }
.cta-artigo__texto { font-size: 16px; line-height: 1.55; color: var(--claro-2); }
.cta-artigo .botao { justify-self: start; margin-top: 6px; text-decoration: none; }

/* próximos passos, quando ainda não há outro artigo */
.proximos { display: grid; gap: 16px; }
.proximos a {
	display: grid; align-content: start; gap: 8px; height: 100%; padding: 24px;
	border: 1px solid var(--linha); border-radius: var(--raio); background: #fff;
	color: var(--suave); text-decoration: none; transition: border-color .2s, transform .2s;
}
.proximos a:hover { border-color: var(--acao); transform: translateY(-2px); }
.proximos__icone { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 4px; border-radius: 10px; background: var(--tinta); color: var(--acao); }
.proximos__icone .icone { width: 22px; height: 22px; }
.proximos strong { font-size: 19px; color: var(--marinho); }

/* assinatura no fim do artigo */
.autor { display: flex; gap: 16px; align-items: flex-start; margin-top: 24px; padding: 20px; border: 1px solid var(--linha); border-radius: var(--raio); background: var(--fundo-caixa); }
.autor img { flex: none; width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.autor p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--suave); }
.autor strong { display: block; font-size: 17px; color: var(--marinho); }
.autor a { display: inline-block; margin-top: 6px; font-weight: 600; }

.resultados { display: grid; gap: 10px; }
.conteudo .resultados li { display: flex; gap: 12px; padding: 14px 16px; border-radius: 8px; background: var(--fundo-alt); font-size: 16px; line-height: 1.5; }
.conteudo .resultados li::before { display: none; }
.resultados .icone { width: 22px; height: 22px; color: var(--acao); }

/* listagens */
.grade-cartoes { display: grid; gap: 24px; }
.cases__grade { display: grid; gap: 24px; }
.cartao { position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--linha); border-radius: var(--raio); background: #fff; }
/* o card inteiro é clicável: área de toque grande no celular */
.cartao h3 a::after,
.artigo h3 a::after { content: ""; position: absolute; inset: 0; }
.cartao:focus-within { box-shadow: var(--foco); }
.cartao__imagem { display: block; overflow: hidden; background: var(--fundo-alt); }
.cartao__imagem img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .4s; }
.cartao__corpo { display: flex; flex-direction: column; gap: 10px; padding: 20px; }
.cartao h3 { font-size: 20px; }
.cartao h3 a { color: inherit; text-decoration: none; }
.cartao h3 a:hover { color: var(--acao); }
.cartao__corpo > p:last-child { font-size: 15px; color: var(--suave); }
.navigation.pagination { margin-top: 40px; }
.nav-links { display: flex; flex-wrap: wrap; gap: 8px; }
.page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 12px; border: 1px solid var(--linha); border-radius: var(--raio-p); color: var(--marinho); text-decoration: none; font-weight: 700; }
.page-numbers.current { background: var(--marinho); border-color: var(--marinho); color: #fff; }

.form-busca { display: flex; gap: 8px; margin-block: 20px; }
.form-busca input { flex: 1; min-width: 0; min-height: 52px; padding: 0 16px; border: 1.5px solid var(--linha); border-radius: var(--raio-p); background: #fff; color: var(--marinho); font-size: 16px; }
.form-busca input::placeholder { color: #5b6785; opacity: 1; }
.form-busca input:focus { border-color: var(--acao); outline: none; box-shadow: 0 0 0 3px rgba(58, 69, 232, .2); }
.form-busca .botao { width: 52px; padding: 0; }
.busca-topo .form-busca { margin-top: 0; }

/* ---------------------------------------------------------- diagnóstico */

.diagnostico {
	width: min(640px, calc(100vw - 24px)); max-height: calc(100dvh - 24px);
	padding: 0; border: 0; border-radius: 16px;
	background: #fff; color: var(--marinho);
	box-shadow: 0 30px 80px rgba(4, 10, 40, .5);
}
.diagnostico::backdrop { background: rgba(6, 14, 30, .72); backdrop-filter: blur(4px); }
.diagnostico__form { display: flex; flex-direction: column; gap: 20px; padding: 22px 20px 20px; }
.diagnostico__topo { display: grid; grid-template-columns: 1fr auto; gap: 14px; align-items: start; }
.diagnostico__topo .rotulo { margin: 0; font-size: 20px; font-weight: 900; color: var(--marinho); letter-spacing: -.01em; }
.diagnostico__sub { font-size: 15px; color: var(--suave); }
.diagnostico__fechar { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--linha); border-radius: var(--raio-p); background: #fff; }
.diagnostico__progresso { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.diagnostico__progresso li { height: 6px; border-radius: 3px; background: var(--linha-2); transition: background-color .25s; }
.diagnostico__progresso li.ativo { background: var(--acao); }
.etapa { display: none; min-width: 0; margin: 0; padding: 0; border: 0; }
.etapa.ativa { display: block; }
.etapa legend { padding: 0; font-size: 22px; font-weight: 800; letter-spacing: -.01em; line-height: 1.25; }
.etapa__ajuda { margin: 6px 0 16px; font-size: 15px; color: var(--suave); }
.escolhas { display: grid; gap: 10px; }
.escolha { position: relative; display: block; cursor: pointer; }
.escolha input { position: absolute; inset: 0; opacity: 0; }
.escolha__caixa {
	display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center;
	padding: 14px 16px; border: 1.5px solid var(--linha); border-radius: 10px;
	transition: border-color .2s, background-color .2s;
}
.escolha__caixa .icone { grid-row: span 2; width: 24px; height: 24px; color: var(--acao); }
.escolha__caixa strong { font-size: 16px; }
.escolha__caixa small { font-size: 14px; color: var(--fraco); }
.escolha:hover .escolha__caixa { border-color: #a9b3c6; }
.escolha input:checked + .escolha__caixa { border-color: var(--acao); background: var(--tinta); }
.escolha input:focus-visible + .escolha__caixa { box-shadow: var(--foco); }
.campo { display: grid; gap: 6px; margin-top: 14px; }
.campo label { font-size: 15px; font-weight: 700; }
.campo label span { font-weight: 400; color: var(--fraco); }
.campo input { min-height: 52px; padding: 0 14px; border: 1.5px solid var(--linha); border-radius: 8px; font-size: 16px; }
.campo input:focus { border-color: var(--acao); outline: none; box-shadow: 0 0 0 3px rgba(58, 69, 232, .2); }
.etapa__lgpd { margin-top: 14px; font-size: 13px; color: var(--fraco); }
.etapa--fim { text-align: center; }
.etapa--fim.ativa { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.etapa__ok { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 50%; background: rgba(26, 158, 75, .12); color: var(--whats); }
.etapa__ok .icone { width: 34px; height: 34px; }
.etapa--fim h2 { font-size: 28px; }
.diagnostico__erro { padding: 10px 14px; border-radius: 8px; background: #fdecec; color: #a4161a; font-size: 15px; font-weight: 600; }
.diagnostico__rodape { display: flex; justify-content: space-between; gap: 12px; }
.diagnostico__rodape [data-proximo],
.diagnostico__rodape [data-enviar] { margin-left: auto; }
.concluido .diagnostico__rodape,
.concluido .diagnostico__progresso { display: none; }
.isca { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* botões flutuantes: voltar ao topo (sempre) e WhatsApp (só a partir de
   901 px; no celular ele já está na barra de ações) */
.flutuantes {
	position: fixed; right: 16px; bottom: calc(var(--barra) + 16px + env(safe-area-inset-bottom)); z-index: 47;
	display: flex; flex-direction: column; align-items: center; gap: 12px;
}
.flutuante {
	position: relative; display: inline-flex; align-items: center; justify-content: center;
	transition: opacity .25s, transform .25s, visibility 0s;
}
.flutuante:focus-visible { outline: 3px solid var(--acao); outline-offset: 3px; }

/* voltar ao topo: o anel mostra quanto da página já foi lido */
.flutuante--topo {
	width: 48px; height: 48px; border-radius: 50%;
	border: 0; background: #fff; color: var(--marinho);
	box-shadow: 0 10px 28px rgba(4, 10, 40, .22);
}
.flutuante--topo .icone { width: 20px; height: 20px; transition: transform .2s; }
.flutuante--topo:hover .icone { transform: translateY(-2px); }
.flutuante__progresso { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.flutuante__progresso circle {
	fill: none; stroke: var(--acao); stroke-width: 3; stroke-linecap: round;
	stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--lido, 0) * 100);
}
.flutuante--topo:not(.visivel) { visibility: hidden; opacity: 0; transform: translateY(12px); transition: opacity .25s, transform .25s, visibility 0s .25s; }

/* WhatsApp: a foto do Ítalo com o selo verde; o nome abre ao lado no
   primeiro contato visual e sempre que o mouse ou o foco chegam */
.flutuante--whats { display: none; gap: 12px; color: var(--marinho); text-decoration: none; }
.flutuante__foto { position: relative; flex: none; width: 64px; height: 64px; border-radius: 50%; padding: 3px; background: var(--whats); box-shadow: 0 12px 30px rgba(4, 10, 40, .3); transition: transform .2s; }
.flutuante__foto img { display: block; width: 100%; height: 100%; border-radius: 50%; border: 2px solid #fff; object-fit: cover; }
.flutuante__selo {
	position: absolute; right: -4px; bottom: -2px;
	display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%;
	background: var(--whats); color: #fff; border: 2px solid #fff;
}
.flutuante__selo .icone { width: 14px; height: 14px; }
/* sem foto (opção do Personalizar): o círculo verde com o ícone */
.flutuante__foto--icone { display: grid; place-items: center; color: #fff; }
.flutuante__foto--icone .icone { width: 30px; height: 30px; }
.flutuante__rotulo {
	display: grid; padding: 10px 16px; border-radius: 14px 14px 4px 14px;
	background: #fff; box-shadow: 0 10px 28px rgba(4, 10, 40, .18); line-height: 1.25; white-space: nowrap;
	opacity: 0; transform: translateX(8px) scale(.96); transform-origin: right bottom; pointer-events: none;
	transition: opacity .25s, transform .25s;
}
.flutuante__rotulo strong { font-size: 15px; }
.flutuante__rotulo small { font-size: 13px; color: var(--nota); }
.flutuante--whats:hover .flutuante__foto, .flutuante--whats:focus-visible .flutuante__foto { transform: scale(1.05); }
.flutuante--whats:hover .flutuante__rotulo, .flutuante--whats:focus-visible .flutuante__rotulo, .flutuante--whats.acenando .flutuante__rotulo { opacity: 1; transform: none; }
.flutuante--whats.acenando .flutuante__foto::after {
	content: ""; position: absolute; inset: -3px; border-radius: 50%; border: 2px solid var(--whats);
	animation: aceno 1.6s ease-out 2;
}
@keyframes aceno { from { opacity: .9; transform: scale(1); } to { opacity: 0; transform: scale(1.35); } }

/* ============================================================ componentes
   template-parts/componentes/*.php: cada bloco aqui tem um arquivo lá. */

/* percurso: marcos ligados por uma trilha (vertical no celular, horizontal
   a partir de 1061 px) */
.percurso { --marco: 56px; --vao: 32px; display: grid; margin: 0; padding: 0; list-style: none; }
.percurso__item { position: relative; display: grid; align-content: start; grid-template-columns: var(--marco) minmax(0, 1fr); column-gap: 18px; padding-bottom: 36px; }
.percurso__item:last-child { padding-bottom: 0; }
.percurso__item::before {
	content: ""; position: absolute; top: calc(var(--marco) + 8px); bottom: 8px; left: calc(var(--marco) / 2 - 1px);
	width: 2px; border-radius: 2px; background: rgba(58, 69, 232, .22);
}
.percurso__item:last-child::before { display: none; }
.percurso__marco {
	position: relative; display: grid; place-items: center; width: var(--marco); height: var(--marco);
	border: 2px solid rgba(58, 69, 232, .22); border-radius: 50%; background: #fff; color: var(--acao);
}
.percurso__marco .icone { width: 24px; height: 24px; }
.percurso__texto { padding-top: 4px; }
.percurso__rotulo { margin: 0 0 4px; font-size: 13px; font-weight: 700; color: var(--acao); }
.percurso__item h3 { margin: 0 0 6px; font-size: 20px; color: var(--marinho); }
.percurso__item p:last-child { margin: 0; font-size: 15px; line-height: 1.55; color: var(--texto-2); }
.percurso--escura .percurso__item::before { background: rgba(255, 255, 255, .2); }
.percurso--escura .percurso__marco { border: 0; background: linear-gradient(145deg, var(--azul), var(--azul-2)); color: #fff; }
.percurso--escura .percurso__rotulo { color: var(--claro); font-weight: 600; }
.percurso--escura h3 { color: #fff; }
.percurso--escura .percurso__item p:last-child { color: var(--claro); }
.percurso--chegada .percurso__item:last-child .percurso__marco { border: 0; background: var(--degrade); color: #fff; box-shadow: 0 0 0 8px rgba(58, 69, 232, .12); }
.percurso--chegada .percurso__item:last-child h3 { color: var(--acao); }
.percurso__frase { max-width: 40ch; margin: 48px auto 0; font-size: clamp(21px, 2.3vw, 30px); font-weight: 600; line-height: 1.3; text-align: center; text-wrap: balance; color: var(--marinho); }
.percurso__frase strong { display: block; color: var(--acao); }

/* subtítulo dentro de uma seção, entre dois blocos */
.subtitulo-secao { margin: 56px 0 20px; font-size: clamp(20px, 2vw, 24px); color: var(--marinho); }

/* logos de clientes escolhidos, parados */
.secao--faixa { padding-block: 40px; border-bottom: 1px solid var(--linha); }
.logos { display: grid; gap: 20px; }
.logos__titulo { margin: 0; font-size: 14px; font-weight: 700; text-align: center; color: var(--fraco); }
.logos__lista { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 24px 40px; margin: 0; padding: 0; list-style: none; }
.logos__lista img { width: auto; max-width: 132px; height: 48px; object-fit: contain; opacity: .8; }

/* cartões com ícone */
.cartoes-icone { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; }
.cartoes-icone li { display: grid; gap: 12px; align-content: start; padding: 28px 24px; border: 1px solid var(--linha); border-top: 3px solid var(--acao); border-radius: var(--raio); background: #fff; }
.cartoes-icone__icone { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: linear-gradient(145deg, var(--azul), var(--azul-2)); color: #fff; }
.cartoes-icone__icone .icone { width: 22px; height: 22px; }
.cartoes-icone h3 { margin: 4px 0 0; font-size: 21px; color: var(--marinho); }
.cartoes-icone p { margin: 0; color: var(--texto-2); }
/* no celular o ícone fica ao lado do título, e o cartão encurta */
@media (max-width: 620px) {
	.cartoes-icone li { grid-template-columns: 44px minmax(0, 1fr); column-gap: 14px; row-gap: 8px; align-items: center; padding: 20px; }
	.cartoes-icone__icone { width: 44px; height: 44px; }
	.cartoes-icone h3 { margin: 0; font-size: 19px; }
	.cartoes-icone p { grid-column: 1 / -1; }
}

/* números com fonte */
.numeros-fonte { display: grid; gap: 16px; margin: 0; padding: 0; list-style: none; }
.numeros-fonte li { display: grid; gap: 10px; align-content: start; padding: 24px; border-radius: var(--raio); background: var(--fundo-alt); }
.numeros-fonte strong { font-size: clamp(48px, 5vw, 68px); font-weight: 900; line-height: 1; letter-spacing: -.03em; color: var(--acao); }
.numeros-fonte p { margin: 0; font-size: 17px; line-height: 1.45; color: var(--texto-2); }
.numeros-fonte a { display: inline-flex; align-self: end; align-items: center; min-height: 44px; font-size: 13px; color: var(--nota); }
.secao--alt .numeros-fonte li { border: 1px solid var(--linha); background: #fff; }

/* aviso */
.aviso { padding: 24px; border: 1px solid var(--linha); border-left: 4px solid var(--acao); border-radius: var(--raio); background: var(--fundo-alt); }
.aviso h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font-size: clamp(22px, 2.4vw, 28px); color: var(--marinho); }
.aviso h2 .icone { flex: none; width: 24px; height: 24px; color: var(--acao); }
.aviso p { margin: 0 0 10px; color: var(--texto-2); }
.aviso p:last-child { margin-bottom: 0; }

/* case em destaque */
.case-destaque { display: grid; gap: 32px; padding: 32px 24px; border-radius: 20px; background: var(--degrade-escuro); color: #fff; }
.case-destaque__texto { display: grid; gap: 18px; align-content: start; }
.case-destaque .rotulo { margin: 0; color: var(--ciano); }
.case-destaque h2 { margin: 0; font-size: clamp(28px, 3.4vw, 46px); color: #fff; }
.case-destaque__texto > p { margin: 0; font-size: 17px; line-height: 1.55; color: var(--claro-2); }
.case-destaque__cliente { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; padding: 16px 0; border-block: 1px solid rgba(255, 255, 255, .14); }
.case-destaque__logo { width: auto; max-width: 160px; height: 44px; object-fit: contain; filter: brightness(0) invert(1); }
.case-destaque__cliente span { font-size: 14px; color: var(--claro); }
.case-destaque__texto .botao { justify-self: start; }
.case-destaque__numeros { margin: 0; }
.case-destaque__numeros ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.case-destaque__numeros li { display: grid; gap: 6px; align-content: start; padding: 20px 18px; border: 1px solid rgba(255, 255, 255, .12); border-radius: 14px; background: rgba(255, 255, 255, .06); }
.case-destaque__icone { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 6px; border-radius: 10px; background: rgba(0, 224, 255, .12); color: var(--ciano); }
.case-destaque__icone .icone { width: 20px; height: 20px; }
.case-destaque__numeros strong { font-size: clamp(24px, 2.6vw, 36px); font-weight: 900; line-height: 1.05; letter-spacing: -.02em; color: #fff; }
.case-destaque__numeros li > span:last-child { font-size: 14px; line-height: 1.35; color: var(--claro-2); }
.case-destaque__numeros figcaption { margin-top: 14px; font-size: 12px; color: var(--claro); }

/* ------------------------------------------ página Posicionamento em IA */

.pagina-topo__lado { display: none; }
.secao--branca { background: #fff; }

.teste__grade { display: grid; gap: 32px; }
.teste__grade > div:first-child { display: grid; gap: 16px; align-content: start; }
.teste__caixa { display: grid; gap: 20px; padding: 28px 24px; border: 1px solid var(--linha); border-radius: 16px; background: #fff; box-shadow: 0 18px 40px rgba(12, 30, 58, .08); }
.teste__perguntas { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.teste__perguntas li { padding: 14px 16px; border-radius: 14px 14px 14px 4px; background: var(--fundo-alt); font-weight: 600; line-height: 1.4; color: var(--marinho); }
.teste__perguntas em { padding: 0 2px; border-radius: 4px; background: rgba(58, 69, 232, .1); font-style: normal; color: var(--acao); }
.teste__resultado { margin: 0; font-size: 19px; color: var(--texto-2); }
.teste__resultado strong { color: var(--marinho); }
.teste__caixa .botao { justify-self: start; }

.duvidas { background: #fff; }
.duvidas__grade { display: grid; gap: 40px; }
.duvidas__faq > h2:first-child { margin-top: 0; }

/* ------------------------------------------------ teste de visibilidade */

.teste-v { background: #fff; }
.teste-v [hidden] { display: none !important; }
/* a página já tem o botão de WhatsApp no painel do resultado */
body:has(.teste-v) .flutuante--whats { display: none; }
.teste-v__grade { display: grid; gap: 40px; }
.teste-v__como { display: flex; gap: 12px; align-items: flex-start; margin: 0 0 32px; padding: 16px 20px; border-radius: var(--raio); background: var(--fundo-alt); color: var(--texto-2); }
.teste-v__como .icone { flex: none; width: 22px; height: 22px; margin-top: 2px; color: var(--acao); }
.teste-v__grupo { min-width: 0; margin: 0 0 32px; padding: 0; border: 0; }
.teste-v__grupo legend { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; padding: 0; font-size: 18px; font-weight: 800; color: var(--marinho); }
.teste-v__grupo-icone { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--fundo-alt); color: var(--acao); }
.teste-v__grupo-icone .icone { width: 18px; height: 18px; }
.teste-v__item {
	position: relative; display: grid; grid-template-columns: 26px 22px minmax(0, 1fr); gap: 12px; align-items: start;
	margin-bottom: 10px; padding: 16px; border: 1px solid var(--linha); border-radius: var(--raio); background: #fff;
	cursor: pointer; transition: border-color .2s, background-color .2s;
}
.teste-v__item:hover { border-color: #aab3f5; }
.teste-v__item input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.teste-v__caixa { display: grid; place-items: center; width: 26px; height: 26px; border: 2px solid #b7c0d3; border-radius: 6px; color: transparent; transition: background-color .2s, border-color .2s; }
.teste-v__caixa .icone { width: 16px; height: 16px; }
.teste-v__item input:checked + .teste-v__caixa { border-color: var(--acao); background: var(--acao); color: #fff; }
.teste-v__item input:focus-visible + .teste-v__caixa { outline: 3px solid var(--acao); outline-offset: 2px; }
.teste-v__item:has(input:checked) { border-color: var(--acao); background: #f4f5ff; }
.teste-v__num { padding-top: 3px; font-size: 13px; font-weight: 800; color: var(--acao); }
.teste-v__frase { font-size: 16px; line-height: 1.45; color: var(--texto); }
.teste-v__fim { display: flex; flex-wrap: wrap; gap: 12px; }
.teste-v__mini {
	position: fixed; left: 50%; bottom: calc(var(--barra) + 16px + env(safe-area-inset-bottom)); z-index: 46; transform: translateX(-50%);
	display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 8px 8px 18px; border-radius: 999px;
	background: var(--marinho); box-shadow: 0 12px 30px rgba(4, 10, 40, .3); color: #fff; font-size: 15px; white-space: nowrap; text-decoration: none;
}
.teste-v__mini b { font-size: 18px; color: var(--ciano); }
.teste-v__mini span { padding: 6px 12px; border-radius: 999px; background: #fff; color: var(--marinho); font-size: 14px; font-weight: 700; }

.teste-v__resultado { display: grid; gap: 18px; align-content: start; padding: 28px 24px; border-radius: 20px; background: var(--degrade-escuro); color: #fff; }
.teste-v__resultado .rotulo { margin: 0; color: var(--ciano); }
.teste-v__placar { display: flex; align-items: baseline; gap: 10px; margin: 0; font-size: clamp(56px, 5vw, 72px); line-height: 1; color: #fff; }
.teste-v__placar { scroll-margin-top: calc(var(--topo) + 96px); }
.teste-v__placar small { font-size: 18px; font-weight: 600; letter-spacing: 0; color: var(--claro); }
.teste-v__status { margin: 0; font-size: 17px; line-height: 1.5; color: var(--claro-2); }
.teste-v__status strong { color: #fff; }
.teste-v__resultado { --localizada: #4ade80; --parcial: #8ea2ff; --pouco-visivel: #fbbf24; --desaparecida: #f87171; }
.teste-v__resultado[data-estado="localizada"] [data-total] { color: var(--localizada); }
.teste-v__resultado[data-estado="parcial"] [data-total] { color: var(--parcial); }
.teste-v__resultado[data-estado="pouco-visivel"] [data-total] { color: var(--pouco-visivel); }
.teste-v__resultado[data-estado="desaparecida"] [data-total] { color: var(--desaparecida); }
.regua { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.regua__faixa { padding-top: 10px; border-top: 4px solid; font-size: 12px; line-height: 1.3; color: var(--claro); opacity: .5; transition: opacity .25s; }
.regua__faixa strong { display: block; font-size: 13px; color: #fff; }
.regua__faixa--localizada { border-color: var(--localizada); }
.regua__faixa--parcial { border-color: var(--parcial); }
.regua__faixa--pouco-visivel { border-color: var(--pouco-visivel); }
.regua__faixa--desaparecida { border-color: var(--desaparecida); }
.regua__faixa.atual { opacity: 1; color: #fff; }
.teste-v__grupos > p,
.teste-v__plano > p { margin: 0 0 10px; font-size: 13px; font-weight: 700; color: var(--claro); }
.teste-v__grupos ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.teste-v__grupos li { display: grid; grid-template-columns: minmax(0, 1fr) 72px 34px; gap: 10px; align-items: center; font-size: 14px; color: var(--claro-2); }
.teste-v__barra { height: 6px; overflow: hidden; border-radius: 3px; background: rgba(255, 255, 255, .14); }
.teste-v__barra i { display: block; width: 0; height: 100%; background: var(--ciano); transition: width .3s; }
.teste-v__grupos b { font-size: 13px; text-align: right; color: #fff; }
.teste-v__plano a { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-height: 52px; padding: 12px 16px; border-radius: var(--raio); background: #fff; color: var(--marinho); text-decoration: none; }
.teste-v__plano strong { font-size: 17px; }
.teste-v__plano span { font-size: 14px; color: var(--suave); }
.teste-v__plano .icone { width: 18px; height: 18px; margin-left: auto; color: var(--acao); }
.teste-v__acoes { display: grid; gap: 10px; }
.teste-v__nota { margin: 0; font-size: 12px; line-height: 1.45; color: var(--claro); }

/* =============================================================== 621px */

@media (min-width: 621px) {
	.numeros-fonte { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.aviso { padding: 32px; }
	.acoes > .botao { flex: 0 0 auto; }
	.rolo > * { flex-basis: 320px; }
	.hero { padding-top: calc(var(--topo) + 64px); }
	.hero__fundo img { animation: zoom-lento 26s ease-in-out infinite alternate; }
	.destaques { max-width: 460px; padding: 20px 28px 28px; }
	.planos__frase { padding: 28px 32px; }
	.plano { padding: 32px 28px 28px; }
	.case__imagem { padding: 20px 20px 0; }
	.case__corpo { padding: 28px; }
	.faixa__logo { height: 50px; max-width: 160px; }
	.faixa__trilho { gap: 64px; padding-right: 64px; }
	.grade-cartoes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.final__acoes { grid-template-columns: repeat(2, max-content); }
	.rodape__grade { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.rodape__contato { grid-column: auto; }
	.rodape__base { flex-direction: row; justify-content: space-between; }
	.diagnostico__form { padding: 28px 32px; }
	.escolhas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.carrossel { --por-vez: 2; --vao: 20px; }
	.carrossel__trilho { margin-inline: 0; padding-inline: 0; scroll-padding-inline: 0; }
	.carrossel__trilho > * { flex-basis: calc((100% - (var(--por-vez) - 1) * var(--vao)) / var(--por-vez)); }
	/* à esquerda: o canto direito é dos botões flutuantes */
	.carrossel__controles { justify-content: flex-start; margin-top: 28px; }
}

/* =============================================================== 901px */

@media (min-width: 901px) {
	.cartoes-icone { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
	.cartoes-icone--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.case-destaque { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; padding: 56px; align-items: center; }
	.teste__grade { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; align-items: center; }
	.teste__caixa { padding: 36px; }
	body { padding-bottom: 0; font-size: 18px; }
	.barra-celular,
	.deslize,
	.so-celular { display: none !important; }
	.so-desktop { display: inline-flex !important; }

	.secao__topo { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: end; margin-bottom: 56px; }
	.secao__topo > div { grid-column: span 7; }
	.secao__topo > .secao__lead,
	.secao__topo > .botao { grid-column: 9 / span 4; }
	.secao__topo > .botao { justify-self: end; }
	.secao__lead { font-size: 19px; }

	/* os carrosséis viram grade */
	.rolo { display: grid; gap: 24px; margin-inline: 0; padding: 0; overflow: visible; }
	.rolo > * { flex: none; }
	.planos__lista--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
	.planos__lista--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
	.cases__lista,
	.cases__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
	.portfolio__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; }
	.carrossel { --vao: 24px; }

	.planos__frase { grid-template-columns: 1fr auto; align-items: center; gap: 32px; margin-top: 56px; padding: 32px 40px; }

	.ia__grade { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: center; }
	.ia__texto { grid-column: span 6; }
	.conversa { grid-column: 8 / span 5; padding: 28px; }
	.ia__rodape { margin-top: 80px; padding-top: 32px; }
	.ia__rodape .faixa { margin-inline: 0; -webkit-mask-image: none; mask-image: none; }
	.faixa--so-celular .faixa__trilho { width: 100%; padding: 0; justify-content: space-between; animation: none; }
	.faixa--so-celular .faixa__copia { display: none; }
	.ia__marca { font-size: 17px; }
	.ia__marca img { width: 28px; height: 28px; }


	.sobre__grade { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: center; }
	.sobre__foto { grid-column: span 5; margin: 0 0 24px 24px; }
	.sobre__foto::before { inset: 32px 40px -24px -24px; }
	.sobre__foto img { max-height: none; aspect-ratio: 900 / 1113; }
	.sobre__texto { grid-column: 7 / span 6; gap: 20px; }
	.sobre__texto > p:not([class]) { font-size: 18px; }

	.depoimento { padding: 32px; }
	.depoimento blockquote { font-size: 18px; }

	.blog__grade { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 32px; }
	.artigo--destaque { grid-column: span 7; }
	.artigo--destaque .artigo__imagem img,
	.artigo--destaque .artigo__vazio { aspect-ratio: 16 / 8.5; }
	.artigo--destaque h3 { font-size: 32px; line-height: 1.15; letter-spacing: -.015em; }
	.blog__lista { grid-column: 8 / span 5; align-content: start; }
	.artigo--linha { grid-template-columns: 150px 1fr; gap: 20px; padding: 24px 0; }
	.artigo--linha:first-child { padding-top: 0; border-top: 0; }
	.artigo--linha h3 { font-size: 20px; line-height: 1.25; }

	.faq__grade { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; }
	.faq__topo { grid-column: span 5; }
	.faq__lista { grid-column: 7 / span 6; }
	.faq__lista summary,
	.conteudo summary { min-height: 76px; font-size: 21px; }

	.final__grade { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: center; }
	.final__texto { grid-column: span 7; }
	.final__acoes { grid-column: 9 / span 4; grid-template-columns: 1fr; }
	.final__acoes .botao { min-height: 60px; font-size: 18px; }

	.rodape { padding-top: 72px; }
	.flutuantes { right: 24px; bottom: 24px; }
	.flutuantes { align-items: flex-end; }
	.flutuante--whats { display: inline-flex; }
	.flutuante--topo { width: 52px; height: 52px; margin-right: 6px; }
	.rodape__grade { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; }
	.rodape__marca { grid-column: span 3; }
	.rodape__coluna { grid-column: span 2; padding-top: 0; border-top: 0; }
	.rodape__contato { grid-column: span 3; }
	.rodape__links a { min-height: 36px; font-size: 15px; }

	.pagina-topo { padding: calc(var(--topo) + 72px) 0 88px; }
	/* internas simples e artigos: topo mais baixo; plano e landing (com
	   escada ou cartão ao lado) mantêm a altura */
	.pagina-topo:not(.pagina-topo--plano):not(.pagina-topo--lado) { padding: calc(var(--topo) + 40px) 0 52px; }
	.pagina-topo:not(.pagina-topo--plano):not(.pagina-topo--lado):not(.pagina-topo--artigo) h1 { font-size: clamp(34px, 4.4vw, 54px); }
	.proximos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.cta-artigo { padding: 32px 36px; }
	.pagina-topo--plano .pagina-topo__grade { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: end; }
	.pagina-topo--plano .pagina-topo__texto { grid-column: span 7; }
	.escada { grid-column: 9 / span 4; }
	.escada__degrau--2 { margin-right: 40px; }
	.escada__degrau--1 { margin-right: 80px; }

	.grade-cartoes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.conteudo .wp-block-table { margin-inline: 0; padding-inline: 0; }
}

/* ============================================================== 1061px */

@media (min-width: 1061px) {
	.carrossel { --por-vez: 3; }
	.artigo-grade { grid-template-columns: 250px minmax(0, 760px); column-gap: 64px; justify-content: center; align-items: start; }
	.artigo-lado { position: sticky; top: calc(var(--topo-rolou) + 24px); }
	.secao--artigo { padding-top: 56px; }
	.percurso { --marco: 64px; }
	.percurso--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--vao); }
	.percurso--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--vao); }
	.percurso--5 { grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: var(--vao); }
	.percurso__item { grid-template-columns: 1fr; row-gap: 20px; padding-bottom: 0; }
	.percurso__item::before { top: calc(var(--marco) / 2 - 1px); right: calc(12px - var(--vao)); bottom: auto; left: calc(var(--marco) + 12px); width: auto; height: 2px; }
	.percurso__marco .icone { width: 28px; height: 28px; }
	.percurso__texto { padding-top: 0; }
	.percurso__item h3 { font-size: 22px; }
	.numeros-fonte { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
	.logos__lista { gap: 32px 56px; }
	.logos__lista img { max-width: 160px; height: 56px; }
	.numeros-fonte--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.cartoes-icone--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.numeros-fonte li { padding: 28px; }
	.duvidas .aviso { position: sticky; top: calc(var(--topo) + 32px); padding: 36px; }
	.pagina-topo--lado .pagina-topo__grade { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: center; }
	.pagina-topo--lado .pagina-topo__texto { grid-column: span 7; }
	.pagina-topo__lado { display: block; grid-column: 8 / span 5; }
	.ia--pagina { padding-block: 44px; }
	.ia--pagina .faixa--so-celular .faixa__trilho { justify-content: center; column-gap: 48px; row-gap: 16px; flex-wrap: wrap; }
	.teste-v__grade { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; align-items: start; }
	.teste-v__mini { display: none !important; }
	.teste-v__resultado { position: sticky; top: calc(var(--topo) + 20px); gap: 16px; padding: 28px 32px; }
	.duvidas__grade { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 72px; align-items: start; }
	.pagina-topo__lado .conversa { border: 1px solid rgba(255, 255, 255, .14); }
	:root { --topo: 96px; --topo-rolou: 76px; }

	.marca { margin-right: 8px; }
	.marca img { width: 104px; height: 52px; }
	.topo.rolou .marca img { width: 88px; height: 44px; }
	.topo__dentro { gap: 32px; }
	.topo__menu { display: none; }
	.nav__lista > li > a, .nav__sub-botao { white-space: nowrap; }
	.topo__lupa { width: 44px; height: 44px; margin: 0 -16px 0 0; }
	.topo__lupa .icone { width: 20px; height: 20px; }
	.topo__busca .form-busca { max-width: 720px; margin-inline: auto; }
	.topo__fone { display: inline-flex; align-items: center; gap: 8px; color: #fff; text-decoration: none; font-size: 15px; font-weight: 500; white-space: nowrap; }
	.topo__fone:hover { color: var(--ciano); }
	.topo__fone .icone { width: 18px; height: 18px; }
	.topo__cta { display: inline-flex; min-height: 48px; padding: 0 22px; font-size: 15px; white-space: nowrap; flex-shrink: 0; }
	.topo.rolou .topo__cta { background: var(--ciano); }

	.nav {
		position: static; inset: auto; z-index: auto;
		flex-direction: row; align-items: center; gap: 0; margin-right: auto;
		padding: 0; background: none; overflow: visible;
		visibility: visible; opacity: 1; transform: none; transition: none;
	}
	.nav__cta { display: none; }
	.nav__lista { display: flex; align-items: center; gap: 30px; }
	.nav__lista > li { position: relative; }
	.nav__lista > li > a,
	.nav__sub-botao {
		min-height: 44px; width: auto; gap: 6px;
		border: 0; font-size: 16px; font-weight: 500;
	}
	.nav__lista > li > a:hover,
	.nav__sub-botao:hover { color: var(--ciano); }
	.nav__seta { width: 14px; height: 14px; color: currentColor; }
	.nav__sub {
		position: absolute; left: -16px; top: 100%;
		display: block; width: 320px; padding: 8px;
		border-radius: 12px; background: #fff;
		box-shadow: 0 20px 50px rgba(4, 10, 40, .3);
		visibility: hidden; opacity: 0; transform: translateY(-6px);
		transition: opacity .18s, transform .18s, visibility 0s .18s;
	}
	.nav__sub-botao[aria-expanded="true"] + .nav__sub,
	.nav__item--sub:hover .nav__sub,
	.nav__item--sub:focus-within .nav__sub { visibility: visible; opacity: 1; transform: none; transition: opacity .18s, transform .18s; }
	.nav__sub a { min-height: 60px; padding: 8px 10px; border-radius: 8px; color: var(--marinho); }
	.nav__sub a:hover { background: var(--fundo-alt); color: var(--marinho); }
	.nav__sub-icone { background: var(--tinta); color: var(--acao); }
	.nav__sub small { color: var(--fraco); }
	/* "Para quem" tem nove itens: duas colunas para não passar da tela. */
	#sub-segmentos { width: 600px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 4px; }

	/* O hero ocupa exatamente a primeira dobra: título, texto e card se
	   ajustam à altura da tela (de 1366×768 a 1920×1080). */
	.hero { display: flex; align-items: center; min-height: 100vh; min-height: 100svh; padding: calc(var(--topo) + 32px) 0 48px; }
	.hero__dentro { width: 100%; }
	.hero h1 { font-size: clamp(44px, min(5.6vw, 8.4vh), 80px); }
	.hero__lead { font-size: clamp(17px, min(1.5vw, 2.4vh), 21px); }
	.hero::after { background: linear-gradient(100deg, rgba(12, 30, 58, .96) 0%, rgba(20, 36, 110, .88) 42%, rgba(75, 86, 254, .35) 100%); }
	.hero__dentro { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: center; }
	.hero__texto { grid-column: span 7; gap: clamp(16px, 3vh, 28px); }
	.hero__rotulo { font-size: 16px; }
	.destaques { grid-column: 9 / span 4; max-width: none; }

	.clientes { gap: 40px; padding: 64px 0; }
	.clientes__titulo { font-size: 16px; }
	.faixa__trilho { gap: 72px; padding-right: 72px; }
	.faixa__logo { height: 58px; max-width: 190px; }

	.planos__lista--escada .plano:nth-child(1) { margin-top: 96px; }
	.planos__lista--escada .plano:nth-child(2) { margin-top: 48px; }
	.plano { gap: 22px; padding: 36px 32px 32px; }
	.plano__sinais { padding: 18px; }

	.case__imagem { padding: 24px 24px 0; }
	.case__corpo { gap: 16px; padding: 32px; }
	.case__titulo h3 { font-size: 22px; }
	.case__resultado { grid-template-columns: auto 1fr; align-items: baseline; gap: 16px; }
	.case__resultado p:last-child { font-size: 16px; }

	.portfolio__lista { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* desktop estreito: o menu cabe numa linha com o WhatsApp só no ícone */
@media (min-width: 1061px) and (max-width: 1279px) {
	.topo__dentro { gap: 20px; }
	.nav__lista { gap: 20px; }
	.topo__fone { justify-content: center; width: 44px; height: 44px; font-size: 0; gap: 0; }
	.topo__fone .icone { width: 22px; height: 22px; }
	.topo__lupa { margin-right: -10px; }
}

/* telas largas e baixas (notebooks 1366×768): card mais compacto */
@media (min-width: 1061px) and (max-height: 840px) {
	.destaques { gap: 10px; padding: 16px 24px 22px; }
	.destaques__topo { min-height: 36px; }
	.destaque { gap: 10px; }
	.destaque__numero { font-size: 44px; }
	.destaque__linhas div { padding: 8px 0; }
	.hero .botao--grande { min-height: 52px; }
}

/* ================================================= movimento reduzido */

@media (prefers-reduced-motion: reduce) {
	html,
	.carrossel__trilho { scroll-behavior: auto; }
	*,
	*::before,
	*::after { transition-duration: .01ms !important; }
	.hero__fundo img,
	.destaque.entrando { animation: none; }
	.faixa { -webkit-mask-image: none; mask-image: none; }
	.faixa__trilho { flex-wrap: wrap; justify-content: center; row-gap: 24px; width: auto; padding: 0 var(--margem); animation: none; }
	.faixa__copia { display: none; }
	.flutuante--whats.acenando .flutuante__foto::after { display: none; }
	.teste-v__barra i,
	.regua__faixa { transition: none; }
	.conversa__pontos i { animation: none; }
}