/* Preview bridge only — V5-MOB-HEADER-028.
   TC wordmark keeps its owner-approved visual dimensions while the grid may shrink safely. */
@media (max-width: 760px) {
  /* V5.03-Final: Safari must retain an opaque composited paint layer through the status-bar safe area. */
  .site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: #ffffff;
    background-color: #ffffff;
    isolation: isolate;
    padding-top: env(safe-area-inset-top);
  }

  .site-header .utility-strip {
    background: #f4f4f4;
  }

  .site-header .primary-nav-wrap {
    background: #ffffff;
  }

  html[lang="zh-Hant"] .primary-nav {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }

  html[lang="zh-Hant"] .brand-lockup {
    min-width: 0;
  }

  html[lang="zh-Hant"] .nav-actions {
    flex: 0 0 auto;
    inline-size: 78px;
    min-inline-size: 78px;
    gap: 12px;
    min-width: max-content;
    justify-self: end;
    justify-content: space-between;
    margin-left: 0;
    margin-right: 0;
  }

  html[lang="zh-Hant"] .language-select {
    flex: 0 0 33px;
    width: 33px;
  }

  html[lang="zh-Hant"] .language-select select {
    min-width: 33px;
    width: 33px;
  }

  html[lang="zh-Hant"] .menu-toggle {
    flex: 0 0 33px;
    margin: 0;
  }
}

/* Managed Preview desktop bridge — V5-DESKTOP-HEADER-031.
   The uploaded V5 bundle treats 761–1023px as a compact/tablet header and
   hides navigation. In the Manus desktop Preview frame, that causes the
   desktop icon to show the mobile action layout. Restore the V5 desktop
   navigation with V5’s own 302px / 26px geometry only above the mobile breakpoint. */
@media (min-width: 761px) and (max-width: 1023px) {
  .primary-nav {
    grid-template-columns: 190px minmax(0, 1fr) auto;
    gap: 14px;
    height: 82px;
  }

  .brand-lockup {
    width: 190px;
  }

  .header-logo-offset,
  .header-navigation-offset {
    margin-left: 0;
  }

  .brand-logo {
    width: 190px;
    height: auto;
  }

  html[lang="zh-Hant"] .brand-logo-tc {
    width: 190px;
    height: auto;
    margin: 0 !important;
  }

  .desktop-nav {
    display: flex;
    gap: 15px;
  }

  .nav-link {
    font-size: 9px;
  }

  .nav-actions {
    gap: 12px;
  }

  .header-contact {
    display: inline-flex;
    min-height: 38px;
    padding-inline: 12px;
    font-size: 9px;
  }

  .menu-toggle {
    display: none;
  }
}