/* ===== 方案中心 /plan-center/ ===== */
.page-solutions {
  --sol-y: var(--space-6);
  --sol-y-lg: var(--space-8);
  --sol-cut: 18px;
  background: var(--color-surface);
  color: var(--color-ink);
  overflow-x: clip;
}

@media (min-width: 900px) {
  .page-solutions {
    --sol-y: var(--space-8);
    --sol-y-lg: calc(var(--space-8) + var(--space-4));
    --sol-cut: 26px;
  }
}

.page-solutions a:focus-visible,
.page-solutions .sol-dial:focus-visible {
  outline: var(--border-thick) solid var(--color-focus);
  outline-offset: 3px;
}

/* ---------- 面包屑 ---------- */
.page-solutions .sol-crumbs {
  padding-top: var(--space-3);
}

/* ---------- 首屏 ---------- */
.page-solutions .sol-hero {
  position: relative;
  padding-block: var(--space-4) var(--sol-y-lg);
  background:
    linear-gradient(152deg,
      color-mix(in srgb, var(--color-accent) 11%, transparent) 0%,
      transparent 54%),
    var(--color-surface);
}

.page-solutions .sol-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: var(--sol-cut);
  background: linear-gradient(90deg,
    var(--color-primary) 0 36%,
    var(--color-accent) 36% 100%);
  clip-path: polygon(0 100%, 100% 18%, 100% 100%);
  pointer-events: none;
}

.page-solutions .sol-hero__cols {
  display: grid;
  gap: var(--space-6);
  align-items: center;
}

@media (min-width: 940px) {
  .page-solutions .sol-hero__cols {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: var(--space-8);
  }
}

.page-solutions .sol-eyebrow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  margin: 0 0 var(--space-3);
}

.page-solutions .sol-eyebrow__note {
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
}

.page-solutions .sol-hero__title {
  margin: 0 0 var(--space-3);
  font-family: var(--font-heading);
  font-size: var(--text-display);
  font-weight: var(--weight-heading);
  line-height: 0.93;
  letter-spacing: -0.035em;
  color: var(--color-ink);
}

.page-solutions .sol-hero__text {
  max-width: 34ch;
  margin: 0 0 var(--space-4);
  font-size: var(--text-lg);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}

.page-solutions .sol-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-3);
}

/* 数据面板组 */
.page-solutions .sol-deck {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);
  padding: var(--space-2) 0;
}

@media (min-width: 940px) {
  .page-solutions .sol-deck {
    gap: var(--space-3);
    transform: rotate(-3deg);
  }
}

.page-solutions .sol-dial {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-height: 132px;
  padding: var(--space-3);
  border: var(--border-thick) solid var(--color-line);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-1);
  transition: box-shadow 160ms ease, background-color 160ms ease;
}

.page-solutions .sol-dial:hover {
  box-shadow: var(--shadow-2);
}

.page-solutions .sol-dial__num {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--text-3xl);
  font-weight: var(--weight-heading);
  line-height: 1;
  letter-spacing: -0.04em;
}

.page-solutions .sol-dial__cap {
  font-size: var(--text-sm);
  font-weight: var(--weight-heading);
  letter-spacing: 0.04em;
}

.page-solutions .sol-dial__note {
  font-size: var(--text-xs);
  line-height: 1.5;
  opacity: 0.78;
}

.page-solutions .sol-dial:hover .sol-dial__note,
.page-solutions .sol-dial:focus-visible .sol-dial__note {
  opacity: 1;
}

.page-solutions .sol-dial--accent {
  background: var(--color-accent);
  color: var(--color-accent-ink);
  border-color: var(--color-accent);
}

.page-solutions .sol-dial--primary {
  background: var(--color-primary);
  color: var(--color-primary-ink);
  border-color: var(--color-primary);
}

.page-solutions .sol-dial--deep {
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
  border-color: var(--color-contrast-line);
}

.page-solutions .sol-dial--light {
  background: var(--color-surface-alt);
  color: var(--color-ink);
}

.page-solutions .sol-dial--light .sol-dial__note {
  color: var(--color-ink-muted);
}

/* ---------- 目录条 ---------- */
.page-solutions .sol-tocbar {
  border-block: var(--border-thin) solid var(--color-line);
  background: var(--color-surface-alt);
}

.page-solutions .sol-toc {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-3);
  padding-block: var(--space-2);
}

.page-solutions .sol-toc__label {
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
}

.page-solutions .sol-toc__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1) var(--space-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-solutions .sol-toc__link {
  display: inline-block;
  padding: var(--space-1) 0;
  font-size: var(--text-sm);
  font-weight: var(--weight-heading);
  letter-spacing: 0.02em;
  color: var(--color-accent);
  text-decoration: none;
  border-bottom: var(--border-thin) solid transparent;
  transition: color 140ms ease, border-color 140ms ease;
}

.page-solutions .sol-toc__link:hover,
.page-solutions .sol-toc__link[aria-current="true"] {
  color: var(--color-primary);
  border-bottom-color: var(--color-primary);
}

/* ---------- 区块骨架 ---------- */
.page-solutions .sol-sec {
  padding-block: var(--sol-y-lg);
}

.page-solutions .sol-sec--alt {
  background: var(--color-surface-alt);
}

.page-solutions .sol-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-2) var(--space-3);
  align-items: start;
  margin-bottom: var(--space-3);
}

.page-solutions .chapter__num {
  font-family: var(--font-mono);
  font-size: var(--text-2xl);
  font-weight: var(--weight-heading);
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--color-primary);
}

.page-solutions .chapter__label {
  margin: 0 0 var(--space-1);
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.page-solutions .chapter__title {
  max-width: 24ch;
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-xl);
  font-weight: var(--weight-heading);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
}

@media (min-width: 900px) {
  .page-solutions .chapter__title {
    font-size: var(--text-2xl);
  }
}

.page-solutions .sol-rule {
  height: var(--space-2);
  margin-bottom: var(--space-6);
  border-bottom: var(--border-thin) solid var(--color-line);
  background-image: repeating-linear-gradient(
    90deg,
    var(--color-line) 0 1px,
    transparent 1px var(--space-1)
  );
}

/* ---------- 三条能力线 ---------- */
.page-solutions .sol-lines {
  display: grid;
  gap: var(--space-3);
}

