/* ==========================================================================
   2038EPTS 官网 · 设计系统（深色科技风）
   Token 依据：doc/2038EPTS官网设计开发方案.md 第八节
     配色 = Radix Colors 暗色色阶 + 品牌足球绿；间距/字号/圆角 = Tailwind 标度
     动效 = Material Motion（进场 200–300ms / standard 缓动）
   ========================================================================== */

:root{
  /* ---- 颜色（第 8.2 节配色规范） ---- */
  --bg:#0b0f14;            /* 页面深底 */
  --bg-soft:#0e141b;
  --card:#121a24;          /* 卡片 / 悬浮层 */
  --card-2:#16202c;
  --line:#1f2a36;          /* 分隔线 / 边框 */
  --line-soft:#18232f;

  --text:#e6edf3;          /* 文字·主 */
  --text-dim:#9fb0c0;      /* 文字·次 */
  --text-mute:#6b7c8d;

  --green:#1fae5a;         /* 主色·足球绿 */
  --green-bright:#34e07a;  /* 高亮绿（数据/图表发光） */
  --green-soft:rgba(31,174,90,.12);
  --blue:#3b82f6;          /* 次色·数据蓝 */
  --blue-bright:#60a5fa;
  --blue-soft:rgba(59,130,246,.12);
  --amber:#eab308;
  --red:#ef4444;
  --fifa:#2b6cff;

  /* ---- 间距（Tailwind 4px 基准） ---- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px; --sp-16:64px;
  --sp-20:80px; --sp-24:96px;

  /* ---- 圆角 ---- */
  --r-sm:6px;
  --r-card:8px;
  --r-lg:14px;
  --r-pill:9999px;

  /* ---- 字阶（第 8.3 节） ---- */
  --fs-display:clamp(32px,5.2vw,56px);
  --fs-h1:clamp(26px,3.6vw,36px);
  --fs-h2:clamp(22px,2.6vw,28px);
  --fs-h3:18px;
  --fs-base:16px;
  --fs-sm:14px;
  --fs-xs:12px;

  /* ---- 其他 ---- */
  --container:1280px;
  --shadow:0 18px 48px rgba(0,0,0,.45);
  --shadow-sm:0 6px 18px rgba(0,0,0,.30);
  --ease:cubic-bezier(.2,0,0,1);
}

/* ========================= Reset ========================= */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:"Inter","Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  font-size:var(--fs-base);
  line-height:1.6;
  color:var(--text);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* 背景层①：环境光晕 + 顶部光弧 + 斜向光束（大气、微弱） */
body::before{
  content:"";
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(1200px 680px at 6% -14%, rgba(31,174,90,.20), transparent 60%),
    radial-gradient(1080px 620px at 96% -4%, rgba(59,130,246,.18), transparent 62%),
    radial-gradient(1300px 900px at 50% 122%, rgba(31,174,90,.10), transparent 66%),
    conic-gradient(from 205deg at 50% -18%, transparent 0deg, rgba(96,165,250,.06) 34deg, transparent 80deg);
}
/* 背景层②：细点阵 + 极淡网格 + 斜向光带（底纹质感） */
body::after{
  content:"";
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    radial-gradient(rgba(255,255,255,.030) 1px, transparent 1.3px),
    linear-gradient(rgba(31,42,54,.26) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31,42,54,.26) 1px, transparent 1px),
    linear-gradient(116deg, transparent 45%, rgba(96,165,250,.05) 50%, transparent 55%);
  background-size:22px 22px, 64px 64px, 64px 64px, 100% 100%;
  mask-image:radial-gradient(closest-side at 50% 24%, #000 0%, transparent 96%);
  -webkit-mask-image:radial-gradient(closest-side at 50% 24%, #000 0%, transparent 96%);
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p{margin:0}
ul{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit}

/* ========================= 布局 ========================= */
.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--sp-6);
  position:relative;
  z-index:1;
}
.section{padding-block:var(--sp-24)}
.section.tight{padding-block:var(--sp-16)}
/* 数字用等宽；栈尾补中文字体，避免中文单位（如「亿」）回退成宋体 */
.mono{font-variant-numeric:tabular-nums;font-family:"Geist Mono","JetBrains Mono",ui-monospace,Consolas,"PingFang SC","Microsoft YaHei",monospace}

/* 区块头 */
.section-head{max-width:720px;margin-bottom:var(--sp-10)}
.kicker{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  font-size:var(--fs-xs);letter-spacing:.14em;text-transform:uppercase;
  color:var(--green-bright);font-weight:600;margin-bottom:var(--sp-3);
}
.kicker::before{content:"";width:20px;height:2px;background:var(--green-bright);border-radius:2px}
.section-title{font-size:var(--fs-h2);line-height:1.3;font-weight:700;letter-spacing:-.01em}
.section-desc{color:var(--text-dim);margin-top:var(--sp-3);font-size:var(--fs-base)}

/* ========================= 按钮 ========================= */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);
  padding:12px 22px;border-radius:var(--r-pill);
  font-size:var(--fs-sm);font-weight:600;line-height:1;cursor:pointer;
  border:1px solid transparent;transition:transform .22s var(--ease),box-shadow .22s var(--ease),background .22s var(--ease),border-color .22s var(--ease);
  white-space:nowrap;
}
.btn .arrow{transition:transform .22s var(--ease)}
.btn:hover .arrow{transform:translateX(3px)}
.btn-primary{
  background:linear-gradient(180deg,var(--green-bright),var(--green));
  color:#04140b;box-shadow:0 10px 26px rgba(31,174,90,.30);
}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(31,174,90,.40)}
.btn-ghost{background:rgba(255,255,255,.02);border-color:var(--line);color:var(--text)}
.btn-ghost:hover{border-color:var(--green);color:var(--green-bright);transform:translateY(-2px)}
.btn-sm{padding:9px 16px;font-size:var(--fs-xs)}
.btn-lg{padding:16px 34px;font-size:18px}

/* ========================= 顶部导航 ========================= */
.site-header{
  position:sticky;top:0;z-index:50;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  background:rgba(11,15,20,.55);
  border-bottom:1px solid transparent;
  transition:background .3s var(--ease),border-color .3s var(--ease);
}
.site-header.scrolled{background:rgba(11,15,20,.86);border-bottom-color:var(--line)}
.header-inner{display:flex;align-items:center;gap:var(--sp-8);height:68px}
.brand{display:flex;align-items:center;gap:var(--sp-3);flex-shrink:0}
.brand-mark{
  width:32px;height:32px;border-radius:9px;flex-shrink:0;
  background:linear-gradient(145deg,var(--green-bright),#0f7a3f);
  display:grid;place-items:center;color:#04140b;font-weight:800;font-size:15px;
  box-shadow:0 6px 18px rgba(31,174,90,.35);
}
.brand-text{display:flex;flex-direction:column;line-height:1.15}
.brand-logo{height:34px;width:auto;display:block;flex-shrink:0}
.brand-name{font-weight:800;letter-spacing:.02em;font-size:20px}
.brand-sub{font-size:11px;color:var(--text-mute);letter-spacing:.06em}

.nav{display:flex;align-items:center;gap:var(--sp-1);margin-left:auto}
.nav-link{
  position:relative;padding:8px 12px;border-radius:var(--r-sm);
  font-size:var(--fs-sm);color:var(--text-dim);
  transition:color .2s var(--ease),background .2s var(--ease);
}
.nav-link:hover,.nav-link.active{color:var(--text);background:rgba(255,255,255,.04)}
.nav-item{position:relative}
.nav-item > .nav-link{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.caret{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.6;transition:transform .25s var(--ease)}
.drop-menu{
  position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%,8px);
  min-width:230px;padding:var(--sp-2);
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow);
  opacity:0;visibility:hidden;transition:opacity .22s var(--ease),transform .22s var(--ease),visibility .22s;
}
.nav-item:hover .drop-menu,.nav-item.open .drop-menu{opacity:1;visibility:visible;transform:translate(-50%,0)}
.nav-item:hover .caret{transform:rotate(45deg) translateY(1px) scaleY(-1)}
.drop-menu a{
  display:flex;align-items:center;gap:var(--sp-3);padding:10px 12px;border-radius:var(--r-sm);
  font-size:var(--fs-sm);color:var(--text-dim);transition:background .18s var(--ease),color .18s var(--ease);
}
.drop-menu a:hover{background:rgba(255,255,255,.04);color:var(--text)}
.drop-menu .dm-ic{
  width:26px;height:26px;border-radius:7px;flex-shrink:0;display:grid;place-items:center;
  background:rgba(255,255,255,.06);border:1px solid var(--line);
}
/* 下拉项图标（用户提供的 png，白色线条图） */
.drop-menu .dm-ic img{width:20px;height:20px;object-fit:contain;display:block}
.header-cta{display:flex;align-items:center;gap:var(--sp-3);flex-shrink:0}
.nav-toggle{display:none;width:40px;height:40px;border:1px solid var(--line);background:transparent;border-radius:var(--r-sm);cursor:pointer}
.nav-toggle span{display:block;width:16px;height:2px;background:var(--text);margin:3px auto;border-radius:2px;transition:.22s var(--ease)}
.nav-toggle.open span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}

/* 语言切换（导航右上角，位于「预约演示」按钮右侧） */
.lang-switch{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 10px;border-radius:var(--r-pill);
  border:1px solid var(--line);background:rgba(255,255,255,.03);
  color:var(--text-dim);font-size:var(--fs-sm);line-height:1;cursor:pointer;
  transition:border-color .2s var(--ease),color .2s var(--ease),background .2s var(--ease);
}
.lang-switch:hover,.lang-switch:focus-visible{border-color:rgba(31,174,90,.45);color:var(--text);background:rgba(31,174,90,.08)}
.lang-flag{width:18px;height:12px;border-radius:2px;display:block;flex-shrink:0}
.lang-text{font-weight:600;letter-spacing:.02em;white-space:nowrap}
/* 平板 / 小屏笔记本（≤1080px）：语言按钮只留国旗。
   否则多出的宽度会与导航争抢空间，导致导航项文字折行（如「首 页」「解决方 案」）。 */
@media (max-width:1080px){
  .lang-switch{padding:6px 8px}
  .lang-text{display:none}
}
/* 小屏（≤860px）：头部整体改为紧凑排列
   ★ 关键：品牌区原先 flex-shrink:0 且带副标题（英文副标题更长），会把右侧「预约演示 + 语言 + 菜单」
     整组顶出屏幕，导致最右侧菜单按钮看不见。这里收窄间隙、收起副标题，并让菜单按钮不可压缩。 */
@media (max-width:860px){
  /* 主间隙与左右内边距一并收窄，把横向空间还给右侧按钮组（原先 24px 内边距太吃空间） */
  .header-inner{gap:var(--sp-2);padding-inline:var(--sp-4)}
  /* 品牌区：★ 允许收缩（原 .brand{flex-shrink:0} 会让右侧按钮组整体溢出屏幕）；
     同时收起副标题、缩 logo 与名称，极端情况下品牌名截断而不是把按钮顶出屏幕 */
  .brand{flex-shrink:1;min-width:0;overflow:hidden;gap:var(--sp-2)}
  .brand-logo{height:24px}
  .brand-text{min-width:0;overflow:hidden}
  .brand-name{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .brand-sub{display:none}
  /* 右侧按钮组：紧凑排列；按钮与菜单按钮都不收缩，保证完整可见 */
  .header-cta{gap:6px}
  .header-cta .btn-sm{padding:7px 11px;font-size:12px;white-space:nowrap;flex-shrink:0}
  .lang-switch{padding:5px 7px;flex-shrink:0}
  .lang-text{display:none}
  .nav-toggle{flex-shrink:0}
}
/* 极窄屏（≤380px）：品牌文字整体收起，只保留 logo，确保按钮全部留在屏内 */
@media (max-width:380px){
  .brand-text{display:none}
}

/* ========================= Hero ========================= */
.hero{position:relative;overflow:hidden;min-height:670px;padding-top:var(--sp-20);padding-bottom:var(--sp-16)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--sp-16);align-items:center}
.eyebrow{
  display:inline-flex;align-items:center;gap:var(--sp-3);
  padding:6px 14px 6px 6px;border:1px solid var(--line);border-radius:var(--r-pill);
  font-size:var(--fs-xs);color:var(--text-dim);margin-bottom:var(--sp-6);
  background:rgba(255,255,255,.02);
}
.eyebrow b{color:var(--text)}
.pill-fifa{
  padding:4px 10px;border-radius:var(--r-pill);font-weight:700;font-size:var(--fs-xs);
  background:linear-gradient(135deg,rgba(43,108,255,.22),rgba(31,174,90,.22));
  border:1px solid rgba(96,165,250,.35);color:#cfe1ff;
}
.hero-title{font-size:var(--fs-display);line-height:1.08;font-weight:800;letter-spacing:-.02em}
/* 高亮短语整体不拆行（英文短语如 “at a glance” 保持完整，中文无影响） */
.hero-title .hl{white-space:nowrap}
.hero-title .hl{
  background:linear-gradient(120deg,var(--green-bright),var(--blue-bright));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-sub{margin-top:var(--sp-6);font-size:clamp(16px,1.4vw,18px);color:var(--text-dim);max-width:540px}
.trust-badges{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-6)}
.badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:var(--r-pill);
  background:rgba(255,255,255,.03);border:1px solid var(--line);
  font-size:var(--fs-sm);color:var(--text-dim);
}
.badge .dot{width:6px;height:6px;border-radius:50%;background:var(--green-bright);box-shadow:0 0 10px var(--green-bright)}
.hero-cta{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-8)}

