/* Commercial service-site refinement: clear sans typography and useful density.
   Keep Wagtail content, imagery and React islands in their existing ownership. */
:root {
  --font-heading:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  --font-body:var(--font-heading);
  --color-bg:#fff;--color-ink:#202d35;--color-ink-secondary:#59666f;
  --space-section:64px;--color-line:#e1e7eb;
}
/* User-approved hero: preserve the original courtyard editorial composition.
   Scope display typography here while service content remains easy to scan. */
.hero {background:linear-gradient(110deg,#fbfaf7 55%,#f0f3ed);padding:44px 0 80px}
.hero-layout {grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:72px}
.hero-content {padding:20px 0 30px}
.hero h1 {
  font-family:"Noto Serif SC","Songti SC",SimSun,serif;
  font-size:clamp(40px,4.2vw,60px);font-weight:500;line-height:1.35;
  letter-spacing:.035em;color:#193331;margin-bottom:26px;max-width:570px;
}
.hero-description {font-size:16px;line-height:2;margin-bottom:36px;color:#657370}
.hero-assurance {margin-top:40px}
.hero-assurance p {font-size:13px;color:#193331}
.hero-assurance small {font-size:12px;color:#657370}
.hero-visual {height:580px}
.hero-visual>img {border-radius:160px 12px 12px 12px;object-position:62% center}
.hero-image-caption {left:36px;bottom:40px}
.hero-image-caption>span {font:24px "Noto Serif SC","Songti SC",SimSun,serif;letter-spacing:.08em}
.hero-image-caption small {font-size:11px;letter-spacing:.18em}
.hero .care-card {display:flex}
@media(max-width:1050px) {
  .hero-layout {gap:32px}
  .hero h1 {font-size:44px}
  .hero-visual {height:480px}
}
@media(max-width:767px) {
  .hero {padding:30px 0 56px}
  .hero-layout {grid-template-columns:minmax(0,1fr);gap:34px}
  .hero-content {padding:8px 0 0}
  .hero h1 {font-size:40px;max-width:480px}
  .hero-description {margin-bottom:24px}
  .hero-assurance {margin-top:26px}
  .hero-visual {height:390px;margin-right:8px}
  .hero-visual>img {border-radius:100px 10px 10px 10px}
  .hero-image-caption {left:22px;bottom:76px}
  .hero-image-caption>span {font-size:20px}
}
body {line-height:1.65}
/* Public directory pages share cards while exposing content-specific metadata. */
.index-intro{max-width:760px;font-size:16px;line-height:1.8;color:#59666f}
.index-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:20px;border:1px solid #e0e6ea;background:#f8fafb;border-radius:10px}
.index-toolbar label{font-size:14px;font-weight:500}
.index-toolbar input{width:280px;max-width:100%}
.index-toolbar select{width:180px;max-width:100%}
.index-count{font-size:14px;color:#59666f;margin:24px 0}
.index-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.index-card h2{font-size:20px;line-height:1.5;margin:12px 0}
.index-card .case-cover img{width:100%;height:100%;object-fit:cover}
.index-meta{font-size:14px;color:#59666f}
.index-pagination{position:static;display:flex;align-items:center;justify-content:center;gap:8px;padding:0;margin-top:36px;background:none;border:0}
.index-pagination a{min-width:44px;min-height:44px;display:grid;place-items:center;padding:8px 12px;border:1px solid #dce3dd;border-radius:6px;text-decoration:none}
.index-pagination [aria-current=page]{background:var(--color-primary);color:white;border-color:var(--color-primary)}
.index-empty{grid-column:1/-1;padding:48px 24px;border:1px dashed #d7e1e5;border-radius:12px;text-align:center}
.index-contact{background:#f2f7f7;padding:40px 0}
.index-contact>.container{display:flex;justify-content:space-between;align-items:center;gap:24px}
.index-contact h2{font-size:25px;margin-bottom:8px}
.index-contact p{margin:0;color:#59666f}
@media(max-width:1000px){.index-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.index-grid{grid-template-columns:minmax(0,1fr)}.index-toolbar{display:grid;grid-template-columns:minmax(0,1fr)}.index-toolbar input,.index-toolbar select{width:100%}.index-contact>.container{display:grid;grid-template-columns:minmax(0,1fr)}.index-pagination{flex-direction:row;flex-wrap:wrap}}
/* Reserve a stable cover area even before the editor chooses a case image. */
.case-cover{aspect-ratio:4/3;overflow:hidden;background:#edf2f3;border-bottom:1px solid #e0e6ea}
.case-cover img{width:100%;height:100%;object-fit:cover}
.case-image-placeholder{width:100%;height:100%;display:grid;place-items:center;color:#8b9da5;background:linear-gradient(135deg,#eef3f3,#e5ecee)}
.case-detail-placeholder{border-radius:12px;margin-bottom:32px}
h1,h2,h3 {font-family:var(--font-heading);letter-spacing:0}
h2 {font-size:clamp(26px,2.5vw,34px);font-weight:650;line-height:1.4}
.eyebrow {font-size:13px;letter-spacing:0;line-height:1.5;margin-bottom:14px}
.site-header {height:82px;background:#fff;border-bottom:1px solid #e8edf0;backdrop-filter:none}
.brand {font-family:var(--font-body);font-size:20px;letter-spacing:0}
.brand-emblem {border-radius:10px;background:var(--color-primary);border:0;color:#fff;font:600 24px var(--font-body);width:42px;height:42px}
.brand small {font-size:10px;letter-spacing:.06em}
nav {gap:18px}
nav>a {font-size:14px}
.hero {padding:36px 0 48px;background:#f4f8f9}
.hero-layout {grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px}
.hero-content {padding:8px 0}
.hero h1 {font-size:clamp(32px,3.4vw,46px);font-weight:650;line-height:1.35;letter-spacing:0;margin:0 0 22px;text-wrap:balance}
.hero-description {font-size:17px;line-height:1.7;margin-bottom:28px;color:#52636e}
.hero-assurance {margin-top:26px}
.hero-assurance p {font-size:14px}
.hero-assurance small {font-size:13px;line-height:1.7}
.hero-visual {height:400px}
.hero-visual>img {border-radius:14px;object-position:center}
.hero-image-caption {left:24px;bottom:28px}
.hero-image-caption>span {font:600 22px var(--font-body);letter-spacing:0}
.hero-image-caption small {font-size:12px;letter-spacing:.02em}
.care-card {display:none}
.service-ribbon>.container {padding-block:22px;gap:20px}
.service-ribbon p {font-size:12px}
.service-ribbon strong {font-size:16px;font-weight:600}
.service-ribbon .container>span {font-size:14px;letter-spacing:0}
.section-heading {margin-bottom:28px;gap:32px}
.section-heading>p {font-size:15px;line-height:1.7;max-width:390px}
.split {grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px}
.story-visual,.image-story--partner_showcase .story-visual {height:auto;margin:0}
.story-visual>img {height:300px;border-radius:12px}
.image-seal {display:none}
.story-copy h2 {font-size:clamp(26px,2.5vw,34px)}
.story-text {font-size:16px;line-height:1.8}
.story-principle {padding-top:16px;margin-top:20px;gap:14px}
.story-principle>span {font:600 20px var(--font-body);color:var(--color-primary)}
.service-overview {padding:28px;border:1px solid #dee8ec;border-radius:12px;background:#f6f9fa;color:var(--color-ink)}
.service-overview h3 {font-size:21px;line-height:1.5;margin:0 0 24px;font-weight:600}
.service-overview dl {margin:0}
.service-overview dl>div {border-top:1px solid #dfe7eb;padding:16px 0;display:grid;grid-template-columns:90px minmax(0,1fr);gap:12px}
.service-overview dl>div:last-child {padding-bottom:0}
.service-overview dt {font-size:14px;font-weight:600;color:var(--color-primary)}
.service-overview dd {margin:0;font-size:14px;color:#59666f;line-height:1.7}
.image-story--partner_showcase {background:#f4f8f9;color:var(--color-ink)}
.image-story--partner_showcase .story-copy .eyebrow {color:var(--color-primary)}
.image-story--partner_showcase .story-text {color:var(--color-ink-secondary)}
.image-story--partner_showcase .story-principle {border-color:var(--color-line)}
.card-grid {gap:20px}
.listing--featured_journeys .card-grid {grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.content-card {border-color:#e0e6ea;border-radius:10px}
.card-body {padding:20px}
.card-body h3 {font-size:18px;line-height:1.5;font-weight:600;margin-bottom:12px}
.card-body>p,.case-excerpt {font-size:14px;line-height:1.7}
.card-bottom {font-size:12px;padding-top:14px;border-color:#e6ebee}
.card-visual {height:auto;min-height:0}
.card-visual:has(img) {height:180px}
.cover-index {display:none}
.journey-cover,.content-card:nth-child(2) .journey-cover,.content-card:nth-child(3) .journey-cover,.listing--destinations .journey-cover {background:#eef4f5;padding:18px 20px;min-height:110px;gap:14px;justify-content:center}
.cover-label {font-size:12px;letter-spacing:0;color:#61757f}
.journey-cover strong,.content-card:nth-child(2) .journey-cover strong,.listing--destinations .journey-cover strong {font:600 25px var(--font-body);color:#235d63;max-width:none}
.journey-cover strong small {display:inline;font:13px var(--font-body);margin:0 0 0 8px;letter-spacing:0}
.all-journeys {padding:24px 20px}
.all-journeys h3 {font:600 23px/1.5 var(--font-body)}
.all-journeys p {font-size:14px;line-height:1.7}
.all-journeys .eyebrow,.all-journeys>span:last-child {font-size:12px}
.listing--featured_products,.listing--featured_cases,.listing--faq_teaser {background:#f6f8fa}
.listing--featured_products .card-grid {grid-template-columns:repeat(4,minmax(0,1fr))}
.product-topline {padding:18px 20px 0}
.product-number {display:none}
.product-duration,.section-note {font-size:13px;color:#59666f}
.badge {background:#f2f5f6;border-color:#dde5e9;color:#52636e}
.hospital-monogram {border-radius:10px;background:#f1f6f7;font:600 20px var(--font-body);border-color:#dde8eb}
.listing--featured_hospitals h3 {font:600 19px var(--font-body)}
.hospital-identity {height:94px;padding-top:24px}
.listing--destinations .card-visual {height:auto}
.listing--destinations .card-visual:has(img) {height:220px}
.listing--featured_cases .content-card {border:1px solid #e0e6ea;border-radius:10px;padding:0;background:#fff}
.quote-mark {display:none}
.listing--featured_cases .card-body {padding:24px}
.listing--featured_cases h3 {font-size:18px}
.steps {gap:24px;margin-top:28px}
.step-number {font:600 22px var(--font-body);color:var(--color-primary);margin-bottom:12px}
.steps strong {font:600 19px var(--font-body)}
.steps p {font-size:14px;line-height:1.7}
.inquiry h2 {font-size:32px}
.footer-grid {gap:40px}
.footer-brand p,.footer-column a {font-size:14px;line-height:1.7}
.page-hero {padding:42px 0;background:#f4f8f9}
.page-hero h1 {font-size:34px;font-weight:650}
@media(max-width:1100px) {
  .listing--featured_journeys .card-grid,.listing--featured_products .card-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .all-journeys {min-height:220px}
}
@media(max-width:1050px) {
  nav {top:82px;background:#fff}
  .hero-layout {gap:32px}
  .hero-visual {height:360px}
}
@media(max-width:767px) {
  :root {--space-section:44px}
  .site-header {height:76px}
  nav {top:76px}
  .hero {padding:28px 0 36px}
  .hero-layout,.split {grid-template-columns:minmax(0,1fr);gap:28px}
  .hero h1 {font-size:34px}
  .hero-description {font-size:16px}
  .hero-visual {height:300px;margin:0}
  .hero-visual>img {border-radius:12px}
  .hero-image-caption {left:20px;bottom:24px}
  .hero-image-caption>span {font-size:20px}
  .story-visual {height:auto;margin:0}
  .story-copy h2 {font-size:27px}
  .service-overview {padding:22px}
  .service-overview dl>div {grid-template-columns:76px minmax(0,1fr)}
  .listing--featured_journeys .card-grid,.listing--featured_products .card-grid,.listing--featured_hospitals .card-grid,
  .listing--destinations .card-grid,.card-grid {
    display:grid;grid-template-columns:minmax(0,1fr);grid-auto-flow:row;grid-auto-columns:auto;overflow:visible;scroll-snap-type:none;
  }
  .card-visual:has(img) {height:200px}
  .listing--featured_hospitals .card-body {padding:20px}
  .steps {grid-template-columns:minmax(0,1fr)}
  .inquiry>.container {display:block}
  .inquiry h2 {font-size:28px}
}