/* Public mobile/tablet layout. Desktop rules remain in style.css. */
@media (max-width: 1024px) {
  main :is(h1,h2,h3,h4,p,.eyebrow,.text-link),
  .site-footer a { overflow-wrap: anywhere; }
  main .container > *,
  :is(.home-introduction-grid,.split-heading,.news-events-grid,.news-row,.event-row,.hg-detail-hero-grid,.department-grid,.doctor-cards,.branch-stat-grid) > * { min-width: 0; }
}

@media (max-width: 900px) {
  .home-introduction-grid { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .home-introduction-media { width: 100%; max-width: 100%; height: auto; min-height: 0; }
  .home-introduction-media :is(img,video) { width: 100%; max-width: 100%; height: auto; min-height: 0; }
  .health-guide-article-page .hg-detail-hero-grid { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .news-events-grid { grid-template-columns: minmax(0,1fr); gap: 40px; }
}

@media (max-width: 768px) {
  :root { --mobile-gutter: 20px; }
  body { font-size: 16px; }
  body .container.container,
  .doctors-directory-page .page-hero__inner.container,
  .doctors-directory-page .doctor-results-section > .container {
    width: 100%; max-width: 100%; min-width: 0;
    margin-inline: auto; padding-inline: var(--mobile-gutter); box-sizing: border-box;
  }
  /* Layout children size against the container's content box, never the viewport. */
  :is(.header-inner,.hero-content,.home-introduction-grid,.split-heading,.news-events-grid,.footer-grid) > * {
    min-width: 0; box-sizing: border-box;
  }
  :is(.quick-grid,.department-grid,.news-events-grid,.news-list,.event-list,.content-stream,.home-introduction-copy) {
    width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box;
  }
  :is(.quick-grid,.department-grid,.news-events-grid,.footer-grid) > * { min-width: 0; max-width: 100%; }
  .site-header .header-inner { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; }
  .site-header .brand { max-width: 100%; }
  .site-header .menu-toggle { position: static; justify-self: end; align-items: flex-end; width: 46px; min-width: 46px; margin: 0; padding-inline: 0; }
  .site-header .main-nav { left: var(--mobile-gutter); right: var(--mobile-gutter); width: auto; max-width: none; box-sizing: border-box; }
  .home-page .home-emergency > .container { padding-inline: var(--mobile-gutter); }
  .mobile-bottom {
    width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box;
    left: 0; right: 0; grid-template-columns: repeat(4,minmax(0,1fr));
    padding-inline: var(--mobile-gutter);
  }
  .mobile-bottom > :is(a,span) { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
  .mobile-bottom > :is(a,span) > span { max-width: 100%; min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  main :is(input,select,textarea,button) { min-width: 0; max-width: 100%; }
  main :is(img,video,iframe) { max-width: 100%; }
  main .btn { max-width: 100%; white-space: normal; text-align: center; padding-top: 12px; padding-bottom: 12px; }
  .breadcrumb li { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }

  .home-managed-hero { min-height: 0; }
  .home-managed-hero .hero-content { min-height: 0; padding-block: 42px; gap: 32px; }
  .home-managed-hero .hero-copy { width: 100%; max-width: 100%; min-width: 0; }
  .home-managed-hero h1 { max-width: 100%; font-size: clamp(42px,11vw,56px); line-height: 1.06; }
  .home-managed-hero .eyebrow { max-width: 100%; line-height: 1.5; }
  .home-managed-hero p { font-size: 16px; line-height: 1.7; }
  .home-managed-hero .hero-actions { display: grid; grid-template-columns: minmax(0,1fr); width: 100%; gap: 14px; margin-top: 24px; }
  .home-managed-hero .btn { width: 100%; font-size: 15px; min-height: 50px; }
  .home-managed-hero .hero-badge { position: static; width: 100%; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 0; }
  .home-managed-hero .hero-info-item { min-width: 0; padding: 16px 12px; overflow-wrap: anywhere; }
  .home-managed-hero .hero-badge strong { font-size: 22px; }
  .home-managed-hero .hero-badge span { font-size: 12px; line-height: 1.5; }

  .home-page .home-introduction h2,
  .home-page .split-heading h2,
  .home-page .doctor-panel h2,
  .home-page .center-heading h2,
  .home-page .section-heading h2 { font-size: clamp(34px,8vw,40px); line-height: 1.12; }
  .home-page .home-introduction p,
  .home-page .split-heading p,
  .home-page .doctor-panel p { font-size: 16px; line-height: 1.75; }
  .home-page .split-heading { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .home-page .department-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .home-page .department-card { min-width: 0; min-height: 150px; padding: 18px 12px; }
  .home-page .department-card b { overflow-wrap: anywhere; line-height: 1.4; }
  .home-page .home-introduction .btn { width: 100%; }
  .home-page .stats-grid strong { font-size: clamp(24px,6vw,31px); overflow-wrap: anywhere; }

  .stream-heading { align-items: flex-start; flex-direction: column; gap: 12px; }
  .stream-heading h3 { font-size: clamp(28px,7vw,34px); line-height: 1.15; }
  .stream-status { font-size: 14px; }
  .news-row { grid-template-columns: minmax(0,160px) minmax(0,1fr); }
  .news-row > div { padding: 20px; }
  .news-row h4,.event-copy h4 { font-size: 20px; line-height: 1.3; }
  .news-row time { font-size: 13px; }
  .news-row p { display: block; font-size: 16px; line-height: 1.65; margin-top: 10px; }
  .news-row .text-link { font-size: 15px; margin-top: 14px; }

  .page-hero__title,
  .doctors-directory-page .page-hero__title { font-size: clamp(40px,10.5vw,52px); line-height: 1.08; }
  .page-hero__description { font-size: 16px; }
  .page-hero--has-search,
  .doctors-directory-page .page-hero--has-search { min-height: 0; padding: 32px 0; }
  .page-hero--has-search .page-hero__inner { padding-bottom: 0; }
  .page-hero--has-search .breadcrumb { margin-bottom: 24px; }
  .page-hero__search { position: static; width: 100%; margin-top: 24px; }
  .page-hero__search form,
  .doctors-directory-page .page-hero__search .doctor-directory-search { grid-template-columns: minmax(0,1fr); gap: 12px; padding: 16px; }
  .branches-page .branches-directory,
  .doctor-results-section,
  .health-guide-page .hg-list-section,
  .news-list-page .hg-list-section { padding-top: 48px; }
  .health-guide-article-page .hg-detail-hero h1 { font-size: clamp(34px,9vw,46px); line-height: 1.12; }
  .health-guide-article-page .hg-detail-hero p { font-size: 16px; }

  body .container.branch-stat-grid { width: calc(100% - 2 * var(--mobile-gutter)); padding: 0; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .branch-stat-grid > div { flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px 16px; }
  .branch-stat-grid strong { font-size: clamp(22px,5.7vw,28px); overflow-wrap: anywhere; }
  .branch-stat-grid small { overflow-wrap: anywhere; }
  .doctor-detail-page .doctor-section-nav { position: static; }
  .doctor-detail-page .doctor-section-nav .container { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); overflow: visible; }
  .doctor-detail-page .doctor-section-nav a { min-width: 0; padding: 14px 8px; }
}

@media (max-width: 480px) {
  .news-row,.branches-page .news-row { grid-template-columns: minmax(0,1fr); }
  .news-row > img,.branches-page .news-row > img { width: 100%; height: auto; aspect-ratio: 16/10; object-fit: cover; }
  .news-image-fallback { width: 100%; min-height: 180px; border-radius: 0; }
}

@media (max-width: 360px) {
  :root { --mobile-gutter: 16px; }
}