/* ===== Calderhaven — styles. Self-hosted fonts, no external requests. ===== */
:root {
  --navy: #0F2233;
  --brass: #B08D57;       /* lines, seal, labels on navy. Never a large fill. */
  --ivory: #F4EFE6;
  --slate: #4A5A66;
  /* Darker brass for SMALL text on ivory (WCAG AA: #B08D57 on ivory is only ~2.9:1). */
  --brass-ink: #7B5E2F;
  --rule: rgba(176, 141, 87, .6);
  --rule-soft: rgba(176, 141, 87, .32);
  --on-navy: rgba(244, 239, 230, .82);
  --header-h: 64px;
  --wrap: 1180px;
  --gutter: clamp(20px, 4vw, 40px);
  --serif: 'Cormorant Garamond', 'Cormorant', Georgia, 'Times New Roman', serif;
  --sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --zh-serif: 'Noto Serif SC', 'Songti SC', 'STSong', 'SimSun', serif;
  --zh-sans: 'PingFang SC', 'Microsoft YaHei', 'Hiragino Sans GB', 'Noto Sans CJK SC', sans-serif;
}

/* ----- fonts (latin + latin-ext; swap so text is never blocked) ----- */
@font-face { font-family: 'Cormorant Garamond'; font-weight: 500; font-style: normal; font-display: swap;
  src: url(fonts/cormorant-garamond-latin-500-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Cormorant Garamond'; font-weight: 500; font-style: normal; font-display: swap;
  src: url(fonts/cormorant-garamond-latin-ext-500-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Inter'; font-weight: 400; font-style: normal; font-display: swap;
  src: url(fonts/inter-latin-400-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Inter'; font-weight: 400; font-style: normal; font-display: swap;
  src: url(fonts/inter-latin-ext-400-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Inter'; font-weight: 500; font-style: normal; font-display: swap;
  src: url(fonts/inter-latin-500-normal.woff2) format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Inter'; font-weight: 500; font-style: normal; font-display: swap;
  src: url(fonts/inter-latin-ext-500-normal.woff2) format('woff2');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-104.woff2) format('woff2'); unicode-range: U+4F63; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-108.woff2) format('woff2'); unicode-range: U+5782,U+8D6B,U+57C3; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-109.woff2) format('woff2'); unicode-range: U+62D3,U+9E7F; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-110.woff2) format('woff2'); unicode-range: U+8D56,U+8377,U+8986; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-111.woff2) format('woff2'); unicode-range: U+8DE8,U+8D5A,U+6052; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-112.woff2) format('woff2'); unicode-range: U+8D38,U+8C37,U+5B97,U+51E1,U+6563,U+4E39,U+5854,U+80E1,U+9010; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-113.woff2) format('woff2'); unicode-range: U+6D0B,U+54E5,U+4F26,U+76D6,U+7A33,U+642D; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-114.woff2) format('woff2'); unicode-range: U+519C,U+4F19,U+4F34,U+8F93,U+6D32,U+5170,U+7EB3,U+6CE2,U+4ED8,U+969C,U+68C0,U+542F; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-115.woff2) format('woff2'); unicode-range: U+8D8A,U+773C,U+6838,U+7C73,U+968F,U+65AD,U+8D27,U+4E9A,U+62C9,U+5FD7,U+65AF,U+514B,U+76D8,U+6E2F; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-116.woff2) format('woff2'); unicode-range: U+6613,U+7740,U+4F18,U+5148,U+9A8C,U+4E94,U+51C6,U+98DF,U+6750,U+7BB1,U+8FCE,U+8BE2,U+5404,U+8425,U+822A,U+5361,U+4F46,U+6574,U+636E,U+6B3E,U+81F4,U+91C7,U+8D2D,U+6784,U+5DF1,U+6B65,U+56E2; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-117.woff2) format('woff2'); unicode-range: U+6D77,U+671F,U+5355,U+8BC1,U+8D28,U+6807,U+5546,U+539F,U+6599,U+5C55,U+96C6,U+88C5,U+6216,U+8FD0,U+6B22,U+6BD4,U+5E03,U+5357,U+683C,U+4ECE,U+4EA4,U+7A0B,U+67E5,U+4EF7,U+4FDD,U+6C42,U+5EFA,U+76F4; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-118.woff2) format('woff2'); unicode-range: U+4FE1,U+957F,U+516C,U+53F8,U+4EE5,U+5408,U+540C,U+4E3A,U+672C,U+4E0D,U+91D1,U+54C1,U+7ECF,U+5927,U+7C7B,U+4E0E,U+7269,U+4EA7,U+5DE5,U+4E1A,U+6211,U+4EEC,U+4F5C,U+5728,U+4E4B,U+95F4,U+7EBF,U+4E0A,U+56FD,U+7279,U+6587,U+56FE,U+660E,U+5E02,U+FF08,U+FF09,U+5230,U+5168,U+53EF,U+62A5,U+4E2A,U+5BF9,U+624B,U+4E09,U+65B9,U+751F,U+673A,U+81EA,U+8981,U+5B9E,U+4F53,U+5F00,U+6B21,U+8BDD,U+63A5,U+8054,U+7CFB; }
