.page-contact {
  --ct-panel: rgba(18, 53, 43, 0.4);
  --ct-panel-soft: rgba(18, 53, 43, 0.26);
  --ct-field: rgba(11, 18, 16, 0.58);
  padding-block: clamp(16px, 3vw, 30px) clamp(44px, 7vw, 88px);
}

.page-contact .ct-mono {
  font-family: var(--rb-font-num);
  font-variant-numeric: tabular-nums;
}

/* ---------- 面包屑 ---------- */
.page-contact .ct-crumb {
  margin-bottom: clamp(12px, 2vw, 20px);
}
.page-contact .ct-crumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 0.78rem;
  letter-spacing: 0.02em;
  color: var(--rb-slate);
}
.page-contact .ct-crumb li + li::before {
  content: "/";
  margin-right: 8px;
  color: var(--rb-line-strong);
}
.page-contact .ct-crumb a {
  color: var(--rb-slate);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.25s, border-color 0.25s;
}
.page-contact .ct-crumb a:hover {
  color: var(--rb-cyan);
  border-bottom-color: var(--rb-cyan);
}
.page-contact .ct-crumb [aria-current="page"] {
  color: var(--rb-white);
}

/* ---------- 首屏框景 ---------- */
.page-contact .ct-hero__frame {
  position: relative;
  overflow: hidden;
  padding: clamp(26px, 4.6vw, 54px) clamp(20px, 4vw, 56px);
  border: 1px solid var(--rb-line-strong);
  background: linear-gradient(152deg, rgba(31, 90, 69, 0.62) 0%, rgba(18, 53, 43, 0.9) 42%, var(--rb-night) 100%);
}
.page-contact .ct-hero__frame::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--rb-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--rb-grid) 1px, transparent 1px);
  background-size: 48px 48px;
  pointer-events: none;
}
.page-contact .ct-hero__frame > * {
  position: relative;
  z-index: 1;
}
.page-contact .ct-hero__tick {
  position: absolute;
  top: 0;
  width: 3px;
  height: clamp(58px, 9vw, 104px);
  z-index: 2;
}
.page-contact .ct-hero__tick--left {
  left: 0;
  background: var(--rb-red);
}
.page-contact .ct-hero__tick--right {
  right: 0;
  background: var(--rb-yellow);
}
.page-contact .ct-hero__title {
  margin: 12px 0 0;
  font-size: clamp(2rem, 6.2vw, 3.5rem);
  line-height: 1.05;
  letter-spacing: -0.02em;
  font-weight: 800;
  color: var(--rb-white);
}
.page-contact .ct-hero__lead {
  margin: clamp(14px, 2vw, 20px) 0 0;
  max-width: 64ch;
  font-size: clamp(0.95rem, 1.6vw, 1.04rem);
  line-height: 1.82;
  color: rgba(244, 247, 245, 0.78);
}

.page-contact .ct-signals {
  display: grid;
  gap: 1px;
  margin: clamp(22px, 3.2vw, 34px) 0 0;
  padding: 1px;
  list-style: none;
  background: var(--rb-line);
  border: 1px solid var(--rb-line);
}
.page-contact .ct-signals__item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 16px;
  background: rgba(11, 18, 16, 0.74);
}
.page-contact .ct-signals__k {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--rb-slate);
}
.page-contact .ct-signals__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: 0 0 auto;
}
.page-contact .ct-signals__dot--red {
  background: var(--rb-red);
}
.page-contact .ct-signals__dot--yellow {
  background: var(--rb-yellow);
}
.page-contact .ct-signals__dot--cyan {
  background: var(--rb-cyan);
}
.page-contact .ct-signals__v {
  font-size: 0.95rem;
  color: var(--rb-white);
  line-height: 1.5;
}

/* ---------- 联系方式卡 ---------- */
.page-contact .ct-channels {
  display: grid;
  gap: clamp(20px, 3vw, 34px);
}
.page-contact .ct-channels__col {
  min-width: 0;
}
.page-contact .ct-channels__side {
  display: flex;
  flex-direction: column;
  gap: clamp(14px, 2vw, 20px);
  min-width: 0;
}

.page-contact .ct-card {
  position: relative;
  margin-top: var(--rb-gap);
  padding: clamp(16px, 2.4vw, 22px);
  border: 1px solid var(--rb-line);
  background: var(--ct-panel);
  transition: background 0.3s, border-color 0.3s;
}
.page-contact .ct-card:hover {
  background: rgba(31, 90, 69, 0.46);
  border-color: var(--rb-line-strong);
}
.page-contact .ct-card--mail {
  border-left: 3px solid var(--rb-red);
}
.page-contact .ct-card--phone {
  border-left: 3px solid var(--rb-yellow);
}
.page-contact .ct-card--addr {
  border-left: 3px solid var(--rb-turf);
}
.page-contact .ct-card__head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.page-contact .ct-card__label {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rb-slate);
}
.page-contact .ct-card__value {
  margin: 12px 0 0;
  font-size: clamp(1rem, 2.4vw, 1.26rem);
  line-height: 1.45;
  color: var(--rb-white);
  word-break: break-all;
}
.page-contact .ct-card__value--text {
  font-size: clamp(0.96rem, 1.9vw, 1.06rem);
  line-height: 1.7;
  word-break: normal;
}
.page-contact .ct-card__value a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid var(--rb-line-strong);
  transition: color 0.25s, border-color 0.25s;
}
.page-contact .ct-card__value a:hover {
  color: var(--rb-cyan);
  border-bottom-color: var(--rb-cyan);
}
.page-contact .ct-card__desc {
  margin: 10px 0 0;
  max-width: 60ch;
  font-size: 0.9rem;
  line-height: 1.78;
  color: rgba(244, 247, 245, 0.7);
}
.page-contact .ct-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.page-contact .ct-desk-figure {
  margin: 0;
}
.page-contact .rb-media__img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}
.page-contact .ct-desk-note {
  padding: 16px 18px;
  border: 1px solid var(--rb-line);
  border-top: 3px solid var(--rb-cyan);
  background: var(--ct-panel-soft);
}
.page-contact .ct-desk-note__k {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rb-slate);
}
.page-contact .ct-desk-note__v {
  margin: 8px 0 0;
  font-family: var(--rb-font-num);
  font-size: 0.98rem;
  color: var(--rb-white);
}
.page-contact .ct-desk-note__sub {
  margin: 8px 0 0;
  font-size: 0.85rem;
  line-height: 1.7;
  color: rgba(244, 247, 245, 0.62);
}

