/* ================= 首页 ================= */
.page-home {
  display: block;
  background: var(--color-surface);
  color: var(--color-ink);
}

/* ---------- 首屏 ---------- */
.page-home .home-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
}

.page-home .home-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.page-home .home-hero__img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
  object-position: 72% 42%;
  opacity: 0.55;
}

.page-home .home-hero__scrim {
  position: absolute;
  inset: 0;
  background: var(--overlay-scrim);
  pointer-events: none;
}

.page-home .home-hero__inner {
  position: relative;
  z-index: 1;
  padding-block: calc(var(--space-8) * 1.2) var(--space-8);
}

.page-home .home-hero .breadcrumb--deep {
  color: var(--color-contrast-ink);
  opacity: 0.72;
}

.page-home .home-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
  margin-top: var(--space-6);
}

/* 左侧竖向时间轴 */
.page-home .home-hero__rail {
  display: grid;
  gap: var(--space-1);
  align-content: start;
  padding-bottom: var(--space-3);
  border-bottom: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-hero__rail-label {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  letter-spacing: 0.14em;
  color: var(--color-contrast-accent);
}

.page-home .home-hero__date {
  font-family: var(--font-mono);
  font-size: var(--text-figure);
  font-weight: var(--weight-heading);
  line-height: 0.86;
  letter-spacing: -0.03em;
  color: var(--color-contrast-accent);
  font-variant-numeric: tabular-nums;
}

.page-home .home-hero__unit {
  font-size: var(--text-sm);
  line-height: 1.3;
  color: var(--color-contrast-ink);
  opacity: 0.72;
}

.page-home .home-hero__ticks {
  list-style: none;
  margin: var(--space-2) 0 0;
  padding: 0;
  display: flex;
  gap: var(--space-3);
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  color: var(--color-contrast-ink);
}

.page-home .home-hero__ticks li {
  opacity: 0.55;
}

.page-home .home-hero__ticks .is-now {
  opacity: 1;
  color: var(--color-contrast-accent);
  font-weight: 700;
}

/* 主标题 */
.page-home .home-hero__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-display);
  font-weight: var(--weight-heading);
  line-height: 0.94;
  letter-spacing: var(--tracking-heading);
  color: var(--color-contrast-ink);
}

.page-home .home-hero__lede {
  margin: var(--space-4) 0 0;
  max-width: 46ch;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-contrast-ink);
  opacity: 0.86;
}

/* 三枚大号数字 */
.page-home .home-hero__figures {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
  padding-top: var(--space-3);
  border-top: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-figure {
  display: grid;
  gap: var(--space-1);
  align-content: start;
}

.page-home .home-figure__num {
  font-family: var(--font-mono);
  font-size: var(--text-figure);
  font-weight: var(--weight-heading);
  line-height: 0.86;
  letter-spacing: -0.03em;
  color: var(--color-contrast-accent);
  font-variant-numeric: tabular-nums;
}

.page-home .home-figure__unit {
  font-size: var(--text-sm);
  line-height: 1.35;
  color: var(--color-contrast-ink);
  opacity: 0.72;
}

/* 三条进入路径 */
.page-home .home-hero__paths {
  list-style: none;
  margin: var(--space-6) 0 0;
  padding: 0;
  border-top: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-path {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-1) var(--space-3);
  padding-block: var(--space-2);
  border-bottom: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-path__k {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  color: var(--color-contrast-accent);
  min-width: 5.5rem;
}

.page-home .home-path__v {
  flex: 1 1 12rem;
  font-size: var(--text-base);
  line-height: 1.5;
  color: var(--color-contrast-ink);
  opacity: 0.82;
}

.page-home .home-path__a {
  font-size: var(--text-sm);
  color: var(--color-contrast-ink);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-color: var(--color-contrast-line);
  transition: color 0.18s ease, text-decoration-color 0.18s ease;
}

.page-home .home-path__a:hover,
.page-home .home-path__a:focus-visible {
  color: var(--color-contrast-accent);
  text-decoration-color: var(--color-contrast-accent);
}

/* ---------- 今日栏目 ---------- */
.page-home .home-today {
  background: var(--color-surface);
}

.page-home .home-today__head {
  display: grid;
  gap: var(--space-2);
  max-width: var(--measure);
  margin-bottom: var(--space-6);
}

.page-home .home-today__head p {
  margin: 0;
  color: var(--color-ink-soft);
  line-height: var(--leading-body);
}

.page-home .home-today__strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border: var(--border-thin) solid var(--color-line);
}

.page-home .home-today__cell {
  display: grid;
  gap: var(--space-1);
  align-content: start;
  padding: var(--space-3);
  border-bottom: var(--border-thin) solid var(--color-line);
}

.page-home .home-today__cell:last-child {
  border-bottom: 0;
}

.page-home .home-today__num {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--text-3xl);
  font-weight: var(--weight-heading);
  line-height: 0.9;
  letter-spacing: -0.03em;
  color: var(--color-primary);
  font-variant-numeric: tabular-nums;
}

.page-home .home-today__label {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
  letter-spacing: 0.08em;
}

.page-home .home-today__note {
  margin: var(--space-1) 0 0;
  font-size: var(--text-sm);
  line-height: 1.6;
  color: var(--color-ink-soft);
}

.page-home .home-today__cell--act {
  background: var(--color-primary);
  color: var(--color-primary-ink);
}

.page-home .home-today__act-text {
  margin: 0;
  font-size: var(--text-base);
  line-height: 1.5;
  color: var(--color-primary-ink);
}

.page-home .home-today__act-link {
  display: inline-block;
  margin-top: var(--space-1);
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--color-primary-ink);
  text-decoration: underline;
  text-underline-offset: 5px;
  transition: transform 0.18s ease;
}

.page-home .home-today__act-link:hover,
.page-home .home-today__act-link:focus-visible {
  transform: translateX(2px);
}