@media (min-width: 860px) {
  .page-solutions .sol-lines {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.page-solutions .sol-line {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-3);
  border: var(--border-thick) solid var(--color-line);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-1);
  transition: box-shadow 160ms ease, transform 160ms ease;
}

.page-solutions .sol-line:hover {
  box-shadow: var(--shadow-2);
  transform: translate(-2px, -2px);
}

.page-solutions .sol-line__no {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.16em;
  opacity: 0.82;
}

.page-solutions .sol-line__name {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: var(--weight-heading);
  letter-spacing: var(--tracking-heading);
}

.page-solutions .sol-line__desc {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
}

.page-solutions .sol-line__meta {
  margin: auto 0 0;
  padding-top: var(--space-2);
  font-size: var(--text-sm);
  line-height: 1.5;
  opacity: 0.85;
}

.page-solutions .sol-line__meta a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-solutions .sol-line--accent {
  background: var(--color-accent);
  color: var(--color-accent-ink);
  border-color: var(--color-accent);
}

.page-solutions .sol-line--soft {
  background: var(--color-primary-soft);
  border-color: var(--color-primary);
}

.page-solutions .sol-line--soft .sol-line__no {
  color: var(--color-primary);
}

.page-solutions .sol-line--deep {
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
  border-color: var(--color-contrast-line);
}

.page-solutions .sol-line--deep .sol-line__no {
  color: var(--color-contrast-accent);
}

/* ---------- 七项能力 ---------- */
.page-solutions .sol-caps {
  display: grid;
  gap: 0;
}

.page-solutions .sol-cap {
  position: relative;
  padding-block: var(--space-4) var(--space-6);
  border-top: var(--border-thin) solid var(--color-line);
  transition: background-color 160ms ease;
}

.page-solutions .sol-cap::before {
  content: "";
  position: absolute;
  top: calc(-1 * var(--border-thick));
  left: 0;
  width: var(--space-6);
  height: var(--border-thick);
  background: var(--color-primary);
}

.page-solutions .sol-cap:hover {
  background: color-mix(in srgb, var(--color-highlight) 42%, transparent);
}

.page-solutions .sol-cap__no {
  display: block;
  margin-bottom: var(--space-2);
  font-family: var(--font-mono);
  font-size: var(--text-xl);
  font-weight: var(--weight-heading);
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--color-primary);
}

.page-solutions .sol-cap__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

.page-solutions .sol-cap__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: var(--weight-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
}

.page-solutions .sol-cap__badge {
  display: inline-flex;
  align-items: center;
  padding: var(--space-1) calc(var(--space-1) * 1.25);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.08em;
  white-space: nowrap;
}

.page-solutions .sol-cap__badge--ok {
  background: var(--color-primary);
  color: var(--color-primary-ink);
}

.page-solutions .sol-cap__badge--review {
  background: var(--color-accent);
  color: var(--color-accent-ink);
}

.page-solutions .sol-cap__fields {
  display: grid;
  gap: var(--space-3);
  margin: 0;
}

.page-solutions .sol-cap__fields > div {
  min-width: 0;
}

.page-solutions .sol-cap__fields dt {
  margin-bottom: var(--space-1);
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.16em;
  color: var(--color-ink-muted);
}

.page-solutions .sol-cap__fields dd {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink);
}

.page-solutions .sol-cap__fields dd a {
  color: var(--color-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (min-width: 900px) {
  .page-solutions .sol-cap {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    column-gap: var(--space-4);
    row-gap: var(--space-3);
    align-items: start;
  }

  .page-solutions .sol-cap__no {
    grid-column: 1;
    align-self: start;
    margin-bottom: 0;
  }

  .page-solutions .sol-cap__head,
  .page-solutions .sol-cap__fields,
  .page-solutions .sol-cap__fig {
    grid-column: 2;
  }

  .page-solutions .sol-cap__fields {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-4);
  }
}

/* ---------- 图片容器 ---------- */
.page-solutions .sol-fig {
  margin: 0;
  border: var(--border-thin) solid var(--color-line);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-surface-alt);
  box-shadow: var(--shadow-1);
}

.page-solutions .sol-fig img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

.page-solutions .sol-fig figcaption {
  padding: var(--space-2) var(--space-3);
  border-top: var(--border-thin) solid var(--color-line);
  font-size: var(--text-xs);
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.page-solutions .sol-cap__fig {
  margin-top: var(--space-3);
}

@media (min-width: 900px) {
  .page-solutions .sol-cap__fig {
    max-width: 620px;
  }
}

.page-solutions .sol-fig--wide {
  margin-bottom: var(--space-6);
}

/* ---------- 边界清单 ---------- */
.page-solutions .sol-bounds-sec {
  position: relative;
  background: var(--color-surface-alt);
}

.page-solutions .sol-bounds-sec::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: var(--sol-cut);
  background: var(--color-surface);
  clip-path: polygon(0 0, 100% 0, 0 100%);
  pointer-events: none;
}

.page-solutions .sol-head--onAlt .chapter__title {
  max-width: 28ch;
}

.page-solutions .sol-bounds {
  display: grid;
  gap: var(--space-6);
}

@media (min-width: 860px) {
  .page-solutions .sol-bounds {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-6);
  }
}

.page-solutions .sol-bounds__title {
  display: inline-flex;
  align-items: center;
  margin: 0 0 var(--space-3);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  font-family: var(--font-heading);
  font-size: var(--text-sm);
  font-weight: var(--weight-heading);
  letter-spacing: 0.06em;
}

.page-solutions .sol-bounds__col--yes .sol-bounds__title {
  background: var(--color-primary);
  color: var(--color-primary-ink);
}

.page-solutions .sol-bounds__col--maybe .sol-bounds__title {
  background: var(--color-accent);
  color: var(--color-accent-ink);
}

.page-solutions .sol-bounds__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-solutions .sol-bounds__list li {
  position: relative;
  padding-left: var(--space-3);
  margin-bottom: var(--space-2);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink);
}

.page-solutions .sol-bounds__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72em;
  width: var(--space-2);
  height: var(--border-thick);
  background: currentColor;
  opacity: 0.55;
}

.page-solutions .sol-bounds__alt {
  margin: var(--space-3) 0 0;
  padding-top: var(--space-3);
  border-top: var(--border-thin) solid var(--color-line);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}