@font-face { font-family: 'Noto Serif SC'; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/zh/nssc-119.woff2) format('woff2'); unicode-range: U+7684,U+3002,U+FF0C,U+4E00,U+4E2D,U+6709; }


/* ----- base ----- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 12px); -webkit-text-size-adjust: 100%; }
html, body { overflow-x: clip; }
body { margin: 0; background: var(--ivory); color: var(--navy); font: 400 16px/1.65 var(--sans); font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
:lang(zh-Hans) body, body:lang(zh-Hans) { font-family: var(--sans), var(--zh-sans); line-height: 1.85; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3 { font-family: var(--serif); font-weight: 500; line-height: 1.1; margin: 0; letter-spacing: .005em; }
:lang(zh-Hans) h1, :lang(zh-Hans) h2, :lang(zh-Hans) h3 { font-family: var(--serif), var(--zh-serif); line-height: 1.3; letter-spacing: .04em; }
p { margin: 0; }
a { color: inherit; text-decoration-color: var(--brass); text-underline-offset: 3px; }
ul, ol { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 2px solid var(--brass-ink); outline-offset: 3px; }
.on-navy :focus-visible, .section--navy :focus-visible, .site-footer :focus-visible { outline-color: var(--brass); }
.wrap { width: 100%; max-width: calc(var(--wrap) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.skip { position: absolute; left: 12px; top: -60px; background: var(--navy); color: var(--ivory); padding: 10px 16px; z-index: 100; }
.skip:focus { top: 12px; }
.vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ----- wordmark ----- */
.wm { display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1; text-decoration: none; }
.wm-name { font-family: var(--serif); font-weight: 500; letter-spacing: .2em; text-transform: uppercase; font-size: 1.28rem; white-space: nowrap; }
.wm-line { display: block; width: 100%; height: 1px; background: var(--brass); margin: 5px 0 4px; }
.wm-sub { font: 500 .56rem/1 var(--sans); letter-spacing: .42em; text-transform: uppercase; color: var(--slate); white-space: nowrap; }
.on-navy .wm-sub, .site-footer .wm-sub { color: var(--on-navy); }

/* ----- seal ----- */
.seal { width: 100%; height: auto; overflow: visible; }
.seal .s-disc { fill: var(--navy); }
.seal .s-ring { fill: none; stroke: var(--brass); }
.seal .s-text { font: 500 8.4px var(--sans); letter-spacing: .06em; fill: var(--brass); text-transform: uppercase; }
.seal .s-arm { fill: var(--brass); opacity: .55; }
.seal .s-arm.n { opacity: 1; }
.seal .s-wave { fill: none; stroke: var(--ivory); stroke-width: 1.5; stroke-linecap: round; }
.seal .s-needle { transform-origin: 100px 86px; }
@media (prefers-reduced-motion: no-preference) {
  .seal--anim .s-ring { stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw 1.5s cubic-bezier(.45,.05,.25,1) forwards; }
  .seal--anim .r2 { animation-delay: .15s; } .seal--anim .r3 { animation-delay: .3s; }
  .seal--anim .s-text, .seal--anim .s-arm, .seal--anim .s-wave { opacity: 0; animation: fadein .8s ease 1s forwards; }
  .seal--anim .s-arm:not(.n) { animation-name: fadein55; }
  .seal--anim .s-needle { animation: needle 2.4s cubic-bezier(.3,.6,.3,1) 1.1s both; }
  @keyframes draw { to { stroke-dashoffset: 0; } }
  @keyframes fadein { to { opacity: 1; } }
  @keyframes fadein55 { to { opacity: .55; } }
  @keyframes needle { 0% { transform: rotate(-40deg); } 22% { transform: rotate(22deg); } 42% { transform: rotate(-12deg); } 62% { transform: rotate(6deg); } 82% { transform: rotate(-2deg); } 100% { transform: rotate(0); } }
}

