/* ==========================================================
   STYLE.CSS — VERSÃO OTIMIZADA (REFATORADA)
   Mantém o mesmo visual — código modular, sem redundâncias.
   ========================================================== */

/* -----------------------
   Tokens / Variáveis
   ----------------------- */
:root{
  --azul: #5a4abf;      /* NOVO - roxo-azulado da marca */
  --azul-escuro: #3c2f8f;
  --amarelo: #f4c430;   /* amarelo mais vivo */
  --branco: #ffffff;
  --cinza: #f9f9fb;
  --texto: #1c1c1c;
  --radius: 16px;
  --max-width: 1150px;

  /* Shadows */
  --shadow-soft: 0 8px 20px rgba(0,0,0,0.08);
  --shadow-medium: 0 12px 36px rgba(0,74,173,0.28);
  --shadow-yellow: 0 16px 40px rgba(251,197,49,0.25);
}

/* -----------------------
   Reset / Base
   ----------------------- */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:'Poppins',sans-serif;
  background:var(--branco);
  color:var(--texto);
  line-height:1.6;
  scroll-behavior:smooth;
}
.container{
  max-width:var(--max-width);
  margin:0 auto;
  padding:0 20px;
}
img{max-width:100%;display:block;height:auto}

/* -----------------------
   Reusable utilities
   ----------------------- */
.flex{display:flex}
.center{display:flex;align-items:center;justify-content:center}
.col{display:flex;flex-direction:column}
.rounded{border-radius:var(--radius)}
.card-base{
  background:var(--branco);
  border-radius:var(--radius);
  padding:26px;
  box-shadow:var(--shadow-soft);
  transition:transform .25s ease,box-shadow .25s ease;
}
.card-hoverable:hover{transform:translateY(-6px);box-shadow:0 14px 32px rgba(0,0,0,0.12);}

/* Grid helpers */
.grid{display:grid;gap:25px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}

/* -----------------------
   Buttons (centralizado)
   ----------------------- */
.btn{
  cursor:pointer;
  border-radius:40px;
  font-weight:700;
  padding:12px 24px;
  transition:.25s ease;
  border:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}
.btn-primary{background:var(--amarelo);color:var(--azul)}
.btn-primary:hover{background:var(--azul);color:var(--branco);transform:translateY(-4px)}
.btn-outline{background:transparent;border:2px solid var(--azul);color:var(--azul)}
.btn-outline:hover{background:var(--azul);color:var(--branco);transform:translateY(-4px)}
.btn-ghost{background:transparent;color:var(--azul);border:2px solid var(--azul)}
.btn-lg{padding:16px 36px;font-size:1.1rem}
.btn-cta{font-size:1.5rem;padding:12px 2px;width:60%;white-space:nowrap}
@media(max-width:600px){.btn-cta{width:80%;font-size:1.15rem;padding:14px 10px}}

/* Accessibility keyboard focus */
.btn,button{outline:none}
.btn:focus{box-shadow:0 0 0 4px rgba(0,74,173,0.12);}

/* -----------------------
   HERO
   ----------------------- */