/* ---------- 支持范围标签页 ---------- */
.page-contact .ct-scope__intro {
  margin: 12px 0 0;
  max-width: 68ch;
  font-size: 0.94rem;
  line-height: 1.8;
  color: rgba(244, 247, 245, 0.7);
}
.page-contact .ct-tabs {
  position: relative;
  margin-top: clamp(20px, 3vw, 30px);
}
.page-contact .ct-tabs__radio {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.page-contact .ct-tabs__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: clamp(14px, 2vw, 20px);
}
.page-contact .ct-tabs__label {
  display: inline-flex;
  align-items: center;
  padding: 10px 16px;
  cursor: pointer;
  border: 1px solid var(--rb-line);
  background: var(--ct-field);
  color: var(--rb-slate);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  transition: color 0.25s, border-color 0.25s, background 0.25s, box-shadow 0.25s;
}
.page-contact .ct-tabs__label:hover {
  color: var(--rb-white);
  border-color: var(--rb-line-strong);
}
.page-contact #ct-scope-sub:checked ~ .ct-tabs__nav [for="ct-scope-sub"],
.page-contact #ct-scope-entry:checked ~ .ct-tabs__nav [for="ct-scope-entry"],
.page-contact #ct-scope-card:checked ~ .ct-tabs__nav [for="ct-scope-card"],
.page-contact #ct-scope-small:checked ~ .ct-tabs__nav [for="ct-scope-small"] {
  color: var(--rb-white);
  background: var(--rb-turf);
  border-color: var(--rb-turf);
  box-shadow: inset 0 2px 0 var(--rb-red);
}

.page-contact .ct-tabs__panel {
  display: none;
  padding: clamp(18px, 3vw, 30px);
  border: 1px solid var(--rb-line);
  background: var(--ct-panel);
}
.page-contact #ct-scope-sub:checked ~ .ct-tabs__panels .ct-tabs__panel--sub,
.page-contact #ct-scope-entry:checked ~ .ct-tabs__panels .ct-tabs__panel--entry,
.page-contact #ct-scope-card:checked ~ .ct-tabs__panels .ct-tabs__panel--card,
.page-contact #ct-scope-small:checked ~ .ct-tabs__panels .ct-tabs__panel--small {
  display: block;
}
.page-contact .ct-tabs__panel-title {
  margin: 0;
  font-size: clamp(1.08rem, 2.4vw, 1.32rem);
  line-height: 1.4;
  font-weight: 700;
  color: var(--rb-white);
}
.page-contact .ct-tabs__panel p {
  margin: 12px 0 0;
  max-width: 70ch;
  font-size: 0.92rem;
  line-height: 1.82;
  color: rgba(244, 247, 245, 0.76);
}
.page-contact .ct-tabs__panel-link {
  margin-top: 16px !important;
}
.page-contact .ct-tabs__panel-link a {
  font-size: 0.88rem;
  color: var(--rb-cyan);
  text-decoration: none;
  border-bottom: 1px solid rgba(95, 211, 179, 0.42);
  transition: border-color 0.25s;
}
.page-contact .ct-tabs__panel-link a:hover {
  border-bottom-color: var(--rb-cyan);
}

.page-contact .ct-list {
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.page-contact .ct-list li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 0.9rem;
  line-height: 1.72;
  color: rgba(244, 247, 245, 0.78);
}
.page-contact .ct-list__dot {
  flex: 0 0 auto;
  width: 10px;
  height: 2px;
  margin-top: 12px;
}
.page-contact .ct-list__dot--red {
  background: var(--rb-red);
}
.page-contact .ct-list__dot--yellow {
  background: var(--rb-yellow);
}
.page-contact .ct-list__dot--cyan {
  background: var(--rb-cyan);
}

/* ---------- 邮件优先 ---------- */
.page-contact .ct-priority {
  position: relative;
  border: 1px solid var(--rb-line-strong);
  background: linear-gradient(120deg, rgba(226, 59, 46, 0.14) 0%, rgba(18, 53, 43, 0.62) 46%, var(--rb-night) 100%);
}
.page-contact .ct-priority__bar {
  height: 4px;
  background: linear-gradient(90deg, var(--rb-red) 0%, var(--rb-yellow) 52%, var(--rb-cyan) 100%);
}
.page-contact .ct-priority__body {
  padding: clamp(20px, 3.6vw, 42px);
}
.page-contact .ct-priority__lead {
  margin: 14px 0 0;
  max-width: 68ch;
  font-size: 0.96rem;
  line-height: 1.84;
  color: rgba(244, 247, 245, 0.78);
}
.page-contact .ct-priority__list {
  margin: clamp(16px, 2.4vw, 24px) 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.page-contact .ct-priority__list li {
  position: relative;
  padding-left: 22px;
  font-size: 0.91rem;
  line-height: 1.74;
  color: rgba(244, 247, 245, 0.8);
}
.page-contact .ct-priority__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 10px;
  height: 2px;
  background: var(--rb-yellow);
}
.page-contact .ct-priority__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: clamp(18px, 2.6vw, 26px);
}

/* ---------- 联系前准备清单 ---------- */
.page-contact .ct-check {
  display: grid;
  gap: 10px;
  margin: clamp(18px, 2.6vw, 26px) 0 0;
  padding: 0;
  list-style: none;
}
.page-contact .ct-check__item {
  min-width: 0;
}
.page-contact .ct-check__input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.page-contact .ct-check__label {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  cursor: pointer;
  border: 1px solid var(--rb-line);
  background: var(--ct-field);
  transition: border-color 0.25s, background 0.25s;
}
.page-contact .ct-check__label:hover {
  border-color: var(--rb-line-strong);
}
.page-contact .ct-check__box {
  position: relative;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  border: 1px solid var(--rb-line-strong);
  transition: border-color 0.2s, background 0.2s;
}
.page-contact .ct-check__box::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 6px;
  height: 11px;
  border-right: 2px solid var(--rb-night);
  border-bottom: 2px solid var(--rb-night);
  transform: rotate(45deg) scale(0);
  transition: transform 0.18s var(--rb-ease);
}
.page-contact .ct-check__input:checked + .ct-check__label {
  border-color: var(--rb-cyan);
  background: rgba(95, 211, 179, 0.08);
}
.page-contact .ct-check__input:checked + .ct-check__label .ct-check__box {
  background: var(--rb-cyan);
  border-color: var(--rb-cyan);
}
.page-contact .ct-check__input:checked + .ct-check__label .ct-check__box::after {
  transform: rotate(45deg) scale(1);
}
.page-contact .ct-check__input:focus-visible + .ct-check__label {
  outline: 2px solid var(--rb-cyan);
  outline-offset: 2px;
}
.page-contact .ct-check__text {
  font-size: 0.9rem;
  line-height: 1.72;
  color: rgba(244, 247, 245, 0.76);
}
.page-contact .ct-check__text strong {
  display: inline-block;
  margin-right: 6px;
  color: var(--rb-white);
  font-weight: 700;
}

