/* ==========================================================================
   Guincho Pantanal — camada de identidade
   --------------------------------------------------------------------------
   Conceito: o selo da Pantanal como giroflex aceso na beira da estrada.
   Assinatura principal: o selo pulsa em anéis (hero, CTA, sede no mapa, FAB).
   Assinatura secundária: faixa seccionada da rodovia (tracejado) + rodovias em placa.
   Só papéis semânticos do tokens.css. Ordem = ordem da página.

   Hierarquia (6 papéis): gigante (h1, lema) · título de seção · subtítulo de item
   · lead · corpo (17px) · rótulo (14px caixa alta). Pesos: 400 · 700 · 800.
   ========================================================================== */

/* ---------- BASE DA DIREÇÃO ---------- */
h1, h2, h3, .section-title {
  text-transform: uppercase;
  font-weight: var(--fw-black);
}
h3 { font-size: var(--fs-h3); line-height: 1; letter-spacing: .01em; }
.section-title { font-size: var(--fs-h2); line-height: var(--lh-tight); margin-bottom: 1.25rem; }
.section-title em, .display-title em { color: var(--accent-text); }
.lead { font-size: var(--fs-lead); line-height: 1.55; }
.eyebrow {
  display: inline-flex; align-items: center; gap: .6rem;
  font-family: var(--font-body); font-weight: var(--fw-bold); font-size: var(--fs-label);
  letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--accent-text);
  margin-bottom: 1rem;
}
.eyebrow::before { content: ""; width: 1.75rem; height: var(--sig-faixa-espessura); background: var(--signal); }
#conteudo a:not(.btn) { color: var(--accent-text); }
.section--inverse :where(a:not(.btn)) { color: var(--text-on-inverse); }

/* Rótulo (papel 6): Overpass 700, 14px, caixa alta espaçada */
.rotulo, .hero__provas, .nav-plantao, .sobre__cartao, .fatos dt,
.areas__subtitulo, .plantao__status, .google-selo > span[data-editor] {
  font-family: var(--font-body); font-weight: var(--fw-bold); font-size: var(--fs-label);
  letter-spacing: var(--tracking-label); text-transform: uppercase; line-height: 1.3;
}

/* ---------- SINAL "AO VIVO" (ponto que pulsa) ---------- */
.ponto-vivo {
  position: relative; display: inline-block; flex: none;
  width: 10px; height: 10px; border-radius: 50%; background: var(--signal);
}
.ponto-vivo::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: var(--signal); animation: ponto-vivo 1.6s var(--ease-out) infinite;
}
.ponto-vivo--claro, .ponto-vivo--claro::after { background: var(--text-on-brand); }
@keyframes ponto-vivo { from { transform: scale(1); opacity: .7; } to { transform: scale(3); opacity: 0; } }

/* ---------- ASSINATURA: SELO QUE PULSA (giroflex) ---------- */
.selo { position: relative; aspect-ratio: 1; margin: 0; }
.selo__img { position: relative; z-index: 1; width: 100%; height: 100%; }
.selo__anel {
  position: absolute; inset: 0; border-radius: 50%;
  border: 2px solid rgba(var(--signal-rgb), .75);
  background: rgba(var(--signal-rgb), .12);
  animation: pulso var(--sig-pulso-dur) var(--ease-out) infinite;
}
.selo__anel:nth-child(2) { animation-delay: calc(var(--sig-pulso-dur) / 3); }
.selo__anel:nth-child(3) { animation-delay: calc(var(--sig-pulso-dur) / 3 * 2); }
@keyframes pulso { from { transform: scale(1); opacity: .9; } to { transform: scale(1.85); opacity: 0; } }

/* Telefone com ícone num círculo (data-cfg="phone" troca o texto do link; o ícone vem do CSS) */
.tel-icone::before {
  content: "\f5b4"; font-family: "bootstrap-icons"; font-weight: 400; line-height: 1; font-size: .95rem;
  width: 2rem; height: 2rem; flex: none; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--text-on-brand); color: var(--accent);
}

/* ---------- BOTÕES ----------
   Botões grandes (hero, como pedir, CTA): letra de letreiro em caixa alta. */