/* Hero 背景实拍图：高度铺满、靠右约 60% 宽，左侧渐隐让出文字区；文字浮于其上 */
.hero-bg{position:absolute;top:0;right:0;bottom:0;width:66%;z-index:0;pointer-events:none;overflow:hidden}
.hero-bg img{
  width:100%;height:100%;object-fit:cover;object-position:center right;display:block;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 32%);
  mask-image:linear-gradient(90deg, transparent 0, #000 32%);
}
.hero-bg::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(11,15,20,.85) 0, rgba(11,15,20,0) 20%, rgba(11,15,20,0) 78%, rgba(11,15,20,.9) 100%);
}
/* 文字区深色遮罩：左侧厚实（稳住文字）、向右透明度渐升直至透明，与背景图柔和衔接 */
.hero-veil{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(90deg,
    rgba(11,15,20,.97) 0%,
    rgba(11,15,20,.93) 24%,
    rgba(11,15,20,.72) 44%,
    rgba(11,15,20,.38) 62%,
    rgba(11,15,20,.12) 76%,
    rgba(11,15,20,0) 88%);
}

/* Hero 右侧：实时监测大屏 mock */
.mock{
  position:relative;border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  box-shadow:var(--shadow);overflow:hidden;
}
.mock::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(400px 200px at 80% 0%, rgba(31,174,90,.14), transparent 70%);
}
.mock-bar{display:flex;align-items:center;gap:var(--sp-3);padding:14px 18px;border-bottom:1px solid var(--line-soft)}
.mock-dots{display:flex;gap:6px}
.mock-dots i{width:9px;height:9px;border-radius:50%;background:var(--line);display:block}
.mock-dots i:nth-child(1){background:#ff5f57}.mock-dots i:nth-child(2){background:#febc2e}.mock-dots i:nth-child(3){background:#28c840}
.mock-title{font-size:var(--fs-xs);color:var(--text-mute);letter-spacing:.04em}
.mock-live{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-xs);color:var(--green-bright)}
.mock-live .pulse{width:7px;height:7px;border-radius:50%;background:var(--green-bright);animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(52,224,122,.5)}70%{box-shadow:0 0 0 8px rgba(52,224,122,0)}100%{box-shadow:0 0 0 0 rgba(52,224,122,0)}}
.mock-body{padding:var(--sp-4) var(--sp-4) var(--sp-5)}
.row-player{display:grid;grid-template-columns:1fr 92px 64px 58px;align-items:center;gap:var(--sp-3);padding:10px 4px;border-bottom:1px solid var(--line-soft)}
.row-player:last-child{border-bottom:0}
.p-name{display:flex;align-items:center;gap:8px;font-size:var(--fs-sm)}
.p-no{width:22px;height:22px;border-radius:6px;background:rgba(255,255,255,.05);display:grid;place-items:center;font-size:11px;color:var(--text-dim);flex-shrink:0}
.p-pos{font-size:11px;color:var(--text-mute);margin-left:2px}
.hr-track{height:6px;border-radius:6px;background:rgba(255,255,255,.06);overflow:hidden}
.hr-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--green),var(--green-bright))}
.hr-fill.warn{background:linear-gradient(90deg,var(--amber),#f59e0b)}
.hr-fill.danger{background:linear-gradient(90deg,var(--red),#f87171)}
.hr-val{font-size:var(--fs-sm);text-align:right}
.hr-val.warn{color:var(--amber)}
.hr-val.danger{color:var(--red)}
.p-dist,.p-speed{font-size:var(--fs-xs);color:var(--text-dim);text-align:right}
.mock-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--line-soft)}
.mock-kpi{text-align:center}
.mock-kpi .k{font-size:var(--fs-xs);color:var(--text-mute);margin-bottom:4px}
.mock-kpi .v{font-size:var(--fs-h3);font-weight:700}
.mock-kpi .v.g{color:var(--green-bright)}

/* ========================= 数字信任条 ========================= */
.stats{border-block:1px solid var(--line);background:rgba(255,255,255,.014)}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-6);padding-top:var(--sp-10);padding-bottom:var(--sp-4)}
.stat-note{color:var(--text-mute);font-size:var(--fs-xs);letter-spacing:.02em;padding-bottom:var(--sp-8)}
.stat{text-align:left;padding-left:var(--sp-6);border-left:1px solid var(--line)}
.stat:first-child{border-left:0;padding-left:0}
.stat-num{font-size:clamp(30px,3.4vw,44px);font-weight:800;letter-spacing:-.02em;line-height:1}
.stat-num .u{color:var(--green-bright);font-size:.5em;margin-left:2px;font-weight:700}
.stat-label{margin-top:var(--sp-2);color:var(--text-dim);font-size:var(--fs-sm)}

/* ========================= 卡片通用 ========================= */
.grid{display:grid;gap:var(--sp-4)}
.hw-grid{grid-template-columns:repeat(5,1fr)}
.sw-grid{grid-template-columns:1fr 1fr}

/* ===== 产品中心：左右抽屉（B 端 / C 端） ===== */
.split-panel{
  position:relative;height:560px;border-radius:var(--r-lg);overflow:hidden;
  border:1px solid var(--line);background:#0d141c;
}
.sp-sides{position:relative;display:flex;height:100%}
/* 两侧各自背景图：B 端=教练端平板实拍；C 端=球员端 App 实拍（可替换同名文件） */
.sp-side.b{background-image:url('/website/img/coach_pad.png');background-size:cover;background-position:center}
.sp-side.c{background-image:url('/website/img/player_app.png');background-size:cover;background-position:center}
.sp-side{
  position:relative;height:100%;padding:var(--sp-8);
  display:flex;flex-direction:column;justify-content:flex-end;
  cursor:pointer;overflow:hidden;
  transition:flex-basis .65s var(--ease);
}
.sp-side.c{border-left:1px solid rgba(255,255,255,.12)}
.sp-side::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(11,15,20,.20) 0, rgba(11,15,20,.80) 100%);
  transition:background .5s var(--ease);
}
.sp-full{position:relative;z-index:1;max-width:560px;transition:opacity .35s var(--ease),visibility .35s}
/* 抽屉右下角：半透明「查看详情」按钮（新标签打开对应解决方案页） */
.sp-more{
  position:absolute;right:var(--sp-8);bottom:var(--sp-8);z-index:2;
  display:inline-flex;align-items:center;gap:6px;
  padding:9px 16px;border-radius:var(--r-pill);
  font-size:var(--fs-sm);font-weight:600;color:var(--text);text-decoration:none;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  transition:background .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease),
             transform .25s var(--ease),opacity .35s var(--ease),visibility .35s;
}
.sp-more:hover{
  background:rgba(31,174,90,.24);border-color:rgba(31,174,90,.55);color:#fff;transform:translateY(-2px);
}
.sp-side.c .sp-more:hover{background:rgba(59,130,246,.24);border-color:rgba(59,130,246,.55)}
/* 折叠态隐藏（与 .sp-full 同步） */
.split-panel.is-b .sp-side.c .sp-more,
.split-panel.is-c .sp-side.b .sp-more{opacity:0;visibility:hidden}
.sp-tag{
  display:inline-block;font-size:var(--fs-xs);letter-spacing:.08em;padding:3px 10px;border-radius:var(--r-pill);
  background:var(--green-soft);border:1px solid rgba(31,174,90,.28);color:var(--green-bright);
}
.sp-side.c .sp-tag{background:var(--blue-soft);border-color:rgba(59,130,246,.32);color:var(--blue-bright)}
.sp-full h3{font-size:28px;font-weight:700;margin:var(--sp-3) 0 var(--sp-3);line-height:1.25}
.sp-lead{color:var(--text-dim);font-size:var(--fs-base);line-height:1.7}
.sp-points{margin-top:var(--sp-4);display:flex;flex-direction:column;gap:8px}
.sp-points li{display:flex;gap:8px;font-size:var(--fs-sm);color:var(--text-dim)}
.sp-points li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green-bright);margin-top:8px;flex-shrink:0}
.sp-side.c .sp-points li::before{background:var(--blue-bright)}
/* 折叠态：竖排简要信息 + 往复箭头 + 文字提示 */
.sp-mini{
  position:absolute;inset:0;z-index:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-4);
  opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s;
}
.sp-mini-text{
  writing-mode:vertical-rl;letter-spacing:.16em;font-size:var(--fs-sm);color:var(--text-dim);
  padding:var(--sp-4) 0;
}
.sp-mini-arrows{display:flex;gap:8px;line-height:1;font-size:18px;color:var(--green-bright)}
.sp-side.c .sp-mini-arrows{color:var(--blue-bright)}
.sp-mini-arrows i{font-style:normal;animation:nudge 1.8s ease-in-out infinite}
.sp-mini-arrows i:last-child{animation-delay:.22s}
.sp-mini-tip{font-size:var(--fs-xs);color:var(--text-mute);letter-spacing:.08em}
@keyframes nudge{0%,100%{transform:translateX(-3px)}50%{transform:translateX(3px)}}
/* 分割线两侧的半透明箭头（随分割线滑动；左箭头展开左、右箭头展开右） */
.sp-handle{
  position:absolute;top:50%;left:75%;transform:translate(-50%,-50%);z-index:3;
  display:flex;align-items:center;gap:4px;pointer-events:none;
  transition:left .65s var(--ease);
}
.split-panel.is-c .sp-handle{left:25%}
.sp-arrow{
  pointer-events:auto;width:34px;height:46px;padding:0;border:0;background:none;cursor:pointer;
  display:grid;place-items:center;font-size:26px;line-height:1;
  color:rgba(230,237,243,.40);
  transition:color .25s var(--ease),transform .25s var(--ease);
}
.sp-arrow:hover{color:var(--green-bright)}
.sp-arrow.prev:hover{transform:translateX(-2px)}
.sp-arrow.next:hover{transform:translateX(2px)}
/* 展开 / 折叠切换（默认 is-b，即左 75% / 右 25%） */
.split-panel.is-b .sp-side.b{flex:0 0 75%}
.split-panel.is-b .sp-side.c{flex:0 0 25%}
.split-panel.is-c .sp-side.b{flex:0 0 25%}
.split-panel.is-c .sp-side.c{flex:0 0 75%}
.split-panel.is-b .sp-side.c .sp-full,
.split-panel.is-c .sp-side.b .sp-full{opacity:0;visibility:hidden}
.split-panel.is-b .sp-side.c .sp-mini,
.split-panel.is-c .sp-side.b .sp-mini{opacity:1;visibility:visible}
.split-panel.is-b .sp-side.c::before,
.split-panel.is-c .sp-side.b::before{background:linear-gradient(180deg, rgba(11,15,20,.55) 0, rgba(11,15,20,.88) 100%)}
.card{
  position:relative;padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:transform .28s var(--ease),border-color .28s var(--ease),box-shadow .28s var(--ease);
  overflow:hidden;
}
.card:hover{transform:translateY(-4px);border-color:rgba(31,174,90,.45);box-shadow:var(--shadow)}
.card .ic{
  width:40px;height:40px;border-radius:10px;display:grid;place-items:center;
  background:var(--green-soft);color:var(--green-bright);margin-bottom:var(--sp-4);font-size:18px;
}
.card .ic.blue{background:var(--blue-soft);color:var(--blue-bright)}
.card h3{font-size:var(--fs-h3);font-weight:700;margin-bottom:6px}
.card p{color:var(--text-dim);font-size:var(--fs-sm)}
.card .tag{margin-top:var(--sp-4);display:inline-block;font-size:11px;padding:3px 9px;border-radius:var(--r-pill);background:var(--green-soft);color:var(--green-bright);border:1px solid rgba(31,174,90,.28)}
/* 卡片图片位（占位图 → 后续替换为真实图片） */
.card-media{
  width:100%;aspect-ratio:16/10;border-radius:var(--r-card);overflow:hidden;
  border:1px solid var(--line);background:#0d141c;margin-bottom:var(--sp-4);position:relative;
}
.card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s var(--ease)}
.card:hover .card-media img{transform:scale(1.035)}
/* 核心能力：主流程（横向步骤 + 箭头） */
.flow{display:flex;align-items:stretch;gap:var(--sp-2);margin-bottom:var(--sp-10)}
.flow-step{
  flex:1;position:relative;overflow:hidden;aspect-ratio:16/9;
  display:flex;flex-direction:column;justify-content:flex-end;
  border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);
  transition:border-color .28s var(--ease),transform .28s var(--ease),box-shadow .28s var(--ease);
}
.flow-step:hover{border-color:rgba(31,174,90,.45);transform:translateY(-4px);box-shadow:var(--shadow)}
/* 图片铺满整卡，文字浮于图片之上 */
.fs-media{position:absolute;inset:0;overflow:hidden}
.fs-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s var(--ease)}
.flow-step:hover .fs-media img{transform:scale(1.04)}
/* 深色半透明遮罩：整体压暗降低干扰，底部再加深保证文字可读 */
.flow-step::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(9,13,18,.64) 0%, rgba(9,13,18,.62) 50%, rgba(9,13,18,.96) 100%);
}
/* 序号：圆角胶囊，悬浮左上角，不压图片主体 */
.fs-no{
  position:absolute;top:var(--sp-4);left:var(--sp-4);z-index:2;
  padding:5px 13px;border-radius:var(--r-pill);
  font-size:var(--fs-sm);font-weight:800;letter-spacing:.08em;
  color:var(--green-bright);background:rgba(11,15,20,.55);
  border:1px solid rgba(31,174,90,.38);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.fs-body{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:var(--sp-6);text-align:left;
  text-shadow:0 1px 14px rgba(0,0,0,.55);
}
.fs-body h3{font-size:var(--fs-h3);font-weight:700;margin-bottom:6px}
.fs-body p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.6}
.flow-arrow{display:grid;place-items:center;flex:0 0 34px;color:var(--green)}
.flow-arrow svg{width:24px;height:24px;opacity:.85}
/* 核心能力：进阶能力四卡 + 底部按钮 */
.cap-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.cap-more{display:flex;justify-content:center;margin-top:var(--sp-8)}
/* 「亿」等中文单位：用主字体、非斜体，与数字风格统一 */
.stat-num .unit{font-style:normal;font-weight:800}
/* 顶部导航下缘的地平线光带 */
.site-header::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(52,224,122,.45),rgba(96,165,250,.45),transparent);
  opacity:.55;
}
.card.is-soon{opacity:.9}
.card.is-soon .tag{background:rgba(234,179,8,.12);color:var(--amber);border-color:rgba(234,179,8,.3)}