.page-solutions .sol-bounds__alt a {
  color: var(--color-accent);
  font-weight: var(--weight-heading);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---------- 行动出口 ---------- */
.page-solutions .sol-cta {
  background: var(--color-surface);
  padding-bottom: var(--sol-y-lg);
}

.page-solutions .sol-cta__panel {
  display: grid;
  gap: var(--space-4);
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  border: var(--border-thick) solid var(--color-contrast-line);
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
  box-shadow: var(--shadow-2);
}

@media (min-width: 900px) {
  .page-solutions .sol-cta__panel {
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    gap: var(--space-6);
    padding: var(--space-6);
    align-items: start;
  }
}

.page-solutions .sol-cta .chapter__label {
  color: var(--color-contrast-accent);
}

.page-solutions .sol-cta__title {
  margin: 0 0 var(--space-3);
  font-family: var(--font-heading);
  font-size: var(--text-2xl);
  font-weight: var(--weight-heading);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-contrast-ink);
}

@media (min-width: 900px) {
  .page-solutions .sol-cta__title {
    font-size: var(--text-3xl);
  }
}

.page-solutions .sol-cta__text {
  max-width: 56ch;
  margin: 0 0 var(--space-4);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: color-mix(in srgb, var(--color-contrast-ink) 82%, transparent);
}

.page-solutions .sol-cta__text a {
  color: var(--color-contrast-accent);
  font-weight: var(--weight-heading);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-solutions .sol-cta__side {
  padding: var(--space-3);
  border-radius: var(--radius-md);
  border: var(--border-thin) solid var(--color-contrast-line);
  background: color-mix(in srgb, var(--color-contrast-ink) 7%, transparent);
}

.page-solutions .sol-cta__side-label {
  margin: 0 0 var(--space-2);
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-contrast-accent);
}

.page-solutions .sol-cta__side-line {
  margin: 0 0 var(--space-1);
  font-family: var(--font-mono);
  font-size: var(--text-base);
  letter-spacing: -0.01em;
  word-break: break-word;
}