.btn { --bs-btn-font-weight: var(--fw-bold); letter-spacing: .01em; }
.btn-lg {
  --bs-btn-padding-x: 1.6rem; --bs-btn-padding-y: .8rem; --bs-btn-font-size: 1.375rem;
  min-height: 62px; gap: .7rem;
  font-family: var(--font-display); font-weight: var(--fw-black); text-transform: uppercase; letter-spacing: .03em; line-height: 1;
}
.btn-lg .bi { font-size: 1.25em; }
.btn-lg.tel-icone { padding-left: .9rem; }
.btn-whatsapp { box-shadow: 0 10px 24px rgba(var(--shadow-rgb), .18); }
.btn-ligar {
  --bs-btn-color: var(--text-on-brand); --bs-btn-border-color: var(--accent); --bs-btn-bg: var(--accent);
  --bs-btn-hover-bg: var(--accent-hover); --bs-btn-hover-border-color: var(--accent-hover); --bs-btn-hover-color: var(--text-on-brand);
  --bs-btn-active-bg: var(--accent-hover); --bs-btn-active-border-color: var(--accent-hover); --bs-btn-active-color: var(--text-on-brand);
  box-shadow: var(--shadow-brand);
}
.btn.tel-icone:not(.btn-lg) { padding-left: .45rem; }
.btn.tel-icone:not(.btn-lg)::before { width: 1.75rem; height: 1.75rem; font-size: .85rem; }
@media (hover: hover) {
  .btn-ligar:hover { transform: translateY(-2px); }
}
.link-whats {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--font-display); font-weight: var(--fw-black); text-transform: uppercase;
  font-size: 1.375rem; line-height: 1; letter-spacing: .03em;
  text-decoration: underline; text-decoration-thickness: 2px;
  text-underline-offset: .25em; text-decoration-color: var(--border-strong);
  transition: text-decoration-color var(--dur-fast) var(--ease-out);
}
#conteudo a.link-whats { color: var(--text-strong); }
.link-whats .bi { color: var(--whatsapp); font-size: 1.1em; }
.link-whats:hover { text-decoration-color: var(--whatsapp); }

/* ---------- MENU (sempre asfalto) ---------- */
.site-nav { border-bottom: 1px solid var(--nav-border); }
.site-nav.is-scrolled { box-shadow: 0 8px 24px rgba(var(--shadow-rgb), .35); }
.site-nav .navbar-brand { padding-block: .5rem; margin-right: 1.25rem; }
.site-nav .navbar-brand img { height: 30px; width: auto; }
.nav-plantao { display: inline-flex; align-items: center; gap: .6rem; color: var(--text-on-inverse); }
.site-nav .nav-link {
  color: var(--text-on-inverse-muted); font-weight: var(--fw-bold); padding-inline: .9rem;
  font-size: var(--fs-label); text-transform: uppercase; letter-spacing: .08em;
}
.site-nav .nav-link:hover, .site-nav .nav-link:focus-visible { color: var(--text-on-inverse); }
.site-nav .nav-link.active, .site-nav .nav-link[aria-current="page"] { color: var(--text-on-inverse); background: transparent; }
.site-nav .navbar-toggler-icon { filter: invert(1); }
.nav-acoes { display: flex; gap: .6rem; align-items: center; }
.nav-acoes .btn { --bs-btn-padding-y: .55rem; --bs-btn-padding-x: 1.1rem; min-height: 46px; box-shadow: none; }
.nav-rapido { align-items: center; gap: .35rem; }
.nav-rapido__ligar {
  width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--accent); color: var(--text-on-brand); font-size: 1.1rem;
}
:where(.nav-rapido__ligar:visited), .nav-rapido__ligar:hover { color: var(--text-on-brand); }
@media (max-width: 991.98px) {
  .site-nav .navbar-collapse { padding-bottom: 1.25rem; border-top: 1px solid var(--nav-border); margin-top: .5rem; }
  .site-nav .navbar-nav { padding-top: .75rem; }
  .site-nav .nav-link { padding: .8rem 0; font-size: 1.0625rem; }
  .nav-acoes { flex-direction: column; align-items: stretch; }
  .nav-acoes .btn { --bs-btn-padding-y: .9rem; }
}
@media (max-width: 400px) { .site-nav .navbar-brand img { height: 26px; } }