/* ========================= 核心能力（步骤） ========================= */
.step-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.step{
  padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:rgba(255,255,255,.015);position:relative;transition:background .28s var(--ease),border-color .28s var(--ease)
}
.step:hover{background:var(--card);border-color:rgba(31,174,90,.4)}
.step-no{font-size:var(--fs-xs);font-weight:700;color:var(--green-bright);letter-spacing:.1em;margin-bottom:var(--sp-4)}
.step h3{font-size:var(--fs-h3);font-weight:700;margin-bottom:6px}
.step p{color:var(--text-dim);font-size:var(--fs-sm)}

/* ========================= 运动安全 ========================= */
.safety-grid{display:grid;grid-template-columns:1fr;gap:var(--sp-6)}
.safety-card{padding:var(--sp-8);border:1px solid var(--line);border-radius:var(--r-lg);background:linear-gradient(180deg,var(--card-2),var(--card))}
.safety-card h3{font-size:var(--fs-h2);font-weight:700;margin-bottom:var(--sp-3)}
.safety-card p{color:var(--text-dim)}
.metric-row{display:flex;gap:var(--sp-3);margin-top:var(--sp-6);flex-wrap:wrap}
.metric{flex:1;min-width:120px;padding:var(--sp-4);border:1px solid var(--line);border-radius:var(--r-card);background:rgba(0,0,0,.2)}
.metric .mk{font-size:var(--fs-xs);color:var(--text-mute)}
.metric .mv{font-size:var(--fs-h3);font-weight:700;margin-top:4px}
/* ACWR 区间条 */
.acwr{margin-top:var(--sp-6)}
.acwr-track{position:relative;height:14px;border-radius:var(--r-pill);overflow:hidden;
  background:linear-gradient(90deg,#3b82f6 0%,#3b82f6 26%,#1fae5a 30%,#1fae5a 56%,#eab308 62%,#eab308 74%,#ef4444 82%,#ef4444 100%);}
.acwr-track .safe{position:absolute;top:-4px;bottom:-4px;left:30%;width:26%;border:2px solid rgba(255,255,255,.85);border-radius:var(--r-pill)}
.acwr-marker{position:absolute;top:-22px;transform:translateX(-50%);font-size:var(--fs-xs);color:var(--text)}
.acwr-marker::after{content:"";display:block;width:2px;height:30px;background:var(--text);margin:2px auto 0}
.acwr-scale{display:flex;justify-content:space-between;margin-top:var(--sp-4);font-size:var(--fs-xs);color:var(--text-mute)}
.acwr-scale .on{color:var(--green-bright);font-weight:700}
/* 运动安全：通屏背景 + 整区轮播（无卡片边界） */
.safety-hero{
  position:relative;overflow:hidden;
  padding-block:var(--sp-24);
  border-block:1px solid var(--line);
  background-image:
    linear-gradient(180deg, rgba(11,15,20,.70) 0%, rgba(11,15,20,.76) 60%, rgba(11,15,20,.85) 100%),
    radial-gradient(120% 110% at 0% 50%, rgba(11,15,20,.40), transparent 62%),
    url('/website/img/safety-acwr-bg.png');
  background-size:cover, cover, cover;
  background-position:center, center, center;
  background-repeat:no-repeat;
}
.safety-inner{position:relative;z-index:1}
.safety-carousel{
  position:relative;display:flex;flex-direction:column;
  min-height:560px;padding-bottom:var(--sp-16);
}
/* 轮播图片限制高度，避免撑破内容区与指示器重叠 */
.sc-media{max-height:360px}
.sc-head{position:relative}
.sc-tag{
  display:inline-block;font-size:var(--fs-xs);letter-spacing:.08em;padding:3px 10px;border-radius:var(--r-pill);
  background:var(--green-soft);border:1px solid rgba(31,174,90,.28);color:var(--green-bright);
}
.sc-head h3{font-size:var(--fs-h2);font-weight:700;margin-top:var(--sp-3);line-height:1.35}
.sc-track{position:relative;flex:1;margin-top:var(--sp-5);min-height:260px}
.sc-slide{
  position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6);align-items:start;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .55s var(--ease),transform .55s var(--ease),visibility .55s;
}
.sc-slide.is-active{opacity:1;visibility:visible;transform:none}
/* 通屏栏目下的轮播屏：整屏铺满栏目区域（内容浮于通屏背景之上） */
.sc-slide{padding-block:var(--sp-2)}
.sc-text h4{font-size:26px;font-weight:700;margin-bottom:var(--sp-3);line-height:1.28}
/* 标签 + 标题同一行：标签在标题左侧 */
.sc-head-row{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-3)}
.sc-head-row .sc-tag{flex-shrink:0}
.sc-head-row h4{margin-bottom:0}
.sc-text .sc-lead{font-size:var(--fs-base);line-height:1.7}
.sc-points li b{color:var(--text);font-weight:600}
/* 运动安全轮播内：进入专题按钮（轮廓线 + 半透明底，尺寸放大） */
.sc-cta{
  margin-top:var(--sp-6);
  padding:13px 28px;font-size:var(--fs-base);
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.30);
  color:var(--text);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  box-shadow:0 8px 24px rgba(0,0,0,.22);
}
.sc-cta:hover{
  background:rgba(31,174,90,.16);
  border-color:var(--green-bright);
  color:var(--green-bright);
  transform:translateY(-2px);
}
.sc-text p{color:var(--text-dim);font-size:var(--fs-sm)}
.sc-points{margin-top:var(--sp-4);display:flex;flex-direction:column;gap:8px}
.sc-points li{display:flex;gap:8px;font-size:var(--fs-sm);color:var(--text-dim)}
.sc-points li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green-bright);margin-top:8px;flex-shrink:0}
.sc-media{border-radius:var(--r-card);overflow:hidden;border:1px solid var(--line);background:#0d141c;aspect-ratio:4/3}
.sc-media img{width:100%;height:100%;object-fit:cover;display:block}
.sc-dots{
  position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  display:flex;justify-content:center;gap:12px;
}
.sc-dots button{
  width:8px;height:8px;padding:0;border:0;border-radius:50%;background:var(--line);cursor:pointer;
  transition:width .25s var(--ease),background .25s var(--ease);
}
.sc-dots button.is-active{width:24px;border-radius:4px;background:var(--green-bright)}
/* 左右切换箭头：纯半透明符号（无边框/背景），贴栏目外侧、避开内容文字 */
.sc-nav{
  position:absolute;top:57%;transform:translateY(-50%);z-index:4;
  padding:6px;border:0;background:none;cursor:pointer;
  color:rgba(230,237,243,.68);
  animation:navFade 2.8s ease-in-out infinite;
  transition:color .25s var(--ease),transform .25s var(--ease);
}
.sc-nav svg{width:46px;height:46px;display:block}
.sc-nav-prev svg{animation:navSlideL 2.8s ease-in-out infinite}
.sc-nav-next svg{animation:navSlideR 2.8s ease-in-out infinite}
.sc-nav-next{animation-delay:.4s}
.sc-nav:hover{color:var(--green-bright);opacity:1;animation:none}
.sc-nav:hover svg{animation:none}
.sc-nav:active{transform:translateY(-50%) scale(.94)}
.sc-nav-prev{left:max(16px, calc(50% - 710px))}
.sc-nav-next{right:max(16px, calc(50% - 710px))}
/* 呼吸 + 向内轻推，提示可左右切换 */
@keyframes navFade{0%,100%{opacity:.42}50%{opacity:.95}}
@keyframes navSlideL{0%,100%{transform:translateX(0)}50%{transform:translateX(-5px)}}
@keyframes navSlideR{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}
@media (prefers-reduced-motion:reduce){
  .sc-nav,.sc-nav svg{animation:none}
}

/* ========================= 双端 ========================= */
.dual-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}
.dual-card{padding:var(--sp-8);border:1px solid var(--line);border-radius:var(--r-lg);background:linear-gradient(180deg,var(--card-2),var(--card));position:relative;overflow:hidden}
.dual-card .role{font-size:var(--fs-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute);margin-bottom:var(--sp-3)}
.dual-card h3{font-size:var(--fs-h2);font-weight:700;margin-bottom:var(--sp-3)}
.dual-card p{color:var(--text-dim)}
.dual-list{margin-top:var(--sp-6);display:flex;flex-direction:column;gap:10px}
.dual-list li{display:flex;align-items:flex-start;gap:10px;font-size:var(--fs-sm);color:var(--text-dim)}
.dual-list li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green-bright);margin-top:8px;flex-shrink:0}
.dual-card.blue .dual-list li::before{background:var(--blue-bright)}

/* ========================= AI（左主图 + 右文字） ========================= */
.ai-split{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--sp-16);align-items:center}
.ai-media{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:#0d141c;aspect-ratio:4/3}
.ai-media img{width:100%;height:100%;object-fit:cover;display:block}
.ai-list{margin-top:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-4)}
.ai-list li{position:relative;padding-left:var(--sp-5);display:flex;flex-direction:column;gap:2px}
.ai-list li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--green-bright)}
.ai-list li b{color:var(--text);font-weight:700;font-size:var(--fs-base)}
.ai-list li span{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.6}

/* ========================= 客户见证：照片墙 ========================= */
.wall{
  display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-4);
  align-items:start;padding-block:var(--sp-6);
}
.wall-card{
  position:relative;margin:0;
  background:linear-gradient(180deg,var(--card-2),var(--card));
  border:1px solid var(--line);border-radius:var(--r-lg);
  padding:9px;box-shadow:var(--shadow);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);
}
.wall-card:hover{transform:translateY(-6px);border-color:rgba(31,174,90,.45);box-shadow:0 22px 50px rgba(0,0,0,.5)}
/* 照片 + 左上角「头像 + 名字」 */
.wc-photo{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:4/5;background:#0d141c}
.wc-photo img{width:100%;height:100%;object-fit:cover;display:block}
.wc-meta{
  position:absolute;top:9px;left:9px;display:flex;align-items:center;gap:7px;
  padding:4px 12px 4px 4px;border-radius:var(--r-pill);
  background:rgba(11,15,20,.55);border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  max-width:calc(100% - 18px);
}
.wc-av{
  width:25px;height:25px;border-radius:50%;flex-shrink:0;font-style:normal;
  display:grid;place-items:center;font-size:12px;font-weight:700;color:#04140b;
  background:linear-gradient(135deg,var(--green-bright),var(--blue-bright));
}
.wc-name{font-size:12px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 照片下方：朋友圈式一句话 */
.wc-quote{margin:10px 4px 3px;font-size:var(--fs-sm);line-height:1.65;color:var(--text-dim)}
/* 整齐排列（已取消错落 / 旋转 / 遮挡） */

/* ========================= 足球学院 ========================= */
.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.journal-card{padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);background:rgba(255,255,255,.015);transition:transform .28s var(--ease),border-color .28s var(--ease),background .28s var(--ease)}
.journal-card:hover{transform:translateY(-4px);border-color:rgba(96,165,250,.45);background:var(--card)}
.journal-card .cat{font-size:var(--fs-xs);color:var(--blue-bright);letter-spacing:.08em}
.journal-card h3{font-size:var(--fs-h3);font-weight:700;margin:var(--sp-3) 0 var(--sp-2);line-height:1.45}
.journal-card p{color:var(--text-dim);font-size:var(--fs-sm)}
.journal-card .read{margin-top:var(--sp-4);font-size:var(--fs-sm);color:var(--green-bright)}

/* ========================= 底部 CTA ========================= */
.cta-band{padding-block:var(--sp-16)}
.cta-box{
  position:relative;overflow:hidden;text-align:center;
  padding:var(--sp-16) var(--sp-8);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(150deg,rgba(31,174,90,.14),rgba(59,130,246,.14)),linear-gradient(180deg,var(--card-2),var(--card));
}
.cta-box::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 240px at 50% 0%,rgba(52,224,122,.18),transparent 70%)}
.cta-box h2{position:relative;font-size:var(--fs-h1);font-weight:800;letter-spacing:-.02em}
.cta-box p{position:relative;color:var(--text-dim);margin-top:var(--sp-4);max-width:560px;margin-inline:auto}
.cta-box .hero-cta{position:relative;justify-content:center}

