/*!
 * ContaÁgil — Hub da Reforma Tributária
 *
 * Identidade visual conforme o Brand Guide oficial:
 * Navy sustenta, Blue conduz a ação, Purple e Aqua dão expressividade.
 * Fonte Inter, grid base de 4px, raios 8/12/16/999, ícones Lucide com traço 1,5px.
 * O gradiente institucional aparece só em detalhes e capas, nunca sob texto de leitura.
 *
 * Tudo escopado em .car-root para não vazar para o tema nem sofrer com o Elementor.
 */

.car-root {
	/* Marca — sobrescritos pelo admin via wp_add_inline_style. */
	--car-navy: #002B51;
	--car-azul: #0496FF;
	--car-roxo: #5438DC;
	--car-aqua: #59F8E8;

	/* Ação */
	--car-primaria: #0072E2;
	--car-primaria-ativa: #005BB5;

	/* Superfícies e texto */
	--car-fundo: #FAFAFA;
	--car-superficie: #FFFFFF;
	--car-texto: #091826;
	--car-texto-suave: #586E83;
	--car-linha: #EBEFF2;
	--car-azul-suave: #E5F1FF;

	/* Feedback */
	--car-sucesso: #12965A;
	--car-sucesso-fundo: #D9F7EA;
	--car-alerta: #FFD27A;
	--car-alerta-texto: #B54708;
	--car-alerta-fundo: #FFF1D6;
	--car-erro: #D92D20;
	--car-erro-fundo: #FFF5F6;

	--car-gradiente: linear-gradient(100deg, #5438DC 0%, #0496FF 52%, #59F8E8 100%);

	/* Fixos do sistema */
	--car-selecionado: #F2F8FF;
	--car-superficie-2: #F5F5F5;
	--car-texto-fraco: #7D8E9F;
	--car-navy-escuro: #001A33;

	/* Raios da fundação: small / medium / large / pill */
	--car-raio-sm: 8px;
	--car-raio: 12px;
	--car-raio-lg: 16px;
	--car-pill: 999px;

	--car-sombra: 0 1px 2px rgba(0, 43, 81, .04), 0 12px 32px -18px rgba(0, 43, 81, .28);
	--car-sombra-alta: 0 24px 60px -28px rgba(0, 43, 81, .38);
	--car-sombra-botao: 0 10px 15px -3px rgba(0, 134, 235, .2), 0 4px 6px -4px rgba(0, 134, 235, .2);

	--car-fonte: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	font-family: var(--car-fonte);
	color: var(--car-texto);
	line-height: 1.55;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
	font-feature-settings: "cv11", "ss01";
}

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

/* O próprio .car-root pode receber [hidden] (o modal é um deles), por isso os dois seletores. */
.car-root[hidden],
.car-root [hidden] { display: none !important; }

/*
 * color: inherit é proposital. Ela blinda contra o CSS do tema (que atinge só "h1")
 * e ao mesmo tempo deixa cada bloco definir a cor: sobre o navy do topo, por exemplo,
 * o título herda o branco do container em vez de brigar por especificidade.
 */
.car-root h1, .car-root h2, .car-root h3, .car-root h4 {
	font-family: var(--car-fonte);
	font-weight: 600;
	letter-spacing: -0.025em;
	margin: 0;
	color: inherit;
	line-height: 1.18;
}

.car-root p { margin: 0; }
.car-root ul, .car-root ol { margin: .5em 0; padding-left: 1.25em; }
.car-root li { margin: .25em 0; }
.car-root img { max-width: 100%; height: auto; }
.car-root button { font-family: inherit; }

.car-ico { width: 1em; height: 1em; flex: 0 0 auto; }

.car-logo { display: block; height: auto; width: auto; }

/* Fio do gradiente institucional: o detalhe de marca que assina os blocos. */
.car-fio-marca {
	height: 4px;
	background-image: var(--car-gradiente);
	border-radius: var(--car-pill);
}

/* ====================================================================== */
/* Botões — spec do guia: primary 8px + sombra elevada, 14px/600           */
/* ====================================================================== */

.car-root .car-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	padding: 12px 20px;
	border-radius: var(--car-raio-sm);
	border: 1px solid transparent;
	font-weight: 600;
	font-size: 14px;
	line-height: 1.25;
	cursor: pointer;
	text-decoration: none;
	transition: background-color .18s ease, color .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.car-root .car-btn:hover { text-decoration: none; }
.car-root .car-btn:focus-visible { outline: 2px solid var(--car-azul); outline-offset: 2px; }
.car-root .car-btn[disabled] { background: var(--car-superficie-2); color: var(--car-texto-fraco); box-shadow: none; cursor: progress; }
.car-root .car-btn .car-ico { width: 1.2em; height: 1.2em; }

.car-btn--xl { padding: 16px 24px; font-size: 15px; }

/* Primária: ação principal. */
.car-btn--cta,
.car-btn--primaria {
	background-color: var(--car-primaria);
	color: #fff;
	box-shadow: var(--car-sombra-botao);
}
.car-root .car-btn--cta:hover,
.car-root .car-btn--primaria:hover {
	background-color: var(--car-primaria-ativa);
	color: #fff;
}

/* Secundária: fundo branco, borda e texto em Blue. */
.car-btn--contorno {
	background-color: var(--car-superficie);
	border-color: var(--car-azul);
	color: var(--car-azul);
}
.car-root .car-btn--contorno:hover { background-color: var(--car-azul-suave); color: var(--car-azul); }

/* Ghost: só texto. */
.car-btn--ghost {
	background: transparent;
	color: var(--car-azul);
}
.car-root .car-btn--ghost:hover { background-color: var(--car-selecionado); }

/* Sobre fundo navy. */
.car-btn--claro { background: #fff; color: var(--car-navy); }
.car-root .car-btn--claro:hover { background: var(--car-azul-suave); color: var(--car-navy); }

.car-btn--contorno-claro,
.car-btn--vidro {
	background: rgba(255, 255, 255, .08);
	border-color: rgba(255, 255, 255, .35);
	color: #fff;
}
.car-root .car-btn--contorno-claro:hover,
.car-root .car-btn--vidro:hover { background: rgba(255, 255, 255, .16); color: #fff; }

.car-root .car-link {
	background: none;
	border: 0;
	padding: 0;
	color: var(--car-azul);
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	text-align: left;
}
.car-root .car-link:hover { text-decoration: underline; }

/* ====================================================================== */
/* Blocos genéricos                                                        */
/* ====================================================================== */

.car-card {
	background: var(--car-superficie);
	border: 1px solid var(--car-linha);
	border-radius: var(--car-raio-lg);
	box-shadow: var(--car-sombra);
	padding: 24px;
}

.car-grid { display: grid; gap: 24px; }
.car-grid--2 { grid-template-columns: 1fr; }
.car-grid--3 { grid-template-columns: 1fr; }

@media (min-width: 768px) {
	.car-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
	.car-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.car-sub-titulo {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 16px;
	font-weight: 600;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--car-linha);
	margin-bottom: 24px;
}

.car-marca { width: 4px; height: 16px; border-radius: var(--car-pill); background: var(--car-azul); display: inline-block; }
.car-marca--sucesso { background: var(--car-sucesso); }

.car-secao { margin-top: 64px; }
.car-secao__titulo { font-size: clamp(24px, 3.5vw, 40px); font-weight: 600; }
.car-secao__sub { margin-top: 12px; color: var(--car-texto-suave); max-width: 42rem; font-size: 16px; }

.car-disclaimer {
	margin-top: 20px;
	font-size: 12px;
	line-height: 1.6;
	color: var(--car-texto-fraco);
}

/* Dentro do card do simulador o padding é dos blocos internos. */
.car-sim__card > [data-car="corpo"] > .car-disclaimer {
	padding: 0 24px 24px;
	margin-top: 16px;
}

.car-ajuda { margin-top: 6px; font-size: 12px; color: var(--car-texto-fraco); line-height: 1.5; }
.car-opcional { font-weight: 400; color: var(--car-texto-fraco); }

.car-erro { color: var(--car-erro); font-size: 14px; font-weight: 500; margin-top: 12px; }

/* Badge pill — padding 12×4, texto 12. */
.car-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 12px;
	border-radius: var(--car-pill);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.5;
}
.car-badge--sucesso { background: var(--car-sucesso-fundo); color: var(--car-sucesso); }
.car-badge--info { background: var(--car-azul-suave); color: var(--car-primaria); }

/* ====================================================================== */
/* Campos                                                                  */
/* ====================================================================== */

.car-campo { margin-bottom: 16px; }
.car-campo:last-child { margin-bottom: 0; }

.car-label {
	display: block;
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 6px;
	color: var(--car-texto);
}

.car-root input[type="text"],
.car-root input[type="email"],
.car-root input[type="tel"],
.car-root input[type="number"],
.car-root .car-select {
	width: 100%;
	height: 48px;
	padding: 0 14px;
	border: 1px solid var(--car-linha);
	border-radius: var(--car-raio-sm);
	background: var(--car-superficie);
	color: var(--car-texto);
	font-size: 15px;
	font-family: inherit;
	font-weight: 400;
	line-height: 1.3;
	transition: border-color .15s ease, box-shadow .15s ease;
	-webkit-appearance: none;
	appearance: none;
}

.car-root .car-select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23586E83' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 18px;
	padding-right: 40px;
}

.car-root input::placeholder { color: var(--car-texto-fraco); }

.car-root input:focus,
.car-root .car-select:focus {
	outline: none;
	border-color: var(--car-azul);
	box-shadow: 0 0 0 4px rgba(4, 150, 255, .15);
}

.car-root input.is-erro,
.car-root .car-select.is-erro { border-color: var(--car-erro); }
.car-root input.is-erro:focus { box-shadow: 0 0 0 4px rgba(217, 45, 32, .12); }

.car-input-prefixo { position: relative; }
.car-input-prefixo > span {
	position: absolute;
	left: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--car-texto-fraco);
	font-size: 14px;
	pointer-events: none;
}
/* .car-root precisa entrar aqui: sem ele a regra base de input vence por especificidade. */
.car-root .car-input-prefixo input { padding-left: 40px; }

