/* Local native header: viewport-centred navigation independent of side widths. */
@media(min-width:1200px){
 header.header-site .header__inner{display:flex;justify-content:space-between}
 header.header-site .header-nav-desktop{position:absolute;left:0;right:0;top:0;width:max-content;max-width:none;margin:0 auto;justify-self:auto}
}
body.wab-header-compact header.header-site .header-nav-desktop{visibility:hidden;pointer-events:none}
body.wab-header-compact header.header-site .header-cta-desktop{display:block!important;position:absolute;right:0;visibility:hidden;pointer-events:none;width:max-content}
body.wab-header-compact header.header-site .header-nav-mobile{display:flex!important}
body.wab-header-compact header.header-site .header__lang-switcher{visibility:hidden;pointer-events:none}
body.wab-header-compact header.header-site .header-nav-mobile{align-items:center;gap:.45rem}
body.wab-header-compact header.header-site .header-whatsapp-link--mobile{display:inline-flex!important}

/* Native fullscreen menu: compact, left-aligned hierarchy. */
header.header-site .menu-bar__content{display:flex;flex-direction:column;height:100dvh;overflow-y:auto;overscroll-behavior:contain;padding-top:calc(var(--header-h) + var(--adminbar-h))}
header.header-site .menu-bar__main{display:block;flex:1 0 auto;height:auto;min-height:0;padding:22px 0 0;overflow:visible}
header.header-site .menu-bar__top-inner{padding-left:0;padding-right:0}
header.header-site .menu-bar__list,header.header-site .menu-bar__sublist{text-align:left;margin:0;padding:0}
header.header-site .menu-bar__item{margin:0 0 14px;padding:0}
header.header-site .menu-bar__link{font-family:Effra,sans-serif;font-size:clamp(28px,4vw,36px);font-weight:700;line-height:1.15;letter-spacing:0;text-transform:none;padding:3px 0;color:#f5f5f2;text-decoration:none}
header.header-site .menu-bar__sublist{display:block!important;padding:9px 0 2px}
header.header-site .menu-bar__subitem{margin:0 0 4px!important}
header.header-site .menu-bar__sublink{font-family:Effra,sans-serif;font-size:18px;font-weight:400;line-height:1.4;padding:5px 0;color:rgba(245,245,242,.72);text-decoration:none}
header.header-site .menu-bar :is(.menu-bar__link,.menu-bar__sublink):is(:hover,:focus-visible){color:#fff;text-decoration:none}
header.header-site .menu-bar :is(.menu-bar__link,.menu-bar__sublink)[aria-current="page"]{color:var(--wab-coral);font-weight:700;text-decoration:none}
header.header-site .menu-bar :is(.menu-bar__link,.menu-bar__sublink)::after{display:none}
header.header-site .menu-bar__footer{position:static;inset:auto;flex:0 0 auto;padding:22px 0 max(24px,env(safe-area-inset-bottom));background:none}
header.header-site .menu-bar__footer-inner{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:12px}
header.header-site .menu-bar__item{opacity:0;transform:translateY(6px);transition:opacity .18s ease,transform .18s ease;transition-delay:0s}
header.header-site .menu-bar--toggled .menu-bar__item{opacity:1;transform:none;transition-delay:calc(var(--menu-order,0)*25ms)}
@media(prefers-reduced-motion:reduce){header.header-site .menu-bar,header.header-site .menu-bar__item{transition:none!important;transform:none!important}}
body.menu-open{overflow:hidden}
/* QA: legacy mobile resets must not remove the shared gutter or add a second header gap. */
header.header-site .menu-bar__main{margin-top:0!important}
header.header-site .menu-bar__main>.container{width:calc(100% - var(--container-gutter)*2);max-width:1280px;margin-left:auto;margin-right:auto}
header.header-site .menu-bar__top-left{margin-left:0!important}
body.wab-local-ui-contract.menu-open{overflow:hidden!important}
header.header-site .menu-bar__main>.container{padding-left:0;padding-right:0}
header.header-site .menu-bar__footer .wab-menu-shared-button{margin:0!important}

/* Ben19Oct: centre the tablet menu content, retaining left-aligned text and native top bar. */
@media(min-width:600px) and (max-width:1199px){
 header.header-site .menu-bar__main>.container,
 header.header-site .menu-bar__footer>.container{
  width:calc(100% - 64px);max-width:560px;margin-left:auto;margin-right:auto;
 }
}

/* Ben19Oct: one header switch at1100px, Contact remains a normal menu link. */
@media(min-width:1100px){
 header.header-site .header__inner{display:flex;justify-content:space-between}
 header.header-site .header-nav-desktop{display:block;position:absolute;left:0;right:0;top:0;width:max-content;max-width:none;margin:0 auto;height:var(--header-h)}
 body:not(.wab-header-compact) header.header-site .header-nav-mobile{display:none!important}
}
header.header-site .header-cta-desktop,
body.wab-header-compact header.header-site .header-cta-desktop{
 display:flex!important;align-items:center;justify-content:flex-end;position:absolute;top:0;bottom:auto;left:auto;right:0;width:max-content;margin:0;visibility:visible;pointer-events:auto;height:var(--header-h);
}
body.wab-header-actions-second-row header.header-site .header-cta-desktop{top:calc(var(--header-h) - 4px);height:auto}
header.header-site .header-contact-actions{display:flex;align-items:center}
body.wab-header-compact header.header-site .header-whatsapp-link--mobile{display:none!important}
header.header-site .header__right{gap:8px}
body.menu-open header.header-site .header-cta-desktop{visibility:hidden;pointer-events:none}
@media(min-width:1100px) and (max-width:1199px){
 header.header-site .header-nav-desktop{transition:opacity .2s ease,transform .2s ease}
 body.header-secondary-hidden header.header-site .header-nav-desktop{opacity:0;transform:translateY(-10px);pointer-events:none}
}
@media(prefers-reduced-motion:reduce){header.header-site .header-nav-desktop{transition:none!important}}



/* CSS initial states match the sole JS media query, including without JS. */
@media not all and (min-width:1100px){
 header.header-site .header-nav-desktop{display:none!important}
 header.header-site .header-nav-mobile{display:flex!important}
 header.header-site .header-cta-desktop{top:calc(var(--header-h) - 4px);height:auto}
}

/* Compact header clearance: 42px action row starts4px above header bottom, plus26px breathing room. */
@media not all and (min-width:1100px){
 body.wab-local-ui-contract{--wab-header-content-start:calc(var(--header-h) + 64px)}
}
@media(max-width:650px){
 body.wab-local-ui-contract .studio-pages.studio-pages--contact .sp-hero.sp-hero--contact{padding-top:var(--wab-header-content-start)!important}
}

/* Services dropdown reuses the overview's icon classes and service tones. */
header.header-site .header-nav-desktop :is(.sub-menu,.sub-menu__item){list-style:none!important}
header.header-site .header-nav-desktop .sub-menu__item::marker{content:""}
header.header-site .header-nav-desktop .sub-menu__item::before,header.header-site .header-nav-desktop .sub-menu__item::after{content:none!important;display:none!important}
header.header-site .header-nav-desktop .sub-menu__link{display:flex;align-items:center;gap:14px}
header.header-site .header-service-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 42px;width:42px;height:42px;border-radius:10px;color:#fff;background:var(--service-tone);font-size:20px;line-height:1}
header.header-site .header-service-icon--brand{--service-tone:#7054ad}
header.header-site .header-service-icon--web{--service-tone:var(--wab-blue)}
header.header-site .header-service-icon--systems{--service-tone:var(--wab-coral);color:#101117}

/* Header portrait: a complete fixed circle with equal visual inset, all breakpoints. */
header.header-site .header-contact-pill{padding-left:5px;padding-top:5px;padding-bottom:5px}
header.header-site .header-contact-pill__avatar{flex:0 0 30px;width:30px;height:30px;min-width:30px;max-width:30px;border-radius:50%;object-fit:cover;object-position:center;align-self:center}

/* Narrow native planner: let the title shrink beside its fixed close control. */
@media(max-width:359px){
 #contact-intake-modal .contact-modal__dialog{min-width:0;max-width:100%;box-sizing:border-box}
 #contact-intake-modal .contact-modal__top{display:block}
 #contact-intake-modal .contact-modal__top>div{min-width:0;width:100%}
 #contact-intake-modal .contact-modal__close{position:absolute;top:.95rem;right:.95rem}
 #contact-intake-modal .contact-modal__top .section__eyebrow{min-height:42px;padding-right:50px}
 #contact-intake-modal .contact-modal__top .section__heading{font-size:24px;overflow-wrap:normal;word-break:normal}
 #contact-intake-modal .quick-contact-modal__grid{grid-template-columns:minmax(0,1fr)}
 #contact-intake-modal .quick-contact-modal__grid>*{min-width:0}
}

/* Native submenu keeps its parent highlighted while entering the submenu.
   Theme tokens remain authoritative, so light/dark restores automatically on close. */
@media(min-width:1100px){
 body.desktop-submenu-open header.header-site .header-nav__list>.header-nav__item>.header-nav__link{color:var(--header-fg-muted)}
 body.desktop-submenu-open header.header-site .header-nav__list>.header-nav__item.submenu-active>.header-nav__link,
 body.desktop-submenu-open header.header-site .header-nav__list>.header-nav__item>.header-nav__link:is(:hover,:focus-visible){color:var(--header-fg)}
 header.header-site .sub-menu__link:focus-visible{color:var(--header-fg)}
}
/* Match the single1100px desktop breakpoint for the existing native open surface. */
@media(min-width:1100px) and (max-width:1199px){
 body.desktop-submenu-open header.header-site::after{opacity:1}
 body.desktop-submenu-open .submenu-overlay{opacity:1;pointer-events:all;background:rgba(0,0,0,.78)}
 body.desktop-submenu-open.header-on-light .submenu-overlay{background:rgba(0,0,0,.62)}
}

/* One desktop spacing contract from the sole1100px menu switch.
   Supersedes legacy1200 compact and1400–1519 balanced-menu spacing. */
@media(min-width:1100px){
 header.header-site .header-nav-desktop .header-nav__list{display:flex;justify-content:center;gap:.18rem;width:max-content;flex-grow:0}
 header.header-site .header-nav-desktop .header-nav__list>.header-nav__item{flex:0 0 auto}
 header.header-site .header-nav-desktop .header-nav__link{font-size:.88rem;padding-left:.72rem;padding-right:.72rem}
}

/* Selected Nav photo093: focus only these3avatar consumers, preserving existing circles/sizing. */
#contact-intake-modal .quick-contact-modal__avatar{object-fit:cover;object-position:43% 28%}
.local-personal-contact .local-personal-contact__avatar{object-fit:cover;object-position:36% 43%}

/* Ben: retain the previous CTA portrait; selected093 stays in modal/personal card. */
header.header-site .header-contact-pill__avatar{object-position:center}

/* Mobile scroll readability: cover both sticky rows; hero top remains transparent. */
@media not all and (min-width:1100px){
 body.wab-local-ui-contract.is-scrolled:not(.menu-open) header.header-site::after{opacity:1;bottom:calc(-1 * var(--wab-header-extra-row,42px));background:var(--header-surface)}
}

/* In-page service anchors clear both compact sticky rows plus18px breathing room. */
@media not all and (min-width:1100px){
 body.wab-local-ui-contract :is(.ws-service-direction[id],.ws-offer-item[id],.wab-content-panel[id],.svc-section[id],.ws-journey[id],.ws-offer[id],.ws-care[id],.br-offer[id],.nl-offer[id],.local-personal-contact[id],.local-personal-contact__anchor[id]){scroll-margin-top:calc(var(--header-h) + var(--wab-header-extra-row,42px) + 14px)!important}
}

/* Ben21Oct: compact header always one row; no fit-driven second-row state. */
@media(max-width:1099.98px){
 body.wab-local-ui-contract{--wab-header-extra-row:0px;--wab-header-content-start:calc(var(--header-h) + 22px)}
 body.wab-local-ui-contract header.header-site .header-cta-desktop{position:static!important;inset:auto!important;height:var(--header-h);width:max-content}
 body.wab-local-ui-contract header.header-site .header__right{display:flex;align-items:center;gap:12px;flex-shrink:0}
 body.wab-local-ui-contract header.header-site .header-contact-actions{gap:8px}
 body.wab-local-ui-contract header.header-site :is(.header-whatsapp-link,.menu-button){min-width:44px;min-height:44px;box-sizing:border-box}
}
@media(max-width:485.98px){
 body.wab-local-ui-contract header.header-site .header__right{gap:8px}
}
@media(max-width:339.98px){
 body.wab-local-ui-contract header.header-site .header__right{gap:6px}
 body.wab-local-ui-contract header.header-site .header-contact-actions{gap:6px}
}
/* Fullscreen menu paints the complete dynamic viewport, including the safe area. */
html.wab-menu-locked{overflow:hidden;overscroll-behavior:none}
body.wab-local-ui-contract.menu-open{overscroll-behavior:none;background:#101117}
body.wab-local-ui-contract header.header-site .menu-bar{height:100vh;height:100svh;height:100dvh;bottom:auto;background:#101117;overscroll-behavior:none}
body.wab-local-ui-contract header.header-site .menu-bar__content{height:100%;min-height:0;padding-bottom:env(safe-area-inset-bottom,0px);box-sizing:border-box;-webkit-overflow-scrolling:touch}

/* Google FAQ permits badge visibility:hidden while visible branding stays in the form flow. */
body.wab-local-ui-contract .grecaptcha-badge{visibility:hidden!important}
body.wab-local-ui-contract .wab-recaptcha-disclosure{display:block;margin:14px 0 0;font:400 12px/1.5 Effra,sans-serif;color:inherit}

/* Compact identity and call control must not shrink below their44px targets. */
@media(max-width:1099.98px){
 body.wab-local-ui-contract header.header-site .header__left{flex-shrink:0}
 body.wab-local-ui-contract header.header-site .header__brand{min-width:44px;min-height:44px;flex-shrink:0}
 body.wab-local-ui-contract header.header-site .header-contact-pill{min-height:44px}
}
@media(max-width:485.98px){
 body.wab-local-ui-contract header.header-site .header__right{gap:6px}
 body.wab-local-ui-contract header.header-site .header-contact-actions{gap:6px}
}

/* Ben21Oct: mobile top/down/idle fade, section-matched surface only while scrolling up. */
@media(max-width:1099.98px){
 body.wab-local-ui-contract:not(.menu-open) header.header-site::after,
 body.wab-local-ui-contract.is-scrolled:not(.menu-open) header.header-site::after{opacity:1;bottom:0;background:linear-gradient(to bottom,rgba(0,0,0,.36),rgba(0,0,0,0));backdrop-filter:none;-webkit-backdrop-filter:none;transition:background .18s ease,backdrop-filter .18s ease}
 body.wab-local-ui-contract.header-on-light:not(.menu-open) header.header-site::after{background:linear-gradient(to bottom,rgba(250,249,246,.92),rgba(250,249,246,0))}
 body.wab-local-ui-contract.is-scrolled.wab-header-scroll-up:not(.menu-open) header.header-site::after{background:var(--header-surface);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
 body.wab-local-ui-contract.menu-open header.header-site{--header-fg:#fff;--header-fg-muted:rgba(255,255,255,.7)}
 body.wab-local-ui-contract.menu-open header.header-site::after{opacity:1;background:#101117;backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media(max-width:1099.98px) and (prefers-reduced-motion:reduce){body.wab-local-ui-contract header.header-site::after{transition:none!important}}

/* Latest Ben: compact toolbar has only WhatsApp + Menu; call action lives once in menu. */
@media(max-width:1099.98px){
 body.wab-local-ui-contract header.header-site .header-cta-desktop .header-contact-pill{display:none!important}
}
body.wab-local-ui-contract header.header-site .menu-bar__footer-inner{justify-content:center;flex-wrap:nowrap;gap:12px}
body.wab-local-ui-contract header.header-site .menu-bar__footer .header-contact-pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;width:auto;padding:5px 16px 5px 5px;box-sizing:border-box;background:#fff;color:#101117;border-radius:999px}
body.wab-local-ui-contract header.header-site .menu-bar__footer .header-contact-pill>span{display:inline}
body.wab-local-ui-contract header.header-site .menu-bar__footer .header-whatsapp-link{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;min-height:44px;box-sizing:border-box}

/* Open menu is solid black, including native scrollbar gutter and safe-area paint. */
body.wab-local-ui-contract.menu-open{background:#000!important}
body.wab-local-ui-contract header.header-site :is(.menu-bar,.menu-bar__content,.menu-bar__top){background:#000!important;color-scheme:dark;scrollbar-color:#555 #000}
body.wab-local-ui-contract header.header-site .menu-bar__content::-webkit-scrollbar-track{background:#000}
body.wab-local-ui-contract header.header-site .menu-bar__content::-webkit-scrollbar-thumb{background:#555;border:3px solid #000;border-radius:999px}
@media(max-width:1099.98px){body.wab-local-ui-contract.menu-open header.header-site::after{background:#000!important}}

/* Text-only call pills keep equal insets after the intentional portrait deduplication. */
body.wab-local-ui-contract header.header-site .header-contact-pill:not(:has(>.header-contact-pill__avatar)){padding-left:1rem;padding-right:1rem;justify-content:center;gap:0}