/* ===== SOS Justiça — camada de animações =====
   Arquivo separado do style.css de propósito:
   se algo aqui não agradar, basta remover o <link> desta folha
   e o site volta ao comportamento estático, sem quebrar nada. */

/* --- Revelação ao rolar a página --- */
[data-rv]{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .65s cubic-bezier(.22,.7,.3,1), transform .65s cubic-bezier(.22,.7,.3,1);
  will-change:opacity, transform;
}
[data-rv="left"]{transform:translateX(-26px);}
[data-rv="right"]{transform:translateX(26px);}
[data-rv="zoom"]{transform:scale(.94);}
[data-rv].rv-in{opacity:1; transform:none;}

/* --- Barra de progresso de leitura no topo --- */
.read-bar{
  position:fixed; top:0; left:0; height:3px; width:0%;
  background:var(--gold-500); z-index:60;
  transition:width .08s linear; pointer-events:none;
}

/* --- Hero: entrada em cascata ao carregar --- */
@keyframes heroUp{from{opacity:0; transform:translateY(18px);} to{opacity:1; transform:translateY(0);}}
.hero .signal-dots,
.hero h1,
.hero .lede,
.hero .btn-row{opacity:0; animation:heroUp .7s cubic-bezier(.22,.7,.3,1) forwards;}
.hero h1{animation-delay:.10s;}
.hero .lede{animation-delay:.22s;}
.hero .btn-row{animation-delay:.34s;}

/* Arcos do hero: desenho progressivo em vez de simples fade */
@keyframes arcDraw{from{stroke-dashoffset:var(--dash);} to{stroke-dashoffset:0;}}
.hero-art .arc{
  stroke-dasharray:var(--dash); stroke-dashoffset:var(--dash);
  animation:arcDraw 1.1s cubic-bezier(.22,.7,.3,1) forwards;
}
.hero-art .arc:nth-child(1){--dash:100; animation-delay:.15s;}
.hero-art .arc:nth-child(2){--dash:100; animation-delay:.32s;}
.hero-art .arc:nth-child(3){--dash:100; animation-delay:.49s;}

/* --- Flutuação sutil e contínua dos arcos, depois da entrada --- */
@keyframes floaty{0%,100%{transform:translateY(0);} 50%{transform:translateY(-7px);}}
.hero-art svg{animation:floaty 6s ease-in-out 1.6s infinite;}