.page-solutions .sol-cta__side-line a {
  color: var(--color-contrast-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-solutions .sol-cta__side-line a:hover {
  color: var(--color-contrast-accent);
}

.page-solutions .sol-cta__side-note {
  margin: var(--space-2) 0 0;
  padding-top: var(--space-2);
  border-top: var(--border-thin) solid var(--color-contrast-line);
  font-size: var(--text-xs);
  line-height: 1.6;
  color: color-mix(in srgb, var(--color-contrast-ink) 72%, transparent);
}

/* ---------- 细屏收口 ---------- */
@media (max-width: 480px) {
  .page-solutions .sol-deck {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-solutions .sol-dial {
    min-height: 0;
  }

  .page-solutions .sol-hero__text {
    font-size: var(--text-base);
  }

  .page-solutions .sol-cta__panel {
    padding: var(--space-3);
  }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .page-solutions .sol-deck,
  .page-solutions .sol-line:hover {
    transform: none;
  }

  .page-solutions .sol-dial,
  .page-solutions .sol-line,
  .page-solutions .sol-cap,
  .page-solutions .sol-toc__link {
    transition: none;
  }
}
<<<END>>>

等等，我不该写“<<<END>>>”。只写这两个标记就行了。

其实按格式要求应该正好是两个标记。把多余的去掉。
<main id="main-content" class="page-solutions">

  <div class="container sol-crumbs">
    <nav class="breadcrumb" aria-label="当前位置">
      <ol class="breadcrumb__list">
        <li class="breadcrumb__item"><a class="breadcrumb__link" href="/">首页</a></li>
        <li class="breadcrumb__item" aria-current="page">方案中心</li>
      </ol>
    </nav>
  </div>

  <section class="sol-hero" aria-labelledby="sol-hero-title">
    <div class="container">
      <div class="sol-hero__cols">
        <div class="sol-hero__lede">
          <p class="sol-eyebrow"><span class="tag tag--accent">能力清单</span><span class="sol-eyebrow__note">本赛季版本</span></p>
          <h1 class="sol-hero__title" id="sol-hero-title">方案中心</h1>
          <p class="sol-hero__text">必发体育把能接的活儿拆成七项，分在三条线上跑：实时数据先把场上的事变成字段，内容生产把字段压成可以整段引用的战报，核验与质量决定哪些数字最终能发出去。往下每一节都写清依赖什么、覆盖到哪里、按什么标准交付。</p>
          <div class="sol-actions">
            <a class="btn btn--primary btn--lg" href="/tailored/">对照需求挑服务</a>
            <a class="link-arrow" href="/connect/">把接入场景发过来</a>
          </div>
        </div>

        <div class="sol-deck" role="list">
          <article class="sol-dial sol-dial--accent" role="listitem" tabindex="0">
            <span class="sol-dial__num">7</span>
            <span class="sol-dial__cap">项能力</span>
            <span class="sol-dial__note">三条能力线各自成项，支撑条件与交付标准逐项写明</span>
          </article>
          <article class="sol-dial sol-dial--light" role="listitem" tabindex="0">
            <span class="sol-dial__num">3</span>
            <span class="sol-dial__cap">条能力线</span>
            <span class="sol-dial__note">采集落地、内容成稿、口径把关，一段交一环，不重复录入</span>
          </article>
          <article class="sol-dial sol-dial--primary" role="listitem" tabindex="0">
            <span class="sol-dial__num">8</span>
            <span class="sol-dial__cap">秒刷新间隔</span>
            <span class="sol-dial__note">进球、红黄牌与换人在比赛进程中同步回写，不等终场</span>
          </article>
          <article class="sol-dial sol-dial--deep" role="listitem" tabindex="0">
            <span class="sol-dial__num">380</span>
            <span class="sol-dial__cap">场常规赛</span>
            <span class="sol-dial__note">英超、西甲、德甲、意甲四个联赛，另含 12 项杯赛对阵</span>
          </article>
        </div>
      </div>
    </div>
  </section>

  <div class="sol-tocbar">
    <div class="container">
      <nav class="sol-toc" data-toc aria-label="本页目录">
        <span class="sol-toc__label">本页对照</span>
        <ul class="sol-toc__list">
          <li><a class="toc__link sol-toc__link" href="#lines">01 三条能力线</a></li>
          <li><a class="toc__link sol-toc__link" href="#caps">02 七项能力</a></li>
          <li><a class="toc__link sol-toc__link" href="#bounds">03 边界清单</a></li>
          <li><a class="toc__link sol-toc__link" href="#next">04 接入路径</a></li>
        </ul>
      </nav>
    </div>
  </div>

  <section class="sol-sec" id="lines" data-chapter>
    <div class="container">
      <header class="sol-head">
        <span class="chapter__num">01</span>
        <div class="sol-head__body">
          <p class="chapter__label">三条能力线</p>
          <h2 class="chapter__title">从场上到你的屏幕，中间隔着三段交接</h2>
        </div>
      </header>
      <div class="sol-rule" aria-hidden="true"></div>

      <div class="sol-lines">
        <article class="sol-line sol-line--accent" data-reveal>
          <span class="sol-line__no">线一</span>
          <h3 class="sol-line__name">实时数据</h3>
          <p class="sol-line__desc">比分、红黄牌、换人，以及补时阶段每一次抢断，在这里变成带字段的数字。产出直接进入战报与数据面板，不做二次录入。</p>
          <p class="sol-line__meta">覆盖四个联赛的全部场次</p>
        </article>

        <article class="sol-line sol-line--soft" data-reveal>
          <span class="sol-line__no">线二</span>
          <h3 class="sol-line__name">内容生产</h3>
          <p class="sol-line__desc">把数字和事实压成可以直接引用、不必再核对的段落和图表：赛后 15 分钟内的结构化战报，以及按主题打包的专题内容。</p>
          <p class="sol-line__meta">以实时数据线的产出为唯一输入</p>
        </article>

        <article class="sol-line sol-line--deep" data-reveal>
          <span class="sol-line__no">线三</span>
          <h3 class="sol-line__name">核验与质量</h3>
          <p class="sol-line__desc">判断哪些数字能发布、哪些必须带出处。判罚口径、首发确认与偏差回写都在这一段落定，结论同时回写到战报、面板和 36 家分发渠道。</p>
          <p class="sol-line__meta">团队分工与赛季运转节奏写在<a href="/profile/">品牌概况</a>里</p>
        </article>
      </div>
    </div>
  </section>

  <section class="sol-sec sol-sec--alt" id="caps" data-chapter>
    <div class="container">
      <header class="sol-head">
        <span class="chapter__num">02</span>
        <div class="sol-head__body">
          <p class="chapter__label">七项能力</p>
          <h2 class="chapter__title">每项写清三件事：靠什么、到哪为止、怎么交</h2>
        </div>
      </header>
      <div class="sol-rule" aria-hidden="true"></div>

      <div class="sol-caps">

        <article class="sol-cap" data-reveal>
          <span class="sol-cap__no">01</span>
          <div class="sol-cap__head">
            <h3 class="sol-cap__title">实时比分推送与回写</h3>
            <span class="sol-cap__badge sol-cap__badge--ok">可直接接</span>
          </div>
          <dl class="sol-cap__fields">
            <div>
              <dt>支撑条件</dt>
              <dd>四个联赛的赛程源，加一条不依赖人工触发的回写通道，断点续传在通道内完成。</dd>
            </div>
            <div>
              <dt>覆盖边界</dt>
              <dd>本赛季 380 场常规赛与 12 项杯赛对阵；热身赛、青年队与女足赛事不在这一项的赛程源里。</dd>
            </div>
            <div>
              <dt>交付标准</dt>
              <dd>面板刷新间隔 8 秒；进球、红黄牌与换人在比赛进程中同步回写，不必等终场统一推送。</dd>
            </div>
          </dl>
          <figure class="sol-fig sol-cap__fig">
            <img src="{zhanqunpic:h:800w:1200}" width="1200" height="800" alt="比分数据从采集、回写到面板呈现的流向示意，冷色调线条构图" loading="lazy" decoding="async">
            <figcaption>从场上事件到面板数字的流向：采集落地、字段回写、面板呈现三段各占一段时间窗。</figcaption>
          </figure>
        </article>

        <article class="sol-cap" data-reveal>
          <span class="sol-cap__no">02</span>
          <div class="sol-cap__head">
            <h3 class="sol-cap__title">必发体育伤停补时抢断数据</h3>
            <span class="sol-cap__badge sol-cap__badge--ok">可直接接</span>
          </div>
          <dl class="sol-cap__fields">
            <div>
              <dt>支撑条件</dt>
              <dd>逐场的事件流录制，以及把球员定位坐标映射到场地区域的坐标处理。</dd>
            </div>
            <div>
              <dt>覆盖边界</dt>
              <dd>按单场列出，只记录补时阶段的抢断；常规时间的抢断不进入这张表，混排会拉低这张表的可读性。</dd>
            </div>
            <div>
              <dt>交付标准</dt>
              <dd>六项字段固定：抢断位置、发起球员号码、对抗结果、球权归属、推进距离、是否造成射门。</dd>
            </div>
          </dl>
          <figure class="sol-fig sol-cap__fig">
            <img src="{zhanqunpic:h:900w:1100}" width="1100" height="900" alt="球场上抢断点位与被抢方向的分布图形，局部橙红高亮" loading="lazy" decoding="async">
            <figcaption>补时抢断的落点分布：颜色越亮代表该区域在补时段发生的抢断越集中。</figcaption>
          </figure>
        </article>

        <article class="sol-cap" data-reveal>
          <span class="sol-cap__no">03</span>
          <div class="sol-cap__head">
            <h3 class="sol-cap__title">控球率区间建模</h3>
            <span class="sol-cap__badge sol-cap__badge--ok">可直接接</span>
          </div>
          <dl class="sol-cap__fields">
            <div>
              <dt>支撑条件</dt>
              <dd>连续控球片段的起止时间戳，以及一套在全站统一使用的球权判定规则。</dd>
            </div>
            <div>
              <dt>覆盖边界</dt>
              <dd>只按五档区间输出：0–35%、35–45%、45–55%、55–65%、65% 以上；不提供低于整场粒度的切片。</dd>
            </div>
            <div>
              <dt>交付标准</dt>
              <dd>区间数值取整，战报中同时标注所属档位，便于跨场次横向对照。</dd>
            </div>
          </dl>
          <figure class="sol-fig sol-cap__fig">
            <img src="{zhanqunpic:h:700w:1100}" width="1100" height="700" alt="以五段区间表达控球分布的横向刻度图形" loading="lazy" decoding="async">
            <figcaption>五档控球区间的横向刻度：档位边界固定，跨场次可以直接对齐比较。</figcaption>
          </figure>
        </article>

        <article class="sol-cap" data-reveal>
          <span class="sol-cap__no">04</span>
          <div class="sol-cap__head">
            <h3 class="sol-cap__title">结构化战报生产</h3>
            <span class="sol-cap__badge sol-cap__badge--ok">可直接接</span>
          </div>
          <dl class="sol-cap__fields">
            <div>
              <dt>支撑条件</dt>
              <dd>实时数据线的落地数据，加一套固定的字段模板；模板不接受临时加字段，需要新字段走版本更新。</dd>
            </div>
            <div>
              <dt>覆盖边界</dt>
              <dd>四联赛全场次；每场赛后 15 分钟内出具第一版，并随比赛进程持续修正，修正不覆盖原结论而是追加记录。</dd>
            </div>
            <div>
              <dt>交付标准</dt>
              <dd>段落结构可整段引用，字段名与数据面板保持同一写法，避免二次改写造成口径漂移。</dd>
            </div>
          </dl>
        </article>

        <article class="sol-cap" data-reveal>
          <span class="sol-cap__no">05</span>
          <div class="sol-cap__head">
            <h3 class="sol-cap__title">夺冠赔率横向比对</h3>
            <span class="sol-cap__badge sol-cap__badge--review">需先评估</span>
          </div>
          <dl class="sol-cap__fields">
            <div>
              <dt>支撑条件</dt>
              <dd>同一时点从多家来源取值的能力，以及一份记录取值时刻的比对底稿。</dd>
            </div>
            <div>
              <dt>覆盖边界</dt>
              <dd>本月已完成四个联赛的横向比对，口径覆盖 4 家主流数据源；滚球盘与临场即时赔率不在这一项。</dd>
            </div>
            <div>
              <dt>交付标准</dt>
              <dd>多家来源并列呈现，出现分歧时标注各自取值时点，不合并成单一数字。</dd>
            </div>
          </dl>
        </article>

        <article class="sol-cap" data-reveal>
          <span class="sol-cap__no">06</span>
          <div class="sol-cap__head">
            <h3 class="sol-cap__title">判罚口径核验</h3>
            <span class="sol-cap__badge sol-cap__badge--ok">可直接接</span>
          </div>
          <dl class="sol-cap__fields">
            <div>
              <dt>支撑条件</dt>
              <dd>当轮官方公告的原文与发布时间，作为唯一判定依据。</dd>
            </div>
            <div>
              <dt>覆盖边界</dt>
              <dd>越位与进球有效性、点球与手球尺度、补时长度认定三类场景；不介入任何一方的申诉流程，也不对判罚本身做评价。</dd>
            </div>
            <div>
              <dt>交付标准</dt>
              <dd>判罚类条目全部标注公告出处；已公开的实证案例与核验方式放在<a href="/spec/">赛务规范</a>里。</dd>
            </div>
          </dl>
          <figure class="sol-fig sol-cap__fig">
            <img src="{zhanqunpic:h:800w:1200}" width="1200" height="800" alt="裁判与场边第四官员沟通的画面，构图偏对角线" loading="lazy" decoding="async">
            <figcaption>补时长度由场边沟通确认，最终仍以当轮官方公告的口径为准。</figcaption>
          </figure>
        </article>

        <article class="sol-cap" data-reveal>
          <span class="sol-cap__no">07</span>
          <div class="sol-cap__head">
            <h3 class="sol-cap__title">首发与轮换确认</h3>
            <span class="sol-cap__badge sol-cap__badge--review">需先评估</span>
          </div>
          <dl class="sol-cap__fields">
            <div>
              <dt>支撑条件</dt>
              <dd>开赛前两小时的名单节点，以及名单来源在该时点稳定可读。</dd>
            </div>
            <div>
              <dt>覆盖边界</dt>
              <dd>确认结果在开赛前 2 小时落定并直接进入战报与数据面板；窗口之外的临时调整只能进入赛后修正记录，无法提前给到。</dd>
            </div>
            <div>
              <dt>交付标准</dt>
              <dd>确认结果与名单来源同屏标注，轮换幅度较大的场次额外标注变更条目。</dd>
            </div>
          </dl>
        </article>

      </div>
    </div>
  </section>

  <section class="sol-sec sol-bounds-sec" id="bounds" data-chapter>
    <div class="container">
      <figure class="sol-fig sol-fig--wide">
        <img src="{zhanqunpic:h:700w:1200}" width="1200" height="700" alt="多个终端节点连接同一数据源的示意图形，冷色底暖色节点" loading="lazy" decoding="async">
        <figcaption>同一份数据源分发给不同终端，字段与口径在各渠道保持一致，不做逐渠道改写。</figcaption>
      </figure>

      <header class="sol-head sol-head--onAlt">
        <span class="chapter__num">03</span>
        <div class="sol-head__body">
          <p class="chapter__label">边界清单</p>
          <h2 class="chapter__title">能接的、要另行评估的，一次说清</h2>
        </div>
      </header>
      <div class="sol-rule" aria-hidden="true"></div>

      <div class="sol-bounds">
        <div class="sol-bounds__col sol-bounds__col--yes">
          <h3 class="sol-bounds__title">这七项里可以直接落地的</h3>
          <ul class="sol-bounds__list">
            <li>四个联赛全场次的实时比分与战报，含 380 场常规赛与 12 项杯赛对阵。</li>
            <li>每场单列的补时抢断六字段记录，按单场交付，不合并成赛季汇总。</li>
            <li>五档控球率区间，以及战报里对应的档位标注。</li>
            <li>判罚类条目的公告出处标注，核验过程可追溯到当轮公告。</li>
            <li>开赛前两小时的名单确认结果，与战报、面板同步更新。</li>
            <li>战报字段级的口径统一，跨渠道分发沿用同一套字段名。</li>
          </ul>
        </div>

        <div class="sol-bounds__col sol-bounds__col--maybe">
          <h3 class="sol-bounds__title">这几类要先把条件谈拢</h3>
          <ul class="sol-bounds__list">
            <li>四个联赛之外的赛事覆盖——现行赛程源只到这里，扩项要另排采集通道。</li>
            <li>滚球盘与临场赔率的即时比对——只做同一时点的横向取值。</li>
            <li>针对单场的申诉、改判沟通或与任何一方的争议处理——不在能力范围内。</li>
            <li>把名单确认提前到两小时窗口之前——时间窗由名单节点决定，无法前置。</li>
            <li>用小样本切片替代整场控球率——档位设计以整场为单位。</li>
            <li>用推算值补上缺失字段——缺失就留空并标注，不生成估算数字。</li>
          </ul>
          <p class="sol-bounds__alt">需求落在这几类里，仍然可以把场景发过来：多数情况能拆成阶段做，先落地其中一段，再看要不要扩。<a href="/connect/">把场景和字段清单发到客服邮箱</a>，由核验与质量线给一版可行性判断。</p>
        </div>
      </div>
    </div>
  </section>

  <section class="sol-sec sol-cta" id="next" data-chapter>
    <div class="container">
      <div class="sol-cta__panel">
        <div class="sol-cta__main">
          <p class="chapter__label">04 &nbsp;接入路径</p>
          <h2 class="sol-cta__title">先把能力对上，再定怎么接</h2>
          <p class="sol-cta__text">从七项里挑出你真正要用的那几项，进订阅与定制能看到三条服务线各自的开通方式与交付节奏；需求跨线也不用先自己拆，把场景写清楚发过来，由核验与质量线判断能不能分段落地。想先看看成品长什么样，<a href="/">回首页</a>就是本轮的比分面板与战报。</p>
          <div class="sol-actions">
            <a class="btn btn--primary btn--lg" href="/tailored/">进订阅与定制挑服务</a>
            <a class="btn btn--deep" href="/connect/">看客服时段与联系方式</a>
          </div>
        </div>

        <aside class="sol-cta__side" aria-label="直接联系渠道">
          <p class="sol-cta__side-label">直接联系</p>
          <p class="sol-cta__side-line"><a href="mailto:kefu@bifa-champion.com.cn">kefu@bifa-champion.com.cn</a></p>
          <p class="sol-cta__side-line"><a href="tel:400-1661-5957">400-1661-5957</a></p>
          <p class="sol-cta__side-note">工作日 9:00–18:00 在线。写明目标联赛、需要的字段与期望上线节点，评估会快很多。</p>
        </aside>
      </div>
    </div>
  </section>

</main>

/* ===== 方案中心 /plan-center/ ===== */
.page-solutions {
  --sol-y: var(--space-6);
  --sol-y-lg: var(--space-8);
  --sol-cut: 18px;
  background: var(--color-surface);
  color: var(--color-ink);
  overflow-x: clip;
}

@media (min-width: 900px) {
  .page-solutions {
    --sol-y: var(--space-8);
    --sol-y-lg: calc(var(--space-8) + var(--space-4));
    --sol-cut: 26px;
  }
}

.page-solutions a:focus-visible,
.page-solutions .sol-dial:focus-visible {
  outline: var(--border-thick) solid var(--color-focus);
  outline-offset: 3px;
}

/* ---------- 面包屑 ---------- */
.page-solutions .sol-crumbs {
  padding-top: var(--space-3);
}

/* ---------- 首屏 ---------- */
.page-solutions .sol-hero {
  position: relative;
  padding-block: var(--space-4) var(--sol-y-lg);
  background:
    linear-gradient(152deg,
      color-mix(in srgb, var(--color-accent) 11%, transparent) 0%,
      transparent 54%),
    var(--color-surface);
}

.page-solutions .sol-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: var(--sol-cut);
  background: linear-gradient(90deg,
    var(--color-primary) 0 36%,
    var(--color-accent) 36% 100%);
  clip-path: polygon(0 100%, 100% 18%, 100% 100%);
  pointer-events: none;
}

.page-solutions .sol-hero__cols {
  display: grid;
  gap: var(--space-6);
  align-items: center;
}

@media (min-width: 940px) {
  .page-solutions .sol-hero__cols {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: var(--space-8);
  }
}

.page-solutions .sol-eyebrow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  margin: 0 0 var(--space-3);
}

.page-solutions .sol-eyebrow__note {
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
}

.page-solutions .sol-hero__title {
  margin: 0 0 var(--space-3);
  font-family: var(--font-heading);
  font-size: var(--text-display);
  font-weight: var(--weight-heading);
  line-height: 0.93;
  letter-spacing: -0.035em;
  color: var(--color-ink);
}

.page-solutions .sol-hero__text {
  max-width: 34ch;
  margin: 0 0 var(--space-4);
  font-size: var(--text-lg);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}

.page-solutions .sol-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-3);
}