.page-home .home-today__media {
  margin: var(--space-6) 0 0;
}

.page-home .home-today__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1220 / 560;
  object-fit: cover;
  border: var(--border-thin) solid var(--color-line);
}

.page-home .home-today__media .media__caption {
  margin-top: var(--space-2);
  font-size: var(--text-sm);
  line-height: 1.6;
  color: var(--color-ink-muted);
}

/* ---------- 首次进入 ---------- */
.page-home .home-first {
  background: var(--color-surface-alt);
}

.page-home .home-first__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

.page-home .home-first__media {
  margin: 0;
}

.page-home .home-first__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 760 / 1140;
  object-fit: cover;
  border: var(--border-thin) solid var(--color-line);
}

.page-home .home-first__media .media__caption {
  margin-top: var(--space-2);
  font-size: var(--text-sm);
  line-height: 1.6;
  color: var(--color-ink-muted);
}

.page-home .home-first__body > p {
  margin: 0;
  color: var(--color-ink-soft);
  line-height: var(--leading-body);
  max-width: var(--measure);
}

.page-home .home-first__body > p.eyebrow {
  color: var(--color-primary);
}

.page-home .home-first__body > h2 {
  margin: var(--space-2) 0 var(--space-3);
}

.page-home .home-steps {
  list-style: none;
  margin: var(--space-6) 0 0;
  padding: 0;
  border-top: var(--border-thin) solid var(--color-line);
}

.page-home .home-step {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-1);
  padding-block: var(--space-4);
  border-bottom: var(--border-thin) solid var(--color-line);
}

.page-home .home-step__no {
  font-family: var(--font-mono);
  font-size: var(--text-lg);
  font-weight: var(--weight-heading);
  line-height: 1;
  color: var(--color-primary);
}

.page-home .home-step__title {
  margin: 0;
  color: var(--color-ink);
}

.page-home .home-step__text {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}

.page-home .home-first__foot {
  margin-top: var(--space-4);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}

/* ---------- 回访快捷通道 ---------- */
.page-home .home-return {
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
}

.page-home .home-return__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

.page-home .home-return__lead h2 {
  color: var(--color-contrast-ink);
  margin: var(--space-2) 0 var(--space-3);
}

.page-home .home-return__lead p {
  margin: 0 0 var(--space-3);
  max-width: 50ch;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-contrast-ink);
  opacity: 0.84;
}

.page-home .home-return__panel {
  border: var(--border-thin) solid var(--color-contrast-line);
  padding: var(--space-3);
  transition: border-color 0.18s ease;
}

.page-home .home-return__panel:hover {
  border-color: var(--color-contrast-accent);
}

.page-home .home-return__panel summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  cursor: pointer;
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--color-contrast-ink);
  list-style: none;
}

.page-home .home-return__panel summary::-webkit-details-marker {
  display: none;
}

.page-home .home-return__panel summary::after {
  content: "＋";
  font-family: var(--font-mono);
  font-size: var(--text-lg);
  color: var(--color-contrast-accent);
}

.page-home .home-return__panel[open] summary::after {
  content: "－";
}

.page-home .home-return__list {
  list-style: none;
  margin: var(--space-3) 0 0;
  padding: var(--space-3) 0 0;
  border-top: var(--border-thin) solid var(--color-contrast-line);
  display: grid;
  gap: var(--space-3);
}

.page-home .home-return__item {
  display: grid;
  gap: var(--space-1);
}

.page-home .home-return__k {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  letter-spacing: 0.08em;
  color: var(--color-contrast-accent);
}

.page-home .home-return__v {
  font-size: var(--text-base);
  line-height: 1.6;
  color: var(--color-contrast-ink);
  opacity: 0.82;
}

/* ---------- 移动端 ---------- */
.page-home .home-mobile {
  background: var(--color-surface);
}

.page-home .home-mobile__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

.page-home .home-mobile__body > h2 {
  margin: var(--space-2) 0 var(--space-3);
}

.page-home .home-mobile__body > p {
  margin: 0;
  max-width: var(--measure);
  color: var(--color-ink-soft);
  line-height: var(--leading-body);
}

.page-home .home-mobile__facts {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin: var(--space-4) 0;
  border-top: var(--border-thin) solid var(--color-line);
}

.page-home .home-mobile__fact {
  padding: var(--space-2) 0;
  border-bottom: var(--border-thin) solid var(--color-line);
}

.page-home .home-mobile__fact dt {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
  letter-spacing: 0.06em;
}

.page-home .home-mobile__fact dd {
  margin: var(--space-1) 0 0;
  font-size: var(--text-lg);
  font-weight: var(--weight-heading);
  color: var(--color-ink);
}

.page-home .home-mobile__foot {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1) var(--space-2);
  align-items: baseline;
  font-size: var(--text-base);
}

.page-home .home-mobile__sep {
  color: var(--color-ink-muted);
}

.page-home .home-mobile__media {
  margin: 0;
}

.page-home .home-mobile__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 900 / 700;
  object-fit: cover;
  border: var(--border-thin) solid var(--color-line);
}

/* ---------- 栏目索引 ---------- */
.page-home .home-index {
  background: var(--color-surface);
}

.page-home .home-index__head {
  display: grid;
  gap: var(--space-2);
  margin-bottom: var(--space-6);
}

.page-home .home-index__groups {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

.page-home .home-index__group-title {
  display: inline-block;
  margin: 0 0 var(--space-2);
  padding-bottom: var(--space-1);
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  font-weight: 400;
  letter-spacing: 0.14em;
  color: var(--color-ink-muted);
  border-bottom: var(--border-thick) solid var(--color-primary);
}

.page-home .home-index__list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: var(--border-thin) solid var(--color-line);
}