/* ----- header ----- */
.site-header { position: sticky; top: 0; z-index: 50; background: var(--ivory); border-bottom: 1px solid var(--brass); height: var(--header-h); }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 100%; }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brand .seal { width: 38px; flex: none; }
.brand .wm-name { font-size: 1.12rem; }
.nav { display: flex; gap: clamp(14px, 1.9vw, 30px); }
.nav a { font-size: .86rem; text-decoration: none; padding: 6px 0; border-bottom: 1px solid transparent; white-space: nowrap; }
.nav a:hover, .nav a.is-active { border-bottom-color: var(--brass); }
.lang { display: flex; align-items: center; gap: 8px; font-size: .86rem; }
.lang a { text-decoration: none; padding: 4px 2px; border-bottom: 1px solid transparent; }
.lang a[aria-current="true"] { border-bottom-color: var(--brass); font-weight: 500; }
.lang a:hover { border-bottom-color: var(--brass); }
.lang i { font-style: normal; color: var(--brass-ink); }
.menu-btn { display: none; background: none; border: 1px solid var(--rule); color: var(--navy); font: 500 .8rem var(--sans); letter-spacing: .08em; text-transform: uppercase; padding: 9px 14px; cursor: pointer; }
.header-right { display: flex; align-items: center; gap: 18px; }
@media (max-width: 1100px) {
  .menu-btn { display: inline-block; }
  .nav { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 0; background: var(--ivory); border-bottom: 1px solid var(--brass); padding: 8px var(--gutter) 20px; }
  .nav.open { display: flex; }
  .nav a { padding: 14px 0; border-bottom: 1px solid var(--rule-soft); font-size: 1rem; }
}
@media (max-width: 520px) { .brand .wm-sub, .brand .wm-line { display: none; } .brand { gap: 9px; min-width: 0; } .brand .seal { width: 32px; } .brand .wm-name { font-size: .95rem; letter-spacing: .13em; } .header-right { gap: 8px; } .lang { gap: 4px; font-size: .8rem; } .lang a { white-space: nowrap; } .menu-btn { padding: 8px 10px; font-size: .68rem; } .site-header .wrap { gap: 8px; } }

