.section-padding-min {
	padding: 60px 0;
}

.pg_item h2 {
	text-transform: uppercase;
}

.btn-cta {
	border-radius: 4px;
	padding: 10px 10px;
	background-color: #000 !important;
}

.form-group {
	margin-bottom: 15px;
}
.form-group .col-sm-6 {
	padding-left: 10px;
	padding-right: 10px;
}

section.cta {
	background-image: url('../images/cta/background-topo-nova.png');
	background-position: top center;
	min-height: 600px;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
}
/* A foto de fundo é clara/acinzentada e não tinha nenhuma camada escura por
 * cima (diferente das outras seções com foto do site), o que apagava o
 * quadrado branco do formulário e o texto. O .container recebe z-index pra
 * ficar por cima do .dark-overlay (mesmo truque usado no cabeçalho das
 * páginas de Contato/Revendas/Cadastro). */
.is-portal .cta > .container {
	position: relative;
	z-index: 1;
}
.is-portal .cta h1,
.is-portal .cta .lead,
.is-portal .cta h5,
.is-portal .cta .control-label {
	color: #fff;
}

.whatsapp-float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 20px;
    right: 20px;
    background-color: #25d366; /* Fundo do botão */
    border-radius: 50px; /* Deixa o botão redondo */
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2); /* Sombra do botão */
    text-align: center;
    z-index: 1000;
    transition: all 0.3s ease-in-out;
    display: flex;
    justify-content: center;
    align-items: center;
}

.whatsapp-float:hover {
    transform: scale(1.1); /* Aumenta o botão ao passar o mouse */
}

.whatsapp-icon {
    width: 30px; /* Largura do ícone */
    height: 30px; /* Altura do ícone */
}

/* ---------------------------------------------------------------------------
 * Site institucional (autow.com.br) — ajustes leves.
 *
 * O tema base ja alterna secoes claras e escuras; a ideia aqui e so dar um
 * acento de marca, sem trocar a identidade do site. Tudo escopado em
 * .is-portal para nao vazar para o site das revendas clientes, que usam as
 * cores cadastradas por elas.
 * ------------------------------------------------------------------------- */

/* Faixa do hero: degrade do preto para o azul da logo. E o unico bloco
 * totalmente escuro da home — o resto do ritmo claro/escuro fica por conta
 * do tema. */
.is-portal .hero-autow {
	background: linear-gradient(160deg, #000 0%, var(--hero-meio) 45%, var(--marca) 100%);
	color: #fff;
	padding: 70px 0 60px;
}
.is-portal .hero-autow h1 {
	color: #fff;
	font-weight: 700;
	margin-bottom: 18px;
}
.is-portal .hero-autow p {
	color: rgba(255,255,255,.85);
	font-size: 17px;
	max-width: 620px;
}
.is-portal .hero-autow .btn-cta {
	background: #fff !important;
	color: var(--marca);
	font-weight: 700;
	border: none;
	border-radius: 6px;
	padding: 14px 34px;
	margin-top: 12px;
}
.is-portal .hero-autow .btn-cta:hover {
	background: var(--marca-fundo) !important;
	color: var(--marca-escura);
}
.is-portal .hero-autow-img {
	max-width: 100%;
	height: auto;
}

/* Selo acima do título: diz logo de cara para quem é este site, já que há
 * um segundo produto (autow agrícola) para revendas de máquinas. */
.is-portal .hero-autow .hero-selo {
	display: inline-block;
	padding: 5px 12px;
	border-radius: 999px;
	background: rgba(255,255,255,.14);
	border: 1px solid rgba(255,255,255,.25);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	margin-bottom: 14px;
}
.is-portal .hero-autow .hero-troca {
	margin-top: 18px;
	font-size: 15px;
}
.is-portal .hero-autow .hero-troca a {
	color: #fff;
	opacity: .85;
	text-decoration: underline;
}
.is-portal .hero-autow .hero-troca a:hover,
.is-portal .hero-autow .hero-troca a:focus {
	opacity: 1;
}

/* Cantos arredondados nos cartoes e campos — o tema nao arredonda nada hoje. */
.layout-novo .contact_form,
.layout-novo .contact_form .form-control,
.layout-novo .contact_form textarea {
	border-radius: 6px;
}

/* Rolagem suave nos links âncora (os cartões de tópicos levam para a seção). */
html {
	scroll-behavior: smooth;
}

/* ---------------------------------------------------------------------------
 * Cadastro trial: formulario longo, entao e agrupado em tres blocos numerados
 * para quem preenche saber onde esta e quanto falta.
 * ------------------------------------------------------------------------- */
.layout-novo .contact_form {
	background: #fff;
	border: 1px solid #e6e8ec;
	border-radius: 10px;
	box-shadow: 0 2px 14px rgba(16, 24, 40, .06);
	padding: 28px 30px 24px;
}
.is-portal .grupo-campos {
	border: 0;
	padding: 0;
	margin: 0 0 6px;
}
.is-portal .grupo-campos + .grupo-campos {
	margin-top: 22px;
	padding-top: 22px;
	border-top: 1px solid #eef0f4;
}
.is-portal .grupo-campos legend {
	border: 0;
	margin-bottom: 16px;
	padding: 0;
	font-size: 15px;
	font-weight: 700;
	color: #1a1a1a;
	text-transform: uppercase;
	letter-spacing: .04em;
}
.is-portal .grupo-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	margin-right: 8px;
	border-radius: 50%;
	background: var(--marca);
	color: #fff;
	font-size: 13px;
	line-height: 1;
}
.layout-novo .contact_form .control-label {
	font-weight: 600;
	font-size: 13px;
	color: #3a4150;
	margin-bottom: 5px;
}
.layout-novo .contact_form .control-label span {
	color: #e5484d;
	margin-left: 2px;
}
.layout-novo .contact_form .form-control {
	height: 44px;
	border: 1px solid #d8dce3;
	border-radius: 6px;
	box-shadow: none;
	font-size: 15px;
	padding: 8px 13px;
	transition: border-color .15s, box-shadow .15s;
}
.layout-novo .contact_form .form-control:focus {
	border-color: var(--marca);
	box-shadow: 0 0 0 3px rgba(var(--marca-rgb), .12);
}
.layout-novo .contact_form .form-control::placeholder {
	color: #a8afbb;
}
.layout-novo .ajuda-campo {
	display: block;
	margin-top: 5px;
	font-size: 12.5px;
	color: #6b7280;
	line-height: 1.4;
}

/* Captcha por conta de somar: a operacao fica colada ao campo, para ler como
 * uma frase so em vez de dois elementos soltos. */
.is-portal .captcha-linha {
	display: flex;
	align-items: center;
	gap: 10px;
}
.is-portal .captcha-conta {
	font-size: 19px;
	font-weight: 700;
	color: #1a1a1a;
	background: #f2f4f7;
	border-radius: 6px;
	padding: 9px 14px;
	white-space: nowrap;
	user-select: none;
}
.is-portal .captcha-linha .form-control {
	max-width: 110px;
}