.page-home .home-index__link {
  display: grid;
  gap: 2px;
  padding: var(--space-2) var(--space-2) var(--space-2) var(--space-3);
  border-bottom: var(--border-thin) solid var(--color-line);
  border-left: var(--border-thick) solid transparent;
  text-decoration: none;
  color: var(--color-ink);
  transition: border-color 0.18s ease, transform 0.18s ease, background-color 0.18s ease;
}

.page-home .home-index__link:hover,
.page-home .home-index__link:focus-visible {
  border-left-color: var(--color-accent);
  background: var(--color-highlight);
  transform: translateX(2px);
}

.page-home .home-index__name {
  font-size: var(--text-lg);
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-ink);
}

.page-home .home-index__desc {
  font-size: var(--text-sm);
  line-height: 1.6;
  color: var(--color-ink-soft);
}

/* ---------- 联系 ---------- */
.page-home .home-contact {
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
}

.page-home .home-contact__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

.page-home .home-contact__lead h2 {
  margin: var(--space-2) 0 var(--space-3);
  color: var(--color-contrast-ink);
}

.page-home .home-contact__lead p {
  margin: 0;
  max-width: 48ch;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-contrast-ink);
  opacity: 0.84;
}

.page-home .home-contact__list {
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border-top: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-contact__item {
  display: grid;
  gap: var(--space-1);
  padding-block: var(--space-3);
  border-bottom: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-contact__item dt {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  letter-spacing: 0.1em;
  color: var(--color-contrast-accent);
}

.page-home .home-contact__item dd {
  margin: 0;
  font-family: var(--font-mono);
  font-size: var(--text-base);
  line-height: 1.5;
  color: var(--color-contrast-ink);
  word-break: break-word;
}

.page-home .home-contact__foot {
  grid-column: 1 / -1;
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-contrast-ink);
  opacity: 0.86;
}

.page-home .home-contact__foot .link-inline {
  color: var(--color-contrast-accent);
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* ---------- 桌面布局 ---------- */
@media (min-width: 600px) {
  .page-home .home-mobile__facts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-home .home-mobile__fact {
    border-bottom: 0;
    border-right: var(--border-thin) solid var(--color-line);
    padding-right: var(--space-2);
  }
  .page-home .home-mobile__fact:last-child {
    border-right: 0;
  }

  .page-home .home-return__item {
    grid-template-columns: 9rem minmax(0, 1fr);
    gap: var(--space-2);
    align-items: baseline;
  }
}

@media (min-width: 768px) {
  .page-home .home-step {
    grid-template-columns: calc(var(--space-8) * 1.2) minmax(0, 1fr);
    column-gap: var(--space-4);
    row-gap: var(--space-1);
  }
  .page-home .home-step__no {
    grid-row: 1 / span 2;
  }
  .page-home .home-step__title,
  .page-home .home-step__text {
    grid-column: 2;
  }
}

@media (min-width: 900px) {
  .page-home .home-hero__inner {
    padding-block: calc(var(--space-8) * 1.6) calc(var(--space-8) * 1.2);
  }

  .page-home .home-hero__grid {
    grid-template-columns: calc(var(--space-8) * 2.75) minmax(0, 1fr);
    grid-template-areas:
      "rail head"
      "rail figures";
    column-gap: var(--space-6);
    row-gap: var(--space-6);
    align-items: start;
  }

  .page-home .home-hero__rail {
    grid-area: rail;
    border-bottom: 0;
    border-left: var(--border-thin) solid var(--color-contrast-line);
    padding-left: var(--space-3);
    padding-bottom: 0;
  }

  .page-home .home-hero__ticks {
    flex-direction: column;
    gap: var(--space-1);
  }

  .page-home .home-hero__head {
    grid-area: head;
  }

  .page-home .home-hero__figures {
    grid-area: figures;
    padding-top: 0;
    border-top: 0;
    column-gap: var(--space-6);
  }

  .page-home .home-first__grid {
    grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr);
    gap: var(--space-8);
    align-items: start;
  }

  .page-home .home-return__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
    gap: var(--space-8);
    align-items: start;
  }

  .page-home .home-mobile__grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
    gap: var(--space-8);
    align-items: start;
  }

  .page-home .home-index__groups {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-6);
  }

  .page-home .home-contact__inner {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: var(--space-8);
    align-items: start;
  }
}

@media (min-width: 900px) {
  .page-home .home-today__strip {
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.05fr);
  }

  .page-home .home-today__cell {
    border-bottom: 0;
    border-right: var(--border-thin) solid var(--color-line);
  }

  .page-home .home-today__cell:last-child {
    border-right: 0;
  }
}
</main>
<<<END>>>

等一下，我需要检查末尾——我把 `</main>` 和 `<<<END>>>` 也写进去了，这不对。让我重新想一下：页面的 MAIN_HTML 应该正好以 `</main>` 结尾，而 PAGE_CSS 里压根不该出现 `</main>`。

