.page-hero { position: relative; overflow: hidden; min-height: 305px; display: grid; align-items: center; color: #fff; background: #123f78; }
.home-service-grid { grid-template-columns: repeat(4, 1fr); }
.home-service-grid .service-card { min-height: 278px; }
.home-more { display: flex; justify-content: flex-end; margin-top: 30px; }
.page-hero.has-image::before { content: ""; position: absolute; inset: 0; background: rgba(12, 49, 92, .73); }
.page-hero.has-image { background-position: center; background-size: cover; }
.page-hero .shell { position: relative; z-index: 1; padding: 62px 0; }
.breadcrumb { display: flex; align-items: center; gap: 8px; margin-bottom: 15px; color: #d8e7fb; font-size: 12px; }
.breadcrumb svg { width: 13px; }
.page-hero h1 { margin: 0; font-size: clamp(36px, 4.4vw, 56px); }
.page-hero p:last-child { max-width: 580px; margin: 15px 0 0; color: #d8e7fb; }
.page-section { padding: 76px 0 104px; }
.page-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; padding-bottom: 25px; border-bottom: 1px solid var(--line); }
.page-heading p { max-width: 500px; margin: 0; color: var(--muted); font-size: 14px; }
.content-grid { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 55px; margin-top: 43px; }
.side-menu { align-self: start; border-top: 3px solid #2c64ae; background: #f3f7fc; }
.side-menu h2 { padding: 23px 23px 18px; font-size: 19px; }
.side-menu a, .side-menu button { display: flex; width: 100%; align-items: center; justify-content: space-between; padding: 13px 23px; border: 0; border-top: 1px solid #dce6f2; color: #455361; background: transparent; font: inherit; font-size: 14px; text-align: left; cursor: pointer; }
.side-menu a:hover, .side-menu a.is-active, .side-menu button:hover, .side-menu button.is-active { color: #fff; background: #2c64ae; }
.side-menu a svg, .side-menu button svg { width: 15px; }
.side-menu button.has-active-child { color: #2c64ae; background: #e2edf9; }
.side-submenu { border-top: 1px solid #dce6f2; background: #fbfdff; }
.side-submenu[hidden] { display: none; }
.side-submenu button { padding-left: 43px; color: #627284; font-size: 13px; }
.side-submenu button.is-active { color: #fff; background: #2c64ae; }
.page-body h2 { margin-bottom: 20px; font-size: 32px; }
.page-body > p { color: var(--muted); }
.service-page-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.service-page-grid .service-card { min-height: 274px; }
.service-page-grid .service-card h3 { margin-top: 32px; }
.service-page-grid .service-card ul { display: flex; flex-wrap: wrap; gap: 7px; margin: 8px 0 21px; padding: 0; list-style: none; }
.service-page-grid .service-card li { padding: 3px 8px; color: #527096; border: 1px solid #cbd9ea; border-radius: 2px; font-size: 11px; }
.featured-card li { color: #e8f1ff !important; border-color: rgba(255,255,255,.38) !important; }
.service-detail-page-header { padding-bottom: 26px; border-bottom: 1px solid #dce6f2; }
.service-detail-page-header .eyebrow { margin-bottom: 9px; }
.service-detail-page-title { display: flex; align-items: center; gap: 13px; }
.service-detail-page-title > span { color: #2c64ae; font-size: 16px; font-weight: 800; }
.service-detail-page-title h2 { margin: 0; font-size: 32px; }
.service-detail-page-header > p:last-of-type { margin: 16px 0 0; color: #667586; line-height: 1.8; }
.service-detail-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 17px 0 0; padding: 0; list-style: none; }
.service-detail-tags li { padding: 4px 9px; color: #2c64ae; border: 1px solid #c2d4e8; background: #f3f7fc; font-size: 12px; }
.service-detail-page-body { padding-top: 8px; }
.service-detail-section { padding: 30px 0; border-bottom: 1px solid #dce6f2; }
.service-detail-section:last-child { border-bottom: 0; }
.service-detail-section-title { display: flex; align-items: center; gap: 10px; color: #2c64ae; }
.service-detail-section-title svg { width: 21px; }
.service-detail-section h3 { margin: 0; font-size: 22px; }
.service-detail-intro { margin: 14px 0 0; color: #667586; line-height: 1.8; }
.service-detail-list { margin: 19px 0 0; padding-left: 24px; color: #33465d; }
.service-detail-list > li { margin-bottom: 19px; padding-left: 5px; }
.service-detail-list > li:last-child { margin-bottom: 0; }
.service-detail-list h4 { margin: 0 0 8px; color: #182e4a; font-size: 16px; }
.service-detail-list ul { margin: 0; padding-left: 19px; color: #5b6d80; }
.service-detail-list ul li { margin-bottom: 7px; line-height: 1.75; }
.service-detail-consult { margin-top: 30px; }
.article-list { border-top: 3px solid #2c64ae; }
.public-empty-state { margin: 0; padding: 31px 24px; color: #667586; border-top: 3px solid #2c64ae; border-bottom: 1px solid var(--line); background: #f6f9fd; font-size: 14px; }
.article-row { display: grid; grid-template-columns: 46px minmax(0, 1fr) 42px; gap: 15px; align-items: center; padding: 23px 8px; border-bottom: 1px solid var(--line); }
.article-index, .file-number { color: #2c64ae; font-size: 13px; font-weight: 800; }
.article-meta { display: flex; gap: 15px; color: #2c64ae; font-size: 12px; font-weight: 700; }
.article-meta time { color: #8893a0; font-weight: 400; }
.article-row h3 { margin: 5px 0 2px; font-size: 19px; }
.article-row p { margin: 0; color: var(--muted); font-size: 13px; }
.circle-link { display: grid; width: 35px; height: 35px; place-items: center; border: 1px solid #c8d7e8; border-radius: 50%; color: #2c64ae; }
.circle-link svg { width: 16px; }
.about-layout { display: grid; grid-template-columns: .92fr 1.08fr; gap: 70px; align-items: center; }
.about-layout img { width: 100%; min-height: 400px; object-fit: cover; filter: saturate(.72); }
.about-copy p { color: var(--muted); }
.about-copy strong { color: var(--ink); font-weight: 800; }
.about-credentials-section { padding: 0 0 100px; }
.about-credentials-heading { display: flex; align-items: end; justify-content: space-between; gap: 35px; padding-bottom: 26px; border-bottom: 1px solid #dce6f2; }
.about-credentials-heading .eyebrow { margin: 0 0 9px; }
.about-credentials-heading h2 { margin: 0; font-size: 30px; }
.about-credentials-heading > p:last-child { max-width: 410px; margin: 0; color: var(--muted); line-height: 1.75; }
.credentials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 29px; }
.credential-card { margin: 0; border: 1px solid #dce6f2; background: #fff; }
.credential-preview { position: relative; display: grid; aspect-ratio: 4 / 3; place-items: center; overflow: hidden; background: #f5f7fa; }
.credential-preview.is-portrait { background: #eef2f7; }
.credential-preview img { width: 100%; height: 100%; object-fit: contain; transition: transform .25s ease; }
.credential-preview:hover img, .credential-preview:focus-visible img { transform: scale(1.025); }
.credential-preview:focus-visible { outline: 3px solid #d92b2b; outline-offset: 3px; }
.credential-open { position: absolute; right: 12px; top: 12px; display: grid; width: 32px; height: 32px; place-items: center; color: #fff; background: rgba(18,63,120,.88); opacity: 0; transition: opacity .2s ease; }
.credential-open svg { width: 16px; }
.credential-preview:hover .credential-open, .credential-preview:focus-visible .credential-open { opacity: 1; }
.credential-card figcaption { padding: 17px 19px 19px; border-top: 1px solid #dce6f2; }
.credential-card figcaption span { display: block; color: #2c64ae; font-size: 12px; font-weight: 700; }
.credential-card figcaption h3 { margin: 5px 0 0; color: #182e4a; font-size: 18px; }
.about-services-section { padding: 0 0 100px; }
.about-services { padding: 40px 48px 44px; border-top: 3px solid #2c64ae; background: #f6f9fd; }
.about-services h2 { margin-bottom: 22px; font-size: 30px; }
.about-services ol { columns: 2; column-gap: 70px; margin: 0; padding-left: 23px; color: #52667e; }
.about-services li { break-inside: avoid; margin: 0 0 13px; padding-left: 5px; line-height: 1.65; }
.about-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 30px; background: #dae4ef; }
.about-stats div { min-height: 115px; padding: 19px; background: #f6f9fd; }
.about-stats strong, .about-stats span { display: block; }
.about-stats strong { color: #2c64ae; font-size: 16px; }
.about-stats span { margin-top: 5px; color: #657384; font-size: 12px; }
.policy-filters { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 28px; }
.policy-filters span { padding: 7px 12px; color: #527096; border: 1px solid #cbd9ea; font-size: 13px; }
.policy-filters span:first-child { color: #fff; border-color: #2c64ae; background: #2c64ae; }
.download-list { border-top: 3px solid #2c64ae; }
.download-row { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; align-items: center; gap: 15px; padding: 23px 8px; border-bottom: 1px solid var(--line); }
.download-row h3 { margin: 0 0 5px; font-size: 18px; }
.download-row p { margin: 0; color: var(--muted); font-size: 12px; }
.download-row p span { margin-left: 17px; }
.download-button { display: inline-flex; align-items: center; gap: 7px; padding: 8px 10px; color: #2c64ae; border: 1px solid #b9cce5; background: #fff; font-size: 13px; font-weight: 700; }
.download-button svg { width: 15px; }
.message-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 62px; }
.contact-prompt { min-height: 350px; padding: 34px; color: #fff; background: #2c64ae; }
.contact-prompt h2 { margin: 40px 0 15px; font-size: 30px; }
.contact-prompt p { color: #dceaff; }
.contact-prompt i { color: #cfe1ff; }
.message-form { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.message-form label { display: grid; gap: 7px; color: #556272; font-size: 13px; font-weight: 700; }
.message-form input, .message-form select, .message-form textarea { width: 100%; padding: 11px 12px; border: 1px solid #cbd7e5; border-radius: 2px; color: var(--ink); outline: none; background: #fff; }
.message-form input:focus, .message-form select:focus, .message-form textarea:focus { border-color: #2c64ae; }
.message-form .full { grid-column: 1 / -1; }
.message-form .required-mark { color: #d92b2b !important; font-size: 14px; line-height: 1; }
.captcha-field { display: grid; gap: 7px; color: #556272; font-size: 13px; font-weight: 700; }
.captcha-field > label { display: block; }
.captcha-control { display: grid; grid-template-columns: minmax(0, 1fr) 104px; gap: 10px; }
.captcha-code { border: 1px solid #b8cce4; border-radius: 2px; color: #173e7a; background: #e7f0fb; font-family: Georgia, serif; font-size: 21px; font-weight: 700; letter-spacing: .16em; }
.captcha-code:hover { color: #fff; border-color: #2c64ae; background: #2c64ae; }
.message-form .is-invalid { border-color: #d92b2b; background: #fff8f8; }
.form-error { display: none; margin: -3px 0 0; color: #c82323; font-size: 13px; font-weight: 700; }
.form-error.show { display: block; }
.form-privacy-note { margin: -6px 0 0; color: #8994a0; font-size: 12px; }
.contact-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 43px; }
.contact-card { min-height: 170px; padding: 26px; border: 1px solid #d9e3ef; background: #fff; }
.contact-card svg { width: 25px; color: #2c64ae; }
.contact-card span, .contact-card strong { display: block; }
.contact-card span { margin-top: 24px; color: var(--muted); font-size: 12px; }
.contact-card strong { margin-top: 4px; font-size: 16px; }
.contact-card-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.contact-action { display: inline-flex; align-items: center; gap: 5px; width: fit-content; min-height: 30px; padding: 5px 8px; color: #2c64ae; border: 1px solid #b9cce5; background: #fff; font-size: 12px; font-weight: 700; text-decoration: none; cursor: pointer; }
.contact-action svg { width: 14px; }
.contact-action:hover { color: #fff; border-color: #2c64ae; background: #2c64ae; }
.contact-action:disabled { color: #8a98a8; border-color: #d5dee8; background: #f4f6f8; cursor: not-allowed; }
.contact-map-link.is-unavailable { color: #8a98a8; border-color: #d5dee8; background: #f4f6f8; cursor: default; pointer-events: none; }
.contact-note { margin-top: 18px; padding: 18px 21px; color: #667586; background: #eef4fb; font-size: 13px; }
.wechat-qr-dialog { width: min(92vw, 390px); padding: 0; border: 0; box-shadow: 0 20px 60px rgba(19, 48, 87, .28); }
.wechat-qr-dialog::backdrop { background: rgba(16, 38, 68, .58); }
.wechat-qr-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border-bottom: 1px solid #d9e3ef; }
.wechat-qr-dialog-header h2 { margin: 0; font-size: 19px; }
.wechat-qr-dialog .icon-button { flex: none; }
.wechat-qr-dialog img { display: block; width: min(100%, 280px); aspect-ratio: 1; margin: 24px auto 13px; object-fit: contain; }
.wechat-qr-dialog p { margin: 0; padding: 0 20px 22px; color: #687789; text-align: center; font-size: 14px; }

@media (max-width: 920px) {
  .content-grid, .about-layout, .message-layout { grid-template-columns: 1fr; gap: 36px; }
  .side-menu { display: grid; grid-template-columns: repeat(2, 1fr); }
  .side-menu h2 { grid-column: 1 / -1; }
  .side-submenu { grid-column: 1 / -1; }
  .contact-card-grid { grid-template-columns: 1fr 1fr; }
  .home-service-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
  .page-hero { min-height: 236px; }
  .page-hero .shell { padding: 45px 0; }
  .page-section { padding: 58px 0 72px; }
  .page-heading { align-items: start; flex-direction: column; gap: 15px; }
  .side-menu { grid-template-columns: 1fr; }
  .service-page-grid, .contact-card-grid { grid-template-columns: 1fr; }
  .service-detail-page-title h2 { font-size: 26px; }
  .service-detail-section { padding: 23px 0; }
  .service-detail-section h3 { font-size: 19px; }
  .home-service-grid { grid-template-columns: 1fr; }
  .home-more { justify-content: flex-start; }
  .article-row { grid-template-columns: 30px minmax(0, 1fr) 32px; padding: 18px 0; }
  .article-row h3 { font-size: 16px; }
  .article-row p { display: none; }
  .download-row { grid-template-columns: 30px minmax(0, 1fr); padding: 18px 0; }
  .download-button { grid-column: 2; justify-self: start; }
  .download-row p span { display: block; margin: 3px 0 0; }
  .about-stats, .message-form { grid-template-columns: 1fr; }
  .about-services-section { padding-bottom: 70px; }
  .about-credentials-section { padding-bottom: 70px; }
  .about-credentials-heading { align-items: start; flex-direction: column; gap: 11px; }
  .credentials-grid { grid-template-columns: 1fr; gap: 16px; }
  .credential-preview { aspect-ratio: 16 / 10; }
  .about-services { padding: 30px 24px 33px; }
  .about-services ol { columns: 1; }
  .message-form .full { grid-column: auto; }
}
