/* ==========================================================================
   site.css — 星耀体育（site2）皮肤
   主题：白底 + 青绿主色，轻商务风格，区块留白充足
   只覆盖 :root 变量与少量本站专属外观，自定义类一律使用 .s2- 前缀
   ========================================================================== */

:root {
  /* 品牌 */
  --brand: #0fc4a7;
  --brand-2: #0891b2;
  --brand-rgb: 15, 196, 167;

  /* 文字（浅色模式） */
  --ink: #122a26;
  --ink-soft: #5c7a75;
  --ink-faint: #94aaa6;

  /* 背景：白底 + 极淡青灰交替色 */
  --page: #ffffff;
  --page-alt: #f3f9f8;
  --surface: #ffffff;
  --surface-2: #f7fbfa;
  --line: #e2eeec;

  /* 深色区块（青黑） */
  --dark: #0f2b2a;
  --dark-2: #134e4a;
  --hero-ink: #ffffff;

  /* 形状：轻商务，圆角收敛 */
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;

  /* 阴影：淡 */
  --shadow-sm: 0 1px 3px rgba(15, 43, 42, .06);
  --shadow: 0 8px 24px rgba(15, 43, 42, .07);
  --shadow-lg: 0 18px 44px rgba(15, 43, 42, .11);

  /* 留白 */
  --sec-py: 92px;
}

/* --------------------------------------------------------------------------
   浅色首屏：把 base 的深色 hero 改成白底 + 青绿柔光
   -------------------------------------------------------------------------- */
.hero.s2-hero {
  background: linear-gradient(160deg, #ffffff 0%, #f4fbf9 52%, #e8f6f3 100%);
  color: var(--ink);
  border-bottom: 1px solid var(--line);
}
.hero.s2-hero::before {
  background:
    radial-gradient(52% 52% at 88% 10%, rgba(var(--brand-rgb), .20), transparent 68%),
    radial-gradient(40% 40% at 4% 92%, rgba(8, 145, 178, .12), transparent 66%);
}
.hero.s2-hero h1,
.hero.s2-hero h2 { color: var(--ink); }
.hero.s2-hero h1 strong { color: var(--brand); }
.hero.s2-hero .lead,
.hero.s2-hero p { color: var(--ink-soft); }
.hero.s2-hero .btn-ghost {
  --bs-btn-color: var(--ink);
  --bs-btn-border-color: var(--line);
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: var(--brand);
  --bs-btn-hover-color: var(--brand);
}
.hero.s2-hero .hero-media { border-color: var(--line); box-shadow: var(--shadow); }
.hero.s2-hero .eyebrow { background: rgba(var(--brand-rgb), .12); }

/* 小标签（评分 / 下载量 / 安全测评） */
.s2-pill {
  display: inline-flex;
  align-items: center;
  padding: .34rem .95rem;
  border-radius: var(--radius-pill);
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--ink-soft);
  font-size: .82rem;
  font-weight: 600;
}

/* 版本号徽标 */
.s2-ver {
  display: inline-block;
  margin-bottom: .5rem;
  padding: .18rem .7rem;
  border-radius: var(--radius-sm);
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--brand);
  background: rgba(var(--brand-rgb), .12);
}
.sec-dark .s2-ver { color: #fff; background: rgba(255, 255, 255, .16); }

/* 配图容器：浅色底上的图框 */
.s2-about-media,
.s2-app-shot {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  background: var(--surface);
  padding: .6rem;
}
.s2-app-shot { max-width: 380px; margin: 0 auto; }

/* App 截图轮播 */
.s2-shot {
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}
.s2-shot img { border-radius: calc(var(--radius) - 2px); }

/* --------------------------------------------------------------------------
   组件微调：更轻的边框、更清晰的层级
   -------------------------------------------------------------------------- */
.card-soft,
.tile,
.honor-card,
.review-card,
.news-item,
.stat-tile,
.dept-card,
.faq-item { border-color: var(--line); }

.card-soft h3,
.card-soft h4 { margin-bottom: .5rem; }
.card-soft p { color: var(--ink-soft); font-size: .92rem; }

.sec-title { letter-spacing: -.01em; }
.sec-head .eyebrow { box-shadow: inset 0 0 0 1px rgba(var(--brand-rgb), .14); }

.breadcrumb-bar { background: var(--page-alt); }
.breadcrumb-bar h1 { margin-top: .35rem; }

.dept-card-body h3 { color: var(--ink); }
.dept-card-body p { line-height: 1.7; }

.honor-img { filter: saturate(.95); }

.tl-card { border-left: 3px solid rgba(var(--brand-rgb), .35); }

.spec-icon { font-size: 1rem; }

.faq-q span { padding-right: .5rem; }

/* Swiper 控件跟随品牌色 */
.swiper {
  --swiper-theme-color: var(--brand);
  --swiper-pagination-color: var(--brand);
  --swiper-navigation-color: var(--brand);
  --swiper-navigation-size: 24px;
  padding-bottom: 3.2rem;
}
.swiper-button-next,
.swiper-button-prev {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}
.swiper-button-next::after,
.swiper-button-prev::after { font-size: 15px; font-weight: 700; }
.sec-dark .swiper-button-next,
.sec-dark .swiper-button-prev { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .2); }

/* 页脚：青黑底 + 轻分隔 */
.site-footer { border-top: 1px solid rgba(255, 255, 255, .06); }
.site-footer .ft-title { font-weight: 700; }

/* 深色区块内的列表与段落 */
.sec-dark .card-glow ul { color: rgba(255, 255, 255, .74); }
.sec-dark .card-glow li { margin-bottom: .35rem; }

/* 法务页阅读节奏 */
.legal-body p { margin-bottom: 1.1rem; }
.legal-toc ol { padding-left: 1.35rem; }

/* 响应式微调 */
@media (max-width: 991.98px) {
  .s2-app-shot { max-width: 300px; }
  .swiper { padding-bottom: 2.8rem; }
}
@media (max-width: 575.98px) {
  .hero.s2-hero { padding-top: 3.2rem; padding-bottom: 3.2rem; }
  .s2-pill { font-size: .78rem; padding: .3rem .8rem; }
}