/* ----- buttons ----- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font: 500 .92rem/1 var(--sans); letter-spacing: .02em; text-decoration: none; padding: 17px 26px; border: 1px solid var(--navy); cursor: pointer; transition: background-color .25s, color .25s, border-color .25s; min-height: 52px; }
.btn--primary { background: var(--navy); color: var(--ivory); }
.btn--primary:hover { background: #17344b; }
.btn--outline { background: transparent; color: var(--navy); }
.btn--outline:hover { background: var(--navy); color: var(--ivory); }
.on-navy .btn--primary { background: var(--ivory); color: var(--navy); border-color: var(--ivory); }
.on-navy .btn--primary:hover { background: #fff; }
.on-navy .btn--outline { color: var(--ivory); border-color: var(--rule); }
.on-navy .btn--outline:hover { background: var(--ivory); color: var(--navy); border-color: var(--ivory); }
.btn svg { width: 16px; height: 16px; flex: none; }

/* ----- hero ----- */
.hero { position: relative; background: var(--navy); color: var(--ivory); min-height: calc(100vh - var(--header-h)); min-height: calc(100svh - var(--header-h)); display: flex; flex-direction: column; justify-content: center; overflow: hidden; isolation: isolate; }
/* map evenly lit across its width; soft vignette only at the extreme left/right edges */
.hero-map { position: absolute; inset: 0; z-index: -1; display: flex; align-items: center; justify-content: center; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%); }
.hero-map svg { width: 100%; max-width: none; height: auto; }
.hero-inner { padding-block: clamp(48px, 8vw, 96px) clamp(110px, 12vw, 140px); display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 40px; align-items: center; }
.hero h1 { font-size: clamp(2.6rem, 6.4vw, 5.2rem); letter-spacing: -.005em; max-width: 12ch; }
:lang(zh-Hans) .hero h1 { max-width: none; font-size: clamp(2.3rem, 5.6vw, 4.4rem); }
.hero--page h1 { font-size: clamp(2.3rem, 4.8vw, 4.1rem); max-width: 17ch; }
:lang(zh-Hans) .hero--page h1 { font-size: clamp(2.1rem, 4.4vw, 3.6rem); }
.hero .lead { margin-top: 28px; max-width: 58ch; font-size: clamp(1.02rem, 1.5vw, 1.18rem); color: var(--on-navy); }
.hero-cta { margin-top: 40px; display: flex; flex-wrap: wrap; gap: 14px; }
.hero-seal { justify-self: end; align-self: center; width: min(100%, 390px); }
.hero-rule { display: none; width: 64px; height: 1px; background: var(--brass); margin-bottom: 28px; }
/* registry line pinned to the bottom edge of the hero: visible above the fold */
.hero-trust { position: absolute; left: 0; right: 0; bottom: 0; border-top: 1px solid rgba(176, 141, 87, .45); background: rgba(15, 34, 51, .62); }
.hero-trust .trust { padding-block: 16px; color: var(--on-navy); }
.hero-trust .trust li + li { border-left-color: rgba(176, 141, 87, .5); }
.hero-trust .trust b { color: var(--ivory); }
.hero-trust .todo { color: var(--brass); }
@media (max-width: 860px) {
  .hero-rule { display: block; }
  .hero { justify-content: flex-start; }
  .hero-inner { grid-template-columns: 1fr; gap: 28px; padding-bottom: 40px; }
  .hero-seal { order: -1; justify-self: start; width: 132px; }
  .hero-trust { position: static; margin-top: auto; }
  .btn { width: 100%; }
}
/* map shared */
.dots { fill: none; stroke: var(--ivory); stroke-opacity: .34; stroke-width: 2.8; stroke-linecap: round; }
.pulses circle { fill: var(--brass); opacity: 0; }
.pulses circle.lit { animation: pulse 3.8s ease-in-out forwards; }
@keyframes pulse { 0% { opacity: 0; } 35% { opacity: .95; } 100% { opacity: 0; } }

