.page-home {
  --hp-rail-w: 300px;
  --hp-soft-yellow: rgba(242, 178, 27, .16);
  --hp-soft-teal: rgba(14, 140, 127, .16);
  background-color: var(--paper);
  color: var(--ink);
  overflow-x: hidden;
}

/* ---------- 章节节奏 ---------- */
.page-home .home-open,
.page-home .home-route-band,
.page-home .home-columns-band,
.page-home .home-region-band,
.page-home .home-close-band {
  padding-block: 44px;
}

@media (min-width: 900px) {
  .page-home .home-open,
  .page-home .home-route-band,
  .page-home .home-columns-band,
  .page-home .home-region-band,
  .page-home .home-close-band {
    padding-block: 72px;
  }
}

/* ---------- 首屏 ---------- */
.page-home .home-open {
  position: relative;
  background-color: var(--paper);
  background-image:
    linear-gradient(to right, rgba(16, 24, 32, .045) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(16, 24, 32, .045) 1px, transparent 1px);
  background-size: 48px 48px;
  border-bottom: 1px solid var(--line);
}

.page-home .home-open__grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 32px;
  padding-top: 0;
  padding-bottom: 0;
}

@media (min-width: 960px) {
  .page-home .home-open__grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: 56px;
    align-items: center;
  }
}

.page-home .home-open__context {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 0;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .06em;
  color: var(--slate);
}

.page-home .home-open__context span {
  position: relative;
}

.page-home .home-open__context span + span::before {
  content: "";
  position: absolute;
  left: -8px;
  top: 50%;
  width: 1px;
  height: 11px;
  transform: translateY(-50%);
  background: var(--line-strong);
}

.page-home .home-open__title {
  margin: 18px 0 0;
  font-size: var(--fs-40);
  line-height: 1.12;
  font-weight: 900;
  letter-spacing: -.02em;
  color: var(--blue);
}

@media (min-width: 960px) {
  .page-home .home-open__title {
    font-size: var(--fs-56);
  }
}

.page-home .home-open__lede {
  margin: 20px 0 0;
  max-width: 44ch;
  font-size: var(--fs-17);
  line-height: 1.85;
  color: var(--slate);
}

.page-home .home-open__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 36px;
  margin: 26px 0 0;
  padding: 16px 0 0;
  list-style: none;
  border-top: 1px solid var(--line);
}

.page-home .home-open__stat {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.page-home .home-open__num {
  font-family: var(--font-mono);
  font-size: var(--fs-28);
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -.02em;
}

.page-home .home-open__num em {
  font-style: normal;
  color: var(--yellow);
}

.page-home .home-open__unit {
  font-size: var(--fs-15);
  color: var(--slate);
}

.page-home .home-open__acts {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.page-home .home-open__art {
  position: relative;
  margin: 0;
  overflow: hidden;
  background-color: var(--blue-deep);
  aspect-ratio: 16 / 10;
}

.page-home .home-open__art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.85) contrast(1.06);
}

.page-home .home-open__art::after {
  content: "";
  position: absolute;
  left: 6%;
  right: 6%;
  top: 66%;
  height: 2px;
  background: var(--yellow);
  opacity: .92;
}

.page-home .home-open__dot {
  position: absolute;
  top: calc(66% - 4px);
  width: 9px;
  height: 9px;
  background: var(--yellow);
  box-shadow: 0 0 0 4px var(--hp-soft-yellow);
  z-index: 2;
}

.page-home .home-open__dot--a { left: 24%; }
.page-home .home-open__dot--b { left: 50%; }
.page-home .home-open__dot--c { left: 76%; }

.page-home .home-open__caption {
  position: absolute;
  left: 6%;
  top: calc(66% + 14px);
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .06em;
  color: var(--paper);
  text-shadow: 0 1px 6px rgba(6, 28, 48, .8);
}

/* ---------- 目录 ---------- */
.page-home .home-catalog {
  position: relative;
  margin-top: 40px;
  border-top: 2px solid var(--ink);
}

