.page-faq {
  --fq-gap: clamp(18px, 2.6vw, 32px);
  --fq-pad: clamp(16px, 2.4vw, 30px);
  --fq-paper-ink: #0B1B2B;
  --fq-paper-mute: #6E6656;
  background: var(--ink);
  color: var(--paper);
  overflow-x: clip;
}

.page-faq .display--xl {
  font-size: clamp(34px, 6vw, 74px);
  line-height: 1.04;
  letter-spacing: -.02em;
}

.page-faq .faq-hero {
  position: relative;
  padding: clamp(24px, 4.4vw, 54px) 0 clamp(34px, 5.4vw, 78px);
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(115% 88% at 88% 2%, rgba(21, 224, 200, .17), transparent 58%),
    radial-gradient(85% 68% at 0% 100%, rgba(255, 154, 60, .11), transparent 60%),
    linear-gradient(180deg, var(--night), var(--ink) 72%);
}

.page-faq .faq-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cyan), rgba(255, 154, 60, .7), transparent);
  opacity: .55;
}

.page-faq .crumbs {
  font-size: 12px;
  letter-spacing: .1em;
  color: var(--cool);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.page-faq .crumbs a {
  color: var(--cool);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .2s var(--ease), border-color .2s var(--ease);
}

.page-faq .crumbs a:hover,
.page-faq .crumbs a:focus-visible {
  color: var(--cyan-soft);
  border-color: var(--cyan-soft);
}

.page-faq .faq-hero__grid {
  display: grid;
  gap: clamp(24px, 3.4vw, 48px);
  margin-top: clamp(20px, 3vw, 38px);
  align-items: center;
}

.page-faq .faq-hero__lead .eyebrow {
  color: var(--cyan);
}

.page-faq .faq-hero__lead h1 {
  margin: 14px 0 0;
}

.page-faq .faq-hero__lead .lede {
  margin: 18px 0 0;
  max-width: 46ch;
  color: rgba(244, 239, 228, .76);
  font-size: clamp(15px, 1.7vw, 17px);
  line-height: 1.85;
}

.page-faq .faq-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 26px;
}

.page-faq .faq-hero__visual {
  position: relative;
  margin: 0;
  border: 1px solid var(--line-strong);
  background: var(--slate);
  aspect-ratio: 16 / 11;
  overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 34px), calc(100% - 34px) 100%, 0 100%);
}

.page-faq .faq-hero__visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.92) contrast(1.04);
}

.page-faq .faq-hero__data {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 48px 12px 16px;
  background: linear-gradient(90deg, rgba(5, 13, 20, .94), rgba(5, 13, 20, .5));
  border-top: 1px solid var(--line);
}

.page-faq .faq-hero__data-label {
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--cool);
}

.page-faq .faq-hero__data-value {
  font-family: var(--font-mono);
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 700;
  color: var(--cyan);
  line-height: 1;
}

.page-faq .faq-finder {
  border-bottom: 1px solid var(--line);
  background: rgba(5, 13, 20, .55);
}

.page-faq .faq-finder__list {
  display: flex;
  gap: 8px;
  padding: 14px 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.page-faq .faq-finder__list::-webkit-scrollbar {
  height: 3px;
}

.page-faq .faq-finder__list::-webkit-scrollbar-thumb {
  background: var(--line-strong);
}

.page-faq .chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: none;
  padding: 8px 15px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: transparent;
  color: var(--cool);
  font-size: 13px;
  letter-spacing: .03em;
  text-decoration: none;
  white-space: nowrap;
  transition: color .2s var(--ease), border-color .2s var(--ease), background .2s var(--ease);
}

.page-faq .chip .num {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--cyan);
}

.page-faq .chip:hover,
.page-faq .chip:focus-visible {
  color: var(--paper);
  border-color: var(--cyan);
  background: rgba(21, 224, 200, .08);
}

.page-faq .chip--flag {
  color: var(--amber);
  border-color: rgba(255, 154, 60, .55);
  background: rgba(255, 154, 60, .07);
}

.page-faq .chip--flag .num {
  color: var(--amber);
}

.page-faq .faq-body {
  padding: clamp(30px, 5vw, 74px) 0;
}