/* ----- strip: six analog dials ----- */
.strip { background: var(--ivory); border-bottom: 1px solid var(--rule); }
.trust { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 0; font-size: .84rem; letter-spacing: .02em; text-align: center; }
.trust li { padding: 2px 18px; }
.trust li + li { border-left: 1px solid var(--rule); }
.trust b { font-weight: 500; }
.trust .todo { color: var(--brass-ink); }
.clocks { display: grid; grid-template-columns: repeat(6, 1fr); }
.clock { --face: #FAF6EE; --hand: var(--navy); --tick: var(--navy); padding: 24px 8px 22px; text-align: center; }
.clock + .clock { border-left: 1px solid var(--rule-soft); }
.clock[data-night="1"] { --face: var(--navy); --hand: var(--ivory); --tick: var(--ivory); }
.dial { width: 84px; height: 84px; margin: 0 auto 12px; overflow: visible; }
.d-face { fill: var(--face); transition: fill 1s ease; }
.d-ring { fill: none; stroke: var(--brass); stroke-width: 1.1; }
.d-t { stroke: var(--tick); stroke-width: 1; transition: stroke 1s ease; }
.d-tl { stroke-width: 2; }
.d-h, .d-m { stroke: var(--hand); stroke-linecap: round; transition: stroke 1s ease; }
.d-h { stroke-width: 3.6; } .d-m { stroke-width: 2.4; }
.d-s { stroke: var(--brass); stroke-width: 1; stroke-linecap: round; }
.d-pin { fill: var(--brass); }
.clock-city { display: block; font-size: .66rem; letter-spacing: .24em; text-transform: uppercase; color: var(--slate); }
:lang(zh-Hans) .clock-city { letter-spacing: .12em; font-size: .78rem; }
.hq { font-style: normal; margin-left: 7px; padding: 1px 4px 0; border: 1px solid var(--brass); color: var(--brass-ink); font-size: .54rem; letter-spacing: .12em; vertical-align: 1px; }
.clock-time { display: block; margin-top: 4px; font: 400 .8rem/1.2 var(--sans); font-variant-numeric: tabular-nums; letter-spacing: .06em; color: var(--navy); }
@media (max-width: 860px) {
  .clocks { grid-template-columns: repeat(3, 1fr); }
  .clock { padding: 20px 4px 18px; }
  .clock:nth-child(3n+1) { border-left: 0; }
  .clock:nth-child(n+4) { border-top: 1px solid var(--rule-soft); }
  .dial { width: 68px; height: 68px; }
  .clock-city { font-size: .58rem; letter-spacing: .14em; }
  .trust li { padding: 2px 12px; } .trust li + li { border-left: 0; }
}
@media (prefers-reduced-motion: reduce) { .d-face, .d-t, .d-h, .d-m { transition: none; } }

/* ----- sections ----- */
.section { padding-block: clamp(72px, 10vw, 136px); position: relative; }
.section--navy { background: var(--navy); color: var(--ivory); }
.eyebrow { display: flex; align-items: center; gap: 16px; font: 500 .74rem/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--brass-ink); margin-bottom: 26px; }
.eyebrow::after { content: ''; height: 1px; width: 72px; background: var(--brass); }
.section--navy .eyebrow { color: var(--brass); }
:lang(zh-Hans) .eyebrow { letter-spacing: .14em; }
.section h2 { font-size: clamp(2rem, 4.4vw, 3.5rem); max-width: 20ch; }
:lang(zh-Hans) .section h2 { max-width: none; }
.sec-head { margin-bottom: clamp(40px, 6vw, 72px); }

/* 02 house */
.house-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.house-copy { font-size: 1.1rem; color: var(--slate); max-width: 56ch; }
.principles { border-top: 1px solid var(--brass); }
.principles li { display: grid; grid-template-columns: 52px 1fr; gap: 0 12px; padding: 22px 0; border-bottom: 1px solid var(--rule); }
.principles .num { font-family: var(--serif); font-size: 1.5rem; color: var(--brass-ink); line-height: 1.2; font-variant-numeric: lining-nums; }
.principles h3 { font-size: 1.55rem; margin-bottom: 4px; }
:lang(zh-Hans) .principles h3 { font-size: 1.3rem; }
.principles p { color: var(--slate); }
@media (max-width: 860px) { .house-grid { grid-template-columns: 1fr; } }