/* --- Microinterações --- */
.tool-card, .card, .channel-card, .quiz-cat{
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.tool-card:hover, .channel-card:hover, .quiz-cat:hover{
  transform:translateY(-4px);
  box-shadow:0 10px 26px rgba(15,46,61,.09);
}
.btn{transition:transform .14s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 8px 20px rgba(185,133,42,.32);}
.btn-outline:hover{transform:translateY(-2px);}
.nav-cta:hover{transform:translateY(-2px);}
.icon-feature .badge{transition:transform .25s cubic-bezier(.34,1.56,.64,1);}
.icon-feature:hover .badge{transform:scale(1.08) rotate(-4deg);}

/* Correção pedida: botão sólido, sem sublinhado, com contraste maior */
.btn, .nav-cta, .card-link, .tool-card, .quiz-cat, .channel-card{text-decoration:none;}
.btn-primary{background:var(--gold-500); color:var(--navy-900);}
.btn-primary:hover{background:var(--gold-600); color:var(--navy-900);}

/* --- Destaque da ferramenta principal --- */
.tool-card.featured{border:2px solid var(--gold-500); background:var(--white);}
.tool-card .hot-tag{
  align-self:flex-start; font-size:.72rem; font-weight:700; color:#FFFFFF;
  background:var(--navy-900); padding:3px 9px; border-radius:999px;
}

/* --- Números que sobem (contadores) --- */
.stat-row{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; text-align:center;}
@media (max-width:620px){ .stat-row{grid-template-columns:1fr; gap:24px;} }
.stat-row .num{font-family:var(--font-display); font-size:2rem; font-weight:700; color:var(--navy-900); line-height:1;}
.stat-row .lbl{font-size:.85rem; color:var(--ink-soft); margin-top:6px;}

/* --- Acessibilidade: desliga tudo para quem pediu menos movimento --- */
@media (prefers-reduced-motion: reduce){
  [data-rv]{opacity:1 !important; transform:none !important; transition:none !important;}
  .hero .signal-dots,.hero h1,.hero .lede,.hero .btn-row{opacity:1 !important; animation:none !important;}
  .hero-art .arc{stroke-dasharray:none !important; stroke-dashoffset:0 !important; animation:none !important;}
  .hero-art svg{animation:none !important;}
  .read-bar{display:none;}
  .tool-card:hover,.channel-card:hover,.quiz-cat:hover,.btn:hover{transform:none !important;}
}

/* --- Fileira de ícones sociais, logo abaixo do hero --- */
.social-row{display:flex; gap:10px; margin-top:18px;}
.social-row a{
  width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--white); border:1px solid var(--line); color:var(--navy-900);
  transition:transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.social-row a:hover{background:var(--navy-900); color:var(--gold-500); border-color:var(--navy-900); transform:translateY(-2px);}

/* ===== Botão flutuante de WhatsApp (todas as páginas) ===== */
.wa-float-wrap{
  position:fixed; right:18px; bottom:18px; z-index:70;
  display:flex; align-items:center; gap:10px;
  flex-direction:row-reverse;
}
.wa-float-bubble{
  background:var(--navy-900, #0F2E3D); color:#fff;
  font-size:.82rem; font-weight:600; white-space:nowrap;
  padding:9px 14px; border-radius:999px;
  box-shadow:0 6px 18px rgba(15,46,61,.22);
  animation:waBubblePulse 2.6s ease-in-out infinite;
}
.wa-float-btn{
  position:relative;
  width:56px; height:56px; border-radius:50%;
  background:#1F8F55; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px rgba(0,0,0,.25);
  flex-shrink:0;
}
.wa-float-btn::before{
  content:""; position:absolute; inset:0; border-radius:50%;
  background:#1F8F55; opacity:.55;
  animation:waRingPulse 2.2s ease-out infinite;
}
.wa-float-btn svg{position:relative; z-index:1;}

@keyframes waRingPulse{
  0%{ transform:scale(1); opacity:.55; }
  100%{ transform:scale(1.7); opacity:0; }
}
@keyframes waBubblePulse{
  0%, 100%{ opacity:1; transform:translateY(0); }
  50%{ opacity:.82; transform:translateY(-2px); }
}

@media (max-width:520px){
  .wa-float-bubble{display:none;}
}

@media (prefers-reduced-motion: reduce){
  .wa-float-btn::before{display:none;}
  .wa-float-bubble{animation:none;}
}

/* ===== Rodapé azul, uniforme em todas as páginas ===== */
footer.site{
  background:var(--navy-900); border-top:none; margin-top:64px;
  padding:56px 0 32px; color:#C9D6DB; font-size:15px;
}
footer.site .signal-mark .word{color:#FFFFFF;}
footer.site .footer-grid p{color:#C9D6DB;}
footer.site .footer-grid h4{color:#FFFFFF;}
footer.site .footer-grid a{color:#C9D6DB;}
footer.site .footer-grid a:hover{color:var(--gold-500);}
footer.site .footer-bottom{border-top-color:rgba(255,255,255,.14);}
footer.site .footer-bottom p{color:#9FB2B9;}
footer.site .footer-bottom a{color:#C9D6DB;}
footer.site .footer-bottom a:hover{color:var(--gold-500);}

/* ===== Logo: sem sublinhado, igual ao logotipo oficial ===== */
.signal-mark, .signal-mark:hover, .signal-mark:focus, .signal-mark .word{text-decoration:none;}
.signal-mark svg{flex-shrink:0;}

/* ===== Logo oficial: mesma fonte (Montserrat ExtraBold) e mesmo azul do logotipo ===== */
.signal-mark .word{
  font-family:'Montserrat', sans-serif; font-weight:800;
  color:#124F6C; letter-spacing:.01em; font-size:1.05rem;
}
.footer-logo{display:inline-block; text-decoration:none;}

/* ===== Leve 3D em todo o site: sombras em camadas e botões "em relevo" ===== */
.btn{box-shadow:0 2px 0 rgba(15,46,61,.18), 0 8px 18px rgba(15,46,61,.12);}
.btn:hover{box-shadow:0 4px 0 rgba(15,46,61,.18), 0 14px 26px rgba(15,46,61,.18);}
.btn:active{transform:translateY(1px); box-shadow:0 1px 0 rgba(15,46,61,.18), 0 4px 10px rgba(15,46,61,.12);}
.btn-outline, .btn-ghost{box-shadow:none;}
.nav-cta{box-shadow:0 2px 0 rgba(0,0,0,.25), 0 8px 18px rgba(15,46,61,.18);}
.tool-card, .card, .channel-card, .help-card, .calc-form, .quiz-cat{
  box-shadow:0 1px 2px rgba(15,46,61,.06), 0 10px 24px rgba(15,46,61,.07);
}
.calc-result{box-shadow:0 2px 6px rgba(15,46,61,.12), 0 24px 50px rgba(15,46,61,.22);}
.section-alt{box-shadow:inset 0 10px 20px -16px rgba(15,46,61,.18), inset 0 -10px 20px -16px rgba(15,46,61,.18);}
.cta-band{box-shadow:0 30px 60px -20px rgba(15,46,61,.45);}
[data-tilt]{transform-style:preserve-3d; will-change:transform;}

/* ===== Cartões grandes "Como podemos te ajudar" ===== */
.help-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px;}
@media (max-width:1000px){ .help-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:640px){ .help-grid{grid-template-columns:minmax(0,1fr);} }
.help-card{
  display:flex; flex-direction:column; gap:12px; text-decoration:none; color:var(--ink);
  background:var(--white); border:1px solid var(--line); border-radius:18px; padding:28px;
  transition:transform .25s cubic-bezier(.22,.7,.3,1), box-shadow .25s, border-color .2s;
}
.help-card:hover{border-color:var(--gold-500); box-shadow:0 2px 4px rgba(15,46,61,.08), 0 22px 40px rgba(15,46,61,.14);}
.help-card .ic{width:52px; height:52px; border-radius:14px; background:var(--navy-900); color:var(--gold-500); display:flex; align-items:center; justify-content:center;}
.help-card h3{font-size:1.25rem; margin:4px 0 0;}
.help-card p{font-size:.95rem; color:var(--ink-soft); margin:0;}
.help-card ul{list-style:none; margin:4px 0 0; padding:0; display:flex; flex-direction:column; gap:7px;}
.help-card li{font-size:.9rem; color:var(--ink); padding-left:20px; position:relative;}
.help-card li::before{content:""; position:absolute; left:0; top:.5em; width:8px; height:8px; border-radius:50%; background:var(--gold-500);}
.help-card .go{margin-top:auto; padding-top:8px; font-weight:600; color:var(--navy-900);}
/* ===== Mesmo sistema visual das páginas SOS (Dívidas, Trânsito, Condomínio) ===== */
:root{--font-display:'Montserrat', sans-serif; --font-body:'Source Sans 3', sans-serif;}
body{font-size:17px;}
h1, h2{font-weight:800;}
h3, h4{font-weight:700;}
.btn{font-family:'Montserrat', sans-serif; font-weight:700; font-size:15px; border-width:2px; min-height:50px; padding:14px 28px;}
.nav-cta{font-family:'Montserrat', sans-serif;}
footer.site .footer-grid h4{font-family:'Montserrat', sans-serif; font-size:15px;}
@media (max-width:600px){ footer.site .footer-grid{grid-template-columns:minmax(0,1fr);} }
.contact-form select{
  width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:var(--radius-sm);
  font-family:var(--font-body); font-size:.97rem; background:var(--white); color:var(--ink);
}
.contact-form select:focus{border-color:var(--gold-500);}

/* ===== Tabela de preços (página Serviços) ===== */
.precos-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:18px; background:var(--white);}
.precos{width:100%; border-collapse:collapse; font-size:.97rem;}
.precos th, .precos td{text-align:left; padding:14px 18px; border-bottom:1px solid var(--line); vertical-align:top;}
.precos tr:last-child td{border-bottom:0;}
.precos th{background:var(--navy-900); color:#FFFFFF; font-family:'Montserrat', sans-serif; font-size:.9rem;}
.precos td.v{white-space:nowrap; font-family:'Montserrat', sans-serif; font-weight:700; color:var(--navy-900);}
.precos td a{color:var(--navy-900); font-weight:600;}
.precos tr.area td{background:var(--paper); font-family:'Montserrat', sans-serif; font-weight:800; color:var(--navy-900);}
.precos-nota{font-size:.9rem; color:var(--ink-soft); margin-top:16px; max-width:80ch;}
@media (max-width:600px){ .precos th:nth-child(2), .precos td:nth-child(2){display:none;} .precos th, .precos td{padding:12px 14px;} }

/* ===== Blog: lista de artigos ===== */
.blog-chips{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 28px;}
.blog-chips button{
  font-family:'Montserrat', sans-serif; font-weight:600; font-size:.85rem; cursor:pointer;
  padding:8px 16px; border-radius:999px; border:1px solid var(--line); background:var(--white); color:var(--navy-900);
}
.blog-chips button[aria-pressed="true"]{background:var(--navy-900); color:#FFFFFF; border-color:var(--navy-900);}
.blog-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px;}
@media (max-width:980px){ .blog-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:640px){ .blog-grid{grid-template-columns:minmax(0,1fr);} }
.blog-card{
  display:flex; flex-direction:column; gap:10px; text-decoration:none; color:var(--ink);
  background:var(--white); border:1px solid var(--line); border-radius:18px; padding:24px;
  box-shadow:0 1px 2px rgba(15,46,61,.06), 0 10px 24px rgba(15,46,61,.07);
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.blog-card:hover{transform:translateY(-4px); border-color:var(--gold-500); box-shadow:0 2px 4px rgba(15,46,61,.08), 0 22px 40px rgba(15,46,61,.14);}
.blog-card .tag{align-self:flex-start; font-family:'Montserrat', sans-serif; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--gold-600); background:var(--gold-100); padding:4px 10px; border-radius:999px;}
.blog-card h3{font-size:1.12rem; line-height:1.3; margin:2px 0 0;}
.blog-card p{font-size:.94rem; color:var(--ink-soft); margin:0;}
.blog-card .go{margin-top:auto; padding-top:6px; font-weight:600; font-size:.92rem; color:var(--navy-900);}
.blog-card[hidden]{display:none;}

/* ===== Blog: página do artigo ===== */
.post{padding:40px 0 16px;}
.post-wrap{max-width:780px;}
.crumbs{font-size:.88rem; color:var(--ink-soft); margin-bottom:18px;}
.crumbs a{color:var(--navy-700); text-decoration:none;}
.crumbs a:hover{text-decoration:underline;}
.post h1{font-size:clamp(1.9rem,4vw,2.7rem); line-height:1.15; margin:10px 0 12px;}
.post-meta{font-size:.9rem; color:var(--ink-soft); margin:0 0 28px;}
.post-body{font-size:1.08rem; line-height:1.7; color:var(--ink);}
.post-body > p, .post-body li{max-width:70ch;}
.post-body h2{font-size:clamp(1.35rem,2.4vw,1.7rem); margin:44px 0 12px; line-height:1.25;}
.post-body h3{font-size:1.15rem; margin:28px 0 8px;}
.post-body p{margin:0 0 16px;}
.post-body ul, .post-body ol{margin:0 0 18px; padding-left:22px;}
.post-body li{margin-bottom:8px;}
.post-body a{color:var(--navy-700); font-weight:600;}
.post-body strong{color:var(--navy-900);}
.post-resumo{background:var(--white); border:1px solid var(--line); border-left:5px solid var(--gold-500); border-radius:14px; padding:20px 24px; margin:0 0 28px;}
.post-resumo h2{font-size:1.05rem; margin:0 0 10px;}
.post-resumo ul{margin:0; padding-left:20px;}
.post-resumo li{margin-bottom:6px; font-size:1rem;}
.post-table{overflow-x:auto; margin:0 0 22px; border:1px solid var(--line); border-radius:14px; background:var(--white);}
.post-table table{width:100%; border-collapse:collapse; font-size:.97rem;}
.post-table th, .post-table td{text-align:left; padding:12px 16px; border-bottom:1px solid var(--line); vertical-align:top;}
.post-table tr:last-child td{border-bottom:0;}
.post-table th{background:var(--navy-900); color:#FFFFFF; font-family:'Montserrat', sans-serif; font-size:.88rem;}
.post-box{
  background:var(--navy-900); color:#E4ECEF; border-radius:18px; padding:26px 28px; margin:32px 0;
  box-shadow:0 20px 40px -18px rgba(15,46,61,.45);
}
.post-box h2, .post-box h3{color:#FFFFFF; margin:0 0 8px; font-size:1.25rem;}
.post-box p{color:#C9D6DB; margin:0 0 16px; max-width:none;}
.post-box .btn{margin:4px 8px 0 0;}
.post-box .btn-outline{color:#FFFFFF; border-color:rgba(255,255,255,.5);}
.post-faq{margin-top:12px;}
.post-faq .faq-item summary{font-size:1.02rem;}
.post-aviso{font-size:.88rem; color:var(--ink-soft); border-top:1px solid var(--line); margin-top:36px; padding-top:18px;}
.post-rel{margin-top:44px;}
.post-rel h2{font-size:1.3rem; margin:0 0 16px;}
.post-rel .blog-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:760px){ .post-rel .blog-grid{grid-template-columns:minmax(0,1fr);} .post-box{padding:22px 20px;} }

/* ===== Menu Serviços ===== */
.has-mega .mega-panel::before{content:""; position:absolute; left:0; right:0; top:-18px; height:18px;} /* ponte invisível: o menu não fecha no caminho do mouse */
.has-mega.open .mega-panel{display:grid;}