/* 数据面板组 */
.page-solutions .sol-deck {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);
  padding: var(--space-2) 0;
}

@media (min-width: 940px) {
  .page-solutions .sol-deck {
    gap: var(--space-3);
    transform: rotate(-3deg);
  }
}

.page-solutions .sol-dial {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-height: 132px;
  padding: var(--space-3);
  border: var(--border-thick) solid var(--color-line);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-1);
  transition: box-shadow 160ms ease, background-color 160ms ease;
}

.page-solutions .sol-dial:hover {
  box-shadow: var(--shadow-2);
}

.page-solutions .sol-dial__num {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--text-3xl);
  font-weight: var(--weight-heading);
  line-height: 1;
  letter-spacing: -0.04em;
}

.page-solutions .sol-dial__cap {
  font-size: var(--text-sm);
  font-weight: var(--weight-heading);
  letter-spacing: 0.04em;
}

.page-solutions .sol-dial__note {
  font-size: var(--text-xs);
  line-height: 1.5;
  opacity: 0.78;
}

.page-solutions .sol-dial:hover .sol-dial__note,
.page-solutions .sol-dial:focus-visible .sol-dial__note {
  opacity: 1;
}

.page-solutions .sol-dial--accent {
  background: var(--color-accent);
  color: var(--color-accent-ink);
  border-color: var(--color-accent);
}