/* 03 trade */
.cards { display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--brass); border-left: 1px solid var(--rule); }
.card { padding: 30px 24px 34px; border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); transition: background-color .3s; }
.card:hover { background: rgba(176, 141, 87, .08); }
.card svg { width: 44px; height: 44px; margin-bottom: 28px; fill: none; stroke: var(--brass); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.card h3 { font-size: 1.4rem; margin-bottom: 8px; line-height: 1.15; }
:lang(zh-Hans) .card h3 { font-size: 1.2rem; }
.card p { font-size: .92rem; color: var(--slate); line-height: 1.55; }
.trade-note { margin-top: 34px; font-family: var(--serif); font-style: italic; font-size: 1.35rem; color: var(--slate); max-width: 52ch; }
:lang(zh-Hans) .trade-note { font-style: normal; font-size: 1.1rem; }
@media (max-width: 1100px) { .cards { grid-template-columns: repeat(2, 1fr); } .card:last-child { grid-column: 1 / -1; } }
@media (max-width: 560px) { .cards { grid-template-columns: 1fr; } }

/* 04 capabilities */
.cap-map { margin-top: 8px; }
.cap-map svg { width: 100%; height: auto; }
.cap-ui { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 32px; margin-top: 28px; align-items: start; }
.cap-tabs { display: grid; border-top: 1px solid var(--rule); }
.cap-tabs button { all: unset; box-sizing: border-box; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 4px; border-bottom: 1px solid var(--rule); font-family: var(--serif); font-size: 1.35rem; color: var(--on-navy); transition: color .2s, padding .25s; }
:lang(zh-Hans) .cap-tabs button { font-family: var(--serif), var(--zh-serif); font-size: 1.15rem; }
.cap-tabs button::after { content: '→'; font-family: var(--sans); font-size: .9rem; color: var(--brass); opacity: 0; transition: opacity .2s; }
.cap-tabs button:hover, .cap-tabs button[aria-pressed="true"] { color: #fff; padding-left: 12px; }
.cap-tabs button[aria-pressed="true"]::after, .cap-tabs button:hover::after { opacity: 1; }
.cap-tabs button:focus-visible { outline: 2px solid var(--brass); outline-offset: 2px; }
.cap-note { margin-top: 24px; font-size: .88rem; color: var(--on-navy); }
.ledger-card { background: var(--ivory); color: var(--navy); border: 1px solid var(--brass); padding: 6px 24px 8px; position: relative; box-shadow: inset 0 0 0 4px var(--ivory), inset 0 0 0 5px var(--rule-soft); }
.ledger-card[hidden] { display: none; }
.ledger-row { display: flex; align-items: baseline; gap: 12px; padding: 14px 4px; border-bottom: 1px solid var(--rule-soft); }
.ledger-row:last-child { border-bottom: 0; }
.ledger-k { flex: none; font: 500 .66rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--brass-ink); width: 11em; }
:lang(zh-Hans) .ledger-k { letter-spacing: .1em; width: 5em; font-size: .78rem; }
.ledger-v { font-family: var(--serif); font-size: 1.3rem; line-height: 1.25; }
:lang(zh-Hans) .ledger-v { font-family: var(--serif), var(--zh-serif); font-size: 1.1rem; }
@media (max-width: 860px) {
  .cap-ui { grid-template-columns: 1fr; }
  .ledger-row { flex-direction: column; gap: 6px; }
  .ledger-k, :lang(zh-Hans) .ledger-k { width: auto; }
}

/* 05 work */
.steps { counter-reset: step; display: grid; grid-template-columns: repeat(6, 1fr); position: relative; }
.steps::before { content: ''; position: absolute; left: 0; right: 0; top: 33px; height: 1px; background: var(--brass); }
.step { position: relative; padding: 0 18px 0 0; }
.stamp { position: relative; width: 66px; height: 66px; border-radius: 50%; background: var(--ivory); border: 1px solid var(--brass); display: grid; place-items: center; margin-bottom: 26px; }
.stamp::before { content: ''; position: absolute; inset: 4px; border-radius: 50%; border: 1px solid var(--rule-soft); }
.stamp span { font-family: var(--serif); font-size: 1.5rem; color: var(--navy); font-variant-numeric: lining-nums; }
.step h3 { font-size: 1.4rem; margin-bottom: 8px; }
:lang(zh-Hans) .step h3 { font-size: 1.2rem; }
.step p { font-size: .92rem; color: var(--slate); line-height: 1.55; }
@media (max-width: 1000px) {
  .steps { grid-template-columns: 1fr; }
  .steps::before { left: 33px; right: auto; top: 0; bottom: 0; width: 1px; height: auto; }
  .step { padding: 0 0 40px 96px; min-height: 66px; }
  .step:last-child { padding-bottom: 0; }
  .stamp { position: absolute; left: 0; top: 0; margin: 0; }
}
.js .step .stamp { opacity: 0; transform: scale(1.5) rotate(-12deg); }
.js .step .stamp::after { content: ''; position: absolute; inset: -1px; border-radius: 50%; border: 1px solid var(--brass); opacity: 0; }
.js .step.is-in .stamp { opacity: 1; transform: none; transition: opacity .35s ease, transform .55s cubic-bezier(.2,1.5,.4,1); transition-delay: calc(var(--i) * 90ms); }
.js .step.is-in .stamp::after { animation: ripple 1s ease-out calc(var(--i) * 90ms + 300ms) 1; }
@keyframes ripple { 0% { opacity: .8; transform: scale(1); } 100% { opacity: 0; transform: scale(1.55); } }
.js .step h3, .js .step p { opacity: 0; transform: translateY(8px); }
.js .step.is-in h3, .js .step.is-in p { opacity: 1; transform: none; transition: opacity .6s ease, transform .6s ease; transition-delay: calc(var(--i) * 90ms + 200ms); }
@media (prefers-reduced-motion: reduce) { .js .step .stamp, .js .step h3, .js .step p { opacity: 1; transform: none; transition: none !important; } .js .step .stamp::after { display: none; } html { scroll-behavior: auto; } }

/* 06 who */
.who { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--brass); }
.who > div { padding: 32px 32px 36px 0; }
.who > div + div { padding-left: 32px; border-left: 1px solid var(--rule); }
.who h3 { font-size: 1.8rem; margin-bottom: 12px; }
:lang(zh-Hans) .who h3 { font-size: 1.45rem; }
.who p { color: var(--slate); max-width: 34ch; }
@media (max-width: 860px) { .who { grid-template-columns: 1fr; } .who > div, .who > div + div { padding: 26px 0; border-left: 0; border-bottom: 1px solid var(--rule); } }