@media (min-width: 960px) {
  .page-home .home-catalog {
    margin-top: 56px;
  }
}

.page-home .home-catalog__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  column-gap: 40px;
}

@media (min-width: 720px) {
  .page-home .home-catalog__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

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

.page-home .home-catalog__link {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  grid-template-areas:
    "no title"
    ". desc";
  gap: 3px 12px;
  align-items: baseline;
  padding: 18px 8px 18px 0;
  text-decoration: none;
  color: var(--ink);
  border-bottom: 1px solid var(--line);
  transition: transform var(--t), border-color var(--t), background-color var(--t);
}

.page-home .home-catalog__link:hover,
.page-home .home-catalog__link:focus-visible {
  transform: translateY(-2px);
  border-color: var(--yellow);
  background-color: var(--white);
}

.page-home .home-catalog__no {
  grid-area: no;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--yellow);
}

.page-home .home-catalog__title {
  grid-area: title;
  font-size: var(--fs-21);
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: -.01em;
}

.page-home .home-catalog__desc {
  grid-area: desc;
  font-size: var(--fs-15);
  line-height: 1.7;
  color: var(--slate);
}

/* ---------- 赛程线 ---------- */
.page-home .home-route-band {
  background: var(--blue);
  color: var(--paper);
}

.page-home .home-route__head {
  max-width: 62ch;
}

.page-home .home-route__eyebrow {
  margin: 0;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .08em;
  color: var(--yellow);
}

.page-home .home-route__title {
  margin: 12px 0 0;
  font-size: var(--fs-28);
  line-height: 1.24;
  font-weight: 900;
  letter-spacing: -.015em;
  color: var(--paper);
}

@media (min-width: 900px) {
  .page-home .home-route__title {
    font-size: var(--fs-40);
  }
}

.page-home .home-route__desc {
  margin: 14px 0 0;
  font-size: var(--fs-17);
  line-height: 1.85;
  color: rgba(244, 247, 250, .74);
}

.page-home .home-line {
  list-style: none;
  margin: 36px 0 0;
  padding: 0 0 8px;
  display: flex;
  overflow-x: auto;
  scrollbar-width: thin;
}

.page-home .home-line__node {
  position: relative;
  flex: 1 0 168px;
  min-width: 0;
  padding: 30px 18px 12px 0;
  border-top: 1px solid var(--line-dim);
  transition: opacity var(--t-slow), border-color var(--t-slow);
}

.page-home .home-line__dot {
  position: absolute;
  left: 0;
  top: -5px;
  width: 9px;
  height: 9px;
  background: rgba(244, 247, 250, .42);
  transition: background-color var(--t-slow), box-shadow var(--t-slow);
}

.page-home .home-line__node[data-lit] .home-line__dot {
  background: var(--yellow);
  box-shadow: 0 0 0 4px var(--hp-soft-yellow);
}

.page-home .home-line__node[data-lit] {
  border-top-color: var(--yellow);
}

.page-home .home-line__date {
  display: block;
  font-size: var(--fs-21);
  font-weight: 800;
  letter-spacing: -.01em;
  color: var(--paper);
}

.page-home .home-line__meta {
  display: block;
  margin-top: 6px;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  line-height: 1.6;
  color: rgba(244, 247, 250, .7);
}

.page-home .home-route__card {
  margin-top: 24px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  background: var(--white);
  color: var(--ink);
}

@media (min-width: 1000px) {
  .page-home .home-route__card {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  }
}

.page-home .home-route__table {
  padding: 22px 20px;
  overflow-x: auto;
}

@media (min-width: 900px) {
  .page-home .home-route__table {
    padding: 28px 32px;
  }
}

.page-home .home-table {
  width: 100%;
  min-width: 460px;
  border-collapse: collapse;
}

.page-home .home-table th,
.page-home .home-table td {
  padding: 12px 10px;
  text-align: left;
  font-size: var(--fs-15);
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}

