/* Chinese public shell, phase 1. Loaded after the existing styles.
   Desktop geometry belongs to the existing site. Narrow-screen rules start below 1024px. */
body.winsom-responsive {
  --ws-brand: #01633a;
  --ws-ink: #26342d;
  --ws-line: #dce4df;
  --ws-header-height: calc(72px + env(safe-area-inset-top, 0px));
}

.ws-mobile-header,
.ws-mobile-search,
.ws-reading-nav,
.ws-drawer:not([open]) { display: none; }

.winsom-responsive .table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.ws-mobile-header *,
.ws-mobile-search *,
.ws-drawer * { box-sizing: border-box; }

.ws-mobile-header a,
.ws-mobile-header button,
.ws-mobile-search button,
.ws-drawer a,
.ws-drawer button { touch-action: manipulation; }

.winsom-responsive :where(.headerdu, #header, .winsom-footer, .winsom-footer-links) :focus-visible,
.ws-mobile-header :focus-visible,
.ws-mobile-search :focus-visible,
.ws-drawer :focus-visible {
  outline: 2px solid var(--ws-brand);
  outline-offset: 3px;
}

@media (max-width: 1024px) {
  html:has(body.winsom-responsive) { overflow-x: hidden; scrollbar-gutter: stable; }
  html:has(body.winsom-responsive.ws-menu-open) { overflow: hidden; }
  body.winsom-responsive {
    width: 100%;
    min-width: 0;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
  }

  /* Constrain the public shell. Page-specific grids and sidebars are handled in phase 2. */
  body.winsom-responsive .maincontent,
  body.winsom-responsive .maintext {
    max-width: 990px;
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box;
  }
  body.winsom-responsive .maintext {
    padding-left: max(16px, env(safe-area-inset-left, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
  }
  body.winsom-responsive .headerdu .logo {
    width: 100%;
    max-width: 1000px;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
  }

  /* An expanded, usable menu remains available if the enhancement cannot start. */
  body.winsom-responsive:not(.ws-nav-ready) .headerdu .language { width: auto; height: auto; }
  body.winsom-responsive:not(.ws-nav-ready) .headerdu .language a {
    display: inline-flex;
    align-items: center;
    min-width: 44px;
    min-height: 44px;
  }
  body.winsom-responsive:not(.ws-nav-ready) .headerdu input {
    min-width: 44px;
    min-height: 44px;
    font-size: 16px;
    object-fit: contain;
  }
  body.winsom-responsive:not(.ws-nav-ready) #header { height: auto; }
  body.winsom-responsive:not(.ws-nav-ready) #navToggle { display: none; }
  body.winsom-responsive:not(.ws-nav-ready) #header #myslidemenu {
    width: 100% !important;
    max-height: none !important;
    height: auto !important;
    overflow: visible;
  }
  body.winsom-responsive:not(.ws-nav-ready) #header #myslidemenu ul,
  body.winsom-responsive:not(.ws-nav-ready) #header #myslidemenu ul div {
    position: static !important;
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--ws-brand) !important;
  }
  body.winsom-responsive:not(.ws-nav-ready) #header #myslidemenu li {
    float: none !important;
    width: 100% !important;
  }
  body.winsom-responsive:not(.ws-nav-ready) #header #myslidemenu a {
    width: 100% !important;
    min-height: 44px;
    height: auto !important;
    line-height: 24px !important;
    padding: 10px 16px !important;
    text-align: left !important;
    color: #fff !important;
  }

  /* Cover only the legacy header during parsing, never the page content. */
  html.ws-shell-booting body.winsom-responsive,
  body.winsom-responsive.ws-nav-ready { padding-top: var(--ws-header-height); }
  html.ws-shell-booting body.winsom-responsive > .headerdu,
  html.ws-shell-booting body.winsom-responsive > #header { display: none !important; }
  body.winsom-responsive.ws-nav-ready > .headerdu,
  body.winsom-responsive.ws-nav-ready > #header { display: none !important; }
  body.winsom-responsive.ws-menu-open { overflow: hidden; }

  .ws-mobile-header {
    display: flex;
    align-items: center;
    gap: 4px;
    position: fixed;
    inset: 0 0 auto;
    z-index: 1100;
    height: var(--ws-header-height);
    padding: env(safe-area-inset-top, 0px) max(12px, env(safe-area-inset-right, 0px)) 0 max(12px, env(safe-area-inset-left, 0px));
    background: #fff;
    border-bottom: 1px solid var(--ws-line);
    font-family: "Microsoft Yahei", Arial, sans-serif;
  }
  .ws-icon-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    padding: 10px;
    border: 0;
    border-radius: 0;
    color: var(--ws-brand);
    background: transparent;
    cursor: pointer;
  }
  .ws-icon-button svg { width: 24px; height: 24px; flex-shrink: 0; }
  .ws-icon-button:active { background: #eaf1ed; }
  .ws-mobile-logo {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
    min-height: 44px;
  }
  .ws-mobile-logo img { width: min(100%, 190px); height: auto; max-height: 56px; object-fit: contain; }
  /* Neutralize the pale JPEG matte without replacing the original brand asset. */
  .ws-mobile-logo img { filter: brightness(1.04) contrast(1.12); }
  .ws-mobile-language {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0 4px;
    color: var(--ws-brand);
    text-decoration: none;
    font-size: 13px;
  }

  .ws-mobile-search:not([hidden]) {
    display: block;
    position: fixed;
    inset: var(--ws-header-height) 0 auto;
    z-index: 1100;
    padding: 16px max(16px, env(safe-area-inset-right, 0px)) 16px max(16px, env(safe-area-inset-left, 0px));
    background: #fff;
    border-bottom: 1px solid var(--ws-line);
  }
  .ws-mobile-search form { display: flex; gap: 8px; width: 100%; max-width: 720px; margin: 0 auto; }
  .ws-mobile-search input {
    flex: 1;
    min-width: 0;
    width: 100%;
    height: 44px;
    padding: 8px 12px;
    border: 1px solid #738b7d;
    border-radius: 0;
    color: var(--ws-ink);
    background: #fff;
    font-size: 16px;
  }
  .ws-mobile-search button {
    min-width: 64px;
    min-height: 44px;
    padding: 8px 16px;
    border: 0;
    color: #fff;
    background: var(--ws-brand);
    font-size: 16px;
  }

  .ws-drawer {
    position: fixed;
    inset: 0 auto 0 0;
    width: min(380px, 100%);
    max-width: 100%;
    height: 100vh;
    height: 100dvh;
    max-height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    color: var(--ws-ink);
    background: #fff;
    box-sizing: border-box;
    font: 16px/1.5 "Microsoft Yahei", Arial, sans-serif;
  }
  .ws-drawer[open] { display: flex; flex-direction: column; }
  .ws-drawer::backdrop { background: rgb(19 35 26 / 48%); }
  .ws-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    min-height: var(--ws-header-height);
    padding: env(safe-area-inset-top, 0px) 16px 0 max(16px, env(safe-area-inset-left, 0px));
    border-bottom: 1px solid var(--ws-line);
  }
  .ws-drawer-title { font-size: 18px; font-weight: 600; color: var(--ws-brand); }
  .ws-drawer nav { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 8px 16px; }
  .ws-drawer ul, .ws-drawer li { display: block; float: none; width: auto; list-style: none; margin: 0; padding: 0; }
  .ws-drawer nav > ul > li { border-bottom: 1px solid var(--ws-line); }
  .ws-nav-row { display: flex; align-items: center; gap: 8px; }
  .ws-drawer a {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 44px;
    min-height: 44px;
    padding: 12px 8px;
    color: var(--ws-ink);
    text-decoration: none;
    font-size: 16px;
    line-height: 1.5;
    overflow-wrap: anywhere;
  }
  .ws-drawer a[aria-current="page"] { color: var(--ws-brand); font-weight: 600; }
  .ws-drawer .ws-submenu { padding: 0 0 8px 16px; background: #f4f7f5; }
  .ws-drawer [hidden] { display: none !important; }
  .ws-nav-expand[aria-expanded="true"] svg { transform: rotate(180deg); }
  .ws-drawer-foot {
    flex-shrink: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    border-top: 1px solid var(--ws-line);
    padding: 8px 16px max(12px, env(safe-area-inset-bottom, 0px));
  }
  .ws-drawer-foot a { flex: 0 1 auto; color: var(--ws-brand); }
  @media (prefers-reduced-motion: no-preference) {
    .ws-drawer[open] { animation: ws-drawer-in 220ms ease-out; }
    @keyframes ws-drawer-in { from { transform: translateX(-100%); } to { transform: translateX(0); } }
  }

  /* The actual common footer is emitted by _weblink, not _foot. */
  body.winsom-responsive .winsom-footer {
    height: auto;
    background: var(--ws-brand);
    line-height: 24px;
  }
  body.winsom-responsive .winsom-footer > ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 20px;
    width: 100% !important;
    max-width: 1000px;
    height: auto !important;
    min-height: 57px;
    margin: 0 auto;
    padding: 12px 16px;
    padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
    overflow: visible !important;
    box-sizing: border-box;
    background: none !important;
  }
  body.winsom-responsive .winsom-footer li { float: none; max-width: 100%; overflow-wrap: anywhere; }
  body.winsom-responsive .winsom-footer a { display: inline-flex; align-items: center; min-width: 44px; min-height: 44px; }
  body.winsom-responsive .winsom-footer-links { height: auto !important; }
  body.winsom-responsive .winsom-footer-links > ul {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    width: 100% !important;
    max-width: 1000px;
    height: auto !important;
    margin: 0 auto;
    padding: 24px max(16px, env(safe-area-inset-right, 0px)) max(24px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)) !important;
    box-sizing: border-box;
  }
  body.winsom-responsive .winsom-footer-links > ul > li.homecase {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0;
    float: none !important;
    text-align: left !important;
  }
  body.winsom-responsive .winsom-footer-links > ul > li.homecase:last-child {
    grid-column: 1 / -1;
  }
  body.winsom-responsive .winsom-footer-links .homecase:last-child :is(p, div, span) {
    text-align: left !important;
  }
  body.winsom-responsive .winsom-footer-links > ul > li.homecase > ul > li {
    display: block !important;
    float: none !important;
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
  }
  body.winsom-responsive .winsom-footer-links .homecase a {
    display: flex;
    align-items: center;
    min-width: 44px;
    min-height: 44px;
    height: auto !important;
    padding: 8px 0 !important;
    font-size: 14px !important;
    line-height: 24px !important;
    color: #f1f3f2 !important;
    text-align: left;
    text-indent: 0;
    background: none !important;
  }
  body.winsom-responsive .winsom-footer-links .homecase:last-child a[href^="mailto:" i] {
    display: inline-flex;
    vertical-align: baseline;
  }
  body.winsom-responsive .winsom-footer-links .homecase a::after { content: none !important; }
  body.winsom-responsive .winsom-footer-links .homecase > ul > li:first-child > a { font-size: 16px !important; font-weight: 600; }
  body.winsom-responsive .winsom-footer-links #headerkk,
  body.winsom-responsive .winsom-footer-links #headerkk #myslidemenu,
  body.winsom-responsive .winsom-footer-links #headerkk #myslidemenu ul,
  body.winsom-responsive .winsom-footer-links #headerkk #myslidemenu li,
  body.winsom-responsive .winsom-footer-links #headerkk #myslidemenu ul div {
    position: static !important;
    display: block !important;
    visibility: visible !important;
    float: none !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
  }
  body.winsom-responsive .winsom-footer-links #headerkk a { width: 100% !important; color: #f1f3f2 !important; font-weight: normal; }
  .winsom-responsive .winsom-footer-links :focus-visible { outline-color: #fff; }
  .winsom-footer-links .ws-footer-disclosure { border-bottom: 1px solid rgb(255 255 255 / 18%); }
  .winsom-footer-links .ws-footer-disclosure summary { display: flex; align-items: center; justify-content: space-between; min-height: 52px; gap: 12px; color: #f1f3f2; font: 15px/1.5 "Microsoft Yahei", Arial, sans-serif; cursor: pointer; list-style: none; }
  .winsom-footer-links .ws-footer-disclosure summary::-webkit-details-marker { display: none; }
  .winsom-footer-links .ws-footer-disclosure summary svg { width: 20px; height: 20px; }
  .winsom-footer-links .ws-footer-disclosure[open] summary svg { transform: rotate(180deg); }
  body.winsom-responsive .winsom-footer-links .ws-footer-disclosure > ul { display: block; width: 100%; padding: 0 0 12px; margin: 0; }
  body.winsom-responsive .winsom-footer-links .ws-footer-disclosure > ul > li { display: block; float: none; width: 100%; height: auto !important; min-height: 44px; padding: 0 !important; }
  body.winsom-responsive .winsom-footer-links .ws-footer-disclosure .ws-footer-repeated-title { display: none !important; }
  body.winsom-responsive .winsom-footer-links .ws-footer-disclosure a { padding: 8px 12px !important; }
  body.winsom-responsive .winsom-footer-links:has(.ws-footer-disclosure) > ul { gap: 0 24px; align-items: start; }
  body.winsom-responsive .winsom-footer-links:has(.ws-footer-disclosure) > ul > li:last-child { padding-top: 24px; }
}

@media (min-width: 1024.01px) {
  .winsom-responsive #header #myslidemenu li:focus-within > ul {
    display: block !important;
    visibility: visible !important;
  }
}