/* 07 standards */
.section--tint { background: linear-gradient(var(--ivory), var(--ivory)); border-top: 1px solid var(--rule); }
.std { display: grid; grid-template-columns: 1fr 1fr; column-gap: 64px; border-top: 1px solid var(--brass); }
.std li { position: relative; padding: 22px 0 22px 30px; border-bottom: 1px solid var(--rule); font-size: 1.04rem; }
.std li::before { content: ''; position: absolute; left: 4px; top: 33px; width: 7px; height: 7px; background: var(--brass); transform: rotate(45deg); }
@media (max-width: 760px) { .std { grid-template-columns: 1fr; } }

/* 08 group */
.group { display: flex; flex-direction: column; align-items: center; }
.group-root { border: 1px solid var(--brass); padding: 20px 44px; font-family: var(--serif); font-size: 1.8rem; letter-spacing: .12em; text-transform: uppercase; background: var(--ivory); position: relative; }
.group-branches { display: flex; justify-content: center; position: relative; padding-top: 40px; gap: 24px; }
.group-branches::before { content: ''; position: absolute; top: 0; left: 50%; height: 20px; width: 1px; background: var(--brass); }
.group-ent { position: relative; border: 1px solid var(--rule); padding: 16px 34px; font: 500 .8rem var(--sans); letter-spacing: .2em; text-transform: uppercase; }
.group-ent::before { content: ''; position: absolute; top: -20px; left: 50%; height: 20px; width: 1px; background: var(--brass); }
.group-ent:first-child:not(:only-child)::after, .group-ent:last-child:not(:only-child)::after { content: ''; position: absolute; top: -20px; height: 1px; background: var(--brass); width: calc(50% + 12px); }
.group-ent:first-child::after { left: 50%; } .group-ent:last-child::after { right: 50%; }
.group-note { margin-top: 28px; font-size: .9rem; color: var(--slate); text-align: center; }

