/* v3.1 tone: "A Cup's Journey" (裂缝成路, the crack becomes a road) carried through the whole site.
   The site's own warm grounds (as in v3.0.1) and the logo's two colours, jade #1d625b and gold #c9a65b:
   rim lines in the logo gold (double rules, like the bands on a cup), a serif display face, and one signature line
   in gold that starts as a crack and becomes a route. The wave border of a porcelain foot closes two bands.
   Loaded last on every page, in every language. The brand green, the logo and every section's content are unchanged. */
:root{
  --ground:#f8ebd8;--ground-step:#f1dfc4;--peach:#f1dccb;--foot:#eedcc4;--paper:#fffaf2;
  --ink:#1c2e2c;--text:#33413e;--muted:#5d645b;--line:#dfcfb9;
  --rim:#c9a65b;--rim-soft:rgba(168,132,63,.28);
  --gold:#a8843f;--gold-light:#c9a65b;
  --display:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,"Songti SC","STSong","Noto Serif CJK SC","Source Han Serif SC","SimSun",serif;
  --crack:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 24'%3E%3Cg fill='none' stroke='%23a8843f' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12 L48 11 L58 15 L71 8 L83 14 L97 10 L112 13 L121 6 L133 15 L150 11 L168 12 L180 9 L196 13 L214 12'/%3E%3Cpath d='M71 8 L77 2 M121 6 L116 1 M133 15 L139 21 M180 9 L184 4'/%3E%3Cpath d='M214 12 C330 3 430 21 560 12 S800 3 930 12 S1100 20 1176 12' stroke-dasharray='6 7'/%3E%3C/g%3E%3Ccircle cx='1188' cy='12' r='3.2' fill='%23c9a65b'/%3E%3Ccircle cx='1188' cy='12' r='7' fill='none' stroke='%23a8843f' stroke-width='1'/%3E%3C/svg%3E");
  --crack-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 12'%3E%3Cg fill='none' stroke='%23a8843f' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 6 L8 5 L11 9 L15 3 L19 7 L24 6'/%3E%3Cpath d='M24 6 C36 1 46 11 60 6' stroke-dasharray='3.5 4'/%3E%3C/g%3E%3Ccircle cx='66' cy='6' r='2.6' fill='%23a8843f'/%3E%3C/svg%3E");
  --waves:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 16'%3E%3Cg fill='none' stroke='%231d625b' stroke-width='1'%3E%3Ccircle cx='16' cy='16' r='14.5'/%3E%3Ccircle cx='16' cy='16' r='10.5'/%3E%3Ccircle cx='16' cy='16' r='6.5'/%3E%3Ccircle cx='16' cy='16' r='2.5'/%3E%3C/g%3E%3C/svg%3E");
}
html[lang="zh-Hant"]{--display:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Songti TC","Noto Serif CJK TC","Source Han Serif TC","PMingLiU",serif}
html[lang="ja"]{--display:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Hiragino Mincho ProN","Yu Mincho","Noto Serif CJK JP",serif}
html[lang="ko"]{--display:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"AppleMyungjo","Nanum Myeongjo","Noto Serif CJK KR","Batang",serif}
html[lang="ru"]{--display:"Palatino Linotype",Palatino,Georgia,"Times New Roman",serif}
html[lang="ar"]{--display:"Amiri","Traditional Arabic","Times New Roman",serif}

body{background:var(--ground);color:var(--ink);font-size:17px;line-height:1.65}
p{color:var(--text)}
/* running text never below 16px; the older sheets set many paragraphs at 13-15px */
main p:not(.lead){font-size:16px!important;line-height:1.65}

/* display type: one serif voice for every title */
h1,h2,h3{font-family:var(--display);font-weight:500;color:var(--ink)}
h1{letter-spacing:-.01em}
h2{letter-spacing:-.005em}
.page-intro h1{font-size:clamp(34px,4.4vw,58px);line-height:1.1}
.home-hero h1{font-size:clamp(40px,4.8vw,68px);line-height:1.04}
html[lang^="zh"] h1,html[lang="ja"] h1,html[lang="ko"] h1{line-height:1.3;letter-spacing:.02em}
html[lang^="zh"] .home-hero h1,html[lang="ja"] .home-hero h1,html[lang="ko"] .home-hero h1{font-size:clamp(36px,4vw,58px)}
.section h2,.home-concerns h2,.welcome-mid h2,.welcome-close h2,.home-process-heading h2,.route-story h2{font-size:clamp(28px,2.9vw,42px);line-height:1.16}
h3,.service-list h3,.home-process-list h3,.three-columns h3{font-size:21px;line-height:1.3}
.three-columns p,.service-list p,.home-process-list p,.home-process-heading p,.welcome-mid p,.welcome-close p,
.travel-preview p,.travel-hero p:not(.lead):not(.section-label),.page-intro p,.route-story p,.home-contact-description{font-size:16px;line-height:1.65}
.lead{font-size:clamp(18px,1.5vw,21px);color:var(--text)}
.section-label{font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--jade)}

/* the signature: a short crack that becomes a route, above each section title */
.home-hero h1::before,.page-intro h1::before,.section-heading h2::before,.home-process-heading h2::before,
.split-section h2::before,.home-concerns h2::before,.route-story h2::before,.section>.container>h2::before{
  content:"";display:block;width:72px;height:12px;margin-bottom:18px;background:var(--crack-mark) no-repeat left center/72px 12px}
html[dir="rtl"] .home-hero h1::before,html[dir="rtl"] .page-intro h1::before,html[dir="rtl"] .section-heading h2::before,
html[dir="rtl"] .home-process-heading h2::before,html[dir="rtl"] .split-section h2::before,html[dir="rtl"] .home-concerns h2::before,
html[dir="rtl"] .route-story h2::before,html[dir="rtl"] .section>.container>h2::before{transform:scaleX(-1)}

/* frame */
.site-header{background:var(--ground);border-bottom:1px solid var(--rim-soft)}
.primary-navigation{font-size:14px;background:var(--ground)}
.primary-navigation>a[aria-current="page"]{color:var(--jade)}
.nav-contact{background:var(--jade);color:#fff;border-color:var(--jade);border-radius:2px}
.primary-navigation .nav-contact:hover,.primary-navigation .nav-contact[aria-current="page"]{background:var(--deep);color:#fff}
.section{padding:clamp(64px,8vw,120px) 0}

/* buttons: filled jade for the action, a jade outline for the rest, gold underline for text links */
.button{font-size:15px;min-height:48px;padding:12px 22px;border-radius:2px;letter-spacing:.01em}
.button--outline{border:1px solid var(--jade);color:var(--jade);background:transparent}
.button--outline:hover{background:var(--jade);color:#fff}
.button--text{color:var(--jade);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:6px}

/* photographs sit in a rim: a thin gold line a few pixels outside the picture */
.editorial-photo{background:none;padding:0}
/* hospital photographs are shown whole (never cropped), so the frame follows the picture instead of letterboxing it */
.hospital-photo img{aspect-ratio:auto;height:auto;background:none}
.editorial-photo img,.home-process-heading>.flow-environment,.travel-preview img{border-radius:2px;box-shadow:0 0 0 7px var(--ground),0 0 0 8px var(--rim)}

/* the film keeps its full-screen first section; the gold line opens the page below it */
.home-hero{border-top:0;padding-block:clamp(72px,8vw,120px) clamp(48px,6vw,88px);background:var(--crack) no-repeat center top 32px/min(100%,1200px) auto;gap:clamp(32px,5vw,80px)}

/* concerns: the original sand band between two gold rims, like the bands on the cup */
.home-concerns{background:var(--ground-step);border-top:4px double var(--rim);border-bottom:4px double var(--rim);padding:clamp(64px,7vw,104px) 0}
.home-concerns h2{margin-bottom:clamp(28px,3vw,44px)}
.three-columns{gap:clamp(24px,4vw,56px)}
.plain-columns article,.plain-columns article+article,.personal-grid article{border:0;border-top:4px double var(--rim);padding:20px 0 0}
html[dir='rtl'] .plain-columns article+article{padding-right:0}
.item-number{display:block;font-family:var(--display);font-style:italic;font-size:34px;font-weight:400;line-height:1;color:var(--jade);margin-bottom:12px}

/* services beside the photograph */
.service-list li{border-top:1px solid var(--rim-soft);padding:16px 0}
.service-list li:last-child{border-bottom:1px solid var(--rim-soft)}
.service-list h3{margin-bottom:4px}

/* six steps: paper cards with a gold rim; each number opens a dashed gold route to its drawing */
.home-process-heading h2{margin-bottom:16px}
.home-process-list{gap:clamp(20px,2.4vw,32px)}
.home-process-list li{padding:24px 24px 26px;background:var(--paper);border:1px solid var(--rim-soft);border-top:4px double var(--rim);border-radius:2px;box-shadow:none;transition:border-color .2s,transform .2s}
.process-step:hover,.home-process-list li:hover{transform:translateY(-2px);box-shadow:none;border-color:var(--rim)}
.home-step-top{display:flex;height:auto;margin-bottom:16px;align-items:flex-end;gap:12px}
.home-step-top>.gw-stage-image{width:104px;height:66px;flex:none}
.flow-number{display:flex;flex:1;align-items:center;gap:12px;width:auto;height:auto;font-family:var(--display);font-style:italic;font-size:36px;font-weight:400;line-height:1;color:var(--jade);background:none;border:0;border-radius:0}
.flow-number::after{content:"";flex:1;min-width:16px;border-top:1px dashed var(--gold);transform:translateY(4px)}

/* welcome: the original peach band, closed by the wave border of a porcelain foot */
.welcome-mid{position:relative;background:var(--peach);background-image:none;padding:clamp(64px,7vw,104px) 0 clamp(80px,8vw,120px)}
.welcome-mid::after{content:"";position:absolute;inset:auto 0 0;height:22px;background:var(--waves) repeat-x left bottom/44px 22px;opacity:.22}
.welcome-mid .container{padding-inline-end:0}
.welcome-mark{display:none}
.welcome-mid h2{color:var(--deep);font-style:italic}
.welcome-mid p{color:var(--text)}

/* closing: deep jade, with the gold line again */
.welcome-close{background:var(--deep);background-image:var(--crack);background-repeat:no-repeat;background-position:center top 32px;background-size:min(92%,1200px) auto;padding:clamp(88px,9vw,128px) 0 clamp(64px,7vw,96px)}
.welcome-close h2{color:#fff}
.welcome-close p{color:#e6efe9}

.travel-preview{border-top:1px dashed var(--gold);padding-top:clamp(32px,4vw,48px)}

/* Jiangxi routes: a dashed gold route between stops */
.route-story{border-bottom:1px dashed var(--gold)}
.route-number{font-family:var(--display);font-style:italic;font-size:20px;font-weight:400;color:var(--jade)}

/* inner page intros: the original warm gradient, closed by a gold rim */
.page-intro{background:linear-gradient(110deg,#f1d9c8,#f8e9c7);border-bottom:4px double var(--rim);padding:clamp(56px,6vw,96px) 0}
.page-intro:not(.illustrated-intro):not(.account-intro)::after{content:none}

/* contact channels appear only once at least one channel is configured (assets/contact-config.js) */
html:not(.gwc-has-contacts) [data-contact-panel],
html:not(.gwc-has-contacts) .availability-channels,
html:not(.gwc-has-contacts) [data-gwc-channels],
html:not(.gwc-has-contacts) a.contact-form-action{display:none}
.contact-channels{border:0;border-top:4px double var(--rim);border-radius:0;background:var(--ground-step)}

/* footer: the wave band of a porcelain foot */
.site-footer{position:relative;background:var(--foot);border-top:0;padding-top:calc(clamp(48px,6vw,80px) + 18px)}
.site-footer::before{content:"";position:absolute;inset:0 0 auto;height:18px;background:var(--waves) repeat-x left top/36px 18px;opacity:.3;transform:scaleY(-1)}
.site-footer p,.site-footer a{font-size:15px}
.site-footer .staff-entry-link,.language-menu summary,.language-options a,.footer-bottom span{font-size:14px}
.footer-links strong{font-size:15px;font-family:var(--display);font-weight:600}

@media (max-width:860px){
  .home-step-top>.gw-stage-image{width:88px;height:56px}
  .home-hero{background-position:center top 18px}
}
@media (prefers-reduced-motion:reduce){.home-process-list li{transition:none}.home-process-list li:hover{transform:none}}