/* ── Mobile-first: estilos base são mobile ── */

/* ─────────────────────────────────────────────
   BASE MOBILE (< 480px)
───────────────────────────────────────────── */

/* Hero mobile — tudo centralizado */
#hero {
  text-align: center;
}

.hero__inner {
  align-items: center;
}

.hero__cta-wrap {
  align-items: center;
}

/* Dor mobile */
.dor__grid {
  grid-template-columns: 1fr;
}

/* Solução mobile */
.solucao__inner {
  grid-template-columns: 1fr;
  gap: var(--space-8);
}

.solucao__ornament {
  order: -1;
}

/* Benefícios mobile */
.beneficios__grid {
  grid-template-columns: 1fr;
}

/* Prova social mobile */
.prova-social__grid {
  grid-template-columns: 1fr;
  gap: var(--space-5);
}

/* Oferta mobile */
.oferta__grid {
  grid-template-columns: 1fr;
}

/* Footer mobile */
.footer__inner {
  flex-direction: column;
  text-align: center;
}

.footer__links {
  justify-content: center;
}

/* Scrollbar mobile — ocultar */
@media (max-width: 767px) {
  ::-webkit-scrollbar { display: none; }
  * { scrollbar-width: none; }
}

/* ─────────────────────────────────────────────
   SM: ≥ 480px
───────────────────────────────────────────── */
@media (min-width: 480px) {
  /* Dor: 2 colunas */
  .dor__grid {
    grid-template-columns: 1fr 1fr;
  }

  .hero-line {
    font-size: clamp(2rem, 7vw, var(--text-5xl));
  }
}

/* ─────────────────────────────────────────────
   MD: ≥ 768px
───────────────────────────────────────────── */
@media (min-width: 768px) {
  /* Hero desktop: centralizado por especificação */
  #hero {
    text-align: center;
  }

  .hero__inner {
    align-items: center;
  }

  .hero__cta-wrap {
    align-items: center;
  }

  /* Prova social: 2 colunas */
  .prova-social__grid {
    grid-template-columns: 1fr 1fr;
  }

  /* Benefícios: 2 colunas */
  .beneficios__grid {
    grid-template-columns: 1fr 1fr;
  }

  /* Solução: 2 colunas */
  .solucao__inner {
    grid-template-columns: 3fr 2fr;
    gap: var(--space-16);
  }

  .solucao__ornament {
    order: 0;
  }

  /* Oferta: 2 colunas tablet */
  .oferta__grid {
    grid-template-columns: 1fr 1fr;
  }

  /* Footer: linha */
  .footer__inner {
    flex-direction: row;
    text-align: left;
  }

  .footer__links {
    justify-content: flex-end;
  }
}

/* ─────────────────────────────────────────────
   LG: ≥ 1024px (layout desktop completo)
───────────────────────────────────────────── */
@media (min-width: 1024px) {
  /* Benefícios: 3 colunas */
  .beneficios__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Prova social: 3 colunas */
  .prova-social__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Oferta: 3 colunas */
  .oferta__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Scrollbar visível no desktop */
  ::-webkit-scrollbar { display: block; }
  * { scrollbar-width: thin; }
}

/* ─────────────────────────────────────────────
   XL: ≥ 1280px
───────────────────────────────────────────── */
@media (min-width: 1280px) {
  .container {
    padding: 0 clamp(2rem, 5vw, 4rem);
  }

  #hero .hero__inner > p {
    font-size: var(--text-xl);
  }

  .card-beneficio {
    padding: var(--space-10);
  }

  .pilar-oferta {
    padding: var(--space-10);
  }
}