还有一个问题是，上一段回答里已经在 PAGE_CSS 尾部多出了 `</main>`。让我重新清理输出，确保标记正确。
<main id="main-content" class="page-home">

  <section class="hero home-hero" data-hero>
    <div class="home-hero__bg">
      <img class="home-hero__img" src="{zhanqunpic:h:1000w:1600}" width="1600" height="1000" alt="抽象赛场线条、看台网格与计时器局部组成的深色几何纹理">
      <span class="home-hero__scrim" aria-hidden="true"></span>
    </div>
    <div class="container home-hero__inner">
      <nav class="breadcrumb breadcrumb--deep" aria-label="页面位置">首页</nav>
      <div class="home-hero__grid">

        <aside class="home-hero__rail" aria-label="按日期分栏">
          <span class="home-hero__rail-label">今日分栏</span>
          <span class="home-hero__date num" data-digits>24</span>
          <span class="home-hero__unit">小时跨度</span>
          <ol class="home-hero__ticks">
            <li>昨日</li>
            <li class="is-now">今日</li>
            <li>次日</li>
          </ol>
        </aside>

        <div class="home-hero__head">
          <h1 class="home-hero__title">赛场之外<br>亦有章法</h1>
          <p class="home-hero__lede">乐鱼体育会馆把每天散落在各处的联赛与杯赛日程，排成一条能顺着往下读的线。进门先看清今天有什么、每场走到哪一步，再决定进哪个栏目。</p>
        </div>

        <div class="home-hero__figures">
          <div class="home-figure">
            <span class="home-figure__num num" data-digits>37</span>
            <span class="home-figure__unit">项联赛与杯赛</span>
          </div>
          <div class="home-figure">
            <span class="home-figure__num num" data-digits>90</span>
            <span class="home-figure__unit">秒刷新一次</span>
          </div>
          <div class="home-figure">
            <span class="home-figure__num num" data-digits>6</span>
            <span class="home-figure__unit">个赛季持续运营</span>
          </div>
        </div>

      </div>

      <ul class="home-hero__paths">
        <li class="home-path">
          <span class="home-path__k">第一次来</span>
          <span class="home-path__v">从入口走到赛事栏目，中间要看的三步</span>
          <a class="home-path__a" href="#first-visit">看这三步</a>
        </li>
        <li class="home-path">
          <span class="home-path__k">每天都看</span>
          <span class="home-path__v">快捷通道把你送回上次停留的那一层</span>
          <a class="home-path__a" href="#return">了解通道</a>
        </li>
        <li class="home-path">
          <span class="home-path__k">用手机看</span>
          <span class="home-path__v">iOS 乐鱼升级版入口把小屏层级压得更短</span>
          <a class="home-path__a" href="/get-app/ios/">进 iOS 端说明</a>
        </li>
      </ul>
    </div>
  </section>

  <section class="section home-today" id="today">
    <div class="container">
      <div class="home-today__head">
        <p class="eyebrow">今天的栏目</p>
        <h2 class="t-2xl">今天该看哪几场，先在这里对一遍</h2>
        <p>赛事栏目按日期分栏，落在首页看到的是今天那一栏的摘要。想往前翻或往后翻，昨天与明天各留一天，不用重新挑日期。</p>
      </div>

      <div class="home-today__strip">
        <div class="home-today__cell">
          <span class="home-today__num num" data-digits>3</span>
          <span class="home-today__label">级状态标识</span>
          <p class="home-today__note">进行中、未开始、已结束，判断一场比赛处在什么阶段只看这一个标识。</p>
        </div>
        <div class="home-today__cell">
          <span class="home-today__num num" data-digits>128</span>
          <span class="home-today__label">条清单上限</span>
          <p class="home-today__note">单日清单一次能导出的记录数，按天整理完就能带走。</p>
        </div>
        <div class="home-today__cell">
          <span class="home-today__num num" data-digits>6</span>
          <span class="home-today__label">个导出字段</span>
          <p class="home-today__note">日期、时段、项目、对阵或项目名、状态、最近刷新时间，导出的清单沿用同一套字段。</p>
        </div>
        <div class="home-today__cell home-today__cell--act">
          <p class="home-today__act-text">想看完整的一天，直接进赛事栏目。</p>
          <a class="home-today__act-link" href="/activity/">打开赛事栏目，落在今天这一栏</a>
        </div>
      </div>

      <figure class="media media--wide home-today__media">
        <img src="{zhanqunpic:h:560w:1220}" width="1220" height="560" alt="横向分栏的日期色块与数据条，体现单日清单的排布结构" loading="lazy" decoding="async">
        <figcaption class="media__caption">一天被切成可读的几段：时段、项目、对阵、状态各占一列，导出的清单和页面上看到的是同一套结构。</figcaption>
      </figure>
    </div>
  </section>

  <section class="section home-first" id="first-visit">
    <div class="container home-first__grid">
      <figure class="media home-first__media">
        <img src="{zhanqunpic:h:1140w:760}" width="760" height="1140" alt="用几何色块与箭头示意从首页入口到赛事栏目日期分栏的三步路径" loading="lazy" decoding="async">
        <figcaption class="media__caption">入口、日期分栏、状态标识——三步之间没有多余的跳转页。</figcaption>
      </figure>

      <div class="home-first__body">
        <p class="eyebrow">第一次来</p>
        <h2 class="t-2xl">三步落到今天的赛程</h2>
        <p>不确定该点哪里的访客，按下面三步行进就够了，每一步都会在页面上看到明确的结果。</p>

        <ol class="home-steps">
          <li class="home-step">
            <span class="home-step__no">01</span>
            <h3 class="home-step__title t-lg">先认入口</h3>
            <p class="home-step__text">第一次找体育赛事入口的人，拿手机就选 iOS 升级版入口，坐在电脑前就选首屏那条赛事栏目入口，两条最终到达的是同一个栏目。</p>
          </li>
          <li class="home-step">
            <span class="home-step__no">02</span>
            <h3 class="home-step__title t-lg">落在今天那一栏</h3>
            <p class="home-step__text">进栏目后默认停在今天，前后各留一天。想看昨天的比分或明天的待赛，左右挪一栏就够。</p>
          </li>
          <li class="home-step">
            <span class="home-step__no">03</span>
            <h3 class="home-step__title t-lg">看状态再决定</h3>
            <p class="home-step__text">每场前面挂一个状态标识：进行中的跟着数据面板走，未开始的排在时段里，已结束的留在当天不撤走。</p>
          </li>
        </ol>

        <p class="home-first__foot">入口在形式上分了设备，<a class="link-inline" href="/get-app/">应用获取</a>里按终端做了分组，可以先对一下自己属于哪一类。</p>
      </div>
    </div>
  </section>

  <section class="section home-return" id="return">
    <div class="container home-return__inner">
      <div class="home-return__lead">
        <p class="eyebrow eyebrow--deep">每天都看</p>
        <h2 class="t-2xl">不用重找，从上次停下的地方接着看</h2>
        <p>快捷通道记住的是你上次停留的栏目层级，不是某一场具体的比赛。隔一天回来，位置还是那一层，里面的日程已经换成当天的。</p>
        <p>通道保留 30 天。过期之后从首页重新走一次入口，记录就能重建。</p>
      </div>

      <details class="home-return__panel">
        <summary>通道里到底存了什么</summary>
        <ul class="home-return__list">
          <li class="home-return__item">
            <span class="home-return__k">栏目层级</span>
            <span class="home-return__v">上次停在赛事栏目的哪一层，回来直接落在同一层</span>
          </li>
          <li class="home-return__item">
            <span class="home-return__k">日期位置</span>
            <span class="home-return__v">上次看的那一栏日期，回来时仍停在相同位置</span>
          </li>
          <li class="home-return__item">
            <span class="home-return__k">保留时长</span>
            <span class="home-return__v">有效期内随时可用，过期后重新进入即恢复</span>
          </li>
          <li class="home-return__item">
            <span class="home-return__k">不记录的内容</span>
            <span class="home-return__v">不保存单场比赛的浏览先后，也不留存导出过的清单</span>
          </li>
        </ul>
      </details>
    </div>
  </section>

  <section class="section home-mobile">
    <div class="container home-mobile__grid">
      <div class="home-mobile__body">
        <p class="eyebrow">用手机看</p>
        <h2 class="t-2xl">小屏先看结论，层级压短两步</h2>
        <p>移动端把赛事栏目的层级做了压缩：能合并的中间层直接去掉，从入口进来少绕两步；首屏只保留今天的分栏和状态，其余内容展开才出现。</p>

        <dl class="home-mobile__facts">
          <div class="home-mobile__fact">
            <dt>首屏加载</dt>
            <dd>1.2 秒以内</dd>
          </div>
          <div class="home-mobile__fact">
            <dt>版本迭代</dt>
            <dd>已完成 9 次</dd>
          </div>
          <div class="home-mobile__fact">
            <dt>终端入口</dt>
            <dd>共 3 类</dd>
          </div>
        </dl>

        <p class="home-mobile__foot">
          <a class="link-inline" href="/get-app/">看应用获取里的分组</a>
          <span class="home-mobile__sep" aria-hidden="true">/</span>
          <a class="link-inline" href="/get-app/ios/">iOS 端说明：最短路径怎么走</a>
        </p>
      </div>

      <figure class="media home-mobile__media">
        <img src="{zhanqunpic:h:700w:900}" width="900" height="700" alt="一块窄屏与一块宽屏的并置几何示意，体现移动端与桌面端的栏目层级差别" loading="lazy" decoding="async">
      </figure>
    </div>
  </section>

  <section class="section home-index">
    <div class="container">
      <div class="home-index__head">
        <p class="eyebrow">接着往下走</p>
        <h2 class="t-2xl">想往哪走，从这里挑一条</h2>
      </div>

      <div class="home-index__groups">
        <div class="home-index__group">
          <h3 class="home-index__group-title">先落地</h3>
          <ul class="home-index__list">
            <li>
              <a class="home-index__link" href="/get-app/">
                <span class="home-index__name">应用获取</span>
                <span class="home-index__desc">按设备分成几组入口，附升级版与上一版的差别。</span>
              </a>
            </li>
            <li>
              <a class="home-index__link" href="/advantage/">
                <span class="home-index__name">核心优势</span>
                <span class="home-index__desc">刷新节奏、栏目组织、移动端体验各自撑到什么程度。</span>
              </a>
            </li>
            <li>
              <a class="home-index__link" href="/activity/">
                <span class="home-index__name">赛季活动</span>
                <span class="home-index__desc">从赛季准备到收官复盘，各阶段该做什么。</span>
              </a>
            </li>
          </ul>
        </div>

        <div class="home-index__group">
          <h3 class="home-index__group-title">看得顺</h3>
          <ul class="home-index__list">
            <li>
              <a class="home-index__link" href="/dictionary/">
                <span class="home-index__name">术语对照</span>
                <span class="home-index__desc">分栏、状态标识、档位这些说法遇到时怎么读。</span>
              </a>
            </li>
            <li>
              <a class="home-index__link" href="/pricing/">
                <span class="home-index__name">档位说明</span>
                <span class="home-index__desc">四类档位差在栏目范围、数据频率与导出能力。</span>
              </a>
            </li>
            <li>
              <a class="home-index__link" href="/get-app/ios/">
                <span class="home-index__name">iOS 端说明</span>
                <span class="home-index__desc">小屏进赛事栏目的最短路径与版本变化。</span>
              </a>
            </li>
          </ul>
        </div>

        <div class="home-index__group">
          <h3 class="home-index__group-title">看得放心</h3>
          <ul class="home-index__list">
            <li>
              <a class="home-index__link" href="/security/">
                <span class="home-index__name">安全保障</span>
                <span class="home-index__desc">账号访问、数据通道与内容边界各自的做法。</span>
              </a>
            </li>
            <li>
              <a class="home-index__link" href="/about/">
                <span class="home-index__name">关于我们</span>
                <span class="home-index__desc">团队分工、一天的运转节奏与六个赛季的来路。</span>
              </a>
            </li>
            <li>
              <a class="home-index__link" href="/contact/">
                <span class="home-index__name">联系我们</span>
                <span class="home-index__desc">渠道分工、响应时段与反馈时要带的材料。</span>
              </a>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </section>

  <section class="section section--lg home-contact" id="contact">
    <div class="container home-contact__inner">
      <div class="home-contact__lead">
        <p class="eyebrow eyebrow--deep">卡住的时候</p>
        <h2 class="t-2xl">入口跳不过去，或者栏目一直在加载</h2>
        <p>把入口截图、当时停留的页面和使用的设备一起发过来，说明是在哪一步停住的。工作日 9:00-18:00 有专人看邮件，2 小时内响应。</p>
      </div>

      <dl class="home-contact__list">
        <div class="home-contact__item">
          <dt>客服邮箱</dt>
          <dd>service@bet-leyu-sports.com.cn</dd>
        </div>
        <div class="home-contact__item">
          <dt>服务邮箱</dt>
          <dd>kefu@bet-leyu-sports.com.cn</dd>
        </div>
        <div class="home-contact__item">
          <dt>服务电话</dt>
          <dd>400-5999-7189</dd>
        </div>
        <div class="home-contact__item">
          <dt>备案号</dt>
          <dd>黑ICP备95529715号</dd>
        </div>
      </dl>

      <p class="home-contact__foot">两个邮箱的分工、打电话的时段，以及反馈问题时还需要准备什么，都写在<a class="link-inline" href="/contact/">联系我们</a>里。运营主体位于黑龙江。</p>
    </div>
  </section>