.page-faq .faq-body__grid {
  display: grid;
  gap: var(--fq-gap);
}

.page-faq .faq-rail {
  display: none;
}

.page-faq .faq-rail .eyebrow {
  margin: 0 0 14px;
  color: var(--cool);
}

.page-faq .faq-rail__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 2px;
  counter-reset: none;
}

.page-faq .faq-rail__link {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 11px 2px 11px 12px;
  border-left: 2px solid transparent;
  text-decoration: none;
  color: rgba(244, 239, 228, .82);
  font-size: 14px;
  transition: border-color .2s var(--ease), color .2s var(--ease), background .2s var(--ease);
}

.page-faq .faq-rail__num {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--cool);
}

.page-faq .faq-rail__count {
  font-size: 11px;
  letter-spacing: .08em;
  color: var(--cool);
}

.page-faq .faq-rail__link:hover,
.page-faq .faq-rail__link:focus-visible {
  border-left-color: var(--cyan);
  color: var(--paper);
  background: rgba(21, 224, 200, .06);
}

.page-faq .faq-rail__link--flag {
  color: var(--amber);
}

.page-faq .faq-rail__link--flag .faq-rail__num {
  color: var(--amber);
}

.page-faq .faq-rail__link--flag:hover,
.page-faq .faq-rail__link--flag:focus-visible {
  border-left-color: var(--amber);
  background: rgba(255, 154, 60, .08);
}

.page-faq .faq-rail__hint {
  margin: 18px 0 0;
  padding-left: 12px;
  border-left: 2px solid var(--line-strong);
  font-size: 12px;
  line-height: 1.8;
  color: var(--cool);
}

.page-faq .faq-group {
  scroll-margin-top: 90px;
}

.page-faq .faq-group + .faq-group {
  margin-top: clamp(34px, 5vw, 62px);
  padding-top: clamp(28px, 4vw, 50px);
  border-top: 1px solid var(--line);
}

.page-faq .faq-group__head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: end;
  gap: 4px 16px;
  margin-bottom: clamp(16px, 2.2vw, 26px);
}

.page-faq .faq-group__num {
  font-family: var(--font-mono);
  font-size: clamp(32px, 4.4vw, 52px);
  line-height: .85;
  letter-spacing: -.02em;
  color: transparent;
  -webkit-text-stroke: 1px var(--cool);
}

.page-faq .faq-group__title {
  margin: 0;
  font-size: clamp(20px, 2.5vw, 28px);
  font-weight: 600;
  letter-spacing: -.01em;
  line-height: 1.3;
}

.page-faq .faq-group__note {
  grid-column: 2;
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 1.8;
  color: var(--cool);
}

.page-faq .faq-item {
  border-top: 1px solid var(--line);
}

.page-faq .faq-item:last-child {
  border-bottom: 1px solid var(--line);
}

.page-faq .faq-item summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 16px 2px;
  list-style: none;
  cursor: pointer;
  font-size: clamp(15px, 1.6vw, 17px);
  font-weight: 500;
  line-height: 1.65;
  color: var(--paper);
  transition: color .2s var(--ease);
}

.page-faq .faq-item summary::-webkit-details-marker {
  display: none;
}

.page-faq .faq-item summary:hover,
.page-faq .faq-item summary:focus-visible {
  color: var(--cyan-soft);
}

.page-faq .faq-item__mark {
  position: relative;
  width: 14px;
  height: 14px;
  flex: none;
}

.page-faq .faq-item__mark::before,
.page-faq .faq-item__mark::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  background: var(--cyan);
  transition: transform .25s var(--ease), opacity .2s var(--ease);
}

.page-faq .faq-item__mark::after {
  transform: rotate(90deg);
}

.page-faq .faq-item[open] .faq-item__mark::after {
  transform: rotate(0deg);
  opacity: 0;
}

.page-faq .faq-item[open] summary {
  color: var(--cyan-soft);
}

.page-faq .faq-item__a {
  padding: 0 0 18px;
}

.page-faq .faq-item__a p {
  margin: 0;
  max-width: 62ch;
  font-size: 15px;
  line-height: 1.9;
  color: rgba(244, 239, 228, .74);
}