/* ---------- 回复节奏表格 ---------- */
.page-contact .ct-table-wrap {
  margin-top: clamp(18px, 2.6vw, 26px);
  overflow-x: auto;
  border: 1px solid var(--rb-line);
  background: var(--ct-panel-soft);
}
.page-contact .ct-table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
}
.page-contact .ct-table th,
.page-contact .ct-table td {
  padding: 14px 16px;
  text-align: left;
  vertical-align: top;
  font-size: 0.89rem;
  line-height: 1.68;
  border-bottom: 1px solid var(--rb-line);
}
.page-contact .ct-table thead th {
  background: var(--rb-turf);
  color: var(--rb-white);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--rb-line-strong);
  white-space: nowrap;
}
.page-contact .ct-table tbody th {
  font-weight: 700;
  color: var(--rb-white);
  white-space: nowrap;
}
.page-contact .ct-table tbody td {
  color: rgba(244, 247, 245, 0.76);
}
.page-contact .ct-table tbody tr:nth-child(even) {
  background: rgba(18, 53, 43, 0.3);
}
.page-contact .ct-table tbody tr:hover {
  background: rgba(31, 90, 69, 0.42);
}
.page-contact .ct-table tbody tr:last-child th,
.page-contact .ct-table tbody tr:last-child td {
  border-bottom: none;
}
.page-contact .ct-table__sub {
  display: inline-block;
  margin-top: 4px;
  font-size: 0.78rem;
  font-weight: 400;
  color: var(--rb-slate);
}
.page-contact .ct-rhythm__note {
  margin: 16px 0 0;
  padding-left: 14px;
  border-left: 3px solid var(--rb-yellow);
  font-size: 0.88rem;
  line-height: 1.78;
  color: rgba(244, 247, 245, 0.68);
  max-width: 70ch;
}

/* ---------- 地址说明 ---------- */
.page-contact .ct-address {
  display: grid;
  gap: clamp(20px, 3vw, 34px);
}
.page-contact .ct-address__body {
  min-width: 0;
}
.page-contact .ct-address__body > p {
  margin: 14px 0 0;
  max-width: 66ch;
  font-size: 0.93rem;
  line-height: 1.82;
  color: rgba(244, 247, 245, 0.76);
}
.page-contact .ct-address__list {
  margin: clamp(18px, 2.6vw, 26px) 0 0;
  padding: 0;
  border-top: 1px solid var(--rb-line);
}
.page-contact .ct-address__row {
  display: grid;
  gap: 4px;
  padding: 14px 0;
  border-bottom: 1px solid var(--rb-line);
}
.page-contact .ct-address__row dt {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rb-slate);
}
.page-contact .ct-address__row dd {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.74;
  color: var(--rb-white);
}
.page-contact .ct-address__foot {
  margin: 18px 0 0 !important;
  padding: 14px 16px;
  border: 1px solid var(--rb-line);
  background: var(--ct-panel-soft);
  font-size: 0.88rem !important;
  color: rgba(244, 247, 245, 0.7) !important;
}
.page-contact .ct-address__media {
  margin: 0;
  align-self: start;
}