/* ========================= 页脚 ========================= */
.site-footer{border-top:1px solid var(--line);background:rgba(0,0,0,.25);padding-block:var(--sp-16) var(--sp-10);position:relative;z-index:1}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:var(--sp-8)}
.footer-brand p{color:var(--text-mute);font-size:var(--fs-sm);margin-top:var(--sp-4);max-width:280px}
.footer-col h4{font-size:var(--fs-sm);font-weight:700;margin-bottom:var(--sp-4);color:var(--text)}
.footer-col a{display:block;color:var(--text-dim);font-size:var(--fs-sm);padding:5px 0;transition:color .18s var(--ease)}
.footer-col a:hover{color:var(--green-bright)}
/* 页脚：微信公众号二维码弹层（悬停 / 键盘聚焦 / 点击均可展开） */
.footer-qr{
  position:relative;display:block;width:100%;text-align:left;
  padding:5px 0;border:0;background:none;cursor:pointer;
  color:var(--text-dim);font:inherit;font-size:var(--fs-sm);
  transition:color .18s var(--ease);
}
.footer-qr:hover,.footer-qr:focus-visible,.footer-qr.is-open{color:var(--green-bright)}
.footer-qr-pop{
  position:absolute;left:50%;bottom:calc(100% + 14px);z-index:70;
  width:152px;padding:10px 10px 8px;border-radius:var(--r-card);
  background:#fff;box-shadow:0 18px 44px rgba(0,0,0,.5);
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translate(-50%,8px);
  transition:opacity .22s var(--ease),transform .22s var(--ease),visibility .22s var(--ease);
}
.footer-qr-pop img{display:block;width:100%;height:auto;border-radius:4px}
.footer-qr-pop em{display:block;margin-top:7px;font-style:normal;font-size:12px;color:#111;text-align:center;white-space:nowrap}
.footer-qr-pop::after{
  content:"";position:absolute;left:50%;top:100%;margin-left:-6px;
  border:6px solid transparent;border-top-color:#fff;
}
.footer-qr:hover .footer-qr-pop,
.footer-qr:focus-visible .footer-qr-pop,
.footer-qr.is-open .footer-qr-pop{
  opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);
}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);flex-wrap:wrap;margin-top:var(--sp-12);padding-top:var(--sp-6);border-top:1px solid var(--line-soft);color:var(--text-mute);font-size:var(--fs-xs)}
.footer-bottom .links{display:flex;gap:var(--sp-5)}
.footer-bottom a:hover{color:var(--text)}

/* ========================= 进场动效 ========================= */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .55s var(--ease),transform .55s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.06s}.reveal.d2{transition-delay:.12s}.reveal.d3{transition-delay:.18s}.reveal.d4{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}

/* ========================= 响应式 ========================= */
@media (max-width:1080px){
  .hero-grid{grid-template-columns:1fr;gap:var(--sp-12)}
  .hero{min-height:600px}
  .hero-bg{width:100%}
  .hero-bg img{-webkit-mask-image:none;mask-image:none}
  .hero-bg::after{background:none}
  .hero-veil{background:linear-gradient(180deg, rgba(11,15,20,.55) 0, rgba(11,15,20,.22) 45%, rgba(11,15,20,.62) 100%)}
  /* 小屏：文字改用半透明毛玻璃底，保证可读同时让背景图透出 */
  .hero-copy{
    background:rgba(11,15,20,.55);
    -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
    border:1px solid rgba(255,255,255,.07);
    border-radius:var(--r-lg);padding:var(--sp-6);
  }
  .step-grid{grid-template-columns:repeat(2,1fr)}
  .hw-grid{grid-template-columns:repeat(3,1fr)}
  .sw-grid{grid-template-columns:1fr}
  .split-panel{height:auto}
  .sp-sides{flex-direction:column}
  .split-panel.is-b .sp-side,.split-panel.is-c .sp-side{flex:1 1 auto;min-height:290px}
  .sp-mini{display:none}
  .sp-handle{display:none}
  .split-panel.is-b .sp-side .sp-full,
  .split-panel.is-c .sp-side .sp-full{opacity:1;visibility:visible}
  .sp-side{border-left:0}
  .sp-side.c{border-left:0;border-top:1px solid rgba(255,255,255,.12)}
  .sp-more{position:static;align-self:flex-start;margin-top:var(--sp-4)}
  .flow{flex-direction:column}
  .flow-arrow{flex-basis:auto;height:26px;transform:rotate(90deg)}
  .flow-step{aspect-ratio:auto;min-height:200px}
  .cap-grid{grid-template-columns:repeat(2,1fr)}
  .ai-split{grid-template-columns:1fr;gap:var(--sp-10)}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .nav,.header-cta .btn-ghost{display:none}
  .nav-toggle{display:block}
  .header-cta{margin-left:auto}
  .site-header.menu-open .nav{
    display:flex;flex-direction:column;align-items:stretch;gap:2px;
    position:absolute;top:68px;left:0;right:0;padding:var(--sp-4) var(--sp-6) var(--sp-6);
    background:rgba(11,15,20,.97);border-bottom:1px solid var(--line);
  }
  .site-header.menu-open .nav .drop-menu{position:static;transform:none;opacity:1;visibility:visible;box-shadow:none;border:0;background:rgba(255,255,255,.02);min-width:0;margin:4px 0 8px}
  .site-header.menu-open .nav .caret{display:none}
  .stat-grid{grid-template-columns:1fr 1fr;gap:var(--sp-8)}
  .stat{padding-left:var(--sp-4)}
  .stat:nth-child(3){border-left:0;padding-left:0}
  .safety-grid,.dual-grid,.journal-grid{grid-template-columns:1fr}
  .wall{grid-template-columns:repeat(3,1fr)}
  .safety-hero{padding-block:var(--sp-16)}
  .safety-carousel{min-height:640px}
  .sc-nav{top:52%}
  .sc-nav svg{width:32px;height:32px}
  .sc-nav-prev{left:6px}
  .sc-nav-next{right:6px}
  .sc-slide{grid-template-columns:1fr;gap:var(--sp-5)}
  .sc-track{min-height:400px}
  .hw-grid{grid-template-columns:repeat(2,1fr)}
  .wall{grid-template-columns:repeat(2,1fr)}
  .cap-grid{grid-template-columns:1fr}
  .section{padding-block:var(--sp-16)}
  .hero{padding-top:var(--sp-12)}
  .hero-copy{padding:var(--sp-4)}
}

/* ========================= 运动安全页（sf-*） ========================= */
.sf-hero{
  position:relative;overflow:hidden;
  padding-block:var(--sp-20) var(--sp-16);
  background:radial-gradient(1100px 520px at 82% -12%, rgba(31,174,90,.16), transparent 62%);
}
.sf-hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:var(--sp-16);align-items:center}
.sf-hero-visual{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:linear-gradient(180deg,var(--card-2),var(--card));box-shadow:var(--shadow)}
.sf-hero-visual img{width:100%;display:block}

.sf-why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}

.sf-engines{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}
.sf-tag{
  display:inline-block;font-size:var(--fs-xs);letter-spacing:.08em;padding:3px 10px;border-radius:var(--r-pill);
  background:var(--green-soft);border:1px solid rgba(31,174,90,.28);color:var(--green-bright);margin-bottom:var(--sp-3);
}
.sf-tag.blue{background:var(--blue-soft);border-color:rgba(59,130,246,.32);color:var(--blue-bright)}
/* 双引擎卡说明中的关键词（原理 / 重要性） */
.sf-engines .card > p b{color:var(--text);font-weight:700}
/* 双引擎卡：标签 + 标题同行（标签在左，标题在右） */
.sf-head-row{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-3)}
.sf-head-row .sf-tag{margin-bottom:0;flex-shrink:0}
.sf-head-row h3{margin:0;font-size:var(--fs-h3);font-weight:700}

/* ---- 流程四/五步：横向主轴 + 发光节点 + 递进进度条 + 描边水印数字 ---- */
.sf-steps{
  display:flex;align-items:stretch;gap:var(--sp-4);
  position:relative;padding-top:32px;
}
/* 主轴光带（绿→蓝，两端渐隐） */
.sf-steps::before{
  content:"";position:absolute;left:3%;right:3%;top:32px;height:2px;z-index:0;
  background:linear-gradient(90deg,transparent,rgba(31,174,90,.55) 14%,rgba(59,130,246,.55) 86%,transparent);
}
/* 沿主轴流动的高光点 */
.sf-steps::after{
  content:"";position:absolute;top:25px;left:2%;width:130px;height:16px;z-index:1;pointer-events:none;
  background:radial-gradient(closest-side,rgba(52,224,122,.5),transparent);
  animation:sfFlow 7s linear infinite;
}
@keyframes sfFlow{
  0%{left:2%;opacity:0}
  14%{opacity:1}
  86%{opacity:1}
  100%{left:calc(100% - 130px);opacity:0}
}
.sf-step{
  position:relative;flex:1;z-index:2;
  padding:var(--sp-8) var(--sp-6) var(--sp-6);
  border:1px solid var(--line);border-radius:var(--r-lg);
  background:
    linear-gradient(90deg,rgba(52,224,122,.8) 0 var(--p,0%),rgba(255,255,255,.05) var(--p,0%) 100%) top left/100% 3px no-repeat,
    linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease),transform .28s var(--ease),box-shadow .28s var(--ease);
}
.sf-step:hover{
  border-color:rgba(31,174,90,.5);transform:translateY(-4px);
  box-shadow:0 14px 34px rgba(0,0,0,.38),0 0 0 1px rgba(31,174,90,.16);
}
/* 节点圆环：骑在主轴线上，带呼吸光 */
.sf-step-no{
  position:absolute;top:-15px;left:50%;transform:translateX(-50%);z-index:3;
  display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:#0b0f14;border:2px solid rgba(31,174,90,.6);
  font-size:11px;font-weight:800;color:var(--green-bright);
  box-shadow:0 0 0 5px rgba(11,15,20,.92),0 0 16px rgba(31,174,90,.34);
  animation:sfNode 3.4s ease-in-out infinite;
}
@keyframes sfNode{
  0%,100%{box-shadow:0 0 0 5px rgba(11,15,20,.92),0 0 12px rgba(31,174,90,.26)}
  50%{box-shadow:0 0 0 5px rgba(11,15,20,.92),0 0 26px rgba(31,174,90,.6)}
}
.sf-step h3{font-size:var(--fs-h3);font-weight:700;margin-bottom:6px}
.sf-step p{color:var(--text-dim);font-size:var(--fs-sm)}
/* 大号水印数字（纯填充，无描边） */
.sf-step::after{
  content:attr(data-no);position:absolute;right:12px;bottom:2px;z-index:0;pointer-events:none;
  font-family:"Geist Mono","JetBrains Mono",ui-monospace,Consolas,monospace;
  font-size:74px;font-weight:800;line-height:1;letter-spacing:-.04em;
  color:rgba(159,176,192,.10);
}
/* 步骤间箭头：主轴已表达流程方向，隐藏旧箭头 */
.sf-step-arrow{display:none}
/* 递进进度条：4 步 */
.sf-steps-4 .sf-step:nth-child(1){--p:25%}
.sf-steps-4 .sf-step:nth-child(3){--p:50%}
.sf-steps-4 .sf-step:nth-child(5){--p:75%}
.sf-steps-4 .sf-step:nth-child(7){--p:100%}
/* 递进进度条：5 步 */
.sf-steps-5 .sf-step:nth-child(1){--p:20%}
.sf-steps-5 .sf-step:nth-child(3){--p:40%}
.sf-steps-5 .sf-step:nth-child(5){--p:60%}
.sf-steps-5 .sf-step:nth-child(7){--p:80%}
.sf-steps-5 .sf-step:nth-child(9){--p:100%}

.sf-acwr{display:grid;grid-template-columns:1.35fr 1fr;gap:var(--sp-6)}
.sf-acwr-chart{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:#0d141c}
.sf-acwr-chart img{width:100%;height:100%;object-fit:cover;display:block}
.sf-zones{display:grid;gap:var(--sp-3)}
.sf-zone{padding:var(--sp-4) var(--sp-5);border:1px solid var(--line);border-left-width:3px;border-radius:var(--r-card);background:rgba(255,255,255,.015)}
.sf-zone b{display:block;font-size:var(--fs-base);font-weight:700}
.sf-zone span{display:block;font-size:var(--fs-xs);color:var(--text-mute);margin:2px 0 6px}
.sf-zone p{font-size:var(--fs-sm);color:var(--text-dim)}
.sf-zone.is-low{border-left-color:var(--blue)}
.sf-zone.is-ok{border-left-color:var(--green)}
.sf-zone.is-high{border-left-color:var(--amber)}
.sf-zone.is-over{border-left-color:var(--red)}

.sf-rpe{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--sp-16);align-items:center}
.sf-rpe-media{display:grid;place-items:center}
.sf-rpe-media img{width:100%;max-width:330px;border-radius:var(--r-lg);border:1px solid var(--line);display:block}
/* RPE 两种采集方式：左侧公共横版大图 + 右侧上下双条目（权重低于「双引擎」大卡） */
.sf-rpe-ways{display:grid;grid-template-columns:1.35fr 1fr;gap:var(--sp-6);align-items:stretch}
.sf-rpe-ways-media{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:#0d141c}
.sf-rpe-ways-media img{width:100%;height:100%;object-fit:cover;display:block}
.sf-rpe-ways-list{display:grid;gap:var(--sp-3);align-content:center}
.sf-way{
  padding:var(--sp-5);border:1px solid var(--line);border-radius:var(--r-card);
  background:rgba(255,255,255,.012);
  transition:border-color .28s var(--ease);
}
.sf-way:hover{border-color:rgba(31,174,90,.35)}
.sf-way h3{font-size:var(--fs-base);font-weight:700;margin-bottom:4px}
.sf-way > p{color:var(--text-dim);font-size:var(--fs-sm)}
.sf-way .sc-points{margin-top:var(--sp-3);flex-direction:row;flex-wrap:wrap;gap:var(--sp-2) var(--sp-6)}

.sf-alerts{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.sf-alert{padding:var(--sp-5);border:1px solid var(--line);border-top-width:3px;border-radius:var(--r-card);background:linear-gradient(180deg,var(--card-2),var(--card))}
.sf-alert b{display:block;font-size:var(--fs-base);font-weight:700;margin-bottom:6px}
.sf-alert p{font-size:var(--fs-sm);color:var(--text-dim)}
.sf-alert.is-low{border-top-color:var(--blue)}
.sf-alert.is-ok{border-top-color:var(--green)}
.sf-alert.is-high{border-top-color:var(--amber)}
.sf-alert.is-over{border-top-color:var(--red)}

.sf-week{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:#0d141c}
.sf-week img{width:100%;display:block}

.sf-scenes{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}

.sf-faq{display:grid;gap:var(--sp-3);max-width:900px}
.sf-faq-item{border:1px solid var(--line);border-radius:var(--r-card);background:rgba(255,255,255,.015);overflow:hidden}
.sf-faq-item summary{cursor:pointer;list-style:none;padding:var(--sp-4) var(--sp-5);font-weight:600;display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4)}
.sf-faq-item summary::-webkit-details-marker{display:none}
.sf-faq-item summary::after{content:"+";color:var(--green-bright);font-weight:700;font-size:18px;transition:transform .25s var(--ease)}
.sf-faq-item[open] summary::after{transform:rotate(45deg)}
.sf-faq-item p{padding:0 var(--sp-5) var(--sp-5);color:var(--text-dim);font-size:var(--fs-sm);line-height:1.75}

@media (max-width:1080px){
  .sf-hero-grid,.sf-rpe{grid-template-columns:1fr;gap:var(--sp-10)}
  .sf-rpe-ways{gap:var(--sp-6)}
  .sf-hero-visual{order:-1}
  .sf-why-grid,.sf-scenes{grid-template-columns:repeat(2,1fr)}
  .sf-engines{grid-template-columns:1fr}
  .sf-steps{flex-direction:column;padding-top:0;gap:var(--sp-5)}
  .sf-steps::before,.sf-steps::after{display:none}
  .sf-step{padding:var(--sp-6)}
  .sf-step-no{position:static;transform:none;margin-bottom:var(--sp-3);animation:none}
  .sf-step::after{font-size:56px;right:10px}
  .sf-acwr{grid-template-columns:1fr}
  .sf-acwr-chart img{height:auto}
  .sf-alerts{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .sf-hero{padding-block:var(--sp-12) var(--sp-10)}
  .sf-why-grid,.sf-scenes,.sf-alerts{grid-template-columns:1fr}
  .sf-rpe-ways{grid-template-columns:1fr}
  .sf-faq{max-width:none}
}

/* ========================= 球队与教练页（pc-*） ========================= */
.pc-hero{
  position:relative;overflow:hidden;
  padding-block:var(--sp-20) var(--sp-16);
  background:radial-gradient(1100px 520px at 82% -12%, rgba(59,130,246,.16), transparent 62%);
}
.pc-hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:var(--sp-16);align-items:center}
.pc-hero-visual{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:linear-gradient(180deg,var(--card-2),var(--card));box-shadow:var(--shadow)}
.pc-hero-visual img{width:100%;display:block}

.pc-sub-title{
  font-size:var(--fs-h3);font-weight:700;margin:var(--sp-10) 0 var(--sp-5);
  padding-left:12px;border-left:3px solid var(--green);
}
.pc-hw-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-4)}
.pc-tech-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}