/* ---------- HERO ---------- */
.hero {
  position: relative; overflow: clip;
  background: var(--bg-inverse); color: var(--text-on-inverse-muted);
  padding-top: calc(var(--nav-height) + clamp(1.75rem, 1rem + 3vw, 3.5rem));
  text-align: center;
}
/* Faixa seccionada no eixo da página: a estrada que desce do selo */
.hero__estrada {
  position: absolute; top: 0; bottom: 0; left: 50%; width: var(--sig-faixa-espessura); margin-left: calc(var(--sig-faixa-espessura) / -2);
  background: repeating-linear-gradient(to bottom, var(--road-line) 0 var(--sig-faixa-traco), transparent var(--sig-faixa-traco) calc(var(--sig-faixa-traco) + var(--sig-faixa-vao)));
  background-size: 100% calc(var(--sig-faixa-traco) + var(--sig-faixa-vao));
  animation: estrada 1.1s linear infinite;
  -webkit-mask-image: linear-gradient(to bottom, var(--text-strong) 0 38%, transparent 44% 91%, var(--text-strong) 96%);
  mask-image: linear-gradient(to bottom, var(--text-strong) 0 38%, transparent 44% 91%, var(--text-strong) 96%);
}
.hero__estrada::before, .hero__estrada::after { /* acostamentos */
  content: ""; position: absolute; top: 0; bottom: 0; width: 1px; background: var(--border-on-inverse);
}
.hero__estrada::before { left: min(-38vw, -460px); }
.hero__estrada::after { right: min(-38vw, -460px); }
@keyframes estrada { to { background-position: 0 calc(var(--sig-faixa-traco) + var(--sig-faixa-vao)); } }
.hero__conteudo { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }
.selo--hero { width: clamp(168px, 11rem + 7vw, 300px); margin: clamp(.75rem, .5rem + 1vw, 1.5rem) auto clamp(1.75rem, 1rem + 2vw, 2.75rem); }
.hero__titulo {
  font-size: var(--fs-display); line-height: var(--lh-tight); color: var(--text-on-inverse);
  max-width: 11.5em; margin: 0 auto 1.25rem;
}
.hero__titulo em { font-style: normal; color: var(--signal); }
.hero__lead { font-size: var(--fs-lead); line-height: 1.55; max-width: 36em; margin: 0 auto 2rem; }
.hero__acoes { display: flex; flex-wrap: wrap; justify-content: center; gap: .85rem; }
.hero__provas {
  display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 1.5rem;
  margin: 1.75rem 0 0; color: var(--text-on-inverse);
}
.hero__provas li { display: inline-flex; align-items: center; gap: .6rem; }
.hero__provas li::before { content: ""; width: 7px; height: 7px; background: var(--signal); }
.hero__faixa {
  position: relative; z-index: 1; margin-top: clamp(2.75rem, 2rem + 3vw, 4.5rem);
  background: var(--bg-brand); color: var(--text-on-brand);
  -webkit-mask-image: none; mask-image: none;
}
.hero__faixa .marquee__trilho { animation-duration: 38s; }
.hero__faixa .marquee__trilho > li {
  font-family: var(--font-display); font-weight: var(--fw-black); text-transform: uppercase;
  font-size: clamp(1.25rem, 1.1rem + .6vw, 1.625rem); line-height: 1; letter-spacing: .03em;
  padding: 1rem 0; gap: 1.75rem; padding-right: 1.75rem;
}
.hero__faixa .marquee__trilho > li::after { content: ""; width: 9px; height: 9px; background: var(--text-on-brand); transform: rotate(45deg); }
@media (max-width: 575.98px) {
  .hero__lead { font-size: var(--fs-body); margin-bottom: 1.5rem; }
  .hero__acoes { flex-direction: column; align-self: stretch; }
  .hero__acoes .btn { width: 100%; }
  .hero__provas { gap: .5rem 1rem; }
  .hero__estrada::before, .hero__estrada::after { display: none; }
}

/* ---------- SERVIÇOS ---------- */
.servicos .cabeca { margin-bottom: clamp(2.5rem, 2rem + 2vw, 3.75rem); }
.servicos .cabeca .section-title { margin-bottom: 0; }
.servico-destaque {
  height: 100%; display: flex; flex-direction: column;
  background: var(--bg-inverse); color: var(--text-on-inverse-muted);
  border-radius: var(--radius-md); overflow: hidden;
}
.servico-destaque__midia { position: relative; aspect-ratio: 4 / 3; overflow: hidden; }
.servico-destaque__midia img { transition: transform 1s var(--ease-out); }
@media (hover: hover) { .servico-destaque:hover .servico-destaque__midia img { transform: scale(1.03); } }
.servico-destaque__texto { padding: clamp(1.5rem, 1rem + 1.5vw, 2.25rem); }
.servico-destaque__texto h3 { color: var(--text-on-inverse); margin-bottom: .75rem; }
.servico-destaque__texto p { max-width: 36em; }
#conteudo .servico-destaque a.link-whats { color: var(--text-on-inverse); text-decoration-color: var(--border-on-inverse); }
.servicos-lista { margin: 0; border-bottom: 2px dashed var(--road-line-light); }
.servicos-lista > li { padding: 1.5rem 0; border-top: 2px dashed var(--road-line-light); }
.servicos-lista > li:first-child { padding-top: 0; border-top: 0; }
.servicos-lista h3 { margin-bottom: .5rem; }
.servicos-lista p { margin-bottom: .75rem; }
.servico-faixa {
  display: grid; grid-template-columns: 1fr; margin-top: clamp(2.5rem, 2rem + 2vw, 3.5rem);
  background: var(--bg-page); border-radius: var(--radius-md); overflow: hidden;
}
.servico-faixa__midia { aspect-ratio: 3 / 2; }
.servico-faixa__texto { padding: clamp(1.5rem, 1rem + 2vw, 3rem); align-self: center; }
.servico-faixa__texto h3 { font-size: var(--fs-h3); margin-bottom: .75rem; }
.servico-faixa__texto p { max-width: 38em; }
@media (min-width: 992px) {
  .servico-faixa { grid-template-columns: 5fr 7fr; }
  .servico-faixa__midia { aspect-ratio: auto; min-height: 100%; }
}

