/* Páginas de apoio: Convênios, Contato e Privacidade. Mobile primeiro. Só tokens de base.css. */

/* ---------- Topo comum (rótulo, h1 e lead vêm da base: .topo-pagina, .titulo-pagina, .lead) ---------- */
.pag-nota { margin-top: var(--e-3); font-size: var(--t-sm); color: var(--texto-suave); }
.pag-topo .link-seta { margin-top: var(--e-2); }

.sem-quebra { white-space: nowrap; }

/* Preço com marca-texto de sol: chama o olho sem gritar */
.marca-texto {
  padding-inline: 0.1em;
  border-radius: 0.18em;
  background: var(--sol-300);
  color: var(--mar-950);
  white-space: nowrap;
  -webkit-box-decoration-break: clone;
          box-decoration-break: clone;
}

/* ---------- Link grande de contato (tel:, mailto:, wa.me) ---------- */
.canais { display: grid; gap: var(--e-2); }
.canal {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--e-3);
  min-height: 3.75rem; padding: var(--e-3) var(--e-4);
  border: 2px solid var(--linha); border-radius: var(--r-m);
  background: var(--superficie); color: var(--texto); text-decoration: none;
  transition: border-color 160ms var(--facil), transform 160ms var(--facil);
}
.canal:hover { border-color: var(--mar-500); }
.canal:active { transform: translateY(1px); }
.canal__icone { width: 1.5rem; height: 1.5rem; color: var(--piscina-700); }
.canal[href^="https://wa.me"] .canal__icone { color: var(--folha-600); }
.canal__texto { display: grid; gap: 0.1rem; }
.canal__tipo { font-size: var(--t-xs); font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; color: var(--texto-suave); }
.canal__valor { font-weight: 700; line-height: 1.25; overflow-wrap: anywhere; }
.canal__seta { color: var(--texto-fraco); transition: transform 200ms var(--facil); }
.canal:hover .canal__seta { transform: translateX(3px); }

/* WhatsApp principal: verde chapado, o mesmo verde do botão fixo do rodapé da tela */
.canal--whats { background: var(--folha-600); border-color: var(--folha-600); color: var(--areia-50); }
.canal--whats:hover { border-color: var(--mar-900); }
.canal.canal--whats .canal__icone,
.canal.canal--whats .canal__seta { color: var(--areia-50); }
.canal--whats .canal__tipo { color: var(--folha-100); }

/* ---------- Convênios ---------- */
.conv-topo { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-6); }

.busca {
  padding: var(--e-4);
  border: 2px solid var(--linha); border-radius: var(--r-g);
  background: var(--superficie);
}
.busca__rotulo { display: block; font: 800 var(--t-lg)/1.2 var(--fonte-titulo); font-stretch: 92%; }
.busca__linha { display: flex; gap: var(--e-2); margin-top: var(--e-3); }
.busca__campo {
  flex: 1; min-width: 0; min-height: 3rem; padding: 0 var(--e-4);
  border: 2px solid var(--texto-fraco); border-radius: var(--r-pilula);
  background: var(--fundo); font-size: var(--t-base);
}
.busca__campo:focus-visible { outline: 3px solid var(--foco); outline-offset: 2px; border-color: var(--foco); }
.busca__campo::-webkit-search-cancel-button { cursor: pointer; }
.busca__botao { padding-inline: 1.1rem; }
/* Exemplos depois do resultado: com o teclado aberto, a resposta aparece logo abaixo do campo */
.busca__exemplos { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2); margin-top: var(--e-4); font-size: var(--t-sm); color: var(--texto-suave); }
.busca__exemplos span { flex-basis: 100%; }
.busca__exemplos a {
  display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0 var(--e-4);
  border: 2px solid var(--linha); border-radius: var(--r-pilula);
  background: var(--fundo); color: var(--texto); font-weight: 700; text-decoration: none;
}
.busca__exemplos a:hover { border-color: var(--mar-500); }

/* O status fica sempre na árvore (role=status), mesmo vazio, para o leitor de tela anunciar a mudança */
.busca__status { font-weight: 700; }
.busca__status:not(:empty) { margin-top: var(--e-3); padding-top: var(--e-4); border-top: 2px dashed var(--linha); }
.busca__lista { margin-top: var(--e-2); }
.busca__lista li {
  display: flex; align-items: center; gap: var(--e-3);
  min-height: 3rem; padding-block: var(--e-2);
  border-bottom: 1px solid var(--linha);
  font: 700 var(--t-lg)/1.2 var(--fonte-titulo); font-stretch: 92%;
}
.busca__lista .icon { color: var(--aberto); }
.busca__proximo { margin-top: var(--e-1); }
.busca__vazio {
  margin-top: var(--e-3); padding: var(--e-4);
  border-radius: var(--r-m); background: var(--fundo-alt);
  font-size: var(--t-sm); color: var(--texto);
}
.busca__vazio > * + * { margin-top: var(--e-2); }
.busca__vazio a { font-weight: 700; overflow-wrap: anywhere; }

