/* Shared reading and navigation fixes; loaded after the packaged page styles. */
:root { --mobile-header-height: 116px; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
:where(button, a, input, select, textarea):focus-visible { outline: 3px solid #1496be; outline-offset: 3px; }
:where(button, a) { touch-action: manipulation; }
.skip-content { position: fixed; left: 12px; top: 12px; z-index: 4000; padding: 12px 18px; background: #fff; color: #0d2b3a; transform: translateY(-160%); }
.skip-content:focus { transform: none; }
.cms-load-notice { margin: 12px; padding: 12px 16px; background: #fff; color: #0d2b3a; border: 1px solid #1496be; font: 14px/1.6 sans-serif; }
.cms-load-notice button { margin-inline-start: 12px; padding: 8px; background: #0d2b3a; border: 0; color: #fff; cursor: pointer; }
.menu .menu-language { display: inline-flex; margin-top: 24px; min-height: 44px; background: #fff; color: #0d2b3a; border-color: #fff; cursor: pointer; }
.mobile-category { color: #fff; }
.mobile-category summary { padding-block: 6px; font-size: clamp(26px, 7.5vw, 34px); font-weight: 600; cursor: pointer; }
.mobile-category a { display: block; min-height: 44px; padding: 10px 16px; font-size: 18px; line-height: 1.5; }
.carousel-toggle { position: absolute; right: 12px; top: 12px; z-index: 5; min-height: 44px; padding: 8px 12px; border: 1px solid #fff; border-radius: 5px; background: #0d2b3ad9; color: #fff; font: 14px/1.4 sans-serif; cursor: pointer; }
.news-article-body { overflow-wrap: anywhere; }
.news-article-body :where(img, video, audio) { max-width: 100%; }
.news-article-body :where(img, video) { height: auto; }
.news-article-body :where(pre, table) { max-width: 100%; overflow-x: auto; }
.news-article-body pre { white-space: pre-wrap; }
.wz-body, .menu__inner { overscroll-behavior: contain; }
.site-footer.site-footer--legal .site-footer__copyright { display: flex; }

@media (max-width: 1180px) {
  body .nav { display: grid; grid-template-columns: minmax(0, 1fr) auto 44px; gap: 12px; align-items: center; padding: 12px max(16px, env(safe-area-inset-right)) 12px max(16px, env(safe-area-inset-left)); }
  body .nav .nav__links { display: none; }
  body .nav .nav__logo { width: clamp(164px, 48vw, 224px); max-width: 100%; }
  body .nav .nav__logo img { width: 100%; height: auto; aspect-ratio: 1084 / 302; }
  body .nav .nav__cta { display: inline-flex; min-width: 60px; min-height: 44px; padding: 8px 12px; font-size: 15px; font-family: inherit; cursor: pointer; }
  body .nav .burger { display: block; width: 44px; height: 44px; margin-left: 0; }
  body .menu { display: flex; }
  body .menu__inner { padding-top: calc(var(--mobile-header-height) + 24px); padding-bottom: max(36px, env(safe-area-inset-bottom)); }
  body .service-hotline { min-height: 28px; padding-inline: 8px; font-size: clamp(9px, 2.5vw, 12px); line-height: 1.4; white-space: normal; }
  body .service-hotline + .nav, body .hero > .service-hotline ~ .nav { top: 28px; }
  body.activity-page > .service-hotline { background: #f7f8f5; }
  body .culture-main, body .news-main, body .news-article-main, body .video-main, body .video-detail-main { padding-top: calc(var(--mobile-header-height) + 20px); }
  body .shop-main { padding-top: var(--mobile-header-height); }
  body .shop-bar { position: relative; }
  :where(main, h1, h2, h3, [id]) { scroll-margin-top: calc(var(--mobile-header-height) + 16px); }
}
@media (max-width: 640px) {
  body { min-width: 0; }
  body .nav { gap: 8px; }
  body .nav .nav__logo { width: clamp(160px, 49vw, 216px); }
  body .news-article-main, body .culture-main, body .news-main, body .video-main, body .video-detail-main { width: calc(100% - 32px); }
  body .news-article-header h1 { font-size: clamp(28px, 7.5vw, 36px); line-height: 1.35; letter-spacing: -.015em; overflow-wrap: anywhere; }
  html:lang(zh) .news-article-header h1 { font-family: "PingFang SC", "Microsoft YaHei", sans-serif; font-weight: 650; }
  .news-article-back { min-height: 44px; margin-bottom: 16px; font-size: 14px; }
  .news-article--cms .news-article-date { display: block; font-size: 13px; line-height: 1.6; }
  .news-article-header { margin-bottom: 24px; }
  .news-article-body { width: 100%; font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif; font-size: 18px; line-height: 1.85; color: #203e4c; }
  .news-article-body :where(p, div, section, article, figure, blockquote) { max-width: 100% !important; min-width: 0 !important; height: auto !important; box-sizing: border-box; }
  .news-article-body :where(p, li, span, a, strong, em, b, i) { font-size: inherit !important; line-height: inherit !important; }
  .news-article-body :where(p, li) { color: #203e4c; font-size: 18px !important; line-height: 1.85 !important; }
  .news-article-body p { margin: 0 0 1.25em; }
  .news-article-body :where(h2, h3, h4) { line-height: 1.45 !important; margin-block: 1.4em .6em; }
  .news-article-body :where(img, video) { max-width: 100% !important; height: auto !important; object-fit: contain; }
  .news-article-body table { display: block; overflow-x: auto; width: 100%; }
  .news-article-body :where(td, th) { min-width: 6em; }
  .news-article-body blockquote { margin-inline: 0; padding-inline-start: 16px; border-left: 3px solid #1496be; }
  .news-article-body a { text-decoration: underline; text-underline-offset: 3px; }
  body .news-item h2, body .culture-item h3 { font-size: 24px; line-height: 1.35; overflow-wrap: anywhere; }
  body .news-item a > p, body .culture-item p { font-size: 16px; line-height: 1.75; }
  body .video-detail-heading h2 { font-size: 30px; line-height: 1.35; overflow-wrap: anywhere; }
  body .video-detail-intro, body .video-detail-description p:last-child { font-size: 17px; line-height: 1.8; }
  body .lead-story__copy { grid-template-columns: 1fr; gap: 12px; }
  body .section-heading { flex-wrap: wrap; gap: 16px; }
  body .shop-bar__in { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; }
  body .shop-brand { font-size: 19px; }
  body .shop-search { grid-column: 1 / -1; grid-row: 2; width: 100%; }
  body .shop-tools { grid-column: 2; grid-row: 1; }
  body .shop-cats { grid-column: 1 / -1; grid-row: 3; overflow-x: auto; width: 100%; }
  body .shop-cats > li > button, body .shop-cats > li > a { min-height: 44px; padding: 10px 12px; }
  body .shop-sec__h { flex-wrap: wrap; gap: 12px; align-items: center; }
  body .shop-sort { margin-left: 0; flex-wrap: wrap; }
  body .shop-sort button, body .shop-cat-tabs button, body .shop-add, body .shop-tool { min-height: 44px; }
  body .shop-slide .big { font-size: 72px; }
  body .shop-slide { gap: 8px; padding-inline: 6%; }
  body .shop-slide h2 { font-size: 26px; }
  body .shop-slide p { line-height: 1.6; }
  body .shop-dots button { width: 16px; height: 16px; }
  body .shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body .shop-card__b { padding-inline: 10px; }
  body .shop-card h3 { overflow-wrap: anywhere; }
  .wz-body :where(input, select, textarea), body .shop-search input, body .culture-search input { font-size: 16px; }
  .wz-modal { max-height: calc(100dvh - 24px); }
  .wz-x, .wz-qty button { min-width: 44px; min-height: 44px; }
  .wz-order__f { flex-wrap: wrap; }
  .wz-order__h { flex-wrap: wrap; }
  body .site-footer.site-footer--legal { grid-template-columns: 1fr; gap: 22px; }
  body .site-footer .site-footer__copyright { grid-column: 1; grid-row: auto; gap: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

