/* Mobile contact strip and real city/address chooser. Desktop header keeps its existing layout. */
body .ref8-header .ref8-header-actions>:is(.clinic-header-phone,.ref8-header-search,.ref8-header-catalog){display:inline-flex;align-items:center;justify-content:center;width:44px;min-width:44px;height:44px;box-sizing:border-box;padding:10px;border-radius:12px}
body .ref8-header .ref8-header-actions>:is(.clinic-header-phone,.ref8-header-search,.ref8-header-catalog):hover{background:var(--color-soft,#e8f1ff)}
body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-actions>.clinic-header-phone>svg{display:block;width:22px;height:22px;flex:none;stroke-width:1.8}
body .ref8-header .clinic-header-phone:focus-visible{outline:2px solid var(--color-focus,var(--color-primary));outline-offset:2px}
.dental-mobile-topbar{display:none}
.dental-city-dialog{box-sizing:border-box;width:min(560px,calc(100vw - 32px));max-height:min(720px,calc(100dvh - 48px));margin:auto;padding:28px;border:1px solid var(--color-line);border-radius:28px;background:var(--color-white);color:var(--color-ink);overflow:auto;overscroll-behavior:contain;box-shadow:0 24px 80px rgb(31 43 64 / .18)}
.dental-city-dialog::backdrop{background:rgb(31 43 64 / .4);backdrop-filter:blur(4px)}
.dental-city-dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.dental-city-dialog .eyebrow{margin:0 0 10px;font-size:12px;line-height:1.4;color:var(--color-primary)}
.dental-city-dialog h2{margin:0;font-size:28px;line-height:1.15;letter-spacing:-.04em}
.dental-city-close{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:1px solid var(--color-line);border-radius:14px;background:var(--color-white);color:var(--color-primary);cursor:pointer}
.dental-city-dialog-copy{margin:18px 0;color:var(--color-muted);font-size:15px;line-height:1.55}
.dental-city-choices{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}
.dental-city-choice{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:10px 14px;border:1px solid var(--color-line);border-radius:14px;background:var(--color-white);color:var(--color-ink);font:inherit;font-size:15px;line-height:1.4;cursor:pointer}
.dental-city-choice>span{overflow-wrap:anywhere}
.dental-city-choice .icon{width:18px;height:18px;color:var(--color-primary);opacity:0;flex:none}
.dental-city-choice[aria-pressed="true"]{border-color:var(--color-primary);background:var(--color-accent);color:var(--color-primary)}
.dental-city-choice[aria-pressed="true"] .icon{opacity:1}
.dental-city-branches[hidden]{display:none!important}
.dental-city-branches h3{margin:0 0 12px;font-size:15px;font-weight:600;line-height:1.5;color:var(--color-muted)}
.dental-city-branches ul{margin:0;padding:0;list-style:none;border-top:1px solid var(--color-line)}
.dental-city-branches li{margin:0;padding:0}
.dental-city-branches a{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 0;border-bottom:1px solid var(--color-line);color:var(--color-ink);text-decoration:none}
.dental-city-branches a>span{display:grid;min-width:0;gap:5px}
.dental-city-branches strong{font-size:16px;font-weight:500;line-height:1.45;overflow-wrap:anywhere}
.dental-city-branches small{font-size:13px;line-height:1.5;color:var(--color-muted)}
.dental-city-branches a>.icon{width:20px;height:20px;flex:none;color:var(--color-primary)}
.dental-city-dialog-note{margin:20px 0 0;font-size:13px;line-height:1.5;color:var(--color-muted)}
.dental-city-dialog :is(a,button):focus-visible{outline:2px solid var(--color-focus);outline-offset:3px}
@media(max-width:1199px){
 body .ref8-header[data-mobile-clinic-header] .dental-mobile-topbar{display:block;position:relative;z-index:3;border-bottom:1px solid var(--color-line);background:var(--color-surface-soft)}
 body .ref8-header[data-mobile-clinic-header] .dental-mobile-topbar-inner{display:flex;align-items:center;justify-content:space-between;min-height:38px;gap:12px}
 .dental-mobile-city,.dental-mobile-appointment{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0;color:var(--color-primary);font-size:13px;font-weight:500;line-height:1.4;text-decoration:none}
 .dental-mobile-city{min-width:0;flex:0 1 auto}
 .dental-mobile-city>[data-mobile-city-label]{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .dental-mobile-city .icon,.dental-mobile-appointment .icon{width:16px;height:16px;flex:none}
 .dental-mobile-city .dental-mobile-city-chevron{width:12px;height:12px}
 .dental-mobile-appointment{flex:none;white-space:nowrap}
 .dental-mobile-topbar :is(a,button):focus-visible{outline:2px solid var(--color-focus);outline-offset:1px;border-radius:4px}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-top{height:64px;min-height:64px;gap:10px}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand{min-width:0;flex:1 1 auto}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand>span{min-width:0}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-actions{flex:none}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-actions>.ref8-header-book{display:none!important}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-actions>.ref8-mobile-phone{order:1}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-actions>.ref8-header-catalog{order:2}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-actions>.ref8-header-search{order:3}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-actions>.menu-toggle{order:4}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand[data-design-logo]{max-width:calc(100% - 186px);height:44px}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand[data-design-logo]>img.design-logo-image{max-width:100%;max-height:44px}
}
@media(max-width:390px){
 body .ref8-header[data-mobile-clinic-header] .dental-mobile-topbar-inner{gap:6px}
 .dental-mobile-city,.dental-mobile-appointment{font-size:12px;gap:5px}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-top{gap:8px}
 body .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand[data-design-logo]{max-width:calc(100% - 158px)}
 .dental-city-dialog{width:calc(100vw - 24px);padding:22px;border-radius:24px}
 .dental-city-dialog h2{font-size:26px}
}

/* Five real 44px targets fit alongside a flexible clinic wordmark. */
@media(max-width:767px){
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top{gap:10px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand{gap:8px;min-width:0}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand>img{flex:none;width:28px;height:32px;object-fit:contain}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand strong{font-size:20px;letter-spacing:-.025em}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-actions{gap:0;margin-left:auto}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-actions>.clinic-header-phone{display:inline-flex!important}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-actions>:is(.clinic-header-phone,.ref8-header-catalog,.ref8-header-search,.dental-reading-header-eye,.menu-toggle){display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;box-sizing:border-box;width:44px;min-width:44px;height:44px;margin:0;padding:8px;border:0;background:transparent}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-actions>:is(.clinic-header-phone,.ref8-header-catalog,.ref8-header-search,.dental-reading-header-eye,.menu-toggle) :is(.icon,svg){width:22px;height:22px;flex:none}
}
@media(max-width:480px){
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand{gap:6px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand strong{font-size:18px}
}
@media(max-width:389px){
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top{gap:4px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand{gap:4px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand>img{width:24px;height:28px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand strong{font-size:16px}
}
@media(max-width:359px){
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top{gap:6px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand{gap:6px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand>img{width:24px;height:28px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand strong{font-size:18px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-actions{gap:2px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header]:has([data-clinic-header-phone]) .ref8-header-top>.brand>span{display:none}
}
@media(max-width:319px){
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand{gap:5px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand>img{width:22px;height:26px}
 body:not(.cms-admin):not([data-rental-page]) .ref8-header[data-mobile-clinic-header] .ref8-header-top>.brand strong{font-size:16px}
}

/* A single, opaque mobile header layer. Its measured spacer preserves normal
   document scrolling; the accessibility reading mode retains its flow layout. */
.dental-mobile-header-space[hidden] { display: none !important; }
.dental-mobile-header-space:not([hidden]) { display: block; width: 100%; margin: 0; padding: 0; border: 0; pointer-events: none; }
@media (max-width:1199px) {
  html:not([data-reading-mode])[data-mobile-header-pinned] { scroll-padding-top: calc(var(--dental-mobile-header-height, 102px) + 24px); }
  html:not([data-reading-mode]) body:not(.cms-admin):not([data-rental-page]) > header.site-header.ref8-header[data-mobile-clinic-header][data-mobile-header-pinned] {
    position: fixed;
    top: var(--dental-mobile-header-top, 0px);
    right: 0;
    bottom: auto;
    left: 0;
    z-index: var(--z-header, 20);
    width: auto;
    max-width: none;
    margin: 0;
    padding-top: env(safe-area-inset-top, 0px);
    padding-right: env(safe-area-inset-right, 0px);
    padding-left: env(safe-area-inset-left, 0px);
    background: var(--color-canvas, #fff);
    isolation: isolate;
  }
  html:not([data-reading-mode]) body:not(.cms-admin):not([data-rental-page]) > header.site-header.ref8-header[data-mobile-clinic-header][data-mobile-header-pinned]::before {
    content: '';
    position: absolute;
    right: 0;
    bottom: 100%;
    left: 0;
    height: max(env(safe-area-inset-top, 0px), var(--dental-mobile-header-cover, 0px));
    background: var(--color-canvas, #fff);
    pointer-events: none;
  }
}