.page-faq .faq-item__a p + p {
  margin-top: 10px;
}

.page-faq .faq-group--flag {
  position: relative;
  padding: var(--fq-pad);
  border: 1px solid rgba(255, 154, 60, .32);
  border-left: 3px solid var(--amber);
  background: linear-gradient(158deg, rgba(20, 42, 58, .96), rgba(11, 27, 43, .86));
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 26px), calc(100% - 26px) 100%, 0 100%);
}

.page-faq .faq-group--flag .faq-group__num {
  -webkit-text-stroke-color: var(--amber);
}

.page-faq .faq-group--flag .faq-group__note {
  color: rgba(244, 239, 228, .66);
}

.page-faq .faq-group--flag .faq-item__a p {
  color: rgba(244, 239, 228, .8);
}

.page-faq .faq-group__flag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 16px;
  padding: 5px 12px;
  background: var(--amber);
  color: var(--night);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.page-faq .faq-group__media {
  margin: 0 0 clamp(18px, 2.4vw, 26px);
  aspect-ratio: 3 / 1;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--night);
}

.page-faq .faq-group__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .8;
}

.page-faq .fq-table-wrap {
  margin: 0 0 clamp(20px, 2.6vw, 28px);
  overflow-x: auto;
  border: 1px solid var(--line);
  background: rgba(5, 13, 20, .42);
}

.page-faq .fq-table {
  width: 100%;
  min-width: 540px;
  border-collapse: collapse;
  font-size: 14px;
}

.page-faq .fq-table th {
  padding: 12px 14px;
  text-align: left;
  white-space: nowrap;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--cyan);
  border-bottom: 1px solid var(--line-strong);
  background: rgba(5, 13, 20, .55);
}

.page-faq .fq-table td {
  padding: 12px 14px;
  vertical-align: top;
  line-height: 1.75;
  color: rgba(244, 239, 228, .8);
  border-bottom: 1px solid var(--line);
}

.page-faq .fq-table tr:last-child td {
  border-bottom: 0;
}

.page-faq .fq-table td:first-child {
  white-space: nowrap;
  font-weight: 600;
  color: var(--paper);
}

.page-faq .fq-table td:last-child {
  color: rgba(21, 224, 200, .85);
  white-space: nowrap;
}

.page-faq .fq-path {
  padding: clamp(34px, 5vw, 72px) 0;
  border-top: 1px solid var(--line);
  background: linear-gradient(180deg, var(--ink), var(--night));
}

.page-faq .fq-path .eyebrow {
  color: var(--amber);
}

.page-faq .fq-path h2 {
  margin: 14px 0 0;
  font-size: clamp(26px, 3.6vw, 46px);
  line-height: 1.15;
  letter-spacing: -.01em;
}

.page-faq .fq-path__list {
  list-style: none;
  margin: clamp(22px, 3.2vw, 38px) 0 0;
  padding: 0;
  display: grid;
  gap: 14px;
}

.page-faq .fq-path__step {
  position: relative;
  padding: clamp(18px, 2.6vw, 28px);
  border: 1px solid var(--line);
  background: var(--slate);
}

.page-faq .fq-path__step::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: linear-gradient(90deg, var(--cyan), transparent 82%);
}

.page-faq .fq-path__step:last-child::before {
  background: linear-gradient(90deg, var(--amber), transparent 82%);
}

.page-faq .fq-path__num {
  display: block;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: .16em;
  color: var(--cool);
}

.page-faq .fq-path__step h3 {
  margin: 10px 0 0;
  font-size: clamp(17px, 2vw, 20px);
  font-weight: 600;
  line-height: 1.45;
}

.page-faq .fq-path__step p {
  margin: 10px 0 20px;
  font-size: 14px;
  line-height: 1.85;
  color: rgba(244, 239, 228, .7);
}

.page-faq .fq-path__step .btn {
  align-self: flex-start;
}

.page-faq .fq-support {
  padding: clamp(34px, 5vw, 76px) 0;
  background: var(--paper);
  color: var(--fq-paper-ink);
}

.page-faq .fq-support__grid {
  display: grid;
  gap: clamp(24px, 3.4vw, 48px);
  align-items: start;
}