.car-campo--dupla { display: grid; grid-template-columns: 96px 1fr; gap: 12px; }

.car-erro-campo {
	display: none;
	color: var(--car-erro);
	font-size: 12px;
	font-weight: 500;
	margin-top: 6px;
}
.car-erro-campo.is-visivel { display: block; }

.car-toggle { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.car-toggle__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 48px;
	padding: 0 12px;
	border: 1px solid var(--car-linha);
	border-radius: var(--car-raio-sm);
	background: var(--car-superficie);
	color: var(--car-texto-suave);
	font-weight: 500;
	font-size: 14px;
	cursor: pointer;
	transition: all .15s ease;
}
.car-toggle__btn:hover { background: var(--car-selecionado); }
.car-toggle__btn.is-ativo {
	border-color: var(--car-azul);
	color: var(--car-primaria);
	background: var(--car-selecionado);
	font-weight: 600;
}

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

.car-consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-top: 20px;
	font-size: 14px;
	color: var(--car-texto-suave);
	cursor: pointer;
	line-height: 1.5;
}
.car-consent input { margin-top: 3px; flex: 0 0 auto; width: 16px; height: 16px; accent-color: var(--car-azul); }
.car-consent a { color: var(--car-azul); }

.car-selo {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: var(--car-texto-fraco);
}