.conv-uso { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-7); }
.passos { counter-reset: passo; margin-top: var(--e-5); display: grid; gap: var(--e-5); max-width: 40rem; }
.passos li {
  counter-increment: passo;
  display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); column-gap: var(--e-3);
  color: var(--texto-suave);
}
.passos li::before {
  content: counter(passo);
  font: 800 var(--t-2xl)/0.9 var(--fonte-titulo);
  color: var(--piscina-700);
}
.passos strong { display: block; color: var(--texto); font-size: var(--t-lg); }

/* Canhoto do convênio: picote na altura exata do fim do topo */
.ingresso-conv { --altura-topo: 7.5rem; --picote: calc(var(--altura-topo) + 1px); max-width: 26rem; }
.ingresso-conv__topo {
  display: grid; align-content: center; gap: var(--e-1);
  height: var(--altura-topo); padding-inline: var(--e-6);
}
.ingresso-conv__tipo { font: 700 var(--t-sm)/1.2 var(--fonte-titulo); font-stretch: 85%; letter-spacing: 0.03em; text-transform: uppercase; color: var(--coral-600); }
.ingresso-conv__valor { font: 800 var(--t-3xl)/0.95 var(--fonte-titulo); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.ingresso-conv__valor small { margin-right: 0.12em; font-size: 0.42em; font-weight: 700; vertical-align: 0.95em; }
.ingresso-conv__limite { font-size: var(--t-sm); font-weight: 600; color: var(--texto-suave); }
.ingresso-conv__qtd { display: flex; align-items: baseline; gap: var(--e-2); font-weight: 700; line-height: 1.2; }
.ingresso-conv__qtd span { font: 800 var(--t-3xl)/0.85 var(--fonte-titulo); letter-spacing: -0.02em; color: var(--texto); }
.ingresso-conv__corpo { padding: var(--e-4) var(--e-6) var(--e-5); }
.ingresso-conv__corpo h3 { font-size: var(--t-xl); }
.ingresso-conv__grupo { margin-top: var(--e-4); font-size: var(--t-sm); font-weight: 700; color: var(--texto-suave); }
.ingresso-conv__docs li { display: flex; align-items: center; gap: var(--e-2); margin-top: var(--e-2); font-weight: 600; }
.ingresso-conv__docs .icon { color: var(--aberto); }

.conv-pedir { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-5); }
.conv-pedir .canal { max-width: 30rem; }

/* ---------- Contato ---------- */
.ct-topo { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-6); }
.canais--destaque .canal { min-height: 4.25rem; }

.assuntos { margin-top: var(--e-6); border-top: 2px solid var(--linha); }
.assunto { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-4); padding-block: var(--e-5); border-bottom: 2px solid var(--linha); }
.assunto h3 { font-size: var(--t-xl); font-stretch: 92%; }
.assunto__texto p { margin-top: var(--e-2); max-width: 52ch; color: var(--texto-suave); }

/* Empresas e profissionais: lista enxuta, e-mail como link, sem cartão */
.empresas { margin-top: var(--e-6); }
.empresas__titulo { font-size: var(--t-lg); font-stretch: 92%; }
.empresas__lista { margin-top: var(--e-4); display: grid; gap: var(--e-4); }
/* Linha do meio elástica: no desktop os e-mails ficam na mesma altura nas quatro colunas */
.empresas__lista li { display: grid; grid-template-rows: auto 1fr auto; justify-items: start; }
.empresas__nome { font-weight: 700; }
.empresas__texto { font-size: var(--t-sm); color: var(--texto-suave); }
.empresas__email {
  display: inline-flex; align-items: center; gap: var(--e-2);
  min-height: 2.75rem; font-size: var(--t-sm); font-weight: 700; line-height: 1.25;
}
.empresas__email span { overflow-wrap: anywhere; }

.chegar { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-7); }
.placa {
  margin-top: var(--e-5); padding: var(--e-5);
  max-width: 26rem;
  border-radius: var(--r-m);
  background: var(--piscina-900); color: var(--areia-50);
  box-shadow: inset 0 0 0 0.4rem var(--piscina-900), inset 0 0 0 0.55rem var(--areia-100);
}
.placa__destino { display: flex; align-items: center; gap: var(--e-2); font: 800 var(--t-xl)/1.1 var(--fonte-titulo); font-stretch: 88%; }
.placa__seta { width: 1.6em; height: 1.6em; color: var(--sol-400); }
.placa__km { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 var(--e-2); margin-top: var(--e-4); padding-top: var(--e-3); border-top: 2px solid var(--piscina-700); font-weight: 600; }
.placa__km strong { font: 800 var(--t-3xl)/1 var(--fonte-titulo); letter-spacing: -0.02em; color: var(--sol-400); }
.placa__cerca { flex-basis: 100%; font-size: var(--t-sm); color: var(--piscina-200); }

.chegar__endereco { display: flex; gap: var(--e-2); margin-top: var(--e-5); max-width: 34ch; font-style: normal; font-weight: 600; }
.chegar__endereco .icon { margin-top: 0.15em; color: var(--coral-600); }
.chegar__endereco span { text-wrap: balance; }
.chegar__mapa { margin-top: var(--e-4); }

