/* Diagnóstico Ambiental AREAMB — no padrão visual do site (Montserrat, azul-marinho, dourado)
 * Tamanhos maiores e contraste reforçado para leitura confortável em qualquer idade. */
.areamb-diag,
.areamb-diag-hero,
.areamb-diag-faixa {
  --ad-navy: #1b303e;
  --ad-navy-escuro: #172c39;
  --ad-texto: #2f3e47;
  --ad-suave: #52616a;
  --ad-ouro: #d2b678;
  --ad-ouro-escuro: #a8853f;
  --ad-creme: #f5f2ec;
  --ad-borda: #d9d2c4;
  --ad-verde: #1f6b45;
  --ad-alto: #a3261f;
  --ad-alto-bg: #fbecea;
  --ad-medio: #8a5d0c;
  --ad-medio-bg: #fbf3e2;
  --ad-ok: #1f6b45;
  --ad-ok-bg: #e8f1eb;
  font-family: Montserrat, Arial, sans-serif;
}
.areamb-diag *, .areamb-diag *::before, .areamb-diag *::after,
.areamb-diag-hero *, .areamb-diag-faixa * { box-sizing: border-box; }

/* ---------- Cabeçalho da página /diagnostico ---------- */
.areamb-diag-pagina { background: var(--ad-creme, #f5f2ec); padding: 56px 20px 72px; }
.areamb-diag-hero { max-width: 760px; margin: 0 auto 32px; text-align: center; }
.areamb-diag-hero .ad-eyebrow-linha { display: inline-flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ad-navy); margin: 0 0 18px; }
.areamb-diag-hero .ad-eyebrow-linha::before { content: ""; width: 32px; height: 2px; background: var(--ad-ouro); }
.areamb-diag-hero h1 { font-family: Montserrat, Arial, sans-serif; font-weight: 700; font-size: clamp(28px, 3.2vw, 40px); line-height: 1.18; color: var(--ad-navy); margin: 0 0 18px; }
.areamb-diag-hero h1 em { font-style: normal; color: var(--ad-ouro-escuro); }
.areamb-diag-hero p { font-size: 17px; line-height: 1.65; color: var(--ad-suave); margin: 0 auto; max-width: 640px; }
.areamb-diag-hero .ad-selos { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 26px; margin: 22px 0 0; padding: 0; list-style: none; font-size: 15px; font-weight: 500; color: var(--ad-navy); }
.areamb-diag-hero .ad-selos li { display: inline-flex; align-items: center; gap: 8px; }
.areamb-diag-hero .ad-selos li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--ad-ouro); }

