/* Reset e Base */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  /* Colors */
  --primary:hsl(199,100%,39%);
  --primary-dark:hsl(199,100%,29%);
  --primary-foreground:#fff;
  --secondary:hsl(186,100%,50%);
  --neon:hsl(75,100%,52%);
  --background:#fff;
  --foreground:hsl(222,84%,5%);
  --muted:hsl(210,40%,96%);
  --muted-foreground:hsl(215,16%,47%);
  --border:hsl(214,32%,91%);
  --card-bg:#fff;

  /* Gradients */
  --gradient-primary:linear-gradient(135deg,hsl(199,100%,39%) 0%,hsl(174,93%,53%) 100%);
  --gradient-overlay:linear-gradient(to right,rgba(1,85,123,.30),transparent);

  /* Shadows */
  --shadow-sm:0 1px 2px rgba(0,0,0,.05);
  --shadow-md:0 4px 10px rgba(0,0,0,.08);
  --shadow-lg:0 20px 40px rgba(0,0,0,.12);
  --shadow-neon:0 0 20px hsla(75,100%,52%,.35);

  /* Transitions */
  --transition:all .3s ease
}
html{scroll-behavior:smooth}
body{
  font-family: 'Montserrat', sans-serif;
  line-height:1.6;color:var(--foreground);background:var(--background);
  -webkit-font-smoothing:antialiased
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none;transition:var(--transition)}

/* Container */
.container{width:100%;max-width:1280px;margin:0 auto;padding:0 1.5rem}
.container-md{max-width:1024px}

/* Header */
.site-header{
  position:fixed;inset:0 0 auto;z-index:1000;background:transparent;transition:var(--transition)
}
.site-header.scrolled{
  background:rgba(255,255,255,.95);backdrop-filter:blur(10px);box-shadow:0 2px 10px rgba(0,0,0,.1)
}
.header-content{display:flex;align-items:center;justify-content:space-between;padding:1rem 0}
.logo img{height:2.6rem;width:auto}
.mobile-menu-toggle{display:none;flex-direction:column;gap:4px;background:none;border:0;cursor:pointer;padding:.5rem}
.mobile-menu-toggle span{width:24px;height:2px;background:var(--foreground);transition:var(--transition)}
.mobile-menu-toggle.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.mobile-menu-toggle.active span:nth-child(2){opacity:0}
.mobile-menu-toggle.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}

.main-nav{display:flex;align-items:center;gap:2rem}
.main-nav ul{display:flex;gap:2rem;list-style:none;align-items:center}
.main-nav a.nav-link{font-weight:500}
.main-nav a.nav-link:hover{color:var(--primary)}
.btn-header{
  background:var(--neon);color:hsl(210,100%,12%);
  padding:.625rem 1.5rem;border-radius:9999px;font-weight:600
}
.btn-header:hover{transform:translateY(-2px);box-shadow:var(--shadow-neon)}

/* Buttons */
.btn-primary{
  display:inline-flex;align-items:center;justify-content:center;gap:.75rem;
  background:var(--neon);color:hsl(210,100%,12%);
  padding:.875rem 2rem;border-radius:9999px;font-weight:700;font-size:1.125rem;border:0;cursor:pointer;
  transition:var(--transition);box-shadow:var(--shadow-neon)
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 30px hsla(75,100%,52%,.6)}
.btn-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}

/* Hero */
.hero-section{
  background:var(--gradient-primary);padding:8.5rem 0 4.5rem;min-height:90vh;display:flex;align-items:center
}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.hero-content h1{
  font-size:3.2rem;font-weight:800;line-height:1.15;margin:0 0 1.5rem;color:#fff
}
.text-neon{color:var(--neon)}
.hero-description{font-size:1.25rem;color:rgba(255,255,255,.92);margin-bottom:2rem}
.hero-image{position:relative;animation:float 3s ease-in-out infinite}


/* Sections */
section{padding:5rem 0}
.section-title{
  text-align:center;font-size:2.5rem;font-weight:800;margin-bottom:3rem;color:var(--foreground)
}