/* ---------- 响应式 ---------- */
@media (min-width: 640px) {
  .page-contact .ct-signals {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-contact .ct-check {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page-contact .ct-address__row {
    grid-template-columns: 132px minmax(0, 1fr);
    align-items: baseline;
    gap: 12px;
  }
}

@media (min-width: 960px) {
  .page-contact .ct-channels {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.85fr);
    align-items: start;
  }
  .page-contact .ct-address {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    align-items: start;
  }
  .page-contact .ct-priority__body {
    padding: clamp(28px, 3.4vw, 44px) clamp(30px, 4vw, 52px);
  }
}

@media (min-width: 1200px) {
  .page-contact .ct-hero__frame {
    padding-inline: clamp(48px, 5vw, 68px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-contact .ct-card,
  .page-contact .ct-tabs__label,
  .page-contact .ct-check__label,
  .page-contact .ct-check__box,
  .page-contact .ct-check__box::after,
  .page-contact .ct-crumb a,
  .page-contact .ct-card__value a {
    transition: none;
  }
}
<<<END>>>

等等，最后不应该有 `<<<END>>>`。我再确认一下——要求说标记只能出现一次，按这个顺序：`` 然后是 ``。不应该有结束标记。我来删掉它。

其实我刚写了 `<<<END>>>`——那是个错误。把它删掉。

让我输出最终的干净版本。
<main id="main-content" class="rb-container page-contact">

  <header class="ct-hero" data-reveal="1">
    <nav class="ct-crumb" aria-label="页面路径">
      <ol>
        <li><a href="/">赛场首页</a></li>
        <li aria-current="page">联系入口</li>
      </ol>
    </nav>

    <div class="ct-hero__frame">
      <span class="ct-hero__tick ct-hero__tick--left" aria-hidden="true"></span>
      <span class="ct-hero__tick ct-hero__tick--right" aria-hidden="true"></span>

      <p class="rb-eyebrow">CONTACT DESK · 联系入口</p>

      <h1 class="ct-hero__title">联系日搏体育赛场</h1>

      <p class="ct-hero__lead">
        订阅球队碰到入口迁移、小屏打不开，或者赛后想核对某一场的红黄牌记录，都可以直接找我们。
        客服邮箱优先接收赛事订阅与入口变更问题，服务电话在工作日接听，每一项都会落到具体处理人手上。
      </p>

      <ul class="ct-signals">
        <li class="ct-signals__item">
          <span class="ct-signals__k"><span class="ct-signals__dot ct-signals__dot--cyan" aria-hidden="true"></span>客服邮箱</span>
          <span class="ct-signals__v">工作日 24 小时内回复</span>
        </li>
        <li class="ct-signals__item">
          <span class="ct-signals__k"><span class="ct-signals__dot ct-signals__dot--yellow" aria-hidden="true"></span>服务电话</span>
          <span class="ct-signals__v">工作日接听</span>
        </li>
        <li class="ct-signals__item">
          <span class="ct-signals__k"><span class="ct-signals__dot ct-signals__dot--red" aria-hidden="true"></span>入口变更</span>
          <span class="ct-signals__v">邮件优先处理</span>
        </li>
      </ul>
    </div>
  </header>

  <section class="rb-section" aria-labelledby="ct-channels-title">
    <div class="ct-channels">
      <div class="ct-channels__col">
        <p class="rb-eyebrow">DIRECT CHANNELS</p>
        <h2 class="rb-title" id="ct-channels-title">三条能直接找到我们的通道</h2>

        <article class="ct-card ct-card--mail">
          <div class="ct-card__head">
            <span class="rb-tag rb-tag--red">优先</span>
            <span class="ct-card__label">客服邮箱</span>
          </div>
          <p class="ct-card__value ct-mono" data-copy-value>support@sun-ribo.com.cn</p>
          <p class="ct-card__desc">
            订阅确认、入口变更指引、红黄牌记录异常反馈都走这里。邮件里写清球队和问题，处理人可以直接对上号。
          </p>
          <div class="ct-card__actions">
            <button type="button" class="rb-btn rb-btn--red" data-copy>复制邮箱</button>
            <a class="rb-btn rb-btn--ghost" href="/troubleshooting/">先看排查说明</a>
          </div>
        </article>

        <article class="ct-card ct-card--phone">
          <div class="ct-card__head">
            <span class="rb-tag rb-tag--yellow">工作日</span>
            <span class="ct-card__label">服务电话</span>
          </div>
          <p class="ct-card__value ct-mono"><a href="tel:40056676485">400-5667-6485</a></p>
          <p class="ct-card__desc">
            适合确认入口该从哪进、订阅步骤走到哪一步这类当场能说清的问题。涉及记录内容调整，仍建议转邮件处理。
          </p>
        </article>

        <article class="ct-card ct-card--addr">
          <div class="ct-card__head">
            <span class="rb-tag rb-tag--cyan">基地</span>
            <span class="ct-card__label">数据服务基地</span>
          </div>
          <p class="ct-card__value ct-card__value--text">海南省海口市龙华区滨海大道105号日搏体育数据服务基地3层</p>
          <p class="ct-card__desc">
            赛事数据的录入、红黄牌核对与对照表生成在这里完成。来访请提前通过邮件约定，我们好安排对接人。
          </p>
        </article>
      </div>

      <aside class="ct-channels__side" data-reveal="2">
        <figure class="rb-media rb-media--4x3 ct-desk-figure">
          <img class="rb-media__img" src="{zhanqunpic:h:600w:900}" width="900" height="600" alt="服务台显示器上并排打开邮件界面与赛程表，冷白灯光落在键盘和记录本上，画面中没有人物正脸">
          <figcaption class="rb-media__cap">赛后问题进到工作台后，先按订阅、入口、记录三类分派处理人。</figcaption>
        </figure>

        <div class="ct-desk-note">
          <p class="ct-desk-note__k">当前排班</p>
          <p class="ct-desk-note__v">工作日 09:00–18:00 有值班处理人</p>
          <p class="ct-desk-note__sub">非工作日收到的邮件，会在下一个工作日开始处理。</p>
        </div>
      </aside>
    </div>
  </section>

  <section class="rb-section" aria-labelledby="ct-scope-title">
    <p class="rb-eyebrow">SUPPORT SCOPE</p>
    <h2 class="rb-title" id="ct-scope-title">四类问题，各走各的处理方式</h2>
    <p class="ct-scope__intro">
      选对分类能省一轮来回。点开下面每一类，可以看到我们一般会问什么、多久给出结果。
    </p>

    <div class="ct-tabs">
      <input class="ct-tabs__radio" type="radio" name="ct-scope" id="ct-scope-sub" checked>
      <input class="ct-tabs__radio" type="radio" name="ct-scope" id="ct-scope-entry">
      <input class="ct-tabs__radio" type="radio" name="ct-scope" id="ct-scope-card">
      <input class="ct-tabs__radio" type="radio" name="ct-scope" id="ct-scope-small">

      <div class="ct-tabs__nav">
        <label class="ct-tabs__label" for="ct-scope-sub">赛事订阅</label>
        <label class="ct-tabs__label" for="ct-scope-entry">入口变更</label>
        <label class="ct-tabs__label" for="ct-scope-card">红黄牌记录</label>
        <label class="ct-tabs__label" for="ct-scope-small">小屏问题</label>
      </div>

      <div class="ct-tabs__panels">
        <article class="ct-tabs__panel ct-tabs__panel--sub">
          <h3 class="ct-tabs__panel-title">订阅球队的日常对接</h3>
          <p>
            新增订阅、更换对接人、调整通知偏好，都可以通过客服邮箱提出。邮件里带上球队全称和当初订阅时用的邮箱，
            我们核对后直接改设置，不必重新走一遍订阅流程。
          </p>
          <ul class="ct-list">
            <li><span class="ct-list__dot ct-list__dot--yellow" aria-hidden="true"></span>开赛提醒：按轮次提前推送，可指定接收邮箱</li>
            <li><span class="ct-list__dot ct-list__dot--yellow" aria-hidden="true"></span>轮次归档：赛季结束后可索取该队参与轮次的汇总</li>
            <li><span class="ct-list__dot ct-list__dot--yellow" aria-hidden="true"></span>红黄牌变动提示：某队球员累计牌数变化时单独提醒</li>
          </ul>
        </article>

        <article class="ct-tabs__panel ct-tabs__panel--entry">
          <h3 class="ct-tabs__panel-title">CN 赛事订阅入口变更</h3>
          <p>
            旧的订阅入口正在逐步迁移到新的订阅页。已经订阅的球队可以先收藏新入口，并留意官方公告里公布的迁移节奏，
            避免开赛前临时找路径。
          </p>
          <ul class="ct-list">
            <li><span class="ct-list__dot ct-list__dot--red" aria-hidden="true"></span>找不到入口：把原入口截图发到客服邮箱，我们给出对应的查找路径</li>
            <li><span class="ct-list__dot ct-list__dot--red" aria-hidden="true"></span>迁移期内：旧入口查询指引保留在问题排查栏目，可按提示逐步对照</li>
            <li><span class="ct-list__dot ct-list__dot--red" aria-hidden="true"></span>入口公告：订阅页与文章栏目会同步更新变更说明</li>
          </ul>
          <p class="ct-tabs__panel-link"><a href="/experience/">前往体验中心查看当季赛事专区入口</a></p>
        </article>

        <article class="ct-tabs__panel ct-tabs__panel--card">
          <h3 class="ct-tabs__panel-title">红黄牌记录与对照数据</h3>
          <p>
            当季赛事专区按轮次归档，红黄牌与赛果可以并列查看。如果某一场的牌数或者关键事件时间线看着对不上，
            把轮次、对阵双方和截图一起发过来，我们会回到该轮的原始记录里重新比对，再把结论回给你。
          </p>
          <ul class="ct-list">
            <li><span class="ct-list__dot ct-list__dot--red" aria-hidden="true"></span>需要提供：轮次编号、对阵双方、看到异常的页面截图</li>
            <li><span class="ct-list__dot ct-list__dot--red" aria-hidden="true"></span>处理方式：回查赛果录入与红黄牌核对两个环节，确认后同步修正</li>
            <li><span class="ct-list__dot ct-list__dot--red" aria-hidden="true"></span>关联阅读：数据方法类文章会说明记录整理的做法</li>
          </ul>
          <p class="ct-tabs__panel-link"><a href="/articles/">查看数据方法与赛季复盘文章</a></p>
        </article>

        <article class="ct-tabs__panel ct-tabs__panel--small">
          <h3 class="ct-tabs__panel-title">小屏打开异常</h3>
          <p>
            移动端 3.2 版完成了小屏适配优化，赛事栏目已经恢复红黄牌记录与对照数据，轮次数字锚点导航和红黄牌色块筛选
            也一并上了小屏。如果打开后仍然空白、排版错位或者按钮点不动，请附上设备型号、系统版本和访问路径。
          </p>
          <ul class="ct-list">
            <li><span class="ct-list__dot ct-list__dot--cyan" aria-hidden="true"></span>先自查：确认页面已更新到 3.2 版，再重新打开一次</li>
            <li><span class="ct-list__dot ct-list__dot--cyan" aria-hidden="true"></span>仍异常：截图设备信息页与出错页面，一并发给客服邮箱</li>
            <li><span class="ct-list__dot ct-list__dot--cyan" aria-hidden="true"></span>低带宽环境：页面加载优先保障小屏与弱网浏览</li>
          </ul>
          <p class="ct-tabs__panel-link"><a href="/troubleshooting/">查看小屏问题排查步骤</a></p>
        </article>
      </div>
    </div>
  </section>

  <section class="rb-section" aria-labelledby="ct-priority-title" data-reveal="2">
    <div class="ct-priority">
      <div class="ct-priority__bar" aria-hidden="true"></div>
      <div class="ct-priority__body">
        <p class="rb-eyebrow">MAIL FIRST</p>
        <h2 class="rb-title" id="ct-priority-title">订阅和入口的事，发邮件比打电话更快出结果</h2>
        <p class="ct-priority__lead">
          这两类问题往往要回查订阅记录、比对入口配置，电话里说不清也带不走。写封邮件把信息一次给全，
          处理人能在工作日 24 小时内给出可执行的答复，你也能留档备查。
        </p>
        <ul class="ct-priority__list">
          <li>邮件正文带上球队全称、订阅邮箱和遇到的具体环节</li>
          <li>需要判断入口的，直接贴原入口截图比描述更省时间</li>
          <li>同样的问题不要再分别发邮件和打电话，避免两人重复处理</li>
          <li>答复里如果给了操作步骤，照做后再回复一次结果，我们就能结单</li>
        </ul>
        <div class="ct-priority__actions">
          <a class="rb-btn rb-btn--yellow" href="#ct-channels-title">回到联系通道</a>
          <a class="rb-btn rb-btn--ghost" href="/brand/">了解我们的复盘路径</a>
        </div>
      </div>
    </div>
  </section>

  <section class="rb-section" aria-labelledby="ct-prepare-title">
    <p class="rb-eyebrow">BEFORE YOU WRITE</p>
    <h2 class="rb-title" id="ct-prepare-title">发信前顺手勾一遍，来回能少一轮</h2>
    <p class="ct-scope__intro">
      下面几项是我们最常回头追问的信息。先备齐再发，大部分问题一轮就能解决。
    </p>

    <ul class="ct-check">
      <li class="ct-check__item">
        <input class="ct-check__input" type="checkbox" id="ct-prep-1">
        <label class="ct-check__label" for="ct-prep-1">
          <span class="ct-check__box" aria-hidden="true"></span>
          <span class="ct-check__text"><strong>设备型号</strong>手机或平板的品牌与型号，小屏机型请特别注明。</span>
        </label>
      </li>
      <li class="ct-check__item">
        <input class="ct-check__input" type="checkbox" id="ct-prep-2">
        <label class="ct-check__label" for="ct-prep-2">
          <span class="ct-check__box" aria-hidden="true"></span>
          <span class="ct-check__text"><strong>版本号</strong>确认当前是 3.2 版，版本号在页面底部可以查到。</span>
        </label>
      </li>
      <li class="ct-check__item">
        <input class="ct-check__input" type="checkbox" id="ct-prep-3">
        <label class="ct-check__label" for="ct-prep-3">
          <span class="ct-check__box" aria-hidden="true"></span>
          <span class="ct-check__text"><strong>订阅球队</strong>球队全称，以及当初订阅时登记的那个邮箱。</span>
        </label>
      </li>
      <li class="ct-check__item">
        <input class="ct-check__input" type="checkbox" id="ct-prep-4">
        <label class="ct-check__label" for="ct-prep-4">
          <span class="ct-check__box" aria-hidden="true"></span>
          <span class="ct-check__text"><strong>问题截图</strong>出错页面截图，涉及入口的再附一张原入口截图。</span>
        </label>
      </li>
      <li class="ct-check__item">
        <input class="ct-check__input" type="checkbox" id="ct-prep-5">
        <label class="ct-check__label" for="ct-prep-5">
          <span class="ct-check__box" aria-hidden="true"></span>
          <span class="ct-check__text"><strong>轮次与对阵</strong>涉及红黄牌记录时，写清轮次编号和对阵双方。</span>
        </label>
      </li>
      <li class="ct-check__item">
        <input class="ct-check__input" type="checkbox" id="ct-prep-6">
        <label class="ct-check__label" for="ct-prep-6">
          <span class="ct-check__box" aria-hidden="true"></span>
          <span class="ct-check__text"><strong>期望结果</strong>想让改成什么样、什么时候前要，写一句就够。</span>
        </label>
      </li>
    </ul>
  </section>

  <section class="rb-section" aria-labelledby="ct-rhythm-title">
    <p class="rb-eyebrow">RESPONSE RHYTHM</p>
    <h2 class="rb-title" id="ct-rhythm-title">渠道、适用问题和回复节奏</h2>

    <div class="ct-table-wrap">
      <table class="ct-table">
        <caption class="rb-visually-hidden">各联系渠道适用的赛事问题类型与回复节奏对照</caption>
        <thead>
          <tr>
            <th scope="col">渠道</th>
            <th scope="col">适合处理的问题</th>
            <th scope="col">回复节奏</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <th scope="row">客服邮箱<br><span class="ct-table__sub ct-mono">support@sun-ribo.com.cn</span></th>
            <td>赛事订阅调整、入口变更指引、红黄牌记录复核、小屏异常反馈</td>
            <td>工作日 24 小时内回复</td>
          </tr>
          <tr>
            <th scope="row">服务电话<br><span class="ct-table__sub ct-mono">400-5667-6485</span></th>
            <td>入口该从哪进、订阅步骤走到哪一步、栏目位置确认</td>
            <td>工作日接听</td>
          </tr>
          <tr>
            <th scope="row">官方公告与文章栏目</th>
            <td>版本更新说明、赛季复盘方法、订阅入口迁移节奏</td>
            <td>持续更新，无需等待回复</td>
          </tr>
          <tr>
            <th scope="row">问题排查栏目</th>
            <td>小屏打不开、红黄牌记录恢复、赛程排布查看等自助操作</td>
            <td>随时可查，七类帮助主题</td>
          </tr>
        </tbody>
      </table>
    </div>

    <p class="ct-rhythm__note">
      涉及红黄牌记录复核的问题，因为要回查原始记录，回复时间可能顺延到第二个工作日。我们会先回一封确认邮件告诉你进度。
    </p>
  </section>

  <section class="rb-section" aria-labelledby="ct-address-title">
    <div class="ct-address">
      <div class="ct-address__body">
        <p class="rb-eyebrow">DATA BASE</p>
        <h2 class="rb-title" id="ct-address-title">赛事数据在海口整理</h2>
        <p>
          赛事数据的录入、红黄牌核对、对照表生成和异常复核都在海口的日搏体育数据服务基地完成。
          每赛季约 1200 场赛事的牌数与对照数据，从这里进入当季赛事专区。
        </p>

        <dl class="ct-address__list">
          <div class="ct-address__row">
            <dt>地址</dt>
            <dd>海南省海口市龙华区滨海大道105号日搏体育数据服务基地3层</dd>
          </div>
          <div class="ct-address__row">
            <dt>来访方式</dt>
            <dd>请先通过客服邮箱约定时间，我们安排对接人接待</dd>
          </div>
          <div class="ct-address__row">
            <dt>协作范围</dt>
            <dd>与 46 个城市业余联赛、28 家青训中心保持内容协作</dd>
          </div>
        </dl>

        <p class="ct-address__foot">
          日常工作请优先使用客服邮箱，邮件能留下完整的问题记录，处理起来更稳。
        </p>
      </div>

      <figure class="rb-media rb-media--4x3 ct-address__media" data-reveal="2">
        <img class="rb-media__img" src="{zhanqunpic:h:700w:1000}" width="1000" height="700" alt="现代数据服务基地建筑外观局部，深墨绿与青灰色调，画面中不出现可识别门牌与真实人物" loading="lazy" decoding="async">
        <figcaption class="rb-media__cap">赛事记录在这里完成录入、核对与归档，再发布到当季赛事专区。</figcaption>
      </figure>
    </div>
  </section>

</main>

.page-contact {
  --ct-panel: rgba(18, 53, 43, 0.4);
  --ct-panel-soft: rgba(18, 53, 43, 0.26);
  --ct-field: rgba(11, 18, 16, 0.58);
  padding-block: clamp(16px, 3vw, 30px) clamp(44px, 7vw, 88px);
}

.page-contact .ct-mono {
  font-family: var(--rb-font-num);
  font-variant-numeric: tabular-nums;
}

/* ---------- 面包屑 ---------- */
.page-contact .ct-crumb {
  margin-bottom: clamp(12px, 2vw, 20px);
}
.page-contact .ct-crumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 0.78rem;
  letter-spacing: 0.02em;
  color: var(--rb-slate);
}
.page-contact .ct-crumb li + li::before {
  content: "/";
  margin-right: 8px;
  color: var(--rb-line-strong);
}
.page-contact .ct-crumb a {
  color: var(--rb-slate);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.25s, border-color 0.25s;
}
.page-contact .ct-crumb a:hover {
  color: var(--rb-cyan);
  border-bottom-color: var(--rb-cyan);
}
.page-contact .ct-crumb [aria-current="page"] {
  color: var(--rb-white);
}

/* ---------- 首屏框景 ---------- */
.page-contact .ct-hero__frame {
  position: relative;
  overflow: hidden;
  padding: clamp(26px, 4.6vw, 54px) clamp(20px, 4vw, 56px);
  border: 1px solid var(--rb-line-strong);
  background: linear-gradient(152deg, rgba(31, 90, 69, 0.62) 0%, rgba(18, 53, 43, 0.9) 42%, var(--rb-night) 100%);
}
.page-contact .ct-hero__frame::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--rb-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--rb-grid) 1px, transparent 1px);
  background-size: 48px 48px;
  pointer-events: none;
}
.page-contact .ct-hero__frame > * {
  position: relative;
  z-index: 1;
}
.page-contact .ct-hero__tick {
  position: absolute;
  top: 0;
  width: 3px;
  height: clamp(58px, 9vw, 104px);
  z-index: 2;
}
.page-contact .ct-hero__tick--left {
  left: 0;
  background: var(--rb-red);
}
.page-contact .ct-hero__tick--right {
  right: 0;
  background: var(--rb-yellow);
}
.page-contact .ct-hero__title {
  margin: 12px 0 0;
  font-size: clamp(2rem, 6.2vw, 3.5rem);
  line-height: 1.05;
  letter-spacing: -0.02em;
  font-weight: 800;
  color: var(--rb-white);
}
.page-contact .ct-hero__lead {
  margin: clamp(14px, 2vw, 20px) 0 0;
  max-width: 64ch;
  font-size: clamp(0.95rem, 1.6vw, 1.04rem);
  line-height: 1.82;
  color: rgba(244, 247, 245, 0.78);
}