.car-turnstile { margin-top: 16px; }

/* ====================================================================== */
/* Simulador — estrutura comum                                             */
/* ====================================================================== */

.car-sim__card { padding: 0; overflow: hidden; }

.car-sim__head {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 24px;
	border-bottom: 1px solid var(--car-linha);
}

.car-sim__head-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px; height: 48px;
	border-radius: var(--car-raio);
	background: var(--car-azul-suave);
	color: var(--car-primaria);
	flex: 0 0 auto;
}
.car-sim__head-ico .car-ico { width: 24px; height: 24px; }

.car-sim__titulo { font-size: clamp(20px, 2.6vw, 24px); font-weight: 600; }
.car-sim__sub { margin-top: 4px; font-size: 14px; color: var(--car-texto-suave); }

.car-sim__corpo { padding: 24px; }

.car-aviso {
	display: flex;
	gap: 12px;
	margin: 24px 24px 0;
	padding: 16px;
	border: 1px solid var(--car-alerta);
	background: var(--car-alerta-fundo);
	color: var(--car-alerta-texto);
	border-radius: var(--car-raio);
	font-size: 14px;
	line-height: 1.55;
}
.car-aviso__ico { flex: 0 0 auto; margin-top: 2px; }
.car-aviso__ico .car-ico { width: 20px; height: 20px; }

/* Cards de resultado do simulador de autônomos */
.car-box {
	border: 1px solid var(--car-linha);
	border-radius: var(--car-raio);
	padding: 16px;
	background: var(--car-superficie);
	margin-bottom: 16px;
	transition: border-color .18s ease;
}
.car-box:hover { border-color: var(--car-azul); }

.car-box__topo { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 12px; }
.car-box__nome { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 15px; }
.car-box__valor { font-weight: 600; font-size: 20px; letter-spacing: -0.02em; white-space: nowrap; }

.car-ponto { width: 8px; height: 8px; border-radius: var(--car-pill); background: var(--car-azul); display: inline-block; }
.car-ponto--sucesso { background: var(--car-sucesso); }

