/* Camada visual complementar: superfícies leves, transparência e mapa regional. */
body { background: linear-gradient(135deg, #f1f4f8 0%, #e4e8ee 48%, #f3f5f8 100%); }
.header.scrolled { padding: 14px 0; background: rgba(12, 15, 32, .72); border-bottom: 1px solid rgba(236, 215, 176, .16); box-shadow: 0 10px 35px rgba(0, 0, 0, .22); backdrop-filter: blur(18px) saturate(135%); }
.button { border-radius: 15px; padding-inline: 20px; transition: transform .2s, background .2s, color .2s, box-shadow .2s; }
.button-gold { box-shadow: 0 8px 20px rgba(0, 0, 0, .16); }
.nav-contact { border-radius: 13px; background: rgba(255, 255, 255, .04); backdrop-filter: blur(8px); }
.hero-dossier { border-radius: 17px; background: linear-gradient(135deg, rgba(57, 65, 94, .71), rgba(10, 14, 38, .67)); border-color: rgba(181, 205, 241, .36); box-shadow: 0 19px 42px rgba(0, 0, 0, .31), inset 0 1px 0 rgba(255, 255, 255, .16); backdrop-filter: blur(14px) saturate(140%); }

.solution-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; border: 0; }
.solution { min-height: 258px; display: grid; grid-template-columns: 1fr 38px; grid-template-rows: auto 1fr auto; align-items: start; gap: 13px; padding: 25px; border: 1px solid rgba(89, 94, 109, .17); border-radius: 23px; background: linear-gradient(130deg, rgba(255, 255, 255, .72), rgba(255, 255, 255, .28)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7), 0 13px 26px rgba(32, 36, 47, .045); backdrop-filter: blur(12px); transition: transform .28s, background .28s, box-shadow .28s; }
.solution:hover { padding: 25px; background: rgba(255, 255, 255, .83); box-shadow: inset 0 1px 0 #fff, 0 18px 33px rgba(32, 36, 47, .11); transform: translateY(-6px); }
.solution-num { grid-column: 1; grid-row: 1; }
.solution-icon { grid-column: 1; grid-row: 2; align-self: center; }
.solution-title { grid-column: 1; grid-row: 3; }
.solution > p { display: none; }
.solution > a { grid-column: 2; grid-row: 1; align-self: start; }

.structure-visual { position: relative; height: 440px; overflow: hidden; border: 1px solid rgba(220, 194, 150, .28); border-radius: 30px; background: radial-gradient(circle at 71% 9%, #465073 0, rgba(70, 80, 115, .35) 13%, transparent 37%), linear-gradient(135deg, #111735, #1d264b); box-shadow: 22px 28px 0 #d5dae1, 0 17px 40px rgba(21, 25, 43, .16); }
.sp-map::before { content: ""; position: absolute; inset: 0; background: linear-gradient(125deg, rgba(255, 255, 255, .11), transparent 35%, rgba(255, 255, 255, .03) 62%, rgba(213, 166, 102, .11)); pointer-events: none; }
.map-glow { position: absolute; width: 300px; height: 300px; left: -102px; bottom: -139px; border-radius: 50%; background: rgba(224, 182, 112, .18); filter: blur(10px); }
.sp-state { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; padding: 15px; }
.state-silhouette { fill: url(#sp-fill); stroke: #b89767; stroke-width: 1.5; stroke-linejoin: round; }
.state-route { fill: none; stroke: rgba(235, 194, 127, .74); stroke-width: 1.2; stroke-dasharray: 3 4; }
.map-city .pulse { fill: rgba(231, 183, 106, .2); stroke: rgba(246, 217, 171, .6); stroke-width: 1; transform-box: fill-box; transform-origin: center; animation: map-pulse 2.9s ease-out infinite; }
.map-city .city-dot { fill: #f3bc6d; stroke: #fff4df; stroke-width: 1.2; }
.map-city text { fill: #edf0f4; font: 10px var(--sans); letter-spacing: .1px; paint-order: stroke; stroke: #1b2345; stroke-width: 3px; stroke-linejoin: round; }
.city-ribeirao .pulse { animation-delay: .4s; }.city-campinas .pulse { animation-delay: .7s; }.city-bauru .pulse { animation-delay: 1.1s; }.city-jundiai .pulse { animation-delay: 1.4s; }.city-capital .pulse { animation-delay: 1.8s; }.city-vale .pulse { animation-delay: 2s; }.city-sorocaba .pulse { animation-delay: 2.3s; }.city-santos .pulse { animation-delay: 2.6s; }
.map-glass-title { position: absolute; z-index: 2; top: 25px; left: 25px; min-width: 169px; padding: 13px 15px; border: 1px solid rgba(255, 255, 255, .22); border-radius: 17px; background: linear-gradient(130deg, rgba(236, 240, 245, .21), rgba(227, 231, 242, .07)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 10px 28px rgba(0, 0, 0, .14); backdrop-filter: blur(13px) saturate(140%); }
.map-glass-title span, .map-glass-card > span { display: block; color: #d8dde8; font: 8px var(--mono); letter-spacing: .8px; }
.map-glass-title strong { display: block; color: #fffaf0; font: 600 25px var(--serif); letter-spacing: -1px; margin: 5px 0 1px; }
.map-glass-title small { font-size: 9px; color: #d2d6df; }
.map-glass-card { position: absolute; z-index: 2; right: 21px; bottom: 22px; width: 175px; padding: 14px 15px; border: 1px solid rgba(192, 210, 237, .32); border-radius: 18px; background: linear-gradient(135deg, rgba(20, 27, 58, .74), rgba(40, 47, 76, .49)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 15px 29px rgba(0, 0, 0, .18); backdrop-filter: blur(16px) saturate(135%); }
.map-glass-card strong { display: block; color: #f7ca7e; font: 600 29px var(--serif); letter-spacing: -1px; margin: 5px 0; }
.map-glass-card strong small { font: 10px var(--sans); letter-spacing: 0; color: #e3e6ec; }
.map-glass-card p { margin: 0; color: #c4c8d3; font-size: 9px; line-height: 1.45; }
.map-glass-card i { display: block; height: 3px; margin-top: 11px; background: linear-gradient(90deg, #e5ad66 66%, rgba(255, 255, 255, .21) 66%); }
.map-legend { position: absolute; z-index: 2; left: 27px; bottom: 25px; color: #e3e6ed; font: 9px var(--mono); letter-spacing: .5px; text-transform: uppercase; }
.map-legend b { display: inline-block; width: 7px; height: 7px; margin-right: 9px; border-radius: 50%; background: #f3bc6d; box-shadow: 0 0 0 5px rgba(243, 188, 109, .15); vertical-align: middle; }

.proof { background: linear-gradient(135deg, rgba(255, 255, 255, .72), rgba(230, 235, 243, .65)); }
.contact-card { border: 1px solid rgba(231, 205, 163, .25); border-radius: 30px; background: radial-gradient(circle at 88% 15%, rgba(95, 107, 143, .35), transparent 29%), linear-gradient(135deg, #151b37, #101531); box-shadow: 0 22px 46px rgba(21, 25, 43, .15), inset 0 1px 0 rgba(255, 255, 255, .11); }
.contact-card::after { content: ""; position: absolute; width: 390px; height: 390px; right: -145px; bottom: -210px; border: 1px solid rgba(236, 205, 151, .16); border-radius: 50%; box-shadow: 0 0 0 38px rgba(236, 205, 151, .03), 0 0 0 77px rgba(236, 205, 151, .02); pointer-events: none; }
.contact-title { position: relative; z-index: 2; }

@keyframes map-pulse { 0% { opacity: .75; transform: scale(.65); } 70%, 100% { opacity: 0; transform: scale(2.55); } }

@media (max-width: 850px) { .solution-list { grid-template-columns: 1fr; }.solution { min-height: 178px; grid-template-columns: 1fr 38px; grid-template-rows: auto 1fr auto; padding: 22px; }.solution:hover { padding: 22px; transform: translateY(-3px); }.structure-visual { height: 370px; max-width: 570px; }.sp-state { padding: 8px; }.map-city text { font-size: 9px; }.map-glass-title { top: 18px; left: 18px; }.map-glass-card { right: 16px; bottom: 16px; }.map-legend { left: 20px; bottom: 20px; } }
@media (max-width: 480px) { .solution { min-height: 164px; padding: 20px; }.solution:hover { padding: 20px; }.structure-visual { height: 315px; border-radius: 23px; box-shadow: 14px 17px 0 #d5dae1; }.sp-state { width: 126%; margin-left: -13%; }.map-city text { font-size: 8px; }.map-glass-title { min-width: 137px; padding: 10px 12px; }.map-glass-title strong { font-size: 21px; }.map-glass-card { width: 144px; padding: 10px 12px; }.map-glass-card strong { font-size: 24px; }.map-glass-card p { font-size: 8px; }.map-legend { font-size: 8px; }.contact-card { border-radius: 24px; } }

/* ============================================================
   PASSE DE ARREDONDAMENTO — CTAs em pill, cards e campos mais macios
   ============================================================ */
.button { border-radius: 999px; }
.nav-contact { border-radius: 999px; }
.solution { border-radius: 30px; }
.solution-icon { border-radius: 14px; }
.icon-file { border-radius: 10px; }
.contact-card { border-radius: 36px; }
.contact input, .contact select { border-radius: 14px; }
.hero-dossier { border-radius: 22px; }
.structure-card { border-radius: 20px; }
.map-glass-title, .map-glass-card { border-radius: 22px; }
.solution-list { border: 0; }

@media (max-width: 480px) { .contact-card { border-radius: 28px; } }

/* ============================================================
   HERO — barra de confiança (trust strip) para tráfego pago
   ============================================================ */
.hero-trust { list-style: none; display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 28px 0 0; padding: 0; }
.hero-trust li { display: flex; align-items: center; gap: 8px; color: #d7dae0; font-size: 12px; font-weight: 600; letter-spacing: -.1px; }
.hero-trust li i { display: block; width: 15px; height: 15px; border-radius: 50%; background: rgba(215, 166, 103, .16); border: 1px solid var(--gold); position: relative; flex: none; }
.hero-trust li i::after { content: ""; position: absolute; left: 4px; top: 3px; width: 4px; height: 7px; border: solid var(--gold); border-width: 0 2px 2px 0; transform: rotate(40deg); }
@media (max-width: 480px) { .hero-trust { gap: 8px 16px; } .hero-trust li { font-size: 11px; } }

/* ============================================================
   INTRO / "QUEM SOMOS" — copy institucional + chips de credibilidade
   ============================================================ */
.intro-about { margin-top: 46px; padding-top: 40px; border-top: 1px solid var(--line); display: grid; grid-template-columns: 1.3fr 1fr; gap: 40px; align-items: start; }
.intro-about-text { margin: 0; color: var(--slate); font-size: 14px; line-height: 1.85; max-width: 560px; }
.stat-row { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 0; padding: 0; }
.stat-row li { padding: 18px 16px; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); text-align: center; }
.stat-row strong { display: block; font: 600 26px var(--serif); letter-spacing: -1px; color: var(--ink); }
.stat-row span { display: block; margin-top: 6px; font-size: 10px; line-height: 1.4; color: #7e8190; text-transform: uppercase; letter-spacing: .3px; }
@media (max-width: 850px) { .intro-about { grid-template-columns: 1fr; gap: 26px; } .stat-row { grid-template-columns: 1fr; } .stat-row li { display: flex; align-items: center; justify-content: space-between; text-align: left; padding: 14px 18px; } .stat-row span { margin-top: 0; max-width: 200px; } }

/* ============================================================
   DIFERENCIAIS — tabela comparativa (inspirada em landing pages de alta conversão)
   ============================================================ */
.differentials { background: #dce1e9; }
.diff-table { border: 1px solid var(--line); border-radius: 26px; overflow: hidden; background: var(--white); }
.diff-row { display: grid; grid-template-columns: 1fr 130px 150px; align-items: center; border-bottom: 1px solid var(--line); }
.diff-row:last-child { border-bottom: 0; }
.diff-row > span:first-child { padding: 17px 22px; font-size: 13px; color: var(--ink); font-weight: 600; }
.diff-row > span:not(:first-child) { display: grid; place-items: center; padding: 17px 8px; text-align: center; }
.diff-head { background: var(--night); }
.diff-head > span { color: #e3e8f0; font: 700 10px var(--mono); letter-spacing: .6px; text-transform: uppercase; padding: 16px 22px; }
.diff-head > span:not(:first-child) { text-align: center; padding: 16px 8px; }
.diff-row:not(.diff-head):nth-child(even) { background: rgba(220, 225, 233, .35); }
.diff-yes i, .diff-no i { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; position: relative; }
.diff-yes i { background: rgba(215, 166, 103, .16); border: 1px solid var(--gold); }
.diff-yes i::after { content: ""; width: 5px; height: 9px; border: solid var(--gold); border-width: 0 2px 2px 0; transform: rotate(40deg) translate(-1px, -1px); }
.diff-no i { background: rgba(99, 103, 123, .1); border: 1px solid rgba(99, 103, 123, .35); }
.diff-no i::after { content: "—"; color: #9094a0; font-size: 12px; font-weight: 700; }
.diff-cta { text-align: center; margin-top: 34px; }
@media (max-width: 700px) {
  .diff-row { grid-template-columns: 1fr 68px 68px; }
  .diff-row > span:first-child { padding: 14px; font-size: 12px; }
  .diff-head > span { font-size: 8px; padding: 12px 6px; }
  .diff-head > span:first-child { padding: 12px 14px; }
}

/* ============================================================
   FAQ — acordeão nativo (details/summary), acessível e indexável
   ============================================================ */
.faq { background: var(--white); }
.faq-grid { display: grid; grid-template-columns: .8fr 1.3fr; gap: 60px; align-items: start; }
.faq-copy h2 { font: 600 40px/1.05 var(--serif); letter-spacing: -1.9px; margin: 0; color: var(--ink); }
.faq-copy h2 em { font-style: italic; color: #575d70; }
.faq-copy > p:not(.kicker) { color: var(--slate); font-size: 13px; line-height: 1.75; margin: 20px 0 26px; max-width: 320px; }
.text-action-dark { color: var(--ink); border-bottom-color: var(--gold); }
.faq-list { display: flex; flex-direction: column; gap: 12px; }
.faq-item { border: 1px solid var(--line); border-radius: 20px; padding: 6px 22px; background: var(--paper); transition: border-color .2s, background .2s; }
.faq-item[open] { background: var(--white); border-color: rgba(215, 166, 103, .45); }
.faq-item summary { list-style: none; cursor: pointer; padding: 18px 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; font: 600 14px var(--sans); letter-spacing: -.1px; color: var(--ink); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary i { flex: none; position: relative; width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--gold); }
.faq-item summary i::before, .faq-item summary i::after { content: ""; position: absolute; background: var(--gold); left: 50%; top: 50%; transform: translate(-50%, -50%); transition: transform .25s; }
.faq-item summary i::before { width: 9px; height: 1.4px; }
.faq-item summary i::after { width: 1.4px; height: 9px; }
.faq-item[open] summary i::after { transform: translate(-50%, -50%) rotate(90deg) scale(0); }
.faq-item p { margin: 0 0 20px; color: var(--slate); font-size: 12.5px; line-height: 1.75; max-width: 560px; }
@media (max-width: 850px) { .faq-grid { grid-template-columns: 1fr; gap: 28px; } .faq-copy h2 { font-size: 33px; } }

/* ============================================================
   CONTATO — CTA secundário via WhatsApp
   ============================================================ */
.form-divider { grid-column: span 2; display: flex; align-items: center; gap: 12px; margin: 2px 0; color: #7e8393; font: 10px var(--mono); text-transform: uppercase; letter-spacing: .6px; }
.form-divider::before, .form-divider::after { content: ""; flex: 1; height: 1px; background: rgba(255, 255, 255, .15); }
.button-whatsapp { grid-column: span 2; background: #25d366; color: #08341e; box-shadow: 0 8px 20px rgba(0, 0, 0, .16); }
.button-whatsapp:hover { background: #2fe374; }
@media (max-width: 480px) { .form-divider, .button-whatsapp { grid-column: span 1; } }

/* ============================================================
   BOTÃO FLUTUANTE DE WHATSAPP
   ============================================================ */
.whatsapp-fab { position: fixed; z-index: 55; right: 20px; bottom: 20px; width: 58px; height: 58px; border-radius: 50%; background: #25d366; display: grid; place-items: center; box-shadow: 0 10px 26px rgba(0, 0, 0, .28); transition: transform .2s; }
.whatsapp-fab:hover { transform: translateY(-3px) scale(1.04); }
.whatsapp-fab svg { width: 30px; height: 30px; fill: #fff; position: relative; z-index: 1; }
.whatsapp-fab > .whatsapp-fab-pulse { position: absolute; inset: 0; border-radius: 50%; background: rgba(37, 211, 102, .55); animation: whatsapp-pulse 2.4s ease-out infinite; }
@keyframes whatsapp-pulse { 0% { opacity: .65; transform: scale(1); } 100% { opacity: 0; transform: scale(1.85); } }
@media (max-width: 480px) { .whatsapp-fab { right: 14px; bottom: 14px; width: 52px; height: 52px; } .whatsapp-fab svg { width: 26px; height: 26px; } }
@media (prefers-reduced-motion: reduce) { .whatsapp-fab > .whatsapp-fab-pulse { animation: none; } }

/* ============================================================
   TIPOGRAFIA — Inter no lugar de Manrope para leitura em tela
   (melhor legibilidade em corpo de texto pequeno) + reforço de
   tamanho/altura de linha nos blocos de leitura corrida. Os
   rótulos mono e eyebrows do "dossiê" ficam como estão de
   propósito — são parte da identidade, não texto de leitura.
   ============================================================ */
:root { --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; }

.intro-text { font-size: 15.5px; line-height: 1.75; }
.intro-about-text { font-size: 15.5px; line-height: 1.85; }
.heading-row > p { font-size: 14.5px; line-height: 1.75; }
.proof-points h3 { font-size: 14px; }
.proof-points p { font-size: 13.5px; line-height: 1.7; }
.method-copy > p:not(.kicker) { font-size: 15.5px; line-height: 1.8; }
.structure-copy > p:not(.kicker) { font-size: 15.5px; line-height: 1.78; }
.structure dt { font-size: 12.5px; }
.structure dd { font-size: 13.5px; line-height: 1.5; }
.contact-title > p:not(.kicker) { font-size: 13.5px; line-height: 1.7; }
.contact input, .contact select { font-size: 14px; }
.faq-copy > p:not(.kicker) { font-size: 14.5px; line-height: 1.75; }
.faq-item summary { font-size: 15.5px; }
.faq-item p { font-size: 14.5px; line-height: 1.75; }
.diff-row > span:first-child { font-size: 14px; line-height: 1.4; }
.stat-row span { font-size: 11px; }

/* ============================================================
   LIQUID GLASS — passe extra de vidro fosco flutuante em blocos
   que ainda estavam sólidos (FAQ e indicadores da seção "quem
   somos"), com resplandor sutil ao fundo para o blur refratar
   ============================================================ */
.intro { position: relative; overflow: hidden; }
.intro::before { content: ""; position: absolute; z-index: 0; width: 380px; height: 380px; right: -110px; top: -80px; border-radius: 50%; filter: blur(70px); background: rgba(207, 154, 74, .1); pointer-events: none; }
.intro-grid, .intro-about { position: relative; z-index: 1; }

.stat-row li { background: linear-gradient(150deg, rgba(255, 255, 255, .75), rgba(255, 255, 255, .35)); border: 1px solid rgba(255, 255, 255, .7); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), 0 10px 22px rgba(20, 26, 56, .05); backdrop-filter: blur(14px) saturate(150%); transition: transform .25s, box-shadow .25s; }
.stat-row li:hover { transform: translateY(-3px); box-shadow: inset 0 1px 0 #fff, 0 16px 28px rgba(20, 26, 56, .09); }

.faq { position: relative; overflow: hidden; }
.faq::before, .faq::after { content: ""; position: absolute; z-index: 0; border-radius: 50%; filter: blur(65px); pointer-events: none; }
.faq::before { width: 400px; height: 400px; left: -130px; top: 30px; background: rgba(207, 154, 74, .09); }
.faq::after { width: 420px; height: 420px; right: -140px; bottom: -90px; background: rgba(91, 99, 130, .09); }
.faq-grid { position: relative; z-index: 1; }
.faq-item { background: linear-gradient(150deg, rgba(255, 255, 255, .78), rgba(255, 255, 255, .42)); border-color: rgba(255, 255, 255, .8); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 10px 24px rgba(20, 26, 56, .05); backdrop-filter: blur(16px) saturate(160%); transition: border-color .2s, background .2s, transform .25s, box-shadow .25s; }
.faq-item:hover { transform: translateY(-2px); box-shadow: inset 0 1px 0 #fff, 0 16px 30px rgba(20, 26, 56, .09); }
.faq-item[open] { background: rgba(255, 255, 255, .88); }

@media (max-width: 480px) { .intro::before { width: 260px; height: 260px; } .faq::before, .faq::after { width: 260px; height: 260px; } }
@media (prefers-reduced-motion: reduce) { .stat-row li, .faq-item { transition: none; } }

/* ============================================================
   WHATSAPP — badge de notificação vermelho, como se tivesse
   chegado uma mensagem nova (pop de entrada + anel pulsante)
   Escopados sob .whatsapp-fab > ... de propósito: eleva a
   especificidade (0,2,0) pra vencer qualquer .whatsapp-badge
   solto que apareça em map.css/gallery.css/reviews.css,
   carregados depois deste arquivo no <head>.
   ============================================================ */
.whatsapp-fab > .whatsapp-badge-ring { position: absolute; z-index: 2; top: -4px; right: -4px; width: 22px; height: 22px; border-radius: 50%; background: rgba(229, 57, 53, .55); pointer-events: none; opacity: 0; animation: wa-badge-ring 2.4s ease-out 1.5s infinite; }
.whatsapp-fab > .whatsapp-badge { position: absolute; z-index: 3; top: -5px; right: -5px; min-width: 21px; height: 21px; padding: 0 4px; border-radius: 50%; background: #e53935; border: 2px solid #fff; color: #fff; font: 700 11px var(--sans); display: grid; place-items: center; box-shadow: 0 3px 10px rgba(229, 57, 53, .5); opacity: 0; transform: scale(.4); animation: wa-badge-in .5s cubic-bezier(.34, 1.56, .64, 1) 1s forwards; }
@keyframes wa-badge-in { to { opacity: 1; transform: scale(1); } }
@keyframes wa-badge-ring { 0% { opacity: .7; transform: scale(1); } 100% { opacity: 0; transform: scale(2.1); } }
@media (max-width: 480px) { .whatsapp-fab > .whatsapp-badge, .whatsapp-fab > .whatsapp-badge-ring { top: -3px; right: -3px; } }
@media (prefers-reduced-motion: reduce) { .whatsapp-fab > .whatsapp-badge { animation: none; opacity: 1; transform: scale(1); } .whatsapp-fab > .whatsapp-badge-ring { animation: none; opacity: 0; } }