.page-contact .ct-signals {
  display: grid;
  gap: 1px;
  margin: clamp(22px, 3.2vw, 34px) 0 0;
  padding: 1px;
  list-style: none;
  background: var(--rb-line);
  border: 1px solid var(--rb-line);
}
.page-contact .ct-signals__item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 16px;
  background: rgba(11, 18, 16, 0.74);
}
.page-contact .ct-signals__k {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--rb-slate);
}
.page-contact .ct-signals__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: 0 0 auto;
}
.page-contact .ct-signals__dot--red {
  background: var(--rb-red);
}
.page-contact .ct-signals__dot--yellow {
  background: var(--rb-yellow);
}
.page-contact .ct-signals__dot--cyan {
  background: var(--rb-cyan);
}
.page-contact .ct-signals__v {
  font-size: 0.95rem;
  color: var(--rb-white);
  line-height: 1.5;
}

/* ---------- 联系方式卡 ---------- */
.page-contact .ct-channels {
  display: grid;
  gap: clamp(20px, 3vw, 34px);
}
.page-contact .ct-channels__col {
  min-width: 0;
}
.page-contact .ct-channels__side {
  display: flex;
  flex-direction: column;
  gap: clamp(14px, 2vw, 20px);
  min-width: 0;
}

.page-contact .ct-card {
  position: relative;
  margin-top: var(--rb-gap);
  padding: clamp(16px, 2.4vw, 22px);
  border: 1px solid var(--rb-line);
  background: var(--ct-panel);
  transition: background 0.3s, border-color 0.3s;
}
.page-contact .ct-card:hover {
  background: rgba(31, 90, 69, 0.46);
  border-color: var(--rb-line-strong);
}
.page-contact .ct-card--mail {
  border-left: 3px solid var(--rb-red);
}
.page-contact .ct-card--phone {
  border-left: 3px solid var(--rb-yellow);
}
.page-contact .ct-card--addr {
  border-left: 3px solid var(--rb-turf);
}
.page-contact .ct-card__head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.page-contact .ct-card__label {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rb-slate);
}
.page-contact .ct-card__value {
  margin: 12px 0 0;
  font-size: clamp(1rem, 2.4vw, 1.26rem);
  line-height: 1.45;
  color: var(--rb-white);
  word-break: break-all;
}
.page-contact .ct-card__value--text {
  font-size: clamp(0.96rem, 1.9vw, 1.06rem);
  line-height: 1.7;
  word-break: normal;
}
.page-contact .ct-card__value a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid var(--rb-line-strong);
  transition: color 0.25s, border-color 0.25s;
}
.page-contact .ct-card__value a:hover {
  color: var(--rb-cyan);
  border-bottom-color: var(--rb-cyan);
}
.page-contact .ct-card__desc {
  margin: 10px 0 0;
  max-width: 60ch;
  font-size: 0.9rem;
  line-height: 1.78;
  color: rgba(244, 247, 245, 0.7);
}
.page-contact .ct-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.page-contact .ct-desk-figure {
  margin: 0;
}
.page-contact .rb-media__img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}
.page-contact .ct-desk-note {
  padding: 16px 18px;
  border: 1px solid var(--rb-line);
  border-top: 3px solid var(--rb-cyan);
  background: var(--ct-panel-soft);
}
.page-contact .ct-desk-note__k {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rb-slate);
}
.page-contact .ct-desk-note__v {
  margin: 8px 0 0;
  font-family: var(--rb-font-num);
  font-size: 0.98rem;
  color: var(--rb-white);
}
.page-contact .ct-desk-note__sub {
  margin: 8px 0 0;
  font-size: 0.85rem;
  line-height: 1.7;
  color: rgba(244, 247, 245, 0.62);
}

