/* CapCut World Creator Program 2026 — 整站样式
 * 主色 cyan:#3CE6E9;黑底板块 / 白底板块交替;导航随板块换色。
 * 桌面尺寸按 1920 设计稿实测,px/19.2 转 vw。 */

@font-face { font-family:'CapCut Sans Text'; font-weight:400; font-display:swap;
  src:url(../assets/fonts/CapCutSansText-Regular.woff2) format('woff2'); }
@font-face { font-family:'CapCut Sans Text'; font-weight:700; font-display:swap;
  src:url(../assets/fonts/CapCutSansText-Bold.woff2) format('woff2'); }
@font-face { font-family:'CapCut Sans Text'; font-weight:900; font-display:swap;
  src:url(../assets/fonts/CapCutSansText-Black.woff2) format('woff2'); }

:root {
  --paper:#f8fcff;
  --ink:#000000;
  --ink-2:#3d3d42;
  --cyan:#3ce6e9;
  --sans:'CapCut Sans Text',-apple-system,BlinkMacSystemFont,'Helvetica Neue','Segoe UI',Roboto,Arial,sans-serif;
  --disp:'CapCut Sans Text',var(--sans);
  --ease-k:cubic-bezier(.16,1,.3,1);
  --ease-slot:cubic-bezier(.22,.61,.36,1);
  --nav-h:clamp(60px,4.8vw,92px);
}
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html, body { overflow-x:clip; }
body { font-family:var(--sans); font-weight:400; color:var(--ink-2);
  background:var(--paper); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
button { font-family:inherit; }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }

/* ================= 顶部导航(随板块换色) ================= */
.nav { position:fixed; inset:0 0 auto 0; z-index:100; display:flex; align-items:center;
  height:var(--nav-h); padding:0 clamp(20px,4.17vw,80px);
  gap:clamp(14px,1.8vw,34px);
  font-size:clamp(15px,1.46vw,28px);
  border-bottom:1px solid transparent;
  transition:background .45s ease, color .45s ease, border-color .45s ease; }
.nav .brand { display:flex; align-items:center; gap:clamp(10px,.94vw,18px); font-weight:500;
  letter-spacing:.01em; }
.brand-logo { display:block; width:clamp(96px,7.24vw,139px); aspect-ratio:140/29;
  background:currentColor;
  -webkit-mask:url(../assets/logo.svg) no-repeat center/contain;
          mask:url(../assets/logo.svg) no-repeat center/contain; }
.brand-sep { width:1px; height:1.15em; background:currentColor; opacity:.35; }
.nav .spacer { flex:1; }
.nav .menu { display:flex; align-items:center; gap:clamp(16px,1.77vw,34px); font-weight:500; }
.nav .menu 
.nav .menu a { opacity:.85; transition:opacity .2s; }
@media (hover:hover) and (pointer:fine) { .nav .menu a:hover { opacity:1; } }
.nav .menu a.active { font-weight:800; opacity:1; }
.apply-btn { background:var(--cyan); color:#000; font-weight:800; letter-spacing:.02em;
  display:flex; align-items:center; justify-content:center;
  width:clamp(90px,6.82vw,131px); height:clamp(30px,2.34vw,45px);
  border-radius:999px; font-size:clamp(13px,1.25vw,24px);
  transition:transform .15s ease, box-shadow .25s ease; }
