/* ============================================================
   IBR — texturas e brilhos extras (o motion roda em wow.js, em WAAPI). O hero não leva efeito sobre o texto.
   ATENÇÃO: nenhum efeito perceptível aqui usa transition de propósito: o Windows do
   usuário encurta transition. Estados iniciais ficam no CSS, a animação fica no JS.
   ============================================================ */

/* ---------- papel pautado: o contrato como textura das seções claras ---------- */
.stats-sec, .serv, .metodo, .contato { position: relative; isolation: isolate;
  background-image:
    radial-gradient(900px 520px at 100% 0%, rgba(215, 179, 73, .17), transparent 62%),
    radial-gradient(760px 520px at 0% 100%, rgba(0, 40, 100, .08), transparent 62%),
    repeating-linear-gradient(to bottom, transparent 0 35px, rgba(0, 26, 66, .05) 35px 36px); }
.metodo::before, .serv::before { content: ''; position: absolute; z-index: -1; width: min(520px, 46vw); aspect-ratio: 1; background: url(img/logo.webp) center / contain no-repeat; opacity: .06; pointer-events: none; }
.serv::before { left: -8%; top: 8%; }
.metodo::before { right: -9%; bottom: 4%; }

/* ---------- brilho dourado nos cartões, seguindo o cursor ---------- */
.glow { position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; z-index: 2;
  background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 50%), rgba(243, 214, 128, .22), transparent 62%); }
.tcard .glow, .pcard .glow { background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 50%), rgba(215, 179, 73, .2), transparent 62%); }
.stat, .pcard, .tcard, .mcard { position: relative; }
.mcard { position: sticky; }
@media (max-width: 900px) { .mcard { position: relative; } }

/* ---------- fotos de serviço: a varredura da auditoria cruza a foto ---------- */
.srow__media { position: relative; }
.srow__scan { position: absolute; top: 0; bottom: 0; left: 0; width: 22%; pointer-events: none; opacity: 0; z-index: 2;
  background: linear-gradient(90deg, rgba(243, 214, 128, 0), rgba(243, 214, 128, .35)); border-right: 2px solid #f3d680; box-shadow: 8px 0 30px rgba(243, 214, 128, .6); }

/* ---------- bloco final: respiro e fundo contínuo com o FAQ ---------- */
.final { padding: clamp(64px, 8vw, 110px) var(--gut) clamp(64px, 8vw, 110px); background: linear-gradient(180deg, #00112c, #001a42 45%); }
.final p { margin-bottom: 36px; }

/* ---------- hero: véu marinho atrás do texto (leitura primeiro); o dourado respira à direita e o carro fica intacto ---------- */
.hero__bg::after { content: ''; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 66% 40% at 20% 21%, rgba(0, 16, 42, .95) 0%, rgba(0, 22, 56, .82) 46%, rgba(0, 26, 66, 0) 100%),
    linear-gradient(180deg, rgba(0, 16, 42, .4), rgba(0, 16, 42, 0) 42%); }
@media (max-width: 900px) {
  .hero__bg::after { background: linear-gradient(180deg, rgba(0, 16, 42, .92) 0%, rgba(0, 20, 52, .8) 30%, rgba(0, 26, 66, 0) 52%); }
}