/* ===================================================================
   RESPONSIVE — Mobile first refinements
   =================================================================== */

/* ---------- Tablet & below (≤ 1024px) ---------- */
@media (max-width: 1024px) {
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .grid--3 { grid-template-columns: repeat(2, 1fr); }
  .hero__inner { gap: var(--space-md); }
  .floating-card { max-width: 190px; padding: 10px 14px; }
}

/* ---------- Nav collapse (≤ 900px) ---------- */
@media (max-width: 900px) {
  .nav { display: none; }
  .menu-toggle { display: flex; }
}

/* ---------- Mobile (≤ 760px) ---------- */
@media (max-width: 760px) {
  .container { padding: 0 22px; }
  section.section { padding: 2.3rem 0; }

  .hero { padding-top: 120px; min-height: auto; }
  .hero__inner { grid-template-columns: 1fr; }
  .hero__media { margin-bottom: var(--space-md); }
  .hero__frame { aspect-ratio: 4/5; }
  .hero__subtitle { max-width: 100%; }
  .hero__actions { flex-direction: column; align-items: stretch; }
  .hero__actions .btn { width: 100%; }

  .floating-card { position: static; max-width: none; margin-top: 14px; }
  .floating-card--1, .floating-card--2 { top: auto; left: auto; right: auto; bottom: auto; }

  .statement { min-height: 50vh; padding: 3.2rem 0; }

  .grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; }

  .timeline { grid-template-columns: 1fr; }
  .timeline__arrow { padding-top: 0; transform: rotate(0deg); }


  .final-cta .grid--2 { grid-template-columns: 1fr; }
  .final-cta .fade-right { order: -1; margin-bottom: var(--space-md); }

  .whatsapp-float { width: 52px; height: 52px; bottom: 18px; right: 18px; }

  .certifications { flex-direction: column; }

  .footer__inner { flex-direction: column; text-align: center; }
}

/* ---------- Small phones ---------- */
@media (max-width: 400px) {
  .hero__title { font-size: 2.05rem; }
  .section__title { font-size: 1.8rem; }
  .statement__text { font-size: 1.7rem; }
}