/* ---------- 支持范围标签页 ---------- */
.page-contact .ct-scope__intro {
  margin: 12px 0 0;
  max-width: 68ch;
  font-size: 0.94rem;
  line-height: 1.8;
  color: rgba(244, 247, 245, 0.7);
}
.page-contact .ct-tabs {
  position: relative;
  margin-top: clamp(20px, 3vw, 30px);
}
.page-contact .ct-tabs__radio {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.page-contact .ct-tabs__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: clamp(14px, 2vw, 20px);
}
.page-contact .ct-tabs__label {
  display: inline-flex;
  align-items: center;
  padding: 10px 16px;
  cursor: pointer;
  border: 1px solid var(--rb-line);
  background: var(--ct-field);
  color: var(--rb-slate);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  transition: color 0.25s, border-color 0.25s, background 0.25s, box-shadow 0.25s;
}
.page-contact .ct-tabs__label:hover {
  color: var(--rb-white);
  border-color: var(--rb-line-strong);
}
.page-contact #ct-scope-sub:checked ~ .ct-tabs__nav [for="ct-scope-sub"],
.page-contact #ct-scope-entry:checked ~ .ct-tabs__nav [for="ct-scope-entry"],
.page-contact #ct-scope-card:checked ~ .ct-tabs__nav [for="ct-scope-card"],
.page-contact #ct-scope-small:checked ~ .ct-tabs__nav [for="ct-scope-small"] {
  color: var(--rb-white);
  background: var(--rb-turf);
  border-color: var(--rb-turf);
  box-shadow: inset 0 2px 0 var(--rb-red);
}