@media (hover:hover) and (pointer:fine) {
  .apply-btn:hover { transform:translateY(-1px); box-shadow:0 6px 20px rgba(60,230,233,.45); }
}
/* 主题:light=白底板块(黑字) dark=黑底板块(白字) */
.nav[data-theme="light"] { color:#000; background:rgba(248,252,255,.85); border-bottom-color:rgba(0,0,0,.1);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.nav[data-theme="dark"]  { color:#fff; background:rgba(0,0,0,.55); border-bottom-color:rgba(255,255,255,.16);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.js .nav { opacity:0; transition:opacity .9s ease .15s, background .45s ease, color .45s ease, border-color .45s ease; }
.js body.kv-ready .nav { opacity:1; }
/* 移动端汉堡 */
.burger { display:none; background:none; border:0; width:40px; height:40px;
  flex-direction:column; align-items:center; justify-content:center; gap:5px; cursor:pointer; color:inherit; }
.burger span { display:block; width:22px; height:2px; background:currentColor; border-radius:2px;
  transition:transform .3s ease, opacity .2s; }
.burger[aria-expanded="true"] span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.m-menu { position:fixed; inset:0; z-index:99; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:34px; font-size:26px; font-weight:700;
  background:rgba(0,0,0,.92); color:#fff; opacity:0; pointer-events:none; transition:opacity .3s ease; }
.m-menu.open { opacity:1; pointer-events:auto; }
.m-menu .m-apply { background:var(--cyan); color:#000; padding:.45em 1.6em; border-radius:999px; }

/* ================= 板块通用 ================= */
.sec { position:relative; min-height:100vh; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  padding:calc(var(--nav-h) + clamp(20px,3vw,56px)) clamp(20px,2.6vw,48px) clamp(48px,6vh,80px); }
.sec-dark  { background:#000; color:#fff; }
.sec-light { background:var(--paper); color:var(--ink); }
.sec-head { text-align:center; margin-bottom:clamp(30px,3vw,56px); }
.sec-head h2 { font-family:var(--disp); font-weight:900; letter-spacing:-.02em;
  font-size:clamp(32px,3.9vw,75px); line-height:1.05; }
.sec-sub { margin-top:clamp(8px,.8vw,16px); font-size:clamp(14px,1.35vw,26px);
  line-height:1.4; letter-spacing:-.01em; color:#555; }
.sec-dark .sec-sub { color:rgba(255,255,255,.75); }
/* 板块过渡:渐显 + 轻微上移 */
.js .reveal { opacity:0; transform:translateY(44px);
  transition:opacity .95s ease, transform .95s var(--ease-k); }
.js .sec.in .reveal { opacity:1; transform:none; }
.js .sec.in .who-grid .reveal:nth-child(1), .js .sec.in .stage-grid .reveal:nth-child(1),
.js .sec.in .how-grid .reveal:nth-child(1) { transition-delay:.08s; }
.js .sec.in .who-grid .reveal:nth-child(2), .js .sec.in .stage-grid .reveal:nth-child(2),
.js .sec.in .how-grid .reveal:nth-child(2) { transition-delay:.18s; }
.js .sec.in .who-grid .reveal:nth-child(3), .js .sec.in .stage-grid .reveal:nth-child(3),
.js .sec.in .how-grid .reveal:nth-child(3) { transition-delay:.28s; }
.js .sec.in .who-grid .reveal:nth-child(4) { transition-delay:.38s; }

/* ================= 板块 1:首屏 ================= */
.hero { position:relative; height:100vh; min-height:640px; overflow:hidden; background:var(--paper); }
#hero-gl { position:absolute; inset:0; z-index:1; pointer-events:none; }
#hero-gl canvas { position:absolute; inset:0; width:100%!important; height:100%!important; display:block; }
.hero-copy { position:absolute; left:0; right:0; top:74.5vh; z-index:2; text-align:center;
  padding:0 5vw; pointer-events:none; }
.hero-title { font-family:var(--disp); font-weight:900; letter-spacing:-.02em;
  font-size:clamp(34px,4.45vw,85px); line-height:1.1; color:var(--ink); }
.hero-sub { margin-top:clamp(12px,2.55vw,49px); font-size:clamp(14px,1.4vw,27px);
  line-height:1.4; color:#26262a; }
.js .hero-title { opacity:0; transform:translateY(26px); transition:opacity .9s ease .1s, transform .9s var(--ease-k) .1s; }
.js .hero-sub { opacity:0; transform:translateY(20px); transition:opacity .9s ease .3s, transform .9s var(--ease-k) .3s; }
.js body.kv-ready .hero-title, .js body.kv-ready .hero-sub { opacity:1; transform:none; }
.hero-fallback { display:none; }
.no-gl .hero-fallback { display:block; position:absolute; left:50%; top:38%; z-index:1;
  width:min(38vh,66vw); transform:translate(-50%,-50%); }

/* ================= 板块 2:Who ================= */
.who-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,2.76vw,53px);
  width:92vw; }
.who-card { position:relative; border-radius:clamp(14px,1.25vw,24px); overflow:hidden;
  background:#fff; color:var(--ink); cursor:default; display:flex; flex-direction:column;
  transition:transform .4s var(--ease-k), box-shadow .4s ease; }
/* 上浮需压过 .reveal 的 transform:none 及 :nth-child 进场延迟(0-6-0),故提权到同级且位置靠后;
   hover 效果仅桌面端(触屏无 hover,避免点按粘连出怪态) */
@media (hover:hover) and (pointer:fine) {
  .js .sec.in .who-grid .who-card:hover { transform:translateY(clamp(-12px,-0.52vw,-8px));
    box-shadow:0 18px 44px rgba(0,0,0,.4);
    transition:transform .35s var(--ease-k) 0s, box-shadow .35s ease 0s; }
  .who-card:hover .who-img img { transform:scale(1.04); }
}
.who-img { overflow:hidden; flex:none; }
.who-img img { width:100%; display:block; aspect-ratio:39/50; object-fit:cover;
  object-position:top; transition:transform .5s var(--ease-k); } /* 裁掉图底部白浪空区,文字不再压图 */
.who-text { position:relative; z-index:1; flex:1; display:flex; flex-direction:column;
  justify-content:flex-end; text-align:center;
  margin-top:clamp(-30px,-1.56vw,-20px); padding:0 12px clamp(14px,1.77vw,34px); }
.who-text h3 { font-family:var(--disp); font-weight:800; letter-spacing:-.01em;
  font-size:clamp(16px,1.46vw,28px); line-height:1.2; margin-bottom:.3em; color:#111; }
.who-text p { font-size:clamp(12px,1.15vw,22px); line-height:1.3; color:#555; }

/* ================= 板块 3:五卡槽位轮播 ================= */
#niche { padding-left:0; padding-right:0; }
#niche .sec-head { padding:0 clamp(20px,2.6vw,48px); }
.niche-stage { position:relative; width:100%; height:clamp(320px,28.6vw,550px); }
.niche-item { position:absolute; left:50%; top:0; height:23.96vw; max-height:460px;
  will-change:transform,height,width,opacity;
  transition:transform .9s var(--ease-slot), height .9s var(--ease-slot),
    width .9s var(--ease-slot), opacity .55s ease; }
.niche-card { height:100%; display:flex; gap:clamp(4px,.47vw,9px);
  background:#f1f1f1; padding:clamp(6px,.52vw,10px);
  border-radius:clamp(10px,.83vw,16px);
  box-shadow:0 10px 30px rgba(0,0,0,.07); }
.niche-card img, .niche-card video { flex:none; height:100%; width:auto; display:block;
  border-radius:clamp(6px,.42vw,8px); object-fit:cover; background:#000; }
/* 贴纸卡:黑底 2×2 透明 GIF */
.niche-card.sticker-card { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr;
  background:#000; }
.niche-card.sticker-card img { width:100%; height:100%; object-fit:contain; background:none;
  border-radius:0; }
/* Caption / Text template:2×2 视频网格卡(与其他卡统一灰底) */
.niche-card.grid-card { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; }
.niche-card.grid-card video { width:100%; height:100%; object-fit:cover; }
.niche-cap { position:absolute; top:calc(100% + clamp(10px,.83vw,16px)); left:0; white-space:nowrap; }
.niche-cap h3 { font-family:var(--disp); font-weight:800; font-size:clamp(15px,1.35vw,26px);
  letter-spacing:-.01em; color:#111; line-height:1.2; }
.niche-cap p { font-size:clamp(12px,1.15vw,22px); color:#888; margin-top:2px; line-height:1.2; }

/* ================= 板块 4:成长阶梯 ================= */
#benefits .sec-head { margin-bottom:clamp(40px,7.1vw,136px); }
.stage-grid { display:grid; grid-template-columns:repeat(3,1fr); align-items:end;
  gap:clamp(16px,1.72vw,33px); width:67.3vw; min-width:900px; }
.stage-card { position:relative; border-radius:clamp(14px,1.25vw,24px); overflow:hidden;
  padding:clamp(40px,5.2vw,100px) clamp(18px,1.6vw,30px) clamp(30px,3.3vw,64px) clamp(24px,2.55vw,49px);
  color:#111; display:flex; flex-direction:column;
  transition:transform .4s var(--ease-k); }
/* 上浮需压过 .reveal 的 transform:none 及 :nth-child 进场延迟(0-6-0),故提权到同级且位置靠后;
   hover 效果仅桌面端 */
@media (hover:hover) and (pointer:fine) {
  .js .sec.in .stage-grid .stage-card:hover { transform:translateY(clamp(-12px,-0.52vw,-8px));
    transition:transform .35s var(--ease-k) 0s; }
}
.s1 { padding-top:clamp(55px,5.5vw,106px); }
.s2 { padding-top:clamp(30px,2.9vw,55px); }
.s3 { padding-top:clamp(50px,5.2vw,100px); }
.stage-ghost { position:absolute; top:-.04em; right:-.09em;
  font-family:var(--disp); font-weight:900; font-size:clamp(140px,14.06vw,270px);
  line-height:.75; pointer-events:none; user-select:none; }
.s1 .stage-ghost { color:#f0f0f0; }
.s2 .stage-ghost { color:#cececf; }
.s3 .stage-ghost { color:#eff3f5; }
/* 卡片为纵向 flex 容器,默认 align-items:stretch 会把 img 横向撑满 → 必须自对齐回左、保持原始宽高比 */
.stage-coin { height:clamp(52px,4.3vw,83px); width:auto; align-self:flex-start; margin-left:-.4vw; }
.stage-no { font-size:clamp(16px,1.56vw,30px); font-weight:500; color:#111; }
.stage-card h3 { font-family:var(--disp); font-weight:900; letter-spacing:-.01em;
  font-size:clamp(26px,2.5vw,48px); line-height:1.05; color:#111;
  margin:.22em 0 clamp(22px,2.2vw,42px); }
/* 列表撑满卡片剩余高度并两端分布:三卡的末行文案底边对齐(平齐),间距随条目数自适应 */
.stage-list { flex:1; display:flex; flex-direction:column; justify-content:space-between;
  gap:clamp(10px,.8vw,16px);
  font-size:clamp(14px,1.04vw,20px); line-height:1.25; color:#111; }
.stage-list b { font-weight:800; }
.s1 { background:#c6c6c6; height:clamp(300px,24.64vw,473px); }
/* s2 内容比 s1/s3 多一行,1920px 下会溢出 ~6px(高度 vw 项 527px < 内容 532.7px)
 * → 系数提到 27.75vw(高度 532.8px),保证末行与其余两卡严格同线 */
.s2 { background:#dfdfdf; height:clamp(340px,27.75vw,536px); }
/* s3 有 2px 描边会吃掉内容盒 → 底 padding 减 2px 补偿,三张卡末行文字底边严格同线 */
.s3 { background:#f8fcff; border:2px solid #4ee4f4; height:clamp(370px,30.26vw,581px);
  padding-bottom:calc(clamp(30px,3.3vw,64px) - 2px); }

/* ================= 板块 5:Voices 轮播 ================= */
#voices .sec-head { margin-bottom:clamp(24px,4.3vw,83px); }
.voices-stage { position:relative; width:100%; }
.v-viewport { position:relative; width:100%; height:clamp(500px,37vw,710px); }
.v-card { position:absolute; left:50%; top:50%; width:clamp(320px,24.48vw,470px);
  height:clamp(380px,29vw,557px);
  background:#f8fcff; border:1px solid #bdeff7; border-radius:clamp(12px,.94vw,18px);
  padding:clamp(24px,2.9vw,56px); display:flex; flex-direction:column;
  pointer-events:none;
  will-change:transform,opacity;
  transition:transform .8s var(--ease-slot), opacity .55s ease; }
.v-quote { font-family:var(--disp); font-weight:900; font-size:clamp(24px,1.9vw,36px);
  line-height:.5; color:var(--cyan); user-select:none; }
.v-quote.top { align-self:flex-start; margin-bottom:.9em; }
.v-quote.bot { align-self:flex-end; margin-top:.6em; transform:scaleY(-1); }
.v-text { font-size:clamp(15px,1.25vw,24px); line-height:1.5; color:#111; }
.v-text.long { font-size:clamp(13px,.99vw,19px); }
.v-who { margin-top:auto; }
.v-who img { width:clamp(64px,5.7vw,110px); height:auto; border-radius:50%; }
.v-who p { font-family:var(--disp); font-weight:800; font-size:clamp(13px,1.15vw,22px);
  color:#111; letter-spacing:-.01em; margin-top:clamp(10px,.94vw,18px); }
.v-arrow { position:absolute; z-index:20; top:50%; transform:translateY(-50%);
  width:clamp(40px,3vw,56px); height:clamp(40px,3vw,56px); border-radius:50%;
  border:0; background:transparent; color:#111; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s, transform .2s; }
.v-arrow svg { width:clamp(20px,1.56vw,30px); height:auto; }
@media (hover:hover) and (pointer:fine) {
  .v-arrow:hover { background:rgba(60,230,233,.18); transform:translateY(-50%) scale(1.08); }
}
/* 扣除 .sec 横向内边距 clamp(20px,2.6vw,48px),圆形按钮贴近屏幕两侧(略内收) */
.v-prev { left:calc(clamp(10px,2.9vw,54px) - clamp(20px,2.6vw,48px)); }
.v-next { right:calc(clamp(10px,2.9vw,54px) - clamp(20px,2.6vw,48px)); }

/* ================= 板块 6:三步流程 ================= */
#how .sec-head { margin-bottom:clamp(50px,9.1vw,175px); }
.how-grid { display:grid; grid-template-columns:1fr 1.11fr 1.1fr; gap:clamp(16px,2vw,38px);
  width:71.9vw; min-width:960px; align-items:start; }
.how-step { border-left:2px solid #737373; padding-left:clamp(12px,.99vw,19px);
  min-height:clamp(340px,27.1vw,521px); }
.hs1 { padding-top:clamp(150px,15.57vw,299px); }
.hs2 { padding-top:clamp(96px,10vw,192px); }
.hs3 { padding-top:0; }
.how-no { font-family:var(--disp); font-weight:800; color:var(--cyan);
  font-size:clamp(20px,2.08vw,40px); letter-spacing:.01em; line-height:1.1; }
.how-step h3 { font-family:var(--disp); font-weight:900; color:#fff;
  font-size:clamp(24px,2.29vw,44px); letter-spacing:-.01em; line-height:1.1;
  margin:.27em 0 .18em; }
.how-bar { display:block; height:clamp(6px,.52vw,10px); background:var(--cyan);
  margin-left:calc(-1 * clamp(12px,.99vw,19px) - 2px);
  margin-bottom:clamp(20px,1.88vw,36px); }
.hs1 .how-bar { width:clamp(180px,17.8vw,342px); }
.hs2 .how-bar { width:clamp(230px,22.9vw,439px); }
.hs3 .how-bar { width:clamp(230px,23.1vw,443px); }
.how-desc { font-size:clamp(15px,1.35vw,26px); line-height:1.35; color:#fff; }

/* ================= 板块 7:报名表单 ================= */
.sec-form { background:#000 url(../assets/form-bg.jpg) center/cover no-repeat; }
.form-wrap { position:relative; z-index:1; width:100%; max-width:1504px; }
.sec-form .sec-head h2 { color:#fff; }
.sec-form .sec-sub { color:#e8e8ec; font-size:clamp(13px,1.04vw,20px); }
.sec-form .sec-head { margin-bottom:clamp(40px,5.4vw,103px); }
.apply-form { display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(14px,1.1vw,21px) clamp(20px,2.55vw,49px); }
.f-field label { display:block; font-size:clamp(13px,.97vw,19px); font-weight:500;
  color:#fff; margin-bottom:.68em; letter-spacing:.01em; }
.f-field label i { color:var(--cyan); font-style:normal; margin-left:2px; }
/* UID 获取方式:问号徽标 + 悬浮小弹窗(触屏点按切换) */
.uid-tip { position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:1.15em; height:1.15em; margin-left:.4em; vertical-align:-.12em;
  border-radius:50%; background:rgba(255,255,255,.22); color:#fff;
  font-size:.82em; font-weight:700; cursor:help; user-select:none; }
.uid-tip-pop { position:absolute; left:50%; bottom:calc(100% + 10px); transform:translateX(-50%) translateY(4px);
  width:max-content; max-width:min(84vw,340px); white-space:normal; text-align:left;
  background:#fff; color:#111; font-size:14px; font-weight:400; line-height:1.5;
  padding:12px 16px; border-radius:10px; box-shadow:0 12px 36px rgba(0,0,0,.4);
  opacity:0; visibility:hidden; transition:opacity .2s ease, transform .2s ease, visibility .2s;
  pointer-events:none; z-index:30; text-transform:none; letter-spacing:0; }
.uid-tip-pop::after { content:''; position:absolute; top:100%; left:50%; margin-left:-6px;
  border:6px solid transparent; border-top-color:#fff; }
.uid-tip-pop b { font-weight:700; }
@media (hover:hover) and (pointer:fine) {
  .uid-tip:hover .uid-tip-pop { opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
}
.uid-tip:focus .uid-tip-pop, .uid-tip.open .uid-tip-pop,
.uid-tip:focus-within .uid-tip-pop { opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.f-field input[type="text"], .f-field input[type="email"], .f-select select {
  width:100%; height:clamp(40px,2.76vw,53px); background:#fff; border:2px solid transparent;
  border-radius:clamp(8px,.52vw,10px); padding:0 clamp(12px,1vw,19px);
  font-size:clamp(13px,.94vw,18px); color:#111; outline:none; font-family:inherit;
  appearance:none; -webkit-appearance:none; transition:border-color .2s, box-shadow .2s; }
.f-field input:focus, .f-select select:focus { border-color:var(--cyan);
  box-shadow:0 0 0 4px rgba(60,230,233,.25); }
.f-field.err input, .f-field.err select, .f-field.err .f-multi-btn { border-color:#ff7070; }
/* 多选(creation direction) + 单选(country / skills) 自定义下拉 */
.f-multi { position:relative; }
.f-multi-btn { width:100%; height:clamp(40px,2.76vw,53px); background:#fff;
  border:2px solid transparent; border-radius:clamp(8px,.52vw,10px);
  padding:0 clamp(12px,1vw,19px); display:flex; align-items:center; justify-content:space-between;
  font-size:clamp(13px,.94vw,18px); color:#111; cursor:pointer; text-align:left; }
.f-multi-btn span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.f-multi-panel { position:absolute; top:calc(100% + 8px); left:0; right:0; z-index:20;
  background:#fff; border-radius:clamp(8px,.52vw,10px); padding:10px;
  box-shadow:0 18px 50px rgba(0,0,0,.45); display:none; }
.f-multi.open .f-multi-panel { display:block; }
.f-multi-panel label { display:flex; align-items:center; gap:12px; margin:0; padding:12px 14px;
  border-radius:10px; font-size:clamp(13px,.9vw,17px); color:#111; cursor:pointer;
  transition:background .15s; }
@media (hover:hover) and (pointer:fine) { .f-multi-panel label:hover { background:#eefcfd; } }
.f-multi-panel input { width:18px; height:18px; accent-color:#12b8bb; cursor:pointer; }
/* 下拉面板限高滚动(单选/多选统一,防超出底边) */
.f-multi-panel { max-height:clamp(190px,14.6vw,280px); overflow-y:auto; }
.f-single-panel button { display:block; width:100%; text-align:left; border:0; background:none;
  padding:12px 14px; border-radius:10px; font-size:clamp(13px,.9vw,17px); color:#111;
  cursor:pointer; transition:background .15s; }
@media (hover:hover) and (pointer:fine) { .f-single-panel button:hover { background:#eefcfd; } }
.f-single-panel button.on { background:#d9f6f7; font-weight:600; }
.hp { position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0; }
.f-submit { grid-column:1 / -1; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; }
.f-error { color:#ff8a8a; font-size:clamp(12px,.85vw,16px); min-height:1.4em;
  margin-bottom:4px; align-self:flex-start; }
.join-btn { width:min(100%,clamp(240px,20.3vw,390px)); height:clamp(46px,2.9vw,56px);
  background:var(--cyan); border:0; border-radius:999px; color:#000;
  font-family:var(--disp); font-weight:900; font-size:clamp(18px,1.67vw,32px);
  letter-spacing:.02em; cursor:pointer;
  transition:transform .15s ease, box-shadow .25s ease, opacity .2s; }
@media (hover:hover) and (pointer:fine) {
  .join-btn:hover { transform:translateY(-2px); box-shadow:0 10px 34px rgba(60,230,233,.5); }
}
.join-btn:active { transform:scale(.98); }
.join-btn[disabled] { opacity:.55; cursor:not-allowed; transform:none; box-shadow:none; }
.form-foot { margin-top:clamp(36px,4.1vw,78px); text-align:center;
  font-size:clamp(12px,.83vw,16px); color:#c9c9cf; }
.apply-success { display:none; text-align:center; padding:clamp(40px,8vh,90px) 0; }
.apply-success .check { width:84px; height:84px; margin:0 auto 30px; border-radius:50%;
  border:2px solid var(--cyan); display:flex; align-items:center; justify-content:center; }
.apply-success h3 { font-family:var(--disp); font-weight:900; color:#fff;
  font-size:clamp(30px,3vw,54px); margin-bottom:14px; }
.apply-success p { color:#c9c9cf; font-size:clamp(14px,1.1vw,19px); line-height:1.7; }

/* 仅移动端生效的换行符 / who 轮播圆点(桌面端隐藏) */
.m-br { display:none; }
.who-dots { display:none; }

/* ================= 移动端 ================= */
@media (max-width:768px) {
  :root { --nav-h:56px; }
  .nav { padding:0 16px; }
  .nav .menu { display:none; }
  .nav .apply-btn { display:none; }
  .burger { display:flex; }

  .sec { padding:88px 20px 64px; min-height:100vh; }
  .sec-head { margin-bottom:38px; }
  .sec-sub br { display:none; }
  .sec-sub .m-br, .who-text .m-br, .form-foot .m-br { display:block; }   /* 移动端指定位置强制换行 */

  /* 板块1:球簇偏上,文案在下 */
  .hero { min-height:600px; height:100svh; }
  .hero-copy { top:auto; bottom:7.5svh; }
  .hero-sub br { display:none; }
  .hero-sub { padding:0 4vw; }

  /* 板块2:撑满一屏居中;单卡横向滑动(一屏一张,scroll-snap 居中,两侧露出约9vw相邻卡提示可滑) */
  #who { min-height:100svh; justify-content:center; }
  .who-grid { display:flex; gap:4vw; width:calc(100% + 40px); margin:0 -20px; padding:6px 13vw 14px;
    overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none;
    -webkit-overflow-scrolling:touch; }
  .who-grid::-webkit-scrollbar { display:none; }
  .who-card { flex:0 0 74vw; scroll-snap-align:center; display:flex; flex-direction:column; }
  .who-img { flex:none; }
  .who-img img { aspect-ratio:39/50; object-fit:cover; object-position:top; } /* 裁掉图底部白浪空区 */
  .who-text { position:relative; z-index:1; padding:14px 12px 28px; margin-top:-24px; }
  .who-text br { display:none; }
  .who-text h3 { font-size:17px; }
  .who-text p { font-size:12px; }
  .who-dots { display:flex; justify-content:center; gap:7px; margin-top:16px; }
  .who-dots span { width:6px; height:6px; border-radius:50%;
    background:rgba(255,255,255,.28); transition:background .25s; }
  .who-dots span.on { background:var(--cyan); }

  /* 板块3:白底撑满一屏,轮播图片放大(高度由 JS 按 vw 设置) */
  #niche { min-height:100svh; justify-content:center; background:#fff;
    padding-top:70px; padding-bottom:44px; }
  #niche .sec-head { margin-bottom:30px; }
  .niche-stage { height:calc(46vw + 48px); }
  .niche-cap h3 { font-size:15px; }

  /* 板块4:三卡统一 200px 等高;钱币右上,幽灵数字右下卡内 */
  #benefits .sec-head { margin-bottom:24px; }
  .stage-grid { grid-template-columns:1fr; gap:12px; width:100%; min-width:0; }
  .stage-card { height:200px; padding:15px 18px 16px 20px;
    border-radius:16px; justify-content:center; }
  .s1, .s2, .s3 { width:100%; }
  .s3 { border:0; box-shadow:inset 0 0 0 2px #4ee4f4; } /* 内阴影描边不占布局,保证三卡严格等高 */
  .stage-ghost { font-size:72px; top:auto; bottom:.03em; right:-.03em; } /* 挪到右下作水印,让出右上给钱币 */
  .stage-coin { position:absolute; top:16px; right:18px; height:30px; margin:0; }
  .stage-no { font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:#777; }
  .stage-card h3 { font-size:21px; margin:1px 0 9px; }
  .stage-list { flex:none; gap:5px; font-size:13px; line-height:1.35; justify-content:flex-start; }
  .stage-list br { display:none; }
  .stage-list p { position:relative; padding-left:13px; }
  .stage-list p::before { content:''; position:absolute; left:0; top:.5em;
    width:5px; height:5px; border-radius:50%; background:var(--cyan); }

  /* 板块5:单卡轮播(卡片高度随内容,头像紧跟文字,不再大面积留白) */
  #voices .sec-head { margin-bottom:24px; }
  .v-viewport { height:500px; }
  .v-card { width:min(84vw,360px); height:auto; padding:26px 24px; }
  .v-who { margin-top:32px; }
  .v-quote { font-size:26px; }
  .v-text { font-size:16px; }
  .v-who img { width:72px; }
  .v-who p { font-size:14px; }
  .v-arrow { width:40px; height:40px;
    background:rgba(255,255,255,.92); box-shadow:0 4px 14px rgba(0,0,0,.14); }
  .v-prev { left:4px; }
  .v-next { right:4px; }

  /* 板块6:竖向时间线(从上到下递进) */
  #how .sec-head { margin-bottom:30px; }
  .how-grid { grid-template-columns:1fr; gap:0; align-items:stretch; width:100%; min-width:0; }
  .how-step { border-left:2px solid #737373; min-height:0;
    padding:24px 0 24px 20px; position:relative; }
  .how-step::before { content:''; position:absolute; left:-5px; top:32px;
    width:8px; height:8px; border-radius:50%; background:var(--cyan); }
  .hs1 { width:86%; }
  .hs2 { width:93%; }
  .hs3 { width:100%; }
  .how-no { font-size:22px; }
  .how-step h3 { font-size:30px; }
  .how-bar { height:6px; margin-left:-22px; margin-bottom:16px; }
  .hs1 .how-bar { width:52%; }
  .hs2 .how-bar { width:66%; }
  .hs3 .how-bar { width:68%; }
  .how-desc { font-size:15px; margin-right:12px; }
  .how-desc br { display:none; }

  /* 板块7:单列表单 */
  .apply-form { grid-template-columns:1fr; gap:18px; }
  .f-submit { align-items:stretch; }
  .join-btn { width:100%; }
  .sec-form { background-position:center 30%; }
}
@media (max-width:380px) {
  .who-text h3 { font-size:16px; }
}

/* 减动效:直接给成品态 */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .js .reveal { opacity:1; transform:none; transition:none; }
  .js .hero-title, .js .hero-sub { opacity:1; transform:none; transition:none; }
  .js .nav { opacity:1; transition:none; }
  .niche-item, .v-card { transition:none; }
}