.car-box__linhas { border-top: 1px solid var(--car-linha); padding-top: 12px; font-size: 12px; }
.car-box__linhas > div { display: flex; justify-content: space-between; gap: 16px; padding: 3px 0; color: var(--car-texto-suave); }
.car-box__linhas b { color: var(--car-texto); font-weight: 500; text-align: right; }
.car-box__linhas b.is-alerta { color: var(--car-alerta-texto); }

.car-economia {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 16px;
	border: 1px solid var(--car-sucesso-fundo);
	background: var(--car-sucesso-fundo);
	border-radius: var(--car-raio);
}
.car-economia__titulo { font-weight: 600; font-size: 14px; color: var(--car-sucesso); }
.car-economia__sub { font-size: 12px; color: var(--car-texto-suave); margin-top: 2px; }
.car-economia__direita { text-align: right; }
.car-economia__valor {
	font-size: clamp(24px, 4vw, 32px);
	font-weight: 600;
	letter-spacing: -0.03em;
	color: var(--car-sucesso);
	white-space: nowrap;
}
.car-economia__nota {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: var(--car-sucesso);
	margin-top: 2px;
}
.car-economia.is-manter { border-color: var(--car-azul-suave); background: var(--car-azul-suave); }
.car-economia.is-manter .car-economia__titulo,
.car-economia.is-manter .car-economia__valor,
.car-economia.is-manter .car-economia__nota { color: var(--car-primaria); }

/* Veredito */
.car-veredito {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	padding: 24px;
	border-top: 1px solid var(--car-linha);
	background: var(--car-selecionado);
}

.car-veredito__ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px; height: 48px;
	border-radius: var(--car-raio);
	background: var(--car-azul-suave);
	color: var(--car-primaria);
	flex: 0 0 auto;
}
.car-veredito__ico .car-ico { width: 24px; height: 24px; }
.car-veredito.is-manter .car-veredito__ico { background: #fff; }

.car-veredito__corpo { flex: 1 1 auto; min-width: 0; }
.car-veredito__titulo {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: clamp(17px, 2.4vw, 20px);
	font-weight: 600;
}
.car-veredito__titulo .car-ico { color: var(--car-azul); }
.car-veredito__texto { margin-top: 8px; font-size: 14px; color: var(--car-texto-suave); line-height: 1.6; }
.car-veredito__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }

/* ====================================================================== */
/* Trava de resultado (blur + overlay)                                     */
/* ====================================================================== */

.car-trava { position: relative; }

.car-trava__conteudo { transition: filter .3s ease; }

.car-trava.is-travado .car-trava__conteudo {
	filter: blur(7px);
	user-select: none;
	pointer-events: none;
}

.car-trava__overlay {
	position: absolute;
	inset: 0;
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 4px;
	padding: 24px;
	border-radius: var(--car-raio);
	background: linear-gradient(180deg, rgba(250, 250, 250, .55) 0%, rgba(250, 250, 250, .94) 55%);
}
.car-trava.is-travado .car-trava__overlay { display: flex; }

.car-trava__ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px; height: 44px;
	border-radius: var(--car-pill);
	background: var(--car-primaria);
	color: #fff;
	margin-bottom: 8px;
	box-shadow: var(--car-sombra-botao);
}
.car-trava__ico .car-ico { width: 20px; height: 20px; }
.car-trava__titulo { font-weight: 600; font-size: 17px; letter-spacing: -0.02em; }
.car-trava__texto { font-size: 14px; color: var(--car-texto-suave); margin-bottom: 12px; max-width: 22rem; }

/* Portão "form antes": o cadastro no lugar do simulador */
.car-portao { padding: 40px 24px 32px; }
.car-portao__topo { text-align: center; max-width: 34rem; margin: 0 auto; }
.car-portao__form { max-width: 40rem; margin: 28px auto 0; }
.car-portao .car-form__rodape { justify-content: center; text-align: center; }
@media (min-width: 640px) { .car-portao .car-form__rodape { flex-direction: column; gap: 12px; } }
.car-portao .car-form__ok { padding-top: 8px; }
.car-form__ok p, .car-modal__ok p { white-space: pre-line; font-size: 15px; line-height: 1.6; max-width: 34rem; }
.car-form__ok.is-nao-atendido .car-modal__ok-ico { background: var(--car-alerta-fundo); color: var(--car-alerta-texto); }
.car-form__ok.is-nao-atendido p { color: var(--car-texto); font-weight: 500; }
.car-portao__ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px; height: 52px;
	border-radius: var(--car-pill);
	background: var(--car-azul-suave);
	color: var(--car-primaria);
	margin-bottom: 16px;
}
.car-portao__ico .car-ico { width: 24px; height: 24px; }
.car-portao h3 { font-size: 22px; font-weight: 600; }
.car-portao p { margin: 10px auto 24px; color: var(--car-texto-suave); max-width: 28rem; font-size: 15px; }

