:root{
  --deep:#0F4C45;
  --deep-2:#0A3733;
  --ink:#1C2B27;
  --snow:#F7F9F7;
  --paper:#EEF2EA;
  --spring:#8FBF6A;
  --spring-2:#E7A7B4;
  --summer:#2E7FA3;
  --summer-2:#F2C94C;
  --autumn:#C96A2B;
  --autumn-2:#A63A2E;
  --winter:#8FA6B2;
  --clay:#B85C38;
  --muted:#5B6B66;
  --line:rgba(15,76,69,.16);
  --line-strong:rgba(15,76,69,.36);
  --radius:2px;
  --wrap:1180px;
  --wrap-wide:1320px;
  --gutter:clamp(18px,4.5vw,56px);
  --font-display:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif;
  --font-body:"Noto Sans SC","Source Han Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-mono:"IBM Plex Mono","JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body,h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
img,svg,video{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.15;letter-spacing:.01em;color:var(--deep)}

body{
  font-family:var(--font-body);
  font-size:clamp(15px,1.05vw,17px);
  line-height:1.75;
  color:var(--ink);
  background-color:var(--snow);
  background-image:
    radial-gradient(1200px 620px at 80% -12%,rgba(143,191,106,.10),transparent 62%),
    radial-gradient(940px 540px at 4% 2%,rgba(46,127,163,.08),transparent 64%);
  background-repeat:no-repeat;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

:focus-visible{outline:2px solid var(--clay);outline-offset:3px;border-radius:2px}
.site-footer :focus-visible{outline-color:var(--summer-2)}

/* ---------- layout utilities ---------- */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.wrap--wide{max-width:var(--wrap-wide)}
.section{padding-block:clamp(44px,6vw,88px)}
.rule{height:1px;border:0;margin:0;background:var(--line)}

.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.eyebrow{
  display:inline-flex;align-items:center;gap:.6em;
  font-size:12px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--deep);
}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--clay);flex:none}
.note{font-size:12.5px;letter-spacing:.14em;color:var(--muted)}
.num{
  font-family:var(--font-mono);
  font-size:clamp(40px,7vw,88px);
  line-height:1;
  letter-spacing:-.02em;
  color:rgba(15,76,69,.14);
}

