/* Responsive and interaction QA: 320px phones through laptop widths. */
html{scroll-padding-top:88px;overflow-x:clip}
body{max-width:100%;overflow-x:clip}
.container,.hero-grid,.inner-hero .container,.doctor-grid>*,
.photo-grid>*,.service-panel,.form-card{min-width:0}
img,video,iframe{max-width:100%}
button,a{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #be795c;outline-offset:4px}
.doctor-body h3{overflow-wrap:break-word}
.doctor-body strong{color:#356857;display:block;margin-bottom:7px}
@media(max-width:1100px){
  .navlinks,.nav-action{display:none}
  .menu-btn{display:flex;margin-left:auto}
  .mobile-nav{display:none;background:var(--cream);padding:15px 18px 28px;border-top:1px solid var(--line)}
  .mobile-nav.open{display:block}
  .mobile-nav a{display:block;padding:13px 7px;border-bottom:1px solid var(--line)}
  .mobile-nav .btn{display:flex;justify-content:center;margin-top:20px}
}
@media(min-width:801px) and (max-width:1100px){
  .hero-grid,.inner-hero .container{gap:4%}
  .doctor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .service-panel{padding:22px}
  .service-panel h3{font-size:clamp(1.25rem,2vw,1.8rem)}
}
@media(max-width:600px){
  .container{width:calc(100% - 30px)}
  .hero h1,.inner-hero h1{font-size:clamp(2.65rem,10vw,4.2rem);overflow-wrap:break-word}
  .section-head h2{overflow-wrap:break-word}
  .btn,button[type=submit]{min-height:44px}
  .hero-visual{max-height:450px}
  .doctor-grid,.photo-grid{grid-template-columns:1fr}
  .doctor-image img{height:330px}
  .form-card input,.form-card select,.form-card textarea{width:100%;min-width:0}
}
@media(max-width:360px){
  .hero h1,.inner-hero h1{font-size:2.55rem}
  .hero-card{max-width:65%}
  .footer-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}