/* ====================================================================== */
/* Simulador de empresas                                                   */
/* ====================================================================== */

.car-emp__hero {
	position: relative;
	overflow: hidden;
	background-color: var(--car-navy);
	color: #fff;
	border-radius: var(--car-raio-lg);
	padding: 32px 24px;
	margin-bottom: 24px;
}
/* Gradiente da marca só como assinatura no topo do bloco. */
.car-emp__hero::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background-image: var(--car-gradiente);
}
.car-emp__hero-topo { display: flex; align-items: center; gap: 14px; }
.car-emp__hero-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px; height: 44px;
	border-radius: var(--car-raio-sm);
	background: rgba(255, 255, 255, .12);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
	flex: 0 0 auto;
}
.car-emp__hero-ico .car-ico { width: 22px; height: 22px; }
.car-emp__sobretitulo { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: rgba(255, 255, 255, .7); font-weight: 500; }
.car-emp__titulo { font-size: clamp(20px, 3vw, 28px); font-weight: 600; color: #fff; margin-top: 2px; }
.car-emp__sub { margin-top: 16px; max-width: 48rem; font-size: 15px; color: rgba(255, 255, 255, .82); line-height: 1.6; }
.car-emp__hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.car-emp__hero .car-logo { height: 24px; margin-bottom: 20px; opacity: .95; }

.car-abas { margin-bottom: 24px; }
.car-abas__nav { display: grid; gap: 4px; margin-bottom: 12px; }
@media (min-width: 640px) { .car-abas__nav { grid-template-columns: repeat(3, 1fr); } }

.car-abas__btn {
	padding: 12px 16px;
	border: 1px solid transparent;
	background: var(--car-superficie-2);
	border-radius: var(--car-raio-sm);
	font-weight: 500;
	font-size: 14px;
	color: var(--car-texto-suave);
	cursor: pointer;
	transition: all .15s ease;
}
.car-abas__btn:hover { background: var(--car-selecionado); color: var(--car-primaria); }
.car-abas__btn.is-ativo {
	background: var(--car-superficie);
	color: var(--car-texto);
	border-color: var(--car-linha);
	font-weight: 600;
	box-shadow: var(--car-sombra);
}

.car-abas__painel {
	background: var(--car-superficie);
	border: 1px solid var(--car-linha);
	border-radius: var(--car-raio-lg);
	padding: 24px;
	font-size: 15px;
	line-height: 1.65;
	color: var(--car-texto-suave);
}
.car-abas__painel h3 { font-size: 16px; margin-bottom: 8px; color: var(--car-texto); }
.car-abas__painel strong { color: var(--car-texto); font-weight: 600; }

.car-passo {
	border-left: 3px solid var(--car-azul);
	background: var(--car-selecionado);
	padding: 12px 16px;
	border-radius: 0 var(--car-raio-sm) var(--car-raio-sm) 0;
	font-size: 14px;
	color: var(--car-texto-suave);
	margin-bottom: 24px;
}
.car-passo strong { color: var(--car-texto); font-weight: 600; }

.car-emp__form .car-btn--xl { margin-top: 8px; width: 100%; }
@media (min-width: 640px) { .car-emp__form .car-btn--xl { width: auto; } }

.car-emp__resultado { margin-top: 32px; }
.car-emp__res-titulo { font-size: clamp(22px, 3vw, 28px); font-weight: 600; }
.car-emp__res-sub { margin: 8px 0 24px; font-size: 13px; color: var(--car-texto-fraco); line-height: 1.6; }

.car-res-card {
	border: 1px solid var(--car-linha);
	border-radius: var(--car-raio-lg);
	background: var(--car-superficie);
	padding: 20px;
	box-shadow: var(--car-sombra);
}
.car-res-card.is-melhor { border-color: var(--car-azul); box-shadow: 0 0 0 3px rgba(4, 150, 255, .12), var(--car-sombra); }
.car-res-card__nome { font-size: 13px; font-weight: 500; color: var(--car-texto-suave); }
.car-res-card__valor {
	font-size: clamp(24px, 4vw, 32px);
	font-weight: 600;
	letter-spacing: -0.03em;
	margin: 6px 0 4px;
}
.car-res-card.is-melhor .car-res-card__valor { color: var(--car-primaria); }
.car-res-card__nota { font-size: 12px; color: var(--car-texto-fraco); }
.car-res-card__badge {
	display: inline-block;
	margin-top: 10px;
	padding: 4px 12px;
	border-radius: var(--car-pill);
	background: var(--car-azul-suave);
	color: var(--car-primaria);
	font-size: 12px;
	font-weight: 600;
}

.car-matriz-wrap { margin-top: 24px; padding: 24px; }
.car-matriz__titulo { font-size: 16px; font-weight: 600; }
.car-matriz__sub { font-size: 13px; color: var(--car-texto-fraco); margin-top: 4px; }
.car-matriz__scroll { overflow-x: auto; margin-top: 16px; }

.car-root table.car-matriz {
	width: 100%;
	min-width: 680px;
	border-collapse: collapse;
	font-size: 13px;
}
.car-root .car-matriz th,
.car-root .car-matriz td {
	text-align: left;
	padding: 12px;
	border-bottom: 1px solid var(--car-linha);
	vertical-align: top;
}
.car-root .car-matriz thead th { font-weight: 600; color: var(--car-texto); }
.car-matriz__col-sub { display: block; font-weight: 400; font-size: 11px; color: var(--car-texto-fraco); margin-top: 2px; }
.car-root .car-matriz tbody th { font-weight: 400; color: var(--car-texto-suave); width: 30%; }
.car-matriz tr.is-destaque th,
.car-matriz tr.is-destaque td { font-weight: 600; background: var(--car-superficie-2); }
.car-cel__sub { display: block; font-size: 11px; color: var(--car-texto-fraco); margin-top: 2px; font-weight: 400; }
.car-cel--sucesso { color: var(--car-sucesso); font-weight: 500; }
.car-cel--alerta { color: var(--car-erro); font-weight: 500; }
.car-cel--primaria { color: var(--car-primaria); }
.car-cel--apagado { color: var(--car-texto-fraco); }

.car-relatorio {
	display: flex;
	gap: 16px;
	margin-top: 24px;
	padding: 24px;
	border: 1px solid var(--car-linha);
	background: var(--car-selecionado);
	border-radius: var(--car-raio-lg);
}
.car-relatorio__ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px; height: 36px;
	border-radius: var(--car-raio-sm);
	background: var(--car-azul-suave);
	color: var(--car-primaria);
	flex: 0 0 auto;
}
.car-relatorio__ico .car-ico { width: 18px; height: 18px; }
.car-relatorio__titulo { font-size: 12px; font-weight: 600; color: var(--car-primaria); text-transform: uppercase; letter-spacing: .04em; }
.car-relatorio__destaque { font-size: 17px; font-weight: 600; letter-spacing: -0.02em; margin: 4px 0 14px; }
.car-relatorio__p { font-size: 14px; line-height: 1.65; color: var(--car-texto-suave); margin-bottom: 10px; }
.car-relatorio__p strong { color: var(--car-texto); font-weight: 600; }

