.backdrop {
  background-image: url('https://yuan-si-wu-jie.oss-cn-shanghai.aliyuncs.com/image/topbot-oss-upload/site/db8049ea9820ae48cc33d81a1eecd3dc4a97e4cd.png');
}

html, body { background-color: #fff; }
.home-page { min-height: 100vh; overflow-x: hidden; background: #f7f4ec; }
.home-page .hero { height: 100vh; min-height: 100vh; }
.home-page .nav-shell { position: fixed; }

/* Shared Figma navigation: responsive glass capsule. */
.nav-shell {
  z-index: 100;
  top: 33px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 76px);
  max-width: 1844px;
  height: 61px;
  padding: 0 8px 0 24px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 70px;
  background: rgba(79,91,100,.34);
  box-shadow: inset 0 1px rgba(255,255,255,.12),0 12px 34px rgba(13,26,33,.1);
  -webkit-backdrop-filter: blur(22px) saturate(125%);
  backdrop-filter: blur(22px) saturate(125%);
  pointer-events: auto;
}
.nav-shell a, .nav-shell nav { position: relative; z-index: 1; pointer-events: auto; }
.nav-shell nav a {
  min-width: 78px;
  height: 47px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.64);
  background: transparent;
  border-radius: 70px;
  box-shadow: none;
}
.nav-shell nav a:hover { color: #fff; background: rgba(255,255,255,.08); }
body .nav-shell nav a.active,
body .nav-shell nav a.active:hover {
  color: #102846 !important;
  background: #c9dfff !important;
  box-shadow: none !important;
}
.nav-shell .login {
  min-width: 106px;
  height: 47px;
  padding: 0 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 70px !important;
  background: #dceafe !important;
  color: #0b1320 !important;
  font-weight: 600;
}
.home-page .hero .backdrop { background-image: url('https://yuan-si-wu-jie.oss-cn-shanghai.aliyuncs.com/image/topbot-oss-upload/site/16-9-1-db79e52c.png'); background-position: center; }
.home-page .hero::after { background: linear-gradient(180deg,rgba(16,12,10,.05),transparent 58%,rgba(15,10,7,.2)); }
.home-page .hero .hero-copy { bottom: clamp(54px,8.2vh,92px); width: min(1280px,62.5vw); max-width: none; }
.home-page .hero .eyebrow { display: block; margin-bottom: 16px; color: rgba(255,255,255,.88); font-size: clamp(14px,1vw,20px); font-weight: 500; }
.home-page .hero .eyebrow span { display: none; }
.home-page .hero .copy-grid { grid-template-columns: 1fr 1fr; gap: 74px; }
.home-page .hero h1 { font-size: clamp(42px,3.25vw,62px); font-weight: 650; line-height: 1.08; letter-spacing: -.045em; }
.home-page .hero .intro { max-width: 520px; padding-bottom: 8px; }
.home-page .hero .intro p { margin: 0; color: rgba(255,255,255,.72); font-size: clamp(15px,1.1vw,22px); line-height: 1.45; font-weight: 500; }
.nav-shell .brand { width: 98px; height: 24px; display: block; overflow: hidden; }
.nav-shell .brand img { width: 98px; height: 24px; display: block; object-fit: contain; filter: brightness(0) invert(1); opacity: .94; }
.mobile-menu-toggle { display: none; }
@media(max-width:760px){.nav-shell{top:14px;left:50%;transform:translateX(-50%);width:calc(100% - 28px);height:52px;padding:0 7px 0 14px;border-radius:70px}.nav-shell .brand,.nav-shell .brand img{width:98px;height:24px}.nav-shell nav a{min-width:68px;height:40px;padding:0 15px}.nav-shell .login{min-width:88px;height:40px;padding:0 14px;border-radius:70px}}
@media(max-width:760px){.home-page .hero .hero-copy{width:calc(100% - 40px);bottom:54px}.home-page .hero .copy-grid{gap:24px}.home-page .hero h1{font-size:clamp(44px,13vw,64px)}.home-page .hero .intro p{font-size:14px}.home-page .hero .backdrop{background-position:center}}

/* Home: brand origin */
.home-origin { min-height: 100vh; padding: clamp(100px,11vh,150px) 0 clamp(86px,10vh,130px); color: #090909; background: #f7f4ec; }
.home-origin-layout { width: calc(100% - 76px); max-width: 1844px; margin: 0 auto; display: grid; grid-template-columns: 25.5% 23.5% 1fr; grid-template-rows: auto auto; column-gap: 12px; row-gap: clamp(58px,6vw,94px); align-items: start; }
.home-origin-heading { grid-column: 1; padding-top: 2px; }
.home-origin-heading span { display: block; margin-bottom: 12px; color: #66635f; font-size: clamp(14px,.95vw,18px); font-weight: 600; }
.home-origin-heading h2 { margin: 0; font-size: clamp(34px,2.65vw,50px); line-height: 1.16; letter-spacing: -.035em; }
.home-origin figure { margin: 0; }
.home-origin-small { grid-column: 2; }
.home-origin-small img { width: 100%; aspect-ratio: 1.31; object-fit: cover; object-position: center 55%; display: block; border-radius: clamp(18px, 1.5vw, 28px); }
.home-origin-small figcaption { padding-top: 12px; color: #aaa49c; font-size: clamp(11px,.72vw,14px); }
.home-origin-large { grid-column: 3; }
.home-origin-large img { width: 100%; aspect-ratio: 1.38; object-fit: cover; display: block; border-radius: clamp(18px, 1.5vw, 28px); }
.home-origin-copy { padding-top: 20px; border-top: 0; color: #77736e; font-size: clamp(13px,.92vw,18px); font-weight: 500; line-height: 1.45; }
.home-origin-copy-left { grid-column: 1 / 3; }
.home-origin-copy-right { grid-column: 3; }
.home-origin-copy p { margin: 0; }
.home-origin-copy strong { color: #111; font-weight: 650; }
.home-more { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-width: 126px; height: 54px; margin-top: clamp(46px,6vh,76px); padding: 0 24px; background: #050505; color: #fff; text-decoration: none; font-size: 14px; font-weight: 600; }
.home-origin .home-more { border-radius: 999px; }
.home-more span { font-size: 20px; line-height: 1; }

/* Home: technical highlights */
.home-tech { position: relative; height: 1343px; padding: 0; background: #dbe0e2; }
.home-tech-image { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center 86%; }
.home-tech-panel { position: absolute; z-index: 1; left: clamp(24px,2vw,38px); right: clamp(24px,2vw,38px); bottom: clamp(32px,3.2vw,50px); min-height: clamp(210px,19vw,244px); padding: clamp(32px,2.8vw,48px) clamp(38px,4vw,76px); display: grid; grid-template-columns: 1fr 1fr; gap: 80px; background: #f8f5ef; border-radius: clamp(22px,1.8vw,32px); }
.home-tech-title { display: flex; min-height: 160px; flex-direction: column; justify-content: space-between; }
.home-tech-title h2 { margin: 0; color: #000; font-size: 24px; font-weight: 700; font-style: normal; }
.home-tech-title span { color: #77736e; font-size: 14px; }
.home-tech-copy p { margin: 0; color: #aaa49c; font-size: clamp(13px,.9vw,17px); line-height: 1.5; }
.home-tech-copy strong { color: #111; font-weight: 650; }
.home-tech-copy .home-more { margin-top: clamp(38px,4vh,58px); }
.home-tech .home-more { border-radius: 999px; }

/* Home: activity */
.home-activity { padding: clamp(90px,9vw,170px) 0 clamp(100px,10vw,180px); background: #f8f5ed; color: #090909; }
.home-activity-heading { width: calc(100% - 76px); margin: 0 auto clamp(70px,7vw,130px); }
.home-activity-heading h2 { margin: 0; font-size: clamp(82px,9.5vw,182px); line-height: .82; font-weight: 400; letter-spacing: -.065em; }
.home-activity-heading span { display: block; margin-top: 24px; font-size: 18px; font-weight: 600; }
.home-activity-list { border-top: 1px solid rgba(20,20,20,.12); }
.activity-item { min-height: 320px; display: grid; grid-template-columns: 53% 25% 22%; border-bottom: 1px solid rgba(20,20,20,.12); }
.activity-copy { position: relative; padding: 28px 38px 32px; border-right: 1px solid rgba(20,20,20,.12); }
.activity-copy h3 { margin: 0; font-size: clamp(18px,1.25vw,24px); line-height: 1.25; font-weight: 700; }
.activity-copy p { max-width: 700px; margin: 22px 0 0; color: #99958e; font-size: 14px; line-height: 1.55; }
.activity-copy a { position: absolute; left: 38px; bottom: 30px; color: #77736e; font-size: 13px; font-weight: 600; text-decoration: none; }
.activity-meta { padding: 24px 30px 28px; display: flex; flex-direction: column; justify-content: space-between; }
.activity-meta time span { display: block; color: #dedbd3; font-size: 32px; line-height: 1; font-weight: 500; }
.activity-meta time b { display: block; margin-top: 4px; font-size: 29px; line-height: .92; font-weight: 500; }
.activity-meta > div { display: flex; gap: 10px; flex-wrap: wrap; }
.activity-meta > div span { padding: 9px 14px; border-radius: 999px; background: rgba(255,255,255,.72); color: #99958e; font-size: 12px; }
.activity-item > img { align-self: center; justify-self: center; width: min(78%,270px); height: 220px; border-radius: 28px; object-fit: cover; }
.activity-more { width: 126px; height: 52px; margin: 72px auto 0; display: flex; align-items: center; justify-content: center; border-radius: 999px; background: #050505; color: #fff; font-size: 13px; font-weight: 600; text-decoration: none; }

@media(max-width:760px){
  .home-activity{padding:80px 0}.home-activity-heading{width:calc(100% - 40px);margin-bottom:60px}.home-activity-heading h2{font-size:23vw}.home-activity-heading span{margin-top:14px;font-size:15px}.activity-item{min-height:0;grid-template-columns:1fr;padding:20px}.activity-copy{padding:0 0 28px;border-right:0}.activity-copy h3{font-size:19px}.activity-copy h3 br{display:none}.activity-copy p{font-size:13px}.activity-copy a{position:static;display:inline-block;margin-top:28px}.activity-meta{padding:18px 0;flex-direction:row;align-items:flex-end}.activity-item>img{width:100%;height:58vw;border-radius:20px}.activity-more{margin-top:48px}
}

@media(max-width:900px){
  .home-origin-layout{width:calc(100% - 40px);grid-template-columns:1fr 1fr;row-gap:32px}.home-origin-heading{grid-column:1/-1}.home-origin-small{grid-column:1}.home-origin-large{grid-column:2}.home-origin-copy-left{grid-column:1}.home-origin-copy-right{grid-column:2}.home-origin-copy br{display:none}
  .home-tech{height:3360px;padding:0}.home-tech-panel{left:20px;right:20px;bottom:20px;grid-template-columns:1fr;gap:28px}.home-tech-title{min-height:auto;gap:24px}
}
@media(max-width:600px){
  .home-origin{padding:90px 0 70px}.home-origin-layout{grid-template-columns:1fr}.home-origin-heading,.home-origin-small,.home-origin-large,.home-origin-copy-left,.home-origin-copy-right{grid-column:1}.home-origin-large{grid-row:3}.home-origin-small img{aspect-ratio:1.25}.home-origin-large img{aspect-ratio:1.15}.home-origin-copy{padding-top:18px}.home-more{margin-top:34px}
  .home-tech{height:3360px;padding:0}.home-tech-panel{left:12px;right:12px;bottom:12px;padding:28px 22px}.home-tech-copy br{display:none}
}

.zero-scroll { height: 500vh; position: relative; background: #fff; }
.zero-sticky { position: sticky; top: 0; height: 100vh; overflow: hidden; }
.zero-canvas { position: relative; height: 100%; overflow: hidden; background: #fff; transition: background-color .25s linear; }
.lake-frame { position: absolute; left: 50%; top: 50%; width: 380px; height: 164px; transform: translate(-50%,-50%); border: 0; outline: 0; border-radius: 70px; overflow: hidden; background-image: url('https://yuan-si-wu-jie.oss-cn-shanghai.aliyuncs.com/image/topbot-oss-upload/site/dbc9357da74d9833fb4e384ce4863ca9f730b727.png'); background-position: center center; background-size: 100vw 100vh; background-repeat: no-repeat; box-shadow: none; will-change: width,height,border-radius,opacity,transform; }
.zero-copy { position: absolute; z-index: 2; color: #fff; opacity: 0; transform: translateY(24px); transition: opacity .25s linear,transform .25s ease; pointer-events: none; }
.zero-copy.visible { opacity: 1; transform: translateY(0); }
.zero-copy-left { left: 18.7vw; top: 42%; }.zero-copy-left h2 { margin: 0 0 24px; font-size: clamp(30px,3vw,52px); line-height: 1.16; letter-spacing: -.04em; }.zero-copy-left p,.zero-copy-right p { margin: 0; color: rgba(255,255,255,.62); font-size: clamp(14px,1.2vw,20px); line-height: 1.55; }
.zero-copy-right { right: 17vw; top: 48%; max-width: 550px; }.zero-copy-right .lead { margin-bottom: 28px; color: #fff; font-weight: 600; }
.robot-finale { position: absolute; inset: 0; z-index: 3; opacity: 0; transform: scale(1.04); background: linear-gradient(115deg,#163b66,#adc9f3); transition: opacity .35s linear,transform .6s ease; pointer-events: none; }
.robot-finale.visible { opacity: 1; transform: scale(1); }.robot-finale p { position: absolute; z-index: 2; width: 612px; height: 56px; top: 15.1vh; left: 50%; transform: translateX(-50%); margin: 0; text-align: center; color: #fff; font-size: 22px; line-height: 28px; font-weight: 500; }.robot-finale img { position: absolute; z-index: 2; top: 25.2vh; left: 50%; bottom: auto; width: min(970px,50.5vw); height: auto; transform: translateX(-50%); object-fit: contain; }.zero-word { position: absolute; z-index: 1; left: 0; top: 50%; width: 100%; transform: translateY(-50%); text-align: center; font-size: min(25vw,470px); font-weight: 300; color: rgba(255,255,255,.1); letter-spacing: -.08em; }
.progress-mark { position: absolute; z-index: 8; left: 50%; bottom: 22px; width: 52px; height: 2px; transform: translateX(-50%); background: rgba(255,255,255,.25); opacity: 0; }.progress-mark span { display: block; width: 0; height: 100%; background: #fff; }
@media(max-width:760px){.zero-copy-left{left:8vw;top:24%}.zero-copy-right{left:8vw;right:8vw;top:auto;bottom:10vh}.zero-copy-left p br,.zero-copy-right br{display:none}.robot-finale img{top:auto;left:50%;bottom:-20vh;width:auto;height:72vh;transform:translateX(-50%)}.robot-finale p{top:8vh;left:10vw;width:80vw;height:auto;transform:none;font-size:15px;line-height:22px}.lake-frame{width:240px;height:112px}.zero-scroll{height:430vh}}

.duality-scroll { position: relative; height: 260vh; background: #d9d8d4; }
.duality-sticky { position: sticky; top: 0; height: 100vh; overflow: hidden; background: #d9d8d4; }
.duality-state { position: absolute; inset: 0; display: grid; grid-template-columns: 1fr 1fr; opacity: 0; transform: translate3d(0,0,0); transition: none; will-change: clip-path; pointer-events: none; }
.duality-state.is-active { opacity: 1; transform: translateY(0); }
.duality-state.is-leaving { opacity: 0; transform: translateY(-7vh); }
.duality-image { height: 100%; min-width: 0; margin: 0; overflow: hidden; background: #c9c8c5; }
.duality-image img { width: 100%; height: 100%; display: block; object-fit: cover; transform: scale(1.045); transition: transform 1.1s cubic-bezier(.2,.75,.2,1); }
.duality-state.is-active .duality-image img { transform: scale(1); }
.duality-copy { position: relative; display: flex; flex-direction: column; justify-content: center; padding: 10vw; }
.warm-copy { background: #d7c8b7; color: #302923; }.mono-copy { background: #111315; color: #f1f2f2; }
.duality-index { position: absolute; top: 64px; left: 10vw; font-size: 12px; letter-spacing: .15em; opacity: .5; }
.duality-copy h2 { margin: 0 0 36px; font-size: clamp(44px,4.2vw,76px); line-height: 1.08; font-weight: 500; letter-spacing: -.055em; }
.duality-copy p { width: min(480px,100%); margin: 0; font-size: clamp(15px,1.05vw,19px); line-height: 1.8; opacity: .68; }
.duality-progress { position: absolute; z-index: 5; left: 50%; bottom: 34px; width: 88px; height: 2px; transform: translateX(-50%); background: rgba(255,255,255,.3); mix-blend-mode: difference; }
.duality-progress i { display: block; width: 0; height: 100%; background: #fff; }
@media(max-width:760px){.duality-scroll{height:220vh}.duality-state{grid-template-columns:1fr;grid-template-rows:54% 46%}.duality-state-b .duality-copy{grid-row:2}.duality-state-b .duality-image{grid-row:1}.duality-copy{padding:9vw}.duality-index{top:24px;left:9vw}.duality-copy h2{margin-bottom:16px;font-size:34px}.duality-copy p{font-size:13px;line-height:1.6}}

/* Third screen — Figma matched cards */
.duality-scroll,.duality-sticky { background: #fff; }
.duality-state { inset: 16px; gap: 12px; }
.duality-image,.duality-copy { border-radius: 24px; overflow: hidden; }
.duality-image { position: relative; background: #d3dae0; }
.duality-image img { object-position: center; }
.duality-image figcaption { position: absolute; z-index: 2; left: 46px; bottom: 72px; color: rgba(255,255,255,.9); font-size: 16px; font-weight: 500; }
.duality-state-b .duality-image figcaption { left: auto; right: 46px; }
.navy-copy { display: block; padding: 0; background: #061b32; color: #fff; }
.duality-copy-main { position: absolute; left: 54px; top: 44%; transform: translateY(-50%); }
.duality-kicker { display: block; margin-bottom: 16px; color: rgba(255,255,255,.42); font-size: 20px; line-height: 1.3; }
.duality-copy h2 { margin: 0 0 22px; font-size: clamp(42px,3vw,58px); line-height: 1.16; font-weight: 600; letter-spacing: -.045em; }
.duality-copy-main p { width: auto; margin: 0; color: rgba(255,255,255,.55); font-size: clamp(17px,1.25vw,23px); line-height: 1.45; opacity: 1; }
.duality-copy small { position: absolute; left: 54px; bottom: 72px; color: rgba(255,255,255,.34); font-size: 15px; }
.duality-copy-top { position: absolute; left: 54px; top: 76px; right: 42px; }
.duality-copy-top .duality-kicker { margin-bottom: 22px; font-size: 15px; }
.duality-copy .duality-statement { width: auto; margin: 0; color: rgba(255,255,255,.95); font-size: clamp(23px,1.7vw,33px); line-height: 1.38; font-weight: 500; opacity: 1; }
.duality-statement em { color: rgba(255,255,255,.18); font-style: normal; }
.duality-progress { display: none; }
@media(max-width:760px){.duality-state{inset:8px;gap:8px}.duality-image,.duality-copy{border-radius:16px}.duality-copy-main{left:24px;right:20px;top:48%}.duality-kicker{font-size:13px;margin-bottom:8px}.duality-copy h2{font-size:28px;margin-bottom:10px}.duality-copy-main p{font-size:12px;line-height:1.45}.duality-copy-main br,.duality-statement br{display:none}.duality-copy small{left:24px;bottom:22px;font-size:10px}.duality-copy-top{left:24px;right:20px;top:28px}.duality-copy-top .duality-kicker{font-size:10px;margin-bottom:12px}.duality-copy .duality-statement{font-size:17px;line-height:1.42}.duality-image figcaption{left:24px;bottom:22px;font-size:11px}.duality-state-b .duality-image figcaption{right:24px}}

/* Fourth screen — white space */
.blank-scroll { position: relative; height: 360vh; background: #fff; }
.blank-sticky { position: sticky; top: 0; height: 100vh; overflow: hidden; background: #fff; }
.blank-intro { position: absolute; z-index: 2; top: 15.8vh; left: 50%; width: min(900px,90vw); transform: translateX(-50%); text-align: center; color: #090b0d; transition: opacity .35s ease, transform .45s ease; }
.blank-intro.is-hidden { opacity: 0; transform: translate(-50%,-24px); }
.blank-intro span { display: block; margin-bottom: 14px; font-size: 20px; line-height: 20px; font-weight: 500; letter-spacing: 0; text-align: center; }
.blank-intro h2 { margin: 0 0 20px; font-size: 48px; line-height: 1; font-weight: 700; letter-spacing: 0; text-align: center; }
.blank-intro p { margin: 0; color: #666; font-size: 22px; line-height: 28px; font-weight: 500; letter-spacing: 0; text-align: center; }
.blank-visual { position: absolute; z-index: 1; left: 50%; top: 35.8vh; width: min(1200px,62.5vw); aspect-ratio: 1200/668; margin: 0; transform: translateX(-50%); overflow: hidden; border-radius: 20px; background: #13273c; will-change: width,height,top,left,border-radius,transform; }
.blank-visual img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
.blank-overlay { position: absolute; z-index: 3; top: 42%; left: 59%; width: 500px; margin: 0; opacity: 0; transform: translateY(20px); color: #fff; font-size: 22px; line-height: 28px; font-weight: 500; letter-spacing: 0; text-align: left; transition: opacity .4s ease,transform .5s ease; }
.blank-overlay.is-visible { opacity: 1; transform: translateY(0); }.blank-overlay strong,.blank-overlay span { display: inline; font: inherit; }.blank-overlay span { color: rgba(255,255,255,.2); }
@media(max-width:760px){.blank-scroll{height:300vh}.blank-intro{top:12vh;width:88vw}.blank-intro span{font-size:15px;line-height:18px}.blank-intro h2{font-size:30px;line-height:1.08}.blank-intro p{font-size:14px;line-height:20px}.blank-intro p br{display:none}.blank-visual{top:38vh;width:88vw}.blank-overlay{top:55%;left:8vw;width:84vw;font-size:16px;line-height:22px}.blank-overlay br{display:none}}

/* Fifth screen — horizontal aesthetics reel */
.aesthetics-scroll { position: relative; height: 360vh; background: #fff; color: #090b0d; }
.aesthetics-sticky { position: sticky; top: 0; height: 100vh; overflow: hidden; background: #fff; }
.aesthetics-track { position: absolute; z-index: 1; left: 0; top: 49%; display: flex; gap: 10px; width: max-content; transform: translate3d(62vw,-50%,0); will-change: transform; }
.aesthetics-track figure { width: 390px; height: 274px; margin: 0; overflow: hidden; border-radius: 8px; background: #d6dce1; flex: none; }
.aesthetics-track figure.wide { width: 440px; }.aesthetics-track img { width: 100%; height: 100%; display: block; object-fit: cover; }
.aesthetics-heading { position: absolute; z-index: 3; top: 18%; left: 18.7%; width: 520px; opacity: 0; transform: translateY(20px); transition: opacity .35s ease,transform .45s ease; }
.aesthetics-heading.is-visible { opacity: 1; transform: translateY(0); }
.aesthetics-heading span { display: block; margin-bottom: 12px; font-size: 16px; line-height: 1; font-weight: 600; }
.aesthetics-heading h2 { margin: 0 0 24px; font-size: 42px; line-height: 1.1; font-weight: 700; letter-spacing: -.04em; }
.aesthetics-heading p { margin: 0; color: #666; font-size: 17px; line-height: 1.45; font-weight: 500; }
.aesthetics-conclusion { position: absolute; z-index: 3; left: 50%; top: 72%; width: 600px; margin: 0; transform: translate(-50%,22px); opacity: 0; color: #666; font-size: 17px; line-height: 1.45; font-weight: 500; text-align: center; transition: opacity .35s ease,transform .45s ease; }
.aesthetics-conclusion.is-visible { opacity: 1; transform: translate(-50%,0); }
@media(max-width:760px){.aesthetics-scroll{height:300vh}.aesthetics-track{top:52%;gap:8px}.aesthetics-track figure,.aesthetics-track figure.wide{width:78vw;height:52vw}.aesthetics-heading{top:12%;left:8vw;width:84vw}.aesthetics-heading h2{font-size:32px}.aesthetics-heading p{font-size:13px}.aesthetics-heading p br,.aesthetics-conclusion br{display:none}.aesthetics-conclusion{top:76%;width:84vw;font-size:14px}}

/* Concave carousel geometry */
.aesthetics-track { top: 67%; gap: 12px; transition: top .18s linear; }
.aesthetics-track figure { width: 520px; height: 352px; border-radius: 10px; transform-origin: center center; }
.aesthetics-track figure.wide { width: 620px; }
.aesthetics-track figure:nth-child(1),.aesthetics-track figure:nth-child(5) { height: 370px; transform: translateY(-8px) rotate(.35deg); }
.aesthetics-track figure:nth-child(2),.aesthetics-track figure:nth-child(4) { height: 360px; transform: translateY(1px); }
.aesthetics-track figure:nth-child(3) { width: 520px; height: 330px; transform: translateY(16px) rotate(-.2deg); }
@media(max-width:760px){.aesthetics-track{top:66%}.aesthetics-track figure,.aesthetics-track figure.wide{width:82vw;height:54vw}.aesthetics-track figure:nth-child(1),.aesthetics-track figure:nth-child(5){height:57vw}.aesthetics-track figure:nth-child(2),.aesthetics-track figure:nth-child(4){height:55vw}.aesthetics-track figure:nth-child(3){width:78vw;height:50vw;transform:translateY(10px)}}

/* The concave shape follows the viewport center */
.aesthetics-track { top: 50%; transition: none; }
.aesthetics-track figure,.aesthetics-track figure.wide,.aesthetics-track figure:nth-child(1),.aesthetics-track figure:nth-child(2),.aesthetics-track figure:nth-child(3),.aesthetics-track figure:nth-child(4),.aesthetics-track figure:nth-child(5) { width: 560px; height: 360px; transform: scale(.84); transform-origin: center center; transition: none; }
.aesthetics-heading { top: 12%; }
@media(max-width:760px){.aesthetics-track{top:50%}.aesthetics-track figure,.aesthetics-track figure.wide,.aesthetics-track figure:nth-child(1),.aesthetics-track figure:nth-child(2),.aesthetics-track figure:nth-child(3),.aesthetics-track figure:nth-child(4),.aesthetics-track figure:nth-child(5){width:82vw;height:54vw}.aesthetics-heading{top:8%}}

/* A continuous arc clips every card instead of scaling whole rectangles */
.aesthetics-track figure,.aesthetics-track figure.wide,.aesthetics-track figure:nth-child(1),.aesthetics-track figure:nth-child(2),.aesthetics-track figure:nth-child(3),.aesthetics-track figure:nth-child(4),.aesthetics-track figure:nth-child(5) { transform: none; clip-path: polygon(0 0,100% 0,100% 100%,0 100%); will-change: clip-path; }

/* Sixth screen — minimalism window */
.minimal-scroll { position: relative; height: 420vh; background: #fff; color: #090b0d; }
.minimal-sticky { position: sticky; top: 0; height: 100vh; overflow: hidden; background: #fff; }
.minimal-intro { position: absolute; z-index: 2; top: 14.5vh; left: 50%; width: min(1200px,82vw); display: grid; grid-template-columns: 1fr 1fr; gap: 90px; transform: translateX(-50%); transition: opacity .35s ease,transform .5s ease; }
.minimal-intro.is-hidden { opacity: 0; transform: translate(-50%,-26px); }
.minimal-intro span { display: block; margin-bottom: 12px; font-size: 16px; line-height: 1; font-weight: 600; }
.minimal-intro h2 { margin: 0; font-size: clamp(36px,3vw,50px); line-height: 1.08; font-weight: 700; letter-spacing: -.045em; }
.minimal-intro p { align-self: center; margin: 0; color: #62676d; font-size: clamp(15px,1.05vw,18px); line-height: 1.55; font-weight: 500; }
.minimal-frame { position: absolute; z-index: 1; left: 50%; top: 35.5vh; width: min(1200px,62.5vw); aspect-ratio: 1200/668; margin: 0; transform: translateX(-50%); overflow: hidden; box-sizing: border-box; border: 16px solid #fff; border-radius: 22px; background: #cdd5dc; will-change: width,height,top,border-radius; }
.minimal-image { position: absolute; inset: 0; width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; transition: none; will-change: clip-path; }
.minimal-image-b { opacity: 0; }.minimal-image-b.is-visible { opacity: 1; }
.minimal-caption { position: absolute; z-index: 2; left: 50%; top: 50%; width: 80%; margin: 0; transform: translate(-50%,-35%); opacity: 0; color: #fff; font-size: clamp(16px,1.25vw,22px); line-height: 1.4; font-weight: 600; text-align: center; transition: opacity .35s ease,transform .45s ease; will-change: clip-path; }
.minimal-caption.is-visible { opacity: 1; transform: translate(-50%,-50%); }
@media(max-width:760px){.minimal-scroll{height:360vh}.minimal-intro{top:10vh;width:84vw;display:block}.minimal-intro h2{font-size:31px}.minimal-intro p{margin-top:22px;font-size:13px;line-height:1.55}.minimal-intro p br{display:none}.minimal-frame{top:41vh;width:92vw;border-width:9px;border-radius:15px}.minimal-caption{font-size:15px}}

/* Seventh screen — capability vision */
.capability-section { min-height: 165vh; box-sizing: border-box; padding: 132px 1.9vw 112px; border-radius: 18px; background: #F2F6F9; color: #090b0d; }
.capability-heading { width: min(1200px,62.5vw); margin: 0 auto 92px; }
.capability-heading h2 { margin: 0 0 22px; font-size: clamp(38px,3vw,54px); line-height: 1; font-weight: 700; letter-spacing: -.045em; }
.capability-heading p { margin: 0; color: #5f6469; font-size: clamp(16px,1.2vw,22px); line-height: 1.38; font-weight: 500; }
.capability-hero { width: 100%; height: clamp(500px,46vw,810px); margin: 0 0 16px; overflow: hidden; border-radius: 20px; background: #18344d; }
.capability-hero img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
.capability-grid { display: grid; grid-template-columns: 1fr 2fr; grid-template-rows: repeat(2,minmax(330px,1fr)); gap: 16px; }
.capability-card { display: grid; grid-template-rows: minmax(0,1fr) 142px; min-width: 0; overflow: hidden; border-radius: 20px; background: #fff; }
.capability-card-tall { grid-row: 1/3; }
.capability-card:not(.capability-card-tall) { grid-template-columns: 1fr 1fr; grid-template-rows: none; }
.capability-card img { width: 100%; height: 100%; display: block; object-fit: cover; }
.capability-card-tall img { object-position: center; }
.capability-card div { box-sizing: border-box; padding: 24px 28px; background: #fff; }
.capability-card h3 { margin: 0 0 12px; font-size: clamp(20px,1.45vw,28px); line-height: 1.1; font-weight: 700; }
.capability-card p { margin: 0; color: #5f6469; font-size: clamp(13px,.9vw,17px); line-height: 1.35; font-weight: 500; }
@media(min-width:1000px){.capability-card:not(.capability-card-tall):nth-child(2),.capability-card:not(.capability-card-tall):nth-child(3),.capability-card:not(.capability-card-tall):nth-child(4),.capability-card:not(.capability-card-tall):nth-child(5){grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 142px}.capability-grid{grid-template-columns:1fr 1fr 1fr}.capability-card-tall{grid-column:1;grid-row:1/3}.capability-card:nth-child(2){grid-column:2;grid-row:1}.capability-card:nth-child(3){grid-column:3;grid-row:1}.capability-card:nth-child(4){grid-column:2;grid-row:2}.capability-card:nth-child(5){grid-column:3;grid-row:2}}
@media(max-width:760px){.capability-section{min-height:auto;padding:80px 12px 64px;border-radius:12px}.capability-heading{width:88vw;margin-bottom:48px}.capability-heading h2{font-size:34px}.capability-heading p{font-size:14px}.capability-heading p br,.capability-card p br{display:none}.capability-hero{height:54vw;border-radius:14px;margin-bottom:10px}.capability-grid{display:block}.capability-card,.capability-card:not(.capability-card-tall){display:grid;grid-template-columns:1fr;grid-template-rows:52vw auto;margin-bottom:10px;border-radius:14px}.capability-card div{padding:20px}.capability-card h3{font-size:20px}.capability-card p{font-size:13px}}

/* Footer */
.site-footer { position: relative; height: min(1120px,92vw); min-height: 760px; overflow: hidden; box-sizing: border-box; padding: 58px 2.1vw 32px; background: #0f1217; color: #f5f7fa; }
.footer-top { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(220px,1fr) auto 60px; align-items: start; gap: 72px; }
.footer-logo { display: block; width: 168px; height: 29px; overflow: hidden; }
.footer-logo img { width: 100%; height: auto; display: block; filter: brightness(0) invert(1); }
.footer-nav { display: grid; grid-template-columns: repeat(5,minmax(100px,1fr)); align-items: start; gap: clamp(42px,5vw,90px); }
.footer-nav div { display: flex; flex-direction: column; align-items: flex-start; }
.footer-nav h3 { margin: 0 0 22px; font-size: 17px; line-height: 1; font-weight: 700; white-space: nowrap; }
.footer-nav a,.footer-return { padding: 0; margin: 0 0 10px; color: rgba(255,255,255,.30); background: none; border-radius: 0; font-size: 15px; line-height: 1.25; white-space: nowrap; }
.footer-nav a:hover,.footer-return:hover { color: #fff; background: none; }
.footer-nav .footer-news { text-decoration: none; }
.footer-return { justify-self: end; }
.footer-signup { position: absolute; z-index: 3; left: 2.1vw; bottom: 36.4%; width: 560px; height: 72px; display: flex; padding: 7px; box-sizing: border-box; border-radius: 999px; background: #1b1e24; }
.footer-signup input { min-width: 0; flex: 1; padding: 0 18px; border: 0; outline: 0; background: transparent; color: #fff; font: inherit; }
.footer-signup input::placeholder { color: rgba(255,255,255,.23); }
.footer-signup button { width: 110px; border: 0; border-radius: 999px; background: #e2edfd; color: #101419; font-size: 15px; font-weight: 600; cursor: pointer; }
.footer-socials { position: absolute; z-index: 3; right: 2.1vw; bottom: 36.4%; display: flex; gap: 12px; }
.footer-socials button { width: 150px; height: 72px; padding: 0 20px; display: flex; align-items: center; justify-content: center; gap: 12px; box-sizing: border-box; border: 0; border-radius: 999px; background: #1b1e24; color: rgba(255,255,255,.28); font: inherit; font-size: 15px; cursor: pointer; }
.footer-socials button:hover { color: #fff; background: #22262d; }
.footer-socials button.active { color: #0c2b55; background: #e2edfd; }
.footer-social-qr { position: absolute; bottom: calc(100% + 34px); width: 220px; height: 220px; padding: 12px; box-sizing: border-box; border-radius: 24px; background: #fff; opacity: 0; visibility: hidden; transform: translateX(-50%) translateY(12px); transition: opacity .35s ease,transform .35s ease,visibility .35s; }
.footer-social-qr.show { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.footer-social-qr img { width: 100%; height: 100%; display: block; object-fit: contain; border-radius: 12px; }
.social-icon { width: 28px; height: 28px; flex: 0 0 28px; display: block; color: currentColor; }
.social-icon svg { width: 100%; height: 100%; display: block; overflow: visible; fill: currentColor; }
.social-icon text { fill: #1b1e24; font-size: 5.5px; font-weight: 800; font-family: Arial,"PingFang SC","Microsoft YaHei",sans-serif; }
.social-xhs { width: 30px; flex-basis: 30px; }
.footer-socials button.active .social-xhs text { fill: #e2edfd; }
.footer-giant-logo { position: absolute; z-index: 1; left: 50%; bottom: -23%; width: 96%; height: auto; display: block; transform: translateX(-50%); filter: brightness(0) invert(1); clip-path: inset(0 0 29% 0); opacity: .022; }
.footer-bottom { position: absolute; z-index: 3; left: 2.1vw; right: 2.1vw; bottom: 28px; display: flex; justify-content: space-between; color: rgba(255,255,255,.24); font-size: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media(max-width:900px){.site-footer{height:auto;min-height:1080px;padding:54px 24px 30px}.footer-top{display:block}.footer-logo{width:140px;margin-bottom:52px}.footer-nav{grid-template-columns:repeat(2,1fr);gap:34px 28px}.footer-return{position:absolute;top:0;right:0}.footer-nav h3{margin-bottom:14px}.footer-nav a{font-size:13px}.footer-signup{left:24px;right:24px;bottom:245px;width:auto;height:58px}.footer-socials{left:24px;right:24px;bottom:150px;display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.footer-socials button{width:100%;height:48px;padding:0 10px;font-size:12px}.footer-social-qr{bottom:calc(100% + 18px);width:170px;height:170px;border-radius:18px}.social-icon{width:22px;height:22px;flex-basis:22px}.footer-giant-logo{bottom:66px;width:120%;opacity:.022}.footer-bottom{left:24px;right:24px;bottom:22px}}

/* Home H5 — the same content is re-composed for the narrow viewport. */
@media (max-width: 760px) {
  .home-page { background: #f8f5ed; }
  .home-page .nav-shell { position: fixed; top: 15px; width: calc(100% - 30px); height: 58px; padding: 0 9px 0 18px; align-items: start; background: rgba(91,86,83,.50); overflow: hidden; transition: height .38s ease,background-color .3s ease,border-radius .3s ease; }
  .home-page .nav-shell .brand,.home-page .nav-shell .brand img { width: 112px; height: 28px; }
  .home-page .nav-shell .brand { position: absolute; top: 17px; left: 18px; }
  .home-page .nav-shell nav { position: absolute; top: 160px; right: 15px; left: 15px; display: grid; gap: 6px; padding: 0; background: transparent; opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .25s ease,transform .3s ease,visibility .25s; }
  .home-page .nav-shell nav a { position: relative; width: 100%; min-width: 0; height: 39px; padding: 0 15px; justify-content: flex-start; color: #fff; background: rgba(255,255,255,.14) !important; border-radius: 999px; font-size: 12px; font-weight: 600; }
  .home-page .nav-shell nav a::after,.home-page .nav-shell .login::after { content: "›"; position: absolute; right: 15px; color: rgba(255,255,255,.72); font-size: 19px; line-height: 1; font-weight: 300; }
  .home-page .nav-shell nav a:nth-child(5) { display: flex; }
  .home-page .nav-shell.mobile-menu-open { height: 462px; border-radius: 30px; background: rgba(92,86,82,.70); -webkit-backdrop-filter: blur(24px) saturate(110%); backdrop-filter: blur(24px) saturate(110%); }
  .home-page .nav-shell.mobile-menu-open nav { opacity: 1; visibility: visible; transform: translateY(0); }
  .home-page .nav-shell .login { position: absolute; right: auto; bottom: 17px; left: 15px; width: calc(100% - 30px); max-width: none; min-width: 0; height: 39px; padding: 0 15px; box-sizing: border-box; display: none; justify-self: auto; justify-content: flex-start; border-radius: 999px !important; font-size: 12px; }
  .home-page .nav-shell.mobile-menu-open .login { display: flex; }
  .home-page .nav-shell .login::after { color: rgba(15,43,76,.58); }
  .home-page .mobile-menu-toggle { position: absolute; top: 7px; right: 7px; width: 52px; height: 44px; padding: 0; display: grid; place-content: center; gap: 5px; border: 0; border-radius: 999px; background: rgba(255,255,255,.12); }
  .home-page .mobile-menu-toggle i { width: 19px; height: 2px; display: block; border-radius: 2px; background: #fff; transition: .2s ease; }
  .home-page .mobile-menu-open .mobile-menu-toggle i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .home-page .mobile-menu-open .mobile-menu-toggle i:nth-child(2) { opacity: 0; }
  .home-page .mobile-menu-open .mobile-menu-toggle i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .home-page .hero { height: 210vw; min-height: 760px; max-height: 1120px; }
  .home-page .hero .backdrop { background-position: 51% center; }
  .home-page .hero .hero-copy { right: 20px; bottom: 8.2%; left: 20px; width: auto; transform: none; text-align: center; }
  .home-page .hero .eyebrow { margin-bottom: 14px; font-size: 14px; }
  .home-page .hero .copy-grid { display: block; }
  .home-page .hero h1 { font-size: clamp(40px,10.5vw,58px); line-height: 1.06; letter-spacing: -.035em; }
  .home-page .hero h1 br { display: none; }
  .home-page .hero .intro,.home-page .hero .scroll-cue { display: none; }

  .home-origin { min-height: 0; padding: 86px 24px 110px; }
  .home-origin-layout { width: 100%; display: flex; flex-direction: column; gap: 0; }
  .home-origin-heading { order: 1; padding: 0 14px; }
  .home-origin-heading span { margin-bottom: 15px; font-size: 15px; text-decoration: none; }
  .home-origin-heading h2 { font-size: clamp(36px,9vw,50px); line-height: 1.12; }
  .home-origin-large { order: 2; margin-top: 50px !important; }
  .home-origin-large img { height: 103vw; max-height: 700px; aspect-ratio: auto; border-radius: 20px; object-fit: cover; object-position: 46% center; }
  .home-origin-copy-right { order: 3; padding: 42px 14px 0; color: #aaa7a1; font-size: 17px; line-height: 1.5; }
  .home-origin-copy-right strong { color: #080808; }
  .home-origin-copy-right .home-more { width: 120px; height: 50px; margin-top: 38px; padding: 0 18px; }
  .home-origin-small { order: 4; width: 55%; margin: 120px auto 0 !important; }
  .home-origin-small img { width: 100%; aspect-ratio: .88; border-radius: 20px; object-position: center; }
  .home-origin-small figcaption { display: none; }
  .home-origin-copy-left { order: 5; width: 55%; margin: 25px auto 0; padding: 0; color: #8f8c87; font-size: 16px; line-height: 1.45; }
  .home-origin-copy-left br { display: none; }

  .home-tech { height: 1572px; min-height: 1572px; max-height: none; overflow: hidden; }
  .home-tech-image { position: absolute; top: -35%; left: -17.5%; width: 135%; height: 135%; object-fit: cover; object-position: center; }
  .home-tech::before { content: "技术亮点"; position: absolute; z-index: 2; top: 6.5%; left: 30px; color: #fff; font-size: 36px; line-height: 1; font-weight: 700; text-decoration: none; }
  .home-tech-panel { right: 13px; bottom: 4.7%; left: 13px; min-height: 295px; padding: 34px 20px 25px; display: block; border-radius: 28px; }
  .home-tech-title h2 { display: none; }
  .home-tech-title { display: block; min-height: 0; }
  .home-tech-title span { position: absolute; right: 24px; bottom: 32px; font-size: 11px; }
  .home-tech-copy p { color: #aaa7a1; font-size: 17px; line-height: 1.45; }
  .home-tech-copy strong { color: #090909; }
  .home-tech-copy .home-more { position: absolute; left: 20px; bottom: 25px; width: 120px; height: 50px; margin: 0; }

  .home-activity { padding: 100px 13px 110px; }
  .home-activity-heading { width: auto; margin: 0 18px 70px; }
  .home-activity-heading h2 { width: max-content; font-size: 25vw; line-height: .8; text-decoration: none; }
  .home-activity-heading span { margin-top: 24px; font-size: 25px; font-weight: 500; }
  .home-activity-list { border: 0; }
  .activity-item { min-height: 122vw; margin-bottom: 18px; padding: 0; display: flex; flex-direction: column; overflow: hidden; border: 0; border-radius: 24px; background: #efede6; }
  .activity-item > img { order: 1; width: 100%; height: 59vw; max-height: 500px; border-radius: 24px 24px 0 0; object-fit: cover; }
  .activity-copy { order: 2; padding: clamp(24px,4.5vw,32px) 20px 0; }
  .activity-copy h3 { font-size: clamp(15px,3.7vw,21px); line-height: 1.35; font-weight: 500; }
  .activity-copy p { margin-top: 16px; color: #8f8c87; font-size: clamp(13px,2.8vw,16px); line-height: 1.5; font-weight: 500; }
  .activity-copy a { display: none; }
  .activity-meta { order: 3; margin-top: auto; padding: 0 20px 24px; display: flex; flex-direction: row; justify-content: flex-start; gap: 8px; }
  .activity-meta > div { display: contents; }
  .activity-meta > div span { padding: 9px 16px; background: #fffdf7; font-size: clamp(11px,2.2vw,13px); }
  .activity-meta > div span:nth-child(2) { display: none; }
  .activity-meta time { order: 2; padding: 9px 16px; border-radius: 999px; background: #fffdf7; color: #8f8c87; font-size: clamp(11px,2.2vw,13px); }
  .activity-meta time span,.activity-meta time b { display: none; }
  .activity-meta time::after { content: attr(data-display); }
  .activity-more { margin-top: 44px; }

  .site-footer { min-height: 1120px; padding: 54px 29px 24px; }
  .site-footer .footer-top { display: block; }
  .site-footer .footer-logo { width: max-content; height: auto; margin-bottom: 82px; overflow: visible; color: #fff; font-size: 22px; line-height: 1; font-weight: 600; letter-spacing: .32em; }
  .site-footer .footer-logo img { display: none; }
  .site-footer .footer-logo::after { content: "元思无界"; }
  .site-footer .footer-nav { display: block; }
  .site-footer .footer-nav > div { width: 100%; padding: 0; display: block; border-top: 1px solid rgba(255,255,255,.08); }
  .site-footer .footer-nav > div:last-child { border-bottom: 1px solid rgba(255,255,255,.08); }
  .site-footer .footer-nav h3 { position: relative; width: 100%; height: 52px; margin: 0; display: flex; align-items: center; color: rgba(255,255,255,.48); font-size: 16px; cursor: pointer; }
  .site-footer .footer-nav h3::after { content: ""; position: absolute; right: 2px; width: 9px; height: 9px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: .2s ease; }
  .site-footer .footer-nav > div.open h3 { color: #fff; }
  .site-footer .footer-nav > div.open h3::after { transform: rotate(225deg) translate(-3px,-3px); }
  .site-footer .footer-nav a { display: none; margin: 0 0 12px; color: rgba(255,255,255,.46); font-size: 14px; }
  .site-footer .footer-nav > div.open a { display: block; }
  .site-footer .footer-return { display: none; }
  .site-footer .footer-signup { top: 605px; right: 29px; bottom: auto; left: 29px; height: 55px; }
  .site-footer .footer-socials { top: 830px; right: 29px; bottom: auto; left: 29px; display: grid; grid-template-columns: repeat(4,1fr); gap: 6px; }
  .site-footer .footer-socials button { height: 54px; padding: 0 5px; gap: 5px; font-size: 11px; }
  .site-footer .footer-giant-logo { bottom: 22px; width: calc(100% - 58px); clip-path: inset(0 0 31% 0); }
  .site-footer .footer-bottom { right: 29px; bottom: 22px; left: 29px; font-size: 10px; }
}