/* ---------- Cartão do questionário ---------- */
.areamb-diag { color: var(--ad-texto); max-width: 820px; margin: 0 auto; line-height: 1.6; font-size: 17px; }
.areamb-diag .ad-card { position: relative; background: #fff; border: 1px solid var(--ad-borda); border-radius: 8px; padding: 40px 40px 36px; box-shadow: 0 18px 40px -26px rgba(27, 48, 62, .45); }
.areamb-diag .ad-progresso { position: absolute; top: 0; left: 0; right: 0; height: 6px; background: #ece6da; border-radius: 8px 8px 0 0; overflow: hidden; }
.areamb-diag .ad-progresso span { display: block; height: 100%; background: var(--ad-ouro); transition: width .35s ease; }
.areamb-diag .ad-voltar { background: none; border: 0; color: var(--ad-navy); font: inherit; font-size: 16px; font-weight: 600; padding: 6px 0; margin: 0 0 14px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.areamb-diag .ad-voltar:hover { color: var(--ad-ouro-escuro); }
.areamb-diag .ad-eyebrow { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ad-navy); margin: 0 0 12px; }
.areamb-diag .ad-eyebrow::before { content: ""; width: 26px; height: 2px; background: var(--ad-ouro); flex: 0 0 auto; }
.areamb-diag .ad-titulo { font-family: Montserrat, Arial, sans-serif; font-weight: 700; color: var(--ad-navy); font-size: clamp(22px, 2.6vw, 28px); line-height: 1.25; margin: 0 0 12px; outline: none; }
.areamb-diag .ad-sub { color: var(--ad-suave); margin: 0 0 24px; font-size: 17px; line-height: 1.6; }

/* caminhos */
.areamb-diag .ad-caminhos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 14px; margin-top: 10px; }
.areamb-diag .ad-caminho { display: flex; gap: 16px; align-items: flex-start; text-align: left; padding: 20px 18px; border: 1.5px solid var(--ad-borda); border-radius: 6px; background: var(--ad-creme); cursor: pointer; font: inherit; color: inherit; transition: border-color .15s, background .15s, box-shadow .15s; }
.areamb-diag .ad-caminho:hover, .areamb-diag .ad-caminho:focus-visible { border-color: var(--ad-navy); background: #fff; box-shadow: 0 10px 24px -18px rgba(27, 48, 62, .6); outline: none; }
.areamb-diag .ad-caminho-ico { flex: 0 0 48px; height: 48px; border-radius: 6px; background: var(--ad-navy); color: var(--ad-ouro); display: grid; place-items: center; }
.areamb-diag .ad-caminho-ico svg { width: 25px; height: 25px; }
.areamb-diag .ad-caminho-txt { min-width: 0; }
.areamb-diag .ad-caminho-txt strong { display: block; font-weight: 700; color: var(--ad-navy); font-size: 18px; line-height: 1.3; margin-bottom: 4px; }
.areamb-diag .ad-caminho-txt small { display: block; color: var(--ad-suave); font-size: 15px; line-height: 1.45; overflow-wrap: break-word; }

/* opções */
.areamb-diag .ad-opcoes { display: grid; gap: 12px; }
.areamb-diag .ad-opcao { display: flex; align-items: center; gap: 14px; width: 100%; text-align: left; padding: 18px 20px; border: 1.5px solid var(--ad-borda); border-radius: 6px; background: #fff; font: inherit; font-size: 17.5px; font-weight: 500; line-height: 1.4; color: var(--ad-texto); cursor: pointer; transition: border-color .12s, background .12s; min-height: 60px; }
.areamb-diag .ad-opcao:hover, .areamb-diag .ad-opcao:focus-visible { border-color: var(--ad-navy); outline: none; }
.areamb-diag .ad-opcao.is-on { border-color: var(--ad-navy); background: var(--ad-creme); }
.areamb-diag .ad-check { flex: 0 0 24px; height: 24px; border-radius: 50%; border: 2px solid #9c9486; position: relative; background: #fff; }
.areamb-diag .ad-opcao.is-multi .ad-check { border-radius: 4px; }
.areamb-diag .ad-opcao.is-on .ad-check { border-color: var(--ad-navy); background: var(--ad-navy); }
.areamb-diag .ad-opcao.is-on .ad-check::after { content: ""; position: absolute; left: 7px; top: 2px; width: 6px; height: 12px; border: solid var(--ad-ouro); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }

/* botões (mesmo estilo dos botões do site) */
.areamb-diag .ad-acoes { margin-top: 24px; display: flex; justify-content: flex-end; }
.areamb-diag .ad-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; background: var(--ad-navy); color: #fff; border: 0; border-radius: 4px; padding: 18px 28px; font-family: Montserrat, Arial, sans-serif; font-weight: 600; font-size: 16px; letter-spacing: .02em; cursor: pointer; text-decoration: none; transition: background .15s, transform .15s; }
.areamb-diag .ad-btn:hover { background: var(--ad-navy-escuro); color: #fff; transform: translateY(-1px); }
.areamb-diag .ad-btn:disabled { background: #9aa6ae; cursor: not-allowed; transform: none; }
.areamb-diag .ad-btn--grande { width: 100%; padding: 20px; font-size: 17px; }
.areamb-diag .ad-btn--whats { background: var(--ad-ouro); color: var(--ad-navy); width: 100%; padding: 20px; font-size: 17px; }
.areamb-diag .ad-btn--whats:hover { background: #c4a562; color: var(--ad-navy); }
.areamb-diag .ad-btn--whats svg { width: 24px; height: 24px; }
.areamb-diag .ad-link { display: block; margin: 22px auto 0; background: none; border: 0; color: var(--ad-navy); text-decoration: underline; text-underline-offset: 3px; font: inherit; font-size: 16px; font-weight: 500; cursor: pointer; }

/* formulário */
.areamb-diag .ad-teaser { display: flex; gap: 12px; align-items: center; padding: 16px 18px; border-radius: 6px; margin: 8px 0 24px; font-size: 17px; line-height: 1.5; }
.areamb-diag .ad-teaser--alto { background: var(--ad-alto-bg); color: #6e1a15; }
.areamb-diag .ad-teaser--medio { background: var(--ad-medio-bg); color: #5e4008; }
.areamb-diag .ad-teaser--ok { background: var(--ad-ok-bg); color: #164d32; }
.areamb-diag .ad-dot { flex: 0 0 14px; height: 14px; border-radius: 50%; background: currentColor; }
.areamb-diag .ad-campos { display: grid; gap: 18px; }
.areamb-diag .ad-linha { display: flex; gap: 14px; }
.areamb-diag .ad-campo { display: grid; gap: 7px; font-size: 16px; font-weight: 600; color: var(--ad-navy); }
.areamb-diag .ad-campo em { font-style: normal; font-weight: 400; color: var(--ad-suave); }
.areamb-diag .ad-campo--grow { flex: 1; }
.areamb-diag .ad-campo--uf { flex: 0 0 104px; }
.areamb-diag .ad-campo input, .areamb-diag .ad-campo select, .areamb-diag .ad-campo textarea { width: 100%; font-family: Montserrat, Arial, sans-serif; font-size: 17px; font-weight: 400; color: var(--ad-texto); padding: 14px 15px; border: 1.5px solid #c9c1b2; border-radius: 4px; background: #fff; min-height: 54px; }
.areamb-diag .ad-campo input:focus, .areamb-diag .ad-campo select:focus, .areamb-diag .ad-campo textarea:focus { border-color: var(--ad-navy); outline: none; box-shadow: 0 0 0 3px rgba(210, 182, 120, .45); }
.areamb-diag .ad-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.areamb-diag .ad-lgpd { display: flex; gap: 14px; align-items: flex-start; font-size: 16px; line-height: 1.55; color: var(--ad-texto); margin-top: 22px; cursor: pointer; padding: 16px 18px; border: 1.5px solid #c9c1b2; border-radius: 6px; background: var(--ad-creme); transition: border-color .15s, background .15s; }
.areamb-diag .ad-lgpd.is-on { border-color: var(--ad-navy); background: #fff; }
.areamb-diag .ad-lgpd strong { color: var(--ad-navy); }
.areamb-diag .ad-lgpd input { margin-top: 1px; width: 26px; height: 26px; accent-color: var(--ad-navy); flex: 0 0 auto; }
.areamb-diag .ad-lgpd a { color: var(--ad-navy); font-weight: 600; }
.areamb-diag .ad-erro { background: var(--ad-alto-bg); color: var(--ad-alto); padding: 12px 14px; border-radius: 4px; font-size: 16px; font-weight: 500; margin: 16px 0 0; }
.areamb-diag .ad-nota { text-align: center; font-size: 15px; color: var(--ad-suave); margin: 12px 0 0; }

/* resultado */
.areamb-diag .ad-semaforo { display: flex; gap: 18px; align-items: flex-start; padding: 22px; border-radius: 6px; margin-bottom: 24px; }
.areamb-diag .ad-semaforo .ad-sub { margin: 0; color: var(--ad-texto); }
.areamb-diag .ad-semaforo--alto { background: var(--ad-alto-bg); }
.areamb-diag .ad-semaforo--medio { background: var(--ad-medio-bg); }
.areamb-diag .ad-semaforo--ok { background: var(--ad-ok-bg); }
.areamb-diag .ad-luz { flex: 0 0 20px; height: 20px; margin-top: 7px; border-radius: 50%; box-shadow: 0 0 0 5px rgba(255,255,255,.75); }
.areamb-diag .ad-semaforo--alto .ad-luz { background: var(--ad-alto); }
.areamb-diag .ad-semaforo--medio .ad-luz { background: #d99a12; }
.areamb-diag .ad-semaforo--ok .ad-luz { background: var(--ad-ok); }
.areamb-diag .ad-achados { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 14px; }
.areamb-diag .ad-achado { border: 1px solid var(--ad-borda); border-left: 5px solid; border-radius: 6px; padding: 18px 20px; background: #fff; }
.areamb-diag .ad-achado--alto { border-left-color: var(--ad-alto); }
.areamb-diag .ad-achado--medio { border-left-color: #d99a12; }
.areamb-diag .ad-achado--info { border-left-color: var(--ad-navy); }
.areamb-diag .ad-achado h3 { font-family: Montserrat, Arial, sans-serif; font-weight: 700; font-size: 19px; line-height: 1.3; color: var(--ad-navy); margin: 6px 0 8px; }
.areamb-diag .ad-achado p { margin: 0 0 8px; font-size: 17px; line-height: 1.6; color: var(--ad-texto); }
.areamb-diag .ad-tag { font-size: 13px; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; }
.areamb-diag .ad-achado--alto .ad-tag { color: var(--ad-alto); }
.areamb-diag .ad-achado--medio .ad-tag { color: var(--ad-medio); }
.areamb-diag .ad-achado--info .ad-tag { color: var(--ad-suave); }
.areamb-diag .ad-servico { color: var(--ad-suave) !important; font-size: 16px !important; }
.areamb-diag .ad-servico strong { color: var(--ad-navy); font-weight: 700; }
.areamb-diag .ad-fonte { font-size: 15.5px !important; color: var(--ad-suave) !important; }
.areamb-diag .ad-fonte a { color: var(--ad-navy); font-weight: 600; }
.areamb-diag .ad-cta { background: var(--ad-navy); color: #e6edf1; border-radius: 6px; padding: 28px; }
.areamb-diag .ad-cta h3 { font-family: Montserrat, Arial, sans-serif; font-weight: 700; color: #fff; margin: 0 0 8px; font-size: 22px; }
.areamb-diag .ad-cta p { margin: 0 0 20px; font-size: 17px; color: #e6edf1; }
.areamb-diag .ad-aviso { font-size: 15px !important; line-height: 1.55; color: #bfccd5 !important; margin: 18px 0 0 !important; }

/* ---------- Faixa nas páginas de serviço ---------- */
.areamb-diag-faixa { max-width: 1140px; margin: 56px auto; padding: 0 20px; }
.areamb-diag-faixa .ad-faixa-box { display: flex; flex-wrap: wrap; gap: 18px 32px; align-items: center; justify-content: space-between; background: var(--ad-navy); border-radius: 6px; padding: 34px 40px; }
.areamb-diag-faixa .ad-faixa-txt { flex: 1 1 420px; }
.areamb-diag-faixa .ad-faixa-eyebrow { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ad-ouro); margin: 0 0 10px; }
.areamb-diag-faixa .ad-faixa-eyebrow::before { content: ""; width: 26px; height: 2px; background: var(--ad-ouro); }
.areamb-diag-faixa strong { display: block; font-weight: 700; color: #fff; font-size: clamp(22px, 2.6vw, 28px); line-height: 1.25; margin: 0 0 8px; }
.areamb-diag-faixa .ad-faixa-txt span { display: block; font-size: 17px; line-height: 1.6; color: #d3dde3; }
.areamb-diag-faixa a.ad-faixa-btn { display: inline-flex; align-items: center; gap: 10px; background: var(--ad-ouro); color: var(--ad-navy) !important; text-decoration: none !important; font-weight: 600; font-size: 16px; letter-spacing: .02em; padding: 19px 28px; border-radius: 4px; white-space: nowrap; transition: background .15s, transform .15s; }
.areamb-diag-faixa a.ad-faixa-btn:hover { background: #c4a562; transform: translateY(-1px); }

@media (max-width: 640px) {
  .areamb-diag-pagina { padding: 36px 14px 48px; }
  .areamb-diag-hero p { font-size: 17px; }
  .areamb-diag .ad-card { padding: 32px 18px 24px; }
  .areamb-diag .ad-linha { flex-direction: column; gap: 18px; }
  .areamb-diag .ad-campo--uf { flex: auto; }
  .areamb-diag .ad-semaforo { padding: 16px; gap: 12px; }
  .areamb-diag .ad-acoes .ad-btn { width: 100%; }
  .areamb-diag-faixa .ad-faixa-box { padding: 28px 22px; }
  .areamb-diag-faixa a.ad-faixa-btn { width: 100%; justify-content: center; white-space: normal; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .areamb-diag *, .areamb-diag-faixa * { transition: none !important; }
}
.areamb-diag .ad-lgpd-texto { font-size: 15px; line-height: 1.55; color: var(--ad-suave); text-align: center; margin: 14px auto 0; max-width: 560px; }
.areamb-diag .ad-lgpd-texto a { color: var(--ad-navy); font-weight: 600; }
.areamb-diag .ad-nota-aceite { color: var(--ad-navy); font-weight: 600; }