/* ---------- buttons ---------- */
.btn{
  --btn-bg:var(--deep);
  --btn-fg:#FFFFFF;
  --btn-bd:var(--deep);
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  padding:.72em 1.25em;
  font-family:var(--font-body);
  font-size:14px;letter-spacing:.08em;line-height:1.4;
  color:var(--btn-fg);background:var(--btn-bg);border:1px solid var(--btn-bd);
  border-radius:var(--radius);
  text-align:center;
  transition:background-color .22s ease,color .22s ease,border-color .22s ease,transform .22s ease;
}
.btn:hover{background:var(--clay);border-color:var(--clay);color:#FFFFFF;transform:translateY(-1px)}
.btn--solid{--btn-bg:var(--deep);--btn-bd:var(--deep)}
.btn--clay{--btn-bg:var(--clay);--btn-bd:var(--clay)}
.btn--clay:hover{--btn-bg:var(--deep-2);--btn-bd:var(--deep-2)}
.btn--ghost{--btn-bg:transparent;--btn-fg:var(--deep);--btn-bd:var(--line-strong)}
.btn--ghost:hover{background:var(--deep);border-color:var(--deep);color:#FFFFFF}

/* ---------- breadcrumb ---------- */
.breadcrumb{padding-block:18px;font-size:12.5px;letter-spacing:.12em;color:var(--muted)}
.breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center}
.breadcrumb__item{display:inline-flex;align-items:center}
.breadcrumb__item:not(:last-child)::after{content:"/";margin-inline:.55em;color:rgba(15,76,69,.34)}
.breadcrumb__item a{border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.breadcrumb__item a:hover{color:var(--deep);border-color:var(--clay)}
.breadcrumb__item[aria-current="page"]{color:var(--deep)}

/* ---------- grids ---------- */
.grid{display:grid;gap:clamp(18px,2.6vw,34px)}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--offset > :nth-child(even){margin-top:clamp(16px,3.4vw,48px)}
.split{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,64px);align-items:start}

/* ---------- card / tag / list ---------- */
.card{
  background:#FFFFFF;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:clamp(18px,2.4vw,28px);
  box-shadow:0 1px 0 rgba(15,76,69,.04),0 14px 34px -26px rgba(15,76,69,.55);
}
.card__title{font-family:var(--font-display);font-size:clamp(19px,1.6vw,23px);color:var(--deep);margin-bottom:.5em}
.card__body{font-size:15px;color:var(--muted)}

.tag{
  display:inline-flex;align-items:center;gap:.45em;
  padding:.32em .72em;
  font-size:12px;letter-spacing:.14em;line-height:1.5;
  border:1px solid rgba(15,76,69,.35);
  border-radius:999px;
  color:var(--deep);
}
.tag--spring{color:#2F5420;background:rgba(143,191,106,.22);border-color:rgba(143,191,106,.68)}
.tag--summer{color:#1C5C78;background:rgba(46,127,163,.14);border-color:rgba(46,127,163,.55)}
.tag--autumn{color:#8A4515;background:rgba(201,106,43,.16);border-color:rgba(201,106,43,.58)}
.tag--winter{color:#40606E;background:rgba(143,166,178,.24);border-color:rgba(143,166,178,.72)}
.tag--clay{color:#8F4327;background:rgba(184,92,56,.14);border-color:rgba(184,92,56,.55)}

.list-num{counter-reset:ln;display:grid;gap:.9em}
.list-num > li{
  counter-increment:ln;
  display:grid;grid-template-columns:auto minmax(0,1fr);
  gap:.9em;align-items:baseline;
}
.list-num > li::before{
  content:counter(ln,decimal-leading-zero);
  font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;
  color:var(--clay);
  transform:translateY(-.15em);
}

/* ---------- media containers ---------- */
.media{
  position:relative;overflow:hidden;isolation:isolate;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--paper);
}
.media::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(160deg,rgba(15,76,69,.12),transparent 58%);
}
.media img,.media video{width:100%;height:100%;object-fit:cover}
.media--16x9{aspect-ratio:16/9}
.media--4x3{aspect-ratio:4/3}
.media--3x4{aspect-ratio:3/4}
.media--square{aspect-ratio:1/1}
.media__caption{
  position:absolute;left:0;right:0;bottom:0;
  padding:.55em .8em;
  font-size:12px;letter-spacing:.14em;
  color:#FFFFFF;background:linear-gradient(transparent,rgba(15,76,69,.82));
}

/* ---------- reveal ---------- */
html.js [data-reveal]{opacity:0;transform:translateY(20px);transition:opacity .42s ease,transform .42s ease}
html.js [data-reveal].is-visible{opacity:1;transform:none}

/* ---------- skip link ---------- */
.skip-link{
  position:fixed;left:16px;top:-80px;z-index:200;
  display:inline-block;padding:.7em 1.1em;
  background:var(--deep);color:#FFFFFF;
  font-size:14px;letter-spacing:.06em;
  border-radius:var(--radius);
  box-shadow:0 12px 26px -16px rgba(15,76,69,.8);
  transition:top .2s ease;
}
.skip-link:focus{top:12px;color:#FFFFFF}

/* ---------- header ---------- */
.site-header{
  position:relative;z-index:40;
  background:var(--snow);
  border-bottom:1px solid var(--line);
  color:var(--ink);
}
.site-header__inner{
  width:100%;max-width:var(--wrap-wide);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.masthead{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  grid-template-areas:"meta brand tools";
  align-items:center;
  gap:clamp(12px,2vw,28px);
  padding-top:clamp(16px,2.2vw,26px);
}
.masthead__meta{
  grid-area:meta;
  display:flex;flex-direction:column;gap:4px;
  font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);
}
.masthead__issue{font-size:12px;color:var(--clay)}
.masthead__brand{
  grid-area:brand;
  display:flex;flex-direction:column;align-items:center;gap:2px;
  color:var(--deep);text-align:center;
}
.masthead__brand-cn{
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(34px,5.6vw,62px);
  line-height:1.02;
  letter-spacing:.12em;
  text-indent:.12em;
  transition:color .24s ease;
}
.masthead__brand-en{
  font-size:10.5px;letter-spacing:.52em;text-indent:.52em;
  color:var(--muted);
}
.masthead__brand:hover .masthead__brand-cn{color:var(--clay)}
.masthead__tools{
  grid-area:tools;
  display:flex;flex-direction:column;align-items:flex-end;gap:10px;
}
.masthead__utility{display:flex;flex-wrap:wrap;gap:16px;font-size:12.5px;letter-spacing:.12em;color:var(--deep)}
.masthead__utility a{padding-bottom:2px;border-bottom:1px solid transparent;transition:color .2s ease,border-color .2s ease}
.masthead__utility a:hover{color:var(--clay);border-color:var(--clay)}
.masthead__cta{font-size:12.5px;padding:.55em 1em}
.masthead__tagline{
  padding:clamp(8px,1.2vw,14px) 0 clamp(10px,1.4vw,16px);
  text-align:center;
  font-size:12px;letter-spacing:.28em;text-indent:.28em;
  color:var(--muted);
}

.nav-toggle{
  display:none;
  align-items:center;gap:.6em;
  padding:.5em .8em;
  border:1px solid var(--line-strong);
  border-radius:var(--radius);
  background:transparent;
  color:var(--deep);
  font-size:13px;letter-spacing:.14em;
}
.nav-toggle:hover{border-color:var(--clay);color:var(--clay)}
.nav-toggle__bars{display:grid;gap:3px;width:16px}
.nav-toggle__bars span{display:block;height:1.5px;background:currentColor;transition:transform .24s ease,opacity .2s ease}
.site-header[data-open] .nav-toggle__bars span:nth-child(1){transform:translateY(4.5px) rotate(45deg)}
.site-header[data-open] .nav-toggle__bars span:nth-child(2){opacity:0}
.site-header[data-open] .nav-toggle__bars span:nth-child(3){transform:translateY(-4.5px) rotate(-45deg)}

.site-nav{display:flex;justify-content:center;border-top:1px solid var(--line)}
.site-nav__list{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(14px,2.4vw,40px);padding-block:14px}
.site-nav__link{
  position:relative;display:inline-block;
  padding:.25em .1em;
  font-size:14.5px;letter-spacing:.1em;
  color:var(--ink);
  transition:color .2s ease;
}
.site-nav__link::after{
  content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;
  background:var(--clay);
  transform:scaleX(0);transform-origin:left;
  transition:transform .24s ease;
}
.site-nav__link:hover{color:var(--deep)}
.site-nav__link:hover::after{transform:scaleX(1)}
.site-nav__link[aria-current="page"]{color:var(--deep);font-weight:600}
.site-nav__link[aria-current="page"]::after{transform:scaleX(1)}

.season-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line)}
.season-strip__item a{
  display:flex;align-items:center;justify-content:center;gap:.55em;
  padding:clamp(8px,1.1vw,13px) clamp(8px,1.6vw,24px);
  transition:filter .22s ease;
}
.season-strip__item a:hover{filter:brightness(1.07)}
.season-strip__num{font-size:11px;letter-spacing:.1em;opacity:.72}
.season-strip__name{
  font-family:var(--font-display);font-size:15px;font-weight:600;
  letter-spacing:.3em;text-indent:.3em;
}
.season-strip__item--spring a{background:linear-gradient(135deg,#BFDCA4,#8FBF6A 55%,#7FB25C);color:#1D3312}
.season-strip__item--summer a{background:linear-gradient(135deg,#4E9CBD,#2E7FA3 60%,#256885);color:#F2FBFF}
.season-strip__item--autumn a{background:linear-gradient(135deg,#DA8A4A,#C96A2B 55%,#A63A2E);color:#FFF6EF}
.season-strip__item--winter a{background:linear-gradient(135deg,#C2D0D7,#8FA6B2 60%,#7B939F);color:#12262E}

.scroll-progress{
  position:fixed;left:0;top:0;width:100%;height:3px;
  z-index:100;pointer-events:none;
  background:transparent;
}
.scroll-progress__bar{
  display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--spring),var(--summer),var(--summer-2),var(--autumn),var(--winter));
  transition:width .1s linear;
}

/* ---------- footer ---------- */
.site-footer{
  position:relative;
  margin-top:clamp(56px,8vw,104px);
  background:var(--deep);
  color:#E8F0EC;
  overflow:hidden;
}
.site-footer::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(700px 380px at 10% 0%,rgba(143,191,106,.18),transparent 66%),
    radial-gradient(720px 420px at 94% 16%,rgba(46,127,163,.22),transparent 64%);
}
.site-footer > *{position:relative;z-index:1}
.footer__bands{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));height:5px}
.footer__band{display:block;height:100%}
.footer__band--spring{background:linear-gradient(90deg,#8FBF6A,#E7A7B4)}
.footer__band--summer{background:linear-gradient(90deg,#2E7FA3,#F2C94C)}
.footer__band--autumn{background:linear-gradient(90deg,#C96A2B,#A63A2E)}
.footer__band--winter{background:linear-gradient(90deg,#8FA6B2,#F7F9F7)}

.footer__top{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) minmax(0,.8fr) minmax(0,1.5fr);
  gap:clamp(24px,3.4vw,52px);
  padding-block:clamp(40px,6vw,72px) clamp(28px,4vw,44px);
}
.footer__brand-name{
  display:inline-block;
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(26px,3vw,36px);
  letter-spacing:.14em;text-indent:.14em;
  color:#F7F9F7;
  transition:color .22s ease;
}
.footer__brand-name:hover{color:var(--spring)}
.footer__blurb{margin-top:12px;max-width:26ch;font-size:14px;line-height:1.8;color:rgba(232,240,236,.72)}
.footer__region{margin-top:16px;font-size:11.5px;letter-spacing:.18em;color:rgba(232,240,236,.5)}

.footer__col-title{
  display:flex;align-items:center;gap:.6em;
  margin-bottom:14px;
  font-family:var(--font-body);font-size:12px;font-weight:600;
  letter-spacing:.24em;color:#F7F9F7;
}
.footer__col-title::before{content:"";width:16px;height:1px;background:var(--clay);flex:none}
.footer__links li + li{margin-top:.6em}
.footer__links a{
  font-size:14.5px;color:rgba(232,240,236,.78);
  border-bottom:1px solid transparent;
  transition:color .2s ease,border-color .2s ease;
}
.footer__links a:hover{color:#FFFFFF;border-color:var(--clay)}

.footer__contact-list{display:grid;gap:.7em;font-size:14px}
.footer__contact-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.9em;align-items:baseline}
.footer__contact-row dt{font-size:11.5px;letter-spacing:.16em;color:rgba(232,240,236,.5)}
.footer__contact-row dd{display:flex;flex-wrap:wrap;align-items:center;gap:.6em;color:rgba(232,240,236,.92);line-height:1.7}
.footer__hours{margin-top:14px;max-width:42ch;font-size:12.5px;line-height:1.75;color:rgba(232,240,236,.55)}

.copy-btn{
  padding:.2em .6em;
  font-size:11px;letter-spacing:.12em;
  color:rgba(232,240,236,.75);
  border:1px solid rgba(232,240,236,.28);
  border-radius:999px;
  transition:color .2s ease,border-color .2s ease,background-color .2s ease;
}
.copy-btn:hover{color:#FFFFFF;border-color:var(--clay);background:rgba(184,92,56,.3)}
.copy-btn[data-copied]{color:#DDF0CE;border-color:var(--spring);background:rgba(143,191,106,.22)}

.footer__bottom{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:14px 28px;
  padding-block:22px 30px;
  border-top:1px solid rgba(247,249,247,.16);
  font-size:12.5px;color:rgba(232,240,236,.6);
}
.footer__legal-links{display:flex;flex-wrap:wrap;gap:18px}
.footer__legal-links a{border-bottom:1px solid transparent;transition:color .2s ease,border-color .2s ease}
.footer__legal-links a:hover{color:#FFFFFF;border-color:var(--clay)}
.footer__icp{letter-spacing:.08em;color:rgba(232,240,236,.5)}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .footer__top{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px 40px}
}

@media (max-width:899px){
  .masthead{
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:"brand";
    justify-items:center;
    padding-block:16px 12px;
  }
  .masthead__meta,.masthead__tools{display:none}
  .masthead__brand-cn{font-size:clamp(30px,8vw,44px)}
  .nav-toggle{
    display:inline-flex;
    position:absolute;right:0;top:50%;
    transform:translateY(-50%);
  }
  .site-nav{display:none;justify-content:stretch;border-top:1px solid var(--line)}
  .site-header[data-open] .site-nav{display:block;padding-bottom:12px}
  .site-nav__list{flex-direction:column;align-items:stretch;gap:0;padding-block:0}
  .site-nav__list li + li{border-top:1px solid var(--line)}
  .site-nav__link{display:block;padding:.95em .2em;font-size:16px}
  .site-nav__link::after{display:none}
  .site-nav__link[aria-current="page"]{color:var(--clay)}
  .season-strip__name{font-size:14px;letter-spacing:.2em;text-indent:.2em}
  .season-strip__num{font-size:10px}
  .grid--2,.grid--3,.split{grid-template-columns:minmax(0,1fr)}
  .grid--offset > :nth-child(even){margin-top:0}
}

@media (max-width:640px){
  .footer__top{grid-template-columns:minmax(0,1fr);gap:32px}
  .footer__bottom{flex-direction:column;align-items:flex-start;gap:10px}
  .footer__contact-row{grid-template-columns:minmax(0,1fr);gap:.15em}
  .season-strip__item a{flex-direction:column;gap:2px;padding:10px 4px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  html.js [data-reveal]{opacity:1;transform:none;transition:none}
  .scroll-progress__bar{transition:none}
}
