/* #1637: navbar-only styles; page content and hero styles stay in their views. */
    /* Shared grouped navbar (#1637), sourced from the live WDH design. */
    /* partials/mk-header.ejs: the links sit beside the logo in two clusters split by a subtle 1px x 16px divider, the centre stays
       empty, and the right bar is [theme, language] | [Log in, Contact Us], icon buttons alike. The phone menu keeps the same order with
       separators where the dividers are. Colours come from the nav tokens, so the #1624 transparent/solid states and both themes hold. */
    #mk-navbar.mk-nav-grouped .mk-nav-cluster { display: flex; align-items: center; gap: inherit; }
    #mk-navbar.mk-nav-grouped .mk-nav-div { flex: none; width: 1px; height: 16px; background: var(--hairline); }
    @media (min-width: 1024px) { #mk-navbar.mk-nav-grouped .mk-nav-links { justify-self: start; } }
    @media (min-width: 1360px) { #mk-navbar.mk-nav-grouped .mk-nav-links { gap: 1.5rem; } }
    @media (max-width: 1023px) { #mk-navbar.mk-nav-grouped .mk-nav-right .mk-nav-div { display: none; } }
    #mk-navbar.mk-nav-grouped .mk-lang .mk-icon-btn { width: 34px; height: 34px; padding: 0; gap: 0; border-radius: 999px; border: 1px solid var(--hairline); background: transparent; color: var(--ink-muted); display: grid; place-items: center; cursor: pointer; }
    #mk-navbar.mk-nav-grouped .mk-lang .mk-icon-btn .mk-globe { width: 18px; height: 18px; }
    /* R2 (Ivan): the phone menu has no extra gaps or second Contact Us; every row has the same height with a thin divider line under it. */
    #mk-mobile-menu.mk-mobile-grouped > a, #mk-mobile-menu.mk-mobile-grouped > .mk-m-theme, #mk-mobile-menu.mk-mobile-grouped > .mk-m-lang { box-sizing: border-box; min-height: 52px; display: flex; align-items: center; margin: 0; border-bottom: 1px solid var(--hairline); }
    #mk-mobile-menu.mk-mobile-grouped > .mk-m-acc > summary { box-sizing: border-box; min-height: 51px; }

/* Keep multilingual phone controls on the same 52px rhythm as links and Theme.
   The globe labels the row visually; the full Language text remains its accessible name. */
@media (max-width: 1023px) {
  #mk-mobile-menu.mk-mobile-grouped > .mk-m-lang { padding: 0; gap: 12px; }
  #mk-mobile-menu.mk-mobile-grouped .mk-m-lang .mk-m-label { flex: none; gap: 0; font-size: 0; }
  #mk-mobile-menu.mk-mobile-grouped .mk-m-lang .mk-m-opts { flex-wrap: nowrap; gap: 6px; margin-top: 0; }
  #mk-mobile-menu.mk-mobile-grouped .mk-m-lang .mk-m-opts a { min-height: 40px; padding: 0 8px; font-size: .875rem; }
}

/* item 1811: shared CTA geometry and phone contact, scoped away from legacy nav. */
#mk-navbar .mk-nav-cta{font-weight:600}
@media(min-width:1024px) and (max-width:1359px){#mk-navbar .mk-nav-in{gap:12px}#mk-navbar .mk-nav-links,#mk-navbar.mk-nav-grouped .mk-nav-links{gap:12px}#mk-navbar .mk-nav-cluster{gap:10px}#mk-navbar .mk-nav-link{font-size:12px}#mk-navbar .mk-nav-right{gap:6px}#mk-navbar .mk-nav-cta{font-size:12px;padding:8px}#mk-navbar .mk-lockup{gap:6px}#mk-navbar .mk-wm{font-size:18px}}
@media(max-width:1023px){#mk-navbar .mk-nav-in{gap:8px}#mk-navbar .mk-nav-right{gap:6px}#mk-navbar .mk-nav-cta{font-size:12px;padding:8px 10px}#mk-navbar .mk-burger{width:36px;flex:none}}
.mk-fab-contact{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(var(--mk-contact-bottom,24px) + env(safe-area-inset-bottom,0px));width:52px;height:52px;min-width:48px;min-height:48px;display:grid;place-items:center;border-radius:50%;background:#2A5B98;color:#fff;box-shadow:0 3px 12px #0003;z-index:45;text-decoration:none}
.mk-fab-contact .mk-i{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8}
.mk-fab-contact:hover{background:#1F4F99}.mk-fab-contact:focus-visible{outline:3px solid #78A9F9;outline-offset:3px}
@media(min-width:1024px){.mk-fab-contact{display:none}}
@media(min-width:1360px){#mk-navbar .mk-nav-in{gap:24px}#mk-navbar.mk-nav-grouped .mk-nav-links{gap:16px}#mk-navbar .mk-nav-cluster{gap:16px}#mk-navbar .mk-nav-link{font-size:14px}#mk-navbar .mk-nav-right{gap:10px}}

/* item 1812 R2: desktop cluster gaps mirror the shared text-link navbar. */
@media(min-width:1024px) and (max-width:1359px){#mk-navbar.mk-nav-grouped .mk-nav-links{gap:10px}#mk-navbar.mk-nav-grouped .mk-nav-cluster{gap:8px}}
@media(min-width:1360px){#mk-navbar.mk-nav-grouped .mk-nav-links{gap:16px}#mk-navbar.mk-nav-grouped .mk-nav-cluster{gap:16px}}