.page-home .home-table thead th {
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .06em;
  color: var(--slate);
  border-bottom: 1px solid var(--line-strong);
}

.page-home .home-table tbody th {
  font-weight: 700;
  color: var(--blue);
}

.page-home .home-table tbody tr {
  transition: background-color var(--t);
}

.page-home .home-table tbody tr:hover {
  background-color: var(--hp-soft-yellow);
}

.page-home .home-table__note {
  margin: 14px 0 0;
  font-size: var(--fs-13);
  line-height: 1.7;
  color: var(--slate);
}

.page-home .home-route__art {
  margin: 0;
  overflow: hidden;
  background: var(--blue-deep);
  min-height: 200px;
}

.page-home .home-route__art img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 200px;
  object-fit: cover;
}

/* ---------- 栏目 + 右栏 ---------- */
.page-home .home-split {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 40px;
}

.page-home .home-split__main {
  min-width: 0;
}

@media (min-width: 1024px) {
  .page-home .home-split {
    grid-template-columns: minmax(0, 1fr) var(--hp-rail-w);
    gap: 48px;
    align-items: start;
  }

  .page-home .home-split__rail {
    position: sticky;
    top: 96px;
  }
}

.page-home .home-block-head {
  max-width: 60ch;
}

.page-home .home-block-head__title {
  margin: 12px 0 0;
  font-size: var(--fs-28);
  line-height: 1.24;
  font-weight: 900;
  letter-spacing: -.015em;
  color: var(--blue);
}

@media (min-width: 900px) {
  .page-home .home-block-head__title {
    font-size: var(--fs-40);
  }
}

.page-home .home-block-head__desc {
  margin: 14px 0 0;
  font-size: var(--fs-17);
  line-height: 1.85;
  color: var(--slate);
}

.page-home .home-columns__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin-top: 32px;
  border-top: 1px solid var(--line-strong);
}

@media (min-width: 700px) {
  .page-home .home-columns__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 32px;
  }
}

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

.page-home .home-col {
  padding: 22px 0 24px;
  border-bottom: 1px solid var(--line);
  transition: transform var(--t), border-color var(--t);
}

.page-home .home-col:hover {
  transform: translateY(-2px);
  border-bottom-color: var(--yellow);
}

.page-home .home-col__tab {
  display: inline-block;
  margin: 0;
  padding: 5px 10px;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .06em;
  color: var(--paper);
  background: var(--blue);
}

.page-home .home-col__tab--teal { background: var(--teal); }
.page-home .home-col__tab--yellow { background: var(--yellow); color: var(--ink); }
.page-home .home-col__tab--blue { background: var(--blue); }

.page-home .home-col__metric {
  margin: 18px 0 0;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .06em;
  color: var(--slate);
}

.page-home .home-col__title {
  margin: 8px 0 0;
  font-size: var(--fs-21);
  line-height: 1.35;
  font-weight: 800;
  color: var(--ink);
}

.page-home .home-col__text {
  margin: 12px 0 0;
  font-size: var(--fs-15);
  line-height: 1.85;
  color: var(--slate);
}

.page-home .home-col__spec {
  margin: 18px 0 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--line);
}

.page-home .home-col__spec > div {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 10px;
  padding: 4px 0;
}

.page-home .home-col__spec dt {
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  color: var(--slate);
}

.page-home .home-col__spec dd {
  margin: 0;
  font-size: var(--fs-15);
  line-height: 1.7;
  color: var(--ink);
}

.page-home .home-col__link {
  display: inline-block;
  margin-top: 18px;
  padding-bottom: 2px;
  font-size: var(--fs-15);
  font-weight: 700;
  color: var(--blue);
  text-decoration: none;
  border-bottom: 2px solid var(--yellow);
  transition: color var(--t), border-color var(--t);
}

.page-home .home-col__link:hover,
.page-home .home-col__link:focus-visible {
  color: var(--teal);
  border-color: var(--teal);
}