.car-cta-box {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: 24px;
}
@media (min-width: 768px) {
	.car-cta-box { flex-direction: row; align-items: center; justify-content: space-between; }
}
.car-cta-box__titulo { font-size: 17px; font-weight: 600; }
.car-cta-box__texto { font-size: 14px; color: var(--car-texto-suave); margin-top: 4px; max-width: 32rem; }
.car-cta-box__botoes { display: flex; flex-wrap: wrap; gap: 12px; flex: 0 0 auto; }

/* ====================================================================== */
/* Hub                                                                     */
/* ====================================================================== */

.car-hub { background: var(--car-fundo); }

/* Capa: navy institucional. O gradiente entra como assinatura, não como fundo de leitura. */
.car-hero {
	position: relative;
	overflow: hidden;
	background-color: var(--car-navy);
	background-image: linear-gradient(160deg, var(--car-navy) 0%, var(--car-navy-escuro) 100%);
}
.car-hero::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background-image: var(--car-gradiente);
	z-index: 2;
}
/* Brilho discreto da marca no canto, bem abaixo do texto. */
.car-hero::after {
	content: "";
	position: absolute;
	right: -10%;
	top: -30%;
	width: 55%;
	padding-bottom: 55%;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(4, 150, 255, .35) 0%, rgba(84, 56, 220, .18) 45%, transparent 70%);
	pointer-events: none;
}
.car-hero__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .18;
	pointer-events: none;
}
.car-hero__conteudo {
	position: relative;
	z-index: 1;
	max-width: 72rem;
	margin: 0 auto;
	padding: 64px 24px;
	color: #fff;
}
@media (min-width: 640px) { .car-hero__conteudo { padding: 96px 24px; } }

.car-hero .car-logo { height: 32px; margin-bottom: 32px; }

