/* =========================================================
   IMPAR BRASIL - design tokens
   ========================================================= */
:root {
	--azul-900: #042C53;
	--azul-700: #0C447C;
	--azul-500: #185FA5;
	--azul-100: #E6F1FB;
	--ambar-700: #854F0B;
	--ambar-500: #FED353;
	--ambar-500-hover: #F0C230;
	--ambar-100: #FAEEDA;
	--branco: #FFFFFF;
	--cinza-900: #22292F;
	--cinza-600: #5B6570;
	--cinza-100: #F4F6F8;
	--borda: #E1E6EA;

	--fonte-titulo: 'Poppins', sans-serif;
	--fonte-texto: 'Inter', sans-serif;
	--raio: 10px;
}

/* =========================================================
   RESET
   ========================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	font-family: var(--fonte-texto);
	color: var(--cinza-900);
	line-height: 1.6;
	background: var(--branco);
}
img { max-width: 100%; display: block; }
.sr-only {
	position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 { font-family: var(--fonte-titulo); font-weight: 600; line-height: 1.25; margin: 0 0 .6em; }
p { margin: 0 0 1em; }
ul { padding: 0; margin: 0; list-style: none; }
.container { max-width: 1160px; margin: 0 auto; padding: 0 24px; }

.pular-conteudo {
	position: absolute; left: -999px; top: 0; background: var(--azul-900); color: #fff; padding: 12px 20px; z-index: 999;
}
.pular-conteudo:focus { left: 0; }

/* =========================================================
   BOTOES
   ========================================================= */