.pc-certs{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.pc-cert{
  padding:var(--sp-5);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));text-align:center;
  transition:border-color .28s var(--ease),transform .28s var(--ease);
}
.pc-cert:hover{border-color:rgba(31,174,90,.45);transform:translateY(-3px)}
.pc-cert-media{aspect-ratio:1/1;border-radius:var(--r-card);overflow:hidden;border:1px solid var(--line);background:#0d141c;margin-bottom:var(--sp-3)}
.pc-cert-media img{width:100%;height:100%;object-fit:cover;display:block}
.pc-cert b{display:block;font-size:var(--fs-base);font-weight:700;margin-bottom:4px}
.pc-cert span{font-size:var(--fs-sm);color:var(--text-dim);line-height:1.6}

.pc-spec{
  margin-top:var(--sp-8);border:1px solid var(--line);border-radius:var(--r-lg);
  background:rgba(255,255,255,.014);overflow:hidden;
}
.pc-spec summary{
  cursor:pointer;list-style:none;padding:var(--sp-4) var(--sp-5);font-weight:600;
  display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);
}
.pc-spec summary::-webkit-details-marker{display:none}
.pc-spec summary::after{content:"+";color:var(--green-bright);font-weight:700;font-size:18px;transition:transform .25s var(--ease)}
.pc-spec[open] summary::after{transform:rotate(45deg)}
.pc-spec-body{padding:0 var(--sp-5) var(--sp-5);overflow-x:auto}
.pc-spec table{width:100%;border-collapse:collapse;min-width:640px}
.pc-spec th,.pc-spec td{
  padding:10px 12px;text-align:left;font-size:var(--fs-sm);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.pc-spec th{color:var(--text);font-weight:600;background:rgba(255,255,255,.02)}
.pc-spec td{color:var(--text-dim)}

.pc-stat{
  display:flex;align-items:center;gap:var(--sp-6);
  padding:var(--sp-6) var(--sp-8);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(100deg, rgba(31,174,90,.10), rgba(59,130,246,.08));
  margin-bottom:var(--sp-4);
}
.pc-stat-num{font-size:56px;font-weight:800;line-height:1;color:var(--green-bright);letter-spacing:-.02em;display:flex;align-items:baseline}
.pc-stat-num .unit{font-style:normal;font-weight:800;font-size:.62em;margin-left:2px}
.pc-stat-text b{display:block;font-size:var(--fs-h3);font-weight:700;margin-bottom:4px}
.pc-stat-text span{color:var(--text-dim);font-size:var(--fs-sm)}

.pc-fn-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6);margin-top:var(--sp-8)}
.pc-fn{display:flex;flex-direction:column}
.pc-fn-no{
  display:inline-block;font-size:var(--fs-xs);font-weight:800;letter-spacing:.12em;
  color:var(--green-bright);margin-bottom:6px;
}
.pc-fn h3{font-size:var(--fs-h3);font-weight:700;margin-bottom:6px}
.pc-fn > p{color:var(--text-dim);font-size:var(--fs-sm)}
.pc-fn .sc-points{margin-top:var(--sp-4)}

.pc-more{display:flex;flex-direction:column;align-items:center;gap:var(--sp-4);margin-top:var(--sp-10);text-align:center}
.pc-more p{color:var(--text-dim);font-size:var(--fs-sm)}

.pc-scenes{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}

/* 采购与配置：左文（40%）右表（60%） */
.pc-buy-layout{display:grid;grid-template-columns:2fr 3fr;gap:var(--sp-12);align-items:start}
.pc-buy-intro{text-align:left}
.pc-buy-intro .section-title{line-height:1.35}
.pc-buy-sub{
  font-size:var(--fs-base);font-weight:700;
  margin:var(--sp-8) 0 var(--sp-4);
  padding-left:10px;border-left:3px solid var(--green);
}
.pc-buy-cta{margin-top:var(--sp-8)}
.pc-buy-cta p{color:var(--text-dim);font-size:var(--fs-sm);margin-bottom:var(--sp-4)}
.pc-buy-wrap{
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  background:linear-gradient(180deg,var(--card-2),var(--card));
  box-shadow:var(--shadow);
}
/* app 页（个人版）行数少：表格与左栏自动等高，行高随之舒展 */
.pc-buy-layout.is-app{align-items:stretch}
.pc-buy-layout.is-app .pc-buy-wrap{display:grid}
.pc-buy-layout.is-app .pc-buy-table{height:100%}
.pc-buy-layout.is-app .pc-buy-table td{padding:22px var(--sp-6)}
.pc-buy-table{width:100%;border-collapse:collapse}
.pc-buy-table th,.pc-buy-table td{
  padding:17px var(--sp-6);text-align:left;font-size:var(--fs-sm);
  border-bottom:1px solid var(--line);vertical-align:middle;
}
.pc-buy-table th{
  font-size:var(--fs-xs);font-weight:700;letter-spacing:.1em;
  color:var(--text-mute);background:rgba(255,255,255,.025);
}
.pc-buy-table tbody tr{transition:background .25s var(--ease)}
.pc-buy-table tbody tr:hover{background:rgba(31,174,90,.05)}
.pc-buy-table tbody tr:last-child td{border-bottom:0}
.pc-buy-table td:first-child{color:var(--text);font-weight:600;white-space:nowrap}
/* 组成项：图标 + 文字 */
.pc-buy-item{display:inline-flex;align-items:center;gap:10px}
.pc-buy-item img{width:26px;height:26px;object-fit:contain;display:block;flex-shrink:0}
.pc-buy-table td:last-child{color:var(--text-dim)}
.pc-buy-tag{
  display:inline-block;white-space:nowrap;
  font-size:var(--fs-xs);font-weight:700;letter-spacing:.02em;
  padding:3px 11px;border-radius:var(--r-pill);
  color:var(--green-bright);background:var(--green-soft);border:1px solid rgba(31,174,90,.3);
}
.pc-buy-tag.is-ghost{color:#8dc0ff;background:var(--blue-soft);border-color:rgba(59,130,246,.32)}
.pc-buy-tag.is-solid{color:#08110c;background:var(--green-bright);border-color:transparent}

/* 设备管理：两种方式（左栏内竖排） */
.pc-buy-modes{display:grid;gap:var(--sp-3)}
.pc-buy-mode{
  display:flex;gap:var(--sp-4);align-items:flex-start;
  padding:var(--sp-5) var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease),transform .28s var(--ease);
}
.pc-buy-mode:hover{border-color:rgba(31,174,90,.45);transform:translateY(-3px)}
.pc-buy-mode b{display:block;font-size:var(--fs-base);font-weight:700;margin-bottom:5px}
.pc-buy-mode p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7}
.pc-buy-ic{
  display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:var(--r-card);
  background:var(--green-soft);border:1px solid rgba(31,174,90,.3);color:var(--green-bright);
}
.pc-buy-ic.blue{background:var(--blue-soft);border-color:rgba(59,130,246,.32);color:#8dc0ff}
.pc-buy-ic svg{width:20px;height:20px}

/* 产品矩阵：五大产品合并图 + 参数说明表（不折叠） */
.pc-hw-merge{display:grid;grid-template-columns:1.144fr .856fr;gap:var(--sp-8);align-items:center}
.pc-hw-media{
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  background:linear-gradient(180deg,var(--card-2),var(--card));box-shadow:var(--shadow);
  aspect-ratio:1024/576;
}
.pc-hw-media img{width:100%;height:100%;object-fit:cover;display:block}
.pc-hw-spec{
  padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.022),rgba(255,255,255,.008));
}
.pc-hw-spec-title{font-size:var(--fs-h3);font-weight:700;margin-bottom:var(--sp-4)}
.pc-spec-table{width:100%;border-collapse:collapse}
.pc-spec-table th,.pc-spec-table td{
  padding:11px 12px;text-align:left;font-size:var(--fs-sm);
  border-bottom:1px solid var(--line);vertical-align:top;line-height:1.6;
}
.pc-spec-table th{color:var(--text);font-weight:600;background:rgba(255,255,255,.02);white-space:nowrap}
.pc-spec-table td{color:var(--text-dim)}
.pc-spec-table td:first-child{color:var(--text);font-weight:600;white-space:nowrap}
.pc-spec-table tr:last-child td{border-bottom:0}
.pc-hw-spec .stat-note{padding:var(--sp-3) 0 0;color:var(--text-mute)}

/* 客户端（电脑 / Pad） */
.pc-client-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}
.pc-client-note{margin-top:var(--sp-8);text-align:center;color:var(--text-dim);font-size:var(--fs-sm)}

/* 为什么用教练端：决策场景卡 + 方法背书 */
.pc-why-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}
.pc-why{
  display:flex;flex-direction:column;
  padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease),transform .28s var(--ease);
}
.pc-why:hover{border-color:rgba(31,174,90,.42);transform:translateY(-3px)}
.pc-why-q{
  font-size:var(--fs-h3);font-weight:700;line-height:1.45;margin-bottom:var(--sp-4);
  padding-left:12px;border-left:3px solid var(--green);
}
.pc-why-media{
  aspect-ratio:1024/576;border:1px solid var(--line);border-radius:var(--r-card);
  overflow:hidden;background:#0d141c;margin-bottom:var(--sp-4);
}
.pc-why-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s var(--ease)}
.pc-why:hover .pc-why-media img{transform:scale(1.03)}
.pc-why-a{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.75}
.pc-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--sp-4)}
.pc-chips span{
  font-family:"Geist Mono","JetBrains Mono",ui-monospace,Consolas,"PingFang SC","Microsoft YaHei",monospace;
  font-size:var(--fs-xs);color:var(--text-dim);letter-spacing:.01em;
  padding:3px 10px;border-radius:var(--r-pill);
  border:1px solid var(--line);background:rgba(255,255,255,.03);
}
.pc-chips-lg span{font-size:var(--fs-sm);color:var(--text);padding:5px 12px;border-color:rgba(31,174,90,.3);background:var(--green-soft)}

.pc-method{
  display:grid;grid-template-columns:auto 1fr;gap:var(--sp-8);align-items:center;
  margin-top:var(--sp-8);padding:var(--sp-8);
  border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(100deg, rgba(31,174,90,.10), rgba(59,130,246,.08));
}
.pc-method-stat{display:flex;flex-direction:column;align-items:center;gap:6px;padding-right:var(--sp-6);border-right:1px solid var(--line)}
.pc-method-stat small{color:var(--text-dim);font-size:var(--fs-xs);white-space:nowrap}
.pc-method-body b{display:block;font-size:var(--fs-h3);font-weight:700;margin-bottom:6px}
.pc-method-body p{color:var(--text-dim);font-size:var(--fs-sm)}
.pc-method-body .pc-chips{margin-top:var(--sp-4)}

