@media (min-width: 768px) {
  .about-container {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }
}

@media (min-width: 768px) {
  .about-title {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

@media (min-width: 768px) {
  .navbar {
    display: flex;
  }
  .mental-health-image {
    aspect-ratio: 4 / 3;
  }
  .footer-sections {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .hero-section-container {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }
  .title {
    font-size: 3.75rem;
    line-height: 1;
  }
  .hero-image {
    padding: 3rem;
  }
  .services-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .services-section {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }
  .services-title {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1024px;
  }
  .services-container {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .about-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 1280px) {
  .container {
    max-width: 1280px;
  }
}
@media (min-width: 1536px) {
  .container {
    max-width: 1536px;
  }
}
@media (min-width: 768px) {
  .md\:flex {
    display: flex;
  }
  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .md\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .md\:text-6xl {
    font-size: 3.75rem;
    line-height: 1;
  }
  .md\:text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
  .md\:p-12 {
    padding: 3rem;
  }
  .md\:py-24 {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }
  .md\:aspect-\[4\/3\] {
    aspect-ratio: 4 / 3;
  }
  .md\:col-span-2 {
    grid-column: span 2 / span 2;
  }
}
@media (min-width: 1024px) {
  .lg\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}