/* ═══════════════════════════════════════════════
   APPMOLD — Responsive
   ═══════════════════════════════════════════════ */

/* ─── Large Desktop (> 1440px) ───────────────────── */
@media (min-width: 1440px) {
  .hero__tagline { font-size: 5.75rem; }
}

/* ─── Tablet landscape (< 1024px) ───────────────── */
@media (max-width: 1024px) {
  .services__grid { grid-template-columns: repeat(2, 1fr); }
  .nav__links { gap: 1.75rem; }
}

/* ─── Tablet portrait (< 900px) ─────────────────── */
@media (max-width: 900px) {
  .about__grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .projects__list { grid-template-columns: 1fr; }
}

/* ─── Tablet (< 900px) — hero vai a 1 coluna ─────── */
@media (max-width: 900px) {
  .hero__inner {
    grid-template-columns: 1fr;
    gap: 3rem;
    text-align: center;
  }
  .hero__content { align-items: center; }
  .hero__subtitle { margin-left: auto; margin-right: auto; }
  .hero__visual { display: none; }   /* Esconde SVG no tablet/mobile — foco no texto */

  .logos-strip .container {
    flex-direction: column;
    gap: 1.25rem;
    align-items: flex-start;
  }
  .logos-strip__row { gap: 0; }
  .logos-strip__item { padding: 0 1rem; }
}

/* ─── Mobile (< 768px) ───────────────────────────── */
@media (max-width: 768px) {
  .nav__links { display: none; }
  .nav__menu-btn { display: flex; }

  /* Hero: remove min-height 100vh — com visual oculto gerava grande espaço vazio */
  .hero {
    min-height: auto;
    padding-top: calc(var(--nav-h) + 3rem);
    padding-bottom: 3.5rem;
  }
  .hero__tagline { font-size: clamp(2.25rem, 9vw, 3.5rem); }

  /* Logos: scroll horizontal — evita quebra de linha que empilhava os logos */
  .logos-strip__row {
    width: 100%;
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .logos-strip__row::-webkit-scrollbar { display: none; }
  .logos-strip__item { flex-shrink: 0; }

  .services__grid { grid-template-columns: 1fr; gap: 1rem; }

  .contact__links { flex-direction: column; align-items: stretch; }
  .contact__link  { justify-content: center; }
}

/* ─── Small mobile (< 480px) ─────────────────────── */
@media (max-width: 480px) {
  :root { --container-pad: 1.25rem; }

  .btn { padding: 0.75rem 1.5rem; font-size: 0.875rem; }

  .service-card,
  .project-card,
  .founder-card { padding: 1.5rem; }
}