/* ---------- COMO PEDIR ---------- */
.como-pedir .section-head { max-width: 50rem; }
.passos {
  position: relative; display: grid; gap: 2rem; margin: 0;
  grid-template-columns: 1fr;
}
/* faixa seccionada ligando os passos */
.passos::before {
  content: ""; position: absolute; left: 27px; top: 28px; bottom: 28px; width: var(--sig-faixa-espessura);
  background: repeating-linear-gradient(to bottom, var(--border-strong) 0 var(--sig-faixa-traco), transparent var(--sig-faixa-traco) calc(var(--sig-faixa-traco) + var(--sig-faixa-vao)));
}
.passo { position: relative; padding-left: 5rem; }
.passo__n {
  position: absolute; left: 0; top: 0; width: 56px; height: 56px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--bg-inverse); color: var(--text-on-inverse); border-radius: var(--radius-sm);
  font-family: var(--font-display); font-weight: var(--fw-black); font-size: 2rem; line-height: 1;
}
.passo:last-child .passo__n { background: var(--accent); }
.passo h3 { margin: .65rem 0 .6rem; }
.passo p { margin: 0; max-width: 30em; }
.como-pedir__acoes { display: flex; flex-wrap: wrap; gap: .85rem; margin-top: clamp(2.5rem, 2rem + 2vw, 3.5rem); }
@media (min-width: 992px) {
  .passos { grid-template-columns: repeat(3, 1fr); gap: 2.5rem; }
  .passos::before {
    left: 56px; right: 0; top: 27px; bottom: auto; width: auto; height: var(--sig-faixa-espessura);
    background: repeating-linear-gradient(to right, var(--border-strong) 0 var(--sig-faixa-traco), transparent var(--sig-faixa-traco) calc(var(--sig-faixa-traco) + var(--sig-faixa-vao)));
  }
  .passo { padding-left: 0; padding-top: 5.25rem; }
  .passo h3 { margin-top: 0; }
}
@media (max-width: 575.98px) { .como-pedir__acoes .btn { width: 100%; } }

/* ---------- SOBRE ---------- */
.sobre__foto { position: relative; margin: 0; aspect-ratio: 6 / 5; border-radius: var(--radius-md); overflow: hidden; }
.sobre__cartao {
  position: absolute; left: 1rem; bottom: 1rem; z-index: 2;
  display: inline-flex; align-items: center; gap: .7rem; max-width: calc(100% - 2rem);
  padding: .8rem 1rem; background: var(--bg-inverse); color: var(--text-on-inverse); border-radius: var(--radius-sm);
}
.fatos { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; margin: 2rem 0 0; border-top: 2px dashed var(--road-line-light); }
.fatos > div { padding: 1rem 0; border-bottom: 2px dashed var(--road-line-light); }
.fatos dt { color: var(--text-muted); margin-bottom: .3rem; }
.fatos dd { margin: 0; color: var(--text-strong); font-weight: var(--fw-bold); }
.fatos > div:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (max-width: 400px) { .fatos { grid-template-columns: 1fr; } }