.page-contact .ct-tabs__panel {
  display: none;
  padding: clamp(18px, 3vw, 30px);
  border: 1px solid var(--rb-line);
  background: var(--ct-panel);
}
.page-contact #ct-scope-sub:checked ~ .ct-tabs__panels .ct-tabs__panel--sub,
.page-contact #ct-scope-entry:checked ~ .ct-tabs__panels .ct-tabs__panel--entry,
.page-contact #ct-scope-card:checked ~ .ct-tabs__panels .ct-tabs__panel--card,
.page-contact #ct-scope-small:checked ~ .ct-tabs__panels .ct-tabs__panel--small {
  display: block;
}
.page-contact .ct-tabs__panel-title {
  margin: 0;
  font-size: clamp(1.08rem, 2.4vw, 1.32rem);
  line-height: 1.4;
  font-weight: 700;
  color: var(--rb-white);
}
.page-contact .ct-tabs__panel p {
  margin: 12px 0 0;
  max-width: 70ch;
  font-size: 0.92rem;
  line-height: 1.82;
  color: rgba(244, 247, 245, 0.76);
}
.page-contact .ct-tabs__panel-link {
  margin-top: 16px !important;
}
.page-contact .ct-tabs__panel-link a {
  font-size: 0.88rem;
  color: var(--rb-cyan);
  text-decoration: none;
  border-bottom: 1px solid rgba(95, 211, 179, 0.42);
  transition: border-color 0.25s;
}
.page-contact .ct-tabs__panel-link a:hover {
  border-bottom-color: var(--rb-cyan);
}

.page-contact .ct-list {
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.page-contact .ct-list li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 0.9rem;
  line-height: 1.72;
  color: rgba(244, 247, 245, 0.78);
}
.page-contact .ct-list__dot {
  flex: 0 0 auto;
  width: 10px;
  height: 2px;
  margin-top: 12px;
}
.page-contact .ct-list__dot--red {
  background: var(--rb-red);
}
.page-contact .ct-list__dot--yellow {
  background: var(--rb-yellow);
}
.page-contact .ct-list__dot--cyan {
  background: var(--rb-cyan);
}

/* ---------- 邮件优先 ---------- */
.page-contact .ct-priority {
  position: relative;
  border: 1px solid var(--rb-line-strong);
  background: linear-gradient(120deg, rgba(226, 59, 46, 0.14) 0%, rgba(18, 53, 43, 0.62) 46%, var(--rb-night) 100%);
}
.page-contact .ct-priority__bar {
  height: 4px;
  background: linear-gradient(90deg, var(--rb-red) 0%, var(--rb-yellow) 52%, var(--rb-cyan) 100%);
}
.page-contact .ct-priority__body {
  padding: clamp(20px, 3.6vw, 42px);
}
.page-contact .ct-priority__lead {
  margin: 14px 0 0;
  max-width: 68ch;
  font-size: 0.96rem;
  line-height: 1.84;
  color: rgba(244, 247, 245, 0.78);
}
.page-contact .ct-priority__list {
  margin: clamp(16px, 2.4vw, 24px) 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.page-contact .ct-priority__list li {
  position: relative;
  padding-left: 22px;
  font-size: 0.91rem;
  line-height: 1.74;
  color: rgba(244, 247, 245, 0.8);
}
.page-contact .ct-priority__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 10px;
  height: 2px;
  background: var(--rb-yellow);
}
.page-contact .ct-priority__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: clamp(18px, 2.6vw, 26px);
}

