/* ========================================================================== 
   UBC MOBILE NAVIGATION SHEET + GOOGLE-LIKE SERVICE SEARCH - batch 176K
   Mobile-only redesign. Desktop historical menu/gradients remain unchanged.
   ========================================================================== */
.ubc-mobile-header-toggle-host,
.ubc-mobile-search-zone,
.ubc-mobile-menu-search-slot,
.ubc-mobile-menu-contact-slot,
.ubc-mobile-menu-brand,
.ubc-menu-note,
.ubc-mobile-category-landing { display: none; }


@media (max-width: 900px) {
  .pilot-logo-wordmark,
  .ubc-mobile-menu-brand .pilot-logo-wordmark {
    display: none !important;
  }
}
@media (max-width: 900px) {
  html { background: #d4d6db; }
  body.ubc-page {
    margin: 0 !important;
    background: #d4d6db !important;
  }
  body.ubc-page > .site-shell,
  body.ubc-page .site-shell {
    width: calc(100% - 10px) !important;
    max-width: none !important;
    margin-right: 5px !important;
    margin-left: 5px !important;
    padding-right: 5px !important;
    padding-left: 5px !important;
    box-sizing: border-box !important;
    background: #fff !important;
  }

  .header-visual-inner {
    width: 100% !important;
    margin: 0 !important;
    background: #fff !important;
  }
  .header-brand-row {
    position: relative !important;
    display: flex !important;
    min-height: 72px !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    padding: 9px 52px 9px 8px !important;
    box-sizing: border-box !important;
    background: #fff !important;
  }
  .header-brand-row .logo-link {
    width: min(56vw, 214px) !important;
    margin: 0 !important;
  }
  .header-contacts { display: none !important; }
  .header-visual-inner .hero { display: block !important; width: 100% !important; height: auto !important; min-height: 0 !important; overflow: hidden !important; }
  .header-visual-inner .hero-track,
  .header-visual-inner .hero-slide { display: block !important; width: 100% !important; height: auto !important; min-height: 0 !important; }
  .header-visual-inner .hero-slide img { position: relative !important; inset: auto !important; display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; aspect-ratio: 7 / 1 !important; object-fit: contain !important; object-position: center !important; transform: none !important; }
  .header-visual-inner .logo-rule {
    display: block !important;
    width: 100% !important;
    height: 4px !important;
    min-height: 4px !important;
    margin: 0 !important;
    border-top: 1px solid #aeb2ba !important;
    border-bottom: 1px solid #d2d5da !important;
    box-sizing: border-box !important;
    background: #fff !important;
    background-image: none !important;
  }

  .ubc-mobile-header-toggle-host {
    position: absolute;
    top: 50%;
    right: 3px;
    z-index: 6100;
    display: flex;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    transform: translateY(-50%);
  }
  .ubc-mobile-header-toggle-host.ubc-mobile-hamburger-stuck {
    position: fixed !important;
    top: calc(8px + env(safe-area-inset-top, 0px)) !important;
    right: max(8px, env(safe-area-inset-right, 0px)) !important;
    transform: none !important;
    border-radius: 6px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 2px 9px rgba(0,0,0,.12);
  }
  .ubc-mobile-header-toggle-host .nav-toggle,
  html.ubc-menu-ui-compact .ubc-mobile-header-toggle-host .nav-toggle {
    display: flex !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    flex: 0 0 44px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    pointer-events: auto !important;
  }
  .ubc-mobile-header-toggle-host .nav-toggle-icon,
  html.ubc-menu-ui-compact .nav-toggle-icon {
    width: 25px !important;
    height: 18px !important;
  }
  .ubc-mobile-header-toggle-host .nav-toggle-icon span,
  html.ubc-menu-ui-compact .nav-toggle-icon span {
    height: 2px !important;
    border-radius: 0 !important;
    background: #00009F !important;
  }

  /* Closed menu shell occupies no visual row. Search lives in its permanent
     header zone; the same DOM component is moved into the sheet when opened. */
  html.ubc-menu-ui-compact .main-nav-wrap:not(.menu-open),
  .main-nav-wrap:not(.menu-open) {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: 100% !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    pointer-events: none !important;
  }
  html.ubc-menu-ui-compact .main-nav-wrap:not(.menu-open) .mobile-nav-bar { display: none !important; }

  .ubc-mobile-search-zone {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 9px 7px 11px;
    background-color: #f6f7f8;
    background-image: url("../image/mobile-header-silver-gradient.svg");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 100%;
  }
  .ubc-mobile-search-bundle {
    position: relative;
    width: 100%;
    box-sizing: border-box;
  }
  .ubc-menu-search,
  html.ubc-menu-ui-compact .ubc-menu-search,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .ubc-menu-search {
    position: relative;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 28px auto !important;
    gap: 5px;
    width: 100%;
    min-height: 50px !important;
    height: 50px !important;
    align-items: center;
    box-sizing: border-box;
    padding: 5px 5px 5px 14px !important;
    overflow: hidden;
    border: 1px solid #b9bec7 !important;
    border-radius: 25px !important;
    background: #fff !important;
    background-image: none !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.08) !important;
  }
  html.ubc-menu-ui-compact .ubc-menu-search:focus-within,
  .ubc-menu-search:focus-within {
    border-color: #00009F !important;
    box-shadow: 0 1px 5px rgba(0,0,159,.12) !important;
  }
  html.ubc-menu-ui-compact .ubc-menu-search-input,
  .ubc-menu-search-input {
    width: 100% !important;
    min-width: 0 !important;
    height: 38px !important;
    margin: 0 !important;
    padding: 0 3px 0 0 !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #222 !important;
    font-size: 15px !important;
    line-height: 38px !important;
  }
  .ubc-menu-search-input::-webkit-search-decoration { display: none; }
  .ubc-menu-search-category {
    display: flex;
    width: 28px;
    min-width: 28px;
    height: 38px;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0;
    appearance: none;
    -webkit-appearance: none;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    color: #00009F !important;
    font-size: 27px;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    touch-action: manipulation;
    transition: transform .15s ease, color .15s ease, opacity .15s ease;
  }
  .ubc-menu-search-category:active { transform: scale(.88); }
  .ubc-category-open .ubc-menu-search-category {
    color: #00009F !important;
    opacity: .72;
  }
  .ubc-menu-search-submit,
  html.ubc-menu-ui-compact body.ubc-page button.ubc-menu-search-submit,
  html.ubc-menu-ui-compact body.ubc-page button.ubc-menu-search-submit-premium {
    position: relative !important;
    display: inline-flex !important;
    min-width: 0 !important;
    height: 38px !important;
    min-height: 38px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 0 13px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 999px !important;
    outline: 0 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-color: #e3e5e8 !important;
    background-image: url("../image/mobile-search-button-silver.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 100% 100% !important;
    color: #00009F !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    box-shadow: 0 1px 2px rgba(28,34,48,.12), inset 0 1px rgba(255,255,255,.78) !important;
    text-shadow: 0 1px rgba(255,255,255,.72);
    touch-action: manipulation;
    isolation: isolate;
  }
  .ubc-menu-search-submit:active,
  html.ubc-menu-ui-compact body.ubc-page button.ubc-menu-search-submit-premium:active {
    transform: translateY(1px);
    box-shadow: inset 0 1px 2px rgba(40,46,58,.14) !important;
  }
  .ubc-menu-search-submit::after {
    content: "";
    position: absolute;
    top: -45%;
    bottom: -45%;
    left: -55%;
    width: 34%;
    opacity: 0;
    transform: skewX(-18deg);
    background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.72), rgba(206,211,219,.24), rgba(255,255,255,0));
    pointer-events: none;
  }
  .ubc-menu-search-submit.is-intro-sweep::after {
    animation: ubc-search-silver-sweep .95s ease-out 1;
  }
  .ubc-menu-search-magnifier {
    display: flex;
    width: 19px;
    min-width: 19px;
    height: 19px;
    align-items: center;
    justify-content: center;
    transform-origin: center;
  }
  .ubc-menu-search-magnifier svg {
    display: block;
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
  }
  .ubc-menu-search-submit.is-magnifier-pulse .ubc-menu-search-magnifier {
    animation: ubc-search-magnifier-pulse .55s ease-out 1;
  }
  @keyframes ubc-search-silver-sweep {
    0% { left: -55%; opacity: 0; }
    18% { opacity: .8; }
    100% { left: 125%; opacity: 0; }
  }
  @keyframes ubc-search-magnifier-pulse {
    0%,100% { transform: scale(1); }
    45% { transform: scale(1.10); }
  }

  .ubc-menu-search-category-status {
    display: none;
    min-height: 0;
    padding: 4px 14px 0;
    color: #555b65;
    font-size: 11px;
    line-height: 1.25;
  }
  .ubc-menu-search-category-status.is-visible { display: block; }
  .ubc-menu-search-category-status::first-line { color: #00009F; }

  .ubc-menu-search-category-popover {
    position: absolute;
    top: 55px;
    right: 5px;
    left: 5px;
    z-index: 6300;
    display: none;
    max-height: min(55dvh, 430px);
    overflow-y: auto;
    box-sizing: border-box;
    padding: 5px;
    border: 1px solid #aeb4bd;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0,0,0,.18);
    overscroll-behavior: contain;
  }
  .ubc-category-open .ubc-menu-search-category-popover { display: grid; gap: 4px; }
  .ubc-menu-category-option {
    display: grid;
    gap: 2px;
    width: 100%;
    padding: 8px 10px;
    border: 0;
    border-bottom: 1px solid #e1e3e7;
    background: #fff;
    color: #00009F;
    text-align: left;
    cursor: pointer;
  }
  .ubc-menu-category-option:last-child { border-bottom: 0; }
  .ubc-menu-category-option strong { font-size: 14px; line-height: 1.2; }
  .ubc-menu-category-option span { color: #666c74; font-size: 11px; line-height: 1.2; }

  .ubc-menu-search-results,
  html.ubc-menu-ui-compact .ubc-menu-search-results {
    display: none !important;
    width: 100%;
    box-sizing: border-box;
    margin-top: 6px;
    overflow-x: hidden;
    overflow-y: auto;
    border: 1px solid #d2d5da;
    border-radius: 4px;
    background: #fff !important;
    background-image: none !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.08);
  }
  .ubc-search-has-results > .ubc-menu-search-results,
  html.ubc-menu-ui-compact .ubc-search-has-results > .ubc-menu-search-results {
    display: grid !important;
  }
  .ubc-mobile-search-zone .ubc-menu-search-results { max-height: min(38dvh, 315px); }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .ubc-menu-search-results {
    max-height: none !important;
    padding: 0 !important;
  }
  html.ubc-menu-ui-compact .ubc-menu-search-result,
  .ubc-menu-search-result {
    display: grid;
    gap: 2px;
    min-width: 0;
    padding: 9px 10px;
    border: 0;
    border-bottom: 1px solid #e1e3e6;
    background: #fff !important;
    color: #00009F;
    text-decoration: none;
  }
  .ubc-menu-search-result:last-child { border-bottom: 0; }
  html.ubc-menu-ui-compact .ubc-menu-search-result strong,
  .ubc-menu-search-result strong { font-size: 15px; line-height: 1.22; }
  html.ubc-menu-ui-compact .ubc-menu-search-result span,
  .ubc-menu-search-result span {
    overflow: hidden;
    color: #626871;
    font-size: 11px;
    line-height: 1.2;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  html.ubc-menu-ui-compact .ubc-menu-search-empty,
  .ubc-menu-search-empty {
    padding: 16px 10px;
    color: #555b65;
    font-size: 14px;
    text-align: center;
  }

  /* Navigation sheet: full-width within the paper canvas and full viewport
     height. Contacts stay inside the sheet; there is no empty bottom zone. */
  .ubc-menu-backdrop,
  .ubc-menu-backdrop.is-visible {
    background: rgba(94,98,106,.34) !important;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open,
  .main-nav-wrap.menu-open {
    position: fixed !important;
    top: env(safe-area-inset-top, 0px) !important;
    right: 5px !important;
    left: 5px !important;
    z-index: 6000 !important;
    display: block !important;
    width: calc(100vw - 10px) !important;
    max-width: none !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 5px 10px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
    pointer-events: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .mobile-nav-bar,
  .main-nav-wrap.menu-open .mobile-nav-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 6250 !important;
    display: flex !important;
    width: 100% !important;
    min-height: 72px !important;
    height: 72px !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 8px 3px 8px 9px !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-bottom: 3px double #b6bac2 !important;
    background: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
    pointer-events: auto !important;
  }
  .ubc-mobile-menu-brand {
    display: flex !important;
    width: min(53vw, 204px) !important;
    align-items: center;
    justify-content: flex-start;
  }
  .ubc-mobile-menu-brand img {
    display: block;
    width: 100%;
    height: auto;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .nav-toggle,
  .main-nav-wrap.menu-open .nav-toggle {
    display: flex !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    flex: 0 0 44px !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  .ubc-mobile-menu-search-slot {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 9px 7px 10px;
    background-color: #f6f7f8;
    background-image: url("../image/mobile-header-silver-gradient.svg");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 100%;
  }
  .ubc-mobile-menu-search-slot:empty { display: none; }

  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .main-nav,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .main-nav.open,
  .main-nav-wrap.menu-open .main-nav,
  .main-nav-wrap.menu-open .main-nav.open {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 10px 7px 3px !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    background: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open.ubc-search-active .main-nav,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open.ubc-search-active .main-nav.open { display: none !important; }

  html.ubc-menu-ui-compact .main-nav > .nav-item,
  .main-nav > .nav-item {
    display: block !important;
    width: 100% !important;
    margin: 0 0 9px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }
  /* Page-like accordion: never hide sibling categories. */
  html.ubc-menu-ui-compact .main-nav.ubc-sublevel-open > .nav-item:not(.open),
  html.ubc-menu-ui-compact .mega-menu.ubc-thirdlevel-open > .mega-group:not(.is-expanded) {
    display: block !important;
  }

  html.ubc-menu-ui-compact .nav-item > .nav-button,
  html.ubc-menu-ui-compact .nav-item > .nav-link,
  html.ubc-menu-ui-compact .nav-link,
  html.ubc-menu-ui-compact .nav-button {
    display: flex !important;
    width: 100% !important;
    min-height: 56px !important;
    height: auto !important;
    max-height: none !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 3px !important;
    box-sizing: border-box !important;
    padding: 8px 11px !important;
    border: 1px solid #00009F !important;
    border-radius: 4px !important;
    background: #f3f4f6 !important;
    background-image: none !important;
    color: #202020 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: left !important;
    white-space: normal !important;
    box-shadow: none !important;
  }
  html.ubc-menu-ui-compact .nav-item.open > .nav-button,
  html.ubc-menu-ui-compact .nav-item.open > .nav-link-dropdown {
    color: #00009F !important;
    font-size: 18px !important;
    background: #eff0f3 !important;
  }
  .ubc-menu-note {
    display: block !important;
    width: 100%;
    overflow: hidden;
    color: #666b73 !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  html.ubc-menu-ui-compact .submenu,
  html.ubc-menu-ui-compact .nav-item.open > .submenu,
  html.ubc-menu-ui-compact .submenu.mega-menu,
  html.ubc-menu-ui-compact .nav-item.open > .submenu.mega-menu {
    position: static !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 7px 0 0 !important;
    padding: 7px !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #f1f2f4 !important;
    background-image: none !important;
    box-shadow: none !important;
    transform: none !important;
  }
  html.ubc-menu-ui-compact .submenu:not(.mega-menu) { display: none !important; }
  html.ubc-menu-ui-compact .nav-item.open > .submenu:not(.mega-menu) {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }
  html.ubc-menu-ui-compact .submenu:not(.mega-menu) > li {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }
  html.ubc-menu-ui-compact .submenu:not(.mega-menu) > li > a,
  html.ubc-menu-ui-compact .submenu:not(.mega-menu) > li > a:hover,
  html.ubc-menu-ui-compact .submenu:not(.mega-menu) > li > a:focus-visible {
    display: flex !important;
    width: 100% !important;
    min-height: 50px !important;
    height: auto !important;
    max-height: none !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 3px !important;
    box-sizing: border-box !important;
    padding: 7px 9px !important;
    overflow: visible !important;
    border: 1px solid #e58000 !important;
    border-radius: 2px !important;
    background: #fff !important;
    background-image: none !important;
    color: #202020 !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.16 !important;
    white-space: normal !important;
    text-decoration: none !important;
  }
  html.ubc-menu-ui-compact .submenu:not(.mega-menu) > li > a:hover,
  html.ubc-menu-ui-compact .submenu:not(.mega-menu) > li > a:focus-visible,
  html.ubc-menu-ui-compact .submenu:not(.mega-menu) > li > a:active {
    color: #00009F !important;
    font-size: 16px !important;
    font-weight: 700 !important;
  }

  html.ubc-menu-ui-compact .nav-item.open > .submenu.mega-menu {
    display: block !important;
  }
  html.ubc-menu-ui-compact .mega-group {
    display: block !important;
    width: 100% !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }
  html.ubc-menu-ui-compact .mega-group:last-child { margin-bottom: 0 !important; }
  html.ubc-menu-ui-compact .mega-group-heading {
    display: block !important;
    width: 100% !important;
    min-height: 50px !important;
    height: auto !important;
    max-height: none !important;
    box-sizing: border-box !important;
    border: 1px solid #e58000 !important;
    border-radius: 2px !important;
    background: #fff !important;
    background-image: none !important;
  }
  html.ubc-menu-ui-compact .mega-group-toggle,
  html.js.ubc-menu-ui-compact .mega-group-toggle { display: none !important; }
  html.ubc-menu-ui-compact .submenu .mega-group-title,
  html.ubc-menu-ui-compact .submenu .mega-group-title:hover,
  html.ubc-menu-ui-compact .submenu .mega-group-title:focus-visible {
    display: flex !important;
    width: 100% !important;
    min-height: 50px !important;
    height: auto !important;
    max-height: none !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 3px !important;
    box-sizing: border-box !important;
    padding: 7px 9px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 2px !important;
    background: #fff !important;
    color: #202020 !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.16 !important;
    white-space: normal !important;
    text-decoration: none !important;
  }
  html.ubc-menu-ui-compact .mega-group.is-expanded .mega-group-title {
    color: #e58000 !important;
    font-size: 18px !important;
    font-weight: 700 !important;
  }

  html.ubc-menu-ui-compact .mega-group-list,
  html.ubc-menu-ui-compact .mega-group-regions .mega-group-list {
    position: static !important;
    display: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: none !important;
    margin: 4px 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    columns: auto !important;
    column-count: 1 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
  }
  html.js.ubc-menu-ui-compact .mega-group.is-expanded .mega-group-list {
    display: block !important;
  }
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list li,
  html.ubc-menu-ui-compact .mega-group-regions .mega-group-list li {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid #dfe1e5 !important;
    background: #fff !important;
  }
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list li:last-child { border-bottom: 0 !important; }
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list li a,
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list li a:hover,
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list li a:focus-visible,
  html.ubc-menu-ui-compact .mega-group-regions .mega-group-list li a {
    display: flex !important;
    width: 100% !important;
    min-height: 42px !important;
    height: auto !important;
    max-height: none !important;
    align-items: center !important;
    box-sizing: border-box !important;
    padding: 7px 9px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    background-image: none !important;
    color: #202020 !important;
    font-size: 14.5px !important;
    font-weight: 400 !important;
    line-height: 1.18 !important;
    white-space: normal !important;
    text-decoration: none !important;
  }
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list li a:hover,
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list li a:focus-visible,
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list li a:active {
    color: #00009F !important;
    font-size: 15px !important;
    font-weight: 700 !important;
  }
  html.ubc-menu-ui-compact .ubc-mobile-category-landing {
    display: block !important;
    border-bottom: 1px solid #e58000 !important;
  }
  html.ubc-menu-ui-compact .ubc-mobile-category-landing > a {
    color: #00009F !important;
    font-weight: 700 !important;
  }

  /* All historical mobile menu gradients/textures are suppressed. */
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open *,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open *::before,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open *::after {
    background-image: none;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .ubc-mobile-menu-search-slot {
    background-image: url("../image/mobile-header-silver-gradient.svg") !important;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .ubc-menu-search-submit::after {
    background-image: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.34), rgba(255,255,255,0));
  }

  .ubc-mobile-menu-contact-slot {
    position: sticky;
    bottom: 0;
    z-index: 6240;
    display: flex;
    width: calc(100% - 14px);
    min-height: 58px;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    box-sizing: border-box;
    margin: 8px 7px 0;
    padding: 7px 8px calc(7px + env(safe-area-inset-bottom, 0px)) 10px;
    border-top: 1px solid #d7d9dd;
    background: rgba(245,246,247,.98);
    box-shadow: 0 -4px 10px rgba(0,0,0,.04);
  }
  .ubc-mobile-menu-contact-label {
    color: #00009F;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
  }
  .ubc-mobile-menu-contact-holder { display: flex; min-width: 44px; justify-content: flex-end; }
  .ubc-mobile-menu-contact-slot .mobile-footer-contact-strip.ubc-mobile-contact-collapsible {
    position: static !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    z-index: auto !important;
    display: flex !important;
    width: auto !important;
    min-width: 44px !important;
    height: 44px !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 3px !important;
    overflow: visible !important;
    pointer-events: auto !important;
  }
  .ubc-mobile-menu-contact-slot .mobile-footer-contact-strip .contact-icon-list {
    position: static !important;
    right: auto !important;
    bottom: auto !important;
    display: flex !important;
    width: 0 !important;
    max-width: 0 !important;
    height: 44px !important;
    align-items: center !important;
    gap: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    opacity: 0;
    visibility: hidden;
    transform: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    pointer-events: none !important;
    transition: max-width .18s ease, width .18s ease, opacity .18s ease;
  }
  .ubc-mobile-menu-contact-slot .mobile-footer-contact-strip.is-expanded .contact-icon-list {
    width: 242px !important;
    max-width: 242px !important;
    opacity: 1;
    visibility: visible;
    pointer-events: auto !important;
  }
  .ubc-mobile-menu-contact-slot .ubc-mobile-contact-toggle.is-pulsing { animation: none !important; }

  body.ubc-menu-panel-open .ubc-mobile-header-toggle-host { visibility: hidden; }
}

@media (max-width: 370px) {
  .ubc-menu-search { padding-left: 10px !important; gap: 3px !important; }
  .ubc-menu-search-submit { padding-right: 9px; padding-left: 9px; font-size: 12px; gap: 4px; }
  .ubc-menu-search-magnifier,
  .ubc-menu-search-magnifier svg { width: 16px; min-width: 16px; height: 16px; }
  .ubc-menu-search-input { font-size: 14px !important; }
  .ubc-mobile-menu-contact-label { font-size: 12px; }
  .ubc-mobile-menu-contact-slot .mobile-footer-contact-strip.is-expanded .contact-icon-list {
    width: 218px !important;
    max-width: 218px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ubc-menu-search-submit.is-intro-sweep::after,
  .ubc-menu-search-submit.is-magnifier-pulse .ubc-menu-search-magnifier {
    animation: none !important;
  }
}

/* 176K mobile QA corrections: keep the contact block inside the navigation
   sheet only, and harden the round category-control geometry against older
   legacy button selectors. */
@media (max-width: 900px) {
  html.ubc-menu-ui-compact .main-nav-wrap:not(.menu-open) > .ubc-mobile-menu-contact-slot,
  .main-nav-wrap:not(.menu-open) > .ubc-mobile-menu-contact-slot {
    display: none !important;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open > .ubc-mobile-menu-contact-slot,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-contact-slot {
    display: block !important;
  }
}

/* Compact contact accordion at very narrow mobile widths. The label is hidden
   only while the six contact choices are unfolded, preserving one-row access. */
@media (max-width: 370px) {
  .ubc-mobile-menu-contact-slot.is-contact-expanded {
    width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding-right: 4px !important;
    padding-left: 4px !important;
  }
  .ubc-mobile-menu-contact-slot.is-contact-expanded .ubc-mobile-menu-contact-label {
    display: none !important;
  }
  .ubc-mobile-menu-contact-slot.is-contact-expanded .mobile-footer-contact-strip.is-expanded .contact-icon-list {
    width: 238px !important;
    max-width: 238px !important;
  }
}

/* ========================================================================== 
   UBC 177K mobile header/search/menu hotfix - 2026-08-29
   - left-aligned mobile logo
   - contourless category + control
   - isolated premium silver search pill
   - full-height navigation sheet with persistent contact bar
   ========================================================================== */
@media (max-width: 900px) {
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open,
  .main-nav-wrap.menu-open {
    display: flex !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .mobile-nav-bar,
  .main-nav-wrap.menu-open .mobile-nav-bar,
  .ubc-mobile-menu-search-slot,
  .ubc-mobile-menu-contact-slot {
    flex: 0 0 auto !important;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .main-nav,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .main-nav.open,
  .main-nav-wrap.menu-open .main-nav,
  .main-nav-wrap.menu-open .main-nav.open {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  .ubc-mobile-menu-contact-slot {
    position: relative !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: calc(100% - 14px) !important;
    margin: 0 7px !important;
    padding-bottom: calc(7px + env(safe-area-inset-bottom, 0px)) !important;
    background: #f5f6f7 !important;
    box-shadow: 0 -4px 10px rgba(0,0,0,.04) !important;
  }
}

/* ========================================================================== 
   UBC 178K approved mobile menu contact dock - 2026-08-29
   Only the lower contact strip inside the OPEN mobile menu is changed.
   Closed-page sticky contact launcher and desktop/header contacts remain intact.
   ========================================================================== */
@media (max-width: 900px) {
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open > .ubc-mobile-menu-contact-slot,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-contact-slot {
    position: relative !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 6240 !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    min-height: 70px !important;
    margin: 0 !important;
    padding: 4px 5px calc(4px + env(safe-area-inset-bottom, 0px)) !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-top: 1px solid #d7d9dd !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .ubc-mobile-menu-contact-slot .ubc-mobile-menu-contact-label,
  .ubc-mobile-menu-contact-slot .ubc-mobile-contact-toggle {
    display: none !important;
  }

  .ubc-mobile-menu-contact-slot .ubc-mobile-menu-contact-holder,
  .ubc-mobile-menu-contact-slot .mobile-footer-contact-strip.ubc-mobile-contact-collapsible {
    position: static !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 60px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .ubc-mobile-menu-contact-slot .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .contact-icon-list,
  .ubc-mobile-menu-contact-slot .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .contact-icon-list {
    position: static !important;
    right: auto !important;
    bottom: auto !important;
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 60px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    pointer-events: auto !important;
    transition: none !important;
  }

  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:hover,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:focus-visible {
    position: relative !important;
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    width: auto !important;
    min-width: 44px !important;
    max-width: none !important;
    height: 60px !important;
    min-height: 60px !important;
    margin: 0 !important;
    padding: 4px 1px 3px !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #454b54 !important;
    text-decoration: none !important;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact > img:not(.ubc-mobile-menu-dock-icon) {
    display: none !important;
  }

  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-menu-dock-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:hover .ubc-mobile-menu-dock-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:focus-visible .ubc-mobile-menu-dock-icon {
    display: block !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    filter: none !important;
    transform: none;
    transition: transform .12s ease, filter .12s ease;
    pointer-events: none;
  }

  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-menu-dock-label {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    color: #454b54 !important;
    font-family: Arial, Helvetica, sans-serif !important;
    /* No minimum font size: labels shrink continuously with the viewport
       so Telegram / WhatsApp / Signal are never clipped on narrow phones. */
    font-size: min(10.5px, 2.7vw) !important;
    font-weight: 400 !important;
    line-height: 1.08 !important;
    text-align: center !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    pointer-events: none;
  }

  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:active .ubc-mobile-menu-dock-icon {
    transform: scale(.92) !important;
    filter: brightness(0) saturate(100%) invert(57%) sepia(97%) saturate(3052%) hue-rotate(2deg) brightness(101%) contrast(102%) !important;
  }
}

/* Small smartphones: keep the five touch-first channels, omit Email.
   No horizontal scrolling and no reduction below the 44px touch target. */
@media (max-width: 359px) {
  .ubc-mobile-menu-contact-slot .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .contact-icon-list,
  .ubc-mobile-menu-contact-slot .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .contact-icon-list {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
  .ubc-mobile-menu-contact-slot .ubc-mobile-dock-contact-email {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-menu-dock-icon {
    transition: none !important;
  }
}


/* ==========================================================================
   UBC 179K breadcrumbs date + narrow contact labels - 2026-08-29
   ========================================================================== */
.page-breadcrumbs .breadcrumb-js-date {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  margin: 0 5px 0 0;
  color: #777;
  font-size: 11px;
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width: 359px) {
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-menu-dock-label {
    font-size: min(10.5px, 3vw) !important;
    letter-spacing: -.01em;
  }
}


/* ==========================================================================
   UBC 180K mobile L3 + contact dock press state - 2026-08-29
   ========================================================================== */
@media (max-width: 900px) {
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:hover,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:focus-visible {
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-menu-dock-icon {
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
    transition: filter .12s ease !important;
  }

  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-menu-dock-label {
    font-size: 10.5px !important;
    line-height: 1.08 !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:active .ubc-mobile-menu-dock-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact.is-contact-active .ubc-mobile-menu-dock-icon {
    transform: none !important;
    filter: brightness(0) saturate(100%) invert(57%) sepia(97%) saturate(3052%) hue-rotate(2deg) brightness(101%) contrast(102%) !important;
  }

  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:active .ubc-mobile-menu-dock-label,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact.is-contact-active .ubc-mobile-menu-dock-label {
    color: #f28c00 !important;
  }
}

@media (max-width: 359px) {
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-menu-dock-label {
    font-size: 10.5px !important;
    letter-spacing: -.02em !important;
  }
}




/* ==========================================================================\n   UBC 185K nested-menu compatibility layer\n   Loaded after ubcnew/order page CSS. One compact breakpoint: <=900px.\n   ========================================================================== */
@media (max-width: 900px) {
  html.ubc-menu-ui-compact .ubc-menu-note {
    pointer-events: none !important;
  }

  html.ubc-menu-ui-compact .main-nav-wrap,
  html.ubc-menu-ui-compact .main-nav,
  html.ubc-menu-ui-compact .nav-item,
  html.ubc-menu-ui-compact .mega-nav-item,
  html.ubc-menu-ui-compact .submenu,
  html.ubc-menu-ui-compact .submenu.mega-menu,
  html.ubc-menu-ui-compact .mega-group,
  html.ubc-menu-ui-compact .mega-group-heading,
  html.ubc-menu-ui-compact .mega-group-list {
    box-sizing: border-box !important;
  }

  /* Neutralise historical >=801px fly-out geometry from order.css. */
  html.ubc-menu-ui-compact .nav-item.open > .submenu.mega-menu,
  html.ubc-menu-ui-compact .submenu.mega-menu {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: none !important;
    overflow: visible !important;
    transform: none !important;
  }

  html.ubc-menu-ui-compact .mega-group,
  html.ubc-menu-ui-compact .mega-group-heading {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: visible !important;
  }

  html.ubc-menu-ui-compact .mega-group-heading {
    display: block !important;
    grid-template-columns: none !important;
  }

  html.ubc-menu-ui-compact .mega-group-toggle,
  html.js.ubc-menu-ui-compact .mega-group-toggle {
    display: none !important;
  }

  html.ubc-menu-ui-compact .submenu .mega-group-title,
  html.ubc-menu-ui-compact .submenu .mega-group-title:hover,
  html.ubc-menu-ui-compact .submenu .mega-group-title:focus-visible {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    width: 100% !important;
    max-width: none !important;
    cursor: pointer !important;
    pointer-events: auto !important;
  }

  html.ubc-menu-ui-compact .mega-group-list,
  html.ubc-menu-ui-compact .mega-group-regions .mega-group-list {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    z-index: auto !important;
    display: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: none !important;
    overflow: visible !important;
    transform: none !important;
    columns: auto !important;
    column-count: 1 !important;
    pointer-events: auto !important;
  }

  html.js.ubc-menu-ui-compact .mega-group.is-expanded > .mega-group-list,
  html.js.ubc-menu-ui-compact .mega-group.is-expanded > .mega-group-regions .mega-group-list {
    display: block !important;
  }

  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list > li,
  html.ubc-menu-ui-compact .mega-group-regions .mega-group-list > li {
    position: relative !important;
    z-index: auto !important;
    display: block !important;
    width: 100% !important;
    min-height: 44px !important;
    pointer-events: auto !important;
  }

  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list > li > a,
  html.ubc-menu-ui-compact .mega-group-regions .mega-group-list > li > a,
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list > li > a:hover,
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list > li > a:focus-visible,
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list > li > a:active {
    position: relative !important;
    z-index: 1 !important;
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    max-width: none !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    touch-action: manipulation;
  }
}

/* ========================================================================== 
   UBC 186K header stability + unified contact icon system - 2026-08-29
   Keeps the validated 185K nested-menu mechanics intact.
   Corporate blue: #00009F. Corporate orange: #F28C00.
   ========================================================================== */
.ubc-mobile-menu-utility { display: none; }

/* Unified contact glyphs: color may change, geometry never scales on hover/tap. */
.contact-icon-list a:hover img,
.contact-icon-list a:focus-visible img,
.contact-icon-list a:active img,
.contact-icon-list a.is-contact-active img {
  transform: none !important;
  filter: none !important;
}
.contact-icon-list a img.ubc-contact-unified-icon {
  transform: none !important;
  filter: none !important;
  transition: none !important;
}

@media (max-width: 900px) {
  /* The closed and open headers use the same compact utility row. */
  .header-visual-inner .utility-row,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open > .ubc-mobile-menu-utility,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-utility {
    display: flex !important;
    width: 100% !important;
    min-height: 17px !important;
    height: 17px !important;
    flex: 0 0 17px !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 2px !important;
    overflow: hidden !important;
    background: #fff !important;
    color: #565b63 !important;
    font-size: 11px !important;
    line-height: 17px !important;
    white-space: nowrap !important;
    text-align: right !important;
  }
  .header-visual-inner .utility-row > a,
  .header-visual-inner .utility-row > span:not(.utility-language-links),
  .main-nav-wrap.menu-open > .ubc-mobile-menu-utility > a,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-utility > span:not(.utility-language-links) {
    display: inline-block !important;
    flex: 0 0 auto !important;
    padding: 0 4px !important;
    color: #565b63 !important;
    font-size: 11px !important;
    line-height: 17px !important;
    text-decoration: none !important;
  }
  .header-visual-inner .utility-row > a:nth-of-type(3),
  .main-nav-wrap.menu-open > .ubc-mobile-menu-utility > a:nth-of-type(3) {
    display: none !important;
  }
  .header-visual-inner .utility-row .utility-language-links,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-utility .utility-language-links {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .header-visual-inner .utility-row .utility-language-links a,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-utility .utility-language-links a {
    display: inline-block !important;
    padding: 0 4px !important;
    color: #00009F !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 17px !important;
    text-decoration: none !important;
  }
  .header-visual-inner .utility-row .utility-language-links a.is-current,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-utility .utility-language-links a.is-current {
    display: none !important;
  }

  /* Smartphone logo: never wider than one third of the physical viewport. */
  .header-brand-row .logo-link,
  html.ubc-menu-ui-compact .header-brand-row .logo-link,
  .ubc-mobile-menu-brand {
    width: min(33.333vw, 180px) !important;
    max-width: 33.333vw !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }
  .header-brand-row .logo-link .logo-main,
  .ubc-mobile-menu-brand img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
  }

  /* Open menu header mirrors the measured closed mobile brand row. */
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .mobile-nav-bar,
  .main-nav-wrap.menu-open .mobile-nav-bar {
    position: relative !important;
    top: auto !important;
    display: flex !important;
    width: 100% !important;
    min-height: var(--ubc-mobile-menu-brand-height, 72px) !important;
    height: var(--ubc-mobile-menu-brand-height, 72px) !important;
    flex: 0 0 var(--ubc-mobile-menu-brand-height, 72px) !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 52px 0 8px !important;
    border: 0 !important;
    background: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .mobile-nav-bar > .nav-toggle,
  .main-nav-wrap.menu-open .mobile-nav-bar > .nav-toggle {
    position: absolute !important;
    top: 50% !important;
    right: 3px !important;
    left: auto !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .ubc-mobile-menu-brand,
  .main-nav-wrap.menu-open .ubc-mobile-menu-brand {
    display: flex !important;
    width: var(--ubc-mobile-menu-logo-width, min(33.333vw, 180px)) !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 0 !important;
  }

  .ubc-mobile-search-zone,
  .ubc-mobile-menu-search-slot {
    width: 100% !important;
    box-sizing: border-box !important;
    background-color: #f6f7f8 !important;
    background-image: url("../image/mobile-header-silver-gradient.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: 100% 100% !important;
  }
  .ubc-mobile-search-zone {
    padding: 9px 7px 11px !important;
  }
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .ubc-mobile-menu-search-slot,
  .main-nav-wrap.menu-open .ubc-mobile-menu-search-slot {
    padding: 9px 7px 11px !important;
    border-top: 4px double #b6bac2 !important;
  }

  /* +1 pt over the previous 11px menu note: 1pt ~= 1.333 CSS px. */
  html.ubc-menu-ui-compact .ubc-menu-note,
  .ubc-menu-note {
    font-size: 12.33px !important;
    line-height: 1.22 !important;
  }

  /* Contact dock inside the open menu: exact blue/orange source SVGs are
     swapped by JS; never resize the glyph or its button on hover/press. */
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:hover,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:focus-visible,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:active {
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
  }
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-menu-dock-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:hover .ubc-mobile-menu-dock-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:focus-visible .ubc-mobile-menu-dock-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:active .ubc-mobile-menu-dock-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact.is-contact-active .ubc-mobile-menu-dock-icon {
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    margin: 0 auto !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:hover .ubc-mobile-menu-dock-label,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:focus-visible .ubc-mobile-menu-dock-label,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:active .ubc-mobile-menu-dock-label,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact.is-contact-active .ubc-mobile-menu-dock-label {
    color: #F28C00 !important;
  }

  /* Closed-page contact launcher: corporate blue disc with the same white
     smartphone outline. Clicking/expanding changes the disc to orange. */
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle {
    display: flex !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    flex: 0 0 44px !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #00009F !important;
    background-image: none !important;
    box-shadow: 0 3px 11px rgba(0,0,0,.16) !important;
    transform: none;
    transition: background-color .14s ease, box-shadow .14s ease !important;
  }
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle:hover,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle:focus-visible,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle:active,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-contact-toggle {
    background: #F28C00 !important;
    transform: none !important;
  }
  .ubc-mobile-contact-toggle-icon,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle img.ubc-mobile-contact-toggle-icon {
    display: block !important;
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    margin: 0 !important;
    transform: none !important;
    filter: none !important;
  }

  /* Outside the hamburger menu the collapsed contact launcher unfolds to the
     full available smartphone width. Reuse the same blue icons + labels as the
     fixed dock inside the menu. */
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded {
    right: 5px !important;
    left: 5px !important;
    width: auto !important;
    height: 64px !important;
    min-height: 64px !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .contact-icon-list {
    position: absolute !important;
    right: 50px !important;
    bottom: 0 !important;
    left: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0,1fr)) !important;
    gap: 0 !important;
    width: auto !important;
    max-width: none !important;
    height: 64px !important;
    min-height: 64px !important;
    box-sizing: border-box !important;
    padding: 2px 3px !important;
    overflow: hidden !important;
    border: 1px solid #d7d9dd !important;
    border-radius: 6px !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow: 0 5px 16px rgba(0,0,0,.12) !important;
  }
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact,
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact:hover,
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact:focus-visible {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 58px !important;
    min-height: 58px !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
    padding: 2px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    font-size: initial !important;
    text-align: center !important;
    transform: none !important;
  }
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-menu-dock-icon {
    display: block !important;
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    margin: 0 auto !important;
    transform: none !important;
    filter: none !important;
  }
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-menu-dock-label {
    display: block !important;
    width: 100% !important;
    overflow: visible !important;
    color: #454b54 !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: min(9.8px, 2.55vw) !important;
    font-weight: 400 !important;
    line-height: 1.05 !important;
    text-align: center !important;
    white-space: nowrap !important;
  }
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact:hover .ubc-mobile-menu-dock-label,
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact:focus-visible .ubc-mobile-menu-dock-label,
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact:active .ubc-mobile-menu-dock-label,
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact.is-contact-active .ubc-mobile-menu-dock-label {
    color: #F28C00 !important;
  }
}

@media (max-width: 359px) {
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .contact-icon-list {
    grid-template-columns: repeat(5, minmax(0,1fr)) !important;
  }
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact-email {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle,
  .contact-icon-list a img.ubc-contact-unified-icon {
    transition: none !important;
  }
}

@media (max-width: 900px) {
  /* Remove the obsolete 2026-07 pseudo-logo. The real cloned logo above is
     the only logo in the open sheet; otherwise ::before consumes 133px and
     pushes the logo toward the center. */
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .mobile-nav-bar::before,
  .main-nav-wrap.menu-open .mobile-nav-bar::before {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    flex: 0 0 0 !important;
    background: none !important;
  }
}

/* In 186K only the glyph changes to orange; the caption stays neutral graphite. */
@media (max-width: 900px) {
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:hover .ubc-mobile-menu-dock-label,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:focus-visible .ubc-mobile-menu-dock-label,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:active .ubc-mobile-menu-dock-label,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact.is-contact-active .ubc-mobile-menu-dock-label,
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact:hover .ubc-mobile-menu-dock-label,
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact:focus-visible .ubc-mobile-menu-dock-label,
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact:active .ubc-mobile-menu-dock-label,
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-dock-contact.is-contact-active .ubc-mobile-menu-dock-label {
    color: #454b54 !important;
  }
}


/* ==========================================================================
   UBC 187K phone handset restoration + hamburger duplicate guard - 2026-08-29
   Keep exactly one phone action inside the open menu: the dock item.
   The standalone collapsed launcher is only for the closed page state.
   ========================================================================== */
@media (max-width: 900px) {
  body.ubc-menu-panel-open .ubc-mobile-menu-contact-slot
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible
  .ubc-mobile-contact-toggle {
    display: none !important;
  }
}

/* ========================================================================== 
   UBC 188K contact launcher / back-to-top / desktop contact pill - 2026-08-29
   Corporate blue #00009F. Corporate orange #F28C00.
   ========================================================================== */

/* One thin back-to-top arrow everywhere. The legacy square button remains in
   HTML for compatibility, but its box is visually removed. */
.back-top,
.back-top:hover,
.back-top:focus-visible,
.back-top:active {
  width: 36px !important;
  min-width: 36px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  transform: none !important;
  overflow: visible !important;
  -webkit-tap-highlight-color: transparent;
}
.back-top::before,
.back-top::after {
  content: "";
  position: absolute;
  left: 50%;
  display: block;
  pointer-events: none;
  transition: border-color .14s ease, background-color .14s ease;
}
.back-top::before {
  top: 6px;
  width: 11px;
  height: 11px;
  border-top: 1.5px solid #00009F;
  border-left: 1.5px solid #00009F;
  transform: translateX(-50%) rotate(45deg);
}
.back-top::after {
  top: 10px;
  width: 1.5px;
  height: 14px;
  background: #00009F;
  transform: translateX(-50%);
}
.back-top:hover::before,
.back-top:focus-visible::before,
.back-top:active::before { border-color: #F28C00; }
.back-top:hover::after,
.back-top:focus-visible::after,
.back-top:active::after { background: #F28C00; }

/* Desktop persistent contacts: one vertical capsule with fully rounded top
   and bottom. Icon geometry never scales on hover. */
@media (min-width: 1241px) {
  .desktop-floating-contact-bar {
    right: 14px !important;
    bottom: 82px !important;
    padding: 9px 7px !important;
    border: 1px solid #d3d6dc !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 6px 17px rgba(0,0,0,.12) !important;
    overflow: hidden !important;
  }
  .desktop-floating-contact-bar .contact-icon-list {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 7px !important;
  }
  .desktop-floating-contact-bar .contact-icon-list a,
  .desktop-floating-contact-bar .contact-icon-list a:hover,
  .desktop-floating-contact-bar .contact-icon-list a:focus-visible,
  .desktop-floating-contact-bar .contact-icon-list a:active {
    transform: none !important;
  }
  .desktop-floating-contact-bar .contact-icon-list img,
  .desktop-floating-contact-bar .contact-icon-list a:hover img,
  .desktop-floating-contact-bar .contact-icon-list a:focus-visible img,
  .desktop-floating-contact-bar .contact-icon-list a:active img {
    transform: none !important;
  }
  body.ubc-has-desktop-contact-pill .back-top {
    right: 24px !important;
    bottom: 391px !important;
  }
}

@media (max-width: 900px) {
  /* Closed contact launcher: transparent circular button + blue handset.
     It shares exactly the same 26px glyph size as the hamburger contact dock. */
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle:hover,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle:focus-visible,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle:active,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-contact-toggle {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    border: 1px solid rgba(0,0,159,.48) !important;
    border-radius: 50% !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.10) !important;
    transform: none !important;
  }
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle:hover,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle:focus-visible,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle:active,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-contact-toggle,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle.is-contact-active {
    border-color: rgba(242,140,0,.70) !important;
  }

  .ubc-mobile-contact-toggle-icon,
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle img.ubc-mobile-contact-toggle-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-menu-dock-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:hover .ubc-mobile-menu-dock-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:focus-visible .ubc-mobile-menu-dock-icon,
  .ubc-mobile-menu-contact-slot .contact-icon-list .ubc-mobile-dock-contact:active .ubc-mobile-menu-dock-icon,
  body:not(.ubc-menu-panel-open) .mobile-footer-contact-strip.ubc-mobile-contact-collapsible.is-expanded .ubc-mobile-menu-dock-icon {
    width: 26px !important;
    min-width: 26px !important;
    max-width: 26px !important;
    height: 26px !important;
    min-height: 26px !important;
    max-height: 26px !important;
    flex-basis: 26px !important;
    transform: none !important;
    filter: none !important;
  }

  /* Attention animation begins only after the user starts scrolling. No scale:
     the icon and circle keep identical geometry while a soft blue halo pulses. */
  @keyframes ubc-mobile-contact-pulse-188 {
    0%, 100% { box-shadow: 0 2px 8px rgba(0,0,0,.10), 0 0 0 0 rgba(0,0,159,0); }
    45% { box-shadow: 0 2px 8px rgba(0,0,0,.10), 0 0 0 7px rgba(0,0,159,.14); }
    75% { box-shadow: 0 2px 8px rgba(0,0,0,.10), 0 0 0 11px rgba(0,0,159,0); }
  }
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle.is-pulsing {
    animation: ubc-mobile-contact-pulse-188 1.25s ease-out 1 !important;
    transform: none !important;
  }

  /* Thin back-to-top arrow is aligned directly above the collapsed phone
     launcher. If contacts are expanded, move it above the 64px contact row. */
  body.ubc-has-mobile-contact-launcher .back-top {
    right: max(12px, calc(env(safe-area-inset-right, 0px) + 12px)) !important;
    bottom: calc(58px + env(safe-area-inset-bottom, 0px)) !important;
  }
  body.ubc-has-mobile-contact-launcher.ubc-contact-launcher-expanded .back-top {
    bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible .ubc-mobile-contact-toggle.is-pulsing {
    animation: none !important;
  }
}

/* Rectangular legacy hard-gate uses body.ubc-page * { border-radius:0!important }.
   Override it deliberately for the one approved desktop contact capsule. */
@media (min-width: 1241px) {
  body.ubc-page .desktop-floating-contact-bar {
    border-radius: 999px !important;
  }
}

/* Final 188K size lock: legacy mobile footer rules carry strong !important
   declarations. In the open hamburger keep the glyph at the same 26px as the
   collapsed phone launcher while preserving a >=44px tap target. */
@media (max-width: 900px) {
  body.ubc-page.ubc-menu-panel-open .ubc-mobile-menu-contact-slot
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible
  .contact-icon-list .ubc-mobile-dock-contact,
  body.ubc-page.ubc-menu-panel-open .ubc-mobile-menu-contact-slot
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible
  .contact-icon-list .ubc-mobile-dock-contact:hover,
  body.ubc-page.ubc-menu-panel-open .ubc-mobile-menu-contact-slot
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible
  .contact-icon-list .ubc-mobile-dock-contact:focus-visible {
    width: auto !important;
    min-width: 44px !important;
    height: 60px !important;
    min-height: 60px !important;
    flex-basis: auto !important;
  }
  body.ubc-page.ubc-menu-panel-open .ubc-mobile-menu-contact-slot
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible
  .contact-icon-list img.ubc-mobile-menu-dock-icon,
  body.ubc-page.ubc-menu-panel-open .ubc-mobile-menu-contact-slot
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible
  .contact-icon-list .ubc-mobile-dock-contact:hover img.ubc-mobile-menu-dock-icon,
  body.ubc-page.ubc-menu-panel-open .ubc-mobile-menu-contact-slot
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible
  .contact-icon-list .ubc-mobile-dock-contact:focus-visible img.ubc-mobile-menu-dock-icon,
  body.ubc-page.ubc-menu-panel-open .ubc-mobile-menu-contact-slot
  .mobile-footer-contact-strip.ubc-mobile-contact-collapsible
  .contact-icon-list .ubc-mobile-dock-contact:active img.ubc-mobile-menu-dock-icon {
    width: 26px !important;
    min-width: 26px !important;
    max-width: 26px !important;
    height: 26px !important;
    min-height: 26px !important;
    max-height: 26px !important;
    flex-basis: 26px !important;
    transform: none !important;
  }
}


/* ==========================================================================
   UBC 191K intermediate: L3 presentation only, based strictly on stable 188K.
   No accordion/display/breakpoint/click/state rules are changed here.
   ========================================================================== */
@media (max-width: 900px) {
  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list > li:not(.ubc-mobile-category-landing) {
    border-bottom: 0 !important;
  }

  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list > li:not(.ubc-mobile-category-landing) > a,
  html.ubc-menu-ui-compact .mega-group-regions .mega-group-list > li:not(.ubc-mobile-category-landing) > a {
    box-sizing: border-box !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    border: 1px solid #778899 !important;
  }

  html.ubc-menu-ui-compact .submenu.mega-menu .mega-group-list > li:not(.ubc-mobile-category-landing) > a::after,
  html.ubc-menu-ui-compact .mega-group-regions .mega-group-list > li:not(.ubc-mobile-category-landing) > a::after {
    display: block;
    margin-top: 3px;
    color: #69727a;
    font-size: 12.33px;
    font-weight: 400;
    line-height: 1.15;
    white-space: normal;
    pointer-events: none;
  }

  html[lang="ru"].ubc-menu-ui-compact .services-mega-menu .mega-group-list > li:not(.ubc-mobile-category-landing) > a::after {
    content: "\00041F\00043E\000440\00044F\000434\00043E\00043A,\000020\000434\00043E\00043A\000443\00043C\000435\00043D\000442\00044B\000020\000438\000020\000441\00043E\00043F\000440\00043E\000432\00043E\000436\000434\000435\00043D\000438\000435";
  }
  html[lang="ru"].ubc-menu-ui-compact .information-mega-menu .mega-group-list > li:not(.ubc-mobile-category-landing) > a::after {
    content: "\00041F\000440\000430\00043A\000442\000438\000447\000435\000441\00043A\000438\000435\000020\00043F\00043E\00044F\000441\00043D\000435\00043D\000438\00044F\000020\000438\000020\00043C\000430\000442\000435\000440\000438\000430\00043B\00044B";
  }

  html[lang="uk"].ubc-menu-ui-compact .services-mega-menu .mega-group-list > li:not(.ubc-mobile-category-landing) > a::after {
    content: "\00041F\00043E\000440\00044F\000434\00043E\00043A,\000020\000434\00043E\00043A\000443\00043C\000435\00043D\000442\000438\000020\000442\000430\000020\000441\000443\00043F\000440\00043E\000432\000456\000434";
  }
  html[lang="uk"].ubc-menu-ui-compact .information-mega-menu .mega-group-list > li:not(.ubc-mobile-category-landing) > a::after {
    content: "\00041F\000440\000430\00043A\000442\000438\000447\00043D\000456\000020\00043F\00043E\00044F\000441\00043D\000435\00043D\00043D\00044F\000020\000442\000430\000020\00043C\000430\000442\000435\000440\000456\000430\00043B\000438";
  }

  html[lang="en"].ubc-menu-ui-compact .services-mega-menu .mega-group-list > li:not(.ubc-mobile-category-landing) > a::after {
    content: "Process,\000020documents\000020and\000020support";
  }
  html[lang="en"].ubc-menu-ui-compact .information-mega-menu .mega-group-list > li:not(.ubc-mobile-category-landing) > a::after {
    content: "Practical\000020guidance\000020and\000020materials";
  }
}

/* ========================================================================== 
   UBC 192K — page-flow mobile menu
   The open hamburger behaves as one native full-screen menu page:
   - the whole menu sheet is the only scrolling surface;
   - .main-nav never becomes an inner scroll-frame;
   - search, L1/L2/L3 and contacts remain in one normal document flow;
   - contacts are the final block and appear only when the user reaches bottom.
   Accordion state/click handling is intentionally unchanged from stable 188K.
   ========================================================================== */
@media (max-width: 900px) {
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open,
  .main-nav-wrap.menu-open {
    display: block !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-behavior: auto !important;
  }

  /* All visible menu parts participate in one vertical page flow. */
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open > .ubc-mobile-menu-utility,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open > .mobile-nav-bar,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open > .ubc-mobile-menu-search-slot,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open > .main-nav,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open > .ubc-mobile-menu-contact-slot,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-utility,
  .main-nav-wrap.menu-open > .mobile-nav-bar,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-search-slot,
  .main-nav-wrap.menu-open > .main-nav,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-contact-slot {
    flex: none !important;
  }

  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .mobile-nav-bar,
  .main-nav-wrap.menu-open .mobile-nav-bar {
    position: relative !important;
    top: auto !important;
  }

  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .main-nav,
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open .main-nav.open,
  .main-nav-wrap.menu-open .main-nav,
  .main-nav-wrap.menu-open .main-nav.open {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
    -webkit-overflow-scrolling: auto !important;
  }

  /* Contacts are not a dock in the open menu anymore. They are simply the
     final content block of the menu page and scroll off/on screen naturally. */
  html.ubc-menu-ui-compact .main-nav-wrap.menu-open > .ubc-mobile-menu-contact-slot,
  .main-nav-wrap.menu-open > .ubc-mobile-menu-contact-slot {
    position: relative !important;
    inset: auto !important;
    z-index: auto !important;
    display: block !important;
    width: 100% !important;
    margin: 8px 0 0 !important;
    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    transform: none !important;
  }
}