</main>

/* ================= 首页 ================= */
.page-home {
  display: block;
  background: var(--color-surface);
  color: var(--color-ink);
}

/* ---------- 首屏 ---------- */
.page-home .home-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
}

.page-home .home-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.page-home .home-hero__img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: cover;
  object-position: 72% 42%;
  opacity: 0.55;
}

.page-home .home-hero__scrim {
  position: absolute;
  inset: 0;
  background: var(--overlay-scrim);
  pointer-events: none;
}

.page-home .home-hero__inner {
  position: relative;
  z-index: 1;
  padding-block: calc(var(--space-8) * 1.2) var(--space-8);
}

.page-home .home-hero .breadcrumb--deep {
  color: var(--color-contrast-ink);
  opacity: 0.72;
}

.page-home .home-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
  margin-top: var(--space-6);
}

/* 左侧竖向时间轴 */
.page-home .home-hero__rail {
  display: grid;
  gap: var(--space-1);
  align-content: start;
  padding-bottom: var(--space-3);
  border-bottom: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-hero__rail-label {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  letter-spacing: 0.14em;
  color: var(--color-contrast-accent);
}

.page-home .home-hero__date {
  font-family: var(--font-mono);
  font-size: var(--text-figure);
  font-weight: var(--weight-heading);
  line-height: 0.86;
  letter-spacing: -0.03em;
  color: var(--color-contrast-accent);
  font-variant-numeric: tabular-nums;
}

.page-home .home-hero__unit {
  font-size: var(--text-sm);
  line-height: 1.3;
  color: var(--color-contrast-ink);
  opacity: 0.72;
}

.page-home .home-hero__ticks {
  list-style: none;
  margin: var(--space-2) 0 0;
  padding: 0;
  display: flex;
  gap: var(--space-3);
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  color: var(--color-contrast-ink);
}

.page-home .home-hero__ticks li {
  opacity: 0.55;
}

.page-home .home-hero__ticks .is-now {
  opacity: 1;
  color: var(--color-contrast-accent);
  font-weight: 700;
}

/* 主标题 */
.page-home .home-hero__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-display);
  font-weight: var(--weight-heading);
  line-height: 0.94;
  letter-spacing: var(--tracking-heading);
  color: var(--color-contrast-ink);
}