/* ---------- 联系前准备清单 ---------- */
.page-contact .ct-check {
  display: grid;
  gap: 10px;
  margin: clamp(18px, 2.6vw, 26px) 0 0;
  padding: 0;
  list-style: none;
}
.page-contact .ct-check__item {
  min-width: 0;
}
.page-contact .ct-check__input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.page-contact .ct-check__label {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  cursor: pointer;
  border: 1px solid var(--rb-line);
  background: var(--ct-field);
  transition: border-color 0.25s, background 0.25s;
}
.page-contact .ct-check__label:hover {
  border-color: var(--rb-line-strong);
}
.page-contact .ct-check__box {
  position: relative;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  border: 1px solid var(--rb-line-strong);
  transition: border-color 0.2s, background 0.2s;
}
.page-contact .ct-check__box::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 6px;
  height: 11px;
  border-right: 2px solid var(--rb-night);
  border-bottom: 2px solid var(--rb-night);
  transform: rotate(45deg) scale(0);
  transition: transform 0.18s var(--rb-ease);
}
.page-contact .ct-check__input:checked + .ct-check__label {
  border-color: var(--rb-cyan);
  background: rgba(95, 211, 179, 0.08);
}
.page-contact .ct-check__input:checked + .ct-check__label .ct-check__box {
  background: var(--rb-cyan);
  border-color: var(--rb-cyan);
}
.page-contact .ct-check__input:checked + .ct-check__label .ct-check__box::after {
  transform: rotate(45deg) scale(1);
}
.page-contact .ct-check__input:focus-visible + .ct-check__label {
  outline: 2px solid var(--rb-cyan);
  outline-offset: 2px;
}
.page-contact .ct-check__text {
  font-size: 0.9rem;
  line-height: 1.72;
  color: rgba(244, 247, 245, 0.76);
}
.page-contact .ct-check__text strong {
  display: inline-block;
  margin-right: 6px;
  color: var(--rb-white);
  font-weight: 700;
}

/* ---------- 回复节奏表格 ---------- */
.page-contact .ct-table-wrap {
  margin-top: clamp(18px, 2.6vw, 26px);
  overflow-x: auto;
  border: 1px solid var(--rb-line);
  background: var(--ct-panel-soft);
}
.page-contact .ct-table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
}
.page-contact .ct-table th,
.page-contact .ct-table td {
  padding: 14px 16px;
  text-align: left;
  vertical-align: top;
  font-size: 0.89rem;
  line-height: 1.68;
  border-bottom: 1px solid var(--rb-line);
}
.page-contact .ct-table thead th {
  background: var(--rb-turf);
  color: var(--rb-white);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--rb-line-strong);
  white-space: nowrap;
}
.page-contact .ct-table tbody th {
  font-weight: 700;
  color: var(--rb-white);
  white-space: nowrap;
}
.page-contact .ct-table tbody td {
  color: rgba(244, 247, 245, 0.76);
}
.page-contact .ct-table tbody tr:nth-child(even) {
  background: rgba(18, 53, 43, 0.3);
}
.page-contact .ct-table tbody tr:hover {
  background: rgba(31, 90, 69, 0.42);
}
.page-contact .ct-table tbody tr:last-child th,
.page-contact .ct-table tbody tr:last-child td {
  border-bottom: none;
}
.page-contact .ct-table__sub {
  display: inline-block;
  margin-top: 4px;
  font-size: 0.78rem;
  font-weight: 400;
  color: var(--rb-slate);
}
.page-contact .ct-rhythm__note {
  margin: 16px 0 0;
  padding-left: 14px;
  border-left: 3px solid var(--rb-yellow);
  font-size: 0.88rem;
  line-height: 1.78;
  color: rgba(244, 247, 245, 0.68);
  max-width: 70ch;
}

/* ---------- 地址说明 ---------- */
.page-contact .ct-address {
  display: grid;
  gap: clamp(20px, 3vw, 34px);
}
.page-contact .ct-address__body {
  min-width: 0;
}
.page-contact .ct-address__body > p {
  margin: 14px 0 0;
  max-width: 66ch;
  font-size: 0.93rem;
  line-height: 1.82;
  color: rgba(244, 247, 245, 0.76);
}
.page-contact .ct-address__list {
  margin: clamp(18px, 2.6vw, 26px) 0 0;
  padding: 0;
  border-top: 1px solid var(--rb-line);
}
.page-contact .ct-address__row {
  display: grid;
  gap: 4px;
  padding: 14px 0;
  border-bottom: 1px solid var(--rb-line);
}
.page-contact .ct-address__row dt {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rb-slate);
}
.page-contact .ct-address__row dd {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.74;
  color: var(--rb-white);
}
.page-contact .ct-address__foot {
  margin: 18px 0 0 !important;
  padding: 14px 16px;
  border: 1px solid var(--rb-line);
  background: var(--ct-panel-soft);
  font-size: 0.88rem !important;
  color: rgba(244, 247, 245, 0.7) !important;
}
.page-contact .ct-address__media {
  margin: 0;
  align-self: start;
}

/* ---------- 响应式 ---------- */
@media (min-width: 640px) {
  .page-contact .ct-signals {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-contact .ct-check {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page-contact .ct-address__row {
    grid-template-columns: 132px minmax(0, 1fr);
    align-items: baseline;
    gap: 12px;
  }
}

@media (min-width: 960px) {
  .page-contact .ct-channels {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.85fr);
    align-items: start;
  }
  .page-contact .ct-address {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    align-items: start;
  }
  .page-contact .ct-priority__body {
    padding: clamp(28px, 3.4vw, 44px) clamp(30px, 4vw, 52px);
  }
}

@media (min-width: 1200px) {
  .page-contact .ct-hero__frame {
    padding-inline: clamp(48px, 5vw, 68px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-contact .ct-card,
  .page-contact .ct-tabs__label,
  .page-contact .ct-check__label,
  .page-contact .ct-check__box,
  .page-contact .ct-check__box::after,
  .page-contact .ct-crumb a,
  .page-contact .ct-card__value a {
    transition: none;
  }
}