.car-hero__badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 14px;
	border-radius: var(--car-pill);
	border: 1px solid rgba(255, 255, 255, .2);
	background: rgba(255, 255, 255, .08);
	color: #fff;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .04em;
}
.car-hero__badge .car-ico { color: var(--car-aqua); }

.car-hero__titulo {
	margin-top: 24px;
	max-width: 48rem;
	color: #fff;
	font-size: clamp(32px, 6vw, 56px);
	font-weight: 700;
	line-height: 1.08;
	letter-spacing: -0.035em;
}
.car-hero__sub {
	margin-top: 20px;
	max-width: 38rem;
	color: rgba(255, 255, 255, .8);
	font-size: clamp(16px, 2.2vw, 18px);
	line-height: 1.6;
}
.car-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }

.car-hero__stats {
	display: grid;
	gap: 16px;
	margin-top: 48px;
	max-width: 46rem;
}
@media (min-width: 640px) { .car-hero__stats { grid-template-columns: repeat(3, 1fr); } }

.car-stat {
	border: 1px solid rgba(255, 255, 255, .14);
	background: rgba(255, 255, 255, .07);
	border-radius: var(--car-raio);
	padding: 16px;
}
.car-stat__ico { color: var(--car-aqua); display: block; }
.car-stat__ico .car-ico { width: 18px; height: 18px; }
.car-stat__valor { margin-top: 12px; font-size: 20px; font-weight: 600; color: #fff; letter-spacing: -0.02em; }
.car-stat__label { font-size: 12px; color: rgba(255, 255, 255, .65); }

.car-hub__main { max-width: 72rem; margin: 0 auto; padding: 64px 24px; }

.car-canais { margin-top: 40px; align-items: start; }
.car-canal { display: flex; flex-direction: column; gap: 16px; }

.car-canal__topo {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 20px;
	border: 1px solid var(--car-linha);
	background: var(--car-superficie);
	border-radius: var(--car-raio);
	box-shadow: var(--car-sombra);
}
.car-canal__ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px; height: 40px;
	border-radius: var(--car-raio-sm);
	background: var(--car-azul-suave);
	color: var(--car-primaria);
	flex: 0 0 auto;
}
.car-canal__ico .car-ico { width: 20px; height: 20px; }
.car-canal__nome { font-size: 16px; font-weight: 600; }
.car-canal__sub { font-size: 12px; color: var(--car-texto-suave); }