.page-home .home-hero__lede {
  margin: var(--space-4) 0 0;
  max-width: 46ch;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-contrast-ink);
  opacity: 0.86;
}

/* 三枚大号数字 */
.page-home .home-hero__figures {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
  padding-top: var(--space-3);
  border-top: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-figure {
  display: grid;
  gap: var(--space-1);
  align-content: start;
}

.page-home .home-figure__num {
  font-family: var(--font-mono);
  font-size: var(--text-figure);
  font-weight: var(--weight-heading);
  line-height: 0.86;
  letter-spacing: -0.03em;
  color: var(--color-contrast-accent);
  font-variant-numeric: tabular-nums;
}

.page-home .home-figure__unit {
  font-size: var(--text-sm);
  line-height: 1.35;
  color: var(--color-contrast-ink);
  opacity: 0.72;
}

/* 三条进入路径 */
.page-home .home-hero__paths {
  list-style: none;
  margin: var(--space-6) 0 0;
  padding: 0;
  border-top: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-path {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-1) var(--space-3);
  padding-block: var(--space-2);
  border-bottom: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-path__k {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  color: var(--color-contrast-accent);
  min-width: 5.5rem;
}

.page-home .home-path__v {
  flex: 1 1 12rem;
  font-size: var(--text-base);
  line-height: 1.5;
  color: var(--color-contrast-ink);
  opacity: 0.82;
}

.page-home .home-path__a {
  font-size: var(--text-sm);
  color: var(--color-contrast-ink);
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-color: var(--color-contrast-line);
  transition: color 0.18s ease, text-decoration-color 0.18s ease;
}

.page-home .home-path__a:hover,
.page-home .home-path__a:focus-visible {
  color: var(--color-contrast-accent);
  text-decoration-color: var(--color-contrast-accent);
}

/* ---------- 今日栏目 ---------- */
.page-home .home-today {
  background: var(--color-surface);
}

.page-home .home-today__head {
  display: grid;
  gap: var(--space-2);
  max-width: var(--measure);
  margin-bottom: var(--space-6);
}

.page-home .home-today__head p {
  margin: 0;
  color: var(--color-ink-soft);
  line-height: var(--leading-body);
}

.page-home .home-today__strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border: var(--border-thin) solid var(--color-line);
}

.page-home .home-today__cell {
  display: grid;
  gap: var(--space-1);
  align-content: start;
  padding: var(--space-3);
  border-bottom: var(--border-thin) solid var(--color-line);
}

.page-home .home-today__cell:last-child {
  border-bottom: 0;
}

.page-home .home-today__num {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--text-3xl);
  font-weight: var(--weight-heading);
  line-height: 0.9;
  letter-spacing: -0.03em;
  color: var(--color-primary);
  font-variant-numeric: tabular-nums;
}