/* ===== 360+ 项数据支撑：动态关键词墙 ===== */
.pc-data-section{
  position:relative;overflow:hidden;
  padding-block:var(--sp-20);
  border-block:1px solid var(--line);
  background:#0b0f14;
}
/* 关键词墙 */
.pc-kw-wall{
  position:absolute;inset:-6% -4%;
  display:flex;flex-direction:column;justify-content:center;gap:14px;
  opacity:.72;pointer-events:none;
  transition:transform .5s var(--ease);
  will-change:transform;
}
.pc-kw-row{display:flex;width:max-content}
.pc-kw-row.reverse{justify-content:flex-end}
.pc-kw-track{display:flex;animation:kwScroll var(--dur,60s) linear infinite}
.pc-kw-row.reverse .pc-kw-track{animation-direction:reverse}
.pc-kw-group{display:flex;gap:14px;padding-right:14px}
@keyframes kwScroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.pc-kw-item{
  white-space:nowrap;font-size:14px;letter-spacing:.02em;
  font-family:"Geist Mono","JetBrains Mono",ui-monospace,Consolas,"PingFang SC","Microsoft YaHei",monospace;
  color:rgba(180,196,212,.82);
  padding:7px 14px;border-radius:var(--r-pill);
  border:1px solid rgba(52,68,84,.95);background:rgba(255,255,255,.03);
}
.pc-kw-item.is-hi{color:var(--green-bright);border-color:rgba(31,174,90,.42);background:rgba(31,174,90,.10)}
.pc-kw-item.is-blue{color:#8dc0ff;border-color:rgba(59,130,246,.4);background:rgba(59,130,246,.10)}
.pc-kw-wall[data-paused="1"] .pc-kw-track{animation-play-state:paused}
/* 遮罩：中心压暗范围更大更深（聚光），由内向外平缓放开 */
.pc-kw-fade{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(78% 76% at 50% 50%,
      rgba(11,15,20,.96) 0%,
      rgba(11,15,20,.90) 30%,
      rgba(11,15,20,.72) 52%,
      rgba(11,15,20,.44) 72%,
      rgba(11,15,20,.16) 90%,
      transparent 100%),
    linear-gradient(180deg,
      rgba(11,15,20,.90) 0%,
      rgba(11,15,20,.34) 16%,
      transparent 38%,
      transparent 62%,
      rgba(11,15,20,.34) 84%,
      rgba(11,15,20,.90) 100%);
}
/* 中央内容 */
.pc-data-inner{position:relative;z-index:2;text-align:center;max-width:860px;margin-inline:auto}
/* 仅内容区做局部柔边压暗，替代全局深遮罩 → 周边关键词更亮更清晰 */
.pc-data-inner::before{
  content:"";position:absolute;left:-16%;right:-16%;top:-14%;bottom:-16%;z-index:-1;
  pointer-events:none;
  background:radial-gradient(60% 60% at 50% 48%,
    rgba(11,15,20,.34) 0%,
    rgba(11,15,20,.20) 50%,
    rgba(11,15,20,.06) 82%,
    transparent 100%);
}
.pc-data-num{
  display:flex;align-items:baseline;justify-content:center;gap:2px;
  font-size:104px;font-weight:800;line-height:1;letter-spacing:-.03em;
  color:var(--green-bright);
  text-shadow:0 0 46px rgba(31,174,90,.4);
}
.pc-data-num .unit{font-style:normal;font-weight:800;font-size:.5em}
.pc-data-title{font-size:var(--fs-h1);font-weight:700;margin-top:var(--sp-2);letter-spacing:.01em}
.pc-data-lead{margin-top:var(--sp-6);font-size:var(--fs-h3);font-weight:600;color:var(--text)}
.pc-data-desc{margin-top:var(--sp-3);color:var(--text-dim);font-size:var(--fs-sm);line-height:1.8}
.pc-data-chips{justify-content:center;margin-top:var(--sp-6)}
.pc-data-cta{margin-top:var(--sp-8);display:flex;justify-content:center}
.pc-data-note{margin-top:var(--sp-6);color:var(--text-mute)}

@media (max-width:1080px){
  .pc-data-section{padding-block:var(--sp-16)}
  .pc-data-num{font-size:78px}
  .pc-kw-wall{opacity:.58;gap:11px}
  .pc-kw-item{font-size:12px;padding:6px 11px}
}
@media (max-width:860px){
  .pc-data-num{font-size:60px}
  .pc-data-lead{font-size:var(--fs-base)}
  .pc-kw-wall{opacity:.48;gap:9px}
}

@media (max-width:1080px){
  .pc-hero-grid{grid-template-columns:1fr;gap:var(--sp-10)}
  .pc-hero-visual{order:-1}
  .pc-hw-grid{grid-template-columns:repeat(3,1fr)}
  .pc-hw-merge{grid-template-columns:1fr;gap:var(--sp-6)}
  .pc-tech-grid,.pc-certs,.pc-scenes{grid-template-columns:repeat(2,1fr)}
  .pc-fn-grid{grid-template-columns:1fr}
  .pc-client-grid{grid-template-columns:1fr}
  .pc-why-grid{grid-template-columns:1fr}
  .pc-method{grid-template-columns:1fr;gap:var(--sp-5);padding:var(--sp-6)}
  .pc-method-stat{padding-right:0;padding-bottom:var(--sp-5);border-right:0;border-bottom:1px solid var(--line);align-self:stretch}
  .pc-stat{flex-direction:column;align-items:flex-start;gap:var(--sp-3);padding:var(--sp-6)}
  .pc-stat-num{font-size:44px}
  .pc-buy-layout{grid-template-columns:1fr;gap:var(--sp-8)}
}
@media (max-width:860px){
  .pc-hero{padding-block:var(--sp-12) var(--sp-10)}
  .pc-hw-grid{grid-template-columns:repeat(2,1fr)}
  .pc-hw-spec{padding:var(--sp-4)}
  .pc-tech-grid,.pc-certs,.pc-scenes{grid-template-columns:1fr}
  .pc-sub-title{margin-top:var(--sp-8)}
  .pc-buy-wrap{overflow-x:auto}
  .pc-buy-table{min-width:520px}
  .pc-buy-table th,.pc-buy-table td{padding:12px var(--sp-4)}
}

/* ========================= 家长与球员页（pa-*） ========================= */
.pa-hero{
  position:relative;overflow:hidden;
  padding-block:var(--sp-20) var(--sp-16);
  background:
    radial-gradient(1000px 520px at 78% -10%, rgba(31,174,90,.16), transparent 62%),
    radial-gradient(800px 460px at 12% 8%, rgba(59,130,246,.10), transparent 66%);
}
.pa-hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:var(--sp-16);align-items:center}
.pa-hero-visual{
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  background:linear-gradient(180deg,var(--card-2),var(--card));box-shadow:var(--shadow);
}
.pa-hero-visual img{width:100%;display:block}

/* 三种人，三种用法 */
.pa-persona-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6)}
.pa-persona{
  display:flex;flex-direction:column;
  padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease),transform .28s var(--ease);
}
.pa-persona:hover{border-color:rgba(31,174,90,.42);transform:translateY(-3px)}
.pa-persona-media{
  aspect-ratio:4/3;border:1px solid var(--line);border-radius:var(--r-card);
  overflow:hidden;background:#0d141c;margin-bottom:var(--sp-5);
}
.pa-persona-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s var(--ease)}
.pa-persona:hover .pa-persona-media img{transform:scale(1.03)}
.pa-persona-tag{
  display:inline-block;align-self:flex-start;margin-bottom:var(--sp-3);
  font-size:var(--fs-xs);padding:3px 10px;border-radius:var(--r-pill);
  color:var(--green-bright);background:var(--green-soft);border:1px solid rgba(31,174,90,.28);
}
.pa-persona h3{font-size:var(--fs-h3);font-weight:700;line-height:1.4;margin-bottom:var(--sp-3)}
.pa-persona > p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.75}

/* 个人版 · 系统构成（左图右文，图与「球队与教练」页产品矩阵保持一致） */
.pa-build-grid{display:grid;grid-template-columns:1.144fr .856fr;gap:var(--sp-8);align-items:center}
.pa-build-media{
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  background:linear-gradient(180deg,var(--card-2),var(--card));box-shadow:var(--shadow);
  aspect-ratio:1024/576;
}
.pa-build-media img{width:100%;height:100%;object-fit:cover;display:block}
.pa-build-body{text-align:left}
.pa-build-list{display:grid;gap:var(--sp-5);margin-top:var(--sp-8)}
.pa-build-item{display:flex;gap:var(--sp-4);align-items:flex-start}
.pa-build-no{
  display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:50%;
  background:var(--green-soft);border:1px solid rgba(31,174,90,.3);
  color:var(--green-bright);font-size:var(--fs-xs);font-weight:800;
}
.pa-build-item b{display:block;font-size:var(--fs-base);font-weight:700;margin-bottom:3px}
.pa-build-item p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7}

/* 手机里有什么：图 + 问答式说明 */
.pa-fn-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}
.pa-fn{
  display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5);align-items:center;
  padding:var(--sp-5);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease),transform .28s var(--ease);
}
.pa-fn:hover{border-color:rgba(31,174,90,.42);transform:translateY(-3px)}
.pa-fn-media{aspect-ratio:4/3;border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;background:#0d141c}
.pa-fn-media img{width:100%;height:100%;object-fit:cover;display:block}
.pa-fn-q{
  font-size:var(--fs-base);font-weight:700;line-height:1.45;margin-bottom:var(--sp-3);
  padding-left:10px;border-left:3px solid var(--green);
}
.pa-fn-body > p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.75}
.pa-fn-body .pc-chips{margin-top:var(--sp-3)}
.pa-fn-body .pc-chips span{font-size:11px;padding:2px 8px}

/* 给家长：四问 */
.pa-qa-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
.pa-qa{
  padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease);
}
.pa-qa:hover{border-color:rgba(31,174,90,.4)}
.pa-qa-q{font-size:var(--fs-h3);font-weight:700;line-height:1.4;margin-bottom:var(--sp-3)}
.pa-qa-q::before{
  content:"Q";display:inline-grid;place-items:center;vertical-align:2px;
  width:20px;height:20px;margin-right:8px;border-radius:6px;
  font-size:11px;font-weight:800;color:var(--green-bright);
  background:var(--green-soft);border:1px solid rgba(31,174,90,.3);
}
.pa-qa p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.8}

/* 数据来源 */
.pa-source-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);margin-bottom:var(--sp-4)}
.pa-source{
  display:flex;gap:var(--sp-4);align-items:flex-start;
  padding:var(--sp-5) var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease);
}
.pa-source:hover{border-color:rgba(31,174,90,.42)}
.pa-source b{display:block;font-size:var(--fs-base);font-weight:700;margin-bottom:5px}
.pa-source p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.75}
.pa-source-ic{
  display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:var(--r-card);
  background:var(--green-soft);border:1px solid rgba(31,174,90,.3);color:var(--green-bright);
}
.pa-source-ic.blue{background:var(--blue-soft);border-color:rgba(59,130,246,.32);color:#8dc0ff}
.pa-source-ic svg{width:20px;height:20px}

/* 隐私与授权 */
.pa-privacy{
  padding:var(--sp-6) var(--sp-8);border:1px solid rgba(31,174,90,.28);border-radius:var(--r-lg);
  background:linear-gradient(100deg, rgba(31,174,90,.09), rgba(59,130,246,.06));
}
.pa-privacy b{display:block;font-size:var(--fs-h3);font-weight:700;margin-bottom:var(--sp-3)}

@media (max-width:1080px){
  .pa-hero-grid{grid-template-columns:1fr;gap:var(--sp-10)}
  .pa-hero-visual{order:-1}
  .pa-persona-grid,.pa-fn-grid,.pa-qa-grid,.pa-source-grid{grid-template-columns:1fr}
  .pa-build-grid{grid-template-columns:1fr;gap:var(--sp-8)}
  .pa-build-media{order:-1}
}
@media (max-width:860px){
  .pa-hero{padding-block:var(--sp-12) var(--sp-10)}
  .pa-fn{grid-template-columns:1fr}
  .pa-privacy{padding:var(--sp-5)}
}

/* ========================= 足协与联赛页（fa-*） ========================= */
/* ② 现实困境 */
.fa-pains{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
.fa-pain{
  padding:var(--sp-5) var(--sp-6);
  border:1px solid var(--line);border-left-width:3px;border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease);
}
.fa-pain:hover{border-color:rgba(31,174,90,.4)}
.fa-pain-now{color:var(--text);font-size:var(--fs-base);font-weight:600;line-height:1.6}
.fa-pain-result{display:flex;gap:8px;margin-top:8px;color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7}
.fa-pain-result::before{content:"→";color:var(--amber);flex-shrink:0}
.fa-lead{margin-top:var(--sp-8);text-align:center;font-size:var(--fs-h3);font-weight:600;color:var(--text)}
.fa-lead b{color:var(--green-bright)}

/* ③ 三层架构：大图 75% + 右侧说明竖排 25%
   图片宽 ≈ 容器 × 0.75，SVG 缩放系数随之提升（字号更清晰） */
.fa-arch{display:grid;grid-template-columns:3fr 1fr;gap:var(--sp-8);align-items:start}
/* ④ 驾驶舱：大图 60% + 右侧四视角卡片 */
.fa-dash{display:grid;grid-template-columns:1.5fr 1fr;gap:var(--sp-8);align-items:center}
/* ⑤ API / ⑥ 城市平台：左图右文 */
.fa-api,.fa-city{display:grid;grid-template-columns:1.02fr .98fr;gap:var(--sp-10);align-items:center}
.fa-api{grid-template-columns:.98fr 1.02fr}
.fa-arch-media,.fa-dash-media,.fa-api-media,.fa-city-media{
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  background:linear-gradient(180deg,var(--card-2),var(--card));box-shadow:var(--shadow);
}
.fa-arch-media img,.fa-dash-media img,.fa-api-media img,.fa-city-media img{width:100%;display:block}

/* ③ 架构：右侧说明竖排三个标签容器 */
.fa-arch-list{display:grid;gap:var(--sp-4);align-content:start}
.fa-arch-item{
  padding:var(--sp-5);border:1px solid var(--line);border-radius:var(--r-lg);
  background:rgba(255,255,255,.012);transition:border-color .28s var(--ease),transform .28s var(--ease);
}
.fa-arch-item:hover{border-color:rgba(31,174,90,.42);transform:translateY(-3px)}
.fa-arch-tag{
  display:inline-block;margin-bottom:var(--sp-3);padding:3px 10px;border-radius:var(--r-pill);
  font-size:var(--fs-xs);letter-spacing:.02em;
  background:var(--green-soft);border:1px solid rgba(31,174,90,.28);color:var(--green-bright);
}
.fa-arch-item b{display:block;font-size:var(--fs-base);font-weight:700;margin-bottom:4px}
.fa-arch-item p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7}

