/* Worktap v308: shared header mobile layout, independent of per-page headbar placement.
   Applies to every instance of these templates, including cloned IDs, regardless of page. */
@media (max-width: 767px) {
  nav.navbar[id^="nav-social-logo-offcanvas"] {width:100%;max-width:100%;box-sizing:border-box;}
  nav.navbar[id^="nav-social-logo-offcanvas"] > .container {
    display:block!important;width:100%!important;max-width:100%!important;
    padding:0 16px!important;box-sizing:border-box!important;margin:0 auto!important;
  }
  nav.navbar[id^="nav-social-logo-offcanvas"] > .container > .row {
    display:flex!important;flex-direction:column!important;align-items:center!important;
    justify-content:center!important;flex-wrap:nowrap!important;
    gap:11px!important;width:100%!important;max-width:100%!important;
    padding:0!important;margin:0!important;transform:none!important;
  }
  nav.navbar[id^="nav-social-logo-offcanvas"] > .container > .row > .col-auto,
  nav.navbar[id^="nav-social-logo-offcanvas"] > .container > .row > .col {
    float:none!important;position:relative!important;display:flex!important;
    flex:0 0 auto!important;align-self:center!important;width:100%!important;
    max-width:100%!important;min-width:0!important;padding:0!important;margin:0!important;
    justify-content:center!important;align-items:center!important;text-align:center!important;
  }
  nav.navbar[id^="nav-social-logo-offcanvas"] > .container > .row > .col-auto{order:0!important;}
  nav.navbar[id^="nav-social-logo-offcanvas"] > .container > .row > .col.text-right{
    order:1!important;gap:8px 15px!important;flex-wrap:wrap!important;
  }
  nav.navbar[id^="nav-social-logo-offcanvas"] > .container > .row > .col.hidden-sm{
    order:2!important;display:flex!important;visibility:visible!important;opacity:1!important;
  }
  nav.navbar[id^="nav-social-logo-offcanvas"] .navbar-brand {
    display:flex!important;align-items:center!important;justify-content:center!important;
    width:fit-content!important;max-width:100%!important;min-width:0!important;
    padding:0!important;margin:0 auto!important;transform:none!important;
  }
  nav.navbar[id^="nav-social-logo-offcanvas"] .navbar-brand img {
    display:block!important;width:auto!important;height:auto!important;max-width:100%!important;
    max-height:120px!important;margin:0 auto!important;object-fit:contain!important;
  }
  nav.navbar[id^="nav-social-logo-offcanvas"] .col.text-right > .wt-inline-phone-edit,
  nav.navbar[id^="nav-social-logo-offcanvas"] .col.text-right > a.btn {
    float:none!important;position:static!important;display:inline-flex!important;
    align-items:center!important;justify-content:center!important;
    margin:0!important;max-width:100%!important;text-align:center!important;
  }
  nav.navbar[id^="nav-social-logo-offcanvas"] .col.text-right .builder-phone-link{white-space:nowrap;}
  nav.navbar[id^="nav-social-logo-offcanvas"] .hidden-sm .inline-group {
    display:flex!important;flex-wrap:wrap!important;align-items:center!important;
    justify-content:center!important;gap:8px 18px!important;
    max-width:100%!important;margin:0 auto!important;
  }
  nav.navbar[id^="nav-social-logo-offcanvas"] .hidden-sm .inline-group > a {
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    min-width:28px!important;min-height:30px!important;opacity:1!important;visibility:visible!important;
  }
  nav.navbar[id^="nav-social-logo-offcanvas"] .hidden-sm .inline-group svg,
  nav.navbar[id^="nav-social-logo-offcanvas"] .hidden-sm .inline-group img {
    display:block!important;max-height:30px!important;max-width:40px!important;object-fit:contain!important;
  }
  nav.wt-auto-page-menu[id^="nav-pages-auto"] .wt-auto-page-menu__toggle {
    display:flex!important;justify-content:center!important;align-items:center!important;
    width:100%!important;text-align:center!important;
  }
  nav.wt-auto-page-menu[id^="nav-pages-auto"] .wt-auto-page-menu__list,
  nav.wt-auto-page-menu[id^="nav-pages-auto"] .wt-auto-page-menu__item,
  nav.wt-auto-page-menu[id^="nav-pages-auto"] .wt-auto-page-menu__link {text-align:center!important;}
}