/* ============================================================
   Garg Farms — Responsive refinements
   Most layout is mobile-first in the component files; this file
   holds small-screen safety tweaks so nothing overlaps or spills.
   ============================================================ */

/* Very small phones: tighten the large hero side padding (px-14
   in the source) so headline and buttons don't get cramped. */
@media (max-width: 480px) {
  .hero-content {
    padding-inline: 1.5rem;
  }
  .hero-logo { height: 5.5rem; }
  .hero-title { font-size: 1.75rem; }
  .hero-actions .btn { width: 100%; }

  .factory-title { font-size: 1.75rem; }
  .section-head h2,
  .about-title,
  .founder-head h2,
  .advantages-head h2,
  .testimonials-head h2 { font-size: 1.625rem; }
}

/* Keep the founder photo from stretching too tall on mobile */
@media (max-width: 767px) {
  .founder-photo { max-width: 20rem; }
}

/* Hero arrows sit a touch inward on small screens */
@media (max-width: 380px) {
  .hero-arrow { height: 2.25rem; width: 2.25rem; }
}

/* Ensure tap targets stay comfortable */
@media (hover: none) {
  .hero-arrow,
  .hero-dot,
  .factory-toggle,
  .btn { touch-action: manipulation; }
}