/* ---------- DIFERENCIAIS (quebra de ritmo: asfalto + lema numa linha, itens em grade) ---------- */
.diferenciais { padding-block: clamp(3.5rem, 2.5rem + 3vw, 5rem); }
.diferenciais__topo { margin-bottom: clamp(2rem, 1.5rem + 1.5vw, 2.75rem); }
.diferenciais__lema {
  font-size: clamp(2.5rem, 1rem + 4.1vw, 4.625rem); line-height: .92; color: var(--text-on-inverse);
  margin-bottom: 1rem; overflow-wrap: normal; hyphens: none;
}
.diferenciais__lema em { font-style: normal; color: var(--signal); }
.diferenciais__apoio { font-size: var(--fs-lead); max-width: 40em; margin: 0; }
.diferenciais__lista { display: grid; grid-template-columns: 1fr; gap: 0 2rem; margin: 0; }
.diferenciais__lista > li { border-top: 1px dashed var(--border-on-inverse); padding-block: 1.25rem; }
.diferenciais__lista h3 { color: var(--text-on-inverse); font-size: clamp(1.5rem, 1.35rem + .5vw, 1.75rem); margin-bottom: .45rem; }
.diferenciais__lista p { color: var(--text-on-inverse-muted); margin: 0; }
@media (min-width: 768px) { .diferenciais__lista { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) { .diferenciais__lista { grid-template-columns: repeat(3, 1fr); } }

/* ---------- ÁREAS ATENDIDAS (mapa) ---------- */
.cabeca-areas { margin-bottom: 2rem; }
.areas__subtitulo { color: var(--text-strong); margin: 2rem 0 1rem; }
.cidades {
  columns: 2; column-gap: 1.25rem; margin: 0;
  font-family: var(--font-display); font-weight: var(--fw-black); text-transform: uppercase;
  font-size: clamp(1.125rem, 1.05rem + .3vw, 1.3125rem); line-height: 1.05; letter-spacing: .02em;
}
.cidades li {
  break-inside: avoid; padding: .35rem 0 .35rem 1rem; position: relative; color: var(--text-strong);
  transition: color var(--dur-fast) var(--ease-out);
}
.cidades li::before {
  content: ""; position: absolute; left: 0; top: .72em; width: 6px; height: 6px; border-radius: 50%; background: var(--text-muted);
}
.cidades li:is([data-cidade="euclides-da-cunha"], [data-cidade="monte-santo"]) { color: var(--accent-text); }
.cidades li:is([data-cidade="euclides-da-cunha"], [data-cidade="monte-santo"])::before { background: var(--signal); width: 8px; height: 8px; left: -1px; }
.cidades small {
  font-family: var(--font-body); font-weight: var(--fw-bold); font-size: .6875rem; letter-spacing: .12em;
  color: var(--text-on-brand); background: var(--accent); padding: .15rem .35rem .1rem; border-radius: var(--radius-xs);
  vertical-align: .2em; margin-left: .2rem;
}
.cidades li.is-ativa { color: var(--accent-text); }
.cidades li.is-ativa::before { background: var(--signal); }
@media (min-width: 576px) { .cidades { columns: 3; } }

.rodovias { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; }
.placa {
  display: inline-flex; flex-direction: column; align-items: center; min-width: 58px;
  padding: .35rem .55rem .5rem; background: var(--sign-bg); color: var(--sign-fg);
  border: 2px solid var(--sign-fg); border-radius: var(--radius-sm);
  font-family: var(--font-display); font-weight: var(--fw-black); font-size: 1.5rem; line-height: .95;
}
.placa span { font-family: var(--font-body); font-weight: var(--fw-bold); font-size: var(--fs-label); letter-spacing: .08em; line-height: 1.2; }
.placa--br { border-radius: var(--radius-sm) var(--radius-sm) 50% 50% / var(--radius-sm) var(--radius-sm) 28% 28%; padding-bottom: .7rem; }
.areas__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 2.25rem; }
#conteudo a.link-mapa { color: var(--text-strong); font-weight: var(--fw-bold); text-underline-offset: .3em; }
.link-mapa .bi { color: var(--signal); }