/* ④ 驾驶舱：概念标注 + 四视角 */
.fa-flag{
  display:inline-block;margin-left:8px;padding:2px 9px;border-radius:var(--r-pill);
  font-size:var(--fs-xs);background:var(--blue-soft);border:1px solid rgba(59,130,246,.3);color:var(--blue-bright);
}
.fa-dash-list{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
.fa-dash-item{
  position:relative;display:flex;gap:var(--sp-4);align-items:flex-start;overflow:hidden;
  padding:var(--sp-5);
  border:1px solid var(--line);border-radius:var(--r-card);
  background:
    linear-gradient(135deg, rgba(31,174,90,.09), rgba(255,255,255,.012) 62%),
    linear-gradient(180deg, var(--card-2), var(--card));
  transition:border-color .28s var(--ease),transform .28s var(--ease),box-shadow .28s var(--ease);
}
/* 顶部渐变细线 */
.fa-dash-item::before{
  content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg, rgba(52,224,122,.75), rgba(31,174,90,.18) 55%, transparent);
}
/* 右下大号水印序号 */
.fa-dash-item::after{
  content:attr(data-no);position:absolute;right:10px;bottom:2px;pointer-events:none;
  font-family:"Geist Mono","JetBrains Mono",ui-monospace,Consolas,monospace;
  font-size:42px;font-weight:800;line-height:1;letter-spacing:-.04em;
  color:rgba(159,176,192,.08);
}
.fa-dash-item > div{position:relative;z-index:1}
.fa-dash-item:hover{
  border-color:rgba(31,174,90,.45);transform:translateY(-3px);
  box-shadow:0 12px 28px rgba(0,0,0,.34),0 0 0 1px rgba(31,174,90,.12);
}
.fa-dash-ic{
  display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:9px;
  background:var(--green-soft);border:1px solid rgba(31,174,90,.3);color:var(--green-bright);
}
.fa-dash-ic svg{width:18px;height:18px}
.fa-dash-item b{display:block;font-size:var(--fs-base);font-weight:700;margin-bottom:4px}
.fa-dash-item p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7}
.fa-note{margin-top:var(--sp-5);color:var(--text-mute);font-size:var(--fs-xs)}

/* ⑤ API：四条能力 */
.fa-api-list{display:grid;gap:var(--sp-3)}
.fa-api-item{
  padding:var(--sp-4) var(--sp-5);
  border:1px solid var(--line);border-left-width:3px;border-left-color:rgba(31,174,90,.5);
  border-radius:var(--r-card);background:rgba(255,255,255,.012);
  transition:border-color .28s var(--ease);
}
.fa-api-item:hover{border-color:rgba(31,174,90,.5)}
.fa-api-item b{display:block;font-size:var(--fs-base);font-weight:700;margin-bottom:3px}
.fa-api-item p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7}
.fa-chips{justify-content:center;margin-top:var(--sp-8)}

/* ⑥ 城市足球数据平台：五个场景 */
.fa-city-list{display:grid;gap:var(--sp-3)}
.fa-city-item{
  display:flex;gap:var(--sp-4);align-items:baseline;
  padding:var(--sp-4) var(--sp-5);border:1px solid var(--line);border-radius:var(--r-card);
  background:rgba(255,255,255,.012);transition:border-color .28s var(--ease);
}
.fa-city-item:hover{border-color:rgba(31,174,90,.42)}
.fa-city-item b{flex:0 0 auto;font-size:var(--fs-base);font-weight:700}
.fa-city-item p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7}

/* ⑧ 合作模式：三卡 + 三步流程 */
.fa-modes{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.fa-mode{
  padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease),transform .28s var(--ease);
}
.fa-mode:hover{border-color:rgba(31,174,90,.45);transform:translateY(-3px)}
.fa-mode b{display:block;font-size:var(--fs-h3);font-weight:700;margin-bottom:6px}
.fa-mode span{display:block;font-size:var(--fs-xs);color:var(--text-mute);margin-bottom:var(--sp-3)}
.fa-mode p{color:var(--text-dim);font-size:var(--fs-sm)}
/* 三步流程进度值（复用 sf-steps 主轴组件） */
.sf-steps-3 .sf-step:nth-child(1){--p:33%}
.sf-steps-3 .sf-step:nth-child(3){--p:66%}
.sf-steps-3 .sf-step:nth-child(5){--p:100%}

@media (max-width:1080px){
  .fa-arch,.fa-dash,.fa-api,.fa-city{grid-template-columns:1fr;gap:var(--sp-8)}
  .fa-arch-media,.fa-dash-media,.fa-api-media,.fa-city-media{order:-1}
  .fa-pains{grid-template-columns:1fr}
  .fa-dash-list{grid-template-columns:1fr}
  .fa-modes{grid-template-columns:1fr}
}

/* ========================= 足球学院（bl-*） ========================= */
/* Hero（轻量） */
.bl-hero{
  position:relative;overflow:hidden;
  padding-block:var(--sp-20) var(--sp-10);
  background:radial-gradient(1000px 460px at 78% -20%, rgba(31,174,90,.14), transparent 62%);
}
.bl-hero-title{
  margin-top:var(--sp-3);font-size:clamp(30px,3.4vw,46px);font-weight:800;
  line-height:1.2;letter-spacing:-.01em;
}
.bl-hero-desc{margin-top:var(--sp-4);color:var(--text-dim);font-size:var(--fs-base)}

/* 置顶区：与列表视觉区分（独立底色 + 上下边框 + 精编角标） */
.bl-pinned{
  background:linear-gradient(180deg, rgba(31,174,90,.055), rgba(255,255,255,.012) 55%, transparent);
  border-block:1px solid var(--line);
}
.bl-pin-head{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;margin-bottom:var(--sp-6)}
.bl-pin-badge{
  display:inline-flex;align-items:center;padding:5px 14px;border-radius:var(--r-pill);
  font-size:var(--fs-sm);font-weight:700;color:#08110c;background:var(--green-bright);
}
.bl-pin-note{color:var(--text-mute);font-size:var(--fs-sm)}

/* 置顶：左右各 50%（左 1 大卡 + 右 2 卡）；三卡统一「图上文下」+ 16:9 横版图 */
.bl-pin-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:var(--sp-6);align-items:stretch}
.bl-pin-side{display:grid;gap:var(--sp-6)}

.bl-pin{
  position:relative;display:flex;flex-direction:column;overflow:hidden;text-decoration:none;
  border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease),transform .28s var(--ease),box-shadow .28s var(--ease);
}
.bl-pin:hover{border-color:rgba(31,174,90,.5);transform:translateY(-4px);box-shadow:0 16px 38px rgba(0,0,0,.4)}
/* 图片区：主卡与次卡同宽同比例（16:9 横版） */
.bl-pin .bl-pin-media{
  position:relative;aspect-ratio:16/9;overflow:hidden;background:#0d141c;
  border-bottom:1px solid var(--line);
}
.bl-pin .bl-pin-media{flex:0 0 auto}   /* 图片高度锁定 16:9，不随卡片拉伸 */
.bl-pin .bl-pin-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.bl-pin:hover .bl-pin-media img{transform:scale(1.03)}
/* 主卡文字 */
.bl-pin-main .bl-pin-body{
  padding:var(--sp-6);flex:1;
  display:flex;flex-direction:column;justify-content:flex-start;
}
.bl-pin-main h3{font-size:var(--fs-h2);font-weight:800;line-height:1.35;margin:0 0 var(--sp-3)}
.bl-pin-main p{
  color:var(--text-dim);font-size:var(--fs-sm);line-height:1.75;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
/* 次卡图片：高度压到 16:9 的 60%（约 2.96:1 扁横图，比例可与主卡不同） */
.bl-pin-side-item .bl-pin-media{aspect-ratio:80/27}
/* 次卡文字（同为图上文下，标题下带描述） */
.bl-pin-side-item .bl-pin-body{padding:var(--sp-5)}
.bl-pin-side-item h4{font-size:var(--fs-h3);font-weight:700;line-height:1.4;margin:0 0 var(--sp-3)}
.bl-pin-side-item p{
  color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

.bl-pin-flag{
  display:inline-block;padding:3px 10px;border-radius:var(--r-pill);
  font-size:var(--fs-xs);font-weight:800;letter-spacing:.04em;
  color:#08110c;background:var(--green-bright);
}
.bl-pin-main .bl-pin-flag{position:absolute;top:12px;left:12px;z-index:3}

/* 通用：分类标签 / 元信息 */
.bl-cat{
  display:inline-block;padding:3px 10px;border-radius:var(--r-pill);
  font-size:var(--fs-xs);font-weight:600;
  color:var(--green-bright);background:var(--green-soft);border:1px solid rgba(31,174,90,.28);
}
/* 分类标签：统一浮在图片左下角（置顶卡与列表卡一致） */
.bl-card-media .bl-cat,
.bl-pin-media .bl-cat{
  position:absolute;left:12px;bottom:12px;z-index:2;
  background:rgba(9,13,18,.74);border-color:rgba(31,174,90,.45);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  box-shadow:0 4px 14px rgba(0,0,0,.35);
}
.bl-meta{display:block;margin-top:var(--sp-4);color:var(--text-mute);font-size:var(--fs-xs)}

/* 列表：标题 + 分类 Tabs */
.bl-list-head{
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-6);
  flex-wrap:wrap;margin-bottom:var(--sp-6);
}
.bl-list-head .section-title{margin:0}
.bl-tabs{display:flex;flex-wrap:wrap;gap:8px}
.bl-tab{
  padding:7px 15px;border-radius:var(--r-pill);cursor:pointer;
  font-size:var(--fs-sm);color:var(--text-dim);
  background:rgba(255,255,255,.03);border:1px solid var(--line);
  transition:color .25s var(--ease),background .25s var(--ease),border-color .25s var(--ease);
}
.bl-tab:hover{color:var(--text);border-color:rgba(31,174,90,.35)}
.bl-tab.is-active{color:#08110c;background:var(--green-bright);border-color:transparent;font-weight:700}

/* 文章卡片网格 */
.bl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6)}
.bl-card{
  display:flex;flex-direction:column;overflow:hidden;text-decoration:none;
  border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease),transform .28s var(--ease),box-shadow .28s var(--ease);
}
.bl-card:hover{border-color:rgba(31,174,90,.45);transform:translateY(-4px);box-shadow:0 14px 32px rgba(0,0,0,.35)}
.bl-card-media{position:relative;aspect-ratio:16/9;overflow:hidden;background:#0d141c;border-bottom:1px solid var(--line)}
.bl-card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.bl-card:hover .bl-card-media img{transform:scale(1.04)}
.bl-card-body{padding:var(--sp-5);display:flex;flex-direction:column;flex:1}
.bl-card-body h3{font-size:var(--fs-h3);font-weight:700;line-height:1.45;margin:0 0 var(--sp-3)}
.bl-card-body p{flex:1;color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7}

/* 筛选时的隐藏（覆盖 .bl-card / .bl-more 的 display） */
.bl-card[hidden],.bl-more[hidden]{display:none}
.bl-empty{text-align:center;color:var(--text-mute);font-size:var(--fs-sm);padding:var(--sp-10) 0}
.bl-more{display:flex;justify-content:center;margin-top:var(--sp-10)}

/* ===== 文章详情 ===== */
.bl-article{padding-block:var(--sp-16) var(--sp-10)}
.bl-article-inner{max-width:var(--container);margin-inline:auto}
.bl-back{
  display:inline-block;margin-bottom:var(--sp-6);
  color:var(--text-dim);font-size:var(--fs-sm);text-decoration:none;transition:color .25s var(--ease);
}
.bl-back:hover{color:var(--green-bright)}
.bl-article-head .bl-pin-flag{margin-bottom:var(--sp-4)}
.bl-article-title{
  margin:var(--sp-4) 0;font-size:clamp(26px,2.8vw,40px);
  font-weight:800;line-height:1.25;letter-spacing:-.01em;
}
.bl-article-sub{color:var(--text-dim);font-size:var(--fs-base);line-height:1.8}
.bl-article-meta{margin-top:var(--sp-4);color:var(--text-mute);font-size:var(--fs-xs)}

/* 正文内的裸图：不超过正文宽度 */
.bl-prose img{max-width:100%;height:auto}

/* 内容图：按图片「原始宽度」显示（仅在超过正文宽度时收缩），整体随之收缩并居中 */
.bl-figure{
  width:fit-content;max-width:100%;margin:var(--sp-8) auto;
  border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#0d141c;
}
.bl-figure img{width:auto;max-width:100%;height:auto;display:block}
.bl-figure-cap{display:block;padding:10px var(--sp-5);color:var(--text-mute);font-size:var(--fs-xs);border-top:1px solid var(--line)}

/* 正文排版（阅读限宽） */
.bl-prose{max-width:min(1000px,94%);margin-top:var(--sp-10);color:var(--text-dim);font-size:16px;line-height:1.9}
.bl-prose h2{
  margin:var(--sp-10) 0 var(--sp-4);padding-left:12px;border-left:3px solid var(--green);
  color:var(--text);font-size:22px;font-weight:700;line-height:1.5;
}
.bl-prose h3{margin:var(--sp-6) 0 var(--sp-3);color:var(--text);font-size:17px;font-weight:700}
.bl-prose p{margin-bottom:var(--sp-4)}
.bl-prose ul,.bl-prose ol{margin:0 0 var(--sp-4);padding-left:0;list-style:none}
.bl-prose ul li,.bl-prose ol li{position:relative;padding-left:20px;margin-bottom:10px}
.bl-prose ul li::before{
  content:"";position:absolute;left:2px;top:11px;width:6px;height:6px;border-radius:50%;
  background:var(--green-bright);
}
.bl-prose ol{counter-reset:li}
.bl-prose ol li{counter-increment:li}
.bl-prose ol li::before{
  content:counter(li);position:absolute;left:0;top:3px;
  font-family:"Geist Mono","JetBrains Mono",ui-monospace,Consolas,monospace;
  font-size:12px;font-weight:800;color:var(--green-bright);
}
.bl-prose b{color:var(--text)}
.bl-prose table{width:100%;border-collapse:collapse;margin:var(--sp-5) 0;font-size:var(--fs-sm)}
.bl-prose th,.bl-prose td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line)}
.bl-prose th{color:var(--text);font-weight:700;background:rgba(255,255,255,.025)}
.bl-prose blockquote{
  margin:var(--sp-5) 0;padding:var(--sp-4) var(--sp-5);
  border-left:3px solid rgba(31,174,90,.5);border-radius:0 var(--r-card) var(--r-card) 0;
  background:rgba(255,255,255,.02);
}
.bl-lead{font-size:18px;line-height:1.85;color:var(--text)}
.bl-tip{
  margin:var(--sp-5) 0;padding:var(--sp-4) var(--sp-5);
  border:1px solid rgba(31,174,90,.28);border-radius:var(--r-card);
  background:rgba(31,174,90,.07);color:var(--text);font-size:var(--fs-sm);line-height:1.8;
}
.bl-end{
  margin-top:var(--sp-8);padding-top:var(--sp-6);border-top:1px solid var(--line);
  color:var(--text);font-size:var(--fs-base);line-height:1.85;
}
/* 正文「参考文献」列表：小字、弱化、保留编号 */
.bl-refs{margin-top:var(--sp-5)}
.bl-refs li{font-size:var(--fs-sm);color:var(--text-mute);line-height:1.7;margin-bottom:8px}
.bl-refs li i{font-style:italic;color:var(--text-dim)}

