/* ============================================= */
/* FILE: assets/css/responsive.css                */
/* ============================================= */
@media (max-width: 1100px) {
  h1 { font-size: 2.8rem; }
}

@media (max-width: 900px) {
  .nav-wrapper {
    flex-direction: column;
    align-items: flex-start;
  }
  .menu {
    width: 100%;
    overflow-x: auto;
    padding-bottom: 8px;
    justify-content: flex-start;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  .menu li a {
    white-space: nowrap;
  }
}

@media (max-width: 800px) {
  h1 { font-size: 2.4rem; }
  h2 { font-size: 2rem; }
  .slider-container { aspect-ratio: 16/9; }
  .slider-btn {
    width: 40px;
    height: 40px;
    font-size: 1.4rem;
  }
  .profile-row {
    gap: 25px;
  }
  .btn {
    padding: 12px 28px;
    font-size: 0.95rem;
  }
}

@media (max-width: 700px) {
  .home-image {
    width: 200px;
    height: 180px;
  }
}

@media (max-width: 600px) {
  section { padding: 50px 0; }
  .container { padding: 0 20px; }
  h1 { font-size: 2rem; }
  h2 { font-size: 1.8rem; }
  .btn { padding: 10px 20px; margin-right: 8px; }
  .card { padding: 20px; }
  .clinic-name { font-size: 1.3rem; }
  .phone-item { font-size: 0.85rem; }
  .gallery-grid { gap: 18px; }
  .home-content {
    flex-direction: column;
    text-align: center;
  }
  .home-image {
    width: 180px;
    height: 160px;
  }
  .contact-grid {
    flex-direction: column;
    text-align: center;
  }
  .contact-info p {
    justify-content: center;
  }
}

@media (max-width: 450px) {
  .menu li a {
    padding: 6px 10px;
    font-size: 0.8rem;
  }
  .logo a {
    font-size: 1.5rem;
  }
  .logo span {
    font-size: 0.7rem;
  }
}