.mapa {
  position: relative; margin: 0; overflow: hidden;
  background: var(--map-sea); border: 1px solid var(--border-subtle); border-radius: var(--radius-md);
}
@media (min-width: 992px) { .mapa { position: sticky; top: calc(var(--nav-height) + 1.5rem); } }
.mapa__svg { display: block; width: 100%; height: auto; }
.mapa__mar { fill: var(--map-sea); }
.mapa__bahia { fill: var(--map-land); stroke: var(--map-border); stroke-width: 1.2; stroke-linejoin: round; }
.mapa__vizinho { fill: var(--map-land-around); stroke: var(--map-border); stroke-width: 1; stroke-linejoin: round; }
.mapa__nomes text {
  font-family: var(--font-body); font-weight: var(--fw-bold); font-size: 13px; letter-spacing: .16em;
  text-transform: uppercase; fill: var(--text-muted);
}
.mapa__rotas line {
  stroke: var(--signal); stroke-width: 1.4; stroke-dasharray: 5 5; stroke-linecap: round; opacity: .5;
}
.mapa__cidade circle { fill: var(--text-strong); stroke: var(--map-land); stroke-width: 2; transform-box: fill-box; transform-origin: center; transition: transform var(--dur) var(--ease-out), fill var(--dur-fast); }
.mapa__cidade text, .mapa__sede text {
  font-family: var(--font-body); font-weight: var(--fw-bold); font-size: 13px; fill: var(--text-strong);
  paint-order: stroke; stroke: var(--map-land); stroke-width: 4px; stroke-linejoin: round;
}
.mapa__cidade.is-ativa circle { fill: var(--signal); transform: scale(1.7); }
.mapa__sede text.mapa__sede-nome { font-family: var(--font-display); font-weight: var(--fw-black); font-size: 20px; text-transform: uppercase; }
.mapa__sede text.mapa__sede-nome--filial { font-size: 16px; }
.mapa__sede text.mapa__sede-rotulo { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; fill: var(--accent-text); }
.mapa__pulso { fill: rgba(var(--signal-rgb), .22); stroke: var(--signal); stroke-width: 1.5; transform-box: fill-box; transform-origin: center; animation: pulso var(--sig-pulso-dur) var(--ease-out) infinite; }
.mapa__pulso--2 { animation-delay: calc(var(--sig-pulso-dur) / 2); }
.mapa__mini {
  position: absolute; left: .85rem; bottom: 3.75rem; width: 92px; height: auto;
  padding: .4rem; background: var(--bg-page); border: 1px solid var(--border-subtle); border-radius: var(--radius-sm);
}
.mapa__mini path { fill: var(--map-land-around); stroke: var(--map-border); stroke-width: 1; }
.mapa__mini rect { fill: rgba(var(--signal-rgb), .14); stroke: var(--signal); stroke-width: 1.5; }
.mapa__legenda {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem;
  padding: .85rem 1rem; background: var(--bg-page); border-top: 1px solid var(--border-subtle);
  font-size: var(--fs-small); color: var(--text-muted);
}
.mapa__legenda span { display: inline-block; vertical-align: middle; }
.mapa__legenda-sede { width: 12px; height: 12px; border-radius: 50%; background: var(--signal); }
.mapa__legenda-cidade { width: 8px; height: 8px; border-radius: 50%; background: var(--text-strong); margin-left: .4rem; }
.mapa__legenda-rota { width: 22px; height: 0; border-top: 2px dashed var(--signal); margin-left: .4rem; }
/* Entrada: rotas e cidades acendem em cascata a partir da sede (site.js marca .is-visivel) */
html.js [data-mapa] .mapa__rotas line { opacity: 0; stroke-dashoffset: 30; transition: opacity .5s var(--ease-out), stroke-dashoffset 1.2s var(--ease-out); transition-delay: calc(var(--i) * 35ms); }
html.js [data-mapa] .mapa__cidade { opacity: 0; transition: opacity .4s var(--ease-out); transition-delay: calc(200ms + var(--i) * 35ms); }
html.js [data-mapa].is-visivel .mapa__rotas line { opacity: .5; stroke-dashoffset: 0; }
html.js [data-mapa].is-visivel .mapa__cidade { opacity: 1; }
@media (max-width: 575.98px) {
  .mapa__mini { width: 70px; bottom: 4.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  html.js [data-mapa] .mapa__rotas line { opacity: .5; stroke-dashoffset: 0; transition: none; }
  html.js [data-mapa] .mapa__cidade { opacity: 1; transition: none; }
}

/* ---------- DEPOIMENTOS (loop do módulo) ---------- */
.depoimentos__grade { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
.depoimento {
  gap: 1.5rem; box-shadow: none; border-radius: var(--radius-md);
  padding: clamp(1.5rem, 1.2rem + 1vw, 2rem);
}
.depoimento blockquote p { font-size: var(--fs-body); line-height: 1.55; }
.depoimento blockquote p::before, .depoimento blockquote p::after { color: var(--accent-text); font-weight: var(--fw-bold); }
.depoimento__autor { gap: .85rem; flex-wrap: wrap; }
.depoimento__autor strong { font-size: var(--fs-body); }
/* Avatar igual para todos (ícone de pessoa), redondo, uma cor por depoimento */
.depoimento__avatar {
  width: 48px; height: 48px; flex: none; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; color: var(--text-on-brand); font-size: 1.35rem; background: var(--avatar-1);
}
.depoimento__avatar--2 { background: var(--avatar-2); }
.depoimento__avatar--3 { background: var(--avatar-3); }
.depoimento__avatar--4 { background: var(--avatar-4); }
/* Ícone centralizado em botão redondo: o glifo vira um quadrado de 1em (sem a linha herdada do texto) */
.depoimento__avatar .bi, .social-btn .bi, .fab-whatsapp .bi, .nav-rapido__ligar .bi {
  display: block; width: 1em; height: 1em; line-height: 1;
}
.depoimento__avatar .bi::before, .social-btn .bi::before, .fab-whatsapp .bi::before, .nav-rapido__ligar .bi::before {
  display: block; vertical-align: 0; line-height: 1;
}
.depoimento__nota { display: inline-flex; align-items: center; gap: .5rem; }
.icone-google { width: 20px; height: 20px; flex: none; }
.google-selo {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: .6rem .75rem; margin: .25rem 0 0;
  padding: .6rem 1rem; background: var(--bg-soft); border: 1px solid var(--border-subtle); border-radius: var(--radius-pill);
  color: var(--text-strong);
}
.google-selo .icone-google { width: 24px; height: 24px; }
.depoimento--grande { background: var(--bg-inverse); border-color: var(--bg-inverse); justify-content: space-between; }
.depoimento--grande blockquote p {
  font-family: var(--font-display); font-weight: var(--fw-black); text-transform: uppercase;
  font-size: clamp(2.125rem, 1.4rem + 2.6vw, 3.625rem); line-height: .95; color: var(--text-on-inverse);
}
.depoimento--grande blockquote p::before, .depoimento--grande blockquote p::after { color: var(--signal); font-weight: var(--fw-black); }
.depoimento--grande .depoimento__autor strong { color: var(--text-on-inverse); }
.depoimento--grande .depoimento__autor small { color: var(--text-on-inverse-muted); }
@media (min-width: 768px) { .depoimentos__grade { grid-template-columns: 1fr 1fr; } .depoimento--grande { grid-column: 1 / -1; } }
@media (min-width: 992px) {
  .depoimentos__grade { grid-template-columns: 1.35fr 1fr; }
  .depoimento--grande { grid-column: 1; grid-row: 1 / span 3; padding: clamp(2rem, 1.5rem + 2vw, 3.25rem); }
}

/* ---------- DÚVIDAS (FAQ com fios e sinal de mais) ---------- */
@media (min-width: 992px) { .duvidas__lateral { position: sticky; top: calc(var(--nav-height) + 2rem); } }
.duvidas__lateral p { max-width: 24em; margin-bottom: 1.5rem; }
.faq { border-top: 2px solid var(--text-strong); }
.faq .accordion-item {
  background: transparent; border: 0; border-bottom: 2px dashed var(--road-line-light);
  border-radius: 0; margin: 0;
}
.faq .accordion-item:has(.accordion-button:not(.collapsed)) { border-color: var(--road-line-light); box-shadow: none; }
.faq .accordion-button {
  font-family: var(--font-body); text-transform: none; letter-spacing: 0;
  font-size: var(--fs-body); font-weight: var(--fw-bold); padding: 1.35rem 0; line-height: 1.4;
}
.faq .accordion-button::after {
  content: "\f64d"; font-family: "bootstrap-icons"; background-image: none;
  width: 2rem; height: 2rem; display: inline-flex; align-items: center; justify-content: center; flex: none;
  font-size: 1.1rem; color: var(--accent-text); transition: transform var(--dur) var(--ease-out);
}
.faq .accordion-button:not(.collapsed)::after { background-image: none; transform: rotate(45deg); }
.faq .accordion-button:not(.collapsed) { color: var(--accent-text); }
.faq .accordion-body { padding: 0 2.5rem 1.5rem 0; }
.faq .accordion-body p { margin: 0; max-width: 46em; }

/* ---------- PLANTÃO AGORA (CTA de urgência: vermelho de ponta a ponta) ---------- */
.plantao { background: var(--bg-brand); color: var(--text-on-brand); overflow: clip; }
.plantao__grade { display: grid; gap: 2.5rem; justify-items: center; text-align: center; }
/* Ícone de ligação que "toca": círculo branco com o telefone, anéis pulsando (é um link tel:) */
.chamada {
  position: relative; display: grid; place-items: center; flex: none;
  width: clamp(150px, 8rem + 5vw, 220px); aspect-ratio: 1; border-radius: 50%; text-decoration: none;
}
.chamada__anel {
  position: absolute; inset: 0; border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, .85); background: rgba(255, 255, 255, .1);
  animation: pulso var(--sig-pulso-dur) var(--ease-out) infinite;
}
.chamada__anel:nth-child(2) { animation-delay: calc(var(--sig-pulso-dur) / 3); }
.chamada__anel:nth-child(3) { animation-delay: calc(var(--sig-pulso-dur) / 3 * 2); }
.chamada__miolo {
  position: relative; z-index: 1; width: 100%; height: 100%; border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem;
  background: var(--text-on-brand); color: var(--accent);
  box-shadow: 0 18px 40px rgba(var(--shadow-rgb), .3);
}
.chamada__miolo .bi { font-size: clamp(3rem, 2.4rem + 2vw, 4.25rem); line-height: 1; animation: toque 2.4s var(--ease-out) infinite; transform-origin: 50% 60%; }
.chamada__miolo b { font-family: var(--font-display); font-weight: var(--fw-black); font-size: clamp(1.75rem, 1.5rem + 1vw, 2.375rem); line-height: 1; color: var(--text-strong); text-transform: uppercase; }
@keyframes toque {
  0%, 55%, 100% { transform: rotate(0); }
  60% { transform: rotate(-14deg); } 65% { transform: rotate(12deg); } 70% { transform: rotate(-10deg); }
  75% { transform: rotate(8deg); } 80% { transform: rotate(-4deg); } 85% { transform: rotate(0); }
}
@media (hover: hover) { .chamada:hover .chamada__miolo { transform: scale(1.04); } }
.chamada__miolo { transition: transform var(--dur) var(--ease-out); }
.plantao__status { display: inline-flex; align-items: center; gap: .7rem; margin: 0 0 1rem; }
.plantao__titulo { font-size: var(--fs-h1); line-height: var(--lh-tight); color: var(--text-on-brand); margin-bottom: 1.25rem; }
.plantao__lead { font-size: var(--fs-lead); line-height: 1.55; max-width: 32em; margin: 0 auto 2rem; color: var(--text-on-brand); }
.plantao__acoes { display: flex; flex-wrap: wrap; gap: .85rem; justify-content: center; }
/* Sobre o vermelho, o botão de ligar vira asfalto (mesmo formato do hero) */
.plantao .btn-ligar {
  --bs-btn-bg: var(--bg-inverse); --bs-btn-border-color: var(--bg-inverse);
  --bs-btn-hover-bg: var(--ink-hover); --bs-btn-hover-border-color: var(--ink-hover);
  --bs-btn-active-bg: var(--ink-hover); --bs-btn-active-border-color: var(--ink-hover);
  box-shadow: 0 12px 28px rgba(var(--shadow-rgb), .3);
}
.plantao .btn-whatsapp { box-shadow: 0 12px 28px rgba(var(--shadow-rgb), .3); }
@media (min-width: 992px) {
  .plantao__grade { grid-template-columns: auto 1fr; justify-items: start; text-align: left; gap: clamp(3rem, 2rem + 4vw, 6rem); align-items: center; }
  .chamada { margin-left: 2rem; }
  .plantao__lead { margin-left: 0; }
  .plantao__acoes { justify-content: flex-start; }
}
@media (max-width: 575.98px) { .plantao__acoes { flex-direction: column; align-self: stretch; } .plantao__acoes .btn { width: 100%; } }

/* ---------- RODAPÉ ---------- */
.site-footer { padding-bottom: 6rem; }
.site-footer .footer-logo img { height: 132px; width: 132px; }
.site-footer .footer-title { font-family: var(--font-body); letter-spacing: var(--tracking-label); line-height: 1.3; font-weight: var(--fw-bold); font-size: var(--fs-label); color: var(--text-on-inverse); margin-bottom: .9rem; }
.footer-frase { max-width: 26em; }
.footer-contato li { display: flex; gap: .65rem; align-items: baseline; }
.footer-contato a { display: inline-flex; gap: .65rem; align-items: baseline; }
.footer-contato .bi { color: var(--accent-on-inverse); flex: none; }
.site-footer .footer-contato__destaque { color: var(--text-on-inverse); font-weight: var(--fw-bold); }
.footer-links--linha { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; }
.site-footer .footer-links--linha li + li { margin-top: 0; }
.footer-cidades { font-size: var(--fs-small); line-height: 1.85; margin-bottom: 1.75rem; }
.site-footer .social-btn { width: 46px; height: 46px; border-radius: 50%; font-size: 1.2rem; line-height: 1; }

/* ---------- WHATSAPP FLUTUANTE (pulsa como o selo, com "mensagem nova") ---------- */
.fab-whatsapp::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%; z-index: -1;
  background: var(--whatsapp); animation: pulso var(--sig-pulso-dur) var(--ease-out) infinite;
}
.fab-whatsapp, .fab-whatsapp:hover, .fab-whatsapp:focus-visible { text-decoration: none; }
.fab-whatsapp__badge {
  position: absolute; top: -2px; right: -2px; width: 19px; height: 19px;
  display: grid; place-items: center; box-sizing: border-box;
  border-radius: 50%; background: var(--signal); color: var(--text-on-brand);
  border: 2px solid var(--text-on-brand);
  font-family: var(--font-body); font-weight: var(--fw-bold); font-size: 10px; line-height: 1; letter-spacing: 0;
  padding-top: 1px; /* a Overpass desenha os números um pouco acima do centro da caixa */
  animation: badge-chega .5s var(--ease-out) 1.2s both;
}
.fab-whatsapp__balao {
  position: absolute; right: calc(100% + 14px); top: 50%; transform: translateY(-50%);
  white-space: nowrap; padding: .6rem .9rem; border-radius: var(--radius-md) var(--radius-md) 0 var(--radius-md);
  background: var(--bg-page); color: var(--text-strong); box-shadow: var(--shadow-md);
  font-family: var(--font-body); font-weight: var(--fw-bold); font-size: var(--fs-small); line-height: 1.2;
  animation: balao-chega .5s var(--ease-out) 2s both;
}
@keyframes badge-chega { from { transform: scale(0); } to { transform: scale(1); } }
@keyframes balao-chega { from { opacity: 0; transform: translate(10px, -50%); } to { opacity: 1; transform: translate(0, -50%); } }
@media (max-width: 575.98px) { .fab-whatsapp__balao { display: none; } }

/* ---------- MOVIMENTO REDUZIDO ---------- */
@media (prefers-reduced-motion: reduce) {
  .selo__anel, .ponto-vivo::after, .hero__estrada, .mapa__pulso, .fab-whatsapp::before, .chamada__miolo .bi { animation: none; }
  .chamada__anel { animation: none; transform: scale(1.15); opacity: .4; }
  .fab-whatsapp__badge, .fab-whatsapp__balao { animation-duration: 0s; animation-delay: 0s; }
  .selo__anel { transform: scale(1.12); opacity: .5; }
  .selo__anel:nth-child(2) { transform: scale(1.28); opacity: .3; }
  .selo__anel:nth-child(3) { transform: scale(1.44); opacity: .15; }
  .fab-whatsapp::before { display: none; }
}