@media (max-width:1080px){
  .bl-pin-grid{grid-template-columns:1fr}
  .bl-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .bl-hero{padding-block:var(--sp-12) var(--sp-8)}
  .bl-grid{grid-template-columns:1fr}
  .bl-pin-main h3{font-size:20px}
  .bl-article-inner{max-width:none}
  .bl-prose{font-size:15.5px}
  .bl-prose h2{font-size:20px}
}

/* ========================= 下载中心（dl-*） ========================= */
.dl-hero{padding-block:var(--sp-20) var(--sp-2)}

/* 教练端主卡 */
.dl-coach{
  display:grid;grid-template-columns:1.4fr .6fr;gap:var(--sp-10);align-items:center;
  padding:var(--sp-10);border:1px solid rgba(31,174,90,.32);border-radius:var(--r-lg);
  background:linear-gradient(105deg, rgba(31,174,90,.13), rgba(59,130,246,.07));
  box-shadow:var(--shadow);
}
.dl-badge{
  display:inline-block;padding:5px 14px;border-radius:var(--r-pill);
  font-size:var(--fs-xs);font-weight:700;letter-spacing:.04em;
  color:var(--green-bright);background:var(--green-soft);border:1px solid rgba(31,174,90,.3);
}
.dl-coach-title{font-size:var(--fs-h1);font-weight:800;margin:var(--sp-4) 0 var(--sp-3);letter-spacing:-.01em}
.dl-coach-desc{color:var(--text-dim);font-size:var(--fs-base);line-height:1.8;max-width:48ch}
.dl-coach-actions{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;margin-top:var(--sp-6)}
.dl-ver{color:var(--text-mute);font-size:var(--fs-sm)}
.dl-notes{margin-top:var(--sp-6);display:grid;gap:8px}
.dl-notes li{position:relative;padding-left:18px;color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7}
.dl-notes li::before{
  content:"";position:absolute;left:2px;top:10px;width:5px;height:5px;border-radius:50%;
  background:var(--green-bright);
}
.dl-coach-qr{display:grid;justify-items:center;gap:var(--sp-3)}
.dl-coach-qr b{font-size:var(--fs-base);font-weight:700}
.dl-coach-qr span{color:var(--text-dim);font-size:var(--fs-xs)}

/* 二维码容器：白底 + 留白，任何底色下都清晰可扫 */
.dl-qr{
  position:relative;display:grid;place-items:center;
  padding:var(--sp-4);border-radius:var(--r-card);background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.dl-qr img{width:100%;max-width:180px;display:block}

/* 球员与家长端：三端二维码 */
.dl-apps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-6)}
.dl-app{
  display:grid;justify-items:center;gap:var(--sp-4);text-align:center;
  padding:var(--sp-8) var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));
  transition:border-color .28s var(--ease),transform .28s var(--ease);
}
.dl-app:hover{border-color:rgba(31,174,90,.45);transform:translateY(-3px)}
/* 系统图标（苹果 / 安卓 / 鸿蒙）：白色图标，置于卡片顶部，悬停时提亮 */
.dl-app-icon{width:44px;height:44px;display:block;object-fit:contain;opacity:.92;transition:opacity .28s var(--ease)}
.dl-app:hover .dl-app-icon{opacity:1}
.dl-app-head b{display:block;font-size:var(--fs-h3);font-weight:700}
.dl-app-head span{color:var(--text-mute);font-size:var(--fs-xs)}
.dl-app .dl-qr{width:100%;max-width:210px}
.dl-app-tip{color:var(--text-dim);font-size:var(--fs-sm)}
.dl-soon{
  position:absolute;left:0;right:0;bottom:0;padding:5px 0;
  background:rgba(11,15,20,.85);color:var(--text);font-size:var(--fs-xs);
  font-weight:700;letter-spacing:.04em;
}

/* 安装与使用提示 */
.dl-steps{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
.dl-step{
  padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:rgba(255,255,255,.014);
}
.dl-step-no{
  display:inline-block;margin-bottom:8px;
  font-family:"Geist Mono","JetBrains Mono",ui-monospace,Consolas,monospace;
  font-size:var(--fs-xs);font-weight:800;letter-spacing:.12em;color:var(--green-bright);
}
.dl-step b{display:block;font-size:var(--fs-base);font-weight:700;margin-bottom:6px}
.dl-step p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.75}

@media (max-width:1080px){
  .dl-coach{grid-template-columns:1fr;gap:var(--sp-8);padding:var(--sp-8)}
  .dl-coach-qr{order:-1}
  .dl-apps{grid-template-columns:1fr;gap:var(--sp-4)}
  .dl-app{padding:var(--sp-6)}
}
@media (max-width:860px){
  .dl-hero{padding-block:var(--sp-12) var(--sp-2)}
  .dl-steps{grid-template-columns:1fr}
  .dl-qr img{max-width:150px}
}

/* ========================= 预约演示（dm-*） ========================= */
/* 左右互换：说明栏在左、表单在右（HTML 顺序不变，用 order 控制视觉顺序） */
.dm-wrap{display:grid;grid-template-columns:.95fr 1.05fr;gap:var(--sp-10);align-items:start}
.dm-wrap > .dm-side{order:1}
.dm-wrap > .dm-card{order:2}
.dm-card{
  padding:var(--sp-8);border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--card-2),var(--card));box-shadow:var(--shadow);
}
.dm-field{margin-bottom:var(--sp-5)}
.dm-label{display:block;color:var(--text);font-size:var(--fs-sm);font-weight:600;margin-bottom:8px}
.dm-label .req{color:var(--green-bright);margin-left:3px}
.dm-input,.dm-select,.dm-textarea{
  width:100%;padding:12px 14px;border-radius:var(--r-card);
  border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--text);
  font-family:inherit;font-size:var(--fs-base);line-height:1.5;
  transition:border-color .22s var(--ease),background .22s var(--ease);
}
.dm-input:focus,.dm-select:focus,.dm-textarea:focus{
  outline:none;border-color:rgba(31,174,90,.62);background:rgba(31,174,90,.06);
}
.dm-input::placeholder,.dm-textarea::placeholder{color:var(--text-mute)}
.dm-select{
  appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:42px;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%238fa3b4' stroke-width='1.8'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:16px;
}
.dm-select option{background:#111922;color:var(--text)}
.dm-textarea{min-height:112px;resize:vertical;line-height:1.7}
.dm-hint{color:var(--text-mute);font-size:var(--fs-xs);line-height:1.7;margin-top:6px}
.dm-submit{width:100%;margin-top:var(--sp-3)}
.dm-msg{display:none;margin-top:var(--sp-4);font-size:var(--fs-sm);line-height:1.7}
.dm-msg.is-err{display:block;color:#ff9a9a}
.dm-msg.is-ok{display:block;color:var(--green-bright)}

/* 说明栏（视觉上位于左侧） */
.dm-side{display:grid;gap:var(--sp-4)}
/* 栏内页头文案：由原 Hero 移入，字号比原 section-title（--fs-h2）明显加大 */
.dm-side-head{margin-bottom:var(--sp-2)}
.dm-side-title{font-size:var(--fs-h1);line-height:1.25;font-weight:800;letter-spacing:-.02em}
.dm-side-desc{margin-top:var(--sp-4);color:var(--text-dim);font-size:var(--fs-base);line-height:1.8}
.dm-side-card{
  padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--r-lg);
  background:rgba(255,255,255,.014);
}
.dm-side-card h3{font-size:var(--fs-h3);font-weight:700;margin-bottom:var(--sp-4)}
.dm-side-card ul{display:grid;gap:10px}
.dm-side-card li{position:relative;padding-left:20px;color:var(--text-dim);font-size:var(--fs-sm);line-height:1.7}
.dm-side-card li::before{
  content:"";position:absolute;left:2px;top:9px;width:6px;height:6px;border-radius:50%;
  background:var(--green-bright);
}
.dm-side-note{color:var(--text-mute);font-size:var(--fs-sm);line-height:1.8}
.dm-side-note a{color:var(--green-bright);text-decoration:none;border-bottom:1px solid rgba(31,174,90,.4)}
.dm-side-note a:hover{border-bottom-color:var(--green-bright)}

/* 提交成功态 */
.dm-success{display:none;text-align:center;padding:var(--sp-10) var(--sp-6)}
.dm-success.is-on{display:block}
.dm-success-ic{
  width:54px;height:54px;margin:0 auto var(--sp-5);border-radius:50%;
  display:grid;place-items:center;font-size:26px;font-weight:800;
  color:#08110c;background:var(--green-bright);box-shadow:0 0 30px rgba(31,174,90,.4);
}
.dm-success h3{font-size:var(--fs-h2);font-weight:800;margin-bottom:var(--sp-3)}
.dm-success p{color:var(--text-dim);font-size:var(--fs-sm);line-height:1.85;max-width:46ch;margin:0 auto}
.dm-success .hero-cta{justify-content:center;margin-top:var(--sp-6)}

@media (max-width:1080px){
  .dm-wrap{grid-template-columns:1fr;gap:var(--sp-8)}
}
@media (max-width:860px){
  .dm-card{padding:var(--sp-6)}
  .dm-success{padding:var(--sp-8) var(--sp-4)}
}

/* ========================= 滑块验证（sv-*） ========================= */
.sv{position:fixed;inset:0;z-index:80;display:none;place-items:center;padding:var(--sp-4)}
.sv.is-on{display:grid}
.sv-mask{position:absolute;inset:0;background:rgba(4,8,12,.72);backdrop-filter:blur(3px)}
.sv-panel{
  position:relative;width:100%;max-width:378px;padding:var(--sp-5);
  border:1px solid var(--line);border-radius:var(--r-lg);background:#141c25;
  box-shadow:0 24px 60px rgba(0,0,0,.55);
}
.sv-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-4)}
.sv-head b{color:var(--text);font-size:var(--fs-base);font-weight:700}
.sv-close{
  cursor:pointer;padding:2px 7px;border-radius:6px;color:var(--text-mute);
  font-size:19px;line-height:1;transition:color .2s var(--ease),background .2s var(--ease);
}
.sv-close:hover{color:var(--text);background:rgba(255,255,255,.07)}
.sv-stage{
  position:relative;margin:0 auto;width:320px;max-width:100%;
  border-radius:var(--r-card);overflow:hidden;background:#0d141c;
}
.sv-bg{display:block;width:100%}
.sv-block{position:absolute;left:0;top:0;display:block;filter:drop-shadow(0 2px 6px rgba(0,0,0,.55))}
.sv-track{
  position:relative;margin:var(--sp-5) auto 0;width:320px;max-width:100%;height:46px;
  border:1px solid var(--line);border-radius:var(--r-pill);
  background:rgba(255,255,255,.05);overflow:hidden;
}
.sv-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(31,174,90,.2)}
.sv-btn{
  position:absolute;left:0;top:0;width:46px;height:46px;border-radius:50%;
  display:grid;place-items:center;cursor:grab;touch-action:none;
  background:var(--green-bright);color:#08110c;font-size:19px;font-weight:800;
  box-shadow:0 4px 14px rgba(31,174,90,.35);
  transition:transform .12s var(--ease);
}
.sv-btn.is-drag{cursor:grabbing;transform:scale(1.05)}
.sv-tip{
  position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;
  color:var(--text-dim);font-size:var(--fs-sm);
}
.sv-tip.is-ok{color:var(--green-bright);font-weight:700}
.sv-msg{min-height:20px;margin-top:var(--sp-4);text-align:center;color:#ff9a9a;font-size:var(--fs-sm)}
.sv-msg.is-ok{color:var(--green-bright)}
@media (max-width:400px){
  .sv-stage,.sv-track{width:100%}
}