/* 右栏 */
.page-home .home-rail {
  border-top: 3px solid var(--yellow);
  background: var(--white);
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.page-home .home-rail__head {
  margin: 0;
  padding: 16px 20px;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--paper);
  background: var(--blue-deep);
}

.page-home .home-rail__price {
  padding: 22px 20px;
  border-bottom: 1px solid var(--line);
  background-image:
    linear-gradient(to right, rgba(16, 24, 32, .05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(16, 24, 32, .05) 1px, transparent 1px);
  background-size: 24px 24px;
}

.page-home .home-rail__label {
  margin: 0;
  font-size: var(--fs-13);
  letter-spacing: .04em;
  color: var(--slate);
}

.page-home .home-rail__value {
  margin: 10px 0 0;
  font-family: var(--font-mono);
  font-size: var(--fs-40);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.02em;
  color: var(--blue);
}

.page-home .home-rail__value em {
  font-style: normal;
  color: var(--yellow);
  padding: 0 2px;
}

.page-home .home-rail__note {
  margin: 12px 0 0;
  font-size: var(--fs-13);
  line-height: 1.75;
  color: var(--slate);
}

.page-home .home-rail__switch {
  padding: 20px;
}

.page-home .home-rail__text {
  margin: 10px 0 0;
  font-size: var(--fs-15);
  line-height: 1.8;
  color: var(--ink);
}

.page-home .home-rail__cta {
  display: block;
  margin-top: 16px;
  padding: 12px 16px;
  text-align: center;
  font-size: var(--fs-15);
  font-weight: 700;
  color: var(--ink);
  text-decoration: none;
  background: var(--yellow);
  border: 1px solid var(--yellow);
  transition: background-color var(--t), color var(--t), border-color var(--t);
}

.page-home .home-rail__cta:hover,
.page-home .home-rail__cta:focus-visible {
  background: var(--white);
  border-color: var(--blue);
  color: var(--blue);
}

/* ---------- 整宽分隔图 ---------- */
.page-home .home-band {
  position: relative;
  margin: 0;
  background: var(--blue-deep);
  overflow: hidden;
}

.page-home .home-band img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 420px;
  object-fit: cover;
  filter: saturate(.9);
}

.page-home .home-band__caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 20px 24px;
  font-size: var(--fs-15);
  line-height: 1.7;
  color: var(--paper);
  background: linear-gradient(180deg, rgba(6, 28, 48, 0), rgba(6, 28, 48, .86));
}

@media (min-width: 900px) {
  .page-home .home-band__caption {
    padding: 28px 48px;
  }
}

/* ---------- 地域与社群 ---------- */
.page-home .home-region {
  border: 1px solid var(--line);
  background: var(--white);
}

.page-home .home-region__tab {
  margin: 0;
  padding: 12px 20px;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .08em;
  color: var(--ink);
  background: var(--yellow);
}

.page-home .home-region__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 960px) {
  .page-home .home-region__body {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  }
}

.page-home .home-region__copy {
  padding: 28px 20px 32px;
}

@media (min-width: 900px) {
  .page-home .home-region__copy {
    padding: 40px 48px;
  }
}

.page-home .home-region__title {
  margin: 0;
  font-size: var(--fs-28);
  line-height: 1.24;
  font-weight: 900;
  letter-spacing: -.015em;
  color: var(--blue);
}

@media (min-width: 900px) {
  .page-home .home-region__title {
    font-size: var(--fs-40);
  }
}

.page-home .home-region__text {
  margin: 16px 0 0;
  max-width: 52ch;
  font-size: var(--fs-17);
  line-height: 1.85;
  color: var(--slate);
}

.page-home .home-region__facts {
  list-style: none;
  margin: 26px 0 0;
  padding: 0;
  border-top: 1px solid var(--line);
}

