@font-face {
  font-family: "MiSans";
  src: url("fonts/MiSans-Site.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
:root {
  --accent: #225b73;
  --accent-light: #b5def0;
  --accent-strong: #225b73;
  --ink: #18201c;
  --journey-ink: #182b35;
  --secondary: #59645e;
  --tertiary: #68736d;
  --soft-ink: #8b918d;
  --footer-muted: #a4a2a0;
  --footer-soft: #b0afad;
  --paper: #f5f8fa;
  --neutral: #f7f7f5;
  --white: #ffffff;
  --divider: #e4e5e2;
  --content-width: 1240px;
  --page-gutter: clamp(20px, 4vw, 64px);
  --display: clamp(3.35rem, 7.25vw, 7rem);
  --headline: clamp(2.55rem, 5vw, 5rem);
  color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: hidden;
  background: var(--white);
  color: var(--ink);
  font-family: "SF Pro Display", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.skip-link {
  position: fixed;
  z-index: 1000;
  top: -80px;
  left: 16px;
  padding: 12px 16px;
  background: var(--ink);
  color: var(--white);
  transition: top 180ms ease;
}
.skip-link:focus { top: 16px; }
:focus-visible { outline: 3px solid var(--white); outline-offset: 3px; box-shadow: 0 0 0 6px var(--accent); }

.eyebrow { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .18em; text-transform: none; }
.site-header { position: fixed; z-index: 100; top: 24px; left: 0; width: 100%; pointer-events: none; }
.site-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(1068px, calc(100% - 48px));
  height: 56px;
  margin-inline: auto;
  padding: 0 12px 0 22px;
  border: 1px solid rgba(24, 32, 28, .08);
  border-radius: 999px;
  background: rgba(255, 255, 255, .91);
  box-shadow: 0 10px 35px rgba(16, 20, 18, .14);
  backdrop-filter: blur(18px);
  pointer-events: auto;
}
.brand { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 18px; font-weight: 760; letter-spacing: .08em; }
.site-nav__links { display: flex; align-items: center; gap: 28px; }
.site-nav__links > a { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; font-weight: 560; }
.site-nav__button { min-height: 44px !important; padding: 0 20px; border-radius: 999px; background: var(--ink); color: var(--white); }

.hero { position: relative; display: grid; place-items: center; min-height: max(720px, 100svh); overflow: hidden; color: var(--white); text-align: center; background: var(--journey-ink); }
.hero__image, .hero__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__image { object-fit: cover; }
.hero__shade { background: linear-gradient(180deg, rgba(15, 17, 16, .45), rgba(15, 17, 16, .07) 42%, rgba(15, 17, 16, .68)); }
.hero__content { position: relative; z-index: 2; width: min(1040px, calc(100% - 40px)); transform: translateY(-1vh); }
.hero h1 { margin: 16px 0 0; font-size: var(--display); font-weight: 760; line-height: .98; letter-spacing: -.06em; text-wrap: balance; }
.hero__lead { width: min(620px, 92%); margin: 24px auto 0; color: rgba(255, 255, 255, .8); font-size: clamp(16px, 1.4vw, 19px); }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px; border-radius: 999px; font-size: 15px; font-weight: 650; }
.button--dark { background: var(--ink); color: var(--white); }
.hero__scroll { position: absolute; z-index: 2; bottom: 28px; left: 50%; display: inline-flex; flex-direction: column; align-items: center; gap: 9px; transform: translateX(-50%); color: rgba(255, 255, 255, .64); font-size: 10px; font-weight: 600; letter-spacing: .16em; }
.hero__scroll i { display: block; width: 1px; height: 30px; background: currentColor; }

.launch { position: relative; display: grid; place-items: center; min-height: 82vh; overflow: hidden; background: var(--accent); text-align: center; }
.launch__route { position: absolute; width: min(880px, 82vw); aspect-ratio: 1; border: 2px solid rgba(24, 32, 28, .12); border-radius: 50%; }
.launch__route::before, .launch__route::after { content: ""; position: absolute; inset: 16%; border: inherit; border-radius: inherit; }
.launch__route::after { inset: 34%; }
.launch__content { position: relative; z-index: 2; width: min(900px, calc(100% - 40px)); }
.launch h2 { margin: 15px 0 30px; font-size: var(--display); font-weight: 760; line-height: .98; letter-spacing: -.06em; }

.site-footer { padding: 28px var(--page-gutter); background: var(--ink); color: var(--white); }
/* Center the Chinese text itself; punctuation does not consume line width. */
.hero h1.optical-title, .launch h2.optical-title { font-weight: 450; }
.optical-title__line { position: relative; display: table; margin-inline: auto; white-space: nowrap; }

.site-footer.site-footer--minimal { padding: 28px var(--page-gutter); }
.site-footer__minimal-inner { width: min(var(--content-width), 100%); margin-inline: auto; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 32px; color: var(--footer-muted); font-size: 13px; }
.site-footer__minimal-inner p { margin: 0; }
.site-footer__minimal-inner a { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; min-height: 44px; }
.site-footer__minimal-inner a:hover { color: var(--white); }


/* Current single-page brand: clay orange and local MiSans variable type. */
:root { --accent: #B65C38; --accent-strong: #984524; --ink: #312925; --journey-ink: #312925; --brand-font: "MiSans", "PingFang SC", "Microsoft YaHei", sans-serif; }
body { font-family: var(--brand-font); }
.brand { font-size: 21px; font-weight: 580; }
.hero h1, .launch h2 { line-height: 1.2; letter-spacing: -.025em; }
.hero h1 { font-size: clamp(46px, 6.4vw, 88px); }
.site-nav { box-shadow: 0 4px 24px #102e3d0a; border-color: #102e3d0c; }
.site-nav__button, .button--dark { background: var(--accent-strong); }
.launch { background: #EEDDD2; color: var(--ink); }
.launch__route { border-color: #225b7312; }
.launch__description { margin: 0 auto 32px; padding-inline: 20px; max-width: 560px; font-size: 16px; line-height: 1.9; }
.reveal { opacity: 1; transform: none; }
.js .reveal { opacity: 0; transform: translateY(26px); transition: opacity 700ms ease, transform 700ms cubic-bezier(.2, .8, .2, 1); }
.js .reveal.is-visible { opacity: 1; transform: none; }
@media (max-width: 760px) {
  :root { --page-gutter: 18px; }
  .site-header { top: 12px; }
  .site-nav { width: calc(100% - 24px); height: 51px; padding-left: 16px; }
  .site-nav__links { gap: 0; }
  .hero, .launch { min-height: 700px; }
  .hero__content { transform: translateY(-3vh); }
  .hero h1.optical-title, .launch h2.optical-title { font-size: clamp(30px, 8vw, 46px); }
  .hero__lead { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  .js .reveal { opacity: 1; transform: none; }
}