/* =========================================================
   SILKREELS · AI 影像委托承制
   ========================================================= */

:root{
  --ink:        #05060a;
  --ink-2:      #090b12;
  --ink-3:      #0e111b;
  --line:       rgba(216,177,113,.16);
  --line-soft:  rgba(255,255,255,.08);

  --gold:       #d8b171;
  --gold-2:     #f6e4bd;
  --gold-3:     #a87c3d;
  --cyan:       #6fd7ff;
  --violet:     #9a7bff;

  --txt:        #ecebe7;
  --txt-2:      rgba(236,235,231,.66);
  --txt-3:      rgba(236,235,231,.42);

  --grad-gold:  linear-gradient(100deg,#a87c3d 0%,#d8b171 22%,#f8ecd2 48%,#d8b171 72%,#8f6a34 100%);
  --header-h:   78px;
  --ease:       cubic-bezier(.22,.8,.24,1);

  --font-cn:    "PingFang SC","Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC",sans-serif;
  --font-en:    "Optima","Didot","Bodoni MT","Times New Roman",serif;
}

*,*::before,*::after{ box-sizing:border-box; }

html,body{ height:100%; }

body{
  margin:0;
  background:var(--ink);
  color:var(--txt);
  font-family:var(--font-cn);
  font-size:16px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow:hidden;
}

a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
svg{ width:100%; height:100%; display:block; }
::selection{ background:rgba(216,177,113,.32); color:#fff; }

/* ---------- 滚动条 ---------- */
.viewport::-webkit-scrollbar{ width:0; }

/* =========================================================
   载入动效
   ========================================================= */
.loader{
  position:fixed; inset:0; z-index:999;
  display:grid; place-items:center;
  background:var(--ink);
  transition:opacity .8s var(--ease), visibility .8s;
}
.loader.is-done{ opacity:0; visibility:hidden; }
.loader__inner{ text-align:center; width:min(280px,70vw); }
.loader__reel{
  width:58px; height:58px; margin:0 auto 22px;
  fill:none; stroke:var(--gold); stroke-width:3; opacity:.85;
  animation:spin 3.2s linear infinite;
}
@keyframes spin{ to{ transform:rotate(360deg); } }
.loader__word{
  font-family:var(--font-en);
  letter-spacing:.5em; font-size:15px; text-indent:.5em;
  background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent;
  margin-bottom:18px;
}
.loader__bar{ height:1px; background:rgba(255,255,255,.12); overflow:hidden; }
.loader__bar i{ display:block; height:100%; width:0; background:var(--grad-gold); }

/* =========================================================
   氛围层
   ========================================================= */
.grain{
  position:fixed; inset:-120px; z-index:60; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grainShift 1.1s steps(3) infinite;
}
@keyframes grainShift{
  0%{ transform:translate(0,0); } 33%{ transform:translate(-14px,8px); } 66%{ transform:translate(10px,-12px); } 100%{ transform:translate(0,0); }
}
.vignette{
  position:fixed; inset:0; z-index:55; pointer-events:none;
  background:radial-gradient(120% 90% at 50% 45%,transparent 42%,rgba(0,0,0,.55) 100%);
}
.progress{ position:fixed; top:0; left:0; right:0; height:2px; z-index:70; background:rgba(255,255,255,.05); }
.progress i{ display:block; height:100%; width:0; background:var(--grad-gold); box-shadow:0 0 14px rgba(216,177,113,.7); transition:width .12s linear; }

/* =========================================================
   顶部导航
   ========================================================= */
.header{
  position:fixed; top:0; left:0; right:0; height:var(--header-h); z-index:50;
  display:flex; align-items:center; gap:28px;
  padding:0 clamp(18px,4vw,60px);
  transition:background .45s var(--ease), backdrop-filter .45s, border-color .45s, height .45s var(--ease);
  border-bottom:1px solid transparent;
}
.header.is-stuck{
  height:66px;
  background:rgba(5,6,10,.72);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border-bottom-color:var(--line);
}

.brand{ display:flex; align-items:center; gap:12px; margin-right:auto; }
.brand__mark{ width:32px; height:32px; flex:none; }
.brand__mark svg{ fill:none; stroke:var(--gold); stroke-width:2.4; animation:spin 14s linear infinite; }
.brand__text{ display:flex; flex-direction:column; line-height:1.15; }
.brand__text b{
  font-family:var(--font-en); font-size:19px; letter-spacing:.24em; font-weight:600;
  background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.brand__text i{ font-style:normal; font-size:10.5px; letter-spacing:.22em; color:var(--txt-3); }

.nav{ display:flex; gap:clamp(14px,2.2vw,34px); }
.nav a{
  position:relative; font-size:14px; letter-spacing:.1em; color:var(--txt-2);
  padding:6px 2px; transition:color .3s;
}
.nav a::after{
  content:""; position:absolute; left:50%; bottom:0; width:0; height:1px;
  background:var(--grad-gold); transform:translateX(-50%); transition:width .38s var(--ease);
}
.nav a:hover{ color:var(--txt); }
.nav a.is-on{ color:var(--gold-2); }
.nav a.is-on::after{ width:100%; }

.header__cta{ flex:none; }

/* 中英切换 */
.lang{
  display:flex; flex:none; border:1px solid var(--line-soft); border-radius:999px;
  padding:2px; background:rgba(255,255,255,.03);
}
.lang button{
  background:none; border:none; color:var(--txt-3); border-radius:999px;
  font-size:12px; letter-spacing:.1em; padding:5px 12px; line-height:1.4;
  transition:.32s var(--ease);
}
.lang button:hover{ color:var(--txt); }
.lang button.is-on{ background:var(--grad-gold); color:#12100b; font-weight:600; }

.burger{ display:none; width:40px; height:40px; background:none; border:none; padding:9px; }
.burger span{ display:block; height:1.5px; background:var(--txt); margin:5px 0; transition:.35s var(--ease); }
.burger.is-on span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.burger.is-on span:nth-child(2){ opacity:0; }
.burger.is-on span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* 抽屉 */
.drawer{
  position:fixed; inset:0; z-index:45; background:rgba(5,6,10,.96);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  display:grid; place-items:center;
  opacity:0; visibility:hidden; transition:opacity .45s var(--ease), visibility .45s;
}
.drawer.is-on{ opacity:1; visibility:visible; }
.drawer nav{ display:flex; flex-direction:column; gap:6px; width:min(340px,80vw); }
.drawer a{
  display:flex; align-items:baseline; gap:14px; padding:14px 4px;
  border-bottom:1px solid var(--line-soft); font-size:20px; letter-spacing:.06em;
  opacity:0; transform:translateY(18px); transition:opacity .5s var(--ease), transform .5s var(--ease);
}
.drawer.is-on a{ opacity:1; transform:none; }
.drawer a em{ font-family:var(--font-en); font-style:normal; font-size:12px; color:var(--gold); letter-spacing:.14em; }
.drawer a s{ margin-left:auto; text-decoration:none; font-family:var(--font-en); font-size:12px; color:var(--txt-3); letter-spacing:.16em; }

/* =========================================================
   右侧圆点
   ========================================================= */
.dots{
  position:fixed; right:clamp(14px,2.2vw,34px); top:50%; transform:translateY(-50%);
  z-index:48; display:flex; flex-direction:column; gap:16px; align-items:flex-end;
}
.dots a{ position:relative; display:grid; place-items:center; width:16px; height:16px; }
.dots a i{
  width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.26);
  transition:.4s var(--ease);
}
.dots a:hover i{ background:var(--gold); transform:scale(1.3); }
.dots a.is-on i{
  width:8px; height:8px; background:var(--gold);
  box-shadow:0 0 0 1px rgba(216,177,113,.35), 0 0 14px rgba(216,177,113,.8);
}
.dots a::after{
  content:attr(data-label);
  position:absolute; right:26px; top:50%; transform:translate(8px,-50%);
  white-space:nowrap; font-size:11.5px; letter-spacing:.12em; color:var(--gold-2);
  background:rgba(9,11,18,.85); border:1px solid var(--line); padding:4px 10px;
  opacity:0; pointer-events:none; transition:.35s var(--ease);
}
.dots a:hover::after{ opacity:1; transform:translate(0,-50%); }

/* =========================================================
   滚屏容器 / 分屏
   ========================================================= */
.viewport{
  height:100vh; height:100dvh;
  overflow-y:scroll; overflow-x:hidden;
  scroll-snap-type:y mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
  position:relative; z-index:10;
}
.panel{
  position:relative;
  min-height:100vh; min-height:100dvh;
  scroll-snap-align:start;
  display:flex; align-items:center;
  padding:calc(var(--header-h) + 22px) 0 46px;
  overflow:hidden;
}
.panel:nth-child(even){ background:linear-gradient(180deg,var(--ink) 0%,var(--ink-2) 50%,var(--ink) 100%); }
.panel:not(:first-child)::before{
  content:""; position:absolute; top:0; left:12%; right:12%; height:1px;
  background:linear-gradient(90deg,transparent,var(--line),transparent);
}
.panel--contact{ display:block; padding-bottom:0; }

.wrap{ width:min(1240px,90vw); margin:0 auto; position:relative; z-index:2; }

/* =========================================================
   通用排版
   ========================================================= */
.eyebrow{
  font-family:var(--font-en); font-size:11.5px; letter-spacing:.34em;
  color:var(--gold); margin:0 0 18px; text-transform:uppercase;
}
.h2{
  font-size:clamp(28px,4.2vw,52px); line-height:1.22; margin:0 0 22px;
  font-weight:600; letter-spacing:.02em;
}
.grad{
  background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.lead{ font-size:clamp(15px,1.25vw,17.5px); color:var(--txt-2); margin:0 0 16px; max-width:56ch; }
.lead--center{ margin-left:auto; margin-right:auto; text-align:center; }
.muted{ font-size:14.5px; color:var(--txt-3); line-height:1.9; margin:0 0 20px; max-width:58ch; }

.sec-head{ text-align:center; margin-bottom:clamp(22px,3.4vh,44px); }
.sec-head--row{
  display:flex; align-items:flex-end; justify-content:space-between; gap:24px; text-align:left; flex-wrap:wrap;
}
.sec-head--row .h2{ margin-bottom:0; }

/* 按钮 */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px;
  height:52px; padding:0 30px; font-size:14.5px; letter-spacing:.1em;
  border:1px solid var(--line); background:transparent; color:var(--txt);
  overflow:hidden; transition:.42s var(--ease); border-radius:2px;
}
.btn svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; transition:transform .4s var(--ease); }
.btn:hover svg{ transform:translateX(4px); }
.btn--sm{ height:40px; padding:0 20px; font-size:13px; }
.btn--block{ width:100%; }

.btn--gold{ color:#12100b; border-color:transparent; background:var(--grad-gold); background-size:220% 100%; font-weight:600; }
.btn--gold:hover{ background-position:100% 0; box-shadow:0 12px 34px -12px rgba(216,177,113,.65); transform:translateY(-2px); }

.btn--ghost{ color:var(--txt); border-color:rgba(255,255,255,.18); }
.btn--ghost:hover{ border-color:var(--gold); color:var(--gold-2); background:rgba(216,177,113,.06); transform:translateY(-2px); }
/* 外链按钮：箭头朝右上角挑，区别于站内跳转的水平箭头 */
.btn--ext:hover svg{ transform:translate(3px,-3px); }
.btn__play{
  width:0; height:0; border-style:solid; border-width:5px 0 5px 8px;
  border-color:transparent transparent transparent currentColor;
}

/* =========================================================
   01 首屏
   ========================================================= */
.panel--hero{ align-items:center; }
.hero__canvas{ position:absolute; inset:0; width:100%; height:100%; z-index:0; opacity:.55; }
.hero__glow{ position:absolute; border-radius:50%; filter:blur(110px); pointer-events:none; z-index:0; }
.hero__glow--a{
  width:52vw; height:52vw; left:-14vw; top:-16vw;
  background:radial-gradient(circle,rgba(216,177,113,.30),transparent 66%);
  animation:float1 16s ease-in-out infinite;
}
.hero__glow--b{
  width:46vw; height:46vw; right:-12vw; bottom:-18vw;
  background:radial-gradient(circle,rgba(122,110,255,.24),transparent 66%);
  animation:float2 20s ease-in-out infinite;
}
@keyframes float1{ 50%{ transform:translate(6vw,4vw) scale(1.12); } }
@keyframes float2{ 50%{ transform:translate(-5vw,-4vw) scale(1.15); } }
.hero__beam{
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5;
  background:
    repeating-linear-gradient(90deg,transparent 0 118px,rgba(255,255,255,.028) 118px 119px),
    linear-gradient(180deg,transparent 55%,rgba(216,177,113,.05) 100%);
  mask-image:radial-gradient(80% 70% at 50% 50%,#000 30%,transparent 100%);
  -webkit-mask-image:radial-gradient(80% 70% at 50% 50%,#000 30%,transparent 100%);
}

.hero__wrap{ text-align:center; }
.hero__title{
  font-family:var(--font-en);
  font-size:clamp(46px,11.2vw,168px);
  line-height:.94; margin:0; font-weight:600;
  letter-spacing:.04em;
}
.hero__title-line{
  display:inline-block;
  background:linear-gradient(180deg,#fffaf0 0%,#e6d3ae 42%,#9b7a45 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 18px 46px rgba(216,177,113,.22));
}
.hero__title .grad{ -webkit-text-fill-color:transparent; }
.hero__cn{
  margin:14px 0 22px; font-size:clamp(12px,1.5vw,17px);
  letter-spacing:.62em; text-indent:.62em; color:var(--txt-2);
}
.hero__desc{
  margin:0 auto; max-width:64ch; font-size:clamp(14px,1.2vw,16.5px);
  color:var(--txt-2); line-height:2;
}
.hero__desc b{ color:var(--gold-2); font-weight:500; }
.hero__actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:34px; }
.hero__tags{
  list-style:none; display:flex; gap:10px; flex-wrap:wrap; justify-content:center;
  padding:0; margin:36px 0 0;
}
.hero__tags li{
  font-size:12px; letter-spacing:.14em; color:var(--txt-3);
  border:1px solid var(--line-soft); padding:5px 14px; border-radius:999px;
}

.scroll-hint{
  position:absolute; left:50%; bottom:26px; transform:translateX(-50%);
  z-index:3; display:flex; flex-direction:column; align-items:center; gap:9px;
  font-family:var(--font-en); font-size:10px; letter-spacing:.34em; color:var(--txt-3);
}
.scroll-hint i{ display:block; width:1px; height:46px; background:linear-gradient(180deg,var(--gold),transparent); position:relative; overflow:hidden; }
.scroll-hint i::after{
  content:""; position:absolute; left:0; width:1px; height:14px; background:var(--gold-2);
  animation:drop 2.1s var(--ease) infinite;
}
@keyframes drop{ 0%{ top:-14px; opacity:0; } 30%{ opacity:1; } 100%{ top:46px; opacity:0; } }

/* =========================================================
   02 关于
   ========================================================= */
.about{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(30px,5vw,72px); align-items:center; }
.ticks{ list-style:none; padding:0; margin:24px 0 0; display:grid; gap:12px; }
.ticks li{ position:relative; padding-left:26px; font-size:14.5px; color:var(--txt-2); }
.ticks li::before{
  content:""; position:absolute; left:0; top:.62em; width:11px; height:6px;
  border-left:1.5px solid var(--gold); border-bottom:1.5px solid var(--gold);
  transform:rotate(-45deg);
}

.stats{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.stat{ background:var(--ink-2); padding:clamp(18px,2.4vw,30px); text-align:center; }
.stat b{
  display:flex; align-items:baseline; justify-content:center; white-space:nowrap;
  font-family:var(--font-en); font-size:clamp(30px,3.6vw,46px); line-height:1; font-weight:600;
  background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stat b em{ font-style:normal; font-size:.5em; margin-left:3px; }
.stat > span{ display:block; margin-top:10px; font-size:12.5px; letter-spacing:.1em; color:var(--txt-3); }

.quote{
  position:relative; margin-top:22px; padding:24px 26px 24px 54px;
  border:1px solid var(--line); background:linear-gradient(135deg,rgba(216,177,113,.06),transparent 60%);
  font-size:14.5px; color:var(--txt-2); line-height:1.95;
}
.quote__mark{
  position:absolute; left:18px; top:6px; font-family:var(--font-en);
  font-size:52px; color:var(--gold); opacity:.4; line-height:1;
}
.quote i{ display:block; margin-top:10px; font-style:normal; font-size:12.5px; color:var(--gold); letter-spacing:.1em; }

/* =========================================================
   03 业务
   ========================================================= */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.card{
  position:relative; background:var(--ink-2); padding:clamp(20px,2.1vw,28px);
  overflow:hidden; transition:background .5s var(--ease), transform .5s var(--ease);
}
.card::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px;
  background:var(--grad-gold); transform:scaleX(0); transform-origin:left; transition:transform .55s var(--ease);
}
.card:hover{ background:var(--ink-3); }
.card:hover::after{ transform:scaleX(1); }
.card__no{
  position:absolute; right:20px; top:16px; font-family:var(--font-en);
  font-size:40px; color:rgba(255,255,255,.045); font-weight:600; letter-spacing:.02em;
  transition:color .5s;
}
.card:hover .card__no{ color:rgba(216,177,113,.13); }
.card__ico{
  width:42px; height:42px; margin-bottom:15px; padding:9px;
  border:1px solid var(--line); color:var(--gold);
  transition:.5s var(--ease);
}
.card__ico svg{ fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.card:hover .card__ico{ background:rgba(216,177,113,.1); border-color:var(--gold); transform:translateY(-3px); }
.card h3{ margin:0 0 4px; font-size:21px; font-weight:600; letter-spacing:.04em; }
.card__en{ margin:0 0 14px; font-family:var(--font-en); font-size:11.5px; letter-spacing:.2em; color:var(--gold-3); }
.card__txt{ margin:0; font-size:14px; line-height:1.9; color:var(--txt-2); }
.chips{ list-style:none; display:flex; flex-wrap:wrap; gap:7px; padding:0; margin:13px 0 0; }
.chips li{ font-size:11.5px; letter-spacing:.08em; color:var(--txt-3); border:1px solid var(--line-soft); padding:3px 10px; border-radius:999px; }
.card--feature{ background:linear-gradient(150deg,rgba(216,177,113,.09),var(--ink-2) 58%); }
.card--cta{ display:flex; flex-direction:column; justify-content:center; gap:12px; background:linear-gradient(150deg,rgba(122,110,255,.09),var(--ink-2) 60%); }
.card--cta h3{ font-size:19px; }
.card--cta .btn{ align-self:flex-start; margin-top:6px; }

/* =========================================================
   04 作品
   ========================================================= */
.filters{ display:flex; gap:8px; flex-wrap:wrap; }
.filters button{
  background:transparent; border:1px solid var(--line-soft); color:var(--txt-3);
  font-size:13px; letter-spacing:.1em; padding:7px 16px; border-radius:999px; transition:.35s var(--ease);
}
.filters button:hover{ color:var(--txt); border-color:var(--gold); }
.filters button.is-on{ color:#12100b; background:var(--grad-gold); border-color:transparent; font-weight:600; }

/* 作品屏让 wrap 撑满高度，网格才能把剩余空间吃干净 */
#works{ align-items:stretch; }
#works .wrap{ display:flex; flex-direction:column; }

.works{
  display:grid;
  /* 列数由 JS 按当前可见数量算出（见 main.js 的 layoutWorks()），
     窄屏用 --maxcols 封顶，JS 会读取它并同步重算跨列 */
  --maxcols:4;
  grid-template-columns:repeat(var(--cols,4),1fr);
  grid-auto-rows:minmax(0,1fr);
  gap:14px; margin-top:clamp(20px,3vh,34px);
  flex:1; min-height:0;
}
.work{
  position:relative; overflow:hidden; border:1px solid var(--line-soft);
  /* 行高由网格平分，这里只是个下限；给太大反而会把多行网格顶出屏幕 */
  min-height:clamp(120px,14vh,200px);
  display:flex; align-items:flex-end;
  transition:transform .6s var(--ease), border-color .5s, opacity .45s var(--ease);
}
.work--wide{ grid-column:span 2; }
/* 筛选时由 JS 重新指派跨列，覆盖静态的 --wide */
.work.is-span{ grid-column:span 2; }
.work.is-flat{ grid-column:span 1; }
.work:hover{ transform:translateY(-6px); border-color:var(--line); }
.work.is-hide{ display:none; }
.work.is-fade{ animation:workIn .55s var(--ease) both; }
@keyframes workIn{ from{ opacity:0; transform:translateY(16px) scale(.985); } to{ opacity:1; transform:none; } }

.work__art{ position:absolute; inset:0; transition:transform 1.1s var(--ease), filter .6s; }
.work:hover .work__art{ transform:scale(1.08); filter:saturate(1.15) brightness(1.06); }
/* 图片未加载时露出的是各自的渐变底色，不会出现白块 */
.work__art img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; display:block; z-index:0;
  opacity:0; transition:opacity .8s var(--ease);
}
.work__art img.is-loaded{ opacity:1; }
.work__art::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(3,4,8,.10) 0%,transparent 32%,rgba(3,4,8,.70) 72%,rgba(3,4,8,.94) 100%);
}
.work__art--1{ background:radial-gradient(90% 120% at 25% 10%,#1d4c6b,#0a1420 60%),conic-gradient(from 200deg at 70% 80%,#0f2a3d,#245e78,#0b1a26); }
.work__art--2{ background:radial-gradient(80% 110% at 80% 10%,#6b3a1d,#1a1008 62%),conic-gradient(from 20deg at 20% 80%,#3d240f,#8a5a2a,#20140a); }
.work__art--3{ background:radial-gradient(90% 120% at 20% 20%,#5a1d6b,#170a20 60%),conic-gradient(from 140deg at 80% 70%,#2d0f3d,#7a2a8a,#1a0a24); }
.work__art--4{ background:radial-gradient(80% 110% at 70% 15%,#6b1d3a,#200a12 62%),conic-gradient(from 300deg at 25% 85%,#3d0f22,#a8365e,#1c0810); }
.work__art--5{ background:radial-gradient(80% 130% at 50% 0%,#2a3f6b,#080c16 60%),conic-gradient(from 250deg at 80% 90%,#101c33,#4a6ba8,#0a1020); }
.work__art--6{ background:radial-gradient(90% 120% at 30% 15%,#6b5a1d,#1a1608 62%),conic-gradient(from 60deg at 75% 80%,#3d3410,#b39b3a,#1c1808); }

.work__play{
  position:absolute; left:50%; top:50%; width:48px; height:48px; margin:-24px 0 0 -24px;
  border:1px solid rgba(255,255,255,.5); border-radius:50%;
  opacity:0; transform:scale(.7); transition:.5s var(--ease); z-index:2;
}
.work__play::after{
  content:""; position:absolute; left:19px; top:16px;
  border-style:solid; border-width:8px 0 8px 12px; border-color:transparent transparent transparent #fff;
}
.work:hover .work__play{ opacity:1; transform:scale(1); background:rgba(216,177,113,.18); border-color:var(--gold); }

.work__meta{
  position:relative; z-index:2; padding:20px 22px; width:100%;
  text-shadow:0 1px 14px rgba(0,0,0,.75);
}
.work__meta em{ display:block; font-style:normal; font-size:11px; letter-spacing:.18em; color:var(--gold); margin-bottom:7px; }
.work__meta strong{ display:block; font-size:clamp(16px,1.5vw,21px); font-weight:600; letter-spacing:.03em; }
.work__meta i{ display:block; font-style:normal; margin-top:6px; font-size:12px; color:var(--txt-3); }

/* 四列密排时格子变窄，标题收一号，避免长片名折行顶乱版面 */
.works.is-dense .work__meta{ padding:14px 16px; }
.works.is-dense .work__meta em{ font-size:10px; letter-spacing:.14em; margin-bottom:5px; }
.works.is-dense .work__meta strong{ font-size:15px; line-height:1.35; }
.works.is-dense .work__meta i{ margin-top:5px; font-size:11px; }

/* =========================================================
   05 合作机构 Logo 墙
   ========================================================= */
/* minmax(0,1fr) + min-width:0：阻止 max-content 的轨道把行宽顶穿，
   否则遮罩的淡出区会被推到屏幕外，右侧看起来就是硬切边 */
.logos{ display:grid; grid-template-columns:minmax(0,1fr); gap:clamp(11px,1.7vh,20px); }
.lrow{ min-width:0; }

.lrow__label{
  display:inline-block; margin-bottom:9px;
  font-size:11px; letter-spacing:.2em; color:var(--gold);
  border:1px solid var(--line); padding:3px 12px; border-radius:999px;
}

.marquee{
  position:relative; overflow:hidden;
  /* 两端渐隐，滚动进出不生硬 */
  mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
}
.marquee__track{
  display:flex; align-items:stretch; width:max-content;
  animation:marqueeMove 40s linear infinite;
  will-change:transform;
}
.lrow--rev .marquee__track{ animation-direction:reverse; }
@keyframes marqueeMove{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(-50%,0,0); } }

/* 悬停暂停，方便看清某一家；分屏不在视野内时也暂停 */
.marquee:hover .marquee__track{ animation-play-state:paused; }
#partners:not(.is-live) .marquee__track{ animation-play-state:paused; }

.logo{
  flex:none; display:flex; align-items:center; justify-content:center;
  min-width:clamp(126px,10.5vw,168px); height:clamp(52px,6.6vh,70px);
  /* 间距用 margin 而非 gap：让「一份内容」的宽度正好等于一个循环周期，接缝才严丝合缝 */
  padding:0 20px; margin-right:12px; border:1px solid var(--line-soft);
  background:linear-gradient(160deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  transition:.42s var(--ease);
}
.logo b{
  font-weight:500; font-size:14px; letter-spacing:.06em; white-space:nowrap;
  color:var(--txt-3); transition:color .42s var(--ease);
}
.logo img{
  max-width:112px; max-height:34px; object-fit:contain;
  filter:grayscale(1) brightness(1.7) opacity(.5);
  transition:filter .42s var(--ease);
}
.logo:hover{
  border-color:var(--gold); background:rgba(216,177,113,.07);
  transform:translateY(-3px); box-shadow:0 14px 30px -18px rgba(216,177,113,.7);
}
.logo:hover b{ color:var(--gold-2); }
.logo:hover img{ filter:none; }

.logos__stat{
  display:flex; flex-wrap:wrap; justify-content:center; gap:10px 34px;
  margin-top:clamp(16px,2.6vh,30px); padding-top:clamp(14px,2vh,20px);
  border-top:1px solid var(--line-soft);
  font-size:13px; color:var(--txt-3); letter-spacing:.06em;
}
.logos__stat b{
  font-family:var(--font-en); font-size:19px; font-weight:600; margin:0 3px;
  background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* =========================================================
   06 流程
   ========================================================= */
.steps{
  list-style:none; padding:0; margin:0;
  display:grid; grid-template-columns:repeat(6,1fr); gap:1px;
  background:var(--line-soft); border:1px solid var(--line-soft);
  counter-reset:s;
}
.step{
  position:relative; background:var(--ink-2); padding:clamp(20px,2.2vw,30px) clamp(16px,1.6vw,22px);
  transition:background .5s var(--ease);
}
.step:hover{ background:var(--ink-3); }
.step::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:var(--grad-gold); transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease);
}
.step:hover::before{ transform:scaleX(1); }
.step__no{
  display:block; font-family:var(--font-en); font-size:34px; line-height:1; font-weight:600;
  background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent;
  opacity:.75; margin-bottom:14px;
}
.step h3{ margin:0 0 8px; font-size:17px; font-weight:600; letter-spacing:.05em; }
.step p{ margin:0; font-size:13.5px; line-height:1.85; color:var(--txt-2); }
.step__time{
  display:inline-block; margin-top:14px; font-size:11.5px; letter-spacing:.1em;
  color:var(--gold); border:1px solid var(--line); padding:2px 10px; border-radius:999px;
}

/* =========================================================
   06 中台
   ========================================================= */
.tech{ display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(30px,5vw,70px); align-items:center; }
.tech__cta{ display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; margin:20px 0 0; }
.tech__cta-note{ font-size:12px; letter-spacing:.08em; color:var(--txt-3); }

.feats{ display:grid; grid-template-columns:1fr 1fr; gap:1px; margin-top:22px; background:var(--line-soft); border:1px solid var(--line-soft); }
.feat{ background:var(--ink-2); padding:20px 22px; transition:background .45s; }
.feat:hover{ background:var(--ink-3); }
.feat b{ display:block; font-size:15px; letter-spacing:.04em; margin-bottom:7px; color:var(--gold-2); }
.feat p{ margin:0; font-size:13.5px; line-height:1.85; color:var(--txt-3); }

.console{
  border:1px solid var(--line); background:rgba(9,11,18,.85);
  box-shadow:0 40px 90px -40px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(6px);
}
.console__bar{
  display:flex; align-items:center; gap:7px; padding:12px 16px;
  border-bottom:1px solid var(--line-soft); background:rgba(255,255,255,.02);
}
.console__bar i{ width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.16); }
.console__bar i:first-child{ background:rgba(216,177,113,.7); }
.console__bar span{ margin-left:10px; font-family:var(--font-en); font-size:11.5px; letter-spacing:.18em; color:var(--txt-3); }
.console__body{ padding:clamp(18px,2.2vw,26px); }
.line{ display:flex; gap:14px; align-items:baseline; font-size:13.5px; margin-bottom:8px; }
.line span{ color:var(--txt-3); letter-spacing:.1em; min-width:36px; }
.line b{ font-weight:500; letter-spacing:.04em; }
.line b.ok{ color:var(--gold); }
.line b.ok::before{
  content:""; display:inline-block; width:6px; height:6px; border-radius:50%;
  background:var(--gold); margin-right:8px; vertical-align:middle;
  animation:pulse 1.6s ease-in-out infinite;
}
@keyframes pulse{ 50%{ opacity:.25; box-shadow:0 0 0 5px rgba(216,177,113,0); } 0%,100%{ box-shadow:0 0 0 0 rgba(216,177,113,.5); } }

.bar{ display:grid; grid-template-columns:80px 1fr 46px; align-items:center; gap:12px; margin-top:12px; }
.bar em{ font-style:normal; font-size:12.5px; color:var(--txt-3); }
.bar i{ display:block; height:4px; background:rgba(255,255,255,.07); position:relative; overflow:hidden; }
.bar i::after{
  content:""; position:absolute; inset:0 auto 0 0; width:0; background:var(--grad-gold);
  transition:width 1.4s var(--ease);
}
.is-in .bar i::after{ width:var(--v); }
.bar u{ text-decoration:none; font-family:var(--font-en); font-size:12px; color:var(--gold); text-align:right; }

.console__grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:24px;
  background:var(--line-soft); border:1px solid var(--line-soft);
}
.console__grid div{ background:var(--ink-2); padding:14px 10px; text-align:center; }
.console__grid b{ display:block; font-family:var(--font-en); font-size:19px; color:var(--gold-2); letter-spacing:.04em; }
.console__grid span{ display:block; margin-top:5px; font-size:11px; color:var(--txt-3); }

/* =========================================================
   07 双向委托
   ========================================================= */
.duo{ display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.duo__card{
  position:relative; background:var(--ink-2); padding:clamp(18px,2.1vw,28px);
  display:flex; flex-direction:column; overflow:hidden; transition:background .5s var(--ease);
}
.duo__card::before{
  content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background:radial-gradient(85% 70% at 8% 0%,rgba(216,177,113,.13),transparent 62%);
}
.duo__card--alt::before{ background:radial-gradient(85% 70% at 92% 0%,rgba(122,110,255,.15),transparent 62%); }
.duo__card:hover{ background:var(--ink-3); }
.duo__card > *{ position:relative; z-index:1; }

.duo__dir{
  display:inline-flex; align-items:center; gap:8px; align-self:flex-start;
  font-family:var(--font-en); font-size:11px; letter-spacing:.26em;
  color:var(--gold); border:1px solid var(--line); padding:3px 11px; border-radius:999px;
  margin-bottom:12px;
}
.duo__dir b{ font-size:14px; line-height:1; }
.duo__card--alt .duo__dir{ color:#b9a7ff; border-color:rgba(154,123,255,.28); }

.duo__card h3{ margin:0 0 7px; font-size:clamp(19px,1.75vw,23px); font-weight:600; letter-spacing:.04em; }
.duo__lead{ margin:0 0 14px; font-size:13.5px; line-height:1.85; color:var(--txt-2); }

.duo__list{ list-style:none; padding:0; margin:0 0 16px; display:grid; gap:8px; }
.duo__list li{
  position:relative; padding-left:20px; font-size:13px; line-height:1.72; color:var(--txt-3);
}
.duo__list li::before{
  content:""; position:absolute; left:0; top:.66em; width:8px; height:1px; background:var(--gold);
}
.duo__list b{ display:block; font-weight:500; font-size:14px; color:var(--gold-2); letter-spacing:.03em; }
.duo__card .btn{ align-self:flex-start; margin-top:auto; }

.roles{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  margin-top:clamp(12px,1.8vh,20px); padding-top:clamp(11px,1.5vh,16px);
  border-top:1px solid var(--line-soft);
}
.roles__label{
  flex:none; font-size:11.5px; letter-spacing:.2em; color:var(--gold);
  border:1px solid var(--line); padding:4px 12px; border-radius:999px;
}
.roles ul{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; padding:0; margin:0; }
.roles li{
  font-size:12.5px; letter-spacing:.06em; color:var(--txt-3);
  border:1px solid var(--line-soft); padding:4px 13px; border-radius:999px;
  transition:.35s var(--ease);
}
.roles li:hover{ color:var(--gold-2); border-color:var(--gold); background:rgba(216,177,113,.06); }

/* =========================================================
   08 委托
   ========================================================= */
.panel--contact{ display:flex; flex-direction:column; align-items:stretch; justify-content:space-between; }
.contact{ display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(30px,5vw,70px); align-items:center; flex:1; padding-bottom:40px; }
.contact__ways{ display:flex; align-items:flex-start; gap:clamp(20px,2.6vw,36px); margin-top:28px; }
.contact__ways .contact__list{ flex:1; min-width:0; margin:0; }

.qr{ flex:none; margin:0; text-align:center; width:clamp(104px,9vw,126px); }
.qr__frame{
  position:relative; display:block; aspect-ratio:1; padding:8px;
  border:1px solid var(--line); background:rgba(255,255,255,.035);
}
/* 默认隐藏，加载成功后才显示并盖掉占位提示；
   这样文件缺失或还没加载完时，都不会露出白块或破图图标 */
.qr__frame img{
  position:relative; z-index:1; width:100%; height:100%;
  object-fit:contain; display:none; background:#fff;
}
.qr__frame img.is-ok{ display:block; }
.qr__frame img.is-ok ~ .qr__todo{ display:none; }
.qr__todo{
  position:absolute; inset:8px; display:flex; align-items:center; justify-content:center;
  border:1px dashed rgba(216,177,113,.4); padding:6px;
  font-size:10px; line-height:1.7; color:var(--txt-3); letter-spacing:.04em; word-break:break-all;
}
.qr figcaption{ margin-top:9px; font-size:11px; letter-spacing:.06em; color:var(--txt-3); }
.contact__list li{ display:flex; gap:18px; align-items:baseline; border-bottom:1px solid var(--line-soft); padding-bottom:12px; }
.contact__list span{ font-size:12px; letter-spacing:.16em; color:var(--txt-3); min-width:68px; }
.contact__list b{ font-weight:500; font-size:15px; letter-spacing:.03em; color:var(--gold-2); }

.form{
  border:1px solid var(--line); padding:clamp(22px,2.6vw,34px);
  background:linear-gradient(150deg,rgba(216,177,113,.05),rgba(9,11,18,.7) 55%);
  backdrop-filter:blur(8px);
}
.form__row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.field{ display:block; margin-bottom:12px; }
.field > span{ display:block; font-size:12px; letter-spacing:.14em; color:var(--txt-3); margin-bottom:8px; }
.field input,.field select,.field textarea{
  width:100%; background:rgba(255,255,255,.03); border:1px solid var(--line-soft);
  color:var(--txt); font-family:inherit; font-size:14.5px; padding:12px 14px;
  border-radius:2px; outline:none; transition:.35s var(--ease); resize:vertical;
}
.field textarea{ line-height:1.8; }
.field select{ appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23d8b171' stroke-width='1.4'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:11px; padding-right:36px;
}
.field select option{ background:#0e111b; color:var(--txt); }
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--gold); background:rgba(216,177,113,.06); box-shadow:0 0 0 3px rgba(216,177,113,.09);
}
.field input::placeholder,.field textarea::placeholder{ color:rgba(236,235,231,.26); }
.field.is-err input,.field.is-err .picks{ border-color:#e2564d; }
.field.is-err input{ box-shadow:0 0 0 3px rgba(226,86,77,.12); }

.picks{ display:flex; flex-wrap:wrap; gap:8px; border:1px solid transparent; border-radius:2px; }
.picks button{
  background:rgba(255,255,255,.03); border:1px solid var(--line-soft); color:var(--txt-2);
  font-size:13px; letter-spacing:.06em; padding:8px 15px; border-radius:999px; transition:.32s var(--ease);
}
.picks button:hover{ border-color:var(--gold); color:var(--gold-2); }
.picks button.is-on{ background:var(--grad-gold); color:#12100b; border-color:transparent; font-weight:600; }
.picks--single button{ flex:1 1 0; min-width:140px; }
.form .btn{ margin-top:6px; }
.form__tip{ margin:14px 0 0; font-size:11.5px; color:var(--txt-3); line-height:1.8; }

/* 页脚 */
.footer{ border-top:1px solid var(--line-soft); padding:24px 0; background:rgba(3,4,8,.6); }
.footer__in{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
.footer__brand{ display:flex; align-items:baseline; gap:12px; margin-right:auto; }
.footer__brand b{ font-family:var(--font-en); letter-spacing:.24em; font-size:15px; color:var(--gold-2); }
.footer__brand span{ font-size:11.5px; color:var(--txt-3); letter-spacing:.08em; }
.footer__nav{ display:flex; gap:20px; }
.footer__nav a{ font-size:12.5px; color:var(--txt-3); transition:color .3s; }
.footer__nav a:hover{ color:var(--gold); }

.footer__legal{
  width:100%; display:flex; align-items:center; flex-wrap:wrap; gap:8px 20px;
  font-size:11.5px; color:rgba(236,235,231,.28); letter-spacing:.06em;
}
.footer__legal .beian{
  display:inline-flex; align-items:center; gap:6px;
  color:rgba(236,235,231,.34); transition:color .3s;
}
.footer__legal .beian:hover{ color:var(--gold); }
.beian__badge{ width:16px; height:16px; flex:none; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linejoin:round; }
.beian__badge .beian__star{ fill:currentColor; stroke:none; opacity:.85; }

/* =========================================================
   Toast
   ========================================================= */
.toast{
  position:fixed; left:50%; bottom:38px; z-index:200;
  display:flex; align-items:center; gap:12px;
  padding:14px 24px; border:1px solid var(--line);
  background:rgba(9,11,18,.94); backdrop-filter:blur(14px);
  font-size:14px; letter-spacing:.05em;
  transform:translate(-50%,26px); opacity:0; visibility:hidden;
  transition:.5s var(--ease);
}
.toast.is-on{ transform:translate(-50%,0); opacity:1; visibility:visible; }
.toast i{ width:8px; height:8px; border-radius:50%; background:var(--gold); box-shadow:0 0 12px var(--gold); }

/* =========================================================
   入场动画
   ========================================================= */
.reveal{ opacity:0; transform:translateY(28px); }
.is-in .reveal,
.reveal.is-in{
  opacity:1; transform:none;
  transition:opacity .9s var(--ease), transform .9s var(--ease);
}
.is-in .reveal[data-delay="1"]{ transition-delay:.09s; }
.is-in .reveal[data-delay="2"]{ transition-delay:.18s; }
.is-in .reveal[data-delay="3"]{ transition-delay:.27s; }
.is-in .reveal[data-delay="4"]{ transition-delay:.36s; }
.is-in .reveal[data-delay="5"]{ transition-delay:.45s; }
.is-in .reveal[data-delay="6"]{ transition-delay:.54s; }
.is-in .reveal[data-delay="7"]{ transition-delay:.63s; }

/* =========================================================
   响应式
   ========================================================= */
/* 矮屏笔记本：压缩留白，保证整屏内容不被裁切 */
@media (min-width:901px) and (max-height:820px){
  :root{ --header-h:66px; }
  .panel{ padding:calc(var(--header-h) + 18px) 0 40px; }
  .h2{ font-size:clamp(26px,3.3vw,40px); margin-bottom:16px; }
  .sec-head{ margin-bottom:24px; }
  .lead{ font-size:15px; }
  .muted{ font-size:13.5px; line-height:1.8; }
  .card{ padding:18px 20px; }
  .card__ico{ width:38px; height:38px; margin-bottom:12px; }
  .card h3{ font-size:19px; }
  .card__txt{ font-size:13px; line-height:1.8; }
  .card__en{ margin-bottom:10px; }
  .logo{ height:56px; }
  .lrow__label{ margin-bottom:6px; padding:2px 10px; }
  .logos__stat{ margin-top:14px; padding-top:12px; }
  .step{ padding:18px 16px; }
  .step__no{ font-size:28px; margin-bottom:10px; }
  .quote{ padding:18px 20px 18px 48px; }
  .feat{ padding:16px 18px; }
  .duo__card{ padding:16px 18px; }
  .duo__card h3{ font-size:19px; margin-bottom:5px; }
  .duo__dir{ margin-bottom:10px; }
  .duo__lead{ font-size:13px; line-height:1.7; margin-bottom:10px; }
  .duo__list{ gap:7px; margin-bottom:12px; }
  .duo__list li{ font-size:12.5px; line-height:1.62; }
  .duo__list b{ font-size:13.5px; }
  .roles{ margin-top:10px; padding-top:10px; }
  .roles li{ font-size:11.5px; padding:3px 10px; }
  .form{ padding:18px 20px; }
  .field{ margin-bottom:8px; }
  .picks button{ padding:6px 13px; }
  .field > span{ margin-bottom:6px; }
  .field input,.field select,.field textarea{ padding:10px 12px; }
  .form__tip{ margin-top:10px; }
  .contact__list{ margin-top:18px; gap:9px; }
  .contact__list li{ padding-bottom:9px; }
  .contact{ padding-bottom:10px; }
  .contact__list li{ padding-bottom:8px; }
  .footer{ padding:10px 0; }
  .form__tip{ margin-top:8px; }
  .btn{ height:44px; }
}

@media (max-width:1180px){
  .cards{ grid-template-columns:repeat(2,1fr); }
  .steps{ grid-template-columns:repeat(3,1fr); }
  /* 窄屏封顶列数，JS 会读取 --maxcols 并据此重算跨列，避免出现幽灵列 */
  .works{ --maxcols:3; }
  .work--wide{ grid-column:span 2; }
}

@media (max-width:900px){
  :root{ --header-h:62px; }
  .nav,.header__cta,.dots{ display:none; }
  .burger{ display:block; flex:none; }
  .header{ gap:12px; }
  .brand__mark{ width:28px; height:28px; }
  .brand__text b{ font-size:16px; letter-spacing:.18em; }
  .brand__text i{ font-size:9.5px; letter-spacing:.14em; }
  .lang button{ padding:4px 10px; font-size:11px; }

  .viewport{ scroll-snap-type:y proximity; }
  .panel{
    min-height:auto;
    padding:calc(var(--header-h) + 46px) 0 56px;
    scroll-snap-stop:normal;
  }
  .panel--hero{ min-height:100vh; min-height:100dvh; }

  .about,.tech,.contact,.duo{ grid-template-columns:1fr; }
  .duo__card .btn{ margin-top:4px; }
  .contact{ padding-bottom:30px; }
  .cards,.steps,.feats,.form__row{ grid-template-columns:1fr 1fr; }
  .console__grid{ grid-template-columns:repeat(2,1fr); }
  .sec-head--row{ flex-direction:column; align-items:flex-start; }
  .quote{ margin-top:18px; }
}

@media (max-width:620px){
  body{ font-size:15px; }
  .hero__cn{ letter-spacing:.42em; text-indent:.42em; }
  .hero__actions .btn{ flex:1 1 100%; }
  .cards,.steps,.feats,.form__row,.stats{ grid-template-columns:1fr; }
  .works{ --maxcols:1; }
  .work--wide{ grid-column:span 1; }
  .work{ min-height:200px; }
  .bar{ grid-template-columns:66px 1fr 40px; gap:9px; }
  .footer__in{ justify-content:center; text-align:center; }
  .footer__brand{ margin-right:0; width:100%; justify-content:center; flex-wrap:wrap; }
  .footer__nav{ width:100%; justify-content:center; flex-wrap:wrap; gap:14px; }
  .footer__legal{ justify-content:center; text-align:center; gap:6px 14px; }
  .roles{ flex-direction:column; align-items:flex-start; }
  .logos__stat{ flex-direction:column; align-items:center; gap:8px; }
  .logo{ min-width:104px; height:46px; padding:0 14px; margin-right:9px; }
  .logo b{ font-size:12.5px; }
  .lrow__label{ font-size:10px; padding:2px 10px; margin-bottom:5px; }
  .toast{ width:min(90vw,420px); justify-content:center; text-align:center; }
}

/* 英文版微调：中文排版的宽字距在拉丁文下会过散 */
html[lang="en"] .brand__text i{ letter-spacing:.12em; }
html[lang="en"] .nav a{ font-size:13px; letter-spacing:.05em; }
html[lang="en"] .hero__cn{ letter-spacing:.2em; text-indent:.2em; }
html[lang="en"] .hero__desc,
html[lang="en"] .lead,
html[lang="en"] .muted,
html[lang="en"] .card__txt,
html[lang="en"] .step p,
html[lang="en"] .duo__lead{ line-height:1.75; }
html[lang="en"] .contact__list span{ min-width:80px; }
html[lang="en"] .bar{ grid-template-columns:96px 1fr 46px; }
html[lang="en"] .h2{ font-size:clamp(25px,3.5vw,44px); }
html[lang="en"] .lead{ font-size:15px; }
html[lang="en"] .card__txt{ font-size:13px; }
html[lang="en"] .card__en{ margin-bottom:11px; }
html[lang="en"] .chips li,
html[lang="en"] .roles li{ font-size:11.5px; padding:3px 11px; }
html[lang="en"] .card{ padding:clamp(18px,1.9vw,24px); }
html[lang="en"] .card__ico{ margin-bottom:10px; }
html[lang="en"] .card__en{ margin-bottom:9px; }
html[lang="en"] .chips{ margin-top:10px; }
html[lang="en"] .form{ padding:26px 28px; }
html[lang="en"] .field{ margin-bottom:10px; }
html[lang="en"] .field > span{ margin-bottom:6px; }
html[lang="en"] .field input,
html[lang="en"] .field select,
html[lang="en"] .field textarea{ padding:10px 13px; }
html[lang="en"] .picks button{ padding:7px 13px; font-size:12.5px; }
html[lang="en"] .form__tip{ font-size:11px; margin-top:10px; }
html[lang="en"] .contact{ padding-bottom:26px; }
html[lang="en"] .duo__card{ padding:clamp(16px,1.8vw,24px); }
html[lang="en"] .duo__lead{ font-size:13px; margin-bottom:12px; }
html[lang="en"] .duo__list li{ font-size:12.5px; }
html[lang="en"] .duo__list b{ font-size:13.5px; }

/* 英文 + 矮屏：拉丁文行数更多，需要再收一档
   （必须放在上面的通用英文规则之后，否则会被覆盖） */
@media (min-width:901px) and (max-height:820px){
  html[lang="en"] .panel{ padding:calc(var(--header-h) + 12px) 0 24px; }
  html[lang="en"] .form{ padding:18px 20px; }
  html[lang="en"] .field{ margin-bottom:8px; }
  html[lang="en"] .field > span{ margin-bottom:5px; }
  html[lang="en"] .field input,
  html[lang="en"] .field select,
  html[lang="en"] .field textarea{ padding:9px 12px; }
  html[lang="en"] .field textarea{ height:58px; }
  html[lang="en"] .picks button{ padding:6px 12px; }
  html[lang="en"] .form__tip{ font-size:10.5px; margin-top:8px; }
  html[lang="en"] .contact{ padding-bottom:12px; }
  html[lang="en"] .contact__list{ margin-top:14px; gap:8px; }
  html[lang="en"] .sec-head{ margin-bottom:18px; }
  html[lang="en"] .h2{ font-size:clamp(23px,2.8vw,33px); }
  html[lang="en"] .lead{ font-size:14px; }
  html[lang="en"] .card__txt{ font-size:12.5px; line-height:1.6; }
  html[lang="en"] .card h3{ font-size:18px; }
  html[lang="en"] .card__en{ margin-bottom:7px; }
  html[lang="en"] .card{ padding:16px 18px; }
  html[lang="en"] .card__ico{ width:36px; height:36px; margin-bottom:9px; }
  html[lang="en"] .chips{ margin-top:9px; }
  html[lang="en"] .chips li,
  html[lang="en"] .roles li{ font-size:11px; padding:2px 9px; }
  html[lang="en"] .step p{ font-size:12.5px; line-height:1.65; }
  html[lang="en"] .duo__lead{ font-size:12.5px; margin-bottom:9px; }
  html[lang="en"] .duo__list li{ font-size:12px; line-height:1.58; }
  html[lang="en"] .duo__list b{ font-size:13px; }
  html[lang="en"] .duo__card h3{ font-size:18px; }
  html[lang="en"] .feat p{ font-size:12.5px; line-height:1.7; }
}

@media (max-width:1280px){
  .header__cta{ display:none; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .viewport{ scroll-behavior:auto; }
  /* 不自动滚动时，Logo 墙改为可手动横向拖动 */
  .marquee{ overflow-x:auto; }
  .marquee__track{ animation:none !important; transform:none !important; }
}