.page-faq .fq-support .eyebrow {
  margin: 0;
  color: var(--fq-paper-mute);
}

.page-faq .fq-support h2 {
  margin: 14px 0 0;
  font-size: clamp(26px, 3.6vw, 44px);
  line-height: 1.16;
  letter-spacing: -.01em;
  color: var(--fq-paper-ink);
}

.page-faq .fq-support__lead p {
  margin: 16px 0 24px;
  max-width: 44ch;
  font-size: 15px;
  line-height: 1.9;
  color: #3C4A56;
}

.page-faq .fq-support__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
}

.page-faq .fq-support__item {
  display: grid;
  gap: 5px;
  padding: 14px 0;
  border-bottom: 1px solid var(--paper-line);
}

.page-faq .fq-support__item:first-child {
  border-top: 1px solid var(--paper-line);
}

.page-faq .fq-support__label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--fq-paper-mute);
}

.page-faq .fq-support__value {
  font-size: 15px;
  line-height: 1.75;
  color: var(--fq-paper-ink);
  word-break: break-word;
}

.page-faq .fq-support__value--mono {
  font-family: var(--font-mono);
  font-weight: 600;
  letter-spacing: .01em;
}

.page-faq .fq-support__legal {
  grid-column: 1 / -1;
  margin: 4px 0 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--fq-paper-mute);
}

.page-faq .fq-support__legal a {
  color: var(--fq-paper-ink);
  text-decoration: none;
  border-bottom: 1px solid var(--paper-line);
  transition: border-color .2s var(--ease);
}

.page-faq .fq-support__legal a:hover,
.page-faq .fq-support__legal a:focus-visible {
  border-color: var(--fq-paper-ink);
}

.page-faq .fq-support__dot {
  color: var(--paper-line);
}

@media (min-width: 640px) {
  .page-faq .faq-hero__visual {
    aspect-ratio: 4 / 3;
  }

  .page-faq .faq-group__media {
    aspect-ratio: 5 / 2;
  }
}

@media (min-width: 900px) {
  .page-faq .faq-hero__grid {
    grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  }

  .page-faq .faq-hero__visual {
    aspect-ratio: 1 / 1;
    max-height: 470px;
  }

  .page-faq .fq-path__list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
  }

  .page-faq .fq-path__step {
    display: flex;
    flex-direction: column;
    border-left: 0;
  }

  .page-faq .fq-path__step:first-child {
    border-left: 1px solid var(--line);
  }

  .page-faq .fq-path__step + .fq-path__step {
    border-left: 0;
  }

  .page-faq .fq-support__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, .92fr);
  }
}