/* 09 contact */
.contact-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(36px, 6vw, 96px); align-items: start; }
.form-title { font-size: 1.7rem; margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--brass); }
.rfq { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 28px; }
.field { display: flex; flex-direction: column; padding-top: 14px; }
.field.full { grid-column: 1 / -1; }
.field label { font: 500 .66rem/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--slate); margin-bottom: 4px; }
:lang(zh-Hans) .field label { letter-spacing: .1em; font-size: .78rem; }
.field input, .field select, .field textarea { font: 400 1rem/1.4 var(--sans); color: var(--navy); background: transparent; border: 0; border-bottom: 1px solid var(--navy); border-radius: 0; padding: 10px 2px; width: 100%; appearance: none; -webkit-appearance: none; }
.field select { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230F2233' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right 4px center; padding-right: 26px; }
.field textarea { resize: vertical; min-height: 96px; border: 1px solid var(--navy); padding: 10px 12px; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--brass-ink); box-shadow: 0 1px 0 0 var(--brass-ink); }
.field textarea:focus { box-shadow: 0 0 0 1px var(--brass-ink); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.rfq .actions { grid-column: 1 / -1; margin-top: 22px; }
.form-status { grid-column: 1 / -1; margin-top: 8px; font-size: .98rem; padding: 0; }
.form-status.ok { border: 1px solid var(--brass); padding: 16px 18px; background: rgba(176,141,87,.1); font-family: var(--serif); font-size: 1.3rem; }
.form-status.err { color: #8a2a1f; }
@media (max-width: 860px) { .contact-grid { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .rfq { grid-template-columns: 1fr; } }
.direct { border-top: 1px solid var(--brass); }
.direct h3 { font-size: 1.7rem; margin: 20px 0 6px; }
.direct > p { color: var(--slate); margin-bottom: 18px; font-size: .95rem; }
.direct dl { margin: 0; }
.direct .row { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 12px 0; border-top: 1px solid var(--rule-soft); }
.direct dt { font: 500 .66rem/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--slate); }
.direct dd { margin: 0; text-align: right; font-size: .98rem; word-break: break-word; }
.direct a { text-decoration: none; border-bottom: 1px solid var(--brass); }

/* footer */
.site-footer { background: var(--navy); color: var(--on-navy); padding-block: clamp(56px, 8vw, 96px) 36px; border-top: 1px solid var(--brass); }
.foot-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 56px; align-items: start; }
.foot-brand { display: flex; flex-direction: column; gap: 22px; align-items: flex-start; color: var(--ivory); }
.foot-brand .seal { width: 104px; }
.foot-brand .wm-name { font-size: 1.5rem; }
.foot-tag { font-family: var(--serif); font-size: 1.5rem; color: var(--ivory); }
:lang(zh-Hans) .foot-tag { font-family: var(--serif), var(--zh-serif); font-size: 1.25rem; }
.legal { font-size: .84rem; line-height: 1.8; font-style: normal; }
.legal strong { color: var(--ivory); font-weight: 500; }
.legal .todo { color: var(--brass); }
.foot-links { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 28px; padding-top: 22px; border-top: 1px solid rgba(176,141,87,.5); font-size: .86rem; }
.foot-links a { text-decoration: none; border-bottom: 1px solid transparent; color: var(--ivory); }
.foot-links a:hover { border-bottom-color: var(--brass); }
.copy { margin-top: 48px; font-size: .78rem; opacity: .7; }
@media (max-width: 860px) { .foot-grid { grid-template-columns: 1fr; gap: 36px; } }

/* legal pages */
.doc { max-width: 760px; padding-block: clamp(48px, 8vw, 96px); }
.doc h1 { font-size: clamp(2.2rem, 5vw, 3.4rem); margin-bottom: 8px; }
.doc h2 { font-size: 1.7rem; margin: 40px 0 10px; }
.doc p, .doc li { color: var(--slate); margin-bottom: 12px; }
.doc ul { list-style: disc; padding-left: 22px; }
.doc .draft { border: 1px solid var(--brass); padding: 14px 18px; margin: 18px 0 32px; font-size: .9rem; color: var(--navy); background: rgba(176,141,87,.1); }
.doc .meta { color: var(--brass-ink); font-size: .85rem; letter-spacing: .05em; }

/* reveal on scroll (only if JS present) */
.js .reveal { opacity: 0; transform: translateY(14px); transition: opacity .8s ease, transform .8s ease; }
.js .reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .js .reveal { opacity: 1; transform: none; transition: none; } }
@media print { .site-header, .hero-map { display: none; } }

@media (max-width: 860px) { .lanes-map .arc { stroke-width: 2.2; } .route.is-active .arc { stroke-width: 3; } .hero .arc { stroke-width: 2; } }









/* who (single neutral statement) */
.who-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.who-copy { font-size: 1.15rem; color: var(--slate); max-width: 48ch; padding-top: .6rem; }
@media (max-width: 860px) { .who-grid { grid-template-columns: 1fr; } }
/* landing pages: four points in two columns */
.principles--2col { display: grid; grid-template-columns: 1fr 1fr; column-gap: 64px; }
@media (max-width: 860px) { .principles--2col { grid-template-columns: 1fr; } }
/* partners (hidden until showPartners) */
.partners { display: flex; flex-wrap: wrap; gap: 32px 56px; align-items: center; border-top: 1px solid var(--brass); padding-top: 36px; }
.partner { display: block; width: 132px; height: 52px; background: var(--slate); -webkit-mask: var(--logo) center / contain no-repeat; mask: var(--logo) center / contain no-repeat; transition: background-color .3s; }
a:hover .partner, .partner:hover { background: var(--brass-ink); }