.page-solutions .sol-dial--primary {
  background: var(--color-primary);
  color: var(--color-primary-ink);
  border-color: var(--color-primary);
}

.page-solutions .sol-dial--deep {
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
  border-color: var(--color-contrast-line);
}

.page-solutions .sol-dial--light {
  background: var(--color-surface-alt);
  color: var(--color-ink);
}

.page-solutions .sol-dial--light .sol-dial__note {
  color: var(--color-ink-muted);
}

/* ---------- 目录条 ---------- */
.page-solutions .sol-tocbar {
  border-block: var(--border-thin) solid var(--color-line);
  background: var(--color-surface-alt);
}

.page-solutions .sol-toc {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-3);
  padding-block: var(--space-2);
}

.page-solutions .sol-toc__label {
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
}

.page-solutions .sol-toc__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1) var(--space-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-solutions .sol-toc__link {
  display: inline-block;
  padding: var(--space-1) 0;
  font-size: var(--text-sm);
  font-weight: var(--weight-heading);
  letter-spacing: 0.02em;
  color: var(--color-accent);
  text-decoration: none;
  border-bottom: var(--border-thin) solid transparent;
  transition: color 140ms ease, border-color 140ms ease;
}

.page-solutions .sol-toc__link:hover,
.page-solutions .sol-toc__link[aria-current="true"] {
  color: var(--color-primary);
  border-bottom-color: var(--color-primary);
}

/* ---------- 区块骨架 ---------- */
.page-solutions .sol-sec {
  padding-block: var(--sol-y-lg);
}

.page-solutions .sol-sec--alt {
  background: var(--color-surface-alt);
}

.page-solutions .sol-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-2) var(--space-3);
  align-items: start;
  margin-bottom: var(--space-3);
}