@media (min-width: 960px) {
  .page-faq .faq-body__grid {
    grid-template-columns: 250px minmax(0, 1fr);
    gap: clamp(28px, 4vw, 60px);
    align-items: start;
  }

  .page-faq .faq-rail {
    display: block;
    position: sticky;
    top: 28px;
  }

  .page-faq .faq-group {
    scroll-margin-top: 32px;
  }

  .page-faq .chip {
    padding: 7px 12px;
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-faq .faq-item__mark::before,
  .page-faq .faq-item__mark::after,
  .page-faq .chip,
  .page-faq .faq-rail__link {
    transition-duration: .01ms;
  }
}


<main id="main-content" class="page-faq">
  <section class="faq-hero">
    <div class="container">
      <nav class="crumbs" aria-label="面包屑导航">
        <a href="/">首页</a>
        <span class="crumbs__sep">/</span>
        <span aria-current="page">答疑中心</span>
      </nav>
      <div class="faq-hero__grid">
        <div class="faq-hero__lead">
          <p class="eyebrow">答疑中心 · 编号 01—06</p>
          <h1 class="display display--xl">按编号翻过去，问题落到具体那一条</h1>
          <p class="lede">比分为什么跳变、控球率怎么读、赛程临时改了怎么办、手机版上能查到什么、合作从哪一步开始，这些疑问在中欧体育主站分成六个编号分组。如果您正在挑选平台，第三组把赛事对比评测的做法和该看哪些维度放在了最前面。</p>
          <div class="faq-hero__actions">
            <a class="btn btn--accent" href="#fq-03">先看对比方法</a>
            <a class="btn btn--ghost" href="#fq-06">找对接人</a>
          </div>
        </div>
        <figure class="faq-hero__visual">
          <img src="{zhanqunpic:h:1000w:1000}" width="1000" height="1000" alt="编号刻度与切角面板构成的抽象信息图，电子青线条在深墨色背景上延伸">
          <figcaption class="faq-hero__data">
            <span class="faq-hero__data-label">分组索引</span>
            <span class="faq-hero__data-value num">01—06</span>
          </figcaption>
        </figure>
      </div>
    </div>
  </section>

  <nav class="faq-finder" aria-label="按分组快速定位">
    <div class="container faq-finder__list">
      <a class="chip" href="#fq-01"><span class="num">01</span>开始使用</a>
      <a class="chip" href="#fq-02"><span class="num">02</span>比分与控球率</a>
      <a class="chip chip--flag" href="#fq-03"><span class="num">03</span>对比评测</a>
      <a class="chip" href="#fq-04"><span class="num">04</span>场馆与版本</a>
      <a class="chip" href="#fq-05"><span class="num">05</span>手机版</a>
      <a class="chip" href="#fq-06"><span class="num">06</span>合作与支持</a>
    </div>
  </nav>

  <div class="faq-body">
    <div class="container faq-body__grid">
      <aside class="faq-rail" aria-label="编号目录">
        <p class="eyebrow">编号目录</p>
        <ol class="faq-rail__list">
          <li><a class="faq-rail__link" href="#fq-01"><span class="faq-rail__num num">01</span><span class="faq-rail__text">开始使用</span><span class="faq-rail__count">4 问</span></a></li>
          <li><a class="faq-rail__link" href="#fq-02"><span class="faq-rail__num num">02</span><span class="faq-rail__text">比分与控球率</span><span class="faq-rail__count">4 问</span></a></li>
          <li><a class="faq-rail__link faq-rail__link--flag" href="#fq-03"><span class="faq-rail__num num">03</span><span class="faq-rail__text">对比评测</span><span class="faq-rail__count">4 问</span></a></li>
          <li><a class="faq-rail__link" href="#fq-04"><span class="faq-rail__num num">04</span><span class="faq-rail__text">场馆与版本</span><span class="faq-rail__count">4 问</span></a></li>
          <li><a class="faq-rail__link" href="#fq-05"><span class="faq-rail__num num">05</span><span class="faq-rail__text">手机版</span><span class="faq-rail__count">3 问</span></a></li>
          <li><a class="faq-rail__link" href="#fq-06"><span class="faq-rail__num num">06</span><span class="faq-rail__text">合作与支持</span><span class="faq-rail__count">4 问</span></a></li>
        </ol>
        <p class="faq-rail__hint">第三组长期固定为对比评测与平台推荐，选型阶段可直接翻到 03。</p>
      </aside>

      <div class="faq-groups">
        <section class="faq-group" id="fq-01">
          <header class="faq-group__head">
            <span class="faq-group__num num">01</span>
            <h2 class="faq-group__title">第一次用，从哪儿进</h2>
            <p class="faq-group__note">打开页面第一分钟能做什么，以及复盘入口在哪里。</p>
          </header>
          <div class="faq-list">
            <details class="faq-item">
              <summary><span>首页打开后，第一眼能看到哪些入口？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>首屏左侧是赛后复盘的入口卡，点进去就是最近结束场次的完整复盘；右侧并排显示实时比分和控球率两条数据带。手机上两块内容改为上下排列，单手操作不用横向拖动。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>想回看已经结束的比赛，从哪儿进？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>从首屏的复盘入口进入，赛事按时间倒序排好，点开任意一场可以看到比分变化过程、控球率走势和关键节点说明。复盘内容和实时数据来自同一份赛事记录，前后翻看不会出现对不上的情况。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>没有安装任何应用，只用浏览器可以吗？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>可以。实时比分、控球率、赛后复盘和场馆信息在浏览器里都能直接打开。手机版针对小屏压缩了版面，首屏就能看到比分；篇幅较长的专题内容在手机上同样完整呈现。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>页面上的 01—06 编号起什么作用？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>编号是内容的归位方式。01 到 06 依次对应使用起点、比分数据、对比评测、场馆与版本、手机版、合作对接六类话题，看到编号就知道该往哪个方向找。收藏某个编号的链接，下次可以直接跳回那一组。</p></div>
            </details>
          </div>
        </section>

        <section class="faq-group" id="fq-02">
          <header class="faq-group__head">
            <span class="faq-group__num num">02</span>
            <h2 class="faq-group__title">比分和控球率怎么读</h2>
            <p class="faq-group__note">数字的更新节奏、读法，以及和别处不一致时的判断方式。</p>
          </header>
          <div class="faq-list">
            <details class="faq-item">
              <summary><span>实时比分多久刷新一次？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>数据按赛事序列分发，实时比分覆盖 42 个赛事序列，日均处理的赛事数据条目约 18,000 条。不同赛事的推送间隔略有差别，主流联赛基本能在比分变化后数秒内同步。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>控球率是怎么算的？读的时候要注意什么？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>控球率反映的是一段时间内双方掌握球权的时间占比，是一个滚动统计值。开场几分钟数值波动较大，随着比赛推进逐渐趋于稳定，看整条曲线的走向比盯住某一刻的数字更有参考价值。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>我在别处看到的比分和这里不一样，怎么判断？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>先确认两边看的是不是同一个赛事序列和同一时间段。补时、点球以及视频回放介入的判罚，会让比分在不同渠道出现先后差异，通常几分钟内会趋于一致。长期不一致的话，把页面地址和截图发给客服，可以帮您定位到具体场次。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>网络不稳定的时候，数据会卡住吗？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>弱网环境下比分数字会先更新，控球率等图形可能稍慢一步。数据条上会保留最后一次成功加载的时间和状态点，您可以据此判断眼前这组数据是不是最新的。</p></div>
            </details>
          </div>
        </section>

        <section class="faq-group faq-group--flag" id="fq-03">
          <p class="faq-group__flag">第三栏 · 固定分组</p>
          <figure class="faq-group__media">
            <img src="{zhanqunpic:h:800w:1200}" width="1200" height="800" alt="抽象对比矩阵与数据刻度图形，电子青线条交错排布在深色底纹上" loading="lazy" decoding="async">
          </figure>
          <header class="faq-group__head">
            <span class="faq-group__num num">03</span>
            <h2 class="faq-group__title">赛事对比评测与平台对比推荐</h2>
            <p class="faq-group__note">这一组长期固定在这里，选型前想先把方法看明白，从这里开始。</p>
          </header>

          <div class="fq-table-wrap">
            <table class="fq-table">
              <thead>
                <tr>
                  <th scope="col">对比维度</th>
                  <th scope="col">具体看什么</th>
                  <th scope="col">在哪儿看</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td>数据更新</td>
                  <td>比分层级变化后多久同步，赛程调整是否跟着更新</td>
                  <td>体验中心 · 实时数据</td>
                </tr>
                <tr>
                  <td>场馆信息完整度</td>
                  <td>场馆基础信息、所属赛区、可容纳规模是否写明</td>
                  <td>专题中心 · 场馆信息</td>
                </tr>
                <tr>
                  <td>移动端体验</td>
                  <td>手机首屏能否直接看到比分与控球率，翻页是否顺手</td>
                  <td>体验中心 · 手机版</td>
                </tr>
                <tr>
                  <td>赛程排布</td>
                  <td>一轮赛事的时间顺序与对阵关系是否一目了然</td>
                  <td>专题中心 · 赛程排布</td>
                </tr>
              </tbody>
            </table>
          </div>

          <div class="faq-list">
            <details class="faq-item" open>
              <summary><span>中欧体育赛事对比评测是怎么做出来的？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a">
                <p>每个参与对比的赛事场景会先拆成可以观察的条目：数据更新是否及时、场馆信息是否完整、移动端能不能一屏看完关键数据、赛程排布是否清楚、版本说明是否写明更新时间。列出条目后逐项记录实际情况，再整理成上面那张对照表。</p>
                <p>记录只写看到的内容，不打分也不排名。您按自己最在意的两三项去比，结论会更贴合实际需求。</p>
              </div>
            </details>
            <details class="faq-item">
              <summary><span>平台对比推荐都看哪些维度？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>目前整理出 36 个平台维度，常用的有数据更新频率、场馆信息完整度、移动端首屏信息量、赛程展示方式、版本说明的详细程度和客服响应路径。36 项不必全看，锁定两三项最关心的先比，效率更高。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>对比评测库里现在收了多少内容？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>赛事对比评测库累计整理 480 组对比条目，覆盖 26 类赛事场景，从常规联赛到锦标赛、杯赛都有对应条目。每条都标注了整理时间和所依据的页面版本，方便判断内容的新旧程度。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>我关心的赛事不在已有的 26 类场景里怎么办？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>把赛事名称和您想比对的具体方面发给客服，我们会评估是否纳入下一批整理。已有条目也可以当作参照模板，维度名称和记录方式基本一致，照着看就能大致判断新场景该怎么比。</p></div>
            </details>
          </div>
        </section>

        <section class="faq-group" id="fq-04">
          <header class="faq-group__head">
            <span class="faq-group__num num">04</span>
            <h2 class="faq-group__title">场馆信息与版本说明</h2>
            <p class="faq-group__note">场馆数据覆盖到哪里、版本日期怎么理解、赛程变动如何同步。</p>
          </header>
          <div class="faq-list">
            <details class="faq-item">
              <summary><span>场馆信息多久更新一次？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>场馆信息库收录 2,860 座场馆，覆盖 31 个省级行政区，版本说明更新至 2025 年 3 月。赛程排布、场馆基础信息与数据说明三部分会随赛事安排调整而修订，较大的调整会在专题中心单独说明。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>版本说明里的日期指的是什么？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>日期指的是这一版内容对外发布的时间。版本迭代已进入第 7 个大版本，保持每月一次小版本修订、每季度一次结构复核的节奏。只涉及措辞修正的小改动，不单独标注为结构变更。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>赛程时间调整后，场馆页面会跟着变吗？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>会。赛程排布和场馆页共用同一份赛程记录，改期、更换场地、临时加赛都会先更新记录，再反映到场馆页和复盘页。如果您刚看完场馆页就发现赛程变了，刷新一次即可看到最新排布。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>同一座场馆在两处信息不一致，以哪个为准？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>以专题中心最新一期版本说明为准。场馆页里的基础信息是摘要，完整条目和变更原因都写在版本说明中。两处出现差异，通常是因为其中一处还停留在上一版本。</p></div>
            </details>
          </div>
        </section>

        <section class="faq-group" id="fq-05">
          <header class="faq-group__head">
            <span class="faq-group__num num">05</span>
            <h2 class="faq-group__title">手机版怎么用</h2>
            <p class="faq-group__note">通勤路上单手查看时，最常被问到的几件事。</p>
          </header>
          <div class="faq-list">
            <details class="faq-item">
              <summary><span>中欧体育手机版服务清单里都有什么？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>手机版服务清单列出 12 项服务，包括实时比分、控球率、赛后复盘、场馆信息、赛程排布和对比评测入口等。清单按使用频次排序，比分数据排在最前，打开即可使用。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>手机上能看完一整场复盘吗？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>能。复盘内容按时间轴排布，手机端默认折叠成关键节点，点开任意节点展开细节。想快速过一遍只看节点标题，想细看再逐条展开，两种读法都支持。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>手机流量有限，怎么少加载一些？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>文本与数字优先加载，场馆图片和示意图形滚动到对应位置才补齐。只看比分和复盘这类以数据为主的内容时，实际耗用的流量很小。</p></div>
            </details>
          </div>
        </section>

        <section class="faq-group" id="fq-06">
          <header class="faq-group__head">
            <span class="faq-group__num num">06</span>
            <h2 class="faq-group__title">合作对接与反馈支持</h2>
            <p class="faq-group__note">场馆方与数据合作方怎么起步，问题反馈带什么最省时间。</p>
          </header>
          <div class="faq-list">
            <details class="faq-item">
              <summary><span>场馆方想接入，第一步做什么？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>把场馆名称、所在城市和希望同步的信息范围发到客服邮箱，我们会回一份信息登记表和版本说明样例。目前服务覆盖 120 家场馆与数据合作方，接入按登记、字段确认、试运行、正式发布四步推进。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>数据合作方对接前需要准备什么？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>准备数据源说明、更新频率、字段定义和一份近期样例数据即可。对接由编辑、数据标注、产品与客服共同跟进，数据团队共 68 人，会根据数据形态安排对接人和沟通节奏。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>反馈问题时带什么信息最有用？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>截图、页面地址和页面上的版本号。有了这三样，客服能直接对应到具体赛事序列和内容版本，省去来回确认。涉及比分差异的，请附上比赛名称和大概时间点。</p></div>
            </details>
            <details class="faq-item">
              <summary><span>多久能收到回复？</span><span class="faq-item__mark" aria-hidden="true"></span></summary>
              <div class="faq-item__a"><p>站点客服邮箱在工作日 9:00-18:00 内回复，一般咨询可以发到常规咨询邮箱。紧急的赛事数据问题，建议优先使用客服邮箱并附上截图。</p></div>
            </details>
          </div>
        </section>
      </div>
    </div>
  </div>

  <section class="fq-path" data-reveal>
    <div class="container">
      <p class="eyebrow">从对比到确认</p>
      <h2 class="display">三步走完一轮选型</h2>
      <ol class="fq-path__list">
        <li class="fq-path__step">
          <span class="fq-path__num num">01</span>
          <h3>先翻专题中心的版本说明</h3>
          <p>场馆基础信息、赛程排布与数据说明的最近一次更新都写在这里，先把事实拿到手。</p>
          <a class="btn btn--ghost" href="/topics/">打开专题中心</a>
        </li>
        <li class="fq-path__step">
          <span class="fq-path__num num">02</span>
          <h3>再到体验中心看实机演示</h3>
          <p>手机版服务清单、版本对比表和入口演示都在这一页，两个版本之间的差别一眼可见。</p>
          <a class="btn btn--ghost" href="/experience/">进入体验中心</a>
        </li>
        <li class="fq-path__step">
          <span class="fq-path__num num">03</span>
          <h3>回到这里看对比条目</h3>
          <p>拿着前两步掌握的信息，对照第三组里的维度与条目，选出真正适合自己的方案。</p>
          <a class="btn btn--accent" href="#fq-03">回到第三组</a>
        </li>
      </ol>
    </div>
  </section>

  <section class="fq-support" id="fq-support">
    <div class="container fq-support__grid">
      <div class="fq-support__lead">
        <p class="eyebrow">没找到答案</p>
        <h2 class="display">带上截图和版本号，客服能直接定位</h2>
        <p>赛事数据类咨询请附截图与页面版本号，场馆接入与数据合作请说明城市、范围与更新频率，收到后会安排对应同事跟进。工作日 9:00-18:00 内回复。</p>
        <a class="btn btn--accent" href="/contact-us/">查看全部联系方式</a>
      </div>
      <ul class="fq-support__list">
        <li class="fq-support__item">
          <span class="fq-support__label">站点客服</span>
          <span class="fq-support__value fq-support__value--mono">service@zhongou-cn-sports.com.cn</span>
        </li>
        <li class="fq-support__item">
          <span class="fq-support__label">一般咨询</span>
          <span class="fq-support__value fq-support__value--mono">info@zhongou-cn-sports.com.cn</span>
        </li>
        <li class="fq-support__item">
          <span class="fq-support__label">联系电话</span>
          <span class="fq-support__value fq-support__value--mono">15260980228</span>
        </li>
        <li class="fq-support__item">
          <span class="fq-support__label">运营地址</span>
          <span class="fq-support__value">浙江省杭州市滨江区江虹路1750号润和信雅达国际创意中心A座12层</span>
        </li>
        <li class="fq-support__item">
          <span class="fq-support__label">备案号</span>
          <span class="fq-support__value fq-support__value--mono">浙ICP备65728899号</span>
        </li>
      </ul>
      <p class="fq-support__legal">
        <a href="/privacy-policy/">隐私政策</a>
        <span class="fq-support__dot" aria-hidden="true">·</span>
        <a href="/legal/">法律声明</a>
      </p>
    </div>
  </section>
</main>