.page-home .home-today__label {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
  letter-spacing: 0.08em;
}

.page-home .home-today__note {
  margin: var(--space-1) 0 0;
  font-size: var(--text-sm);
  line-height: 1.6;
  color: var(--color-ink-soft);
}

.page-home .home-today__cell--act {
  background: var(--color-primary);
  color: var(--color-primary-ink);
}

.page-home .home-today__act-text {
  margin: 0;
  font-size: var(--text-base);
  line-height: 1.5;
  color: var(--color-primary-ink);
}

.page-home .home-today__act-link {
  display: inline-block;
  margin-top: var(--space-1);
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--color-primary-ink);
  text-decoration: underline;
  text-underline-offset: 5px;
  transition: transform 0.18s ease;
}

.page-home .home-today__act-link:hover,
.page-home .home-today__act-link:focus-visible {
  transform: translateX(2px);
}

.page-home .home-today__media {
  margin: var(--space-6) 0 0;
}

.page-home .home-today__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1220 / 560;
  object-fit: cover;
  border: var(--border-thin) solid var(--color-line);
}

.page-home .home-today__media .media__caption {
  margin-top: var(--space-2);
  font-size: var(--text-sm);
  line-height: 1.6;
  color: var(--color-ink-muted);
}

/* ---------- 首次进入 ---------- */
.page-home .home-first {
  background: var(--color-surface-alt);
}

.page-home .home-first__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

.page-home .home-first__media {
  margin: 0;
}

.page-home .home-first__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 760 / 1140;
  object-fit: cover;
  border: var(--border-thin) solid var(--color-line);
}

.page-home .home-first__media .media__caption {
  margin-top: var(--space-2);
  font-size: var(--text-sm);
  line-height: 1.6;
  color: var(--color-ink-muted);
}

.page-home .home-first__body > p {
  margin: 0;
  color: var(--color-ink-soft);
  line-height: var(--leading-body);
  max-width: var(--measure);
}

.page-home .home-first__body > p.eyebrow {
  color: var(--color-primary);
}

.page-home .home-first__body > h2 {
  margin: var(--space-2) 0 var(--space-3);
}

.page-home .home-steps {
  list-style: none;
  margin: var(--space-6) 0 0;
  padding: 0;
  border-top: var(--border-thin) solid var(--color-line);
}

.page-home .home-step {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-1);
  padding-block: var(--space-4);
  border-bottom: var(--border-thin) solid var(--color-line);
}

.page-home .home-step__no {
  font-family: var(--font-mono);
  font-size: var(--text-lg);
  font-weight: var(--weight-heading);
  line-height: 1;
  color: var(--color-primary);
}

.page-home .home-step__title {
  margin: 0;
  color: var(--color-ink);
}

.page-home .home-step__text {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}

.page-home .home-first__foot {
  margin-top: var(--space-4);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}

/* ---------- 回访快捷通道 ---------- */
.page-home .home-return {
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
}

.page-home .home-return__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

.page-home .home-return__lead h2 {
  color: var(--color-contrast-ink);
  margin: var(--space-2) 0 var(--space-3);
}

.page-home .home-return__lead p {
  margin: 0 0 var(--space-3);
  max-width: 50ch;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-contrast-ink);
  opacity: 0.84;
}

.page-home .home-return__panel {
  border: var(--border-thin) solid var(--color-contrast-line);
  padding: var(--space-3);
  transition: border-color 0.18s ease;
}

.page-home .home-return__panel:hover {
  border-color: var(--color-contrast-accent);
}

.page-home .home-return__panel summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  cursor: pointer;
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--color-contrast-ink);
  list-style: none;
}

.page-home .home-return__panel summary::-webkit-details-marker {
  display: none;
}

.page-home .home-return__panel summary::after {
  content: "＋";
  font-family: var(--font-mono);
  font-size: var(--text-lg);
  color: var(--color-contrast-accent);
}

.page-home .home-return__panel[open] summary::after {
  content: "－";
}

.page-home .home-return__list {
  list-style: none;
  margin: var(--space-3) 0 0;
  padding: var(--space-3) 0 0;
  border-top: var(--border-thin) solid var(--color-contrast-line);
  display: grid;
  gap: var(--space-3);
}

.page-home .home-return__item {
  display: grid;
  gap: var(--space-1);
}

.page-home .home-return__k {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  letter-spacing: 0.08em;
  color: var(--color-contrast-accent);
}

.page-home .home-return__v {
  font-size: var(--text-base);
  line-height: 1.6;
  color: var(--color-contrast-ink);
  opacity: 0.82;
}

/* ---------- 移动端 ---------- */
.page-home .home-mobile {
  background: var(--color-surface);
}

.page-home .home-mobile__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

.page-home .home-mobile__body > h2 {
  margin: var(--space-2) 0 var(--space-3);
}

.page-home .home-mobile__body > p {
  margin: 0;
  max-width: var(--measure);
  color: var(--color-ink-soft);
  line-height: var(--leading-body);
}

.page-home .home-mobile__facts {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin: var(--space-4) 0;
  border-top: var(--border-thin) solid var(--color-line);
}

.page-home .home-mobile__fact {
  padding: var(--space-2) 0;
  border-bottom: var(--border-thin) solid var(--color-line);
}

.page-home .home-mobile__fact dt {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
  letter-spacing: 0.06em;
}

.page-home .home-mobile__fact dd {
  margin: var(--space-1) 0 0;
  font-size: var(--text-lg);
  font-weight: var(--weight-heading);
  color: var(--color-ink);
}