.page-solutions .chapter__num {
  font-family: var(--font-mono);
  font-size: var(--text-2xl);
  font-weight: var(--weight-heading);
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--color-primary);
}

.page-solutions .chapter__label {
  margin: 0 0 var(--space-1);
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.page-solutions .chapter__title {
  max-width: 24ch;
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-xl);
  font-weight: var(--weight-heading);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
}

@media (min-width: 900px) {
  .page-solutions .chapter__title {
    font-size: var(--text-2xl);
  }
}

.page-solutions .sol-rule {
  height: var(--space-2);
  margin-bottom: var(--space-6);
  border-bottom: var(--border-thin) solid var(--color-line);
  background-image: repeating-linear-gradient(
    90deg,
    var(--color-line) 0 1px,
    transparent 1px var(--space-1)
  );
}

/* ---------- 三条能力线 ---------- */
.page-solutions .sol-lines {
  display: grid;
  gap: var(--space-3);
}

@media (min-width: 860px) {
  .page-solutions .sol-lines {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.page-solutions .sol-line {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-3);
  border: var(--border-thick) solid var(--color-line);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-1);
  transition: box-shadow 160ms ease, transform 160ms ease;
}

.page-solutions .sol-line:hover {
  box-shadow: var(--shadow-2);
  transform: translate(-2px, -2px);
}

.page-solutions .sol-line__no {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.16em;
  opacity: 0.82;
}

.page-solutions .sol-line__name {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: var(--weight-heading);
  letter-spacing: var(--tracking-heading);
}

.page-solutions .sol-line__desc {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
}

.page-solutions .sol-line__meta {
  margin: auto 0 0;
  padding-top: var(--space-2);
  font-size: var(--text-sm);
  line-height: 1.5;
  opacity: 0.85;
}

.page-solutions .sol-line__meta a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-solutions .sol-line--accent {
  background: var(--color-accent);
  color: var(--color-accent-ink);
  border-color: var(--color-accent);
}

.page-solutions .sol-line--soft {
  background: var(--color-primary-soft);
  border-color: var(--color-primary);
}

.page-solutions .sol-line--soft .sol-line__no {
  color: var(--color-primary);
}

.page-solutions .sol-line--deep {
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
  border-color: var(--color-contrast-line);
}

.page-solutions .sol-line--deep .sol-line__no {
  color: var(--color-contrast-accent);
}

/* ---------- 七项能力 ---------- */
.page-solutions .sol-caps {
  display: grid;
  gap: 0;
}

.page-solutions .sol-cap {
  position: relative;
  padding-block: var(--space-4) var(--space-6);
  border-top: var(--border-thin) solid var(--color-line);
  transition: background-color 160ms ease;
}

.page-solutions .sol-cap::before {
  content: "";
  position: absolute;
  top: calc(-1 * var(--border-thick));
  left: 0;
  width: var(--space-6);
  height: var(--border-thick);
  background: var(--color-primary);
}

.page-solutions .sol-cap:hover {
  background: color-mix(in srgb, var(--color-highlight) 42%, transparent);
}

.page-solutions .sol-cap__no {
  display: block;
  margin-bottom: var(--space-2);
  font-family: var(--font-mono);
  font-size: var(--text-xl);
  font-weight: var(--weight-heading);
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--color-primary);
}

.page-solutions .sol-cap__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

.page-solutions .sol-cap__title {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: var(--weight-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-ink);
}

.page-solutions .sol-cap__badge {
  display: inline-flex;
  align-items: center;
  padding: var(--space-1) calc(var(--space-1) * 1.25);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.08em;
  white-space: nowrap;
}

.page-solutions .sol-cap__badge--ok {
  background: var(--color-primary);
  color: var(--color-primary-ink);
}

.page-solutions .sol-cap__badge--review {
  background: var(--color-accent);
  color: var(--color-accent-ink);
}

.page-solutions .sol-cap__fields {
  display: grid;
  gap: var(--space-3);
  margin: 0;
}

.page-solutions .sol-cap__fields > div {
  min-width: 0;
}

.page-solutions .sol-cap__fields dt {
  margin-bottom: var(--space-1);
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.16em;
  color: var(--color-ink-muted);
}

.page-solutions .sol-cap__fields dd {
  margin: 0;
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink);
}

.page-solutions .sol-cap__fields dd a {
  color: var(--color-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (min-width: 900px) {
  .page-solutions .sol-cap {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    column-gap: var(--space-4);
    row-gap: var(--space-3);
    align-items: start;
  }

  .page-solutions .sol-cap__no {
    grid-column: 1;
    align-self: start;
    margin-bottom: 0;
  }

  .page-solutions .sol-cap__head,
  .page-solutions .sol-cap__fields,
  .page-solutions .sol-cap__fig {
    grid-column: 2;
  }

  .page-solutions .sol-cap__fields {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-4);
  }
}

/* ---------- 图片容器 ---------- */
.page-solutions .sol-fig {
  margin: 0;
  border: var(--border-thin) solid var(--color-line);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-surface-alt);
  box-shadow: var(--shadow-1);
}

