/* ===== VARIÁVEIS ===== */
:root{
  --azul:#0B3D91; --azul-escuro:#082a66; --amarelo:#FFC400; --amarelo-escuro:#e6b000;
  --fundo:#F5F8FD; --branco:#fff; --texto:#1c2536; --texto-suave:#55627a;
  --verde:#25D366; --raio:16px; --sombra:0 6px 20px rgba(11,61,145,.10);
}
/* ===== BASE ===== */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;font-family:'Inter',sans-serif;color:var(--texto);background:var(--fundo);line-height:1.6}
img{max-width:100%;display:block}
h1,h2,h3{font-family:'Poppins',sans-serif;line-height:1.2;margin:0 0 .5em;color:var(--azul-escuro)}
h2{font-size:1.7rem;text-align:center}
p{margin:0 0 1em}
a{color:inherit}
:focus-visible{outline:3px solid var(--amarelo);outline-offset:3px}
.container{width:min(1120px,100% - 2rem);margin-inline:auto}
section{padding:3.5rem 0}
.sub{text-align:center;color:var(--texto-suave);max-width:560px;margin:0 auto 2rem}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.9rem 1.5rem;border-radius:999px;font-weight:600;text-decoration:none;border:0;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.18)}
.btn-wpp{background:var(--amarelo);color:var(--azul-escuro)}
.btn-wpp:hover{background:var(--amarelo-escuro)}
.btn-azul{background:var(--azul);color:#fff}
.btn-azul:hover{background:var(--azul-escuro)}

/* ===== HEADER ===== */
header{position:fixed;inset:0 0 auto 0;z-index:50;background:var(--azul);box-shadow:0 2px 12px rgba(0,0,0,.2)}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{display:flex;align-items:center;gap:.5rem;font:800 1.15rem 'Poppins',sans-serif;color:#fff;text-decoration:none}
.logo img{width:40px;height:40px;object-fit:contain;background:var(--amarelo);border-radius:50%}
.logo span{color:var(--amarelo)}
.menu-btn{background:none;border:2px solid #fff;color:#fff;border-radius:10px;padding:.35rem .7rem;font-size:1.2rem;cursor:pointer}
nav ul{position:absolute;top:64px;left:0;right:0;background:var(--azul-escuro);list-style:none;margin:0;padding:0;display:none}
nav ul.aberto{display:block}
nav li a{display:block;padding:1rem;color:#fff;text-decoration:none;font-weight:500;border-top:1px solid rgba(255,255,255,.1);transition:color .2s}
nav li a:hover{color:var(--amarelo)}

/* ===== HERO ===== */
.hero{background:linear-gradient(160deg,var(--azul) 0%,var(--azul-escuro) 100%);color:#fff;padding:7rem 0 3.5rem;overflow:hidden}
.hero .container{display:grid;gap:2rem;align-items:center}
.hero h1{color:#fff;font-size:2.1rem}
.hero h1 em{font-style:normal;color:var(--amarelo)}
.hero p{color:#d6e2fb;font-size:1.05rem}
.hero-img{max-width:280px;margin:0 auto;filter:drop-shadow(0 12px 24px rgba(0,0,0,.35))}
.selos{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;margin-top:1.2rem;font-size:.9rem;color:#d6e2fb;padding:0;list-style:none}

/* ===== SERVIÇOS ===== */
.grid{display:grid;gap:1.25rem}
.card{background:var(--branco);border-radius:var(--raio);box-shadow:var(--sombra);overflow:hidden;transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-5px);box-shadow:0 14px 30px rgba(11,61,145,.18)}
.card img{width:100%;height:190px;object-fit:cover}
.card-corpo{padding:1.25rem}
.icone{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--amarelo);font-size:1.4rem;margin-bottom:.6rem}
.card h3{font-size:1.1rem}
.card p{color:var(--texto-suave);margin:0;font-size:.95rem}
.card-simples{padding:1.5rem}

/* ===== SOBRE ===== */
.sobre{background:var(--branco)}
.sobre .container{display:grid;gap:2rem;align-items:center}

.sobre-foto img{max-width:260px;margin:0 auto}
.sobre h2{text-align:left}
.numeros{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:1.5rem}
.num{background:var(--fundo);border-radius:var(--raio);text-align:center;padding:1rem .4rem}
.num strong{display:block;font:800 1.7rem 'Poppins',sans-serif;color:var(--azul)}
.num span{font-size:.8rem;color:var(--texto-suave)}

/* ===== COMO FUNCIONA ===== */
.passo{text-align:center;padding:1.5rem}
.passo b{display:grid;place-items:center;width:52px;height:52px;margin:0 auto .8rem;border-radius:50%;background:var(--azul);color:var(--amarelo);font:800 1.4rem 'Poppins',sans-serif}
.passo p{color:var(--texto-suave);margin:0}

/* ===== DEPOIMENTOS ===== */
.depo{background:var(--azul);}
.depo h2,.depo .sub{color:#fff}
.depo .sub{color:#d6e2fb}
.depo .card{padding:1.5rem}
.estrelas{color:var(--amarelo-escuro);letter-spacing:2px;margin-bottom:.5rem}
.depo blockquote{margin:0 0 1rem;color:var(--texto)}
.depo cite{font-style:normal;font-weight:600;color:var(--azul)}

/* ===== FAQ ===== */
.faq-lista{max-width:760px;margin:0 auto;display:grid;gap:.75rem}
details{background:var(--branco);border-radius:12px;box-shadow:var(--sombra);padding:1rem 1.25rem}
summary{cursor:pointer;font-weight:600;color:var(--azul-escuro);list-style:none;display:flex;justify-content:space-between;gap:1rem}
summary::after{content:"+";font-size:1.4rem;color:var(--azul);line-height:1}
details[open] summary::after{content:"–"}
details p{margin:.75rem 0 0;color:var(--texto-suave)}

/* ===== CONTATO ===== */
.contato{background:var(--branco)}
.contato-info{display:grid;gap:1rem;margin:1.5rem 0}
.info{display:flex;gap:.9rem;align-items:flex-start;background:var(--fundo);border-radius:var(--raio);padding:1rem 1.2rem}
.info .icone{margin:0;flex:none}
.info strong{display:block;color:var(--azul-escuro)}
.info a{color:var(--azul);text-decoration:none;font-weight:500}
.info a:hover{text-decoration:underline}
.contato-cta{text-align:center}

/* ===== RODAPÉ ===== */
footer{background:var(--azul-escuro);color:#c4d3f2;text-align:center;padding:2rem 0;font-size:.9rem}
footer .redes{display:flex;justify-content:center;gap:1rem;margin-bottom:.8rem}
footer .redes a{color:#fff;font-weight:600;text-decoration:none;padding:.4rem 1rem;border:1px solid rgba(255,255,255,.3);border-radius:999px;transition:background .2s,color .2s}
footer .redes a:hover{background:var(--amarelo);color:var(--azul-escuro)}

/* ===== BOTÃO FLUTUANTE ===== */
.flutuante{position:fixed;right:16px;bottom:16px;z-index:60;width:60px;height:60px;border-radius:50%;background:var(--verde);display:grid;place-items:center;box-shadow:0 6px 18px rgba(0,0,0,.3);transition:transform .2s}
.flutuante:hover{transform:scale(1.08)}
.flutuante svg{width:32px;height:32px;fill:#fff}

/* ===== TABLET 768px ===== */
@media (min-width:768px){
  h2{font-size:2.1rem}
  section{padding:4.5rem 0}
  .hero h1{font-size:2.8rem}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .hero .container,.sobre .container{grid-template-columns:1.2fr 1fr}
  .hero-img{max-width:360px}
  .contato-info{grid-template-columns:repeat(3,1fr)}
}

/* ===== DESKTOP 1024px ===== */
@media (min-width:1024px){
  .menu-btn{display:none}
  nav ul{position:static;display:flex;background:none;gap:.25rem}
  nav li a{border:0;padding:.5rem .9rem;border-radius:8px}
  .grid-3{grid-template-columns:repeat(3,1fr)}
  .hero{padding-top:8rem}
  .hero h1{font-size:3.2rem}
}

@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}