/* ==========================================================================
   site.css — site7 · 猎鹰体育
   深空蓝 + 猎鹰红 / 整站深色（theme.mode = dark）/ 数据表格感
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 主题变量：本站为深色模式，整体覆盖 base.css 的默认浅色取值
   -------------------------------------------------------------------------- */
:root {
  /* 品牌 */
  --brand: #e63946;
  --brand-2: #f4a261;
  --brand-rgb: 230, 57, 70;

  /* 文字：正文亮度不低于 #c9d3e4，保证深底上的对比度 */
  --ink: #edf2fb;
  --ink-soft: #c9d3e4;
  --ink-faint: #a8b6cf;

  /* 背景：底色取自 theme.dark / theme.dark2 */
  --page: #101a2b;
  --page-alt: #16223a;
  --surface: #1c2b45;
  --surface-2: #223354;
  --line: #2b3d61;

  /* 深色区块 */
  --dark: #101a2b;
  --dark-2: #1c2b45;
  --hero-ink: #ffffff;

  /* 形状与阴影：偏硬朗，配合数据感 */
  --radius: 10px;
  --radius-sm: 8px;
  --radius-lg: 16px;
  --shadow-sm: 0 2px 10px rgba(3, 8, 18, .4);
  --shadow: 0 12px 32px rgba(3, 8, 18, .45);
  --shadow-lg: 0 26px 64px rgba(3, 8, 18, .55);
}

/* --------------------------------------------------------------------------
   2. 基础质感
   -------------------------------------------------------------------------- */
body { background-color: var(--page); }

.s7-mono,
.s7-num {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Courier New", monospace;
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
}

.s7-grid {
  background-image:
    linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
  background-size: 58px 58px;
}

/* 细分割线：深色站点的区块边界 */
.sec-alt { background: var(--page-alt); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.s7-deep { background: var(--dark); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }

/* --------------------------------------------------------------------------
   3. 深色区块内的正文对比度兜底（覆盖 base.css 的半透明白）
   -------------------------------------------------------------------------- */
.s7-deep p,
.s7-deep li,
.s7-deep .sec-sub { color: #c9d3e4; }
.s7-deep .text-soft { color: #c9d3e4 !important; }

/* --------------------------------------------------------------------------
   4. 首屏
   -------------------------------------------------------------------------- */
.s7-hero .eyebrow { color: #fff; background: rgba(var(--brand-rgb), .3); }
.s7-hero h1 { letter-spacing: -.02em; }
.s7-hero .hero-media img { aspect-ratio: 16 / 11; object-fit: cover; }
.s7-hero-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 1.2rem 2.4rem;
  margin-top: 2.4rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255, 255, 255, .14);
}
.s7-hero-facts strong { display: block; font-size: 1.45rem; color: #fff; line-height: 1.2; }
.s7-hero-facts span { font-size: .84rem; color: #c9d3e4; }

/* --------------------------------------------------------------------------
   5. 数据表格（本站的视觉主线）
   -------------------------------------------------------------------------- */
.s7-table { width: 100%; margin: 0; border-collapse: collapse; }
.s7-table th,
.s7-table td { padding: .85rem .7rem; border-bottom: 1px solid var(--line); font-size: .92rem; vertical-align: middle; }
.s7-table th {
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-faint);
  white-space: nowrap;
}
.s7-table td:first-child { color: var(--ink); font-weight: 600; }
.s7-table tbody tr:last-child td { border-bottom: 0; }
.s7-table tbody tr:hover { background: rgba(var(--brand-rgb), .07); }
.s7-table .s7-num { text-align: right; color: var(--brand-2); }

.s7-chip {
  display: inline-flex;
  align-items: center;
  padding: .18rem .6rem;
  border-radius: 6px;
  font-size: .76rem;
  font-weight: 700;
  white-space: nowrap;
}
.s7-chip-ok { color: #8ee6b0; background: rgba(46, 204, 113, .14); }
.s7-chip-go { color: var(--brand-2); background: rgba(244, 162, 97, .16); }

/* --------------------------------------------------------------------------
   6. 组件微调
   -------------------------------------------------------------------------- */
.s7-why-img { width: 92px; height: 92px; object-fit: contain; margin: 0 auto 1rem; }
.s7-toc-list { list-style: none; padding: 0; margin: 0; }
.s7-slide { height: auto; }
.s7-swiper { padding-bottom: 3.2rem; }
.s7-swiper .swiper-pagination-bullet { background: var(--ink-faint); opacity: .55; }
.s7-swiper .swiper-pagination-bullet-active { background: var(--brand); opacity: 1; }
.s7-swiper .swiper-button-next,
.s7-swiper .swiper-button-prev { color: var(--brand); }
.s7-swiper .swiper-button-next::after,
.s7-swiper .swiper-button-prev::after { font-size: 1.2rem; font-weight: 700; }

.s7-shot { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--surface); height: 100%; }
.s7-shot img { width: 100%; aspect-ratio: 9 / 16; object-fit: cover; background: var(--surface-2); }
.s7-shot-cap { padding: .9rem 1rem; font-size: .86rem; color: var(--ink-soft); border-top: 1px solid var(--line); }

.s7-rank { display: flex; gap: 1rem; align-items: flex-start; }
.s7-rank-no {
  flex: none;
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  color: var(--brand);
  font-weight: 800;
  font-size: .86rem;
}

.dept-card-img, .news-thumb, .media-16x9, .s7-shot img { background: var(--surface-2); }

.s7-note {
  padding: 1.4rem 1.6rem;
  border: 1px solid var(--line);
  border-left: 3px solid var(--brand);
  border-radius: var(--radius);
  background: var(--surface);
}
.s7-note p:last-child, .s7-note ul:last-child { margin-bottom: 0; }

.s7-ver {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  padding: 1.3rem 1.5rem;
  height: 100%;
}
.s7-ver-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .5rem;
  padding-bottom: .8rem;
  margin-bottom: .9rem;
  border-bottom: 1px solid var(--line);
}
.s7-ver-head strong { color: var(--brand); font-size: 1.02rem; }

/* --------------------------------------------------------------------------
   7. 页脚
   -------------------------------------------------------------------------- */
.site-footer { background: linear-gradient(180deg, #16223a 0%, var(--dark) 62%); border-top: 1px solid var(--line); }
.site-footer .ft-desc { color: #c9d3e4; }
.site-footer .ft-note { color: var(--ink-faint); }

/* --------------------------------------------------------------------------
   8. 响应式微调
   -------------------------------------------------------------------------- */
@media (max-width: 991.98px) {
  .s7-hero-facts { gap: 1rem 1.6rem; }
}
@media (max-width: 575.98px) {
  .s7-table th, .s7-table td { padding: .7rem .5rem; font-size: .86rem; }
  .s7-hero-facts strong { font-size: 1.25rem; }
}