.chegar__dicas h3 { font-size: var(--t-xl); }
.dicas { margin-top: var(--e-4); display: grid; gap: var(--e-4); }
.dicas li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--e-3); align-items: start; }
.dicas .icon { width: 1.5rem; height: 1.5rem; color: var(--piscina-700); }
.dicas a { font-weight: 700; white-space: nowrap; }
.chegar__dicas > p { margin-top: var(--e-4); }

.redes { padding-block: var(--e-7); }
.redes__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-4); }
.redes__titulo { font-size: var(--t-xl); }
.redes__lista { display: flex; flex-wrap: wrap; gap: var(--e-2); }
.redes__lista a {
  display: inline-flex; align-items: center; gap: var(--e-2);
  min-height: 2.75rem; padding: var(--e-2) var(--e-4);
  border: 2px solid var(--linha); border-radius: var(--r-pilula);
  background: var(--superficie); color: var(--texto); text-decoration: none;
}
.redes__lista a:hover { border-color: var(--mar-500); }
.redes__nome { font-weight: 700; }
.redes__perfil { color: var(--texto-suave); font-size: var(--t-sm); }
.redes__lista .icon { width: 1em; height: 1em; color: var(--texto-fraco); }

/* ---------- Privacidade ---------- */
.priv-topo { padding-bottom: var(--e-6); }
.resumo {
  padding: var(--e-5);
  max-width: 42rem;
  border-radius: var(--r-g);
  background: var(--piscina-100);
}
.resumo h2 { font-size: var(--t-xl); }
.resumo ul { list-style: none; padding: 0; margin-top: var(--e-3); display: grid; gap: var(--e-3); }
.resumo li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--e-2); }
.resumo .icon { margin-top: 0.15em; color: var(--piscina-700); }
.resumo a { font-weight: 700; }

.politica { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e-6); padding-bottom: var(--secao); }
.indice { padding-block: var(--e-4); border-block: 2px solid var(--linha); }
.indice ol { list-style: none; padding: 0; margin-top: var(--e-2); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--e-4); }
.indice a { display: flex; align-items: center; min-height: 2.75rem; font-weight: 600; text-decoration: none; }
.indice a:hover { text-decoration: underline; }

.politica__texto { max-width: 42rem; }
.politica__texto section + section { margin-top: var(--e-7); }
.politica__texto section { scroll-margin-top: var(--e-4); }
.politica__texto h2 { font-size: var(--t-xl); }
.politica__texto h3 { margin-top: var(--e-5); font-size: var(--t-lg); }
.politica__texto p, .politica__texto ul { margin-top: var(--e-3); }
.politica__texto ul:not([class]) { padding-left: 1.2em; }
.politica__texto ul:not([class]) li + li { margin-top: var(--e-2); }
.politica__texto ul:not([class]) li::marker { color: var(--piscina-700); }
.politica__texto .canais { margin-top: var(--e-4); max-width: 30rem; }
.priv-escolha .btn { white-space: normal; text-align: center; }

/* ---------- Tablet ---------- */
@media (min-width: 48rem) {
  .canais--destaque .canal__valor { font-size: var(--t-lg); }
  .busca__exemplos span { flex-basis: auto; }
  .resumo__email { display: inline-block; } /* com espaço, e-mail e ponto descem juntos em vez de partir no @ */
  .assunto { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--e-6); align-items: center; }
  .indice ol { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .empresas__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-5) var(--e-6); }
  .chegar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--e-6); align-items: start; }
  .chegar__dicas { padding-top: var(--e-7); }
  .redes__grade { grid-template-columns: auto 1fr; align-items: center; gap: var(--e-6); }
}

/* ---------- Desktop ---------- */
@media (min-width: 64rem) {
  .conv-topo { grid-template-columns: minmax(0, 1fr) minmax(0, 28rem); gap: var(--e-7); align-items: end; }
  .busca { padding: var(--e-5); }
  .conv-uso { grid-template-columns: minmax(0, 1fr) minmax(0, 24rem); gap: var(--e-8); align-items: center; }
  .ingresso-conv { --altura-topo: 10rem; }
  .conv-pedir { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--e-7); }
  .conv-pedir .canal { min-width: 26rem; }

  .ct-topo { grid-template-columns: minmax(0, 1fr) minmax(0, 28rem); gap: var(--e-8); align-items: start; }
  .assunto { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--e-8); }
  .empresas__lista { grid-template-columns: repeat(4, minmax(0, 1fr)); }

  /* Resumo e texto na mesma coluna; o índice fica fixo ao lado dos dois */
  .politica { grid-template-columns: 14rem minmax(0, 1fr); gap: var(--e-7) var(--e-8); align-items: start; padding-top: var(--e-4); }
  .resumo { grid-column: 2; grid-row: 1; }
  .politica__texto { grid-column: 2; grid-row: 2; }
  .indice { grid-column: 1; grid-row: 1 / span 2; position: sticky; top: var(--e-4); }
  .indice ol { grid-template-columns: 1fr; }
}