@media (max-width: 767.98px) {
  body.winsom-responsive .winsom-footer-links > ul { grid-template-columns: minmax(0, 1fr); }
  /* The legacy JPEG contains a green background and a thin top border. */
  body.winsom-responsive .winsom-footer > ul > li:first-child { mix-blend-mode: screen; }
  body.winsom-responsive .winsom-footer img[src$="819_45.jpg"] {
    filter: grayscale(1) contrast(4);
    clip-path: inset(2px 0 0);
  }
}

/* Mobile reading paths and the architectural navigation surface. */
@media (max-width: 1024px) {
  body.ws-has-reading-nav { padding-top: calc(var(--ws-header-height, 72px) + 44px) !important; }
  body.ws-reading-standalone { padding-top: 44px !important; }
  .ws-reading-nav { display: flex; align-items: center; gap: 8px; position: fixed; top: var(--ws-header-height, 72px); left: 0; right: 0; z-index: 1090; height: 44px; padding: 0 12px; background: #f3f7f4; border-bottom: 1px solid #dce4df; color: #173d2b; box-sizing: border-box; font: 14px/1.5 "Microsoft Yahei", Arial, sans-serif; }
  .ws-reading-standalone .ws-reading-nav { top: 0; }
  .ws-reading-nav .ws-back-button { width: auto; flex: 0 0 auto; min-width: 70px; gap: 2px; padding: 0 6px 0 0; font: inherit; color: #01633a; }
  .ws-reading-title { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: center; }
  .ws-reading-nav .ws-reading-home { font-size: 14px; display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; color: #01633a; text-decoration: none; }
  .ws-reading-nav :focus-visible { outline: 2px solid #01633a; outline-offset: -2px; }
  .ws-drawer { inset: 8px auto 8px 8px; width: min(424px, calc(100% - 16px)); height: calc(100vh - 16px); height: calc(100dvh - 16px); max-height: calc(100% - 16px); overflow: hidden; border-radius: 14px; background: transparent; color: #f5faf7; box-shadow: 0 12px 36px rgb(3 30 18 / 22%), 0 28px 80px rgb(3 30 18 / 18%); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); isolation: isolate; }
  .ws-drawer[open]::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .92; background: linear-gradient(180deg, rgb(3 51 32 / 96%), rgb(3 51 32 / 82%) 48%, rgb(3 51 32 / 74%)), url("/Upload/projects/h-09292881301.jpg") 48% center / cover; }
  .ws-drawer::backdrop { background: rgb(7 29 19 / 32%); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
  .ws-drawer-head { min-height: 64px; padding: env(safe-area-inset-top, 0px) 18px 0; border: 0; }
  .ws-drawer-title { color: #f5faf7; font-size: 17px; font-weight: 500; }
  .ws-drawer .ws-icon-button { color: #f5faf7; border-radius: 6px; }
  .ws-drawer-intro { flex: 0 0 auto; padding: 10px 24px 22px; }
  .ws-drawer-intro p { margin: 0; max-width: 12em; color: #e4f1e9; font-size: clamp(22px, 5.5vw, 26px); line-height: 1.5; font-weight: 500; letter-spacing: -.02em; }
  .ws-drawer nav { padding: 0 18px 12px; scrollbar-color: #91b9a0 transparent; scrollbar-width: thin; }
  .ws-drawer nav > ul > li { border-color: rgb(225 244 233 / 18%); }
  .ws-drawer .ws-nav-row { gap: 0; border-radius: 6px; }
  .ws-drawer a { color: #f5faf7; font-size: 17px; min-height: 52px; padding: 12px 10px; }
  .ws-drawer a[aria-current="page"] { color: #fff; font-weight: 600; background: rgb(255 255 255 / 12%); border-radius: 6px; }
  .ws-drawer .ws-submenu { background: rgb(0 25 15 / 24%); border-radius: 6px; padding: 4px 0 8px 12px; }
  .ws-drawer .ws-submenu a { min-height: 44px; color: #e0efe6; font-size: 15px; }
  .ws-drawer-foot { justify-content: space-between; padding: 8px 22px max(12px, env(safe-area-inset-bottom, 0px)); border-color: rgb(225 244 233 / 18%); background: rgb(3 36 22 / 48%); }
  .ws-drawer-foot a { color: #f5faf7; font-size: 15px; min-height: 44px; }
  .ws-drawer :focus-visible { outline: 2px solid #e0f4e8; outline-offset: -2px; }
  .ws-drawer :where(a, button):hover { background: rgb(255 255 255 / 12%); }
  .ws-drawer :where(a, button):active { background: rgb(255 255 255 / 20%); }
  .ws-drawer ::selection { background: #d6f0e1; color: #123d28; }
  @media (prefers-reduced-motion: no-preference) {
    .ws-drawer[open] { animation: ws-drawer-reveal 220ms cubic-bezier(.16, 1, .3, 1); }
    .ws-drawer.ws-drawer-closing { animation: ws-drawer-dismiss 160ms ease-in forwards; }
    .ws-drawer .ws-nav-expand svg { transition: transform 160ms ease-out; }
    @keyframes ws-drawer-reveal { from { opacity: .5; transform: translateX(calc(-100% - 16px)); } to { opacity: 1; transform: translateX(0); } }
    @keyframes ws-drawer-dismiss { to { opacity: 0; transform: translateX(calc(-100% - 16px)); } }
  }
  @media (prefers-reduced-motion: reduce) { .ws-drawer { animation: none !important; } .ws-drawer * { transition: none !important; } }
  @media (prefers-reduced-transparency: reduce) { .ws-drawer { background: #063e2b; backdrop-filter: none; -webkit-backdrop-filter: none; } .ws-drawer[open]::before { background: none; } .ws-drawer::backdrop { backdrop-filter: none; -webkit-backdrop-filter: none; } }
}

/* Keep the contact and legal information grouped on narrow screens. */
.ws-footer-wechat { display: contents; }
.ws-footer-address-label { display: none; }
@media (max-width: 1024px) {
  body.winsom-responsive .ws-footer-wechat {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 96px;
    align-items: center;
    gap: 16px;
    margin: 0 0 16px;
  }
  body.winsom-responsive .ws-footer-wechat p { margin: 0; }
  body.winsom-responsive .ws-footer-wechat p:first-child { grid-area: 1 / 2; justify-self: end; }
  body.winsom-responsive .ws-footer-wechat p:first-child > br { display: none; }
  body.winsom-responsive .ws-footer-wechat p:last-child { grid-area: 1 / 1; min-width: 0; text-align: left; overflow-wrap: anywhere; }
  body.winsom-responsive .winsom-footer-links .ws-footer-wechat a { padding: 0 !important; }
  body.winsom-responsive .ws-footer-wechat img { display: block; width: 96px; height: auto; }
  body.winsom-responsive .ws-footer-address-label { display: inline; }
  body.winsom-responsive .winsom-footer li:has(> .ws-footer-icp) { flex-basis: 100%; text-align: left; }
  body.winsom-responsive .ws-footer-icp { display: block; margin-top: 8px; font-size: 12px; line-height: 1.8; white-space: normal; color: #fff; }
  body.winsom-responsive .ws-footer-icp a { display: inline; color: inherit !important; text-decoration: underline; white-space: nowrap; }
}

@media (max-width: 1024px) and (max-height: 500px) and (orientation: landscape) {
  body.winsom-responsive { --ws-header-height: 52px; }
  body.ws-has-reading-nav { padding-top: calc(var(--ws-header-height) + 44px) !important; }
  body.ws-reading-standalone { padding-top: 44px !important; }
  .ws-mobile-logo img { max-height: 42px; }
}

/* The two bars share one row on short landscape displays. */
@media (min-width: 600px) and (max-width: 1024px) and (max-height: 500px) and (orientation: landscape) {
  body.ws-has-reading-nav.ws-nav-ready { padding-top: var(--ws-header-height) !important; }
  body.ws-has-reading-nav .ws-mobile-header { padding-right: min(52%, 400px); }
  body.ws-has-reading-nav.ws-nav-ready .ws-reading-nav {
    inset: 0 0 auto auto; width: min(50%, 384px); height: var(--ws-header-height);
    padding-right: max(12px, env(safe-area-inset-right, 0px));
    border-left: 1px solid #dce4df; z-index: 1101;
  }
}