/* elevatoria: componentes do sistema D (topo com foto da versão C + estrutura da versão A).
   Ver DESIGN.md. Regras: uma fonte (Satoshi), um acento (menta, só preenchimento em fundo escuro),
   botões em pílula, cartões 14px, campos 10px. Prefixo el- em tudo que é do tema. */

:root {
	--el-r-card: 14px;
	--el-r-campo: 10px;
	--el-largura: 1200px;
	--el-gutter: max(16px, calc((100vw - var(--el-largura)) / 2));
}

body { -webkit-font-smoothing: antialiased; }
img { height: auto; }
:focus-visible { outline: 2px solid var(--wp--preset--color--verde); outline-offset: 3px; }

/* ---------- Botões ---------- */
.wp-block-button__link { white-space: nowrap; transition: background-color .2s, transform .1s; }
.wp-block-button__link:active { transform: translateY(1px); }
.wp-block-button.is-style-menta .wp-block-button__link { background: var(--wp--preset--color--menta); color: var(--wp--preset--color--verde-fundo); }
.wp-block-button.is-style-menta .wp-block-button__link:hover { background: var(--wp--preset--color--menta-escura); }
.wp-block-button.is-style-contorno .wp-block-button__link { background: transparent; color: #fff; border: 1.5px solid rgba(255, 255, 255, .7); }
.wp-block-button.is-style-contorno .wp-block-button__link:hover { background: rgba(255, 255, 255, .1); }

/* ---------- Cabeçalho ---------- */
.el-header { background: var(--wp--preset--color--verde-fundo); color: #fff; position: relative; z-index: 10; }
.el-header .el-header-linha { min-height: 76px; }
.el-header .wp-block-site-title a,
.el-logo a, .el-logo { font-weight: 900; font-size: 1.625rem; letter-spacing: -0.04em; color: #fff; text-decoration: none; }
/* logo com o "v" de plataforma (SVG gerado em functions.php) */
.el-logo a { white-space: nowrap; line-height: 1; }
.el-logo .el-logo-v { height: 1.12em; width: auto; vertical-align: baseline; margin: 0 -0.17em 0 0.015em; overflow: visible; }
.el-logo .el-logo-cesto { fill: var(--wp--preset--color--menta); }
.el-header .wp-block-navigation a { color: rgba(255, 255, 255, .88); font-weight: 500; text-decoration: none; }
.el-header .wp-block-navigation a:hover { color: #fff; }
.el-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--verde-fundo); color: #fff; }
.el-header .wp-block-button__link { padding: .7rem 1.25rem; font-size: .9375rem; }
/* em página com topo de foto, o cabeçalho flutua transparente sobre a foto */
body:has(.el-hero) .el-header { position: absolute; top: var(--wp-admin--admin-bar--height, 0px); left: 0; right: 0; background: transparent; }

/* ---------- Topo com foto (home e cidade) ---------- */
.el-hero { position: relative; isolation: isolate; overflow: hidden; color: #fff; background: var(--wp--preset--color--verde-fundo);
	min-height: min(88dvh, 820px); display: flex; flex-direction: column; justify-content: flex-end;
	padding: 120px var(--el-gutter) 72px !important; margin-top: 0 !important; }
.el-hero.el-hero-cidade { min-height: min(70dvh, 660px); padding-bottom: 60px !important; }
.el-hero > .el-hero-foto { position: absolute; inset: 0; z-index: -2; margin: 0; }
.el-hero > .el-hero-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; }
.el-hero::after { content: ""; position: absolute; inset: 0; z-index: -1;
	background: linear-gradient(90deg, rgba(8, 26, 20, .9) 0%, rgba(8, 26, 20, .64) 44%, rgba(8, 26, 20, .06) 80%),
	            linear-gradient(0deg, rgba(8, 26, 20, .55), transparent 42%); }
.el-hero h1 { color: #fff; max-width: 17ch; margin: 0; }
.el-hero .el-sub { font-size: var(--wp--preset--font-size--g); color: rgba(255, 255, 255, .88); max-width: 42ch; margin-top: 1.1rem; }
.el-hero .wp-block-buttons { margin-top: 1.9rem; }
.el-hero :focus-visible { outline-color: var(--wp--preset--color--menta); }
.el-trilha { font-size: .875rem; color: rgba(255, 255, 255, .78); margin-bottom: .9rem; }
.el-trilha a { color: rgba(255, 255, 255, .92); }

/* ---------- Seções ---------- */
.el-secao { padding-top: 88px; padding-bottom: 88px; }
.el-secao.el-colada { padding-top: 16px; }
.el-lead { color: var(--wp--preset--color--ardosia); max-width: 62ch; }

/* tipos: grade com articulada grande à esquerda */
.el-tipos { display: grid !important; grid-template-columns: 1.2fr 1fr; grid-template-areas: "a b" "a c" "d d"; gap: 18px; margin-top: 44px !important; }
.el-tipo { background: var(--wp--preset--color--branco); border-radius: var(--el-r-card); overflow: hidden; display: flex; flex-direction: column; margin: 0 !important; }
.el-tipo .wp-block-image { margin: 0; }
.el-tipo .wp-block-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.el-tipo .el-tipo-texto { padding: 22px 24px 26px; }
.el-tipo h3 { margin: 0; font-size: 1.625rem; }
.el-tipo p { color: var(--wp--preset--color--ardosia); margin: .5rem 0 0; }
.el-tipo:nth-child(1) { grid-area: a; }
.el-tipo:nth-child(1) .wp-block-image { flex: 1; }
.el-tipo:nth-child(1) .wp-block-image img { aspect-ratio: 4 / 3.4; }
.el-tipo:nth-child(2) { grid-area: b; flex-direction: row; }
.el-tipo:nth-child(3) { grid-area: c; flex-direction: row; }
.el-tipo:nth-child(2) .wp-block-image, .el-tipo:nth-child(3) .wp-block-image { width: 42%; flex: none; }
.el-tipo:nth-child(4) { grid-area: d; background: var(--wp--preset--color--nevoa); }
.el-tipo:nth-child(4) .el-tipo-texto { display: grid; grid-template-columns: 1fr 2fr; gap: 24px; align-items: baseline; }

/* perguntas e planejamento: 2x2 com filete verde */
.el-grade2 { display: grid !important; grid-template-columns: 1fr 1fr; gap: 40px 56px; margin-top: 44px !important; }
.el-grade2 > * { border-top: 2px solid var(--wp--preset--color--verde); padding-top: 18px; margin: 0 !important; }
.el-grade2 h3 { margin: 0; }
.el-grade2 p { color: var(--wp--preset--color--ardosia); margin: .6rem 0 0; }

/* passo a passo ao lado de foto */
.el-processo { display: grid !important; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.el-passos { list-style: none; margin: 36px 0 0; padding: 0; }
.el-passos li { position: relative; padding: 0 0 30px 34px; border-left: 2px solid var(--wp--preset--color--linha); margin-left: 7px; }
.el-passos li:last-child { border-left-color: transparent; padding-bottom: 0; }
.el-passos li::before { content: ""; position: absolute; left: -9px; top: 4px; width: 16px; height: 16px; border-radius: 50%; background: var(--wp--preset--color--neve); border: 3px solid var(--wp--preset--color--verde); }
.el-passos strong { display: block; font-weight: 900; font-size: 1.3rem; letter-spacing: -0.02em; line-height: 1.2; }
.el-passos li span { color: var(--wp--preset--color--ardosia); }
.el-processo .wp-block-image img { border-radius: var(--el-r-card); aspect-ratio: 16 / 11; object-fit: cover; width: 100%; }

/* faixa escura com curvas de nível (marca) */
.el-faixa { background: var(--wp--preset--color--verde-fundo) url("../images/contour-rings.svg") no-repeat right top / 640px auto; color: #fff; }
.el-faixa h2 { color: #fff; }
.el-faixa p { color: #C6D6CE; font-size: var(--wp--preset--font-size--g); max-width: 62ch; }

/* cidades e vizinhas em pílulas */
.el-pilulas { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; padding: 0; margin: 32px 0 0; }
.el-pilulas a { display: inline-block; padding: 10px 18px; border: 1px solid var(--wp--preset--color--linha); border-radius: 999px; background: var(--wp--preset--color--branco); color: var(--wp--preset--color--tinta); text-decoration: none; font-size: .9375rem; }
.el-pilulas a:hover { border-color: var(--wp--preset--color--verde); color: var(--wp--preset--color--verde); }

/* dúvidas (bloco Detalhes) */
.el-faq { max-width: 780px; margin-top: 36px !important; }
.el-faq .wp-block-details, .el-faq details { border-bottom: 1px solid var(--wp--preset--color--linha); margin: 0 !important; }
.el-faq summary { cursor: pointer; list-style: none; padding: 20px 40px 20px 0; position: relative; font-weight: 700; font-size: 1.1875rem; line-height: 1.35; }
.el-faq summary::-webkit-details-marker { display: none; }
.el-faq summary::after { content: "+"; position: absolute; right: 4px; top: 15px; font-size: 1.625rem; color: var(--wp--preset--color--verde); }
.el-faq details[open] summary::after { content: "−"; }
.el-faq details p { color: var(--wp--preset--color--ardosia); padding-bottom: 22px; margin: 0; max-width: 62ch; }

/* faixa de dados da cidade */
.el-dados { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); background: var(--wp--preset--color--branco); border-radius: var(--el-r-card); padding: 32px 0; margin: 0 !important; }
.el-dados > * { padding: 0 32px; border-left: 1px solid var(--wp--preset--color--linha); margin: 0 !important; }
.el-dados > *:first-child { border-left: 0; }
.el-dados .el-rotulo { font-size: .875rem; color: var(--wp--preset--color--ardosia); margin: 0; }
.el-dados .el-valor { font-weight: 900; font-size: 1.375rem; letter-spacing: -0.02em; line-height: 1.2; margin: .3rem 0 0; }
.el-dados .el-fonte { font-size: .8125rem; color: var(--wp--preset--color--ardosia); margin: .25rem 0 0; }
.el-dados > .el-vazio { display: none; }

/* contato e formulário */
.el-contato { background: var(--wp--preset--color--nevoa); }
.el-contato-grade { display: grid !important; grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: start; }
.el-contato .el-notas { list-style: none; padding: 0; margin: 24px 0 0; }
.el-contato .el-notas li { padding: 12px 0; border-top: 1px solid #CBD3CF; color: var(--wp--preset--color--ardosia); }
.el-form-caixa { background: var(--wp--preset--color--branco); border-radius: var(--el-r-card); padding: 32px; min-width: 0; }
.el-form-caixa .wpforms-container { margin: 0 !important; }
.el-form-caixa .wpforms-field-label { font-weight: 700 !important; font-size: .9375rem !important; color: var(--wp--preset--color--tinta) !important; }
.el-form-caixa input[type="text"], .el-form-caixa input[type="email"], .el-form-caixa input[type="tel"], .el-form-caixa textarea, .el-form-caixa select {
	width: 100% !important; max-width: 100% !important; font: inherit !important; color: var(--wp--preset--color--tinta) !important;
	background: var(--wp--preset--color--neve) !important; border: 1px solid #A3AEA9 !important; border-radius: var(--el-r-campo) !important; padding: 12px 14px !important; }
.el-form-caixa select { appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 40px !important;
	height: auto !important; min-height: 0 !important; line-height: 1.4 !important; padding-top: 10px !important; padding-bottom: 10px !important;
	background: var(--wp--preset--color--neve) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%231E5C46' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 16px center !important; }
.el-form-caixa input::placeholder, .el-form-caixa textarea::placeholder { color: #7A8681; }
/* sem as setinhas de campo numérico */
.el-form-caixa input[type="number"] { -moz-appearance: textfield; }
.el-form-caixa input::-webkit-outer-spin-button, .el-form-caixa input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
/* campos curtos em pares: Empresa e E-mail, Telefone e Estado */
.el-form-caixa .wpforms-field-container { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
.el-form-caixa .wpforms-field-container > * { grid-column: 1 / -1; min-width: 0; }
.el-form-caixa .wpforms-field-container > #wpforms-11-field_1-container, .el-form-caixa .wpforms-field-container > #wpforms-11-field_2-container,
.el-form-caixa .wpforms-field-container > #wpforms-11-field_3-container, .el-form-caixa .wpforms-field-container > #wpforms-11-field_4-container { grid-column: auto; }
.el-form-caixa .wpforms-field-medium { max-width: 100% !important; }
/* coluna ao lado do formulário: o que contar no pedido ([el_pedido]) */
.el-pedido { margin-top: 28px; }
.el-pedido-titulo { font-weight: 700; color: var(--wp--preset--color--tinta); margin: 0 0 8px; }
.el-medidas { list-style: none; padding: 0; margin: 0; }
.el-medidas li { display: grid; grid-template-columns: 40px 1fr; gap: 18px; align-items: start; padding: 20px 0; border-top: 1px solid #CBD3CF; }
.el-medidas li:last-child { border-bottom: 1px solid #CBD3CF; }
.el-medidas svg { width: 40px; height: 40px; color: var(--wp--preset--color--verde); }
.el-medidas strong { display: block; font-size: 1.0625rem; color: var(--wp--preset--color--tinta); }
.el-medidas span { display: block; margin-top: 2px; color: var(--wp--preset--color--ardosia); }
.el-pedido-nota { margin: 20px 0 0; font-size: .9375rem; color: var(--wp--preset--color--ardosia); }
@media (max-width: 560px) {
	.el-form-caixa .wpforms-field-container { grid-template-columns: 1fr; }
	.el-form-caixa { padding: 24px 20px; }
}
.el-form-caixa input:focus, .el-form-caixa textarea:focus, .el-form-caixa select:focus { outline: 2px solid var(--wp--preset--color--verde) !important; border-color: var(--wp--preset--color--verde) !important; background: #fff !important; }
.el-form-caixa button[type="submit"] { background: var(--wp--preset--color--verde-fundo) !important; color: #fff !important; border: 0 !important; border-radius: 999px !important;
	padding: .95rem 1.6rem !important; font: 700 1rem/1 var(--wp--preset--font-family--satoshi) !important; cursor: pointer; }
.el-form-caixa button[type="submit"]:hover { background: var(--wp--preset--color--verde) !important; }
.el-form-caixa .wpforms-field-description, .el-form-caixa .el-aviso { font-size: .875rem; color: var(--wp--preset--color--ardosia); }

/* rodapé */
.el-rodape { background: var(--wp--preset--color--verde-fundo); color: #C6D6CE; }
.el-rodape a { color: #fff; }
.el-rodape .el-logo { font-size: 2.25rem; }
.el-rodape .el-pequeno { font-size: .8125rem; opacity: .8; }

/* âncora do formulário abaixo do topo */
#contato { scroll-margin-top: 24px; }

/* ---------- Celular ---------- */
@media (max-width: 900px) {
	.el-tipos { grid-template-columns: 1fr; grid-template-areas: "a" "b" "c" "d"; }
	.el-tipo:nth-child(2), .el-tipo:nth-child(3) { flex-direction: column; }
	.el-tipo:nth-child(2) .wp-block-image, .el-tipo:nth-child(3) .wp-block-image { width: 100%; }
	.el-tipo:nth-child(2) .wp-block-image img, .el-tipo:nth-child(3) .wp-block-image img { aspect-ratio: 16 / 10; }
	.el-tipo:nth-child(4) .el-tipo-texto { grid-template-columns: 1fr; gap: 8px; }
	.el-grade2, .el-processo, .el-contato-grade { grid-template-columns: 1fr; gap: 32px; }
	.el-dados { grid-template-columns: 1fr; gap: 20px; padding: 24px 0; }
	.el-dados > * { border-left: 0; border-top: 1px solid var(--wp--preset--color--linha); padding: 20px 24px 0; }
	.el-dados > *:first-child { border-top: 0; padding-top: 0; }
	.el-secao { padding-top: 60px; padding-bottom: 60px; }
	.el-hero { padding-bottom: 48px !important; }
}
@media (max-width: 560px) {
	.el-hero .wp-block-buttons { flex-direction: column; align-items: stretch; }
	.el-hero .wp-block-button__link { width: 100%; }
	.el-form-caixa { padding: 22px; }
	.el-header .el-header-cta { display: none; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }

/* ---------- Ajustes de encaixe no tema base ---------- */
/* seções de largura total encostam uma na outra (sem o espaço padrão entre blocos) */
.wp-block-post-content > .alignfull { margin-top: 0 !important; margin-bottom: 0 !important; }
/* lista simples gerada pelo shortcode el_lista */
.el-lista { padding-left: 1.2em; }
.el-lista li { margin: .35rem 0; color: var(--wp--preset--color--ardosia); }
/* páginas comuns (políticas, hub): título com o mesmo peso do sistema */
.wp-block-post-title { font-weight: 900; letter-spacing: -0.03em; }

/* ---------- Página de cidade ---------- */
/* usos na região: cartões lugar → tipo de plataforma (shortcode el_usos) */
.el-usos { display: grid; gap: 12px; margin-top: 28px; }
.el-uso { background: var(--wp--preset--color--branco); border-radius: var(--el-r-card); padding: 20px 22px; }
.el-uso-topo { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.el-uso h3 { margin: 0; font-size: 1.25rem; letter-spacing: -0.02em; line-height: 1.25; }
.el-uso-tipo { padding: 5px 12px; border-radius: 999px; background: #DCEBE4; color: var(--wp--preset--color--verde-fundo); font-size: .875rem; font-weight: 700; white-space: nowrap; }
.el-uso p { color: var(--wp--preset--color--ardosia); margin: .5rem 0 0; }
/* bloco "onde é pedida": foto fixa à esquerda, cartões à direita */
.el-demanda { display: grid !important; grid-template-columns: .9fr 1.1fr; gap: 56px; align-items: start; }
.el-demanda > .wp-block-image { position: sticky; top: 24px; margin: 0; }
.el-demanda > .wp-block-image img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--el-r-card); }
/* tipos em uma linha, com link para a explicação da home */
.el-tipos-linha { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 28px !important; }
.el-tipos-linha > * { margin: 0 !important; }
.el-tipos-linha a { display: block; height: 100%; padding: 18px 20px; border-radius: var(--el-r-card); border: 1px solid var(--wp--preset--color--linha); background: var(--wp--preset--color--branco); color: var(--wp--preset--color--tinta); text-decoration: none; }
.el-tipos-linha a:hover { border-color: var(--wp--preset--color--verde); }
.el-tipos-linha strong { display: block; font-weight: 900; font-size: 1.125rem; letter-spacing: -0.02em; }
.el-tipos-linha span { display: block; margin-top: 4px; font-size: .9375rem; color: var(--wp--preset--color--ardosia); }
/* bairros e vizinhas lado a lado */
.el-perto { display: grid !important; grid-template-columns: 1fr 1fr; gap: 56px; }
.el-perto h2 { font-size: 1.625rem; }
.el-perto p { color: var(--wp--preset--color--ardosia); }
@media (max-width: 900px) {
	.el-demanda, .el-perto { grid-template-columns: 1fr; gap: 32px; }
	.el-demanda > .wp-block-image { position: static; }
	.el-demanda > .wp-block-image img { aspect-ratio: 16 / 10; }
	.el-tipos-linha { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) { .el-tipos-linha { grid-template-columns: 1fr; } }

/* texto de abertura escrito pela IA (bloco 1 do PGP) */
.el-texto { padding-bottom: 0 !important; }
.el-texto h3 { margin-top: 32px; }
.el-texto p, .el-texto ul { color: var(--wp--preset--color--ardosia); }
/* coluna de leitura alinhada à esquerda do grupo largo (layout padrão, então max-width não centraliza) */
.el-texto-col > * { max-width: 780px; }
.el-texto ul { padding-left: 1.2em; }
.el-texto li { margin-bottom: 10px; }
.el-texto li::marker { color: var(--wp--preset--color--verde); }
/* corpo editorial longo (bloco 1 v3): seções com h2, tabela situação → plataforma → motivo, foto no topo */
.el-texto-col > h2 { margin-top: 48px; }
.el-texto-col > h2:first-child { margin-top: 0; }
.el-texto-col > .wp-block-image { margin: 0 auto 32px; }
.el-texto-col > .wp-block-image img { width: 100%; aspect-ratio: 16 / 7; object-fit: cover; border-radius: var(--el-r-card); }
.el-texto table { width: 100%; border-collapse: collapse; margin: 24px 0 8px; font-size: .9375rem; background: var(--wp--preset--color--branco); border-radius: var(--el-r-card); overflow: hidden; }
.el-texto th { text-align: left; font-weight: 700; color: var(--wp--preset--color--tinta); background: var(--wp--preset--color--neve); padding: 12px 16px; border-bottom: 1px solid var(--wp--preset--color--linha); }
.el-texto td { padding: 12px 16px; vertical-align: top; color: var(--wp--preset--color--ardosia); border-bottom: 1px solid var(--wp--preset--color--linha); }
.el-texto tr:last-child td { border-bottom: 0; }
.el-texto td:nth-child(2) { font-weight: 600; color: var(--wp--preset--color--tinta); white-space: nowrap; }
@media (max-width: 640px) {
	.el-texto table { display: block; overflow-x: auto; }
	.el-texto td:nth-child(2) { white-space: normal; }
}
/* frase fixa da NR-35 antes do texto de segurança (bloco 4) */
.el-regra { font-weight: 600; color: var(--wp--preset--color--tinta) !important; border-left: 3px solid var(--wp--preset--color--verde); padding-left: 14px; }
.el-faq details p + p { margin-top: -10px; }

/* resposta rápida (bloco 3 de IA): caixa logo abaixo do topo, antes dos dados */
.el-resposta { background: var(--wp--preset--color--branco); border: 1px solid var(--wp--preset--color--linha); border-left: 4px solid var(--wp--preset--color--verde); border-radius: 14px; padding: 22px 26px; margin-bottom: 28px !important; }
.el-resposta-rotulo { font-size: .8125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--wp--preset--color--verde); margin: 0 0 8px !important; }
.el-resposta p:not(.el-resposta-rotulo) { margin: 0; max-width: 820px; font-size: 1.0625rem; line-height: 1.6; }

/* coluna de leitura centralizada nas páginas de cidade: resposta, dados, corpo, segurança e FAQ
   (antes ficavam presos à esquerda do grupo de 1200px e o [el_dados] escapava para a borda) */
:root { --el-leitura: 820px; }
.el-secao > .el-resposta, .el-secao > .el-dados, .el-secao > .el-faq,
.el-texto > h2.alignwide, #duvidas > h2.alignwide {
	max-width: var(--el-leitura) !important; margin-left: auto !important; margin-right: auto !important; }
.el-texto-col > * { max-width: var(--el-leitura); margin-left: auto; margin-right: auto; box-sizing: border-box; }
.el-texto-col > table { margin-left: auto; margin-right: auto; }
.el-resposta p:not(.el-resposta-rotulo) { max-width: none; }