.page-home .home-mobile__foot {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1) var(--space-2);
  align-items: baseline;
  font-size: var(--text-base);
}

.page-home .home-mobile__sep {
  color: var(--color-ink-muted);
}

.page-home .home-mobile__media {
  margin: 0;
}

.page-home .home-mobile__media img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 900 / 700;
  object-fit: cover;
  border: var(--border-thin) solid var(--color-line);
}

/* ---------- 栏目索引 ---------- */
.page-home .home-index {
  background: var(--color-surface);
}

.page-home .home-index__head {
  display: grid;
  gap: var(--space-2);
  margin-bottom: var(--space-6);
}

.page-home .home-index__groups {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

.page-home .home-index__group-title {
  display: inline-block;
  margin: 0 0 var(--space-2);
  padding-bottom: var(--space-1);
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  font-weight: 400;
  letter-spacing: 0.14em;
  color: var(--color-ink-muted);
  border-bottom: var(--border-thick) solid var(--color-primary);
}

.page-home .home-index__list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: var(--border-thin) solid var(--color-line);
}

.page-home .home-index__link {
  display: grid;
  gap: 2px;
  padding: var(--space-2) var(--space-2) var(--space-2) var(--space-3);
  border-bottom: var(--border-thin) solid var(--color-line);
  border-left: var(--border-thick) solid transparent;
  text-decoration: none;
  color: var(--color-ink);
  transition: border-color 0.18s ease, transform 0.18s ease, background-color 0.18s ease;
}

.page-home .home-index__link:hover,
.page-home .home-index__link:focus-visible {
  border-left-color: var(--color-accent);
  background: var(--color-highlight);
  transform: translateX(2px);
}

.page-home .home-index__name {
  font-size: var(--text-lg);
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-ink);
}

.page-home .home-index__desc {
  font-size: var(--text-sm);
  line-height: 1.6;
  color: var(--color-ink-soft);
}

/* ---------- 联系 ---------- */
.page-home .home-contact {
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
}

.page-home .home-contact__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-6);
}

.page-home .home-contact__lead h2 {
  margin: var(--space-2) 0 var(--space-3);
  color: var(--color-contrast-ink);
}

.page-home .home-contact__lead p {
  margin: 0;
  max-width: 48ch;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-contrast-ink);
  opacity: 0.84;
}

.page-home .home-contact__list {
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border-top: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-contact__item {
  display: grid;
  gap: var(--space-1);
  padding-block: var(--space-3);
  border-bottom: var(--border-thin) solid var(--color-contrast-line);
}

.page-home .home-contact__item dt {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  letter-spacing: 0.1em;
  color: var(--color-contrast-accent);
}

.page-home .home-contact__item dd {
  margin: 0;
  font-family: var(--font-mono);
  font-size: var(--text-base);
  line-height: 1.5;
  color: var(--color-contrast-ink);
  word-break: break-word;
}

.page-home .home-contact__foot {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-contrast-ink);
  opacity: 0.86;
}

.page-home .home-contact__foot .link-inline {
  color: var(--color-contrast-accent);
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* ---------- 响应式 ---------- */
@media (min-width: 600px) {
  .page-home .home-mobile__facts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-home .home-mobile__fact {
    border-bottom: 0;
    border-right: var(--border-thin) solid var(--color-line);
    padding-right: var(--space-2);
  }
  .page-home .home-mobile__fact:last-child {
    border-right: 0;
  }
  .page-home .home-return__item {
    grid-template-columns: 8.5rem minmax(0, 1fr);
    gap: var(--space-2);
    align-items: baseline;
  }
}

@media (min-width: 768px) {
  .page-home .home-step {
    grid-template-columns: calc(var(--space-8) * 1.2) minmax(0, 1fr);
    column-gap: var(--space-4);
    row-gap: var(--space-1);
  }
  .page-home .home-step__no {
    grid-row: 1 / span 2;
  }
  .page-home .home-step__title,
  .page-home .home-step__text {
    grid-column: 2;
  }
}

@media (min-width: 900px) {
  .page-home .home-hero__inner {
    padding-block: calc(var(--space-8) * 1.6) calc(var(--space-8) * 1.2);
  }

  .page-home .home-hero__grid {
    grid-template-columns: calc(var(--space-8) * 2.75) minmax(0, 1fr);
    grid-template-areas:
      "rail head"
      "rail figures";
    column-gap: var(--space-6);
    row-gap: var(--space-6);
    align-items: start;
  }

  .page-home .home-hero__rail {
    grid-area: rail;
    border-bottom: 0;
    border-left: var(--border-thin) solid var(--color-contrast-line);
    padding-left: var(--space-3);
    padding-bottom: 0;
  }

  .page-home .home-hero__ticks {
    flex-direction: column;
    gap: var(--space-1);
  }

  .page-home .home-hero__head {
    grid-area: head;
  }

  .page-home .home-hero__figures {
    grid-area: figures;
    padding-top: 0;
    border-top: 0;
    column-gap: var(--space-6);
  }

  .page-home .home-today__strip {
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.05fr);
  }

  .page-home .home-today__cell {
    border-bottom: 0;
    border-right: var(--border-thin) solid var(--color-line);
  }

  .page-home .home-today__cell:last-child {
    border-right: 0;
  }

  .page-home .home-first__grid {
    grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr);
    gap: var(--space-8);
    align-items: start;
  }

  .page-home .home-return__inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
    gap: var(--space-8);
    align-items: start;
  }

  .page-home .home-mobile__grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
    gap: var(--space-8);
    align-items: start;
  }

  .page-home .home-index__groups {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-6);
  }

  .page-home .home-contact__inner {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: var(--space-8);
    align-items: start;
  }

  .page-home .home-contact__foot {
    grid-column: 1 / -1;
  }
}