.layout-novo .acao-cadastro {
	margin-top: 24px;
	margin-bottom: 0;
}
.layout-novo .btn-criar-conta {
	background: var(--marca);
	color: var(--marca-contraste, #fff);
	border: none;
	border-radius: 6px;
	padding: 14px 30px;
	font-weight: 700;
	font-size: 15px;
	width: 100%;
}
.layout-novo .btn-criar-conta:hover,
.layout-novo .btn-criar-conta:focus {
	background: var(--marca-escura);
	color: var(--marca-contraste, #fff);
}
.layout-novo .acao-cadastro .ajuda-campo {
	text-align: center;
	margin-top: 10px;
}

/* O tema pinta o texto dos campos de #888 — mais claro que o rotulo, o que
 * deixa o que a pessoa digitou parecendo desabilitado. */
.layout-novo .contact_form .form-control {
	color: #1a1a1a;
}
/* Bootstrap 3 nao traz .text-success/.text-danger com contraste bom sobre
 * branco; aqui os avisos precisam ser lidos de relance. */
.layout-novo .ajuda-campo.text-success { color: #1a7f37; }
.layout-novo .ajuda-campo.text-danger  { color: #d1242f; }

/* ---------------------------------------------------------------------------
 * Site institucional: cores de marca em variáveis. As regras novas (cadastro,
 * topo, barra do celular) usam só estas; trocar a cor de um dos sites é
 * redefinir as variáveis em .is-portal.site-<site>.
 * ------------------------------------------------------------------------- */
.is-portal {
	--marca: #0066FF;
	--marca-escura: #0052cc;
	--marca-suave: #e6f0ff;
	--marca-rgb: 0, 102, 255;
	--marca-fundo: #f0f4ff;
	--hero-meio: #001a4d;
	--texto-forte: #101828;
	--texto-medio: #475467;
	--borda-suave: #e4e7ec;
	/* Fundo das seções alternadas da home: um cinza quase branco. */
	--fundo-secao: #f7f9fc;
}

/* ---------------------------------------------------------------------------
 * Cadastro em duas colunas. Celular (padrão): título e garantias, formulário
 * logo em seguida, e o resto (benefícios, como funciona, dúvidas) embaixo.
 * Desktop: texto curto à esquerda, formulário fixo à direita enquanto se lê
 * e as dúvidas numa faixa embaixo das duas colunas.
 * ------------------------------------------------------------------------- */
.is-portal .cadastro-trial {
	background: linear-gradient(180deg, var(--marca-suave) 0, #f7f9fc 360px, #fff 760px);
	padding: 28px 0 56px;
}
.is-portal .cadastro-grid {
	display: flex;
	flex-direction: column;
	gap: 28px;
}
.is-portal .cadastro-selo {
	display: inline-block;
	padding: 5px 12px;
	border-radius: 999px;
	background: rgba(var(--marca-rgb), .1);
	color: var(--marca-escura);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	margin-bottom: 14px;
}
.is-portal .cadastro-intro h1 {
	font-size: 30px;
	line-height: 1.15;
	font-weight: 900;
	color: var(--texto-forte);
	margin: 0 0 12px;
}
.is-portal .cadastro-lead {
	font-size: 16px;
	line-height: 1.55;
	color: var(--texto-medio);
	margin: 0 0 16px;
}
.is-portal .cadastro-garantias {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}
.is-portal .cadastro-garantias li {
	display: inline-flex;
	margin: 0;
	align-items: center;
	gap: 6px;
	padding: 6px 11px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--borda-suave);
	color: var(--texto-forte);
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
}
.is-portal .cadastro-garantias li i {
	color: var(--marca);
	font-size: 14px;
}

/* Cartão do formulário. */
.layout-novo .contact_form.cadastro-card {
	/* O tema dá 50px embaixo do formulário; aqui o WhatsApp vem logo depois. */
	margin-bottom: 0;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	box-shadow: 0 12px 32px rgba(16, 24, 40, .08), 0 2px 6px rgba(16, 24, 40, .04);
	padding: 22px 18px 20px;
}
.layout-novo .cadastro-alerta {
	border-radius: 8px;
	margin-bottom: 18px;
	font-size: 14px;
}

/* O tema dá 35px entre campos e margem embaixo de cada input: no cartão
 * isso esticava cada etapa sem necessidade. */
.layout-novo .cadastro-card .form-group {
	margin-bottom: 16px;
}
.layout-novo .cadastro-card .form-control {
	margin-bottom: 0;
}
/* Progresso e botões de etapa só existem com JS (o JS põe .etapas-ativas no
 * form); sem JS as três etapas aparecem juntas, como antes. */
.is-portal .so-js {
	display: none;
}
.is-portal .etapas-ativas .so-js {
	display: block;
}
.is-portal .etapas-ativas .grupo-campos {
	display: none;
}
.is-portal .etapas-ativas .grupo-campos.etapa-atual {
	display: block;
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}
.is-portal .etapas-ativas .grupo-num {
	display: none;
}
.is-portal .cadastro-progresso {
	margin-bottom: 20px;
}
.is-portal .etapas-ativas .cadastro-progresso-topo {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--texto-medio);
}
.is-portal .cadastro-voltar {
	background: none;
	border: 0;
	padding: 0;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	color: var(--texto-medio);
}
.is-portal .cadastro-voltar:hover,
.is-portal .cadastro-voltar:focus {
	color: var(--marca);
}
.is-portal .cadastro-progresso-barra {
	display: flex;
	gap: 6px;
}
.is-portal .cadastro-progresso-barra span {
	flex: 1 1 0;
	height: 6px;
	border-radius: 3px;
	background: var(--borda-suave);
	transition: background .25s;
}
.is-portal .cadastro-progresso-barra span.feita {
	background: var(--marca);
}
.is-portal .etapas-ativas .grupo-campos legend {
	font-size: 22px;
	font-weight: 900;
	text-transform: none;
	letter-spacing: 0;
	color: var(--texto-forte);
	margin-bottom: 2px;
}
.is-portal .grupo-dica {
	font-size: 14px;
	color: var(--texto-medio);
	margin: -8px 0 16px;
}
.is-portal .etapas-ativas .grupo-dica {
	margin-top: 0;
}
.is-portal .cadastro-navegacao {
	margin-top: 8px;
}
.layout-novo .cadastro-navegacao .ajuda-campo {
	text-align: center;
	margin-top: 10px;
}
.layout-novo .btn-criar-conta {
	min-height: 52px;
	font-size: 16px;
	box-shadow: 0 6px 16px rgba(var(--marca-rgb), .28);
}
.layout-novo .btn-criar-conta .fa-arrow-right {
	margin-left: 8px;
}

/* Endereço do site com o domínio colado ao campo, para ficar claro que só se
 * digita o começo. */
.is-portal .campo-endereco .form-control {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.is-portal .campo-endereco .input-group-addon {
	background: #f2f4f7;
	border: 1px solid #d8dce3;
	border-left: 0;
	border-radius: 0 6px 6px 0;
	color: var(--texto-medio);
	font-size: 14px;
	font-weight: 600;
}

/* Coluna de detalhes: curta, perto da altura do formulário no desktop. */
.is-portal .cadastro-titulo-bloco {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--texto-medio);
	margin: 0 0 12px;
}
.is-portal .cadastro-beneficios,
.is-portal .cadastro-como {
	list-style: none;
	padding: 0;
	margin: 0;
}
.is-portal .cadastro-vantagens {
	margin-bottom: 28px;
}
.is-portal .cadastro-beneficios li {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin-bottom: 14px;
}
.is-portal .beneficio-icone {
	flex: 0 0 42px;
	height: 42px;
	border-radius: 10px;
	background: var(--marca-suave);
	color: var(--marca);
	font-size: 19px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.is-portal .beneficio-texto {
	font-size: 14px;
	line-height: 1.45;
	color: var(--texto-medio);
}
.is-portal .beneficio-texto strong {
	display: block;
	font-size: 15px;
	color: var(--texto-forte);
	margin-bottom: 2px;
}

/* Rotação (o JS põe .rotacao-ativa): os itens ficam empilhados na mesma
 * célula do grid, então a caixa tem a altura do maior e nada pula na troca. */
.is-portal .rotacao-ativa .cadastro-beneficios {
	display: grid;
	padding: 18px 20px;
	background: #fff;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	box-shadow: 0 4px 14px rgba(16, 24, 40, .05);
}
.is-portal .rotacao-ativa .cadastro-beneficios li {
	grid-area: 1 / 1;
	margin: 0;
	align-items: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity .6s ease, visibility .6s;
}
.is-portal .rotacao-ativa .cadastro-beneficios li.ativo {
	opacity: 1;
	visibility: visible;
}
.is-portal .rotacao-ativa .beneficio-icone {
	flex-basis: 48px;
	height: 48px;
	font-size: 22px;
}
.is-portal .rotacao-ativa .beneficio-texto strong {
	font-size: 16px;
}
.is-portal .vantagens-pontos {
	display: flex;
	gap: 6px;
	margin-top: 12px;
	padding-left: 2px;
}
.is-portal .vantagens-pontos button {
	width: 8px;
	height: 8px;
	padding: 0;
	border: 0;
	border-radius: 4px;
	background: var(--borda-suave);
	transition: width .3s, background .3s;
}
.is-portal .vantagens-pontos button.ativo {
	width: 22px;
	background: var(--marca);
}

/* Como funciona: três passos lado a lado, número pequeno e uma linha
 * ligando os números. */
.is-portal .cadastro-como {
	counter-reset: passo;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}
.is-portal .cadastro-como li {
	counter-increment: passo;
	position: relative;
	padding-top: 32px;
	font-size: 13px;
	line-height: 1.4;
	color: var(--texto-medio);
}
.is-portal .cadastro-como li:before {
	content: counter(passo);
	position: absolute;
	left: 0;
	top: 0;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--marca);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	line-height: 22px;
	text-align: center;
}
.is-portal .cadastro-como li:not(:last-child):after {
	content: "";
	position: absolute;
	left: 30px;
	right: -6px;
	top: 10px;
	height: 2px;
	background: var(--borda-suave);
}
.is-portal .cadastro-como strong {
	display: block;
	font-size: 14px;
	line-height: 1.3;
	color: var(--texto-forte);
	margin-bottom: 3px;
}

/* Dúvidas: no celular depois de tudo; no desktop numa faixa embaixo das
 * duas colunas, duas perguntas em cada metade. O WhatsApp fica embaixo do
 * formulário (e preso com ele ao rolar). */
.is-portal .cadastro-duvidas {
	margin-top: 32px;
}
.is-portal .cadastro-duvidas .cadastro-titulo-bloco {
	margin-bottom: 4px;
}
.is-portal .cadastro-faq {
	margin-bottom: 24px;
}
.is-portal .cadastro-faq details {
	border-bottom: 1px solid var(--borda-suave);
}
.is-portal .cadastro-faq details:first-of-type {
	border-top: 1px solid var(--borda-suave);
}
/* Empilhadas no celular, as duas colunas não dobram a linha do meio. */
@media (max-width: 991px) {
	.is-portal .cadastro-faq .col-md-6 + .col-md-6 details:first-of-type {
		border-top: 0;
	}
}
.is-portal .cadastro-faq summary {
	list-style: none;
	cursor: pointer;
	position: relative;
	padding: 14px 28px 14px 0;
	font-size: 15px;
	font-weight: 700;
	color: var(--texto-forte);
}
.is-portal .cadastro-faq summary::-webkit-details-marker {
	display: none;
}
.is-portal .cadastro-faq summary:after {
	content: "+";
	position: absolute;
	right: 4px;
	top: 10px;
	font-size: 22px;
	font-weight: 400;
	color: var(--marca);
}
.is-portal .cadastro-faq details[open] summary:after {
	content: "\2212";
}
.is-portal .cadastro-faq p {
	margin: -4px 0 14px;
	font-size: 14px;
	color: var(--texto-medio);
}
.is-portal a.cadastro-ajuda {
	margin-top: 16px;
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	border-radius: 12px;
	background: #f2fbf5;
	border: 1px solid #c7ecd4;
	color: var(--texto-medio);
	font-size: 14px;
	line-height: 1.45;
	text-decoration: none;
}
.is-portal a.cadastro-ajuda:hover {
	border-color: #25d366;
}
.is-portal a.cadastro-ajuda strong {
	display: block;
	color: var(--texto-forte);
}
.is-portal .cadastro-ajuda-icone {
	flex: 0 0 40px;
	height: 40px;
	border-radius: 50%;
	background: #25d366;
	color: #fff;
	font-size: 22px;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Tela de sucesso. */
.is-portal .cadastro-sucesso {
	max-width: 560px;
	margin: 24px auto;
	background: #fff;
	border: 1px solid var(--borda-suave);
	border-radius: 16px;
	box-shadow: 0 12px 32px rgba(16, 24, 40, .08);
	padding: 36px 22px 28px;
	text-align: center;
}
.is-portal .cadastro-sucesso-icone {
	width: 68px;
	height: 68px;
	margin: 0 auto 18px;
	border-radius: 50%;
	background: #e7f8ee;
	color: #1a7f37;
	font-size: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.is-portal .cadastro-sucesso h1 {
	font-size: 28px;
	font-weight: 900;
	color: var(--texto-forte);
	margin: 0 0 10px;
}
.is-portal .cadastro-sucesso-lead {
	font-size: 16px;
	color: var(--texto-medio);
	margin: 0 auto 22px;
	max-width: 420px;
}
.is-portal .cadastro-sucesso-dados {
	text-align: left;
	background: #f7f9fc;
	border: 1px solid var(--borda-suave);
	border-radius: 10px;
	padding: 4px 16px;
	margin: 0 0 24px;
}
.is-portal .cadastro-sucesso-dados > div {
	padding: 12px 0;
}
.is-portal .cadastro-sucesso-dados > div + div {
	border-top: 1px solid var(--borda-suave);
}
.is-portal .cadastro-sucesso-dados dt {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--texto-medio);
	margin-bottom: 2px;
}
.is-portal .cadastro-sucesso-dados dd {
	font-size: 17px;
	font-weight: 700;
	color: var(--texto-forte);
	word-break: break-all;
}
.is-portal .cadastro-sucesso-dados small {
	font-size: 13px;
	color: var(--texto-medio);
}
.is-portal .cadastro-sucesso .btn-entrar {
	display: block;
	width: 100%;
	line-height: 24px;
}
.is-portal .cadastro-sucesso-ajuda {
	margin: 18px 0 0;
	font-size: 14px;
	color: var(--texto-medio);
}
.is-portal .cadastro-sucesso-ajuda a {
	font-weight: 700;
	color: #128c47;
}

@media (min-width: 768px) {
	.is-portal .cadastro-trial {
		padding: 48px 0 80px;
	}
	.is-portal .cadastro-intro h1 {
		font-size: 38px;
	}
	.layout-novo .contact_form.cadastro-card {
		padding: 30px 32px 28px;
	}
	.is-portal .cadastro-sucesso {
		padding: 44px 48px 36px;
	}
}
@media (min-width: 992px) {
	.is-portal .cadastro-grid {
		display: grid;
		grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
		grid-template-areas: "intro form" "detalhes form";
		grid-template-rows: auto 1fr;
		column-gap: 64px;
		row-gap: 32px;
	}
	.is-portal .cadastro-intro { grid-area: intro; padding-top: 12px; }
	.is-portal .cadastro-detalhes { grid-area: detalhes; }
	.is-portal .cadastro-duvidas {
		margin-top: 48px;
		padding-top: 32px;
		border-top: 1px solid var(--borda-suave);
	}
	.is-portal .cadastro-duvidas .cadastro-faq { margin-bottom: 0; }
	/* Mesmo espaço entre as colunas da grade de cima. */
	.is-portal .cadastro-faq > .col-md-6 { padding-left: 32px; padding-right: 32px; }
	.is-portal .cadastro-faq { margin-left: -32px; margin-right: -32px; }
	/* Menores, para as três garantias caberem numa linha só na coluna da
	 * esquerda (em telas de 992 a 1199px elas ainda quebram, sem vazar). */
	.is-portal .cadastro-garantias li { padding: 6px 10px; font-size: 12px; gap: 5px; }
	.is-portal .cadastro-form {
		grid-area: form;
		align-self: start;
		position: sticky;
		/* Abaixo do topo, que também fica preso ao rolar. */
		top: 92px;
	}
	.is-portal .cadastro-intro h1 {
		font-size: 42px;
	}
}

/* Celular, só na home: barra fixa com o teste grátis. O WhatsApp flutuante
 * sobe para ficar acima dela, em vez de ficar coberto. */
.is-portal .cta-mobile-fixa {
	display: none;
}
@media (max-width: 767px) {
	.is-portal .cta-mobile-fixa {
		display: block;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 999;
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
		background: #fff;
		box-shadow: 0 -4px 16px rgba(16, 24, 40, .12);
	}
	.is-portal .cta-mobile-fixa a {
		display: block;
		padding: 13px 16px;
		border-radius: 8px;
		background: var(--marca);
		color: #fff;
		font-size: 16px;
		font-weight: 700;
		text-align: center;
		text-decoration: none;
	}
	.is-portal .cta-mobile-fixa a span {
		font-weight: 400;
		opacity: .85;
	}
	.is-portal.pg_plataforma {
		padding-bottom: 72px;
	}
	.is-portal.pg_plataforma .whatsapp-float {
		bottom: 84px;
		right: 16px;
	}
}
/* ---------------------------------------------------------------------------
 * autow agrícola: terracota no lugar do azul, o mesmo tom do tema agro do
 * sistema (admin). As regras do portal acima já usam as variáveis; aqui ficam
 * só os valores e o que vem azul do tema (style.css/home-new.css do bucket e
 * Bootstrap), que não dá para mudar na origem sem afetar as revendas.
 * ------------------------------------------------------------------------- */
.is-portal.site-agricola {
	--marca: #A3472A;
	--marca-escura: #82381F;
	--marca-clara: #D19A87;
	--marca-suave: #f6e9e4;
	--marca-rgb: 163, 71, 42;
	--marca-fundo: #f6e9e4;
	--hero-meio: #3d1a10;
	/* Textos e bordas em cinza quente, que combina com o terracota. */
	--texto-forte: #1d1613;
	--texto-medio: #5b514c;
	--borda-suave: #ece5e1;
	--fundo-secao: #faf6f4;
}

/* Rodapé em marrom escuro, no lugar do grafite. */
.is-portal.site-agricola .revenda-rodape {
	background: #2b1a14;
}
.is-portal.site-agricola .revenda-rodape-fim {
	background: #1f130f;
}
/* Bootstrap: borda azul do .btn-primary (o fundo já vem do <style> do index)
 * e o brilho azul do campo em foco. */
.is-portal.site-agricola .btn-primary,
.is-portal.site-agricola .btn-primary:hover,
.is-portal.site-agricola .btn-primary:focus {
	border-color: var(--marca-escura);
}
.is-portal.site-agricola .btn:hover,
.is-portal.site-agricola .btn:focus {
	background: var(--marca-escura) !important;
}
.is-portal.site-agricola .hero-autow .btn-cta:hover,
.is-portal.site-agricola .hero-autow .btn-cta:focus {
	background: var(--marca-fundo) !important;
}
.is-portal.site-agricola .form-control:focus {
	border-color: var(--marca);
	box-shadow: 0 0 0 3px rgba(var(--marca-rgb), .15);
}
/* Logo: o mesmo desenho em terracota e a palavra "agrícola" ao lado, em
 * texto (nítida em qualquer tela), para ler "autow agrícola" numa linha só.
 * Medidas tiradas do PNG (304x94) exibido com 120px de largura: o "utow" tem
 * 18,9px de altura de x e o pé das letras fica a 28,8px do topo da imagem.
 * "agrícola" em Lato Bold a 33px, um pouco menor e mais leve que o "autow",
 * para a marca continuar sendo a palavra principal; o vertical-align põe a
 * base da imagem abaixo da linha de base do texto na medida certa para o pé
 * das letras de "agrícola" ficar na mesma linha do pé do "utow" (conferido
 * em print ampliado). */
.is-portal.site-agricola .portal-logo {
	display: inline-block;
	white-space: nowrap;
	text-decoration: none;
	line-height: 1;
}
.is-portal.site-agricola .portal-logo img {
	vertical-align: -7.8px;
}
.is-portal .logo-sufixo {
	margin-left: 7px;
	font-size: 33px;
	font-weight: 700;
	/* Altura de linha menor que a fonte para o bloco não crescer: a imagem
	 * fica no mesmo lugar do logo do site de veículos. */
	line-height: .78;
	color: var(--marca);
}

/* Quadro do estoque no hero (no lugar da imagem do topo). */
.is-portal .hero-painel {
	max-width: 460px;
	margin: 10px auto 0;
	text-align: left;
	background: #fff;
	border-radius: 14px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
	overflow: hidden;
	color: var(--texto-forte);
}
.is-portal .hero-painel-topo {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px 18px;
	background: var(--marca-suave);
	font-size: 14px;
	font-weight: 700;
	color: var(--marca-escura);
}
.is-portal .hero-painel-topo i {
	margin-right: 6px;
}
.is-portal .hero-painel-topo small {
	font-size: 12px;
	font-weight: 600;
	color: var(--texto-medio);
}
.is-portal .hero-painel ul {
	list-style: none;
	margin: 0;
	padding: 4px 18px;
}
.is-portal .hero-painel li {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 13px 0;
}
.is-portal .hero-painel li + li {
	border-top: 1px solid var(--borda-suave);
}
.is-portal .hero-painel-icone {
	flex: 0 0 40px;
	height: 40px;
	border-radius: 10px;
	background: var(--marca-suave);
	color: var(--marca);
	font-size: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.is-portal .hero-painel-texto {
	flex: 1 1 auto;
	min-width: 0;
	line-height: 1.3;
}
.is-portal .hero-painel-texto strong {
	display: block;
	font-size: 15px;
	color: var(--texto-forte);
}
.is-portal .hero-painel-texto small {
	display: block;
	font-size: 12.5px;
	color: var(--texto-medio);
}
.is-portal .hero-painel-situacao {
	flex: 0 0 auto;
	padding: 4px 9px;
	border-radius: 999px;
	font-size: 11.5px;
	font-weight: 700;
	white-space: nowrap;
}
.is-portal .hero-painel-situacao.situacao-site { background: #e7f6ec; color: #1a7f37; }
.is-portal .hero-painel-situacao.situacao-negociacao { background: #fff4dc; color: #8a5a00; }
.is-portal .hero-painel-situacao.situacao-vendida { background: var(--marca-suave); color: var(--marca-escura); }
.is-portal .hero-painel-rodape {
	padding: 12px 18px;
	border-top: 1px solid var(--borda-suave);
	background: #fafafa;
	font-size: 12.5px;
	color: var(--texto-medio);
}
.is-portal .hero-painel-rodape i {
	margin-right: 5px;
	color: var(--marca);
}
@media (max-width: 991px) {
	.is-portal .hero-painel {
		margin-top: 34px;
	}
}
/* Faixa colorida do topo dos planos: tons da marca em vez de azul/verde/vermelho. */
.is-portal.site-agricola .plan-box.basic { border-top-color: var(--marca-clara); }
.is-portal.site-agricola .plan-box.standard { border-top-color: var(--marca); }
.is-portal.site-agricola .plan-box.premium { border-top-color: var(--marca-escura); }

/* Lista de revendas/estoque do site institucional ainda vazia. */
.is-portal .revendas-vazio {
	padding: 40px 0;
	text-align: center;
	font-size: 16px;
	color: var(--texto-medio);
}
/* Lista de revendas vazia: um quadro com o convite para o teste. */
.is-portal div.revendas-vazio {
	max-width: 620px;
	margin: 0 auto;
	padding: 36px 24px;
	border: 1px dashed var(--borda-suave);
	border-radius: 16px;
	background: #fcfcfd;
}
.is-portal div.revendas-vazio p {
	margin: 0 0 12px;
	font-size: 17px;
	font-weight: 700;
	color: var(--texto-forte);
}
.is-portal div.revendas-vazio a {
	font-weight: 700;
	color: var(--marca);
}

/* ---------------------------------------------------------------------------
 * Topo do site institucional (index.php): uma barra branca só, com logo,
 * menu, busca e teste grátis, presa no alto ao rolar (com sombra leve depois
 * que a página rola). No celular o menu abre por um botão, logo abaixo da
 * barra. O link para o outro site fica no rodapé (.rodape-outro-site).
 * ------------------------------------------------------------------------- */
.layout-novo .portal-topo {
	position: sticky;
	top: 0;
	z-index: 1030;
	background: #fff;
	border-bottom: 1px solid var(--borda-suave);
	transition: box-shadow .2s, border-color .2s;
}
.layout-novo .portal-topo.rolado {
	border-bottom-color: transparent;
	box-shadow: 0 1px 0 rgba(16, 24, 40, .05), 0 6px 20px rgba(16, 24, 40, .08);
}
/* Respiro em cima e embaixo, um pouco maior embaixo: com os dois iguais a
 * barra parecia mais alta em cima (o desenho do logo pesa para baixo e a
 * borda/sombra de baixo "come" parte do espaço). */
.layout-novo .portal-topo-linha {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	/* min-height conta o padding (border-box do Bootstrap). */
	min-height: 72px;
	padding-top: 5px;
	padding-bottom: 9px;
}
/* O clearfix do .container do Bootstrap vira item do flex e ocupa espaço. */
.layout-novo .portal-topo-linha:before,
.layout-novo .portal-topo-linha:after {
	display: none;
}
.layout-novo .portal-logo {
	display: inline-flex;
	align-items: center;
	margin-right: auto;
	text-decoration: none;
}
.layout-novo .portal-logo:hover img {
	opacity: .85;
}
.layout-novo .portal-logo img {
	display: block;
	width: 104px;
	height: auto;
}
.is-portal.site-agricola .portal-logo img {
	display: inline;
}
/* Busca: campo baixo e arredondado, com a lupa dentro. */
.layout-novo .portal-busca {
	position: relative;
	margin: 0;
}
.layout-novo .portal-busca i {
	position: absolute;
	left: 13px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 13px;
	color: #98a2b3;
	pointer-events: none;
}
.layout-novo .portal-busca input[type="search"] {
	-webkit-appearance: none;
	appearance: none;
	width: 100%;
	height: 40px;
	padding: 0 14px 0 34px;
	border: 1px solid var(--borda-suave);
	border-radius: 999px;
	background: #f9fafb;
	box-shadow: none;
	font-size: 14px;
	color: var(--texto-forte);
	transition: width .2s, border-color .15s, box-shadow .15s, background-color .15s;
}
.layout-novo .portal-busca input[type="search"]::placeholder {
	color: #98a2b3;
}
.layout-novo .portal-busca input[type="search"]:focus {
	outline: none;
	background: #fff;
	border-color: var(--marca);
	box-shadow: 0 0 0 3px rgba(var(--marca-rgb), .14);
}
.layout-novo a.portal-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 40px;
	padding: 0 18px;
	border-radius: 8px;
	background: var(--marca);
	color: var(--marca-contraste, #fff);
	font-size: 14.5px;
	font-weight: 700;
	white-space: nowrap;
	text-decoration: none;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .08), 0 4px 12px rgba(var(--marca-rgb), .25);
	transition: background-color .15s;
}
.layout-novo a.portal-cta:hover,
.layout-novo a.portal-cta:focus {
	background: var(--marca-escura);
	color: var(--marca-contraste, #fff);
}
.layout-novo .portal-menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.layout-novo .portal-menu li {
	margin: 0;
}
.layout-novo .portal-menu nav a {
	display: block;
	color: var(--texto-forte);
	font-weight: 700;
	text-decoration: none;
}
.layout-novo .portal-menu nav a:hover,
.layout-novo .portal-menu nav a:focus,
.layout-novo .portal-menu nav a[aria-current="page"] {
	color: var(--marca-tinta, var(--marca));
}
/* Botão do menu do celular: três traços que viram um X quando aberto. */
.layout-novo .portal-hamburguer {
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	padding: 0 10px;
	border: 1px solid var(--borda-suave);
	border-radius: 8px;
	background: #fff;
}
.layout-novo .portal-hamburguer span {
	display: block;
	height: 2px;
	border-radius: 2px;
	background: var(--texto-forte);
	transition: transform .2s, opacity .2s;
}
.layout-novo .menu-aberto .portal-hamburguer span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.layout-novo .menu-aberto .portal-hamburguer span:nth-child(2) { opacity: 0; }
.layout-novo .menu-aberto .portal-hamburguer span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Celular e tablet: logo, teste grátis e o botão do menu numa linha; o
 * menu abre embaixo, com a busca em cima e os itens em lista. */
@media (max-width: 991px) {
	.layout-novo a.portal-cta-celular {
		height: 36px;
		padding: 0 12px;
		font-size: 13.5px;
		box-shadow: none;
	}
	.layout-novo .portal-menu {
		flex: 0 0 100%;
		display: flex;
		flex-direction: column;
		gap: 6px;
		/* Embaixo já há o respiro da barra (.portal-topo-linha). */
		padding: 4px 0 5px;
	}
	.layout-novo .com-js .portal-menu {
		display: none;
	}
	.layout-novo .com-js.menu-aberto .portal-menu {
		display: flex;
	}
	.layout-novo .portal-menu .portal-busca {
		order: -1;
		margin-bottom: 4px;
	}
	.layout-novo .portal-menu .portal-busca input[type="search"] {
		height: 44px;
		font-size: 16px;
	}
	.layout-novo .portal-menu nav a {
		padding: 13px 2px;
		font-size: 16px;
		border-bottom: 1px solid var(--borda-suave);
	}
	.layout-novo .portal-menu nav li:last-child a {
		border-bottom: 0;
	}
	/* O teste grátis já está na barra, ao lado do botão do menu. */
	.layout-novo .portal-menu a.portal-cta {
		display: none;
	}
	/* Logo um pouco menor; no agrícola, 70% do tamanho do desktop (imagem,
	 * "agrícola" e o ajuste de linha de base), para caber com o teste
	 * grátis e o botão do menu numa linha em 375px. */
	.layout-novo .portal-logo img {
		width: 96px;
	}
	.is-portal.site-agricola .portal-logo img {
		width: 84px;
		vertical-align: -5.8px;
	}
	.is-portal.site-agricola .portal-topo .logo-sufixo {
		margin-left: 5px;
		font-size: 23.1px;
	}
}
/* Desktop: tudo numa linha só, o menu logo depois do logo e a busca e o
 * teste grátis à direita. */
@media (min-width: 992px) {
	.layout-novo .portal-topo-linha {
		flex-wrap: nowrap;
		min-height: 84px;
		padding-top: 7px;
		padding-bottom: 12px;
	}
	.layout-novo .portal-logo {
		margin-right: 20px;
	}
	.layout-novo .portal-logo img {
		width: 120px;
	}
	.layout-novo .portal-hamburguer,
	.layout-novo a.portal-cta-celular {
		display: none;
	}
	.layout-novo .portal-menu {
		flex: 1 1 auto;
		display: flex;
		align-items: center;
		gap: 14px;
		min-width: 0;
	}
	.layout-novo .portal-menu nav {
		margin-right: auto;
	}
	.layout-novo .portal-menu ul {
		display: flex;
		gap: 2px;
	}
	.layout-novo .portal-menu nav a {
		padding: 8px 6px;
		border-radius: 8px;
		font-size: 14px;
		line-height: 20px;
		white-space: nowrap;
	}
	.layout-novo .portal-menu nav a:hover,
	.layout-novo .portal-menu nav a:focus {
		background: var(--marca-fundo);
	}
	.layout-novo .portal-busca input[type="search"] {
		width: 156px;
	}
	.layout-novo .portal-busca input[type="search"]:focus {
		width: 180px;
	}
}
@media (min-width: 1200px) {
	.layout-novo .portal-logo {
		margin-right: 28px;
	}
	.layout-novo .portal-menu nav a {
		padding: 8px 12px;
		font-size: 15px;
	}
	.layout-novo .portal-busca input[type="search"] {
		width: 190px;
	}
	.layout-novo .portal-busca input[type="search"]:focus {
		width: 230px;
	}
}
/* Rodapé: quadro "Conheça também" com o link para o outro produto. */
.is-portal a.rodape-outro-site {
	display: block;
	margin-top: 8px;
	padding: 22px 24px;
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 14px;
	background: rgba(255, 255, 255, .05);
	color: rgba(255, 255, 255, .75);
	text-decoration: none;
	transition: background-color .15s, border-color .15s;
}
.is-portal a.rodape-outro-site:hover,
.is-portal a.rodape-outro-site:focus {
	border-color: rgba(255, 255, 255, .3);
	background: rgba(255, 255, 255, .09);
	color: rgba(255, 255, 255, .85);
}
.is-portal .rodape-outro-site .rodape-outro-rotulo {
	display: block;
	margin-bottom: 6px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .55);
}
.is-portal .rodape-outro-site strong {
	display: block;
	margin-bottom: 4px;
	font-size: 21px;
	font-weight: 800;
	color: #fff;
}
.is-portal .rodape-outro-site strong i {
	margin-left: 6px;
	font-size: 15px;
	transition: transform .15s;
}
.is-portal a.rodape-outro-site:hover strong i {
	transform: translateX(3px);
}
.is-portal .rodape-outro-site span {
	font-size: 14.5px;
	line-height: 1.5;
}
@media (max-width: 991px) {
	.is-portal a.rodape-outro-site {
		margin: 12px 0 28px;
	}
}

/* Âncoras (Planos, seções da home) param abaixo do topo preso, e não
 * escondidas atrás dele. */
.layout-novo a[name],
.layout-novo [id] {
	scroll-margin-top: 104px;
}

/* ---------------------------------------------------------------------------
 * Cabeçalho das páginas internas (cabecalhoPortal()): faixa clara, trilha
 * discreta, título forte e uma frase. No lugar da foto escura do tema.
 * ------------------------------------------------------------------------- */
.layout-novo .portal-cabecalho {
	background: linear-gradient(180deg, var(--marca-fundo) 0%, #fff 100%);
	border-bottom: 1px solid var(--borda-suave);
	padding: 28px 0 30px;
}
.layout-novo .portal-trilha {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
	font-size: 13px;
	color: var(--texto-medio);
}
.layout-novo .portal-trilha a {
	color: var(--texto-medio);
	text-decoration: none;
}
.layout-novo .portal-trilha a:hover,
.layout-novo .portal-trilha a:focus {
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .portal-trilha i {
	font-size: 12px;
	opacity: .6;
}
.layout-novo .portal-trilha span {
	font-weight: 700;
	color: var(--texto-forte);
}
.layout-novo .portal-cabecalho h1 {
	margin: 0;
	font-size: 30px;
	font-weight: 900;
	line-height: 1.15;
	letter-spacing: -.01em;
	color: var(--texto-forte);
}
.layout-novo .portal-cabecalho p {
	max-width: 640px;
	margin: 10px 0 0;
	font-size: 16px;
	line-height: 1.5;
	color: var(--texto-medio);
}

@media (min-width: 768px) {
	.layout-novo .portal-cabecalho {
		padding: 44px 0 44px;
	}
	.layout-novo .portal-cabecalho h1 {
		font-size: 40px;
	}
	.layout-novo .portal-cabecalho p {
		font-size: 17px;
	}
}

/* ---------------------------------------------------------------------------
 * Home: "Produto perfeito" como painel de valor (título e frase de um lado,
 * etiquetas do que o sistema faz do outro) e a grade de tópicos em cartões
 * clicáveis, sem um botão em cada um.
 * ------------------------------------------------------------------------- */
.is-portal .produto-perfeito {
	padding: 48px 0 8px;
	background: #fff;
}
.is-portal .perfeito-painel {
	padding: 30px 22px;
	border: 1px solid var(--borda-suave);
	border-radius: 20px;
	background: var(--marca-fundo);
}
.is-portal .perfeito-texto h2 {
	margin: 0 0 12px;
	font-size: 26px;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: -.01em;
	color: var(--texto-forte);
}
.is-portal .perfeito-texto p {
	margin: 0;
	font-size: 16px;
	line-height: 1.6;
	color: var(--texto-medio);
}
.is-portal .perfeito-itens {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
}
.is-portal .perfeito-itens li {
	display: inline-flex;
	margin: 0;
	align-items: center;
	gap: 9px;
	padding: 7px 15px 7px 7px;
	border: 1px solid var(--borda-suave);
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
	font-size: 14.5px;
	font-weight: 700;
	color: var(--texto-forte);
}
.is-portal .perfeito-icone {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--marca-suave);
	color: var(--marca);
	font-size: 13px;
}
@media (min-width: 992px) {
	.is-portal .produto-perfeito {
		padding-top: 64px;
	}
	.is-portal .perfeito-painel {
		display: grid;
		grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
		gap: 48px;
		align-items: center;
		padding: 44px 52px;
	}
	.is-portal .perfeito-texto h2 {
		font-size: 32px;
	}
	.is-portal .perfeito-itens {
		margin: 0;
		gap: 12px;
	}
	.is-portal .perfeito-itens li {
		font-size: 15px;
	}
}

/* Grade de tópicos: 1 coluna no celular, 2 no tablet e, no desktop, 4 (os 8
 * tópicos de veículos) ou 3 (os 6 do agrícola), sempre em linhas cheias. */
.is-portal .about-grade {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 14px;
	margin-top: 8px;
}
@media (min-width: 768px) {
	.is-portal .about-grade {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
	}
}
@media (min-width: 1200px) {
	.is-portal .about-grade-8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.is-portal .about-grade-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.is-portal a.about-item {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	height: 100%;
	padding: 22px 22px 20px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
	color: var(--texto-medio);
	text-align: left;
	text-decoration: none;
	transition: border-color .15s, box-shadow .15s, transform .15s;
}
.is-portal a.about-item:hover,
.is-portal a.about-item:focus-visible {
	border-color: rgba(var(--marca-rgb), .45);
	box-shadow: 0 10px 28px rgba(16, 24, 40, .08);
	transform: translateY(-2px);
	color: var(--texto-medio);
}
.is-portal .about-item .about-icone {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-bottom: 14px;
	border-radius: 10px;
	background: var(--marca-suave);
	color: var(--marca);
	font-size: 18px;
}
.is-portal .about-item h3 {
	margin: 0 0 6px;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.3;
	text-transform: none;
	color: var(--texto-forte);
}
.is-portal .about-item p {
	flex: 1 1 auto;
	margin: 0 0 14px;
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--texto-medio);
}
.is-portal .about-item .about-mais {
	font-size: 13.5px;
	font-weight: 700;
	color: var(--marca);
}
.is-portal .about-item .about-mais i {
	margin-left: 4px;
	font-size: 12px;
	transition: transform .15s;
}
.is-portal a.about-item:hover .about-mais i {
	transform: translateX(3px);
}
/* Celular: ícone à esquerda e texto ao lado, para a lista não ficar longa. */
@media (max-width: 767px) {
	.is-portal a.about-item {
		display: grid;
		grid-template-columns: 36px minmax(0, 1fr);
		column-gap: 14px;
		align-items: start;
		padding: 16px 16px 14px;
	}
	.is-portal .about-item .about-icone {
		grid-row: 1 / span 3;
		width: 36px;
		height: 36px;
		margin: 0;
		font-size: 16px;
	}
	.is-portal .about-item h3 {
		margin-top: 7px;
		font-size: 17px;
	}
	.is-portal .about-item p {
		margin-bottom: 8px;
	}
}
@media (prefers-reduced-motion: reduce) {
	.is-portal a.about-item,
	.is-portal a.about-item:hover,
	.is-portal .about-item .about-mais i {
		transition: none;
		transform: none;
	}
}

/* ---------------------------------------------------------------------------
 * Seções de detalhe da home (secaoRecurso() em plataforma.php), no mesmo
 * desenho da grade de tópicos: fundo claro alternando com um cinza suave,
 * ícone pequeno na cor da marca, título forte e uma frase. Com print, texto
 * de um lado e imagem do outro, trocando de lado a cada seção; sem print, os
 * itens em cartões embaixo do título.
 * ------------------------------------------------------------------------- */
.is-portal .recurso {
	padding: 56px 0;
	background: #fff;
}
.is-portal .recurso-suave {
	background: var(--fundo-secao);
}
/* Grade de tópicos e primeira seção claras, uma depois da outra (agrícola). */
.is-portal .about_us + .recurso-claro {
	border-top: 1px solid var(--borda-suave);
}
.is-portal .recurso-icone {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-bottom: 16px;
	border-radius: 12px;
	background: var(--marca-suave);
	color: var(--marca);
	font-size: 20px;
}
.is-portal .recurso h2 {
	margin: 0 0 12px;
	font-size: 28px;
	font-weight: 900;
	line-height: 1.18;
	letter-spacing: -.01em;
	text-transform: none;
	text-wrap: balance;
	color: var(--texto-forte);
}
.is-portal .recurso-frase {
	max-width: 560px;
	text-wrap: pretty;
	margin: 0;
	font-size: 16.5px;
	line-height: 1.6;
	color: var(--texto-medio);
}
.is-portal .recurso-item-icone {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: var(--marca-suave);
	color: var(--marca);
	font-size: 15px;
}
.is-portal .recurso h3 {
	margin: 0 0 4px;
	font-size: 16.5px;
	font-weight: 800;
	line-height: 1.35;
	text-transform: none;
	color: var(--texto-forte);
}
.is-portal .recurso-itens p,
.is-portal .recurso-cartoes p {
	margin: 0;
	font-size: 15px;
	line-height: 1.55;
	color: var(--texto-medio);
}

/* Com print: itens em lista, um embaixo do outro, ao lado da imagem. */
.is-portal .recurso-itens {
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}
.is-portal .recurso-itens li {
	display: grid;
	grid-template-columns: 36px minmax(0, 1fr);
	column-gap: 14px;
	margin: 0 0 20px;
}
.is-portal .recurso-itens li:last-child {
	margin-bottom: 0;
}
.is-portal .recurso-itens h3 {
	margin-top: 7px;
}
.is-portal .recurso-print {
	margin-top: 32px;
}
.is-portal .recurso-print img {
	width: 100%;
	height: auto;
}
/* Nota fiscal: as duas notas sobrepostas, a de saída na frente. */
.is-portal .recurso-print-duplo img {
	width: 80%;
}
.is-portal .recurso-print-duplo img + img {
	position: relative;
	margin: -48% 0 0 20%;
}

/* Sem print: título centralizado e os itens em cartões. */
.is-portal .recurso-sem-print .recurso-texto {
	max-width: 680px;
	margin: 0 auto;
	text-align: center;
}
.is-portal .recurso-sem-print .recurso-icone {
	margin-left: auto;
	margin-right: auto;
}
.is-portal .recurso-sem-print .recurso-frase {
	margin: 0 auto;
}
.is-portal .recurso-cartoes {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 14px;
	margin: 32px 0 0;
	padding: 0;
	list-style: none;
}
.is-portal .recurso-cartoes li {
	display: grid;
	grid-template-columns: 36px minmax(0, 1fr);
	column-gap: 14px;
	align-content: start;
	margin: 0;
	padding: 18px 18px 16px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
}
.is-portal .recurso-cartoes .recurso-item-icone {
	grid-row: 1 / span 2;
}
.is-portal .recurso-cartoes h3 {
	margin-top: 7px;
}

/* Portais integrados: logos em quadros iguais, embaixo do print. */
.is-portal .recurso-portais {
	margin-top: 40px;
	text-align: center;
}
.is-portal .recurso-portais p {
	margin: 0 0 14px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--texto-medio);
}
.is-portal .recurso-portais ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.is-portal .recurso-portais li {
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc(33.333% - 7px);
	height: 64px;
	margin: 0;
	padding: 4px 8px;
	border: 1px solid var(--borda-suave);
	border-radius: 12px;
	background: #fff;
}
/* Os logos são brancos (feitos para fundo escuro): aqui viram silhuetas
 * cinza, no estilo das listas de clientes, sem brigar com o print. */
.is-portal .recurso-portais img {
	width: 100%;
	max-width: 120px;
	height: auto;
	filter: brightness(0);
	opacity: .55;
}

@media (min-width: 768px) {
	.is-portal .recurso-cartoes {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
	}
	.is-portal .recurso-portais li {
		width: 150px;
		height: 76px;
	}
}
@media (min-width: 992px) {
	.is-portal .recurso {
		padding: 96px 0;
	}
	.is-portal .recurso h2 {
		font-size: 36px;
	}
	.is-portal .recurso-com-print .recurso-corpo {
		display: grid;
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: 56px;
		align-items: center;
	}
	.is-portal .recurso-print-esquerda .recurso-corpo {
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	}
	.is-portal .recurso-print-esquerda .recurso-print {
		order: -1;
	}
	.is-portal .recurso-print {
		margin-top: 0;
	}
	/* Cartões como os da grade de tópicos: ícone em cima, texto embaixo. */
	.is-portal .recurso-cartoes {
		margin-top: 44px;
	}
	.is-portal .recurso-cartoes li {
		display: block;
		padding: 24px 22px 22px;
	}
	.is-portal .recurso-cartoes .recurso-item-icone {
		width: 40px;
		height: 40px;
		margin-bottom: 14px;
		font-size: 17px;
	}
	.is-portal .recurso-cartoes h3 {
		margin: 0 0 6px;
		font-size: 17.5px;
	}
	.is-portal .recurso-cartoes-3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	/* Dois ou quatro itens: título à esquerda e cartões em duas colunas. */
	.is-portal .recurso-lateral .recurso-corpo {
		display: grid;
		grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
		gap: 56px;
		align-items: center;
	}
	.is-portal .recurso-lateral .recurso-texto {
		margin: 0;
		text-align: left;
	}
	.is-portal .recurso-lateral .recurso-icone,
	.is-portal .recurso-lateral .recurso-frase {
		margin-left: 0;
	}
	.is-portal .recurso-lateral .recurso-cartoes {
		margin-top: 0;
	}
	/* Dois itens: um embaixo do outro, com o ícone ao lado do texto. */
	.is-portal .recurso-lateral .recurso-cartoes-2 {
		grid-template-columns: minmax(0, 1fr);
	}
	.is-portal .recurso-lateral .recurso-cartoes-2 li {
		display: grid;
		grid-template-columns: 44px minmax(0, 1fr);
		column-gap: 18px;
		padding: 24px;
	}
	.is-portal .recurso-lateral .recurso-cartoes-2 .recurso-item-icone {
		width: 44px;
		height: 44px;
		margin: 0;
		font-size: 18px;
	}
	.is-portal .recurso-lateral .recurso-cartoes-2 h3 {
		margin-top: 2px;
	}
}

/* ---------------------------------------------------------------------------
 * Contato do site institucional: o formulário no cartão do cadastro e, ao
 * lado, blocos curtos (WhatsApp, o que a pessoa resolve, teste grátis). No
 * celular os blocos vêm depois do formulário.
 * ------------------------------------------------------------------------- */
.layout-novo .contato-portal {
	padding: 32px 0 64px;
	background: linear-gradient(180deg, var(--fundo-secao) 0, #fff 520px);
}
.layout-novo .contato-grid {
	display: flex;
	flex-direction: column;
	gap: 24px;
}
.layout-novo .contato-card-titulo {
	margin: 0 0 6px;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.25;
	text-transform: none;
	color: var(--texto-forte);
}
.layout-novo .contato-card-dica {
	margin: 0 0 20px;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--texto-medio);
}
.layout-novo .contato-form textarea.form-control {
	height: auto;
	min-height: 120px;
	resize: vertical;
}
.layout-novo .contato-form .h-captcha {
	margin-top: 4px;
}
.layout-novo .contato-form .acao-cadastro {
	margin-top: 18px;
}
.layout-novo .contato-form .btn-criar-conta .fa-arrow-right {
	margin-left: 6px;
}
.layout-novo .contato-lateral {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.layout-novo .contato-bloco {
	display: block;
	padding: 22px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
}
.layout-novo .contato-bloco h2 {
	margin: 0 0 8px;
	font-size: 17px;
	font-weight: 800;
	line-height: 1.3;
	text-transform: none;
	color: var(--texto-forte);
}
.layout-novo .contato-bloco p {
	margin: 0;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--texto-medio);
}
/* WhatsApp: o verde do próprio WhatsApp, como no cadastro. */
.layout-novo .contato-whatsapp {
	border-color: #c9ecd6;
	background: #f1fbf5;
}
.layout-novo .contato-whatsapp-icone {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-bottom: 12px;
	border-radius: 50%;
	background: #25d366;
	color: #fff;
	font-size: 22px;
}
.layout-novo .contato-whatsapp strong {
	color: var(--texto-forte);
	white-space: nowrap;
}
.layout-novo a.contato-botao-whatsapp {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	padding: 10px 18px;
	border-radius: 8px;
	background: #1fae55;
	color: #fff;
	font-size: 14.5px;
	font-weight: 700;
	text-decoration: none;
	transition: background-color .15s;
}
.layout-novo a.contato-botao-whatsapp:hover,
.layout-novo a.contato-botao-whatsapp:focus {
	background: #178a43;
	color: #fff;
}
.layout-novo a.contato-botao-whatsapp i {
	font-size: 17px;
}
.layout-novo .contato-lista {
	margin: 4px 0 0;
	padding: 0;
	list-style: none;
}
.layout-novo .contato-lista li {
	display: flex;
	gap: 10px;
	margin: 0 0 8px;
	font-size: 14.5px;
	line-height: 1.45;
	color: var(--texto-medio);
}
.layout-novo .contato-lista i {
	flex: 0 0 auto;
	margin-top: 3px;
	font-size: 12px;
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .contato-bloco .contato-email {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--borda-suave);
}
.layout-novo .contato-email i {
	margin-right: 6px;
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .contato-email a {
	color: var(--texto-forte);
	font-weight: 700;
	word-break: break-all;
}
/* Teste grátis: o cartão todo é o link. */
.layout-novo a.contato-teste {
	border-color: rgba(var(--marca-rgb), .25);
	background: var(--marca-fundo);
	color: var(--texto-medio);
	text-decoration: none;
	transition: border-color .15s, box-shadow .15s;
}
.layout-novo a.contato-teste:hover,
.layout-novo a.contato-teste:focus {
	border-color: rgba(var(--marca-rgb), .5);
	box-shadow: 0 8px 24px rgba(16, 24, 40, .08);
	color: var(--texto-medio);
}
.layout-novo .contato-teste-rotulo {
	display: block;
	margin-bottom: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--marca-tinta, var(--marca-escura));
}
.layout-novo .contato-teste strong {
	display: block;
	margin-bottom: 4px;
	font-size: 18px;
	font-weight: 800;
	color: var(--texto-forte);
}
.layout-novo .contato-teste strong i {
	margin-left: 4px;
	font-size: 14px;
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .contato-teste span:last-child {
	font-size: 14.5px;
}
@media (min-width: 768px) {
	.layout-novo .contato-form .contact_form.cadastro-card {
		padding: 30px 30px 26px;
	}
}
@media (min-width: 992px) {
	.layout-novo .contato-portal {
		padding: 44px 0 88px;
	}
	.layout-novo .contato-grid {
		display: grid;
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		gap: 32px;
		align-items: start;
	}
	.layout-novo .contato-form .contact_form.cadastro-card {
		padding: 34px 36px 30px;
	}
	.layout-novo .contato-card-titulo {
		font-size: 24px;
	}
}

/* ---------------------------------------------------------------------------
 * Estoque (itens_portal.php), no institucional e nas revendas: filtros numa coluna à
 * esquerda (no celular e no tablet, num painel que abre pelo "Filtrar"),
 * categorias em abas, filtros em uso como etiquetas e cartões no desenho do
 * resto do site: cantos arredondados, borda suave, sem o brilho do tema.
 * ------------------------------------------------------------------------- */
.layout-novo.pg_itens .section-padding-min.gray-bg {
	background: var(--fundo-secao);
	padding: 24px 0 64px;
}

/* Botões do site institucional usados aqui. */
.layout-novo .botao-marca,
.layout-novo .botao-leve {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 44px;
	padding: 0 18px;
	border-radius: 10px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
	transition: background .15s, border-color .15s, color .15s;
}
.layout-novo .botao-marca {
	border: 1px solid var(--marca);
	background: var(--marca);
	color: var(--marca-contraste, #fff);
}
.layout-novo .botao-marca:hover,
.layout-novo .botao-marca:focus {
	border-color: var(--marca-escura);
	background: var(--marca-escura);
	color: var(--marca-contraste, #fff);
	text-decoration: none;
}
.layout-novo .botao-leve {
	border: 1px solid #d0d5dd;
	background: #fff;
	color: var(--texto-forte);
}
.layout-novo .botao-leve:hover,
.layout-novo .botao-leve:focus {
	border-color: var(--marca);
	color: var(--marca-tinta, var(--marca));
	text-decoration: none;
}

/* Campos dos filtros e da ordem: o select nativo, com a seta desenhada. */
.layout-novo .filtro-campo,
.layout-novo .filtro-busca input {
	display: block;
	width: 100%;
	height: 42px;
	margin: 0;
	padding: 0 34px 0 12px;
	border: 1px solid #d0d5dd;
	border-radius: 10px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23667085' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;
	font-size: 14.5px;
	font-weight: 400;
	color: var(--texto-forte);
	-webkit-appearance: none;
	appearance: none;
	box-shadow: none;
	transition: border-color .15s, box-shadow .15s;
}
.layout-novo .filtro-campo:focus,
.layout-novo .filtro-busca input:focus {
	outline: none;
	border-color: var(--marca);
	box-shadow: 0 0 0 3px rgba(var(--marca-rgb), .14);
}
.layout-novo .filtro-campo[disabled] {
	background-color: #f5f6f8;
	color: #98a2b3;
	cursor: not-allowed;
}
.layout-novo .filtro-busca {
	position: relative;
}
.layout-novo .filtro-busca i {
	position: absolute;
	top: 50%;
	left: 13px;
	transform: translateY(-50%);
	font-size: 14px;
	color: #98a2b3;
}
.layout-novo .filtro-busca input {
	padding: 0 12px 0 36px;
	background-image: none;
}
.layout-novo .filtro-busca input::placeholder {
	color: #98a2b3;
}

/* Painel de filtros. */
.layout-novo .filtros-painel form {
	display: flex;
	flex-direction: column;
	height: 100%;
	margin: 0;
}
.layout-novo .filtros-topo {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 18px 12px;
	border-bottom: 1px solid var(--borda-suave);
}
.layout-novo .filtros-topo h2 {
	flex: 1;
	margin: 0;
	font-size: 17px;
	font-weight: 800;
	line-height: 1.2;
	color: var(--texto-forte);
}
.layout-novo .filtros-limpar-topo {
	font-size: 13.5px;
	font-weight: 600;
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .filtros-fechar {
	display: none;
	width: 36px;
	height: 36px;
	margin-right: -6px;
	border: 0;
	border-radius: 50%;
	background: transparent;
	font-size: 18px;
	color: var(--texto-medio);
}
.layout-novo .filtros-fechar:hover {
	background: var(--fundo-secao);
}
.layout-novo .filtros-corpo {
	padding: 0 18px;
}
.layout-novo .filtro-grupo {
	padding: 14px 0;
	border-bottom: 1px solid var(--borda-suave);
}
.layout-novo .filtro-grupo:last-child {
	border-bottom: 0;
}
.layout-novo .filtro-rotulo {
	display: block;
	margin: 0 0 8px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--texto-forte);
}
.layout-novo .filtro-par {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}
.layout-novo .filtros-acoes {
	display: flex;
	gap: 10px;
	padding: 14px 18px;
	border-top: 1px solid var(--borda-suave);
	background: #fff;
}
.layout-novo .filtros-acoes .botao-leve {
	flex: 0 0 auto;
}
.layout-novo .filtros-acoes .botao-marca {
	flex: 1;
}
.layout-novo .filtros-fundo {
	position: fixed;
	inset: 0;
	z-index: 1190;
	background: rgba(16, 24, 40, .45);
}
.layout-novo .filtros-fundo[hidden] {
	display: none;
}

/* Abas das categorias (Tipo): a navegação principal da lista. */
.layout-novo .lista-categorias {
	display: flex;
	gap: 8px;
	/* Até a borda da tela no celular: o mesmo recuo do .container (15px). */
	margin: 0 -15px 16px;
	padding: 0 15px 2px;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.layout-novo .lista-categorias::-webkit-scrollbar {
	display: none;
}
.layout-novo .lista-categorias a {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 38px;
	padding: 0 14px;
	border: 1px solid var(--borda-suave);
	border-radius: 999px;
	background: #fff;
	font-size: 14px;
	font-weight: 600;
	color: var(--texto-forte);
	white-space: nowrap;
	text-decoration: none;
	transition: border-color .15s, color .15s;
}
.layout-novo .lista-categorias a span {
	min-width: 22px;
	padding: 2px 7px;
	border-radius: 999px;
	background: var(--fundo-secao);
	font-size: 12px;
	font-weight: 700;
	text-align: center;
	color: var(--texto-medio);
}
.layout-novo .lista-categorias a:hover {
	border-color: rgba(var(--marca-rgb), .45);
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .lista-categorias a.ativa {
	border-color: var(--marca);
	background: var(--marca);
	color: var(--marca-contraste, #fff);
}
.layout-novo .lista-categorias a.ativa span {
	background: rgba(255, 255, 255, .22);
	color: #fff;
}

/* Seções "Veículos · Acessórios" (site de veículos com acessório publicado):
   acima das categorias, como abas sublinhadas, para não parecer mais uma categoria. */
.layout-novo .lista-secoes {
	display: flex;
	gap: 22px;
	margin: 0 0 14px;
	border-bottom: 1px solid var(--borda-suave);
}
.layout-novo .lista-secoes a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 4px 2px 10px;
	margin-bottom: -1px;
	border-bottom: 2px solid transparent;
	font-size: 15px;
	font-weight: 700;
	color: var(--texto-medio);
	text-decoration: none;
}
.layout-novo .lista-secoes a span {
	padding: 1px 7px;
	border-radius: 999px;
	background: var(--fundo-secao);
	font-size: 12px;
	color: var(--texto-medio);
}
.layout-novo .lista-secoes a:hover {
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .lista-secoes a.ativa {
	border-bottom-color: var(--marca);
	color: var(--texto-forte);
}

/* Contagem, botão "Filtrar" e ordem. */
.layout-novo .lista-barra {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 16px;
	margin-bottom: 14px;
}
.layout-novo .lista-contagem {
	margin: 0;
	font-size: 15px;
	color: var(--texto-medio);
}
.layout-novo .lista-contagem strong {
	font-weight: 800;
	color: var(--texto-forte);
}
.layout-novo .lista-acoes {
	display: flex;
	align-items: center;
	gap: 10px;
}
.layout-novo .lista-ordem {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-weight: 400;
}
.layout-novo .lista-ordem span {
	font-size: 14px;
	color: var(--texto-medio);
	white-space: nowrap;
}
.layout-novo .lista-ordem .filtro-campo {
	width: auto;
	min-width: 180px;
}
.layout-novo .filtro-abrir {
	display: none;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 42px;
	padding: 0 16px;
	border: 1px solid #d0d5dd;
	border-radius: 10px;
	background: #fff;
	font-size: 14.5px;
	font-weight: 700;
	color: var(--texto-forte);
}
.layout-novo .filtro-abrir-qtde {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	border-radius: 999px;
	background: var(--marca);
	font-size: 12px;
	color: var(--marca-contraste, #fff);
}

/* Filtros em uso: cada etiqueta tira o seu filtro. */
.layout-novo .lista-etiquetas {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
}
.layout-novo .lista-etiquetas li {
	margin: 0;
}
.layout-novo .lista-etiquetas a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 32px;
	padding: 0 11px 0 13px;
	border-radius: 999px;
	background: var(--marca-suave);
	font-size: 13px;
	font-weight: 600;
	color: var(--marca-tinta, var(--marca-escura));
	text-decoration: none;
}
.layout-novo .lista-etiquetas a i {
	font-size: 12px;
	opacity: .7;
}
.layout-novo .lista-etiquetas a:hover {
	background: rgba(var(--marca-rgb), .18);
	color: var(--marca-tinta, var(--marca-escura));
}
.layout-novo .lista-etiquetas a.lista-etiquetas-limpar {
	padding: 0 6px;
	background: none;
	color: var(--texto-medio);
	text-decoration: underline;
}

/* Grade e cartões dos itens. */
.layout-novo .lista-grade {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 16px;
}
.layout-novo .cartao-item {
	position: relative;
	display: flex;
	flex-direction: column;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
	overflow: hidden;
	transition: border-color .15s, box-shadow .15s, transform .15s;
}
.layout-novo .cartao-item:hover {
	border-color: rgba(var(--marca-rgb), .35);
	box-shadow: 0 6px 20px rgba(16, 24, 40, .07);
	transform: translateY(-2px);
}
.layout-novo .cartao-item-foto {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	background: var(--fundo-secao);
	overflow: hidden;
}
.layout-novo .cartao-item-foto img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .3s;
}
.layout-novo .cartao-item:hover .cartao-item-foto img {
	transform: scale(1.03);
}
.layout-novo .cartao-item-semfoto {
	display: none;
}
.layout-novo .sem-foto .cartao-item-semfoto {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	background: linear-gradient(160deg, var(--marca-suave) 0%, var(--fundo-secao) 70%);
	color: rgba(var(--marca-rgb), .5);
}
.layout-novo .cartao-item-semfoto svg {
	width: 68px;
	height: 68px;
}
.layout-novo .cartao-item-semfoto span {
	font-size: 12.5px;
	font-weight: 600;
	color: var(--texto-medio);
}
.layout-novo .cartao-item-corpo {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 14px 16px 16px;
}
.layout-novo .cartao-item-loja {
	margin: 0 0 4px;
	font-size: 12.5px;
	line-height: 1.4;
	color: var(--texto-medio);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.layout-novo .cartao-item-loja a {
	position: relative;
	z-index: 2;
	font-weight: 600;
	color: inherit;
}
.layout-novo .cartao-item-loja a:hover {
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .cartao-item-nome {
	display: -webkit-box;
	min-height: 2.7em;
	margin: 0 0 12px;
	overflow: hidden;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	font-size: 15.5px;
	font-weight: 800;
	line-height: 1.35;
	letter-spacing: 0;
	text-transform: uppercase;
	color: var(--texto-forte);
}
.layout-novo .cartao-item-nome a {
	color: inherit;
	text-decoration: none;
}
/* O cartão inteiro abre o item; o link da loja fica por cima. */
.layout-novo .cartao-item-nome a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
.layout-novo .cartao-item-nome a:focus-visible {
	outline: none;
}
.layout-novo .cartao-item:focus-within {
	border-color: var(--marca);
	box-shadow: 0 0 0 3px rgba(var(--marca-rgb), .14);
}
.layout-novo .cartao-item-nome span {
	font-weight: 500;
	color: var(--texto-medio);
}
.layout-novo .cartao-item-dados {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 14px;
	padding: 0;
	list-style: none;
}
.layout-novo .cartao-item-dados li {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	height: 26px;
	/* O tema põe margem nos li de listas. */
	margin: 0;
	padding: 0 9px;
	border-radius: 6px;
	background: var(--fundo-secao);
	font-size: 12.5px;
	font-weight: 600;
	color: var(--texto-medio);
	white-space: nowrap;
}
.layout-novo .cartao-item-dados li i {
	font-size: 12px;
	color: rgba(var(--marca-rgb), .75);
}
.layout-novo .cartao-item-rodape {
	display: flex;
	/* Cartão estreito: o "Ver detalhes" desce para baixo do preço. */
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid var(--borda-suave);
}
.layout-novo .cartao-item-preco {
	margin: 0;
	font-size: 20px;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: -.01em;
	color: var(--texto-forte);
	white-space: nowrap;
}
.layout-novo .cartao-item-preco.consultar {
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0;
	color: var(--texto-medio);
}
.layout-novo .cartao-item-cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 34px;
	padding: 0 12px;
	border-radius: 8px;
	background: var(--marca-suave);
	font-size: 13.5px;
	font-weight: 700;
	color: var(--marca-tinta, var(--marca-escura));
	white-space: nowrap;
	transition: background .15s, color .15s;
}
.layout-novo .cartao-item:hover .cartao-item-cta {
	background: var(--marca);
	color: var(--marca-contraste, #fff);
}

/* Filtros sem resultado. */
.layout-novo .lista-nada {
	padding: 44px 24px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
	text-align: center;
}
.layout-novo .lista-nada-icone {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin-bottom: 14px;
	border-radius: 50%;
	background: var(--marca-suave);
	font-size: 22px;
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .lista-nada h2 {
	margin: 0 0 8px;
	font-size: 20px;
	font-weight: 800;
	color: var(--texto-forte);
}
.layout-novo .lista-nada p {
	margin: 0 0 20px;
	font-size: 15px;
	color: var(--texto-medio);
}

/* Nada publicado ainda: cartões "fantasma" do que vai aparecer, o texto e o
 * convite ao teste grátis para quem vende. */
.is-portal .estoque-vazio {
	max-width: 900px;
	margin: 12px auto 0;
	padding: 24px 18px;
	border: 1px solid var(--borda-suave);
	border-radius: 18px;
	background: #fff;
	text-align: center;
}
.is-portal .estoque-vazio-fantasmas {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin-bottom: 24px;
	-webkit-mask-image: linear-gradient(180deg, #000 40%, transparent 100%);
	mask-image: linear-gradient(180deg, #000 40%, transparent 100%);
}
.is-portal .estoque-vazio-fantasma {
	padding: 10px;
	border: 1px solid var(--borda-suave);
	border-radius: 12px;
	text-align: left;
}
.is-portal .estoque-vazio-fantasma:nth-child(3) {
	display: none;
}
.is-portal .fantasma-foto {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 4 / 3;
	border-radius: 8px;
	background: linear-gradient(160deg, var(--marca-suave) 0%, var(--fundo-secao) 70%);
	color: rgba(var(--marca-rgb), .45);
}
.is-portal .fantasma-foto svg {
	width: 52px;
	height: 52px;
}
.is-portal .fantasma-linha {
	display: block;
	height: 10px;
	margin-top: 10px;
	border-radius: 5px;
	background: #eceef2;
}
.is-portal .fantasma-linha.curta {
	width: 55%;
}
.is-portal .estoque-vazio-texto h2 {
	margin: 0 0 10px;
	font-size: 24px;
	font-weight: 900;
	line-height: 1.2;
	color: var(--texto-forte);
}
.is-portal .estoque-vazio-texto p {
	max-width: 580px;
	margin: 0 auto;
	font-size: 16px;
	line-height: 1.55;
	color: var(--texto-medio);
}
.is-portal .estoque-vazio-convite {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: 26px;
	padding: 20px;
	border: 1px solid rgba(var(--marca-rgb), .2);
	border-radius: 14px;
	background: var(--marca-suave);
	text-align: left;
}
.is-portal .estoque-vazio-convite strong {
	display: block;
	font-size: 18px;
	font-weight: 800;
	color: var(--texto-forte);
}
.is-portal .estoque-vazio-convite p {
	margin: 6px 0 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--texto-medio);
}
.is-portal .estoque-vazio-botoes {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.layout-novo .estoque-vazio-botoes .botao-marca,
.layout-novo .estoque-vazio-botoes .botao-leve {
	flex: 1 1 auto;
}

@media (min-width: 560px) {
	.layout-novo .lista-grade {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.is-portal .estoque-vazio-fantasmas {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.is-portal .estoque-vazio-fantasma:nth-child(3) {
		display: block;
	}
}
@media (min-width: 768px) {
	.is-portal .estoque-vazio {
		padding: 36px 40px 40px;
	}
	.is-portal .estoque-vazio-texto h2 {
		font-size: 28px;
	}
	.is-portal .estoque-vazio-convite {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding: 22px 24px;
	}
	.is-portal .estoque-vazio-botoes {
		flex: none;
		flex-wrap: nowrap;
	}
}

/* Celular e tablet: os filtros saem da página e viram um painel lateral. */
@media (max-width: 991px) {
	.layout-novo .filtros-painel {
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		z-index: 1200;
		width: min(380px, 90vw);
		background: #fff;
		box-shadow: 0 0 40px rgba(16, 24, 40, .2);
		transform: translateX(-105%);
		visibility: hidden;
		transition: transform .25s ease, visibility 0s linear .25s;
	}
	.layout-novo.filtros-aberto {
		overflow: hidden;
	}
	.layout-novo.filtros-aberto .filtros-painel {
		transform: none;
		visibility: visible;
		transition: transform .25s ease;
	}
	.layout-novo .filtros-corpo {
		flex: 1;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	.layout-novo .filtros-acoes {
		padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));
	}
	.layout-novo .filtros-fechar {
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
	.layout-novo .filtros-limpar-topo {
		display: none;
	}
	.layout-novo .filtro-abrir {
		display: inline-flex;
	}
}
@media (max-width: 767px) {
	.layout-novo .lista-contagem {
		width: 100%;
	}
	.layout-novo .lista-acoes {
		width: 100%;
	}
	.layout-novo .filtro-abrir,
	.layout-novo .lista-ordem {
		flex: 1 1 0;
		min-width: 0;
	}
	.layout-novo .lista-ordem span {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}
	.layout-novo .lista-ordem .filtro-campo {
		width: 100%;
		min-width: 0;
	}
}
@media (min-width: 992px) {
	.layout-novo .lista-portal {
		display: grid;
		grid-template-columns: 272px minmax(0, 1fr);
		gap: 28px;
		align-items: start;
	}
	.layout-novo .filtros-painel {
		position: sticky;
		top: 100px;
		max-height: calc(100vh - 116px);
		overflow-y: auto;
		border: 1px solid var(--borda-suave);
		border-radius: 14px;
		background: #fff;
		scrollbar-width: thin;
	}
	/* No computador cada escolha já aplica: o "Ver resultados" é do painel do celular. */
	.layout-novo .filtros-acoes {
		display: none;
	}
	.layout-novo .lista-categorias {
		flex-wrap: wrap;
		margin: 0 0 16px;
		padding: 0;
		overflow: visible;
	}
}
@media (min-width: 1200px) {
	.layout-novo .lista-grade {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 18px;
	}
}

/* ---------------------------------------------------------------------------
 * Sites das revendas no layout novo (.is-revenda): os mesmos componentes do
 * site institucional (.layout-novo), com as cores da revenda. As variáveis
 * --marca*, --topo-fundo e --topo-texto vêm do <style> do index.php
 * (varsCorRevendaSite()); aqui ficam os tons neutros e o que é só da revenda:
 * faixa de contatos, topo na cor dela, marcas, rodapé e WhatsApp flutuante.
 * ------------------------------------------------------------------------- */
.is-revenda {
	--texto-forte: #101828;
	--texto-medio: #475467;
	--borda-suave: #e4e7ec;
	--fundo-secao: #f7f8fa;
	background: #fff;
}
.is-revenda a[name],
.is-revenda [id] {
	scroll-margin-top: 96px;
}

/* Faixa fina de contatos acima do topo (só no computador). */
.revenda-faixa {
	display: none;
	background: linear-gradient(rgba(16, 24, 40, .045), rgba(16, 24, 40, .045)), var(--topo-fundo);
	font-size: 13px;
}
.revenda-faixa.topo-escuro {
	background: linear-gradient(rgba(255, 255, 255, .07), rgba(255, 255, 255, .07)), var(--topo-fundo);
}
.revenda-faixa-linha {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 22px;
	min-height: 34px;
}
.revenda-faixa-linha:before,
.revenda-faixa-linha:after {
	display: none;
}
.is-revenda .revenda-faixa a,
.is-revenda .revenda-menu-contatos a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: var(--topo-texto);
	opacity: .82;
	text-decoration: none;
}
.is-revenda .revenda-faixa a:hover,
.is-revenda .revenda-faixa a:focus,
.is-revenda .revenda-menu-contatos a:hover {
	opacity: 1;
	color: var(--topo-texto);
}
.revenda-redes {
	display: inline-flex;
	gap: 12px;
}
.revenda-redes i {
	font-size: 16px;
}
@media (min-width: 992px) {
	.revenda-faixa {
		display: block;
	}
}

/* Topo na cor da revenda. */
.is-revenda .revenda-topo {
	background: var(--topo-fundo);
}
.is-revenda .revenda-topo.topo-escuro {
	border-bottom-color: rgba(255, 255, 255, .08);
}
.is-revenda .revenda-topo .portal-menu nav a {
	color: var(--topo-texto);
}
.is-revenda .revenda-topo .portal-menu nav a:hover,
.is-revenda .revenda-topo .portal-menu nav a:focus,
.is-revenda .revenda-topo .portal-menu nav a[aria-current="page"] {
	color: var(--marca-tinta);
}
.is-revenda .revenda-topo.topo-escuro .portal-menu nav a:hover,
.is-revenda .revenda-topo.topo-escuro .portal-menu nav a:focus,
.is-revenda .revenda-topo.topo-escuro .portal-menu nav a[aria-current="page"] {
	color: var(--topo-texto);
}
.is-revenda .revenda-topo.topo-escuro .portal-menu nav a[aria-current="page"] {
	box-shadow: inset 0 -2px 0 var(--cta-topo);
}
.is-revenda .revenda-topo.topo-escuro .portal-busca input[type="search"] {
	border-color: rgba(255, 255, 255, .16);
	background: rgba(255, 255, 255, .08);
	color: var(--topo-texto);
}
.is-revenda .revenda-topo.topo-escuro .portal-busca input[type="search"]:focus {
	background: rgba(255, 255, 255, .14);
}
.is-revenda .revenda-topo.topo-escuro .portal-busca input[type="search"]::placeholder,
.is-revenda .revenda-topo.topo-escuro .portal-busca i {
	color: rgba(255, 255, 255, .6);
}
.is-revenda .revenda-topo.topo-escuro .portal-hamburguer {
	border-color: rgba(255, 255, 255, .2);
	background: transparent;
}
.is-revenda .revenda-topo.topo-escuro .portal-hamburguer span {
	background: var(--topo-texto);
}
/* Logo da revenda: cabe na barra sem deformar, seja largo ou quadrado. */
.is-revenda .revenda-logo img {
	width: auto;
	max-width: 180px;
	max-height: 48px;
}
.is-revenda .revenda-logo [hidden] {
	display: none;
}
.is-revenda .revenda-logo-nome {
	font-size: 19px;
	font-weight: 900;
	line-height: 1.15;
	color: var(--topo-texto);
}
/* WhatsApp no lugar do teste grátis. */
.is-revenda a.revenda-cta {
	gap: 8px;
	background: var(--cta-topo);
	color: var(--cta-topo-texto);
	box-shadow: none;
}
.is-revenda a.revenda-cta:hover,
.is-revenda a.revenda-cta:focus {
	background: var(--cta-topo);
	color: var(--cta-topo-texto);
	opacity: .88;
}
.is-revenda a.revenda-cta i {
	font-size: 17px;
}
.revenda-menu-contatos {
	display: none;
}
@media (max-width: 991px) {
	.is-revenda .revenda-logo img {
		max-width: 150px;
		max-height: 40px;
	}
	.is-revenda .revenda-logo-nome {
		font-size: 17px;
	}
	.is-revenda .revenda-topo.topo-escuro .portal-menu nav a {
		border-bottom-color: rgba(255, 255, 255, .1);
	}
	.is-revenda .revenda-topo.topo-escuro .portal-menu nav a[aria-current="page"] {
		box-shadow: none;
		color: var(--topo-texto);
		font-weight: 900;
	}
	.revenda-menu-contatos {
		display: flex;
		flex-wrap: wrap;
		gap: 12px 20px;
		padding: 12px 2px 6px;
		font-size: 14.5px;
	}
}
@media (max-width: 400px) {
	/* Em 375px o WhatsApp do topo fica só com o ícone, para o logo caber. */
	.is-revenda a.portal-cta-celular.revenda-cta {
		width: 40px;
		padding: 0;
		font-size: 0;
	}
	.is-revenda a.portal-cta-celular.revenda-cta i {
		font-size: 19px;
	}
}
@media (min-width: 992px) {
	.is-revenda .revenda-logo img {
		max-height: 56px;
		max-width: 200px;
	}
}

/* Marcas do estoque: logos em quadros iguais, que levam para a busca. */
.revenda-marcas {
	padding: 40px 0 44px;
	border-top: 1px solid var(--borda-suave);
	background: var(--fundo-secao);
}
.revenda-marcas h2 {
	margin: 0 0 18px;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--texto-medio);
}
.revenda-marcas ul {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.revenda-marcas li {
	margin: 0;
}
.is-revenda .revenda-marcas a {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 72px;
	padding: 12px 14px;
	border: 1px solid var(--borda-suave);
	border-radius: 12px;
	background: #fff;
	text-decoration: none;
	transition: border-color .15s, transform .15s;
}
.is-revenda .revenda-marcas a:hover,
.is-revenda .revenda-marcas a:focus {
	border-color: rgba(var(--marca-rgb), .45);
	transform: translateY(-1px);
}
.revenda-marcas img {
	max-width: 100%;
	max-height: 46px;
	object-fit: contain;
}
.revenda-marcas span {
	font-size: 14px;
	font-weight: 800;
	text-align: center;
	text-transform: uppercase;
	color: var(--texto-forte);
}

/* Rodapé: grafite neutro, que combina com qualquer cor de revenda. */
.revenda-rodape {
	background: #101828;
	color: rgba(255, 255, 255, .72);
	font-size: 14.5px;
}
.revenda-rodape-grade {
	display: grid;
	align-items: start;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 28px 20px;
	padding: 44px 0 36px;
}
.revenda-rodape-loja {
	grid-column: 1 / -1;
}
.revenda-rodape-loja strong {
	display: block;
	margin-bottom: 10px;
	font-size: 19px;
	font-weight: 900;
	color: #fff;
}
.revenda-rodape-loja p {
	display: flex;
	gap: 8px;
	margin: 0 0 14px;
	line-height: 1.5;
}
.revenda-rodape-loja p i {
	margin-top: 3px;
}
.revenda-rodape-redes {
	display: flex;
	gap: 10px;
}
.layout-novo .revenda-rodape-redes a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: rgba(255, 255, 255, .08);
	font-size: 17px;
	color: #fff;
}
.layout-novo .revenda-rodape-redes a:hover {
	background: rgba(255, 255, 255, .16);
	color: #fff;
}
.revenda-rodape-coluna h2 {
	margin: 0 0 12px;
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .5);
}
.revenda-rodape-coluna ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.revenda-rodape-coluna li {
	margin: 0 0 9px;
}
.layout-novo .revenda-rodape a {
	color: rgba(255, 255, 255, .8);
	text-decoration: none;
}
.layout-novo .revenda-rodape-coluna a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	word-break: break-word;
}
.revenda-rodape-coluna a i {
	flex: none;
	width: 16px;
	margin: 0;
	text-align: center;
}
.layout-novo .revenda-rodape a:hover,
.layout-novo .revenda-rodape a:focus {
	color: #fff;
}
.revenda-rodape-fim {
	border-top: 1px solid rgba(255, 255, 255, .08);
	font-size: 13px;
	color: rgba(255, 255, 255, .5);
}
.revenda-rodape-fim .container {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 6px 20px;
	padding-top: 16px;
	padding-bottom: 16px;
}
.revenda-rodape-fim .container:before,
.revenda-rodape-fim .container:after {
	display: none;
}
.revenda-rodape-fim p {
	margin: 0;
}
.layout-novo .revenda-rodape-fim a {
	color: rgba(255, 255, 255, .7);
	font-weight: 700;
}
@media (min-width: 768px) {
	.revenda-rodape-grade {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1.3fr);
		gap: 40px;
		padding: 56px 0 44px;
	}
	.revenda-rodape-loja {
		grid-column: auto;
	}
}
/* Espaço para o WhatsApp flutuante não cobrir o fim do rodapé no celular. */
@media (max-width: 767px) {
	.revenda-rodape-fim .container {
		padding-bottom: 84px;
	}
}

/* WhatsApp flutuante (o mesmo botão do site institucional), com o ícone da fonte. */
.is-revenda a.revenda-whatsapp,
.is-revenda a.revenda-whatsapp:hover,
.is-revenda a.revenda-whatsapp:focus {
	width: 56px;
	height: 56px;
	color: #fff;
	text-decoration: none;
}
.is-revenda a.revenda-whatsapp i {
	font-size: 30px;
}

/* Lista do estoque no site da revenda: o mesmo fundo e respiro do
 * institucional; na home, o título ao lado do link para a lista com
 * filtros e os cartões em até quatro colunas (sem a coluna de filtros). */
.is-revenda .lista-estoque.section-padding-min.gray-bg {
	background: var(--fundo-secao);
	padding: 24px 0 64px;
}
.is-revenda.pg_home .lista-estoque.section-padding-min.gray-bg {
	padding-top: 40px;
}
.lista-home-topo {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 14px 24px;
	margin-bottom: 22px;
}
.lista-home-topo h2 {
	margin: 0;
	font-size: 26px;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: -.01em;
	color: var(--texto-forte);
}
.lista-home-topo p {
	margin: 6px 0 0;
	font-size: 15.5px;
	color: var(--texto-medio);
}
.layout-novo .lista-nada-icone svg {
	width: 30px;
	height: 30px;
}
@media (min-width: 768px) {
	.lista-home-topo h2 {
		font-size: 32px;
	}
}
@media (min-width: 992px) {
	.layout-novo .lista-grade-larga {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
@media (min-width: 1200px) {
	.layout-novo .lista-grade-larga {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* Banner da revenda no alto da home: a imagem inteira na largura, numa
 * faixa de altura contida (o tema dava 120px de respiro em cima e embaixo). */
.is-revenda .banner-section {
	padding: 0 !important;
	height: clamp(160px, 28vw, 380px);
	background-size: cover;
	background-position: center;
}
.is-revenda .banner-section .container {
	display: none;
}

/* Ofertas aleatórias da home da revenda: faixa na cor dela, com os cartões
 * numa fileira que rola para o lado. */
.revenda-ofertas {
	padding: 48px 0 52px;
	background: var(--marca);
	color: var(--marca-contraste);
}
.revenda-ofertas-topo {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 22px;
}
.revenda-ofertas h2 {
	margin: 0;
	font-size: 26px;
	font-weight: 900;
	line-height: 1.2;
	color: inherit;
}
.revenda-ofertas-topo p {
	margin: 6px 0 0;
	font-size: 15.5px;
	opacity: .85;
}
.revenda-ofertas-setas {
	display: none;
	gap: 8px;
}
.revenda-ofertas-setas button {
	width: 42px;
	height: 42px;
	border: 1px solid currentColor;
	border-radius: 50%;
	background: transparent;
	font-size: 22px;
	line-height: 1;
	color: inherit;
	opacity: .85;
}
.revenda-ofertas-setas button:hover {
	opacity: 1;
}
.revenda-ofertas-fileira {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 82%;
	gap: 16px;
	margin: 0 -15px;
	padding: 4px 15px 8px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding: 0 15px;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.revenda-ofertas-fileira::-webkit-scrollbar {
	display: none;
}
.revenda-ofertas-fileira .cartao-item {
	scroll-snap-align: start;
	border-color: transparent;
}
@media (min-width: 560px) {
	.revenda-ofertas-fileira {
		grid-auto-columns: calc((100% - 16px) / 2);
	}
}
@media (min-width: 768px) {
	.revenda-ofertas h2 {
		font-size: 32px;
	}
	.revenda-ofertas-setas {
		display: flex;
	}
	.revenda-ofertas-fileira {
		grid-auto-columns: calc((100% - 32px) / 3);
		margin: 0;
		padding: 4px 0 8px;
		scroll-padding: 0;
	}
}
@media (min-width: 1200px) {
	.revenda-ofertas-fileira {
		grid-auto-columns: calc((100% - 48px) / 4);
	}
}

/* ---------------------------------------------------------------------------
 * Página do item (item.php), no site institucional e no da revenda: fotos e
 * detalhes à esquerda, o resumo com preço e contato à direita (preso ao
 * rolar); no celular, fotos, resumo e detalhes um embaixo do outro e a barra
 * com o preço e o WhatsApp no pé da tela.
 * ------------------------------------------------------------------------- */
.layout-novo .item-pagina {
	padding: 20px 0 48px;
	background: var(--fundo-secao);
}
.layout-novo .item-trilha {
	margin-bottom: 16px;
}
.layout-novo .item-trilha span {
	max-width: 60vw;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.layout-novo .item-grade {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas: "galeria" "miniaturas" "resumo" "detalhes";
	gap: 16px;
}
.layout-novo .item-galeria {
	grid-area: galeria;
	position: relative;
	border-radius: 14px;
	overflow: hidden;
	background: #0f1115;
}
.layout-novo .item-galeria-trilho {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.layout-novo .item-galeria-trilho::-webkit-scrollbar {
	display: none;
}
.layout-novo .item-galeria-trilho:focus-visible {
	outline: 3px solid rgba(var(--marca-rgb), .5);
	outline-offset: -3px;
}
.layout-novo .item-galeria-foto {
	flex: 0 0 100%;
	margin: 0;
	aspect-ratio: 4 / 3;
	scroll-snap-align: start;
}
.layout-novo .item-galeria-foto img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	cursor: zoom-in;
}
.layout-novo .item-galeria.sem-foto {
	aspect-ratio: 4 / 3;
	background: var(--fundo-secao);
	border: 1px solid var(--borda-suave);
}
.layout-novo .item-galeria-semfoto {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background: linear-gradient(160deg, var(--marca-suave) 0%, var(--fundo-secao) 70%);
	color: rgba(var(--marca-rgb), .5);
}
.layout-novo .item-galeria-semfoto svg {
	width: 110px;
	height: 110px;
}
.layout-novo .item-galeria-semfoto span {
	font-size: 15px;
	font-weight: 600;
	color: var(--texto-medio);
}
.layout-novo .item-galeria-seta {
	position: absolute;
	top: 50%;
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-top: -22px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .92);
	box-shadow: 0 2px 10px rgba(16, 24, 40, .18);
	font-size: 24px;
	line-height: 1;
	color: var(--texto-forte);
}
.layout-novo .item-galeria-seta.anterior { left: 14px; }
.layout-novo .item-galeria-seta.proxima { right: 14px; }
.layout-novo .item-galeria-seta:hover {
	background: #fff;
}
.layout-novo .item-galeria-contador {
	position: absolute;
	right: 12px;
	bottom: 12px;
	padding: 4px 10px;
	border-radius: 999px;
	background: rgba(16, 24, 40, .7);
	font-size: 12.5px;
	font-weight: 700;
	color: #fff;
}
.layout-novo .item-miniaturas {
	grid-area: miniaturas;
	display: flex;
	gap: 8px;
	margin-top: -6px;
	overflow-x: auto;
	scrollbar-width: none;
}
.layout-novo .item-miniaturas::-webkit-scrollbar {
	display: none;
}
.layout-novo .item-miniaturas button {
	flex: 0 0 76px;
	height: 57px;
	padding: 0;
	border: 2px solid transparent;
	border-radius: 8px;
	background: var(--borda-suave);
	overflow: hidden;
	opacity: .7;
	transition: opacity .15s, border-color .15s;
}
.layout-novo .item-miniaturas button.ativa,
.layout-novo .item-miniaturas button:hover {
	border-color: var(--marca);
	opacity: 1;
}
.layout-novo .item-miniaturas img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Resumo: nome, preço e contato. */
.layout-novo .item-resumo {
	grid-area: resumo;
}
.layout-novo .item-resumo-cartao {
	padding: 20px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
}
.layout-novo .item-titulo {
	margin: 0 0 6px;
	font-size: 22px;
	font-weight: 900;
	line-height: 1.25;
	letter-spacing: -.005em;
	text-transform: uppercase;
	color: var(--texto-forte);
}
.layout-novo .item-titulo span {
	font-weight: 500;
	color: var(--texto-medio);
}
.layout-novo .item-subtitulo {
	margin: 0 0 16px;
	font-size: 14.5px;
	color: var(--texto-medio);
}
.layout-novo .item-preco {
	margin: 0 0 18px;
	padding-top: 16px;
	border-top: 1px solid var(--borda-suave);
	font-size: 32px;
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -.02em;
	color: var(--texto-forte);
}
.layout-novo .item-preco.consultar {
	font-size: 22px;
	letter-spacing: 0;
	color: var(--texto-medio);
}
.layout-novo .item-acoes {
	display: grid;
	gap: 10px;
}
.layout-novo .item-acoes .botao-leve {
	width: 100%;
	height: 46px;
}
.layout-novo a.item-botao-whatsapp {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 52px;
	padding: 0 18px;
	border-radius: 10px;
	background: #1fa855;
	font-size: 16px;
	font-weight: 800;
	color: #fff;
	text-decoration: none;
	transition: background .15s;
}
.layout-novo a.item-botao-whatsapp i {
	font-size: 22px;
}
.layout-novo a.item-botao-whatsapp:hover,
.layout-novo a.item-botao-whatsapp:focus {
	background: #178a45;
	color: #fff;
}
/* Institucional: o anúncio no site da loja, com o mesmo peso do WhatsApp. */
.layout-novo a.item-botao-site {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 52px;
	padding: 8px 18px;
	border-radius: 10px;
	background: var(--marca);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.25;
	text-align: center;
	color: #fff;
	text-decoration: none;
	transition: background .15s;
}
.layout-novo a.item-botao-site i {
	flex: 0 0 auto;
	font-size: 17px;
}
.layout-novo a.item-botao-site:hover,
.layout-novo a.item-botao-site:focus {
	background: var(--marca-escura);
	color: #fff;
}
.layout-novo a.item-loja {
	display: block;
	margin-top: 16px;
	padding: 14px 16px;
	border: 1px solid var(--borda-suave);
	border-radius: 12px;
	background: var(--fundo-secao);
	font-size: 14px;
	color: var(--texto-medio);
	text-decoration: none;
}
.layout-novo a.item-loja:hover {
	border-color: rgba(var(--marca-rgb), .4);
}
.layout-novo .item-loja span {
	display: block;
}
.layout-novo .item-loja-rotulo {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}
.layout-novo .item-loja strong {
	display: block;
	margin: 2px 0;
	font-size: 16px;
	color: var(--texto-forte);
}
.layout-novo .item-loja-mais {
	margin-top: 6px;
	font-weight: 700;
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .item-codigo {
	margin: 14px 0 0;
	font-size: 12.5px;
	color: #98a2b3;
}

/* Destaques, ficha e opcionais. */
.layout-novo .item-detalhes {
	grid-area: detalhes;
	display: grid;
	gap: 16px;
	min-width: 0;
}
.layout-novo .item-bloco {
	padding: 20px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
}
.layout-novo .item-bloco h2,
.layout-novo .item-outras h2 {
	margin: 0 0 16px;
	font-size: 19px;
	font-weight: 900;
	text-transform: none;
	color: var(--texto-forte);
}
.layout-novo .item-destaques {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.layout-novo .item-destaques li {
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr);
	grid-template-rows: auto auto;
	column-gap: 10px;
	align-items: center;
	margin: 0;
	padding: 12px;
	border-radius: 10px;
	background: var(--fundo-secao);
}
.layout-novo .item-destaques i {
	grid-row: 1 / 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 9px;
	background: var(--marca-suave);
	font-size: 15px;
	color: var(--marca-tinta, var(--marca));
}
.layout-novo .item-destaques span {
	font-size: 12px;
	color: var(--texto-medio);
}
.layout-novo .item-destaques strong {
	overflow: hidden;
	font-size: 14.5px;
	font-weight: 800;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: var(--texto-forte);
}
.layout-novo .item-ficha {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	margin: 0;
}
.layout-novo .item-ficha div {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 11px 0;
	border-bottom: 1px solid var(--borda-suave);
	font-size: 14.5px;
}
.layout-novo .item-ficha dt {
	font-weight: 400;
	color: var(--texto-medio);
}
.layout-novo .item-ficha dd {
	margin: 0;
	font-weight: 700;
	text-align: right;
	color: var(--texto-forte);
}
.layout-novo .item-opcionais {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 8px 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.layout-novo .item-opcionais li {
	display: flex;
	align-items: baseline;
	gap: 9px;
	margin: 0;
	font-size: 14.5px;
	color: var(--texto-forte);
}
.layout-novo .item-opcionais i {
	font-size: 12px;
	color: var(--marca-tinta, var(--marca));
}

/* Outras ofertas. */
.layout-novo .item-outras {
	padding: 8px 0 56px;
	background: var(--fundo-secao);
}
.layout-novo .item-outras .lista-home-topo {
	align-items: center;
}
.layout-novo .item-outras h2 {
	margin: 0;
	font-size: 24px;
}
.layout-novo .item-indisponivel {
	margin: 12px 0 8px;
}

/* Barra do celular com o preço e o WhatsApp. */
.item-barra-celular {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1020;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 15px calc(10px + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--borda-suave);
	background: #fff;
	box-shadow: 0 -4px 16px rgba(16, 24, 40, .08);
}
.item-barra-celular div {
	flex: 1;
	min-width: 0;
}
.item-barra-celular span {
	display: block;
	overflow: hidden;
	font-size: 12px;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: var(--texto-medio);
}
.item-barra-celular strong {
	font-size: 18px;
	font-weight: 900;
	color: var(--texto-forte);
}
.layout-novo .item-barra-celular a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 44px;
	padding: 0 18px;
	border-radius: 10px;
	background: #1fa855;
	font-size: 15px;
	font-weight: 800;
	color: #fff;
	text-decoration: none;
}
.item-barra-celular a i {
	font-size: 19px;
}
@media (max-width: 991px) {
	/* A barra já tem o WhatsApp: sem o botão flutuante e com espaço no fim. */
	.pg_item .revenda-whatsapp {
		display: none;
	}
	.pg_item footer {
		padding-bottom: 66px;
	}
}
@media (min-width: 560px) {
	.layout-novo .item-destaques {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.layout-novo .item-opcionais {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (min-width: 768px) {
	.layout-novo .item-ficha {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 32px;
	}
	.layout-novo .item-opcionais {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.layout-novo .item-titulo {
		font-size: 26px;
	}
}
@media (min-width: 992px) {
	.layout-novo .item-pagina {
		padding-top: 28px;
	}
	.layout-novo .item-grade {
		grid-template-columns: minmax(0, 1fr) 380px;
		grid-template-areas: "galeria resumo" "miniaturas resumo" "detalhes resumo";
		grid-template-rows: auto auto 1fr;
		column-gap: 28px;
		row-gap: 16px;
		align-items: start;
	}
	.layout-novo .item-resumo {
		position: sticky;
		top: 104px;
	}
	.is-revenda .item-resumo {
		top: 100px;
	}
	.layout-novo .item-galeria-seta {
		display: flex;
	}
	.layout-novo .item-miniaturas {
		margin-top: 0;
	}
	.item-barra-celular {
		display: none;
	}
	.layout-novo .item-outras h2 {
		font-size: 28px;
	}
}

/* Foto ampliada ao clicar (página do item). */
.foto-zoom-overlay {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 9999;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, .9);
}
.foto-zoom-overlay.aberto {
	display: flex;
}
.foto-zoom-overlay img {
	max-width: 92%;
	max-height: 90%;
	cursor: zoom-out;
}
.foto-zoom-fechar {
	position: absolute;
	top: 16px;
	right: 26px;
	font-size: 2.5rem;
	line-height: 1;
	color: #fff;
	cursor: pointer;
}

/* Contato da revenda: dados da loja com ícone e o mapa, quando cadastrado. */
.layout-novo .contato-dados li {
	align-items: baseline;
	word-break: break-word;
}
.layout-novo .contato-dados a {
	color: var(--texto-forte);
}
.layout-novo .contato-mapa {
	margin-top: 14px;
	border-radius: 12px;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--fundo-secao);
}
.layout-novo .contato-mapa iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

/* Empresa e Links da revenda: o conteúdo em cartões, no fundo das listas. */
.pagina-revenda {
	padding: 32px 0 64px;
	background: var(--fundo-secao);
}
.pagina-revenda-grade {
	display: grid;
	gap: 24px;
	align-items: start;
}
.pagina-revenda-texto {
	padding: 24px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
	font-size: 16px;
	line-height: 1.7;
	color: var(--texto-forte);
}
.pagina-revenda-texto p {
	margin: 0;
}
.pagina-revenda-banner {
	display: block;
	width: 100%;
	max-height: 320px;
	margin-bottom: 22px;
	border-radius: 10px;
	object-fit: cover;
}
.layout-novo .pagina-revenda .contato-lateral {
	display: grid;
	gap: 16px;
}
.layout-novo .pagina-revenda a.contato-botao-whatsapp {
	margin-top: 16px;
}
.links-grade {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 16px;
}
.links-cartao {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 22px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
	color: var(--texto-medio);
	text-decoration: none;
}
.is-revenda a.links-cartao {
	color: var(--texto-medio);
	transition: border-color .15s, transform .15s;
}
.is-revenda a.links-cartao:hover,
.is-revenda a.links-cartao:focus {
	border-color: rgba(var(--marca-rgb), .45);
	color: var(--texto-medio);
	text-decoration: none;
	transform: translateY(-2px);
}
.links-cartao strong {
	font-size: 17px;
	font-weight: 800;
	color: var(--texto-forte);
}
.links-icone {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	margin-bottom: 6px;
	border-radius: 11px;
	background: var(--marca-suave);
	font-size: 18px;
	color: var(--marca-tinta);
}
.links-cartao ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 4px 0 0;
	padding: 0;
	list-style: none;
}
.links-cartao li {
	margin: 0;
}
.is-revenda .links-cartao li a {
	display: inline-block;
	padding: 5px 11px;
	border-radius: 999px;
	background: var(--fundo-secao);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--texto-forte);
	text-decoration: none;
}
.is-revenda .links-cartao li a:hover {
	background: var(--marca-suave);
	color: var(--marca-tinta);
}
@media (min-width: 768px) {
	.links-grade {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.pagina-revenda-texto {
		padding: 32px 36px;
	}
}
@media (min-width: 992px) {
	.pagina-revenda {
		padding: 44px 0 80px;
	}
	.pagina-revenda-grade {
		grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
		gap: 32px;
	}
}

/* ---------------------------------------------------------------------------
 * Revendas/lojas no site institucional (revendas.php): uma linha por loja,
 * com logo, nome, cidade e o "Ver estoque completo" (site da loja, em outra
 * aba) e, ao lado, alguns itens do estoque numa fileira que rola para o lado.
 * ------------------------------------------------------------------------- */
.is-portal .lojas-portal {
	padding: 28px 0 72px;
	background: linear-gradient(180deg, var(--fundo-secao) 0, #fff 520px);
}
.is-portal .lojas-lista {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.is-portal .loja-linha {
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding: 18px;
	border: 1px solid var(--borda-suave);
	border-radius: 16px;
	background: #fff;
}
.is-portal .loja-linha-info {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	gap: 4px 14px;
	align-items: center;
}
/* Quadro do logo: mesma altura em todas as lojas, o logo inteiro dentro. */
.is-portal .loja-linha-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 64px;
	padding: 8px 10px;
	border: 1px solid var(--borda-suave);
	border-radius: 10px;
	background: #fcfcfd;
}
.is-portal .loja-linha-logo img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}
.is-portal .loja-linha-iniciais {
	display: none;
	font-size: 12.5px;
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
	color: var(--texto-medio);
}
.is-portal .loja-linha-logo.sem-logo .loja-linha-iniciais {
	display: block;
}
.is-portal .loja-linha-texto h2 {
	margin: 0 0 4px;
	font-size: 17px;
	font-weight: 800;
	line-height: 1.3;
	text-transform: none;
	color: var(--texto-forte);
}
.is-portal .loja-linha-texto p {
	margin: 0;
	font-size: 14px;
	line-height: 1.45;
	color: var(--texto-medio);
}
.is-portal .loja-linha-texto p i {
	margin-right: 3px;
	color: var(--marca);
}

.is-portal .loja-linha-botao {
	grid-column: 1 / -1;
	margin-top: 12px;
}
.is-portal .loja-linha-botao i {
	font-size: 13px;
}
.is-portal .loja-linha-estoque {
	position: relative;
	min-width: 0;
}
.is-portal .loja-linha-setas {
	display: none;
}
.is-portal .loja-linha-fileira {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 78%;
	gap: 14px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.is-portal .loja-linha-fileira::-webkit-scrollbar {
	display: none;
}
.is-portal .loja-linha-fileira .cartao-item {
	scroll-snap-align: start;
}
.is-portal .loja-linha-vazio {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 20px;
	border: 1px dashed var(--borda-suave);
	border-radius: 12px;
	font-size: 14.5px;
	color: var(--texto-medio);
}
.is-portal .loja-linha-vazio svg {
	flex: 0 0 auto;
	width: 36px;
	height: 36px;
	color: var(--marca);
	opacity: .6;
}

@media (min-width: 560px) {
	.is-portal .loja-linha-fileira {
		grid-auto-columns: calc((100% - 14px) / 2);
	}
}
@media (min-width: 768px) {
	.is-portal .loja-linha {
		padding: 22px;
	}
	.is-portal .loja-linha-info {
		grid-template-columns: 150px minmax(0, 1fr) auto;
		gap: 4px 20px;
	}
	.is-portal .loja-linha-logo {
		height: 84px;
	}
	.is-portal .loja-linha-botao {
		grid-column: auto;
		margin-top: 0;
	}
	.is-portal .loja-linha-fileira {
		grid-auto-columns: calc((100% - 28px) / 3);
	}
}
/* Desktop: a loja numa coluna à esquerda e a fileira ocupando o resto. */
@media (min-width: 1100px) {
	.is-portal .lojas-portal {
		padding: 40px 0 88px;
	}
	.is-portal .loja-linha {
		display: grid;
		grid-template-columns: 250px minmax(0, 1fr);
		gap: 28px;
		align-items: stretch;
		padding: 24px;
	}
	.is-portal .loja-linha-info {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 14px;
	}
	.is-portal .loja-linha-logo {
		height: 110px;
	}
	.is-portal .loja-linha-botao {
		margin-top: auto;
	}
	.is-portal .loja-linha-fileira {
		grid-auto-columns: calc((100% - 42px) / 4);
	}
	.is-portal .loja-linha-vazio {
		height: 100%;
	}
	/* Setas sobre as bordas da fileira. */
	.is-portal .loja-linha-setas {
		display: block;
	}
	.is-portal .loja-linha-setas button {
		position: absolute;
		top: 30%;
		z-index: 2;
		width: 40px;
		height: 40px;
		border: 1px solid var(--borda-suave);
		border-radius: 50%;
		background: #fff;
		box-shadow: 0 2px 8px rgba(16, 24, 40, .12);
		font-size: 22px;
		line-height: 1;
		color: var(--texto-forte);
		transition: opacity .15s, color .15s;
	}
	.is-portal .loja-linha-setas button:hover {
		color: var(--marca);
	}
	.is-portal .loja-linha-setas button[data-rolar="-1"] {
		left: -20px;
	}
	.is-portal .loja-linha-setas button[data-rolar="1"] {
		right: -20px;
	}
	.is-portal .loja-linha-setas button:disabled {
		opacity: 0;
		pointer-events: none;
	}
}

/* Versão enxuta da linha da loja: fundo cinza para os cartões brancos se
 * destacarem, informação da loja reduzida e miniaturas menores (só foto,
 * nome e preço). */
.is-portal .lojas-portal {
	background: #fff;
}
.is-portal .lojas-lista {
	gap: 14px;
}
.is-portal .loja-linha {
	gap: 14px;
	padding: 16px;
	border: 0;
	border-radius: 16px;
	background: #f2f4f7;
}
.is-portal.site-agricola .loja-linha {
	background: #f4f0ee;
}
.is-portal .loja-linha-logo {
	border: 0;
	background: #fff;
}
.is-portal .loja-linha-texto h2 {
	margin-bottom: 2px;
	font-size: 16px;
}
.is-portal .loja-linha-texto p {
	font-size: 13.5px;
}
.is-portal .loja-linha-botao {
	height: 38px;
	padding: 0 14px;
	border-color: transparent;
	font-size: 13.5px;
}
.is-portal .loja-linha-fileira {
	grid-auto-columns: 46%;
	gap: 10px;
}
.is-portal .loja-linha-fileira .cartao-item {
	border: 0;
	border-radius: 12px;
}
.is-portal .loja-linha-fileira .cartao-item:hover {
	box-shadow: none;
	transform: none;
}
.is-portal .loja-linha-fileira .cartao-item-corpo {
	padding: 10px 12px 12px;
}
.is-portal .loja-linha-fileira .cartao-item-nome {
	display: block;
	min-height: 0;
	margin: 0 0 4px;
	font-size: 13px;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.is-portal .loja-linha-fileira .cartao-item-nome span,
.is-portal .loja-linha-fileira .cartao-item-dados,
.is-portal .loja-linha-fileira .cartao-item-cta {
	display: none;
}
.is-portal .loja-linha-fileira .cartao-item-rodape {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}
.is-portal .loja-linha-fileira .cartao-item-preco {
	font-size: 15px;
	font-weight: 800;
}
.is-portal .loja-linha-fileira .cartao-item-preco.consultar {
	font-size: 13px;
	font-weight: 600;
}
.is-portal .loja-linha-fileira .cartao-item-semfoto svg {
	width: 44px;
	height: 44px;
}
.is-portal .loja-linha-fileira .cartao-item-semfoto span {
	display: none;
}
.is-portal .loja-linha-vazio {
	padding: 14px 16px;
	border-color: #d0d5dd;
	font-size: 13.5px;
}
@media (min-width: 560px) {
	.is-portal .loja-linha-fileira {
		grid-auto-columns: calc((100% - 20px) / 3);
	}
}
@media (min-width: 768px) {
	.is-portal .loja-linha {
		padding: 18px;
	}
	.is-portal .loja-linha-info {
		grid-template-columns: 120px minmax(0, 1fr) auto;
	}
	.is-portal .loja-linha-logo {
		height: 64px;
	}
	.is-portal .loja-linha-fileira {
		grid-auto-columns: calc((100% - 40px) / 5);
	}
}
@media (min-width: 1100px) {
	.is-portal .loja-linha {
		grid-template-columns: 200px minmax(0, 1fr);
		gap: 22px;
		padding: 18px 20px;
	}
	.is-portal .loja-linha-info {
		gap: 10px;
	}
	.is-portal .loja-linha-logo {
		height: 80px;
	}
	.is-portal .loja-linha-fileira {
		grid-auto-columns: calc((100% - 50px) / 6);
	}
	.is-portal .loja-linha-setas button {
		top: 28%;
		width: 34px;
		height: 34px;
		font-size: 19px;
	}
	.is-portal .loja-linha-setas button[data-rolar="-1"] {
		left: -17px;
	}
	.is-portal .loja-linha-setas button[data-rolar="1"] {
		right: -17px;
	}
}
@media (min-width: 1100px) {
	/* Loja sem anúncio: o aviso numa linha, centrado na altura da loja. */
	.is-portal .loja-linha-estoque {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.is-portal .loja-linha-fileira {
		width: 100%;
	}
	.is-portal .loja-linha-vazio {
		height: auto;
		border: 0;
		background: rgba(255, 255, 255, .6);
	}
}
@media (max-width: 400px) {
	.layout-novo a.item-botao-site {
		font-size: 15px;
	}
}

/* Rodapé do site institucional (index.php): o das revendas com uma coluna a
 * mais ("Sobre") e o quadro "Conheça também" embaixo do produto. */
.is-portal .portal-rodape .revenda-rodape-loja p {
	display: block;
	max-width: 380px;
}
.is-portal .portal-rodape a.rodape-outro-site {
	max-width: 380px;
	margin: 22px 0 0;
	padding: 16px 18px;
}
.is-portal .portal-rodape .rodape-outro-site strong {
	font-size: 18px;
}
.is-portal .portal-rodape .rodape-outro-site span {
	font-size: 13.5px;
}
@media (min-width: 768px) {
	.is-portal .portal-rodape .revenda-rodape-grade {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
	}
	.is-portal .portal-rodape .revenda-rodape-loja {
		grid-column: 1 / -1;
	}
}
@media (min-width: 992px) {
	.is-portal .portal-rodape .revenda-rodape-grade {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.3fr);
	}
	.is-portal .portal-rodape .revenda-rodape-loja {
		grid-column: auto;
	}
}
/* Celular: o atendimento (com o e-mail) na largura toda. */
@media (max-width: 767px) {
	.is-portal .portal-rodape .revenda-rodape-coluna:last-child {
		grid-column: 1 / -1;
	}
}

/* ---------------------------------------------------------------------------
 * Termos de uso e Política de privacidade (termos.php, politica.php): sumário
 * preso à esquerda no computador e o texto num cartão de leitura confortável.
 * ------------------------------------------------------------------------- */
.is-portal .documento-legal {
	padding: 28px 0 72px;
	background: linear-gradient(180deg, var(--fundo-secao) 0, #fff 520px);
}
.is-portal .documento-legal-grade {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.is-portal .documento-legal-sumario {
	padding: 18px 20px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
}
.is-portal .documento-legal-sumario p {
	margin: 0 0 10px;
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--texto-medio);
}
.is-portal .documento-legal-sumario ol {
	margin: 0;
	padding-left: 20px;
}
.is-portal .documento-legal-sumario li {
	margin: 0 0 6px;
	font-size: 14px;
	line-height: 1.4;
	color: var(--texto-medio);
}
.is-portal .documento-legal-sumario a {
	color: var(--texto-forte);
}
.is-portal .documento-legal-sumario a:hover {
	color: var(--marca);
}
.is-portal .documento-legal-texto {
	min-width: 0;
	padding: 24px 22px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
	font-size: 15.5px;
	line-height: 1.7;
	color: var(--texto-medio);
}
.is-portal .documento-legal-data {
	margin: 0 0 8px;
	font-size: 13.5px;
	color: var(--texto-medio);
}
.is-portal .documento-legal-texto h2 {
	margin: 32px 0 10px;
	font-size: 19px;
	font-weight: 800;
	line-height: 1.3;
	text-transform: none;
	color: var(--texto-forte);
	scroll-margin-top: 100px;
}
.is-portal .documento-legal-texto h2:first-of-type {
	margin-top: 16px;
}
.is-portal .documento-legal-texto p {
	margin: 0 0 12px;
}
.is-portal .documento-legal-texto ul {
	margin: 0 0 14px;
	padding-left: 20px;
}
.is-portal .documento-legal-texto li {
	margin: 0 0 6px;
}
.is-portal .documento-legal-texto strong {
	color: var(--texto-forte);
}
.is-portal .documento-legal-texto a {
	color: var(--marca);
	text-decoration: underline;
	text-underline-offset: 2px;
	word-break: break-word;
}
@media (min-width: 992px) {
	.is-portal .documento-legal {
		padding: 40px 0 96px;
	}
	.is-portal .documento-legal-grade {
		display: grid;
		grid-template-columns: 260px minmax(0, 1fr);
		gap: 32px;
		align-items: start;
	}
	.is-portal .documento-legal-sumario {
		position: sticky;
		top: 100px;
	}
	.is-portal .documento-legal-texto {
		max-width: 820px;
		padding: 36px 44px;
	}
}

/* Aviso de cookies: cartão pequeno no canto de baixo à direita, que sobe
 * devagar e fica até a pessoa fechar. Na home fica acima do WhatsApp (e, no
 * celular, também acima da barra do teste grátis). */
.aviso-cookies {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 1001;
	display: flex;
	align-items: center;
	gap: 14px;
	max-width: 380px;
	padding: 14px 16px;
	border: 1px solid var(--borda-suave);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 10px 30px rgba(16, 24, 40, .14);
	opacity: 0;
	transform: translateY(16px);
	transition: opacity .3s, transform .3s;
}
.aviso-cookies.visivel {
	opacity: 1;
	transform: none;
}
.aviso-cookies p {
	margin: 0;
	font-size: 13px;
	line-height: 1.5;
	color: var(--texto-medio);
}
.aviso-cookies a {
	color: var(--texto-forte);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.aviso-cookies button {
	flex: 0 0 auto;
	height: 36px;
	padding: 0 14px;
	border: 0;
	border-radius: 9px;
	background: var(--marca);
	font-size: 13.5px;
	font-weight: 700;
	color: #fff;
}
.aviso-cookies button:hover,
.aviso-cookies button:focus {
	background: var(--marca-escura);
}
.pg_plataforma .aviso-cookies {
	bottom: 92px;
}
@media (max-width: 767px) {
	.aviso-cookies {
		right: 12px;
		bottom: 12px;
		left: 12px;
		max-width: none;
	}
	.aviso-cookies {
		gap: 10px;
		padding: 10px 12px;
	}
	.aviso-cookies p {
		font-size: 12px;
	}
	/* Home: na mesma altura do WhatsApp, ao lado dele, acima da barra. */
	.pg_plataforma .aviso-cookies {
		right: 88px;
		bottom: 84px;
	}
}
@media (prefers-reduced-motion: reduce) {
	.aviso-cookies {
		transition: none;
	}
}
/* Cadastro: aceite dos termos embaixo do botão, discreto. */
.layout-novo .acao-cadastro .aceite-termos {
	margin-top: 6px;
	font-size: 12.5px;
}
.layout-novo .aceite-termos a {
	color: inherit;
	text-decoration: underline;
}