/* Authority (prova social) */
.authority-section{background:var(--muted);background-image:linear-gradient(to bottom,transparent,rgba(1,85,123,.03))}
.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}
.cards-grid-3{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.cards-grid-4{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}

/* Novo estilo para os cards azuis */
.authority-section .section-title span.highlight {
  color: var(--primary);
}

.card-authority {
  background: var(--primary);
  color: #fff;
  border-radius: 1rem;
  padding: 2rem;
  text-align: center;
  box-shadow: var(--shadow-md);
  transition: var(--transition);
}

.card-authority:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
}

.card-authority h3,
.card-authority p {
  color: #fff;
}

.card-authority .card-icon {
  font-size: 2.5rem;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Bloco dor/solução */
.problem-section{
  position:relative;background-image:url('./assets/problem-bg-nova.webp');
  background-size:cover;background-position:center;min-height:400px
}
.problem-overlay{position:absolute;inset:0;background:var(--gradient-overlay)}
.problem-content{
  position:relative;z-index:10;max-width:900px;margin:0 auto;background:#fff;border-radius:1rem;
  padding:3rem;box-shadow:var(--shadow-lg);border-left:6px solid var(--primary)
}
.problem-content h2{font-size:2rem;font-weight:800;margin:0 0 1.25rem;color:var(--primary)}
.problem-text p{font-size:1.125rem;line-height:1.8;margin-bottom:1rem}
.problem-text .highlight{font-weight:700;color:var(--primary)}

/* Serviços */
.solution-section{background:var(--gradient-primary);color:#fff}
.solution-section .section-title{color:#fff}
.solution-footer{text-align:center;margin-top:3rem;font-size:1.125rem;font-weight:600;color:rgba(255,255,255,.92)}

/* Depoimentos */
.testimonials-section{background:var(--muted)}
.card-testimonial{display:flex;flex-direction:column;gap:1rem}
.stars{color:#fbbf24;font-size:1.25rem}
.testimonial-text{flex-grow:1;font-style:italic;color:var(--foreground);line-height:1.7}
.testimonial-author{display:flex;align-items:center;justify-content:space-between;padding-top:1rem;border-top:1px solid var(--border)}
.testimonial-author strong{color:var(--primary)}
.g-badge{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#e9eef6;color:#2b4b78;font-weight:700;font-size:.8rem}

/* CTA */
.mid-cta-section,.final-cta-section{background:var(--gradient-primary);color:#fff}
.cta-content{text-align:center}
.cta-content h2{font-size:2.5rem;font-weight:800;margin:0 0 1.25rem;color:#fff}
.cta-content p{font-size:1.125rem;margin-bottom:2rem;color:rgba(255,255,255,.9)}

/* FAQ */
.accordion{display:flex;flex-direction:column;gap:1rem}
.accordion-item{background:#fff;border:1px solid var(--border);border-radius:.75rem;overflow:hidden}
.accordion-trigger{
  width:100%;display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;
  background:none;border:0;cursor:pointer;font-size:1.125rem;font-weight:700;text-align:left;color:var(--foreground)
}
.accordion-trigger:hover{background:var(--muted)}
.accordion-trigger svg{transition:var(--transition);flex-shrink:0}
.accordion-item.active .accordion-trigger svg{transform:rotate(180deg)}
.accordion-content{max-height:0;overflow:hidden;transition:max-height .3s ease}
.accordion-item.active .accordion-content{max-height:500px}
.accordion-content p{padding:0 1.5rem 1.25rem;color:var(--muted-foreground);line-height:1.7}

/* Footer */
.site-footer{background:var(--muted);border-top:1px solid var(--border);padding:3rem 0 1.5rem}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-bottom:2rem}
.footer-column h3{font-size:1.125rem;font-weight:700;margin-bottom:1rem}
.footer-column p,.footer-column a{color:var(--muted-foreground);line-height:1.8}
.footer-column a:hover{color:var(--primary)}
.footer-logo{height:2.5rem;margin-bottom:1rem}
.footer-company{font-weight:700;color:var(--foreground)}
.footer-bottom{border-top:1px solid var(--border);padding-top:1.25rem;text-align:center;color:var(--muted-foreground);font-size:.9rem}

/* Animações */
@keyframes fade-up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes scale-in{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.85}}
.animate-fade-up{animation:fade-up .6s ease-out forwards}
.animate-scale-in{animation:scale-in .5s ease-out forwards}
.stagger-delay-1{animation-delay:.1s}.stagger-delay-2{animation-delay:.2s}.stagger-delay-3{animation-delay:.3s}
.stagger-delay-4{animation-delay:.4s}.stagger-delay-5{animation-delay:.5s}.stagger-delay-6{animation-delay:.6s}

/* Responsivo */
@media (max-width:1024px){
  .hero-grid{grid-template-columns:1fr;gap:3rem}
  .hero-content h1{font-size:2.6rem}
  
  .section-title{font-size:2rem}
  .cta-content h2{font-size:2rem}
}
@media (max-width:768px){
  .mobile-menu-toggle{display:flex}
  .main-nav{
    position:fixed;top:72px;left:0;right:0;background:#fff;flex-direction:column;padding:2rem;box-shadow:var(--shadow-lg);
    transform:translateX(-100%);transition:var(--transition)
  }
  .main-nav.active{transform:translateX(0)}
  .main-nav ul{flex-direction:column;gap:1rem}
  .hero-section{padding:6.5rem 0 3rem;min-height:auto}
  .hero-content h1{font-size:2.1rem}
  .hero-description{font-size:1.1rem}
  
  .problem-content{padding:2rem}
  .problem-content h2{font-size:1.6rem}
  .cards-grid,.cards-grid-3,.cards-grid-4{grid-template-columns:1fr}
  .section-title{font-size:1.8rem}
  .cta-content h2{font-size:1.8rem}
  .btn-primary{font-size:1rem;padding:.75rem 1.5rem}
}
@media (max-width:480px){
  .container{padding:0 1rem}
  .hero-content h1{font-size:1.8rem}
  
  .problem-content{padding:1.5rem}
  .card{padding:1.5rem}
}

/* ===== AJUSTE DE ALINHAMENTO EM DESKTOP ===== */
@media (min-width:1025px) {
  /* Serviços - 6 cards em 2 linhas de 3 */
  .cards-grid-4 {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Depoimentos - 4 cards lado a lado */
  .cards-grid-3 {
    grid-template-columns: repeat(4, 1fr);
  }
}


/* ===== CARDS DE SERVIÇOS ===== */
.card-service {
  background: #fff !important;
  color: var(--foreground) !important;
  border-radius: 1rem !important;
  padding: 2rem !important;
  box-shadow: var(--shadow-md) !important;
  transition: var(--transition) !important;
  text-align: center !important;
}

.card-service:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--shadow-lg) !important;
}

/* ===== CARDS DE DEPOIMENTOS ===== */
.card-testimonial {
  background: #fff !important;
  color: var(--foreground) !important;
  border-radius: 1rem !important;
  padding: 2rem !important;
  box-shadow: var(--shadow-md) !important;
  transition: var(--transition) !important;
}

.card-testimonial:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--shadow-lg) !important;
}

/* ===== AJUSTE ANIMAÇÃO HERO IMAGE ===== */
.hero-image img {
  width:100%;
  max-height:560px;
  object-fit:cover;
  object-position:center right;
  border-radius:1.2rem;
  box-shadow:var(--shadow-lg);
  animation: float 3s ease-in-out infinite !important;
}

/* ===== MOBILE AJUSTE PARA CARDS ===== */
@media (max-width: 768px) {
  .card-service,
  .card-testimonial {
    background: #fff !important;
    color: var(--foreground) !important;
    border-radius: 1rem !important;
    padding: 1.5rem !important;
    box-shadow: var(--shadow-md) !important;
  }
}


/* Cookie Banner */
.cookie-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #ffffff;
  border-top: 1px solid var(--border);
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 2000;
}

.cookie-banner p {
  font-size: 14px;
  color: var(--foreground);
}

.cookie-actions {
  display: flex;
  gap: 16px;
  align-items: center;
}

#cookie-accept {
  padding: 8px 18px;
  border-radius: 9999px;
  border: none;
  background: var(--neon);
  color: hsl(210,100%,12%);
  font-weight: 700;
  cursor: pointer;
}

.cookie-actions a {
  font-size: 14px;
  color: var(--primary);
  text-decoration: underline;
}
