:root {
  --obsidian: #08090c;
  --obsidian-soft: #111318;
  --moon: #f4f1ea;
  --graphite: #687176;
  --hengdong-mint: #82f6f3;
  --hengdong-coral: #ecaea6;
  --xingyu-indigo: #061936;
  --xingyu-gold: #ddb05a;
  --xingyu-paper: #f4ebd8;
  --content: min(1240px, calc(100vw - 64px));
  color-scheme: dark;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Helvetica Neue", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--obsidian); }
body { margin: 0; min-width: 320px; background: var(--obsidian); color: var(--moon); }
body, button, input, textarea, select { font: inherit; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { background: var(--hengdong-mint); color: var(--obsidian); }

.skip-link {
  position: fixed;
  z-index: 999;
  top: 12px;
  left: 12px;
  padding: 10px 14px;
  border-radius: 999px;
  background: var(--moon);
  color: var(--obsidian);
  transform: translateY(-160%);
  transition: transform 0.18s ease;
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: relative;
  z-index: 100;
  border-bottom: 1px solid rgba(244, 241, 234, 0.12);
  background: rgba(8, 9, 12, 0.78);
  backdrop-filter: blur(18px) saturate(130%);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
}
.portal-header { position: absolute; inset: 0 0 auto; }
.hengdong-header { position: sticky; top: 0; background: rgba(245, 242, 236, 0.82); color: #111318; border-bottom-color: rgba(8, 9, 12, 0.1); }
.nav { width: var(--content); min-height: 78px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.personal-wordmark, .project-wordmark { display: inline-flex; align-items: center; gap: 13px; min-height: 44px; }
.personal-wordmark { display: grid; gap: 1px; }
.personal-wordmark strong { font-size: 18px; letter-spacing: -0.03em; }
.personal-wordmark strong span { color: var(--hengdong-mint); }
.personal-wordmark small, .project-wordmark small { color: rgba(244, 241, 234, 0.5); font-size: 9px; font-weight: 750; letter-spacing: 0.17em; }
.project-wordmark img { width: 43px; height: 43px; object-fit: contain; }
.project-wordmark > span { display: grid; gap: 1px; }
.project-wordmark strong { font-size: 18px; letter-spacing: -0.03em; }
.hengdong-header .project-wordmark small { color: #727570; }
.nav-links { display: flex; align-items: center; gap: clamp(18px, 2.4vw, 34px); }
.nav-links a { position: relative; padding: 12px 0; color: rgba(244, 241, 234, 0.7); font-size: 13px; font-weight: 650; }
.nav-links a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 7px; height: 1px; background: currentColor; transition: right 0.18s ease; }
.nav-links a:hover::after, .nav-links a:focus-visible::after { right: 0; }
.hengdong-header .nav-links a { color: rgba(8, 9, 12, 0.68); }
.back-home-link { color: #111318 !important; }

.world-opening {
  position: relative;
  min-height: 100svh;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 0.92fr);
  align-items: end;
  gap: clamp(50px, 8vw, 130px);
  overflow: hidden;
  padding: 150px max(32px, calc((100vw - 1240px) / 2)) 74px;
  background:
    radial-gradient(circle at 78% 34%, rgba(221, 176, 90, 0.12), transparent 25%),
    radial-gradient(circle at 15% 76%, rgba(130, 246, 243, 0.1), transparent 28%),
    var(--obsidian);
}
.world-opening::before { content: ""; position: absolute; inset: 78px 0 0; pointer-events: none; background-image: linear-gradient(rgba(244,241,234,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(244,241,234,.04) 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(to bottom, transparent, #000 25%, #000 70%, transparent); }
.opening-orbit { position: absolute; width: min(72vw, 980px); aspect-ratio: 1; right: -34vw; top: -34vw; border: 1px solid rgba(244,241,234,.1); border-radius: 50%; }
.opening-orbit::before, .opening-orbit::after { content: ""; position: absolute; inset: 12%; border: inherit; border-radius: inherit; }
.opening-orbit::after { inset: 27%; border-color: rgba(221,176,90,.18); }
.opening-copy { position: relative; z-index: 2; align-self: center; max-width: 760px; padding-top: 44px; }
.opening-eyebrow, .chapter-number, .section-number { margin: 0; color: rgba(244,241,234,.5); font-size: 10px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; }
.opening-copy h1 { margin: 24px 0 28px; max-width: 820px; font-size: clamp(54px, 6.2vw, 98px); line-height: .96; letter-spacing: -.065em; font-weight: 730; }
.opening-copy h1 span { color: transparent; -webkit-text-stroke: 1px rgba(244,241,234,.62); }
.opening-copy > p:last-child { max-width: 620px; margin: 0; color: rgba(244,241,234,.58); font-size: 17px; line-height: 1.8; }
.world-portals { position: relative; z-index: 3; display: grid; gap: 14px; align-self: end; }
.world-portal { min-height: 214px; display: grid; grid-template-columns: 146px 1fr; align-items: center; gap: 26px; padding: 24px 30px; border: 1px solid rgba(244,241,234,.14); overflow: hidden; transition: transform .32s cubic-bezier(.2,.8,.2,1), border-color .18s ease; }
.world-portal:hover, .world-portal:focus-visible { transform: translateX(-8px); border-color: rgba(244,241,234,.46); }
.world-portal img, .world-portal svg { width: 134px; height: 134px; object-fit: contain; }
.world-portal .brand-motion-artwork { pointer-events: none; transform: none; }
.world-portal[aria-busy="true"] { cursor: progress; }
.portal-hengdong { background: var(--moon); color: var(--obsidian); }
.portal-xingyu { background: var(--xingyu-indigo); color: var(--xingyu-paper); }
.portal-xingyu img, .portal-xingyu svg { width: 116px; height: 116px; justify-self: center; }
.world-portal > span { display: grid; gap: 5px; }
.world-portal b { opacity: .48; font-size: 10px; letter-spacing: .16em; }
.world-portal strong { font-size: 38px; letter-spacing: -.05em; }
.world-portal small { opacity: .58; font-size: 9px; font-weight: 750; letter-spacing: .14em; }
.scroll-cue { position: absolute; left: 50%; bottom: 26px; z-index: 4; display: grid; justify-items: center; gap: 8px; color: rgba(244,241,234,.42); font-size: 9px; letter-spacing: .16em; transform: translateX(-50%); }
.scroll-cue i { display: block; width: 1px; height: 30px; background: linear-gradient(to bottom, rgba(244,241,234,.8), transparent); animation: cue 1.8s ease-in-out infinite; }
@keyframes cue { 0%,100% { transform: scaleY(.4); transform-origin: top; opacity: .35; } 50% { transform: scaleY(1); opacity: 1; } }

.world-chapter { position: relative; height: 195svh; --scene-reveal: 1; --scene-hold: 0; --scene-opacity: 1; --copy-y: 0px; --orbit-rotate: 0deg; --screen-one-y: 0px; --screen-two-y: 0px; --screen-three-y: 0px; }
.world-stage { position: sticky; top: 0; min-height: 100svh; display: grid; grid-template-columns: minmax(360px, .82fr) minmax(500px, 1.18fr); align-items: center; gap: clamp(44px, 7vw, 120px); overflow: hidden; padding: 92px max(32px, calc((100vw - 1240px) / 2)) 54px; }
.hengdong-world .world-stage { background: var(--moon); color: var(--obsidian); }
.xingyu-world .world-stage { background: var(--xingyu-indigo); color: var(--xingyu-paper); font-family: "Songti SC", "STSong", Georgia, serif; }
.world-atmosphere { position: absolute; inset: 0; pointer-events: none; }
.hengdong-world .world-atmosphere { background: radial-gradient(circle at 74% 54%, rgba(130,246,243,.28), transparent 22%), radial-gradient(circle at 94% 18%, rgba(236,174,166,.24), transparent 18%); }
.hengdong-world .world-atmosphere::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(8,9,12,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(8,9,12,.045) 1px, transparent 1px); background-size: 74px 74px; mask-image: linear-gradient(90deg, transparent 32%, #000); }
.xingyu-world .world-atmosphere { background: radial-gradient(circle at 72% 48%, rgba(99,76,145,.34), transparent 30%), radial-gradient(circle at 90% 8%, rgba(221,176,90,.18), transparent 20%), radial-gradient(circle at 16% 100%, rgba(100,124,176,.16), transparent 28%); }
.xingyu-world .world-atmosphere::after { content: ""; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(244,235,216,.58) 0 1px, transparent 1.4px); background-size: 58px 58px; opacity: .22; }
.chapter-copy { position: relative; z-index: 3; opacity: var(--scene-opacity); transform: translateY(var(--copy-y)); }
.chapter-mark { width: 78px; height: 78px; object-fit: contain; margin: 28px 0 22px; }
.hengdong-mark { width: 92px; height: 92px; }
.chapter-copy h2 { margin: 0; max-width: 610px; font-size: clamp(45px, 5vw, 76px); line-height: 1.02; letter-spacing: -.06em; }
.chapter-copy h2 span { color: var(--graphite); }
.xingyu-world .chapter-copy h2 { letter-spacing: -.035em; font-weight: 580; }
.xingyu-world .chapter-copy h2 span { color: rgba(244,235,216,.56); }
.chapter-copy > p:not(.chapter-number) { max-width: 560px; margin: 26px 0 0; color: rgba(8,9,12,.58); font-size: 16px; line-height: 1.85; }
.xingyu-world .chapter-copy > p:not(.chapter-number) { color: rgba(244,235,216,.62); }
.chapter-tags, .hero-platforms { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 28px 0 0; list-style: none; }
.chapter-tags li, .hero-platforms li { padding: 8px 12px; border: 1px solid rgba(8,9,12,.15); border-radius: 999px; font: 700 9px/1 -apple-system, BlinkMacSystemFont, sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.xingyu-world .chapter-tags li { border-color: rgba(221,176,90,.28); color: rgba(244,235,216,.68); }
.world-cta { display: inline-flex; align-items: center; justify-content: space-between; gap: 42px; min-width: 230px; margin-top: 34px; padding: 15px 18px; border: 1px solid rgba(8,9,12,.22); font: 720 13px/1.2 -apple-system, BlinkMacSystemFont, sans-serif; transition: background .18s ease, color .18s ease, transform .18s ease; }
.world-cta:hover, .world-cta:focus-visible { transform: translateY(-3px); }
.hengdong-cta:hover { background: var(--obsidian); color: var(--moon); }
.xingyu-cta { border-color: rgba(221,176,90,.38); color: var(--xingyu-paper); }
.xingyu-cta:hover { background: var(--xingyu-gold); color: var(--xingyu-indigo); }
.xingyu-mark-wrap { position: relative; width: 88px; height: 88px; margin: 28px 0 22px; }
.xingyu-mark-wrap .chapter-mark { position: relative; z-index: 2; width: 82px; height: 82px; margin: 0; }
.xingyu-mark-wrap span { position: absolute; inset: -13px; border: 1px solid rgba(221,176,90,.2); border-radius: 50%; transform: rotate(var(--orbit-rotate)); }
.xingyu-mark-wrap span::after { content: ""; position: absolute; width: 5px; height: 5px; top: 8px; left: 50%; border-radius: 50%; background: var(--xingyu-gold); box-shadow: 0 0 16px rgba(221,176,90,.8); }
.interface-collage { position: relative; z-index: 2; min-height: min(78svh, 780px); perspective: 1400px; opacity: var(--scene-opacity); }
.screen { position: absolute; margin: 0; overflow: hidden; background: #0a0a0a; box-shadow: 0 26px 70px rgba(0,0,0,.28); }
.screen img { width: 100%; height: 100%; object-fit: cover; }
.screen { width: clamp(180px, 18vw, 250px); aspect-ratio: 480 / 1043; border-radius: 28px; border: 1px solid rgba(8,9,12,.13); }
.screen-one { left: 1%; top: 14%; transform: translateY(var(--screen-one-y)) rotate(-6deg); }
.screen-two { left: 32%; top: 2%; z-index: 2; transform: translateY(var(--screen-two-y)) scale(1.06); }
.screen-three { right: 1%; top: 14%; transform: translateY(var(--screen-three-y)) rotate(6deg); }
.xingyu-collage .screen { border-color: rgba(221,176,90,.2); box-shadow: 0 30px 80px rgba(0,0,0,.52), 0 0 0 1px rgba(221,176,90,.05); }
.xingyu-collage .screen-one { top: 15%; }
.xingyu-collage .screen-two { top: 2%; }
.xingyu-collage .screen-three { top: 17%; }

.studio-note { width: var(--content); min-height: 86svh; margin: 0 auto; display: grid; align-content: center; grid-template-columns: .9fr 1.1fr; gap: clamp(50px, 10vw, 160px); padding: 120px 0; }
.studio-note .opening-eyebrow { grid-column: 1 / -1; }
.studio-note h2 { margin: 0; font-size: clamp(43px, 5.6vw, 82px); line-height: 1.04; letter-spacing: -.055em; }
.studio-note h2 span { color: rgba(244,241,234,.42); }
.studio-contact { align-self: end; padding-bottom: 8px; }
.studio-contact p { max-width: 420px; margin: 0 0 30px; color: rgba(244,241,234,.55); line-height: 1.8; }
.studio-contact a { display: flex; justify-content: space-between; gap: 20px; padding: 18px 0; border-top: 1px solid rgba(244,241,234,.25); border-bottom: 1px solid rgba(244,241,234,.25); font-weight: 680; }

.site-footer { padding: 0 max(32px, calc((100vw - 1240px) / 2)); background: var(--obsidian); color: var(--moon); }
.footer-main { min-height: 170px; display: flex; align-items: center; justify-content: space-between; gap: 36px; }
.footer-identity { display: grid; gap: 5px; }
.footer-identity strong { font-size: 17px; }
.footer-identity small { color: rgba(244,241,234,.45); font-size: 9px; letter-spacing: .16em; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 24px; }
.footer-links a { color: rgba(244,241,234,.58); font-size: 13px; transition: color .18s ease; }
.footer-links a:hover { color: var(--moon); }
.icp-record { min-height: 64px; display: flex; align-items: center; justify-content: center; gap: 3px; border-top: 1px solid rgba(244,241,234,.12); color: rgba(244,241,234,.42); font-size: 14px; }
.icp-record a:hover { color: var(--moon); }

/* Hengdong product */
.hengdong-page { background: #f5f2ec; color: var(--obsidian); color-scheme: light; }
.hengdong-page ::selection, .hengdong-legal ::selection { background: var(--hengdong-mint); color: var(--obsidian); }
.hengdong-hero { min-height: calc(100svh - 79px); display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(38px, 7vw, 110px); overflow: hidden; padding: 80px max(32px, calc((100vw - 1240px) / 2)); background: #f5f2ec; }
.hengdong-kicker { display: flex; align-items: center; gap: 10px; margin: 0 0 26px; color: #676b69; font-size: 10px; font-weight: 800; letter-spacing: .17em; }
.hengdong-kicker span { width: 24px; height: 6px; border-radius: 999px; background: linear-gradient(90deg, var(--hengdong-coral) 0 50%, var(--hengdong-mint) 50%); }
.hengdong-hero h1 { margin: 0; max-width: 700px; font-size: clamp(58px, 5.8vw, 84px); line-height: .98; letter-spacing: -.07em; }
.hengdong-hero h1 span { color: #666d6f; }
.hengdong-hero-copy > p:not(.hengdong-kicker) { max-width: 600px; margin: 28px 0 0; color: #5f6564; font-size: 17px; line-height: 1.85; }
.hengdong-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.hengdong-button { min-width: 144px; padding: 15px 18px; border: 1px solid rgba(8,9,12,.2); text-align: center; font-size: 13px; font-weight: 700; transition: transform .18s ease, background .18s ease, color .18s ease; }
.hengdong-button.primary { background: var(--obsidian); color: var(--moon); }
.hengdong-button:hover { transform: translateY(-3px); }
.hero-platforms li { border-color: rgba(8,9,12,.13); color: #5c6261; }
.compass-stage { position: relative; display: grid; place-items: center; min-height: min(74svh, 720px); }
.compass-stage::after { content: ""; position: absolute; width: 78%; aspect-ratio: 1; border: 1px solid rgba(8,9,12,.09); border-radius: 50%; }
.compass-field { position: absolute; inset: 6%; background: repeating-conic-gradient(from 0deg, rgba(8,9,12,.1) 0deg .25deg, transparent .25deg 5deg); border-radius: 50%; mask: radial-gradient(circle, transparent 0 64%, #000 64.3% 65%, transparent 65.3%); }
.compass-stage img, .compass-stage svg { position: relative; z-index: 2; width: min(75%, 560px); height: auto; }
.compass-stage > p { position: absolute; right: 0; bottom: 7%; z-index: 3; margin: 0; color: #777d7b; font-size: 9px; font-weight: 800; letter-spacing: .18em; writing-mode: vertical-rl; }

.product-system, .product-principles, .project-contact { width: var(--content); margin: 0 auto; padding: 130px 0; }
.product-system header, .product-principles > h2 { max-width: 820px; }
.product-system h2, .product-principles h2, .project-contact h2 { margin: 20px 0 0; font-size: clamp(48px, 5.2vw, 76px); line-height: 1.02; letter-spacing: -.06em; }
.product-system h2 span, .product-principles h2 span { color: #6d7473; }
.product-system .section-number, .product-principles .section-number, .project-contact .section-number, .interface-story-copy .section-number { color: #7b817f; }
.system-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; padding: 0; margin: 82px 0 0; list-style: none; background: rgba(8,9,12,.14); border: 1px solid rgba(8,9,12,.14); }
.system-steps li { min-height: 310px; padding: 34px; background: #f5f2ec; }
.system-steps li > span { color: #898f8c; font: 800 10px/1 monospace; letter-spacing: .12em; }
.system-steps strong { display: block; margin-top: 94px; font-size: 25px; letter-spacing: -.04em; }
.system-steps p { margin: 16px 0 0; color: #686e6d; line-height: 1.8; }

.hengdong-interface-story { height: 172svh; --scene-reveal: 1; --scene-opacity: 1; --copy-y: 0px; --orbit-rotate: 0deg; --screen-one-y: 0px; --screen-two-y: 0px; --screen-three-y: 0px; }
.interface-story-stage { position: sticky; top: 0; min-height: 100svh; display: grid; grid-template-columns: .78fr 1.22fr; align-items: center; gap: 60px; overflow: hidden; padding: 92px max(32px, calc((100vw - 1240px) / 2)); background: var(--obsidian); color: var(--moon); }
.interface-story-stage::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 80% 50%, rgba(130,246,243,.11), transparent 30%); pointer-events: none; }
.interface-story-copy { position: relative; z-index: 3; opacity: var(--scene-opacity); transform: translateY(var(--copy-y)); }
.interface-story-copy h2 { margin: 20px 0 0; font-size: clamp(46px, 4.8vw, 70px); line-height: 1.03; letter-spacing: -.055em; }
.interface-story-copy h2 span { color: rgba(244,241,234,.42); }
.interface-story-copy > p:last-child { max-width: 520px; margin: 26px 0 0; color: rgba(244,241,234,.55); line-height: 1.85; }
.hengdong-detail-collage { position: relative; z-index: 2; min-height: min(78svh, 760px); perspective: 1300px; opacity: var(--scene-opacity); }
.detail-phone { position: absolute; margin: 0; overflow: hidden; box-shadow: 0 30px 70px rgba(0,0,0,.46); }
.detail-phone { width: clamp(180px, 18vw, 250px); aspect-ratio: 480 / 1043; border-radius: 28px; }
.detail-phone img { width: 100%; height: 100%; object-fit: cover; }
.phone-home { left: 0; top: 13%; transform: translateY(var(--screen-one-y)) rotate(-6deg); }
.phone-agent { left: 32%; top: 1%; z-index: 2; transform: translateY(var(--screen-two-y)); }
.phone-live { right: 0; top: 13%; transform: translateY(var(--screen-three-y)) rotate(6deg); }
.product-principles { padding-top: 160px; }
.principle-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; margin-top: 72px; }
.principle-grid article { padding: 30px 0; border-top: 1px solid rgba(8,9,12,.19); }
.principle-grid b { color: #858b89; font: 800 10px/1 monospace; }
.principle-grid h3 { margin: 52px 0 14px; font-size: 25px; letter-spacing: -.035em; }
.principle-grid p { margin: 0; color: #656b69; line-height: 1.8; }
.project-contact { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(40px, 8vw, 120px); align-items: end; }
.resource-links { display: grid; }
.resource-links a { display: flex; justify-content: space-between; gap: 22px; padding: 22px 0; border-top: 1px solid rgba(8,9,12,.18); font-weight: 700; }
.resource-links a:last-child { border-bottom: 1px solid rgba(8,9,12,.18); }
.resource-links a span:last-child { transition: transform .18s ease; }
.resource-links a:hover span:last-child { transform: translate(4px,-4px); }
.health-notice { width: var(--content); margin: 0 auto 110px; padding: 26px 30px; display: grid; grid-template-columns: 170px 1fr; gap: 28px; border: 1px solid rgba(8,9,12,.16); color: #626866; }
.health-notice strong { color: var(--obsidian); }
.health-notice p { margin: 0; line-height: 1.75; }
.hengdong-footer { background: var(--obsidian); color: var(--moon); }

/* Support and privacy */
.hengdong-legal { background: #f5f2ec; color: var(--obsidian); color-scheme: light; }
.hengdong-legal .site-header { position: sticky; top: 0; background: rgba(245,242,236,.84); color: var(--obsidian); border-bottom-color: rgba(8,9,12,.1); }
.hengdong-legal .nav-links a { color: #5e6462; }
.hengdong-legal .project-wordmark small { color: #747a78; }
.legal-main { width: var(--content); margin: 0 auto; padding: 78px 0 120px; display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(50px, 9vw, 150px); }
.legal-hero { position: sticky; top: 148px; align-self: start; }
.legal-hero .eyebrow { margin: 0 0 24px; color: #7d8381; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.legal-hero h1 { margin: 0; font-size: clamp(54px, 6vw, 86px); line-height: .98; letter-spacing: -.065em; }
.legal-hero .lead { max-width: 460px; margin: 28px 0 0; color: #656b69; font-size: 17px; line-height: 1.8; }
.legal-content { padding: 8px 0 0; }
.legal-content h2 { margin: 58px 0 18px; padding-top: 28px; border-top: 1px solid rgba(8,9,12,.16); font-size: 28px; letter-spacing: -.04em; }
.legal-content h2:first-child { margin-top: 0; }
.legal-content h3 { margin: 30px 0 10px; font-size: 18px; }
.legal-content p, .legal-content li { color: #5e6462; line-height: 1.9; }
.legal-content a { color: #1a5f64; text-decoration: underline; text-underline-offset: 3px; }
.legal-content ul { padding-left: 22px; }
.legal-notice { margin-top: 48px; padding: 24px 26px; border-left: 4px solid var(--hengdong-coral); background: rgba(255,255,255,.52); color: #555b59; line-height: 1.75; }
.hengdong-legal .site-footer { background: var(--obsidian); color: var(--moon); }

@media (max-width: 1050px) {
  :root { --content: min(100% - 40px, 920px); }
  .world-opening { grid-template-columns: 1fr; align-items: center; gap: 54px; padding-top: 132px; }
  .opening-copy { align-self: end; }
  .world-portals { grid-template-columns: 1fr 1fr; }
  .world-portal { grid-template-columns: 108px 1fr; min-height: 174px; padding: 20px; }
  .world-portal img, .world-portal svg { width: 100px; height: 100px; }
  .portal-xingyu img, .portal-xingyu svg { width: 88px; height: 88px; }
  .world-stage { grid-template-columns: .85fr 1.15fr; gap: 26px; }
  .screen { width: clamp(150px, 20vw, 215px); }
  .hengdong-hero { grid-template-columns: 1fr 1fr; gap: 24px; }
  .product-system, .product-principles, .project-contact { padding-block: 100px; }
  .interface-story-stage { grid-template-columns: .8fr 1.2fr; gap: 24px; }
}

@media (max-width: 760px) {
  :root { --content: calc(100vw - 36px); }
  .nav { min-height: 68px; }
  .personal-wordmark small, .project-wordmark small { display: none; }
  .nav-links { gap: 16px; }
  .nav-links a { font-size: 12px; }
  .portal-header .nav-links a:nth-child(2) { display: none; }
  .hengdong-header .nav-links a:not(.back-home-link):not([href="/support.html"]) { display: none; }
  .world-opening { min-height: 100svh; display: block; padding: 118px 18px 72px; }
  .opening-copy { padding-top: 20px; }
  .opening-copy h1 { font-size: clamp(48px, 14vw, 68px); }
  .opening-copy > p:last-child { font-size: 15px; }
  .world-portals { grid-template-columns: 1fr; margin-top: 46px; }
  .world-portal { min-height: 132px; grid-template-columns: 88px 1fr; gap: 18px; padding: 16px 20px; }
  .world-portal img, .world-portal svg, .portal-xingyu img, .portal-xingyu svg { width: 78px; height: 78px; }
  .world-portal strong { font-size: 30px; }
  .scroll-cue { display: none; }
  .world-chapter { height: auto; }
  .world-stage { position: relative; min-height: auto; display: flex; flex-direction: column; align-items: stretch; gap: 48px; padding: 94px 18px 82px; }
  .chapter-copy { opacity: 1; transform: none; }
  .chapter-copy h2 { font-size: clamp(43px, 12.5vw, 60px); }
  .chapter-copy > p:not(.chapter-number) { font-size: 15px; }
  .interface-collage { min-height: 520px; opacity: 1; }
  .screen { width: 43vw; max-width: 190px; border-radius: 22px; }
  .screen-one { left: 0; top: 13%; transform: rotate(-5deg); }
  .screen-two { left: 29%; top: 0; transform: none; }
  .screen-three { right: 0; top: 13%; transform: rotate(5deg); }
  .studio-note { min-height: auto; grid-template-columns: 1fr; gap: 42px; padding: 100px 0; }
  .studio-note h2 { font-size: clamp(42px, 12vw, 60px); }
  .footer-main { min-height: 190px; align-items: flex-start; flex-direction: column; justify-content: center; }
  .footer-links { justify-content: flex-start; }
  .icp-record { font-size: 12px; }
  .hengdong-hero { min-height: auto; grid-template-columns: 1fr; padding: 72px 18px 64px; }
  .hengdong-hero h1 { font-size: clamp(52px, 15vw, 72px); }
  .hengdong-hero-copy > p:not(.hengdong-kicker) { font-size: 15px; }
  .compass-stage { min-height: 430px; }
  .compass-stage img, .compass-stage svg { width: min(86%, 420px); }
  .product-system, .product-principles, .project-contact { width: calc(100vw - 36px); padding: 88px 0; }
  .product-system h2, .product-principles h2, .project-contact h2 { font-size: clamp(44px, 12vw, 60px); }
  .system-steps, .principle-grid { grid-template-columns: 1fr; }
  .system-steps li { min-height: 250px; }
  .system-steps strong { margin-top: 60px; }
  .hengdong-interface-story { height: auto; }
  .interface-story-stage { position: relative; min-height: auto; display: flex; flex-direction: column; align-items: stretch; gap: 54px; padding: 90px 18px 76px; }
  .interface-story-copy { opacity: 1; transform: none; }
  .interface-story-copy h2 { font-size: clamp(43px, 11.5vw, 58px); }
  .hengdong-detail-collage { min-height: 520px; opacity: 1; }
  .detail-phone { width: 43vw; max-width: 188px; border-radius: 22px; }
  .phone-home { transform: rotate(-5deg); }
  .phone-agent { left: 29%; transform: none; }
  .phone-live { transform: rotate(5deg); }
  .project-contact { grid-template-columns: 1fr; align-items: start; }
  .health-notice { width: calc(100vw - 36px); grid-template-columns: 1fr; margin-bottom: 78px; }
  .legal-main { width: calc(100vw - 36px); grid-template-columns: 1fr; gap: 50px; padding-top: 56px; }
  .legal-hero { position: static; }
  .legal-hero h1 { font-size: 54px; }
}

@media (max-width: 380px) {
  .portal-header .nav-links a:nth-child(1) { display: none; }
  .world-opening { padding-top: 104px; }
  .opening-copy h1 { font-size: 45px; }
  .world-portal { grid-template-columns: 76px 1fr; }
  .world-portal img, .world-portal svg, .portal-xingyu img, .portal-xingyu svg { width: 66px; height: 66px; }
  .screen, .detail-phone { width: 44vw; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .chapter-copy, .interface-collage, .interface-story-copy, .hengdong-detail-collage { opacity: 1; transform: none; }
  .screen-one, .phone-home { transform: rotate(-5deg); }
  .screen-two, .phone-agent { transform: none; }
  .screen-three, .phone-live { transform: rotate(5deg); }
}