.about-page, .service-page, .product-page, .case-page, .standard-page, .sitemap-page {
  --cat-blue: #2563eb;
  --cat-blue-dark: #1d4ed8;
  --cat-ink: #12263b;
  --cat-muted: #64758a;
  --cat-soft: #f5f8fb;
  --cat-line: #e4eaf0;
  color: var(--cat-ink);
  background: #fff;
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", sans-serif;
}

.about-page *, .service-page *, .product-page *, .case-page *, .standard-page *, .sitemap-page *,
.about-page *::before, .service-page *::before, .product-page *::before, .case-page *::before,
.standard-page *::before, .sitemap-page *::before { box-sizing: border-box; }

.catalog-shell { width: min(1080px, calc(100% - 48px)); margin: 0 auto; }
.header-about, .header-service, .header-product, .header-case, .header-standard, .header-sitemap { height: 280px; background-position: center 0; background-repeat: no-repeat; background-size: cover; }
.header-about { background-image: url('/image/banner-300-container-about-background.jpg'); }
.header-service { background-image: url('/image/banner-300-container-service-background.jpg'); }
.header-product { background-image: url('/image/banner-300-container-product-background.jpg'); }
.header-case { background-image: url('/image/banner-300-container-case-background.jpg'); }
.header-standard { background-image: url('/image/banner-300-container-pay-background.jpg'); }
.header-sitemap { background-image: url('/image/banner-300-container-map-background.jpg'); }
.catalog-banner { height: 200px; }
.catalog-banner .banner-200-keywords { margin-top: 14px; }
.catalog-banner .banner-200-description { margin-top: 10px; }
.catalog-banner .banner-wave { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.catalog-banner .contact-banner__english, .catalog-banner .contact-banner__chinese, .catalog-banner .banner-200-description { display: block; opacity: 0; animation-fill-mode: both; animation-timing-function: cubic-bezier(.16,1,.3,1); }
.catalog-banner .contact-banner__english { animation: catalog-down 900ms 100ms both cubic-bezier(.16,1,.3,1); }
.catalog-banner .contact-banner__chinese { animation: catalog-up 900ms 260ms both cubic-bezier(.16,1,.3,1); }
.catalog-banner .banner-200-description { animation: catalog-up 900ms 1200ms both cubic-bezier(.16,1,.3,1); }
@keyframes catalog-down { from { opacity: 0; transform: translateY(-18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes catalog-up { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

.about-page .page-breadcrumb, .service-page .page-breadcrumb, .product-page .page-breadcrumb,
.case-page .page-breadcrumb, .standard-page .page-breadcrumb, .sitemap-page .page-breadcrumb { position: relative; background: #fff; }
.about-page .page-breadcrumb::after, .service-page .page-breadcrumb::after, .product-page .page-breadcrumb::after,
.case-page .page-breadcrumb::after, .standard-page .page-breadcrumb::after, .sitemap-page .page-breadcrumb::after { position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: #e5e7eb; content: ""; }
.about-page .page-breadcrumb__list, .service-page .page-breadcrumb__list, .product-page .page-breadcrumb__list,
.case-page .page-breadcrumb__list, .standard-page .page-breadcrumb__list, .sitemap-page .page-breadcrumb__list { display: flex; width: min(1080px, calc(100% - 48px)); min-height: 54px; margin: 0 auto; color: var(--cat-muted); font-size: 13px; align-items: center; }
.about-page .page-breadcrumb__item, .service-page .page-breadcrumb__item, .product-page .page-breadcrumb__item,
.case-page .page-breadcrumb__item, .standard-page .page-breadcrumb__item, .sitemap-page .page-breadcrumb__item { display: flex; align-items: center; }
.about-page .page-breadcrumb__item + .page-breadcrumb__item::before, .service-page .page-breadcrumb__item + .page-breadcrumb__item::before,
.product-page .page-breadcrumb__item + .page-breadcrumb__item::before, .case-page .page-breadcrumb__item + .page-breadcrumb__item::before,
.standard-page .page-breadcrumb__item + .page-breadcrumb__item::before, .sitemap-page .page-breadcrumb__item + .page-breadcrumb__item::before { width: 5px; height: 5px; margin: 0 12px; border-top: 1px solid #9cabbc; border-right: 1px solid #9cabbc; content: ""; transform: rotate(45deg); }
.about-page .page-breadcrumb a, .service-page .page-breadcrumb a, .product-page .page-breadcrumb a,
.case-page .page-breadcrumb a, .standard-page .page-breadcrumb a, .sitemap-page .page-breadcrumb a { color: var(--cat-muted); }
.about-page .page-breadcrumb a:hover, .service-page .page-breadcrumb a:hover, .product-page .page-breadcrumb a:hover,
.case-page .page-breadcrumb a:hover, .standard-page .page-breadcrumb a:hover, .sitemap-page .page-breadcrumb a:hover { color: var(--cat-blue-dark); }

.catalog-main { padding: 62px 0 100px; }
.catalog-heading { display: grid; margin-bottom: 38px; grid-template-columns: minmax(240px, .8fr) minmax(300px, 1.2fr); gap: 80px; align-items: end; }
.catalog-kicker { margin-bottom: 16px; color: var(--cat-blue); font-size: 10px; font-weight: 700; letter-spacing: 2px; }
.catalog-heading h1, .catalog-heading h2, .catalog-related__head h2 { color: var(--cat-ink); font-size: 36px; font-weight: 500; line-height: 1.3; }
.catalog-heading > p { color: var(--cat-muted); font-size: 14px; line-height: 1.9; }
.catalog-filter { display: flex; margin-bottom: 28px; border-bottom: 1px solid var(--cat-line); gap: 30px; }
.catalog-filter a { position: relative; padding: 14px 0 16px; color: var(--cat-muted); font-size: 13px; }
.catalog-filter a::after { position: absolute; right: 50%; bottom: -1px; left: 50%; height: 2px; background: var(--cat-blue); content: ""; transition: left 220ms ease, right 220ms ease; }
.catalog-filter a:hover, .catalog-filter a.is-active { color: var(--cat-ink); }
.catalog-filter a.is-active::after { right: 0; left: 0; }
.catalog-grid { display: grid; gap: 22px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.catalog-card { position: relative; min-width: 0; overflow: hidden; border-radius: 10px; background: #fff; box-shadow: 0 8px 26px rgba(20,48,78,.065); transition: box-shadow 280ms ease, transform 280ms ease; }
.catalog-card::after { position: absolute; top: 0; right: 0; bottom: 0; width: 42%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.38), transparent); content: ""; opacity: 0; pointer-events: none; transform: translateX(-180%) skewX(-12deg); transition: transform 650ms ease, opacity 180ms ease; }
.catalog-card:hover, .catalog-card:focus-within { box-shadow: 0 22px 48px rgba(20,48,78,.14); transform: translateY(-5px); }
.catalog-card:hover::after, .catalog-card:focus-within::after { opacity: 1; transform: translateX(280%) skewX(-12deg); }
.catalog-card__media { position: relative; display: block; height: 218px; overflow: hidden; background: #e9eff5; }
.catalog-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 650ms ease; }
.catalog-card:hover .catalog-card__media img { transform: scale(1.04); }
.catalog-card__mark { display: grid; width: 100%; height: 100%; color: #aac1dc; font-size: 54px; font-weight: 300; place-items: center; }
.catalog-card__sequence { position: absolute; top: 14px; left: 14px; display: grid; width: 34px; height: 24px; color: #fff; border-radius: 3px; background: rgba(13,36,61,.72); font-size: 10px; place-items: center; }
.catalog-card__body { position: relative; z-index: 1; padding: 24px 26px 26px; background: #fff; }
.catalog-card__category { min-height: 16px; color: var(--cat-blue); font-size: 10px; font-weight: 700; letter-spacing: .8px; }
.catalog-card h3 { margin-top: 9px; color: var(--cat-ink); font-size: 19px; font-weight: 600; line-height: 1.45; }
.catalog-card h3 a { color: inherit; }
.catalog-card__excerpt { display: -webkit-box; min-height: 44px; margin-top: 12px; overflow: hidden; color: var(--cat-muted); font-size: 13px; line-height: 1.7; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.catalog-card__more { display: inline-flex; margin-top: 20px; color: var(--cat-ink); font-size: 12px; align-items: center; gap: 12px; }
.catalog-card__more i { color: var(--cat-blue); font-style: normal; transition: transform 180ms ease; }
.catalog-card:hover .catalog-card__more i { transform: translateX(4px); }
.catalog-empty { display: grid; min-height: 260px; color: var(--cat-muted); border-radius: 10px; background: var(--cat-soft); text-align: center; grid-column: 1 / -1; place-content: center; gap: 10px; }
.catalog-empty strong { color: var(--cat-ink); font-size: 20px; }

.catalog-detail { padding: 0 0 100px; }
.catalog-detail__shell { width: min(1080px, calc(100% - 48px)); margin: 0 auto; }
.catalog-detail__header { max-width: 860px; padding: 66px 0 44px; }
.catalog-detail__header h1, .standard-header h1 { color: var(--cat-ink); font-size: 46px; font-weight: 500; line-height: 1.3; }
.catalog-detail__header > p:last-child, .standard-header > p:last-child { max-width: 720px; margin-top: 18px; color: var(--cat-muted); font-size: 15px; line-height: 1.9; }
.catalog-detail__cover { width: 100%; height: min(560px, 54vw); margin: 0 0 58px; overflow: hidden; border-radius: 10px; background: #e9eff5; }
.catalog-detail__cover img { width: 100%; height: 100%; object-fit: cover; }
.catalog-detail__layout { display: grid; grid-template-columns: 230px minmax(0, 680px); gap: 90px; justify-content: space-between; }
.catalog-detail__aside { display: flex; padding-top: 7px; border-top: 2px solid var(--cat-blue); flex-direction: column; align-self: start; }
.catalog-detail__aside > span { margin-top: 18px; color: #93a2b4; font-size: 9px; letter-spacing: 1.5px; }
.catalog-detail__aside strong { margin-top: 10px; color: var(--cat-ink); font-size: 17px; font-weight: 600; line-height: 1.5; }
.catalog-detail__aside a { display: flex; margin-top: 22px; color: var(--cat-blue-dark); font-size: 12px; align-items: center; justify-content: space-between; }
.catalog-detail__aside a i { font-style: normal; }
.catalog-detail__content { color: #36495e; font-size: 15px; line-height: 2.05; }
.catalog-detail__content p + p { margin-top: 22px; }
.catalog-related { padding: 78px 0 90px; background: var(--cat-soft); }
.catalog-related__head { margin-bottom: 32px; }
.catalog-related__grid { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.catalog-related__grid a { display: grid; min-height: 160px; padding: 24px; border-radius: 10px; background: #fff; box-shadow: 0 8px 24px rgba(20,48,78,.055); grid-template-columns: 1fr auto; align-content: space-between; transition: box-shadow 220ms ease, transform 220ms ease; }
.catalog-related__grid a:hover { box-shadow: 0 18px 38px rgba(20,48,78,.12); transform: translateY(-3px); }
.catalog-related__grid span { color: var(--cat-blue); font-size: 10px; font-weight: 700; }
.catalog-related__grid strong { margin-top: 14px; color: var(--cat-ink); font-size: 17px; line-height: 1.5; grid-column: 1 / -1; }
.catalog-related__grid i { color: var(--cat-blue); font-style: normal; grid-column: 2; grid-row: 1; }

.standard-main { padding: 68px 0 100px; }
.standard-shell { width: min(920px, calc(100% - 48px)); margin: 0 auto; }
.standard-header { max-width: 760px; padding-bottom: 44px; border-bottom: 1px solid var(--cat-line); }
.standard-content { max-width: 760px; padding: 48px 0 54px; color: #36495e; font-size: 15px; line-height: 2.05; }
.standard-content p + p { margin-top: 22px; }
.standard-documents { display: flex; max-width: 760px; margin-bottom: 40px; gap: 12px; }
.standard-documents a { display: inline-flex; min-height: 46px; padding: 0 18px; color: var(--cat-ink); border: 1px solid #d5dee8; border-radius: 6px; font-size: 13px; align-items: center; gap: 20px; transition: color 180ms ease, border-color 180ms ease, background 180ms ease; }
.standard-documents a:hover { color: #fff; border-color: var(--cat-blue); background: var(--cat-blue); }
.standard-footer { display: flex; max-width: 760px; padding: 26px 30px; border-radius: 8px; background: var(--cat-soft); align-items: center; justify-content: space-between; gap: 24px; }
.standard-footer p { color: var(--cat-muted); font-size: 13px; }
.standard-footer a { display: inline-flex; color: var(--cat-blue-dark); font-size: 13px; font-weight: 600; align-items: center; gap: 20px; }

.sitemap-main { padding: 62px 0 100px; }
.sitemap-grid { display: grid; border-top: 1px solid var(--cat-line); grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sitemap-grid section { padding: 30px 32px 36px; border-right: 1px solid var(--cat-line); border-bottom: 1px solid var(--cat-line); }
.sitemap-grid section:nth-child(3n) { border-right: 0; }
.sitemap-grid h2 { margin-bottom: 20px; color: var(--cat-ink); font-size: 19px; font-weight: 600; }
.sitemap-grid section > a { display: block; width: fit-content; margin-top: 12px; color: var(--cat-muted); font-size: 13px; line-height: 1.6; transition: color 180ms ease, transform 180ms ease; }
.sitemap-grid section > a:hover { color: var(--cat-blue-dark); transform: translateX(3px); }
.sitemap-grid__wide { border-right: 0 !important; grid-column: 1 / -1; }
.sitemap-news { display: grid; column-gap: 50px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sitemap-news a { display: grid; padding: 13px 0; border-bottom: 1px solid #eef2f6; grid-template-columns: 94px minmax(0, 1fr); gap: 16px; align-items: center; }
.sitemap-news time { color: #93a2b4; font-size: 11px; }
.sitemap-news span { overflow: hidden; color: var(--cat-ink); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.sitemap-news a:hover span { color: var(--cat-blue-dark); }

@media (max-width: 900px) {
  .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-detail__layout { grid-template-columns: 190px minmax(0, 1fr); gap: 50px; }
  .catalog-related__grid { grid-template-columns: 1fr; }
  .sitemap-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sitemap-grid section:nth-child(3n) { border-right: 1px solid var(--cat-line); }
  .sitemap-grid section:nth-child(2n) { border-right: 0; }
}

@media (max-width: 640px) {
  .catalog-shell, .catalog-detail__shell, .standard-shell { width: calc(100% - 32px); }
  .header-about, .header-service, .header-product, .header-case, .header-standard, .header-sitemap { height: 260px; }
  .catalog-banner .banner-200-keywords { margin-top: 8px; }
  .about-page .page-breadcrumb__list, .service-page .page-breadcrumb__list, .product-page .page-breadcrumb__list,
  .case-page .page-breadcrumb__list, .standard-page .page-breadcrumb__list, .sitemap-page .page-breadcrumb__list { width: calc(100% - 32px); overflow: hidden; white-space: nowrap; }
  .catalog-main, .sitemap-main { padding: 48px 0 72px; }
  .catalog-heading { grid-template-columns: 1fr; gap: 18px; }
  .catalog-heading h1, .catalog-heading h2, .catalog-related__head h2 { font-size: 30px; }
  .catalog-filter { overflow-x: auto; gap: 24px; }
  .catalog-filter a { flex: 0 0 auto; }
  .catalog-grid { grid-template-columns: 1fr; }
  .catalog-card__media { height: 230px; }
  .catalog-detail__header { padding: 48px 0 30px; }
  .catalog-detail__header h1, .standard-header h1 { font-size: 32px; }
  .catalog-detail__cover { height: 62vw; min-height: 220px; margin-bottom: 36px; }
  .catalog-detail__layout { grid-template-columns: 1fr; gap: 32px; }
  .catalog-detail__aside { padding-top: 16px; }
  .catalog-detail__content { font-size: 14px; }
  .catalog-related { padding: 56px 0 64px; }
  .standard-main { padding: 48px 0 72px; }
  .standard-footer { align-items: flex-start; flex-direction: column; }
  .standard-documents { align-items: stretch; flex-direction: column; }
  .sitemap-grid { grid-template-columns: 1fr; }
  .sitemap-grid section, .sitemap-grid section:nth-child(2n), .sitemap-grid section:nth-child(3n) { border-right: 0; }
  .sitemap-grid__wide { grid-column: auto; }
  .sitemap-news { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .catalog-banner * { animation: none !important; opacity: 1 !important; }
  .catalog-card::after { display: none; }
}
