/* ============================================================
   HOME: ajustes de layout + animações (carregar depois do style.css)
   ============================================================ */

/* ---------- Números do topo (antes ficavam colados nas divisórias) ---------- */
.stat-row{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;border-top:none;padding-top:0;
}
.stat-row .stat-box{
  padding:16px 14px;border:1px solid #e3e9f3;border-right:1px solid #e3e9f3;
  border-radius:12px;background:#fff;min-width:0;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.stat-row .stat-box:last-child{border-right:1px solid #e3e9f3;}
.stat-row .stat-box:hover{transform:translateY(-3px);border-color:#c9dbf5;box-shadow:0 14px 26px -18px rgba(0,67,175,.45);}
.stat-num{font-size:28px;white-space:nowrap;}
.stat-label{line-height:1.3;}

/* ---------- Polos: endereço não fica mais escondido atrás da faixa azul ---------- */
.polo-top{padding-bottom:52px;}
.polo-body{position:relative;z-index:2;margin-top:-30px;}
.polo-address{
  display:flex;align-items:flex-start;gap:8px;line-height:1.45;
}
.polo-address::before{
  content:"";flex-shrink:0;width:14px;height:14px;margin-top:2px;
  background:var(--azul-principal);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a7 7 0 0 0-7 7c0 5.25 7 13 7 13s7-7.75 7-13a7 7 0 0 0-7-7zm0 9.5A2.5 2.5 0 1 1 12 6.5a2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.polo-link .arr{display:inline-block;transition:transform .2s ease;}
.polo-card:hover .polo-link .arr{transform:translateX(5px);}

/* ---------- Modalidades: grupos, preços e novas cores ---------- */
.mod-group-title{
  display:block;font-family:var(--font-accent);font-weight:700;font-size:17px;letter-spacing:.6px;
  text-transform:uppercase;color:var(--azul-escuro);margin:0 0 16px;
}
.mod-grid + .mod-group-title{margin-top:44px;}
.mod-card{
  background:#fff;display:flex;flex-direction:column;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.mod-card:hover{transform:translateY(-5px);border-color:#c9dbf5;box-shadow:0 22px 40px -24px rgba(29,57,150,.45);}
.mod-card .mod-tags{margin-top:auto;}
.mod-card.b4 .bar{background:var(--azul-medio);}
.mod-card.b5 .bar{background:var(--azul-escuro);}
.mod-card.b6 .bar{background:linear-gradient(180deg,var(--ciano),var(--azul-principal));}
.mod-price{
  display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 6px;
  margin:10px 0 14px;padding:10px 14px;border-radius:10px;background:#f2f7ff;
}
.mod-price small{font-size:12.5px;color:var(--cinza);}
.mod-price strong{
  font-family:var(--font-accent);font-weight:700;font-size:28px;line-height:1;color:var(--azul-principal);
}

/* ---------- Rodapé ---------- */
.footer-brand .footer-logo{height:34px;width:auto;display:block;}
.footer-brand .dev-credit{margin-top:10px;font-size:12.5px;color:#8ea0cc;}
.footer-brand .dev-credit a{color:#fff;font-weight:600;text-decoration:none;border-bottom:1px dashed rgba(255,255,255,.4);transition:color .2s,border-color .2s;}
.footer-brand .dev-credit a:hover{color:var(--ciano);border-color:var(--ciano);}

/* ============================================================
   ANIMAÇÕES
   ============================================================ */

/* Entrada do hero (ao carregar) */
.js-anim .anim-in{opacity:0;animation:pdeUp .8s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:var(--d,0s);}
.js-anim .anim-in.anim-right{animation-name:pdeLeft;}

/* Revelar ao rolar */
.js-anim .reveal{
  opacity:0;transform:translateY(28px);
  transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1);
  transition-delay:var(--d,0s);
}
.js-anim .reveal.is-in{opacity:1;transform:none;}
/* cards com hover: depois de revelados, o hover volta a ser rápido */
.js-anim .mod-card.reveal.is-in, .js-anim .polo-card.reveal.is-in{transition:opacity .7s ease, transform .22s ease, box-shadow .22s ease, border-color .22s ease;}

/* Loops sutis */
.hero-shape{animation:pdeFloat 9s ease-in-out infinite;}
.hero-orb{
  position:absolute;width:260px;height:260px;border-radius:50%;left:-90px;bottom:-60px;
  background:radial-gradient(circle,rgba(11,176,233,.22),transparent 70%);
  animation:pdeFloat 11s ease-in-out infinite reverse;pointer-events:none;
}
.form-card::before{animation:pdePulse 6s ease-in-out infinite;}
.dots-drift{animation:pdeDrift 30s linear infinite;}
.step .num{display:inline-block;animation:pdeBob 3.2s ease-in-out infinite;}
.step:nth-child(2) .num{animation-delay:.3s;}
.step:nth-child(3) .num{animation-delay:.6s;}
.step:nth-child(4) .num{animation-delay:.9s;}
.step:nth-child(5) .num{animation-delay:1.2s;}
.cta-final::before{animation:pdeBreath 8s ease-in-out infinite;}
.gal-item img{transition:transform .8s ease;}
.gal-item:hover img{transform:scale(1.06);}

/* Brilho passando nos botões principais */
.btn-shine{position:relative;overflow:hidden;}
.btn-shine::after{
  content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;
  background:linear-gradient(110deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-20deg);animation:pdeShine 4.5s ease-in-out infinite;
}

/* Botão do WhatsApp pulsando */
.wa-float::before{
  content:"";position:absolute;inset:0;border-radius:50%;background:#25D366;z-index:-1;
  animation:pdeRing 2.4s ease-out infinite;
}

@keyframes pdeUp{from{opacity:0;transform:translateY(26px);}to{opacity:1;transform:none;}}
@keyframes pdeLeft{from{opacity:0;transform:translateX(40px);}to{opacity:1;transform:none;}}
@keyframes pdeFloat{0%,100%{transform:translate(0,0) rotate(0);}50%{transform:translate(-18px,22px) rotate(4deg);}}
@keyframes pdePulse{0%,100%{transform:scale(1);opacity:.18;}50%{transform:scale(1.35);opacity:.28;}}
@keyframes pdeDrift{from{background-position:0 0;}to{background-position:160px 160px;}}
@keyframes pdeBob{0%,100%{transform:translateY(0);}50%{transform:translateY(-5px);}}
@keyframes pdeBreath{0%,100%{transform:translateX(-50%) scale(1);}50%{transform:translateX(-50%) scale(1.12);}}
@keyframes pdeShine{0%,60%{left:-60%;}100%{left:130%;}}
@keyframes pdeRing{0%{transform:scale(1);opacity:.55;}100%{transform:scale(1.7);opacity:0;}}

/* Responsivo */
@media (max-width: 980px){
  .stat-row{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:12px;}
}
@media (max-width: 720px){
  .mod-price strong{font-size:25px;}
  .mod-grid + .mod-group-title{margin-top:34px;}
}

/* Quem prefere menos movimento */
@media (prefers-reduced-motion: reduce){
  .js-anim .anim-in, .js-anim .reveal{opacity:1 !important;transform:none !important;animation:none !important;transition:none !important;}
  .hero-shape, .hero-orb, .form-card::before, .dots-drift, .step .num, .cta-final::before, .btn-shine::after, .wa-float::before{animation:none !important;}
}