.header-hero, .hero{
  background: linear-gradient(135deg, #f4c430 0%, #5a4abf 100%);
  color:var(--branco);
  text-align:center;
  position:relative;
  padding:15px 20px 24px;
}
/* LOGO À ESQUERDA */
.logo {
  text-align: left !important;
  margin-bottom: 10px !important;
  padding: 15px 20px 10px;
}

.logo img {
  width: 230px;
  height: auto;
  display: block;
  margin: 0 !important;  /* remove centralização */
  margin-bottom: -12px !important; /* mantém o título pertinho */
}
.header-hero h1{
  font-size:2.6rem;
  font-weight:900;
  line-height:1.05;
  margin-bottom:14px;
  text-shadow:0 4px 14px rgba(0,0,0,0.22);
  margin-top: 0px !important;
}
.hero-lead{
  max-width:780px;margin:0 auto 30px;font-size:1.12rem;line-height:1.65;color:rgba(255,255,255,0.95)
}
.hero-highlights{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin:22px 0}
.highlight{
  background:rgba(255,255,255,0.12);padding:8px 14px;border-radius:28px;font-weight:700;color:#fff;border:1px solid rgba(255,255,255,0.08)
}
.urgencia-badge{
  display:inline-block;padding:10px 14px;border-radius:8px;background:rgba(0,0,0,0.45);color:var(--amarelo);font-weight:800;margin:12px 0; border:1px solid rgba(255,255,255,0.18)
}
.hero-note{margin-top:10px;opacity:.95;font-size:.95rem}
.countdown{margin-top:12px;font-weight:800;font-size:1.15rem;text-shadow:0 2px 8px rgba(0,0,0,0.4)}

/* CTA row shared */
.cta-row{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin:50px 0 10px}

/* Ensure mobile tightness */
@media(max-width:760px){
  .header-hero{padding:48px 20px 64px}
  .header-hero h1{font-size:2.1rem}
  .hero-lead{font-size:1rem}
  .brand-row{flex-direction:column;gap:14px}
}

/* -----------------------
   Sections base
   ----------------------- */
section{padding:80px 0}
section h2{font-size:2rem;color:var(--azul);text-align:center;margin-bottom:18px}
section .lead{max-width:850px;text-align:center;margin:0 auto 28px;font-size:1.12rem;color:#444}

/* -----------------------
   Cards / Icons (reusable)
   ----------------------- */
.card{background:var(--branco);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow-soft);transition:.25s ease}
.card:hover{transform:translateY(-6px)}
.icon-wrapper{width:70px;height:70px;margin:0 auto 18px;border-radius:14px;display:flex;align-items:center;justify-content:center}
.icon-large{width:80px;height:80px;border-radius:50%;background:var(--branco);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px rgba(0,0,0,0.12);transition:.3s ease}

/* -----------------------
   Method / What / Extras / Testimonials — reusing utilities
   ----------------------- */
.method{background:var(--branco);padding:80px 0}
.method h2{font-size:2.4rem;font-weight:800;color:#1a1a1a;margin-bottom:18px;line-height:1.3}
.method .lead{max-width:900px;margin:0 auto 50px;color:rgba(0,0,0,0.8);line-height:1.65}
.method-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.method-card{background:#fff;border-radius:16px;padding:28px 24px;box-shadow:var(--shadow-soft);text-align:center;transition:.25s;border-top:4px solid transparent}
.method-card:hover{transform:translateY(-6px);box-shadow:0 12px 32px rgba(0,0,0,0.12);border-top-color:var(--azul)}
.method-card h3{font-size:1.3rem;font-weight:700;color:var(--azul);margin-bottom:12px}
.method-card p{font-size:1rem;color:rgba(0,0,0,0.75);line-height:1.55}

.extras{background:var(--branco);padding:75px 0}
.extras-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.extras-card{padding:26px 22px;border-radius:16px;text-align:center;box-shadow:var(--shadow-soft);transition:.25s}
.extras-footnote{max-width:420px;margin:34px auto 0;padding-top:14px;font-size:.82rem;color:rgba(0,0,0,0.5);font-style:italic;border-top:1px solid rgba(0,0,0,0.1)}

.what{background:rgba(0,74,173,0.02);padding:10px 16px;border-radius:8px}
.what-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.what-card{background:var(--cinza);padding:34px 24px;border-radius:18px;text-align:center;transition:.25s;border:2px solid transparent}
.what-card:hover{transform:translateY(-6px);border-color:var(--amarelo);background:#fffefa;box-shadow:0 12px 30px rgba(0,0,0,0.07)}
.what-card h3{font-size:1.25rem;color:var(--azul);font-weight:700;margin-bottom:10px}
.what-card p{font-size:.97rem;color:#444;line-height:1.45}
.what-card:hover .icon-large{transform:scale(1.08) rotate(3deg);background:#fffdf5;box-shadow:0 10px 28px rgba(0,0,0,0.15)}
.what-card:hover h3{color:var(--amarelo)}

.testimonials{padding:75px 0;background:rgba(0,74,173,0.05)}
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.testimonial-card{background:#fff;border-radius:16px;padding:26px;box-shadow:var(--shadow-soft);transition:.25s}
.testimonial-card:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(0,0,0,0.12)}
.testimonial-card p{font-size:1rem;color:rgba(0,0,0,0.8);line-height:1.55}
.author{display:block;margin-top:10px;font-size:.95rem;font-weight:600;color:var(--azul)}

/* Planos */
.plans{padding:30px 0}
.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.plan-card{border-radius:14px;padding:28px 24px;text-align:center;box-shadow:var(--shadow-soft);border-top:4px solid rgba(0,0,0,0.1);transition:.25s}
.plan-card.destaque{transform:scale(1.05);border-top:6px solid var(--amarelo);box-shadow:var(--shadow-yellow)}
.price{font-size:1.45rem;font-weight:800;color:var(--azul);margin-bottom:6px}
.badge-popular{background:var(--amarelo);color:#1a1a1a;padding:6px 12px;border-radius:20px;font-weight:700;display:inline-block;margin-bottom:14px;font-size:.9rem}

/* Pain + Solution */
.pain-solution{padding:70px 0;background:linear-gradient(180deg,#ffffff,#f9faff)}
.solution-card{max-width:850px;margin:0 auto;background:#fff;border-radius:12px;padding:32px 36px;border-left:6px solid var(--azul);box-shadow:var(--shadow-medium);transition:.25s}
.solution-card h3{font-size:1.6rem;color:var(--azul);font-weight:800;margin-bottom:14px}
.solution-card p{font-size:1.12rem;color:#333;line-height:1.6}

/* CTA Unificada */
.cta-unificada{padding:90px 0;background:rgba(0,74,173,0.06)}
.cta-unificada-box{max-width:680px;margin:0 auto;background:#fff;padding:48px 34px;border-radius:20px;text-align:center;box-shadow:0 14px 40px rgba(0,0,0,0.12);border-top:6px solid var(--amarelo)}
.cta-unificada h2{font-size:2rem;color:var(--azul);font-weight:800;margin-bottom:16px}
.cta-unificada p{font-size:1.15rem;color:rgba(0,0,0,0.75);margin-bottom:28px;line-height:1.6}
.final-warning{margin-top:22px;font-size:.95rem;color:var(--danger);font-weight:600}
.cta-endereco{background:rgba(0,74,173,0.08);padding:14px 18px;border-radius:12px;display:flex;gap:12px;align-items:flex-start;justify-content:center;margin:0 auto 22px;max-width:450px;text-align:left}
.cta-endereco span{font-size:.95rem;color:var(--azul)}

/* Footer */
.site-footer{background:var(--azul-escuro);color:var(--branco);padding:40px 20px}
.footer-inner{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.footer-inner p{margin:0;font-size:.95rem}

/* Fixed CTA */
.fixed-cta{position:fixed;right:22px;bottom:22px;background:var(--amarelo);color:var(--azul);padding:12px 18px;border-radius:40px;font-weight:800;cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,0.15);animation:pulse 1.6s infinite;z-index:9999}
@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.06)}100%{transform:scale(1)}}

/* Fade-in animation */
.fade-in{opacity:0;transform:translateY(16px);transition:all .7s ease}
.fade-in.in-view{opacity:1;transform:translateY(0)}

/* -----------------------
   Responsive adjustments
   ----------------------- */
@media (max-width:1024px){
  .method-grid{grid-template-columns:repeat(2,1fr);gap:24px}
  .extras-grid{grid-template-columns:repeat(2,1fr)}
  .testimonials-grid{grid-template-columns:1fr}
}
@media (max-width:900px){
  .plans-grid{grid-template-columns:1fr}
  .plan-card.destaque{transform:scale(1.02)}
}
@media (max-width:760px){
  .hero h1{font-size:2.1rem}
  .hero-lead{font-size:1.05rem}
  .grid{grid-template-columns:1fr}
  .btn-primary,.btn-outline{width:100%}
  .what-grid{grid-template-columns:1fr}
}
@media (max-width:650px){
  .method-grid{grid-template-columns:1fr}
  .extras-grid{grid-template-columns:1fr}
  .brand-row .logo img{width:120px}
}

/* -----------------------
   Small helpers / overrides
   ----------------------- */
.hidden{display:none!important}
.text-center{text-align:center}
.muted{color:rgba(0,0,0,0.5)}