.btn {
	display: inline-block;
	padding: 14px 28px;
	border-radius: var(--raio);
	font-weight: 600;
	font-size: 15px;
	transition: transform .15s ease, opacity .15s ease;
	border: 2px solid transparent;
}
.btn:hover { transform: translateY(-2px); }
.btn-destaque { background: var(--ambar-500); color: #3B2504; }
.btn-destaque:hover { background: var(--ambar-500-hover); color: #3B2504; }

/* Botoes de WhatsApp - qualquer link que aponte para wa.me ganha esse visual automaticamente,
   em qualquer pagina do site, sem precisar marcar cada botao individualmente. */
a.btn[href*="wa.me"] {
	background: #25D366;
	color: #fff;
	border-radius: 100px;
	padding-left: 20px;
	box-shadow: 0 8px 16px rgba(0,0,0,.25);
	display: inline-flex;
	align-items: center;
	gap: 8px;
}
a.btn[href*="wa.me"]::before {
	content: '';
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	background-color: currentColor;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C9 3 3.3 8.6 3.3 15.5c0 2.4.7 4.7 1.9 6.7L3 29l7-2.1c1.9 1.1 4 1.6 6 1.6 7 0 12.7-5.6 12.7-12.5C28.7 8.6 23 3 16 3zm0 22.8c-1.9 0-3.7-.5-5.3-1.5l-.4-.2-4.2 1.3 1.3-4.1-.2-.4c-1.1-1.7-1.7-3.7-1.7-5.8C5.5 9.8 10.2 5.2 16 5.2S26.5 9.8 26.5 15.5 21.8 25.8 16 25.8z'/%3E%3Cpath d='M21.6 18.3c-.3-.2-1.8-.9-2.1-1-.3-.1-.5-.2-.7.2s-.8 1-.9 1.1c-.2.2-.3.2-.6.1-.3-.2-1.3-.5-2.5-1.5-.9-.8-1.5-1.8-1.7-2.1-.2-.3 0-.5.1-.6.1-.1.3-.3.4-.5.1-.2.2-.3.3-.5.1-.2 0-.4 0-.5s-.7-1.6-.9-2.2c-.2-.5-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.4s1 2.8 1.2 3c.1.2 2 3.1 4.9 4.3.7.3 1.2.5 1.6.6.7.2 1.3.2 1.8.1.5-.1 1.8-.7 2-1.4.2-.7.2-1.3.2-1.4-.1-.1-.3-.2-.5-.3z'/%3E%3C/svg%3E");
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C9 3 3.3 8.6 3.3 15.5c0 2.4.7 4.7 1.9 6.7L3 29l7-2.1c1.9 1.1 4 1.6 6 1.6 7 0 12.7-5.6 12.7-12.5C28.7 8.6 23 3 16 3zm0 22.8c-1.9 0-3.7-.5-5.3-1.5l-.4-.2-4.2 1.3 1.3-4.1-.2-.4c-1.1-1.7-1.7-3.7-1.7-5.8C5.5 9.8 10.2 5.2 16 5.2S26.5 9.8 26.5 15.5 21.8 25.8 16 25.8z'/%3E%3Cpath d='M21.6 18.3c-.3-.2-1.8-.9-2.1-1-.3-.1-.5-.2-.7.2s-.8 1-.9 1.1c-.2.2-.3.2-.6.1-.3-.2-1.3-.5-2.5-1.5-.9-.8-1.5-1.8-1.7-2.1-.2-.3 0-.5.1-.6.1-.1.3-.3.4-.5.1-.2.2-.3.3-.5.1-.2 0-.4 0-.5s-.7-1.6-.9-2.2c-.2-.5-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.4s1 2.8 1.2 3c.1.2 2 3.1 4.9 4.3.7.3 1.2.5 1.6.6.7.2 1.3.2 1.8.1.5-.1 1.8-.7 2-1.4.2-.7.2-1.3.2-1.4-.1-.1-.3-.2-.5-.3z'/%3E%3C/svg%3E");
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
}
a.btn[href*="wa.me"]:hover {
	background: #1EBE5A;
	color: #fff;
	box-shadow: 0 10px 20px rgba(0,0,0,.3);
}
.btn-contorno { border-color: var(--branco); color: var(--branco); }
.btn-contorno:hover { background: var(--branco); color: var(--azul-900); }
.btn-secundario { border-color: var(--azul-700); color: var(--azul-700); }
.btn-secundario:hover { background: var(--azul-700); color: #fff; }

/* =========================================================
   HEADER
   ========================================================= */
.site-header {
	background: var(--branco);
	border-bottom: 1px solid var(--borda);
	position: sticky;
	top: 0;
	z-index: 500;
}
.header-inner {
	display: flex;
	align-items: center;
	gap: 32px;
	height: 100px;
}
.logo-texto { font-family: var(--fonte-titulo); font-weight: 700; font-size: 22px; color: var(--azul-900); }
.logo-imagem { height: 76px; width: auto; display: block; }
.menu-principal { flex: 1; }
#menu-principal-lista { display: flex; gap: 28px; }
#menu-principal-lista a { font-weight: 500; color: var(--cinza-900); padding: 8px 0; border-bottom: 2px solid transparent; text-decoration: none; }
#menu-principal-lista a:hover, #menu-principal-lista li.current-menu-item a, #menu-principal-lista li.current_page_item a {
	border-color: var(--ambar-500); color: var(--azul-900); text-decoration: underline; text-underline-offset: 6px; text-decoration-color: var(--ambar-500); text-decoration-thickness: 2px;
}
.header-cta { white-space: nowrap; padding: 10px 20px; font-size: 14px; }
.menu-toggle { display: none; background: none; border: none; cursor: pointer; padding: 8px; }
.menu-toggle span { display: block; width: 24px; height: 2px; background: var(--azul-900); margin: 5px 0; }

/* =========================================================
   CAMADAS - divisor assinatura (referencia as camadas de protecao/manta)
   ========================================================= */
.divisor-camadas { height: 10px; display: flex; }
.divisor-camadas span { flex: 1; }
.divisor-camadas span:nth-child(1) { background: var(--azul-900); }
.divisor-camadas span:nth-child(2) { background: var(--azul-700); }
.divisor-camadas span:nth-child(3) { background: var(--azul-500); }
.divisor-camadas span:nth-child(4) { background: var(--ambar-500); }

/* =========================================================
   HERO
   ========================================================= */
.hero {
	background: linear-gradient(180deg, var(--azul-900), var(--azul-700));
	color: #fff;
	padding: 90px 0;
}
.hero .container { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; }
.hero-eyebrow { text-transform: uppercase; letter-spacing: .08em; font-size: 13px; color: var(--ambar-100); font-weight: 600; margin-bottom: 14px; }
.hero h1 { font-size: 42px; color: #fff; }
.hero p.lead { font-size: 18px; color: var(--azul-100); max-width: 62ch; }
.hero-acoes { display: flex; gap: 16px; margin-top: 28px; flex-wrap: wrap; }
.hero-figura { background: var(--branco); border-radius: 16px; overflow: hidden; }
.hero-figura img { width: 100%; height: 100%; object-fit: cover; }

/* Carrossel da Home - faixa cheia, largura total da pagina */
.carrossel-secao { width: 100%; overflow: hidden; }
.carrossel-home { position: relative; width: 100%; height: 460px; overflow: hidden; }
.carrossel-trilho { display: flex; width: 300%; height: 100%; transition: transform .5s ease; }
.carrossel-slide { position: relative; width: calc(100% / 3); flex-shrink: 0; display: block; }
.carrossel-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.carrossel-slide img.carrossel-zoom-75 {
	object-position: 45% 58%;
}
.carrossel-legenda {
	position: absolute; left: 0; right: 0; bottom: 0;
	background: linear-gradient(0deg, rgba(4,44,83,.88), rgba(4,44,83,0));
	color: #fff; font-family: var(--fonte-titulo); font-weight: 600; font-size: 20px;
	padding: 64px 32px 24px;
}
.carrossel-pontos { position: absolute; bottom: 18px; right: 28px; display: flex; gap: 8px; z-index: 2; }
.carrossel-ponto { width: 10px; height: 10px; border-radius: 50%; border: 2px solid #fff; background: transparent; padding: 0; cursor: pointer; opacity: .7; }
.carrossel-ponto.is-ativo { background: var(--ambar-500); border-color: var(--ambar-500); opacity: 1; }

.carrossel-texto-esquerda {
	position: absolute; left: 0; top: 0; height: 100%; width: 100%;
	display: flex; flex-direction: column; justify-content: center;
	padding: 0 20px 0 48px;
	background: linear-gradient(90deg, rgba(4,44,83,.88) 0%, rgba(4,44,83,.55) 35%, rgba(4,44,83,0) 50%);
}
.carrossel-texto-esquerda h3, .carrossel-texto-esquerda p { max-width: 46%; }
.carrossel-texto-esquerda h3 {
	color: #fff; font-size: 34px; margin: 0 0 14px; text-shadow: 0 2px 10px rgba(0,0,0,.45);
}
.carrossel-texto-esquerda p {
	color: #fff; font-size: 17px; line-height: 1.55; margin: 0; max-width: 34ch;
	text-shadow: 0 2px 8px rgba(0,0,0,.5);
}
.carrossel-destaque { color: var(--ambar-500); font-weight: 700; }

.hero-compacto { padding: 56px 0; }
.hero-compacto .container { grid-template-columns: 1fr; }

/* =========================================================
   SECOES GERAIS
   ========================================================= */
.secao { padding: 88px 0; }
.secao-clara { background: var(--cinza-100); }
.secao-azul { background: var(--azul-100); }
.secao-cabecalho { max-width: 640px; margin: 0 auto 48px; text-align: center; }
.secao-cabecalho .eyebrow { text-transform: uppercase; letter-spacing: .08em; font-size: 13px; color: var(--ambar-700); font-weight: 700; }
.secao-cabecalho h2 { font-size: 32px; color: var(--azul-900); }
.secao-cabecalho p { color: var(--cinza-600); }

/* =========================================================
   GRID DE CARDS (servicos / produtos)
   ========================================================= */
.grid-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 28px; }
.card {
	background: var(--branco);
	border: 1px solid var(--borda);
	border-radius: 14px;
	overflow: hidden;
	transition: box-shadow .2s ease, transform .2s ease;
	display: flex;
	flex-direction: column;
}
.card:hover { box-shadow: 0 12px 28px rgba(4,44,83,.12); transform: translateY(-4px); }
.card-imagem { aspect-ratio: 4/3; overflow: hidden; background: var(--azul-100); }
.card-imagem img { width: 100%; height: 100%; object-fit: cover; }
.card-corpo { padding: 22px 24px 26px; flex: 1; display: flex; flex-direction: column; }
.card-corpo h3 { font-size: 19px; color: var(--azul-900); }
.card-corpo p {
	color: var(--cinza-600); font-size: 15px; flex: 1;
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
	overflow: hidden;
}
.card:hover .card-corpo p { -webkit-line-clamp: unset; overflow: visible; }
.card:hover { z-index: 5; overflow: visible; }
.card:hover .card-corpo { position: relative; background: var(--branco); box-shadow: 0 16px 32px rgba(4,44,83,.18); border-radius: 0 0 14px 14px; }
.card-tag { display: inline-block; background: var(--ambar-100); color: var(--ambar-700); font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 100px; margin-bottom: 12px; width: fit-content; }
.card-corpo .btn { margin-top: 14px; text-align: center; }
.card-acoes { display: flex; gap: 10px; margin-top: 14px; }
.card-acoes .btn { margin-top: 0; flex: 1; padding: 10px 14px; font-size: 13px; }

/* Card inteiro clicavel (menos o botao de WhatsApp) */
.card-clicavel { cursor: pointer; position: relative; }
.card-link-esticado::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.card-corpo .btn { position: relative; z-index: 2; }

/* Filtro de categorias (pagina de Produtos) */
.produtos-layout { display: grid; grid-template-columns: 220px 1fr; gap: 40px; align-items: start; }
.filtro-lateral {
	display: flex; flex-direction: column; gap: 8px;
	position: sticky; top: 100px;
}
.filtro-titulo { font-size: 15px; color: var(--azul-900); margin: 0 0 6px; }
.filtro-categorias { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 36px; }
.filtro-lateral.filtro-categorias { flex-wrap: nowrap; justify-content: flex-start; margin-bottom: 0; }
.filtro-btn {
	background: var(--branco); border: 1px solid var(--borda); color: var(--cinza-900);
	padding: 9px 18px; border-radius: 100px; font-size: 14px; font-weight: 600; cursor: pointer;
	transition: all .15s ease;
}
.filtro-lateral .filtro-btn { border-radius: 8px; text-align: left; padding: 10px 14px; }
.filtro-btn:hover { border-color: var(--azul-500); color: var(--azul-700); }
.filtro-btn.is-ativo { background: var(--azul-700); border-color: var(--azul-700); color: #fff; }
.card.is-oculto { display: none; }

/* =========================================================
   DIFERENCIAIS (icones)
   ========================================================= */
.grid-diferenciais { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; }
.diferencial { text-align: center; padding: 28px 20px; }
.diferencial .icone {
	width: 56px; height: 56px; margin: 0 auto 16px; border-radius: 50%;
	background: var(--azul-700); color: #fff; display: flex; align-items: center; justify-content: center;
}
.diferencial h3 { font-size: 16px; color: var(--azul-900); }
.diferencial p { font-size: 14px; color: var(--cinza-600); margin: 0; }

/* =========================================================
   CTA FAIXA
   ========================================================= */
.faixa-cta {
	background: var(--azul-900);
	color: #fff;
	padding: 56px 0;
	text-align: center;
}
.faixa-cta h2 { color: #fff; font-size: 28px; }
.faixa-cta p { color: var(--azul-100); }

/* Secao "Venha aprender de forma Impar" */
.secao-blog-home { width: 100%; }
.blog-home-link { position: relative; display: block; width: 100%; height: 380px; overflow: hidden; }
.blog-home-link img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.blog-home-link:hover img { transform: scale(1.04); }
.blog-home-overlay {
	position: absolute; inset: 0;
	background: linear-gradient(90deg, rgba(4,44,83,.92) 0%, rgba(4,44,83,.55) 55%, rgba(4,44,83,.25) 100%);
	display: flex; flex-direction: column; justify-content: center;
	padding: 0 8% ;
	max-width: 640px;
}
.blog-home-overlay .hero-eyebrow { color: var(--ambar-100); }
.blog-home-overlay h2 { color: #fff; font-size: 34px; margin-bottom: 14px; }
.blog-home-overlay p { color: var(--azul-100); font-size: 16px; max-width: 44ch; margin-bottom: 20px; }
.blog-home-overlay .btn { width: fit-content; }

/* =========================================================
   PRODUTO (single)
   ========================================================= */
.produto-single { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; padding: 60px 0; }

/* Pagina de servico em formato artigo (texto corrido, largura total) */
.servico-artigo { padding: 20px 0 80px; }
.servico-artigo-container { max-width: 760px; }
.servico-artigo .categoria { color: var(--ambar-700); font-weight: 700; font-size: 13px; text-transform: uppercase; margin-bottom: 16px; }
.servico-artigo-imagem { aspect-ratio: 16/9; overflow: hidden; border-radius: 14px; margin-bottom: 32px; background: var(--azul-100); }
.servico-artigo-imagem img { width: 100%; height: 100%; object-fit: cover; display: block; }
.conteudo-artigo { font-size: 16px; line-height: 1.75; color: var(--cinza-900); }
.conteudo-artigo h2, .conteudo-artigo h3 { color: var(--azul-900); margin: 40px 0 16px; }
.conteudo-artigo h2 { font-size: 24px; }
.conteudo-artigo h3 { font-size: 20px; }
.conteudo-artigo p { margin: 0 0 20px; }
.conteudo-artigo ul, .conteudo-artigo ol { margin: 0 0 20px; padding-left: 22px; }
.conteudo-artigo ul { list-style: disc; }
.conteudo-artigo ol { list-style: decimal; }

/* Restaura marcadores de lista dentro de qualquer area de conteudo (o reset global de ul tira bolinha dos menus, mas nao deve afetar texto) */
.conteudo-produto ul, .conteudo-pagina ul { list-style: disc; padding-left: 22px; margin: 0 0 20px; }
.conteudo-produto ol, .conteudo-pagina ol { list-style: decimal; padding-left: 22px; margin: 0 0 20px; }
.conteudo-produto li, .conteudo-pagina li { margin-bottom: 8px; }
.conteudo-artigo li { margin-bottom: 8px; }
.servico-artigo-cta { margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--borda); text-align: center; }

/* FAQ - acordeao */
.servico-faq { background: var(--cinza-100); padding: 56px 0; }
.servico-faq h2 { color: var(--azul-900); font-size: 26px; margin-bottom: 24px; }
.faq-item { border-bottom: 1px solid var(--borda); }
.faq-pergunta {
	width: 100%; text-align: left; background: none; border: none; cursor: pointer;
	padding: 18px 4px; font-size: 16px; font-weight: 600; color: var(--azul-900);
	display: flex; justify-content: space-between; align-items: center; gap: 16px;
}
.faq-icone { flex-shrink: 0; font-size: 20px; color: var(--ambar-700); transition: transform .2s ease; }
.faq-pergunta[aria-expanded="true"] .faq-icone { transform: rotate(45deg); }
.faq-resposta { max-height: 0; overflow: hidden; transition: max-height .25s ease; }
.faq-resposta p { padding: 0 4px 18px; margin: 0; color: var(--cinza-600); line-height: 1.6; }

/* Layout com galeria lateral de fotos da obra */
.servico-artigo-com-galeria { max-width: 1100px; display: grid; grid-template-columns: 340px 1fr; gap: 48px; align-items: start; }
.servico-galeria-lateral { position: sticky; top: 100px; }
.servico-galeria-carrossel { position: relative; aspect-ratio: 4/3; border-radius: 14px; overflow: hidden; background: var(--azul-100); }
.servico-galeria-trilho { display: flex; height: 100%; transition: transform .4s ease; }
.servico-galeria-slide { min-width: 100%; height: 100%; }
.servico-galeria-slide img { width: 100%; height: 100%; object-fit: contain; display: block; }
.servico-galeria-pontos { position: absolute; bottom: 12px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; }
.servico-galeria-ponto { width: 9px; height: 9px; border-radius: 50%; border: 2px solid #fff; background: transparent; padding: 0; cursor: pointer; opacity: .8; }
.servico-galeria-ponto.is-ativo { background: var(--ambar-500); border-color: var(--ambar-500); }
.servico-galeria-legenda { font-size: 13px; color: var(--cinza-600); text-align: center; margin: 12px 0 0; }
.servico-video { margin-top: 24px; }
.servico-video-embed { position: relative; width: 100%; aspect-ratio: 16/9; border-radius: 14px; overflow: hidden; background: #000; }
.servico-video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.servico-artigo-texto .categoria { color: var(--ambar-700); font-weight: 700; font-size: 13px; text-transform: uppercase; margin-bottom: 16px; }
.produto-imagem { aspect-ratio: 4/3; overflow: hidden; border-radius: 14px; background: var(--azul-100); }
.produto-imagem img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 14px; }
.blog-post-imagem { aspect-ratio: 16/9; overflow: hidden; border-radius: 14px; background: var(--azul-100); margin-bottom: 32px; }
.blog-post-imagem img { width: 100%; height: 100%; object-fit: cover; display: block; }
.produto-info .categoria { color: var(--ambar-700); font-weight: 700; font-size: 13px; text-transform: uppercase; }
.produto-info h1 { color: var(--azul-900); font-size: 32px; }
.especificacoes { list-style: none; padding: 0; margin: 24px 0; }
.especificacoes li { padding: 10px 0; border-bottom: 1px solid var(--borda); display: flex; justify-content: space-between; font-size: 15px; }
.especificacoes li strong { color: var(--azul-900); }

/* =========================================================
   BREADCRUMB / PAGINA INTERNA
   ========================================================= */
.pagina-topo { background: var(--azul-100); padding: 24px 0; }
.pagina-topo h1 { color: var(--azul-900); font-size: 34px; margin: 0; }
.titulo-post-sub { font-size: 22px; font-weight: 500; color: var(--azul-700); }
.pagina-topo .trilha { font-size: 14px; color: var(--cinza-600); margin-bottom: 8px; }
.pagina-topo .trilha a { color: var(--azul-700); }

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer { background: var(--azul-900); color: var(--azul-100); padding-top: 60px; }
.footer-inner { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; padding-bottom: 40px; }
.footer-logo { height: 48px; width: auto; display: block; margin-bottom: 12px; }
.footer-col h3 { color: #fff; font-size: 16px; }
.footer-col a { display: block; padding: 4px 0; color: var(--azul-100); }
.footer-col a:hover { color: var(--ambar-500); }
/* Garantia extra: qualquer link dentro do rodape fica claro, nao importa qual
   id o WordPress atribuir ao menu (evita depender de adivinhar o id certo). */
.site-footer ul a, .site-footer nav a {
	color: var(--azul-100) !important;
	border-bottom-color: transparent !important;
	text-decoration: none !important;
}
.site-footer ul a:hover, .site-footer nav a:hover { color: var(--ambar-500) !important; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.12); padding: 20px 24px; font-size: 13px; text-align: center; color: var(--azul-100); }

/* =========================================================
   WHATSAPP FLUTUANTE
   ========================================================= */
.whatsapp-flutuante {
	position: fixed; right: 24px; bottom: 24px; z-index: 400;
	width: 58px; height: 58px; border-radius: 50%;
	background: #25D366; color: #fff;
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 8px 20px rgba(0,0,0,.2);
}

/* =========================================================
   BLOG / LISTAGENS
   ========================================================= */
.lista-blog { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 28px; }
.paginacao { display: flex; gap: 8px; justify-content: center; margin-top: 40px; }
.paginacao a, .paginacao span { padding: 8px 14px; border: 1px solid var(--borda); border-radius: 6px; }

/* =========================================================
   RESPONSIVO
   ========================================================= */
@media (max-width: 880px) {
	.servico-artigo-com-galeria { grid-template-columns: 1fr; }
	.servico-galeria-lateral { position: static; }
	.produtos-layout { grid-template-columns: 1fr; }
	.filtro-lateral { position: static; flex-direction: row; flex-wrap: wrap; margin-bottom: 32px; }
	/* Na pagina de Produtos o aside acumula as duas classes (filtro-categorias + filtro-lateral);
	 * a regra .filtro-lateral.filtro-categorias mais abaixo no arquivo tem "flex-wrap: nowrap" fixo
	 * e, por ter mais especificidade, vencia essa regra responsiva - fazia os botoes de filtro
	 * ficarem numa linha so, estourando a largura da tela e arrastando a grade de produtos junto
	 * (por isso os produtos apareciam desalinhados/fora de lista no celular). */
	.filtro-lateral.filtro-categorias { flex-wrap: wrap; }
	.filtro-titulo { width: 100%; }
	.filtro-lateral .filtro-btn { border-radius: 100px; text-align: center; }
	.hero .container { grid-template-columns: 1fr; }
	.produto-single { grid-template-columns: 1fr; }
	.footer-inner { grid-template-columns: 1fr; }
	.carrossel-home { height: 320px; }
}
@media (max-width: 720px) {
	.card-acoes { flex-direction: column; }
	.menu-principal, .header-cta { display: none !important; }
	.menu-toggle { display: block; margin-left: auto; }
	.header-inner { height: 68px; }
	.logo-imagem { height: 52px; }
	.hero { padding: 56px 0; }
	.hero h1 { font-size: 30px; }
	.secao { padding: 56px 0; }
	.carrossel-home { height: 220px; }
	.carrossel-legenda { font-size: 15px; padding: 36px 16px 14px; }
	.blog-home-link { height: 300px; }
	.blog-home-overlay { padding: 0 24px; max-width: 100%; }
	.blog-home-overlay h2 { font-size: 24px; }
	.blog-home-overlay p { font-size: 14px; }
	.carrossel-texto-esquerda { width: 68%; padding: 0 12px 0 20px; }
	.carrossel-texto-esquerda h3 { font-size: 20px; margin-bottom: 8px; }
	.carrossel-texto-esquerda p { font-size: 13px; }

	body.menu-aberto .menu-principal {
		display: block; position: absolute; top: 68px; left: 0; right: 0; background: #fff;
		border-bottom: 1px solid var(--borda); padding: 16px 24px;
	}
	body.menu-aberto #menu-principal-lista { flex-direction: column; gap: 4px; }
	/* Botao "Fale no WhatsApp" do cabecalho removido no mobile (ja existe o botao flutuante) */
}