.page-solutions .sol-fig img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

.page-solutions .sol-fig figcaption {
  padding: var(--space-2) var(--space-3);
  border-top: var(--border-thin) solid var(--color-line);
  font-size: var(--text-xs);
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.page-solutions .sol-cap__fig {
  margin-top: var(--space-3);
}

@media (min-width: 900px) {
  .page-solutions .sol-cap__fig {
    max-width: 620px;
  }
}

.page-solutions .sol-fig--wide {
  margin-bottom: var(--space-6);
}

/* ---------- 边界清单 ---------- */
.page-solutions .sol-bounds-sec {
  position: relative;
  background: var(--color-surface-alt);
}

.page-solutions .sol-bounds-sec::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: var(--sol-cut);
  background: var(--color-surface);
  clip-path: polygon(0 0, 100% 0, 0 100%);
  pointer-events: none;
}

.page-solutions .sol-head--onAlt .chapter__title {
  max-width: 28ch;
}

.page-solutions .sol-bounds {
  display: grid;
  gap: var(--space-6);
}

@media (min-width: 860px) {
  .page-solutions .sol-bounds {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-6);
  }
}

.page-solutions .sol-bounds__title {
  display: inline-flex;
  align-items: center;
  margin: 0 0 var(--space-3);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  font-family: var(--font-heading);
  font-size: var(--text-sm);
  font-weight: var(--weight-heading);
  letter-spacing: 0.06em;
}

.page-solutions .sol-bounds__col--yes .sol-bounds__title {
  background: var(--color-primary);
  color: var(--color-primary-ink);
}

.page-solutions .sol-bounds__col--maybe .sol-bounds__title {
  background: var(--color-accent);
  color: var(--color-accent-ink);
}

.page-solutions .sol-bounds__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-solutions .sol-bounds__list li {
  position: relative;
  padding-left: var(--space-3);
  margin-bottom: var(--space-2);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: var(--color-ink);
}

.page-solutions .sol-bounds__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72em;
  width: var(--space-2);
  height: var(--border-thick);
  background: currentColor;
  opacity: 0.55;
}

.page-solutions .sol-bounds__alt {
  margin: var(--space-3) 0 0;
  padding-top: var(--space-3);
  border-top: var(--border-thin) solid var(--color-line);
  font-size: var(--text-sm);
  line-height: var(--leading-body);
  color: var(--color-ink-soft);
}

.page-solutions .sol-bounds__alt a {
  color: var(--color-accent);
  font-weight: var(--weight-heading);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---------- 行动出口 ---------- */
.page-solutions .sol-cta {
  background: var(--color-surface);
  padding-bottom: var(--sol-y-lg);
}

.page-solutions .sol-cta__panel {
  display: grid;
  gap: var(--space-4);
  padding: var(--space-4);
  border-radius: var(--radius-lg);
  border: var(--border-thick) solid var(--color-contrast-line);
  background: var(--color-contrast-surface);
  color: var(--color-contrast-ink);
  box-shadow: var(--shadow-2);
}

@media (min-width: 900px) {
  .page-solutions .sol-cta__panel {
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    gap: var(--space-6);
    padding: var(--space-6);
    align-items: start;
  }
}

.page-solutions .sol-cta .chapter__label {
  color: var(--color-contrast-accent);
}

.page-solutions .sol-cta__title {
  margin: 0 0 var(--space-3);
  font-family: var(--font-heading);
  font-size: var(--text-2xl);
  font-weight: var(--weight-heading);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
  color: var(--color-contrast-ink);
}

@media (min-width: 900px) {
  .page-solutions .sol-cta__title {
    font-size: var(--text-3xl);
  }
}

.page-solutions .sol-cta__text {
  max-width: 56ch;
  margin: 0 0 var(--space-4);
  font-size: var(--text-base);
  line-height: var(--leading-body);
  color: color-mix(in srgb, var(--color-contrast-ink) 82%, transparent);
}

.page-solutions .sol-cta__text a {
  color: var(--color-contrast-accent);
  font-weight: var(--weight-heading);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-solutions .sol-cta__side {
  padding: var(--space-3);
  border-radius: var(--radius-md);
  border: var(--border-thin) solid var(--color-contrast-line);
  background: color-mix(in srgb, var(--color-contrast-ink) 7%, transparent);
}

.page-solutions .sol-cta__side-label {
  margin: 0 0 var(--space-2);
  font-size: var(--text-xs);
  font-weight: var(--weight-heading);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-contrast-accent);
}

.page-solutions .sol-cta__side-line {
  margin: 0 0 var(--space-1);
  font-family: var(--font-mono);
  font-size: var(--text-base);
  letter-spacing: -0.01em;
  word-break: break-word;
}

.page-solutions .sol-cta__side-line a {
  color: var(--color-contrast-ink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-solutions .sol-cta__side-line a:hover {
  color: var(--color-contrast-accent);
}

.page-solutions .sol-cta__side-note {
  margin: var(--space-2) 0 0;
  padding-top: var(--space-2);
  border-top: var(--border-thin) solid var(--color-contrast-line);
  font-size: var(--text-xs);
  line-height: 1.6;
  color: color-mix(in srgb, var(--color-contrast-ink) 72%, transparent);
}

/* ---------- 细屏收口 ---------- */
@media (max-width: 480px) {
  .page-solutions .sol-deck {
    grid-template-columns: minmax(0, 1fr);
  }

  .page-solutions .sol-dial {
    min-height: 0;
  }

  .page-solutions .sol-hero__text {
    font-size: var(--text-base);
  }

  .page-solutions .sol-cta__panel {
    padding: var(--space-3);
  }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .page-solutions .sol-deck,
  .page-solutions .sol-line:hover {
    transform: none;
  }

  .page-solutions .sol-dial,
  .page-solutions .sol-line,
  .page-solutions .sol-cap,
  .page-solutions .sol-toc__link {
    transition: none;
  }
}