/* Mobile-first responsive styles - Simplified */

/* Prevent horizontal scroll */
html, body {
  overflow-x: hidden;
  max-width: 100vw;
}

/* Prevent text overflow */
p, h1, h2, h3, h4, h5, h6, span, div {
  word-break: break-word;
  overflow-wrap: break-word;
}

/* Mobile optimizations (max-width: 768px) */
@media (max-width: 768px) {
  /* Allow containers to expand on mobile */
  .max-w-7xl,
  .max-w-6xl,
  .max-w-5xl,
  .max-w-4xl,
  .max-w-3xl,
  .max-w-2xl {
    max-width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  /* Ensure sections are full width */
  section {
    width: 100%;
    overflow-x: hidden;
  }

  /* Responsive images */
  img {
    max-width: 100%;
    height: auto;
  }

  /* Mobile spacing adjustments */
  .py-20 {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  /* Grid adjustments for mobile */
  .grid-cols-2,
  .grid-cols-3,
  .grid-cols-4,
  .md\:grid-cols-2,
  .lg\:grid-cols-2,
  .lg\:grid-cols-3,
  .lg\:grid-cols-4 {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}