/* Compact mobile UX — progressive disclosure without deleting hospital content. */
.compact-view-all,.mobile-profile-toggle,.mobile-about-toggle,.mobile-purpose-toggle{display:none}
@media(max-width:760px){
  :root{--section-flow:32px}
  html{scroll-padding-top:78px}
  html,body{overflow-x:clip}
  body{line-height:1.55}
  section.section,main .section,#care.section,#doctors.section,#specialist-directory.section,
  #facilities.section,#appointment.section,#find-hospital.section,#contact.section{
    padding-block:32px!important;
    min-height:0!important;
  }
  #mission.section,#visit.section,#about.section{padding-block:30px!important;min-height:0!important}
  .section-head{margin-bottom:18px!important;gap:12px!important}
  .section-head h2,.purpose-heading h2{font-size:clamp(27px,6.8vw,35px)!important;line-height:1.18!important}
  .section-head>p,.section-head p:not(.eyebrow){font-size:13px!important;line-height:1.6!important;margin:8px 0 0!important}
  .eyebrow{letter-spacing:1.25px!important;font-size:10px!important}
  #doctors .doctors-grid{gap:15px!important}
  #doctors .doctor-card{min-height:0!important}
  #doctors .doctor-intro{
    min-height:234px!important;
    width:56%!important;
    padding-bottom:6px;
  }
  #doctors .doctor-card .doctor-photo-rail{
    width:44%!important;max-width:44%!important;height:225px!important;
    top:0!important;bottom:auto!important;
  }
  #doctors .doctor-card .doctor-photo-rail img{
    width:100%!important;height:94%!important;max-height:94%!important;
    object-fit:contain!important;object-position:center bottom!important;
    top:auto!important;bottom:0!important;right:0!important;
  }
  #doctors .doctor-card .doctor-content{padding:14px!important}
  #doctors .doctor-topline{margin-bottom:8px!important;gap:6px!important}
  #doctors .doctor-monogram{width:27px!important;height:27px!important;flex-basis:27px!important;font-size:11px!important}
  #doctors .doctor-number{font-size:8px!important;line-height:1.2}
  #doctors .doctor-role{font-size:9px!important;line-height:1.3!important;margin-bottom:7px!important}
  #doctors .doctor-card h3{font-size:clamp(19px,4.9vw,25px)!important;line-height:1.14!important}
  #doctors .doctor-credentials{font-size:10px!important;line-height:1.4!important}
  #doctors .doctor-focus{margin:5px 0 10px!important}
  #doctors .doctor-focus span{font-size:10px!important;padding:6px 8px!important}
  #doctors .doctor-action{font-size:12px!important;margin-top:5px!important}
  html.mobile-compact-enabled #doctors .doctor-card:not(.compact-expanded) .doctor-bio{display:none!important}
  html.mobile-compact-enabled .mobile-profile-toggle,
  html.mobile-compact-enabled .mobile-about-toggle,
  html.mobile-compact-enabled .mobile-purpose-toggle{
    display:inline-flex;gap:7px;align-items:center;border:0;background:transparent;
    color:#093624;font-size:12px;font-weight:800;text-align:left;
    min-height:35px;padding:4px 0;cursor:pointer;
  }
  #doctors .doctor-details{display:flex!important;flex-direction:column}
  #doctors .doctor-details .mobile-profile-toggle{align-self:flex-start;margin-bottom:2px}
  .care-grid{gap:11px!important}
  .care-card{padding:16px!important;min-height:0!important}
  .care-card h3{font-size:17px!important;line-height:1.3!important;margin-block:9px 6px!important}
  .care-card p{font-size:12px!important;line-height:1.55!important;margin-bottom:9px!important}
  .care-card a{font-size:12px!important}
  .speciality-title{margin-top:18px!important;margin-bottom:10px!important}
  .service-finder{margin-bottom:11px!important}
  #specialities{gap:8px!important}
  #specialities .service-link{padding:12px 12px!important;min-height:48px!important;font-size:12px}
  #specialities .service-link[hidden],#specialist-results .specialist-entry[hidden]{display:none!important}
  .compact-view-all{
    width:100%;align-items:center;justify-content:center;
    margin-top:11px;padding:12px 14px;min-height:46px;border-radius:10px;
    border:1px solid #FFFFFF;background:#FFFFFF;color:#093624;
    font-weight:800;font-size:13px;cursor:pointer;
  }
  .compact-view-all:not([hidden]){display:flex!important}
  .specialist-directory-panel{padding:15px!important}
  .specialist-verify-notice{padding:11px 12px!important;margin-bottom:14px!important}
  .specialist-entry{padding:12px!important;gap:6px!important}
  .specialist-entry h3{font-size:14px!important}
  .specialist-entry p{font-size:11px!important;line-height:1.5!important}
  .specialist-footer{margin-top:13px!important;padding-top:12px!important}
  #specialist-directory .specialist-search-controls{gap:10px!important}
  .facility-header{margin-bottom:12px!important}
  .facility-stage{height:280px!important}
  .facility-controls{margin-top:8px!important}
  .facility-disclaimer{font-size:11px!important;margin-top:10px!important}
  .about{gap:13px!important}
  .about-photo{min-height:165px!important;max-height:185px!important;overflow:hidden}
  .about-photo img{width:100%;height:100%;max-height:185px;object-fit:cover}
  html.mobile-compact-enabled .about:not(.compact-expanded) .mobile-extra-copy,
  html.mobile-compact-enabled .purpose-card:not(.compact-expanded) .mobile-extra-copy{display:none!important}
  .purpose-heading{margin-bottom:13px!important}
  .purpose-grid{gap:11px!important}
  .purpose-card{padding:17px!important;min-height:0!important}
  .purpose-card h3{font-size:18px!important;margin:8px 0!important}
  .purpose-card p{font-size:12px!important;line-height:1.55!important}
  .appointment-section{gap:16px!important}
  .appointment-section form{padding:15px!important}
  #visit .section-head{margin-bottom:14px!important}
  .visit-grid{gap:12px!important}
  .visit-grid>div{padding-block:13px!important}
  .international{padding-block:26px!important}
  .faq{padding-block:27px!important}
  .find-hospital{padding-block:34px!important}
  .contact{padding-block:35px!important}
  footer{padding-block:20px!important}
  /* Appointment is already fixed in the bottom bar; mobile header can breathe. */
  header>.button.small{display:none!important}
  header{justify-content:space-between!important}
  header .language-switch{margin-left:auto!important}
  header>.menu{margin-left:5px!important}
  /* Keep a small help button that does not cover doctor's portrait or paragraphs. */
  .chat-launch{width:45px!important;height:45px!important;border-radius:50%!important;
    padding:0!important;font-size:0!important;right:12px!important;
    bottom:calc(78px + env(safe-area-inset-bottom,0px))!important;overflow:hidden}
  .chat-launch::after{content:"?";font-size:21px;color:#FFFFFF;font-weight:800}
  /* Prevent scroll fades leaving readable content ghosted on mobile. */
  html.scroll-motion-enabled .scroll-scrub{opacity:1!important;transform:none!important}
  html.scroll-motion-enabled .scroll-scrub:hover{transform:none!important}
}
@media(max-width:390px){
  #doctors .doctor-card .doctor-photo-rail{height:208px!important}
  #doctors .doctor-intro{min-height:214px!important}
  #doctors .doctor-card h3{font-size:19px!important}
}
@media(prefers-reduced-motion:reduce){
  .compact-view-all,.mobile-profile-toggle,.mobile-about-toggle,.mobile-purpose-toggle{transition:none!important}
}

/* Native hidden state must win against card/grid display rules. */
[hidden]{display:none!important}