.car-artigo {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	padding: 24px;
	border: 1px solid var(--car-linha);
	background: var(--car-superficie);
	border-radius: var(--car-raio-lg);
	box-shadow: var(--car-sombra);
	transition: border-color .2s ease, box-shadow .2s ease;
}
.car-artigo:hover { border-color: var(--car-azul); box-shadow: var(--car-sombra-alta); }
.car-artigo__n { font-size: 12px; font-weight: 600; color: var(--car-azul); }
.car-artigo__titulo { margin-top: 8px; font-size: 17px; font-weight: 600; line-height: 1.35; }
.car-artigo__intro {
	margin-top: 12px;
	flex: 1 1 auto;
	font-size: 14px;
	color: var(--car-texto-suave);
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.car-artigo .car-link { margin-top: 16px; }

.car-sim-cards { margin-top: 32px; }
.car-sim-card {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 24px;
	border: 1px solid var(--car-linha);
	background: var(--car-superficie);
	border-radius: var(--car-raio-lg);
	box-shadow: var(--car-sombra);
	text-decoration: none;
	color: inherit;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.car-sim-card:hover { border-color: var(--car-azul); box-shadow: var(--car-sombra-alta); text-decoration: none; color: inherit; }
.car-sim-card__ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px; height: 48px;
	border-radius: var(--car-raio-sm);
	background: var(--car-azul-suave);
	color: var(--car-primaria);
}
.car-sim-card__ico .car-ico { width: 24px; height: 24px; }
.car-sim-card__titulo { font-size: 20px; font-weight: 600; }
.car-sim-card__texto { font-size: 14px; color: var(--car-texto-suave); margin-top: 8px; }
.car-sim-card__cta {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 600;
	color: var(--car-azul);
}

.car-hub__footer {
	border-top: 1px solid var(--car-linha);
	background: var(--car-superficie);
	padding: 40px 24px;
	font-size: 14px;
	color: var(--car-texto-suave);
}
.car-hub__footer-caixa {
	max-width: 72rem;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	text-align: center;
}
@media (min-width: 640px) {
	.car-hub__footer-caixa { flex-direction: row; justify-content: space-between; text-align: left; }
}
.car-hub__footer .car-logo { height: 26px; }

/* Cartilha */
.car-cartilha { padding: 24px; }
@media (min-width: 640px) { .car-cartilha { padding: 40px; } }
.car-cartilha__topo { max-width: 42rem; margin-bottom: 32px; }
.car-cartilha__titulo { margin-top: 16px; font-size: clamp(22px, 3vw, 32px); font-weight: 600; }
.car-cartilha__texto { margin-top: 12px; color: var(--car-texto-suave); font-size: 15px; }

.car-modal__selo {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 12px;
	border-radius: var(--car-pill);
	background: var(--car-sucesso-fundo);
	color: var(--car-sucesso);
	font-size: 12px;
	font-weight: 600;
}

.car-form__grid { display: grid; gap: 16px; }
@media (min-width: 640px) { .car-form__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.car-form__rodape {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	margin-top: 24px;
}
@media (min-width: 640px) { .car-form__rodape { flex-direction: row; align-items: center; } }

.car-form__erro {
	margin-top: 16px;
	padding: 12px 16px;
	border-radius: var(--car-raio-sm);
	background: var(--car-erro-fundo);
	border: 1px solid rgba(217, 45, 32, .25);
	color: var(--car-erro);
	font-size: 14px;
	font-weight: 500;
}

.car-form__ok, .car-modal__ok {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 12px;
	padding: 32px 16px;
}
.car-modal__ok-ico {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px; height: 48px;
	border-radius: var(--car-pill);
	background: var(--car-sucesso-fundo);
	color: var(--car-sucesso);
}
.car-modal__ok-ico .car-ico { width: 24px; height: 24px; }

/* ====================================================================== */
/* Modais                                                                  */
/* ====================================================================== */

.car-modal {
	position: fixed;
	inset: 0;
	z-index: 999990;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
}

.car-modal__fundo {
	position: absolute;
	inset: 0;
	background: rgba(0, 43, 81, .55);
	backdrop-filter: blur(2px);
}

.car-modal__caixa {
	position: relative;
	width: 100%;
	max-width: 42rem;
	max-height: 88vh;
	overflow-y: auto;
	background: var(--car-superficie);
	border-radius: var(--car-raio-lg);
	box-shadow: var(--car-sombra-alta);
	padding: 32px 24px;
	animation: car-sobe .22s ease;
}
@media (min-width: 640px) { .car-modal__caixa { padding: 36px; } }

@keyframes car-sobe {
	from { opacity: 0; transform: translateY(14px); }
	to { opacity: 1; transform: none; }
}

.car-modal__x {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 34px;
	height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: var(--car-pill);
	background: var(--car-superficie-2);
	color: var(--car-texto-suave);
	cursor: pointer;
}
.car-modal__x:hover { background: var(--car-linha); color: var(--car-texto); }

.car-modal__topo { margin-bottom: 24px; padding-right: 32px; }
.car-modal__titulo { margin-top: 14px; font-size: clamp(20px, 3vw, 28px); font-weight: 600; }
.car-modal__texto { margin-top: 10px; color: var(--car-texto-suave); font-size: 15px; }

.car-artigo-modal__titulo { font-size: clamp(20px, 3vw, 24px); font-weight: 600; line-height: 1.3; padding-right: 32px; }
.car-artigo-modal__intro { margin-top: 16px; font-size: 15px; color: var(--car-texto-suave); line-height: 1.65; }
.car-artigo-modal__rotulo {
	margin-top: 28px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--car-alerta-texto);
}
.car-ponto-alerta {
	margin-top: 12px;
	padding: 16px;
	border: 1px solid var(--car-alerta);
	background: var(--car-alerta-fundo);
	border-radius: var(--car-raio-sm);
}
.car-ponto-alerta__titulo {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
	color: var(--car-alerta-texto);
	font-size: 15px;
}
.car-ponto-alerta__texto { margin-top: 8px; font-size: 14px; line-height: 1.6; color: var(--car-alerta-texto); opacity: .92; }

.car-artigo-modal__solucao {
	margin-top: 24px;
	padding: 20px;
	border: 1px solid var(--car-sucesso-fundo);
	background: var(--car-sucesso-fundo);
	border-radius: var(--car-raio-sm);
}
.car-artigo-modal__solucao-titulo { font-weight: 600; color: var(--car-sucesso); font-size: 15px; }
.car-artigo-modal__solucao p { margin-top: 8px; font-size: 14px; line-height: 1.6; color: var(--car-texto); }
.car-artigo-modal__solucao .car-btn { margin-top: 16px; }

@media (prefers-reduced-motion: reduce) {
	.car-root *, .car-root *::before, .car-root *::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
	}
}