/* Med In China — visual system adapted from the supplied Column reference. */
@font-face {
  font-family: Inter;
  src: url('/assets/fonts/inter-variable.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
:root {
  --color-indigo-navy: #111a4a;
  --color-midnight-ink: #011821;
  --color-slate-ink: #3b3e47;
  --color-steel: #7c7f88;
  --color-fog: #a9acb6;
  --color-silver-lining: #e3e4e8;
  --color-cloud-canvas: #f6f6f8;
  --color-seafoam-600: #44b48b;
  --color-seafoam-700: #167e6c;
  --color-signal-orange: #ec652b;
  --ink: var(--color-indigo-navy);
  --forest: var(--color-indigo-navy);
  --deep: #222d62;
  --mint: #f0f1f5;
  --lime: #e6f5ee;
  --paper: var(--color-cloud-canvas);
  --muted: #626570;
  --line: var(--color-silver-lining);
  --font: Inter, 'Helvetica Neue', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  --display: var(--font);
  --shadow-card: 0 1px 4px #12161e06, 0 1px 0 #12161e0d;
  --shadow-feature: 0 40px 32px #00000005, 0 22px 18px #00000008, 0 12px 10px #00000008, 0 7px 5px #0000000a, 0 3px 2px #00000012;
  --radius: 8px;
}
html {scroll-padding-top: 88px;}
body {font-family: var(--font); color: var(--color-slate-ink); background: var(--paper); -webkit-font-smoothing: antialiased;}
[hidden] {display: none !important;}
.wrap {width: min(1200px, calc(100% - 128px));}
h1,h2,h3,h4 {color: var(--ink); font-weight: 500;}
h1,.zh h1 {font-size: clamp(2.5rem, 4.2vw, 3.75rem); line-height: 1.12; font-weight: 600; letter-spacing: -.03em;}
h2,.zh h2 {font-size: clamp(2rem, 3.2vw, 3rem); line-height: 1.2; letter-spacing: -.025em;}
h3,.zh h3 {font-size: 1.5rem; line-height: 1.35; letter-spacing: -.015em; font-weight: 500;}
.zh h1,.zh h2 {line-height: 1.4; letter-spacing: -.02em;}
.zh h3 {line-height: 1.55; letter-spacing: 0;}
p {line-height: 1.75;}
.zh p {line-height: 1.9;}
.eyebrow {font-size: .875rem; line-height: 1.5; font-weight: 500; letter-spacing: .08em; color: var(--ink); margin-bottom: 24px;}
.eyebrow::before {display: none;}
.section {padding: 72px 0;}
.section-head {gap: 48px; margin-bottom: 40px;}
.section-head p {font-size: 1rem; line-height: 1.75;}
.section-head .eyebrow {font-size: .875rem; color: var(--ink); margin-bottom: 20px;}
.icon {stroke-width: 1.5;}
.btn,.zh .btn {min-height: 44px; padding: 12px 20px; gap: 12px; border-radius: 8px; font-size: .875rem; font-weight: 500; line-height: 1.5; letter-spacing: 0; transition: background .18s, border-color .18s, box-shadow .18s;}
.btn:hover {transform: none;}
.btn-primary {color: #fff; background: var(--ink); border-color: var(--ink); box-shadow: 0 1px 3px #111a4a1a, inset 0 1px 0 #ffffff30;}
.btn-primary:hover {background: #253066; border-color: #253066;}
.btn-outline {color: var(--ink); background: transparent; border-color: var(--ink);}
.btn-outline:hover {background: #111a4a08;}
.btn-white,.btn-light {color: var(--ink); background: #fff; border-color: #fff;}
.btn .icon {width: 18px; height: 18px;}
:is(button,a,input,select,textarea,summary):focus-visible {outline: 3px solid var(--color-seafoam-700); outline-offset: 4px;}
.text-link,.inline-action,.overview-link {color: var(--ink); font-size: .875rem; font-weight: 500; gap: 12px;}
.site-header {height: 72px; background: #ffffffd9; backdrop-filter: blur(16px); border-bottom: 1px solid #111a4a0d;}
.header-inner {gap: 24px;}
.brand-name {font-family: var(--font); font-size: 20px; font-weight: 600; letter-spacing: -.8px; color: var(--ink);}
.brand-name em {font-weight: 400;}
.brand-mark {width: 34px; height: 34px; border-radius: 8px; background: var(--ink); color: #fff;}
.nav {gap: 8px;}
.nav a {color: var(--color-slate-ink); font-size: .875rem; font-weight: 400; padding: 8px 12px; border: 1px solid transparent; border-radius: 8px;}
.nav a:hover {color: var(--ink); background: #f6f6f8;}
.nav a.active {font-weight: 500; color: var(--ink); border-color: #e3e4e8; background: #ffffff80;}
.nav a.active::after {display: none;}
.header-actions {gap: 20px;}
.language {font-size: .875rem; gap: 8px;}
.language a:not(.active) {color: #626570;}
.language .active {color: var(--ink); font-weight: 500;}
.language span {color: #a9acb6;}
.header-cta {min-height: 40px; padding: 10px 16px; font-size: .875rem;}
.mobile-support,.menu-button {color: var(--ink); border-radius: 8px;}
.ref-hero {padding: 72px 0 88px; border-bottom: 1px solid var(--line); background: linear-gradient(130deg, #f6f6f8 60%, #eef3f7);}
.ref-hero-grid {grid-template-columns: 1.05fr 1fr; grid-template-rows: auto 1fr; gap: 32px 64px; align-items: start;}
.ref-hero-copy {padding: 24px 0 0;}
.trust-badge {display: inline-flex; align-items: center; gap: 9px; padding: 0; background: transparent; border: 0; color: var(--ink); font-size: .875rem; line-height: 1.5; font-weight: 500; letter-spacing: 0; margin: 0 0 28px;}
.trust-badge .icon {color: var(--ink); width: 18px; height: 18px;}
.ref-hero h1 {font-size: clamp(2.75rem, 4vw, 3.5rem); font-weight: 600; line-height: 1.12; letter-spacing: -.035em; margin: 0 0 28px; color: var(--ink);}
.zh .ref-hero h1 {font-size: clamp(2.25rem, 3.4vw, 3rem); line-height: 1.42; letter-spacing: -.03em;}
.ref-hero h1 span {color: var(--ink);}
.ref-hero-copy>p {font-size: 1.0625rem; line-height: 1.8; color: var(--color-slate-ink); max-width: 540px; margin: 0;}
.zh .ref-hero-copy>p {line-height: 1.95;}
.ref-hero-actions {align-self: start;}
.ref-dual-actions {gap: 12px; margin: 0; flex-wrap: wrap; flex-direction: row;}
.ref-dual-actions .btn,.zh .ref-dual-actions .btn {font-size: .875rem; padding: 12px 18px; min-height: 48px; flex: 0 1 auto;}
.ref-hero-visual {height: 100%; min-height: 488px; margin: 0; border-radius: 8px; border: 1px solid #fff; box-shadow: var(--shadow-feature);}
.ref-hero-visual img {object-position: 53% center;}
@media (max-width: 1100px) {
 .wrap {width: calc(100% - 80px);}
 .header-inner {gap: 16px;}
 .nav {gap: 0;}
 .nav a {padding: 8px 10px;}
 .header-actions {gap: 12px;}
 .header-cta {padding: 10px 12px;}
 .ref-hero {padding: 56px 0 72px;}
 .ref-hero-grid {gap: 28px 40px;}
 .ref-hero h1 {font-size: 2.8rem;}
 .zh .ref-hero h1 {font-size: 2.3rem;}
 .ref-hero-visual {min-height: 480px;}
 .ref-dual-actions {flex-direction: column; align-items: flex-start;}
 .ref-dual-actions .btn {width: auto;}
}
@media (max-width: 880px) {
 .wrap {width: calc(100% - 64px);}
 .nav {background: #fff; border-color: var(--line); padding: 16px 24px; gap: 8px;}
 .nav a {padding: 12px 16px;}
 .ref-hero {padding: 40px 0 56px;}
 .ref-hero-grid {gap: 28px 32px;}
 .ref-hero h1 {font-size: 2.35rem;}
 .zh .ref-hero h1 {font-size: 2.05rem;}
 .ref-hero-copy {padding-top: 0;}
 .ref-hero-copy>p {font-size: 1rem;}
 .trust-badge {font-size: .8125rem; margin-bottom: 24px;}
 .ref-hero-visual {min-height: 480px;}
}
@media (max-width: 600px) {
 .wrap {width: calc(100% - 40px);}
 .site-header {height: 68px;}
 .header-inner {gap: 8px;}
 .brand {grid-template-columns: 32px auto; column-gap: 8px;}
 .brand-mark {width: 32px; height: 32px; border-radius: 8px;}
 .brand-name {font-size: 16px; letter-spacing: -.65px;}
 .brand-page {font-size: .75rem; color: #626570;}
 .header-actions {gap: 4px;}
 .language {font-size: .8125rem; gap: 6px;}
 .language a {padding: 10px 0;}
 .mobile-support {width: 40px; height: 44px;}
 .ref-hero {padding: 36px 0 48px;}
 .ref-hero-grid {gap: 28px;}
 .ref-hero h1 {font-size: 2.5rem; line-height: 1.14; letter-spacing: -.03em; margin-bottom: 24px;}
 .zh .ref-hero h1 {font-size: 1.95rem; line-height: 1.5; letter-spacing: -.025em;}
 .trust-badge {font-size: .8125rem; margin-bottom: 20px;}
 .ref-hero-copy>p {font-size: 1rem; line-height: 1.8;}
 .ref-hero-visual {height: 260px; min-height: 0; border-radius: 8px; box-shadow: var(--shadow-card);}
 .ref-dual-actions {flex-direction: column; align-items: stretch; gap: 12px;}
 .ref-dual-actions .btn,.zh .ref-dual-actions .btn {font-size: .875rem; width: 100%; min-height: 48px;}
}
@media (prefers-reduced-motion: reduce) {html {scroll-behavior: auto;} *,*::before,*::after {transition: none !important;}}

/* Reading sections: quieter surfaces, a clear typographic hierarchy. */
.overview-hero {padding: 72px 0; background: #fff;}
.overview-hero-grid {grid-template-columns: 1fr 1.1fr; gap: 72px;}
.overview-hero-copy {padding: 8px 0;}
.overview-hero h2,.zh .overview-hero h2 {font-size: clamp(2rem, 3vw, 2.625rem); font-weight: 500; line-height: 1.3; letter-spacing: -.025em; margin-bottom: 24px;}
.zh .overview-hero h2 {line-height: 1.45;}
.overview-hero h2 span {color: var(--ink);}
.overview-hero-copy>p:not(.eyebrow),.overview-hero-copy>p.overview-lead {font-size: 1rem; line-height: 1.8; color: var(--color-slate-ink); margin-bottom: 20px;}
.overview-hero-copy>p:not(.eyebrow):not(.overview-lead) {color: var(--muted);}
.overview-hero-image {min-height: 384px; border-radius: 8px;}
.overview-link {color: var(--ink); font-size: .875rem; font-weight: 500;}
.overview-hero .eyebrow,.overview-advantages .eyebrow,.overview-us .eyebrow,.overview-services .eyebrow {font-size: .875rem; font-weight: 500; letter-spacing: .08em; margin-bottom: 24px;}
.overview-advantages,.overview-us,.overview-services {padding: 80px 0;}
.overview-advantages {background: var(--paper); border-top: 1px solid var(--line);}
.overview-advantages-layout {grid-template-columns: .9fr 1.3fr; gap: 72px;}
.overview-advantages h2,.overview-us h2,.overview-services h2 {font-size: clamp(2rem, 3vw, 2.75rem); font-weight: 500; line-height: 1.25; letter-spacing: -.025em;}
.zh .overview-advantages h2,.zh .overview-us h2,.zh .overview-services h2 {line-height: 1.45;}
.overview-advantages-intro>p:not(.eyebrow) {font-size: 1rem; color: var(--muted); line-height: 1.8; margin: 24px 0;}
.national-fact {border-color: var(--line); margin-top: 32px; padding-top: 32px;}
.national-fact strong {font-family: var(--font); font-size: 3.75rem; font-weight: 500; line-height: 1; letter-spacing: -.04em; color: var(--color-seafoam-700); margin-bottom: 16px; font-variant-numeric: tabular-nums;}
.national-fact>span {font-size: 1rem; font-weight: 500; color: var(--ink);}
.national-fact small {font-size: .8125rem; color: var(--muted); margin-top: 8px;}
.national-fact a {font-size: .8125rem; color: var(--muted); margin-top: 4px;}
.overview-advantage-grid {gap: 24px;}
.overview-advantage-grid article {padding: 24px; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow-card);}
.overview-icon,.icon-box {width: 40px; height: 40px; border-radius: 8px; color: var(--ink); background: #f0f1f5;}
.overview-icon .icon,.icon-box .icon {width: 24px; height: 24px;}
.overview-advantage-grid h3 {font-size: 1.25rem; font-weight: 500; margin: 24px 0 16px;}
.overview-advantage-grid p {font-size: 1rem; color: var(--muted); line-height: 1.75;}
.overview-sources {border-color: var(--line); margin-top: 32px; padding-top: 24px; gap: 40px;}
.overview-sources>p,.overview-sources details {font-size: .875rem; line-height: 1.75; color: var(--muted);}
.overview-sources summary {color: var(--ink);}
.overview-sources a {color: var(--muted);}
.overview-us {background: var(--ink); color: #fff;}
.overview-us-intro {grid-template-columns: 1fr 1.1fr; gap: 72px;}
.overview-us-intro>figure {border-radius: 8px; min-height: 440px;}
.overview-us h2,.overview-us h3,.overview-us .eyebrow {color: #fff;}
.overview-us .eyebrow {color: #cbccdf;}
.overview-us-intro>div>p:not(.eyebrow),.overview-us-intro>div>p.overview-us-lead {font-size: 1rem; line-height: 1.8; color: #cbccdf; margin: 24px 0 0;}
.overview-us .overview-link {color: #fff; margin-top: 24px;}
.overview-standards {gap: 0 48px; margin-top: 48px;}
.overview-standards article {border-color: #ffffff30; gap: 24px; padding: 28px 0;}
.overview-standards article>span {color: #94efb7; font: 400 .875rem/1.9 ui-monospace, monospace; padding-top: 3px;}
.overview-standards h3 {font-size: 1.25rem; font-weight: 500; margin-bottom: 12px;}
.overview-standards p {font-size: 1rem; line-height: 1.8; color: #cbccdf;}
.overview-services {background: var(--paper);}
.overview-section-head {gap: 72px; margin-bottom: 40px; align-items: end;}
.overview-section-head>p {font-size: 1rem; color: var(--muted); line-height: 1.8;}
.overview-service-grid {gap: 24px;}
.overview-service-grid article {padding: 32px 24px 24px; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: var(--shadow-card);}
.overview-service-grid article:last-child {border-top: 3px solid var(--color-signal-orange); padding-top: 30px;}
.overview-service-top {margin-bottom: 32px;}
.overview-service-top>span:last-child {font: .875rem/1.5 ui-monospace, monospace; color: var(--color-steel);}
.overview-service-grid h3 {font-size: 1.5rem; font-weight: 500; line-height: 1.35; margin-bottom: 16px;}
.overview-service-grid article>p {font-size: 1rem; color: var(--muted); line-height: 1.8; margin-bottom: 24px;}
.overview-service-grid li {font-size: .875rem; border-color: var(--line); color: var(--color-slate-ink); padding: 12px 0;}
.overview-service-grid li .icon {color: var(--ink);}
.overview-service-grid .overview-link {font-size: .875rem; color: var(--ink);}
.overview-service-footer {margin-top: 32px; gap: 48px;}
.overview-service-footer p {font-size: .875rem; line-height: 1.8; color: var(--muted);}

/* Shared inner-page components. */
.page-intro {padding: 40px 0 72px; background: var(--paper);}
.breadcrumbs {font-size: .875rem; color: var(--muted); gap: 12px; margin-bottom: 48px;}
.breadcrumbs a {color: var(--ink);}
.intro-grid {grid-template-columns: 1.35fr .8fr; gap: 80px; align-items: center;}
.intro-grid h1,.zh .intro-grid h1 {font-size: clamp(2.5rem, 4vw, 3.5rem); font-weight: 600; line-height: 1.15; letter-spacing: -.03em; max-width: 750px; margin-bottom: 24px;}
.zh .intro-grid h1 {font-size: clamp(2.25rem, 3.6vw, 3.25rem); line-height: 1.4;}
.intro-grid .eyebrow {font-size: .875rem; margin-bottom: 24px;}
.intro-grid>div>p:not(.eyebrow) {font-size: 1.125rem; color: var(--muted); line-height: 1.8; max-width: 680px; margin: 0;}
.intro-aside {padding: 24px; border-radius: 8px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-card);}
.intro-aside h3 {font-size: 1.25rem; line-height: 1.5; margin-bottom: 16px;}
.intro-aside button {font-size: .875rem; color: var(--ink); border-color: var(--line); padding: 16px 0;}
.service-jump {gap: 12px; padding-bottom: 32px;}
.service-jump a {padding: 12px 20px; border-radius: 8px; border: 1px solid var(--line); background: #fff; color: var(--ink); font-size: .875rem; font-weight: 500;}
.service-jump a:hover {border-color: var(--ink);}
.service-detail {grid-template-columns: .95fr 1.1fr; gap: 80px; padding: 56px 0; border-color: var(--line);}
.service-detail:first-child {padding-top: 0;}
.service-detail:last-child {padding-bottom: 0;}
.service-title>.icon-box {width: 44px; height: 44px; margin-bottom: 24px; border-radius: 8px;}
.service-title .card-number {font: .875rem/1.5 ui-monospace, monospace; color: var(--color-steel);}
.service-title h2 {font-size: 2rem; font-weight: 500; line-height: 1.3; letter-spacing: -.025em; margin-bottom: 20px;}
.service-title>p {font-size: 1rem; line-height: 1.8; color: var(--muted);}
.service-detail h4 {font-size: 1rem; font-weight: 500; line-height: 1.6;}
.check-list {margin: 16px 0 24px;}
.check-list li {font-size: 1rem; line-height: 1.8; padding: 10px 0; color: var(--color-slate-ink);}
.check-list .icon {color: var(--ink);}
.deliverable {padding: 24px; background: var(--paper); border-radius: 8px; border-color: var(--line);}
.deliverable p {font-size: 1rem; line-height: 1.8; color: var(--muted); margin: 12px 0 0;}
.dark {background: var(--color-midnight-ink); color: #fff;}
.dark h2,.dark h3,.dark .eyebrow {color: #fff;}
.dark .muted {color: #cbcccf;}
#process {background: var(--color-seafoam-700);}
#process .steps p {color: #eef8f3;}
#process .step-number {color: #fff;}
.steps {gap: 40px;}
.steps article {border-color: #ffffff30;}
.step-number {display: inline-flex; align-items: center; justify-content: center; gap: 0; padding: 0; flex-shrink: 0; text-align: center; color: #94efb7; background: transparent; font: .875rem/1 ui-monospace, monospace; border: 1px solid #ffffff40; width: 40px; height: 40px; border-radius: 8px;}
.step-number::after {content: none;}
.steps h3 {font-size: 1.25rem; font-weight: 500; line-height: 1.5; margin-top: 24px;}
.steps p {font-size: 1rem; line-height: 1.8; color: #cbcccf;}
.standards-grid {gap: 24px;}
.standards-grid article {padding: 24px; border-radius: 8px; border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow-card);}
.standards-grid article>span {color: var(--color-steel); font: .875rem/1.5 ui-monospace, monospace;}
.standards-grid h3 {font-size: 1.25rem; margin: 24px 0 16px; font-weight: 500;}
.standards-grid p {font-size: 1rem; line-height: 1.8; color: var(--muted);}
.fee-panel {padding: 32px; border-radius: 8px; background: #fff; border: 1px solid var(--line); margin-top: 32px; gap: 48px;}
.fee-panel h3 {font-size: 1.5rem; line-height: 1.4; font-weight: 500;}
.fee-panel p {font-size: 1rem; color: var(--muted); line-height: 1.8;}
.fee-panel small {font-size: .875rem; color: var(--muted); line-height: 1.8;}
.scenario-grid {gap: 24px;}
.scenario-grid article {padding: 24px; background: var(--paper); border-radius: 8px; border: 1px solid var(--line);}
.scenario-grid h3 {font-size: 1.25rem; font-weight: 500; margin-bottom: 16px;}
.scenario-grid p {font-size: 1rem; line-height: 1.8; color: var(--muted);}
.faq-layout {grid-template-columns: .85fr 1.25fr; gap: 72px;}
.faq-layout h2 {font-size: 2.5rem; line-height: 1.3; letter-spacing: -.025em;}
.faq-list details,.faq-list details:last-child {border: 1px solid var(--line); border-radius: 8px; background: #fff; margin-bottom: 12px;}
.faq-list summary {font-size: 1rem; font-weight: 500; line-height: 1.65; color: var(--ink); padding: 20px 24px; gap: 16px;}
.faq-list summary .icon {width: 20px; height: 20px; flex-shrink: 0;}
.faq-list details>p {font-size: 1rem; color: var(--muted); line-height: 1.8; padding: 0 24px 24px;}
.program-grid,.guide-grid {gap: 24px;}
.program-card,.guide-card {padding: 24px; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow-card); color: var(--color-slate-ink); transition: border-color .2s, background .2s;}
.program-card:hover,.guide-card:hover {transform: none; border-color: #a9acb6; background: #fdfdfe;}
.program-top,.guide-card-top {margin-bottom: 32px;}
.program-card .icon-box {background: #f0f1f5; border-radius: 8px; color: var(--ink);}
.card-number,.guide-number {font: .875rem/1.5 ui-monospace, monospace; color: var(--color-steel);}
.guide-card-top .icon {color: var(--ink);}
.card-tag,.program-card .card-tag,.guide-card .card-tag {font-size: .8125rem; font-weight: 400; color: var(--muted); letter-spacing: .015em; margin-bottom: 16px;}
.card-tag span {color: var(--muted);}
.program-card h3,.guide-card h3 {font-size: 1.5rem; font-weight: 500; line-height: 1.4; margin-bottom: 16px;}
.program-card .card-description,.guide-card>p:not(.card-tag) {font-size: 1rem; line-height: 1.8; color: var(--muted);}
.card-bottom {font-size: .875rem; font-weight: 500; color: var(--ink); border-color: var(--line); padding-top: 24px;}
.guide-card .text-link {font-size: .875rem; color: var(--ink);}
.scope-note {margin-top: 32px; font-size: .875rem; color: var(--muted); line-height: 1.8; gap: 16px;}
.scope-note .icon {color: var(--ink);}
.program-explain,.quality-layout,.mission-grid {gap: 80px;}
.number-list>div {gap: 24px; padding: 28px 0; border-color: var(--line);}
.number-list>div>span {font: .875rem/1.5 ui-monospace, monospace; color: var(--color-seafoam-700);}
.number-list h3 {font-size: 1.25rem; line-height: 1.5; font-weight: 500; margin-bottom: 12px;}
.number-list p {font-size: 1rem; line-height: 1.8; color: var(--muted);}
.featured-guide {border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: var(--shadow-card);}
.featured-image {min-height: 384px;}
.featured-image img {object-fit: cover;}
.featured-content {padding: 40px;}
.featured-content h2 {font-size: 2rem; font-weight: 500; line-height: 1.35; letter-spacing: -.02em;}
.featured-content>p:not(.eyebrow) {font-size: 1rem; line-height: 1.8; color: var(--muted); margin: 24px 0;}
.image-label {border-radius: 9999px; font-size: .75rem; color: var(--ink); background: #ffffffdf;}
.guidance-note {gap: 24px;}
.guidance-note h3 {font-size: 1.5rem; font-weight: 500; line-height: 1.4; margin-bottom: 16px;}
.guidance-note p {font-size: 1rem; line-height: 1.8; color: var(--muted);}
.about-hero-image {height: 320px; border-radius: 8px; box-shadow: var(--shadow-feature);}
.mission-grid h2 {font-size: 2.75rem; font-weight: 500; line-height: 1.3;}
.mission-grid p {font-size: 1.0625rem; line-height: 1.8;}
.value-grid {gap: 24px;}
.value-grid article {padding: 32px 24px; gap: 24px; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow-card);}
.value-grid h3 {font-size: 1.5rem; font-weight: 500; margin-bottom: 16px;}
.value-grid p {font-size: 1rem; line-height: 1.8; color: var(--muted);}
.role-grid {gap: 24px;}
.role-grid article {padding: 32px 24px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper);}
.role-number {color: var(--color-seafoam-700); font: .875rem/1.5 ui-monospace, monospace; margin-bottom: 32px;}
.role-grid h3 {font-size: 1.5rem; font-weight: 500; margin-bottom: 16px;}
.role-grid p {font-size: 1rem; color: var(--muted); line-height: 1.8;}
.boundary {gap: 72px; padding: 40px 0;}
.boundary h3 {font-size: 1.25rem; font-weight: 500; line-height: 1.5;}
.boundary p {font-size: 1rem; color: var(--muted); line-height: 1.8;}
.cta-band {padding: 48px; border: 1px solid var(--line); border-radius: 8px; background: #fff; gap: 48px;}
.cta-band h2 {font-size: 2.25rem; font-weight: 500; line-height: 1.3; letter-spacing: -.025em;}
.cta-band p {font-size: 1rem; line-height: 1.8; color: var(--muted); margin-top: 24px;}
.site-footer {background: #fff; color: var(--color-slate-ink); border-top: 1px solid var(--line); padding: 48px 0 24px;}
.footer-top {gap: 64px; padding-bottom: 40px;}
.site-footer .brand-mark {background: var(--ink); color: #fff;}
.footer-brand p {font-size: .875rem; color: var(--muted); line-height: 1.8; margin-top: 24px;}
.footer-links h4 {font-size: .875rem; line-height: 1.5; color: var(--muted); font-weight: 400; margin-bottom: 20px;}
.footer-links a,.footer-links button {font-size: .875rem; color: var(--ink); line-height: 1.7; margin: 12px 0;}
.footer-bottom {border-color: var(--line); color: var(--muted); font-size: .8125rem; line-height: 1.8; gap: 48px; padding-top: 24px;}
.mobile-bottom-nav {background: #ffffffed; border-top: 1px solid var(--line); box-shadow: none; backdrop-filter: blur(16px);}
.mobile-bottom-nav a {color: var(--muted); font-size: .75rem; font-weight: 400;}
.mobile-bottom-nav a.active {color: var(--ink); font-weight: 500;}
.mobile-bottom-nav a.active::before {background: #eef0f8; border-radius: 8px;}

/* Dialogs keep the same consultation, program and guide behavior. */
.detail-dialog,.consult-dialog {padding: 40px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--color-slate-ink); box-shadow: var(--shadow-feature);}
dialog::backdrop {background: #01182180; backdrop-filter: blur(4px);}
.dialog-close {width: 40px; height: 40px; top: 16px; right: 16px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink);}
.detail-dialog h2,.consult-dialog h2,.zh .detail-dialog h2,.zh .consult-dialog h2 {font-size: 2rem; font-weight: 500; line-height: 1.4; letter-spacing: -.025em; padding-right: 20px;}
.detail-intro,.consult-heading>p:not(.eyebrow) {font-size: 1rem; color: var(--muted); line-height: 1.8;}
.detail-dialog .eyebrow,.consult-heading .eyebrow {font-size: .875rem; max-width: calc(100% - 24px);}
.detail-section h3 {font-size: 1.25rem; font-weight: 500; line-height: 1.5; margin-bottom: 12px;}
.detail-section p,.detail-section li {font-size: 1rem; line-height: 1.8; color: var(--color-slate-ink);}
.detail-note {padding: 24px; border-radius: 8px; background: var(--paper); font-size: .875rem; line-height: 1.8; color: var(--muted); border-color: var(--line);}
.form-grid {gap: 24px;}
.form-grid label {font-size: .875rem; font-weight: 500; line-height: 1.6; gap: 8px; color: var(--ink);}
input,select,textarea {min-height: 48px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--color-slate-ink); font-size: 1rem; line-height: 1.5;}
input::placeholder,textarea::placeholder {color: #7c7f88;}
input:focus,select:focus,textarea:focus {border-color: var(--ink); background: #fff;}
.form-privacy {padding: 20px 0; border-color: var(--line);}
.form-privacy p,.form-urgent {font-size: .8125rem; line-height: 1.8; color: var(--muted);}
.form-privacy .icon {color: var(--ink);}
.form-submit {font-size: .875rem;}
.review-lead,.whatsapp-status {font-size: 1rem; color: var(--muted); line-height: 1.8;}
#inquiry-message {background: var(--paper); border: 1px solid var(--line); border-radius: 8px; color: var(--color-slate-ink); padding: 24px; font: 1rem/1.8 var(--font); white-space: pre-wrap; overflow-wrap: anywhere;}
.review-actions {gap: 12px;}
.btn.disabled {opacity: .55; box-shadow: none; cursor: not-allowed;}
@media (max-width: 1100px) {
 .overview-hero-grid,.overview-advantages-layout,.overview-us-intro,.overview-section-head {gap: 40px;}
 .overview-advantages-layout {grid-template-columns: .85fr 1.2fr;}
 .intro-grid {gap: 40px;}
 .intro-grid h1 {font-size: 3rem;}
 .zh .intro-grid h1 {font-size: 2.65rem;}
 .service-detail {gap: 48px;}
 .program-explain,.quality-layout,.mission-grid,.faq-layout {gap: 48px;}
 .standards-grid {grid-template-columns: repeat(2,1fr);}
 .steps {gap: 24px;}
 .overview-service-grid article {padding-left: 24px; padding-right: 24px;}
 .cta-band {padding: 40px; gap: 32px;}
}
@media (max-width: 880px) {
 .section {padding: 56px 0;}
 .section-head {gap: 32px; margin-bottom: 32px;}
 h2,.zh h2 {font-size: 2.2rem;}
 .overview-hero,.overview-advantages,.overview-us,.overview-services {padding: 56px 0;}
 .overview-hero-grid {grid-template-columns: 1.1fr 1fr; gap: 32px;}
 .overview-hero h2,.zh .overview-hero h2 {font-size: 2rem;}
 .overview-hero-image {min-height: 380px;}
 .overview-advantages-layout {grid-template-columns: 1fr; gap: 32px;}
 .national-fact {padding-top: 24px; margin-top: 24px;}
 .national-fact strong {margin: 0;}
 .national-fact small,.national-fact a {margin: 0;}
 .overview-advantage-grid {gap: 24px;}
 .overview-us-intro {gap: 32px; grid-template-columns: .85fr 1fr;}
 .overview-us-intro>figure {min-height: 440px;}
 .overview-advantages h2,.overview-us h2,.overview-services h2 {font-size: 2.2rem;}
 .overview-standards {gap: 0 32px;}
 .overview-service-grid {grid-template-columns: 1fr;}
 .overview-service-grid article {padding: 24px;}
 .overview-service-grid article:last-child {padding-top: 22px;}
 .overview-service-top {margin-bottom: 24px;}
 .overview-service-grid ul {margin-bottom: 24px;}
 .page-intro {padding: 32px 0 56px;}
 .breadcrumbs {margin-bottom: 32px;}
 .intro-grid {grid-template-columns: 1fr; gap: 32px;}
 .intro-grid h1,.zh .intro-grid h1 {font-size: 2.75rem;}
 .intro-grid>div>p:not(.eyebrow) {font-size: 1rem;}
 .intro-aside {max-width: 560px; width: 100%;}
 .service-detail {gap: 32px;}
 .service-title h2 {font-size: 1.75rem;}
 .steps {grid-template-columns: 1fr 1fr; gap: 40px;}
 .fee-panel {padding: 24px; gap: 32px;}
 .faq-layout {gap: 32px; grid-template-columns: .8fr 1.2fr;}
 .faq-layout h2 {font-size: 2rem;}
 .program-grid,.guide-grid {grid-template-columns: repeat(2,minmax(0,1fr));}
 .program-card h3,.guide-card h3 {font-size: 1.375rem;}
 .featured-content {padding: 32px;}
 .featured-content h2 {font-size: 1.75rem;}
 .about-hero-image {height: 340px;}
 .mission-grid h2 {font-size: 2.25rem;}
 .value-grid article {padding: 24px; gap: 20px;}
 .value-grid h3,.role-grid h3 {font-size: 1.375rem;}
 .role-grid article {padding: 24px;}
 .cta-band h2 {font-size: 2rem;}
 .footer-top {gap: 40px;}
}
@media (max-width: 600px) {
 body {padding-bottom: calc(76px + env(safe-area-inset-bottom,0px));}
 h2,.zh h2 {font-size: 1.875rem; line-height: 1.4;}
 h3,.zh h3 {font-size: 1.25rem; line-height: 1.5;}
 .section {padding: 48px 0;}
 .section-head {gap: 24px; margin-bottom: 32px;}
 .eyebrow,.section-head .eyebrow {font-size: .8125rem; letter-spacing: .06em; margin-bottom: 20px;}
 .section-head p {font-size: 1rem;}
 .overview-hero,.overview-advantages,.overview-us,.overview-services {padding: 48px 0;}
 .overview-hero-grid {grid-template-columns: 1fr; gap: 32px;}
 .overview-hero h2,.zh .overview-hero h2 {font-size: 1.875rem; line-height: 1.4; margin-bottom: 24px;}
 .overview-hero-copy {padding: 0;}
 .overview-hero .eyebrow,.overview-advantages .eyebrow,.overview-us .eyebrow,.overview-services .eyebrow {font-size: .8125rem; margin-bottom: 20px;}
 .overview-hero-copy>p:not(.eyebrow),.overview-hero-copy>p.overview-lead {font-size: 1rem; margin-bottom: 20px;}
 .overview-hero-image {height: 248px; min-height: 0; border-radius: 8px;}
 .overview-advantages h2,.overview-us h2,.overview-services h2 {font-size: 1.875rem; line-height: 1.4;}
 .overview-advantages-layout {gap: 32px;}
 .national-fact {display: flex; flex-direction: column; align-items: flex-start; gap: 4px;}
 .national-fact strong {font-size: 3.5rem; margin-bottom: 12px;}
 .national-fact>span {font-size: 1rem;}
 .national-fact small,.national-fact a {font-size: .8125rem;}
 .overview-advantage-grid {grid-template-columns: 1fr; gap: 16px;}
 .overview-advantage-grid article {padding: 24px; border-radius: 8px;}
 .overview-advantage-grid h3 {font-size: 1.25rem; margin: 24px 0 16px;}
 .overview-sources {margin-top: 32px; padding-top: 24px; gap: 16px;}
 .overview-sources>p,.overview-sources details {font-size: .875rem;}
 .overview-us-intro {grid-template-columns: 1fr; gap: 32px;}
 .overview-us-intro>figure {height: 260px; min-height: 0; border-radius: 8px;}
 .overview-us-intro>div>p:not(.eyebrow) {font-size: 1rem; margin-top: 24px;}
 .overview-standards {grid-template-columns: 1fr; gap: 0; margin-top: 32px;}
 .overview-standards article {gap: 20px; padding: 24px 0;}
 .overview-standards h3 {font-size: 1.25rem; margin-bottom: 12px;}
 .overview-standards p {font-size: 1rem;}
 .overview-section-head {grid-template-columns: 1fr; gap: 24px; margin-bottom: 32px;}
 .overview-service-grid {gap: 16px;}
 .overview-service-grid article {padding: 24px; border-radius: 8px;}
 .overview-service-grid h3 {font-size: 1.5rem;}
 .overview-service-grid article>p {font-size: 1rem;}
 .overview-service-footer {gap: 24px; margin-top: 32px;}
 .overview-service-footer .btn {width: 100%; font-size: .875rem;}
 .page-intro {padding: 24px 0 48px;}
 .breadcrumbs {font-size: .8125rem; margin-bottom: 32px;}
 .intro-grid h1,.zh .intro-grid h1 {font-size: 2.25rem; line-height: 1.25; margin-bottom: 24px;}
 .zh .intro-grid h1 {font-size: 2rem; line-height: 1.45;}
 .intro-grid .eyebrow {font-size: .8125rem; margin-bottom: 20px;}
 .intro-grid>div>p:not(.eyebrow) {font-size: 1rem; line-height: 1.8;}
 .intro-aside {padding: 24px; border-radius: 8px;}
 .intro-aside h3 {font-size: 1.25rem;}
 .intro-aside button {font-size: .875rem; min-height: 48px;}
 .service-jump {gap: 8px; padding-bottom: 24px; flex-wrap: wrap;}
 .service-jump a {font-size: .875rem; padding: 10px 14px; border-radius: 8px;}
 .service-detail {grid-template-columns: 1fr; gap: 24px; padding: 40px 0;}
 .service-title h2 {font-size: 1.75rem; line-height: 1.4;}
 .service-title>p,.check-list li,.deliverable p {font-size: 1rem;}
 .service-detail h4 {font-size: 1rem;}
 .deliverable {padding: 24px; border-radius: 8px;}
 .steps {grid-template-columns: 1fr; gap: 32px;}
 .steps h3 {font-size: 1.25rem; margin-top: 20px;}
 .steps p {font-size: 1rem;}
 .step-number {font-size: .875rem; width: 40px; height: 40px;}
 .standards-grid,.scenario-grid {grid-template-columns: 1fr; gap: 16px;}
 .standards-grid article,.scenario-grid article {padding: 24px; border-radius: 8px;}
 .standards-grid h3,.scenario-grid h3 {font-size: 1.25rem;}
 .standards-grid p,.scenario-grid p {font-size: 1rem;}
 .fee-panel {padding: 24px; border-radius: 8px; gap: 24px;}
 .fee-panel h3 {font-size: 1.375rem;}
 .fee-panel p {font-size: 1rem;}
 .fee-panel small {font-size: .875rem;}
 .faq-layout {grid-template-columns: 1fr; gap: 32px;}
 .faq-layout h2 {font-size: 1.875rem;}
 .faq-list summary {font-size: 1rem; padding: 20px;}
 .faq-list details>p {font-size: 1rem; padding: 0 20px 20px;}
 .program-grid,.guide-grid {grid-template-columns: 1fr; gap: 16px;}
 .program-card,.guide-card {padding: 24px; border-radius: 8px;}
 .program-card h3,.guide-card h3 {font-size: 1.5rem; line-height: 1.45;}
 .program-card .card-description,.guide-card>p:not(.card-tag) {font-size: 1rem;}
 .card-bottom,.guide-card .text-link {font-size: .875rem;}
 .scope-note {font-size: .875rem; gap: 16px; margin-top: 24px;}
 .program-explain,.quality-layout,.mission-grid {grid-template-columns: 1fr; gap: 32px;}
 .number-list>div {padding: 24px 0; gap: 20px;}
 .number-list h3 {font-size: 1.25rem;}
 .number-list p {font-size: 1rem;}
 .featured-guide {grid-template-columns: 1fr; border-radius: 8px;}
 .featured-image {height: 248px; min-height: 0;}
 .featured-content {padding: 24px;}
 .featured-content h2 {font-size: 1.75rem; line-height: 1.4;}
 .featured-content>p:not(.eyebrow) {font-size: 1rem; margin: 20px 0 24px;}
 .guidance-note {gap: 20px;}
 .guidance-note h3 {font-size: 1.25rem;}
 .guidance-note p {font-size: 1rem;}
 .about-hero-image {height: 248px; border-radius: 8px; box-shadow: var(--shadow-card);}
 .mission-grid h2 {font-size: 1.875rem; line-height: 1.45;}
 .mission-grid p {font-size: 1rem;}
 .mission-grid .eyebrow {font-size: .8125rem;}
 .value-grid,.role-grid {grid-template-columns: 1fr; gap: 16px;}
 .value-grid article {padding: 24px; gap: 20px; border-radius: 8px;}
 .value-grid .icon-box {width: 40px; height: 40px;}
 .value-grid h3 {font-size: 1.25rem;}
 .value-grid p {font-size: 1rem;}
 .role-grid article {padding: 24px; border-radius: 8px;}
 .role-grid h3 {font-size: 1.5rem;}
 .role-grid p {font-size: 1rem;}
 .role-number {font-size: .875rem; margin-bottom: 24px;}
 .boundary {grid-template-columns: 1fr; padding: 32px 0; gap: 20px;}
 .boundary h3 {font-size: 1.25rem;}
 .boundary p {font-size: 1rem;}
 .cta-band {padding: 32px 24px; border-radius: 8px; gap: 24px;}
 .cta-band h2 {font-size: 1.875rem; line-height: 1.4;}
 .cta-band p {font-size: 1rem; margin-top: 20px;}
 .cta-band .btn {font-size: .875rem;}
 .site-footer {padding: 40px 0 24px;}
 .footer-top {gap: 32px; padding-bottom: 32px;}
 .site-footer .brand-name {font-size: 20px;}
 .footer-brand p {font-size: .875rem; line-height: 1.8;}
 .footer-links h4,.footer-links a,.footer-links button {font-size: .875rem;}
 .footer-bottom {font-size: .75rem; gap: 16px; line-height: 1.8;}
 .mobile-bottom-nav {min-height: calc(76px + env(safe-area-inset-bottom,0px)); padding-top: 8px; padding-bottom: calc(8px + env(safe-area-inset-bottom,0px));}
 .mobile-bottom-nav a {font-size: .75rem; line-height: 1.4; gap: 5px;}
 .mobile-bottom-nav .icon {width: 22px; height: 22px;}
 .detail-dialog,.consult-dialog {width: calc(100% - 24px); max-height: calc(100dvh - 32px); padding: 32px 24px; border-radius: 8px;}
 .detail-dialog h2,.consult-dialog h2,.zh .detail-dialog h2,.zh .consult-dialog h2 {font-size: 1.625rem; line-height: 1.4; padding-right: 8px; margin-bottom: 24px;}
 .dialog-close {top: 12px; right: 12px; width: 36px; height: 36px;}
 .detail-dialog .eyebrow,.consult-heading .eyebrow {font-size: .8125rem; max-width: calc(100% - 32px);}
 .detail-intro,.consult-heading>p:not(.eyebrow),.detail-section p,.detail-section li {font-size: 1rem;}
 .detail-section h3 {font-size: 1.25rem;}
 .detail-note {font-size: .875rem; padding: 20px;}
 .form-grid {grid-template-columns: 1fr; gap: 20px;}
 .form-grid label {font-size: .875rem;}
 input,select,textarea {font-size: 1rem; min-height: 48px;}
 .form-privacy p,.form-urgent {font-size: .8125rem;}
 .review-lead,.whatsapp-status {font-size: 1rem;}
 #inquiry-message {font-size: 1rem; padding: 20px;}
 .review-actions .btn,.form-submit,.detail-dialog .btn {font-size: .875rem;}
}

/* Keep the mobile Hero actions aligned with the reading column. */
@media (max-width: 600px) {
 .ref-hero-copy,.ref-hero-actions,.ref-hero-visual {width: 100%;}
 .mobile-bottom-nav a.active .icon {background: #eef0f8; color: var(--ink); border-radius: 8px;}
}

/* Guides retain their small page label without the former display headline. */
.page-intro .intro-grid h1.compact-title {font-size: .875rem; line-height: 1.5; font-weight: 500; letter-spacing: .08em; margin-bottom: 24px;}

/* Compact guide navigation; the page name remains available to screen readers. */
.guide-top {padding: 32px 0;}
.guide-top .breadcrumbs {margin: 0;}
.guide-page-title,.program-page-title {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;}
@media (max-width: 600px) {.guide-top {padding: 24px 0;}}

/* Programs open directly into the card collection on a white canvas. */
body[data-page="programs"] {background: #fff;}
.programs-top {padding: 32px 0;}
.programs-top .breadcrumbs {margin: 0;}
.programs-section {padding-top: 24px;}
@media (max-width: 600px) {.programs-top {padding: 24px 0;}}

/* A care conversation fills the space below the programs introduction. */
.program-explain {align-items: start;}
.program-explain-visual {margin: 32px 0 0; aspect-ratio: 3 / 2; border-radius: 8px; overflow: hidden;}
.program-explain-visual img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
@media (max-width: 600px) {.program-explain-visual {margin-top: 24px;}}