/* H16: retain the desktop design; give navigation, forms and dialogs room to fit. */
:focus-visible { outline: 3px solid #D97706; outline-offset: 3px; }
section[id], footer[id] { scroll-margin-top: 100px; }
.dialog-open { overflow: hidden; }
.dialog-open #mina-floating-control, .dialog-open #ai-voice-badge { display: none; }
[id$="-modal"] > div { max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; }
[id$="-modal"] > div > button:first-child { min-width: 44px; min-height: 44px; }
[id$="-modal"] input, [id$="-modal"] select, [id$="-modal"] textarea { min-width: 0; }
#voice-modal-title { padding-inline: 16px; }
#voice-transcript-log { overflow-wrap: anywhere; }
#booking-modal .booking-panel { display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.booking-header { position: relative; flex: none; padding: 24px 56px 16px 24px; }
.booking-close { position: absolute; top: 8px; right: 8px; width: 44px; height: 44px; }
.booking-header h3 { font-size: 24px; line-height: 1.2; }
.booking-header p { font-size: 14px; margin-top: 8px; }
#booking-external-link { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; font-size: 14px; }
#calendly-embed-container { width: 100%; min-width: 0; height: 700px; min-height: 0; overflow-y: auto; }
#calendly-embed-container iframe { width: 100%; height: 100%; border: 0; }
#booking-status { font-size: 14px; }

@media (max-width: 1279px) {
  #desktop-navigation { display: none; }
  #mobile-menu-btn { display: inline-flex; align-items: center; justify-content: center; }
  #mobile-menu:not(.hidden) { display: block; }
  #mobile-menu { max-height: calc(100dvh - 180px); overflow-y: auto; overscroll-behavior: contain; }
  #mobile-menu a, #mobile-menu button { min-height: 44px; display: flex; align-items: center; font-size: 14px; }
  #mobile-menu button { justify-content: center; }
  nav button, .hero-img-btn, #hero button, [id$="-modal"] button { min-height: 44px; }
  #theme-toggle-btn, #mobile-menu-btn { min-width: 44px; flex-shrink: 0; }
  #hero input:not([type="checkbox"]), #hero select, [id$="-modal"] input:not([type="checkbox"]),
  [id$="-modal"] select, [id$="-modal"] textarea { min-height: 44px; font-size: 16px; }
  #hero label, [id$="-modal"] label { font-size: 14px; line-height: 1.5; }
  label[for$="-consent"] { min-height: 44px; cursor: pointer; }
  input[type="checkbox"] { flex-shrink: 0; width: 22px; height: 22px; }
}

@media (max-width: 1023px) {
  #hero .hero-content { padding-block: 40px 56px; }
  #hero .hero-grid { gap: 32px; }
  #hero .hero-care-widget { display: block; width: 100%; max-width: 640px; }
  #hero .glass-card { animation: none; }
  #hero-bg-img { height: 740px; object-position: 58% center; transform: none; }
  #hero .hero-gradient { background: linear-gradient(180deg, rgba(15,23,42,.68), rgba(122,28,56,.70) 420px, #0f172a 780px); }
  #hero .hero-trust { flex-wrap: wrap; border-radius: 18px; }
}

@media (max-width: 639px) {
  body { padding-bottom: calc(84px + env(safe-area-inset-bottom)); }
  header .utility-line { height: auto; min-height: 72px; flex-wrap: wrap; justify-content: center; gap: 2px; padding-block: 6px; }
  header .utility-phones { justify-content: center; flex-wrap: wrap; }
  header .utility-phones a { min-height: 44px; display: inline-flex; align-items: center; font-size: 12px; }
  #site-navigation { top: 8px; }
  #site-navigation nav { padding: 8px 10px; }
  #site-navigation .brand-link { min-width: 0; flex-shrink: 1; gap: 8px; }
  #site-navigation .brand-link > div + div { margin-left: 0; }
  #site-navigation .brand-link .brand-title { font-size: 17px; white-space: nowrap; }
  #site-navigation .brand-live-status { display: none; }
  #site-navigation .nav-actions { gap: 2px; }
  #site-navigation .nav-actions > * + * { margin-left: 0; }
  #hero { padding-top: 0; }
  #hero h1 { font-size: clamp(2.25rem, 10vw, 3rem); line-height: 1.1; }
  #hero .hero-copy { font-size: 17px; line-height: 1.65; }
  #hero .hero-actions { flex-direction: column; }
  #hero .hero-actions button { width: 100%; justify-content: center; padding-inline: 16px; font-size: 14px; }
  #hero .glass-card { padding: 20px; }
  #hero .hero-trust { font-size: 12px; gap: 6px; }
  #highlights { margin-inline: 16px; }
  #highlights > div { padding-inline: 8px; gap: 8px; }
  #highlights .text-2xl { font-size: 21px; }
  #ai-voice-badge { display: none !important; }
  #mina-floating-control { right: 16px; bottom: calc(12px + env(safe-area-inset-bottom)); }
  .form-in-view #mina-floating-control, .menu-open #mina-floating-control { display: none; }
  #mina-floating-control button { min-height: 48px; }
  #toast-container { left: 16px; right: 16px; top: 16px; }
  #toast-container > div { max-width: 100%; overflow-wrap: anywhere; }
  [id$="-modal"] { padding: 12px; }
  [id$="-modal"] > div { max-height: calc(100dvh - 24px); padding: 20px; }
  #voice-modal > div { gap: 12px; }
  #voice-modal > div > * { margin-top: 0; flex-shrink: 0; }
  #voice-modal > div > button:first-child { top: 8px; right: 8px; }
  #voice-modal-title { font-size: 22px; }
  #voice-transcript-log { max-height: 160px; font-size: 14px; }
  #voice-agent-status-text { font-size: 14px; }
  #voice-text-input { width: 0; flex: 1; }
  #booking-modal { padding: 8px; }
  #booking-modal .booking-panel { max-height: calc(100dvh - 16px); border-radius: 20px; }
  .booking-header { padding: 16px 52px 8px 16px; }
  .booking-header h3 { font-size: 21px; }
  #calendly-embed-container { min-width: 320px; }
  footer a, #about button, #services button, #resources button { min-height: 44px; }
  footer a { display: inline-flex; align-items: center; }
}