.page-home .home-region__facts li {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 14px;
  align-items: baseline;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

.page-home .home-region__num {
  font-family: var(--font-mono);
  font-size: var(--fs-28);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.02em;
  color: var(--blue);
}

.page-home .home-region__fact {
  font-size: var(--fs-15);
  line-height: 1.75;
  color: var(--slate);
}

.page-home .home-region__copy .btn {
  margin-top: 26px;
}

.page-home .home-region__art {
  margin: 0;
  overflow: hidden;
  background: var(--blue-deep);
  min-height: 220px;
}

.page-home .home-region__art img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 220px;
  object-fit: cover;
}

/* ---------- 收束 ---------- */
.page-home .home-close-band {
  background: var(--blue-deep);
  color: var(--paper);
}

.page-home .home-close {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 40px;
}

@media (min-width: 960px) {
  .page-home .home-close {
    grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
    gap: 56px;
  }
}

.page-home .home-close__title {
  margin: 0;
  font-size: var(--fs-28);
  line-height: 1.24;
  font-weight: 900;
  letter-spacing: -.015em;
  color: var(--paper);
}

@media (min-width: 900px) {
  .page-home .home-close__title {
    font-size: var(--fs-40);
  }
}

.page-home .home-close__list {
  list-style: none;
  margin: 26px 0 0;
  padding: 0;
}

.page-home .home-close__list li {
  padding: 14px 0;
  font-size: var(--fs-15);
  line-height: 1.85;
  color: rgba(244, 247, 250, .76);
  border-bottom: 1px solid var(--line-dim);
}

.page-home .home-close__list strong {
  display: inline-block;
  min-width: 86px;
  margin-right: 10px;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .06em;
  color: var(--yellow);
  font-weight: 700;
}

.page-home .home-close__acts {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.page-home .home-close__side {
  padding: 24px 20px;
  background: rgba(244, 247, 250, .05);
  border: 1px solid var(--line-dim);
  border-top: 3px solid var(--yellow);
}

.page-home .home-close__side-title {
  margin: 0 0 16px;
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .08em;
  color: var(--paper);
}

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

.page-home .home-close__dl dt {
  font-size: var(--fs-13);
  letter-spacing: .04em;
  color: rgba(244, 247, 250, .56);
}

.page-home .home-close__dl dd {
  margin: 4px 0 16px;
  font-family: var(--font-mono);
  font-size: var(--fs-15);
  line-height: 1.7;
  color: var(--paper);
  word-break: break-word;
}

.page-home .home-close__legal {
  margin: 0;
  padding-top: 16px;
  border-top: 1px solid var(--line-dim);
  font-family: var(--font-mono);
  font-size: var(--fs-13);
  letter-spacing: .06em;
  color: rgba(244, 247, 250, .6);
}

.page-home .home-close__more {
  display: inline-block;
  margin-top: 16px;
  padding-bottom: 2px;
  font-size: var(--fs-15);
  font-weight: 700;
  color: var(--yellow);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color var(--t), color var(--t);
}

.page-home .home-close__more:hover,
.page-home .home-close__more:focus-visible {
  border-color: var(--yellow);
  color: var(--paper);
}

/* ---------- 窄屏粘性兜底 ---------- */
@media (max-width: 1023px) {
  .page-home .home-split__rail {
    position: sticky;
    bottom: 0;
    z-index: 5;
  }

  .page-home .home-rail {
    border-left: none;
    border-right: none;
    border-bottom: none;
    border-top-width: 3px;
  }

  .page-home .home-rail__price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px 16px;
    padding: 14px 20px;
  }

  .page-home .home-rail__value {
    margin: 0;
    font-size: var(--fs-28);
  }

  .page-home .home-rail__note {
    flex-basis: 100%;
    margin: 0;
  }

  .page-home .home-rail__switch {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-home .home-catalog__link,
  .page-home .home-col,
  .page-home .home-line__dot,
  .page-home .home-line__node,
  .page-home .home-rail__cta,
  .page-home .home-close__more {
    transition: none;
  }

  .page-home .home-catalog__link:hover,
  .page-home .home-col:hover {
    transform: none;
  }
}