.primeiro-km-hero{
  min-height:70vh;
  display:flex;
  align-items:center;
  color:var(--white);
  background:
    linear-gradient(90deg,rgba(0,0,0,.86),rgba(0,0,0,.58),rgba(0,0,0,.25)),
    url('/assets/img/primeiro-km-hero.png');
  background-size:cover;
  background-position:center;
}

.primeiro-km-hero h1,
.primeiro-km-hero p{
  color:var(--white);
}

.primeiro-km-hero .hero-inner{
  padding:110px 0;
}

.steps-grid,
.benefits-grid,
.faq-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}

.step-card,
.benefit-card,
.faq-card{
  border-radius:var(--radius);
  padding:28px;
  background:var(--white);
  border:1px solid #e4e4e4;
  min-height:230px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.step-number{
  color:var(--yellow);
  font-size:54px;
  font-weight:950;
  line-height:1;
  margin-bottom:20px;
}

.step-card h3,
.benefit-card h3,
.faq-card h3{
  font-size:30px;
  line-height:1;
  letter-spacing:-1px;
  margin-bottom:16px;
  text-transform:uppercase;
}

.step-card p,
.faq-card p{
  color:#666;
  font-weight:700;
  line-height:1.5;
}

.benefit-card{
  min-height:150px;
  background:var(--black);
  color:var(--white);
}

.benefit-card h3{
  margin:0;
  color:var(--white);
}

.list-card{
  background:var(--black);
  color:var(--white);
  border-radius:var(--radius);
  padding:40px;
}

.list-card ul{
  list-style:none;
  display:grid;
  gap:18px;
  font-size:22px;
  font-weight:900;
}

.list-card li::before{
  content:'✓';
  color:var(--yellow);
  margin-right:10px;
}

.cta-strip{
  background:var(--yellow);
  border-radius:var(--radius);
  padding:46px;
  display:grid;
  grid-template-columns:1.3fr auto;
  gap:28px;
  align-items:center;
}

.cta-strip h2{
  font-size:clamp(42px,7vw,84px);
  line-height:.9;
  letter-spacing:-3px;
  text-transform:uppercase;
  margin-bottom:18px;
}

.cta-strip p{
  font-size:19px;
  line-height:1.5;
  max-width:720px;
}

.whatsapp-float{
  bottom:25px;
  right:25px;
}

@media(max-width:1100px){
  .steps-grid{grid-template-columns:repeat(2,1fr)}
  .benefits-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:860px){
  .primeiro-km-hero{
    min-height:78vh;
  }

  .primeiro-km-hero .hero-inner{
    padding:90px 0;
  }

  .cta-strip,
  .faq-grid{
    grid-template-columns:1fr;
    display:grid;
  }
}

@media(max-width:580px){
  .primeiro-km-hero{
    min-height:82vh;
    background-position:center;
  }

  .primeiro-km-hero .hero-inner{
    padding:72px 0;
  }

  .steps-grid,
  .benefits-grid{
    grid-template-columns:1fr;
  }

  .list-card,
  .cta-strip{
    padding:26px;
  }
}