.page-contact {
  --contact-gap: clamp(14px, 2vw, 22px);
  --contact-grid-line: rgba(159, 182, 201, 0.11);
  --contact-pad-y: clamp(34px, 6vw, 74px);
  position: relative;
  overflow-x: hidden;
  color: var(--white);
  background:
    linear-gradient(180deg, rgba(10, 26, 43, 0.92) 0%, rgba(6, 16, 31, 1) 58%),
    var(--ink);
  padding-bottom: clamp(40px, 6vw, 80px);
}

.page-contact .eyebrow {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--cyan);
}

/* ---------- 首屏框景 ---------- */
.page-contact .contact-hero {
  position: relative;
  padding-block: clamp(20px, 3.5vw, 40px) clamp(28px, 5vw, 56px);
  border-bottom: 1px solid var(--line);
  background-image:
    linear-gradient(180deg, rgba(16, 42, 66, 0.55), rgba(6, 16, 31, 0) 80%),
    repeating-linear-gradient(90deg, var(--contact-grid-line) 0 1px, transparent 1px 96px);
}

.page-contact .contact-hero__frame {
  position: relative;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-m);
  padding: clamp(16px, 3vw, 36px);
  background: rgba(6, 16, 31, 0.44);
}

.page-contact .contact-hero__frame::before {
  content: "";
  position: absolute;
  top: -1px;
  left: clamp(16px, 3vw, 36px);
  width: 76px;
  height: 3px;
  background: var(--amber);
}

.page-contact .breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 18px;
  padding: 0;
  list-style: none;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--mist);
}

.page-contact .breadcrumb li {
  display: flex;
  align-items: center;
  gap: 8px;
}

.page-contact .breadcrumb li + li::before {
  content: "/";
  color: var(--line-strong);
}

.page-contact .breadcrumb a {
  color: var(--mist);
  text-decoration: none;
  transition: color var(--dur) var(--ease);
}

.page-contact .breadcrumb a:hover,
.page-contact .breadcrumb a:focus-visible {
  color: var(--cyan);
}

.page-contact .breadcrumb__current {
  color: var(--amber);
}

.page-contact h1 {
  margin: 0.42em 0 0.5em;
  max-width: 15em;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(29px, 6.2vw, 60px);
  line-height: 1.08;
  letter-spacing: 0.005em;
  color: var(--white);
}

.page-contact .contact-hero__lead {
  margin: 0;
  max-width: 62ch;
  font-family: var(--font-serif);
  font-size: clamp(15px, 1.7vw, 17px);
  line-height: 1.95;
  color: var(--mist);
}

.page-contact .hero-meta {
  display: grid;
  gap: 12px;
  margin: clamp(20px, 3vw, 30px) 0 0;
  padding-top: 18px;
  border-top: 1px dashed var(--line-strong);
}

.page-contact .hero-meta__item {
  display: grid;
  gap: 4px;
}

.page-contact .hero-meta__key {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(159, 182, 201, 0.8);
}

.page-contact .hero-meta__val {
  margin: 0;
  font-size: 15px;
  letter-spacing: 0.02em;
  color: var(--white);
}

/* ---------- 章节骨架 ---------- */
.page-contact .contact-section {
  padding-block: var(--contact-pad-y);
  border-top: 1px solid var(--line);
}

.page-contact .contact-section--prep {
  background: linear-gradient(180deg, rgba(10, 26, 43, 0.75), rgba(6, 16, 31, 0.2));
}

.page-contact .section-head {
  display: grid;
  gap: 10px;
  max-width: 66ch;
  margin-bottom: clamp(20px, 3vw, 32px);
}

.page-contact .section-head h2 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(25px, 4vw, 40px);
  line-height: 1.16;
  letter-spacing: 0.01em;
  color: var(--white);
}

.page-contact .section-head p:last-child {
  margin: 0;
  font-size: 15px;
  line-height: 1.85;
  color: var(--mist);
}

/* ---------- 媒体框 ---------- */
.page-contact .media-frame {
  margin: 0 0 clamp(20px, 3vw, 28px);
  border: 1px solid var(--line);
  border-radius: var(--radius-m);
  overflow: hidden;
  background: var(--ink-2);
}

.page-contact .media-frame img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

.page-contact .media-frame__caption {
  padding: 10px 14px;
  border-top: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  color: rgba(159, 182, 201, 0.85);
}

/* ---------- 三通道卡 ---------- */
.page-contact .channel-grid {
  display: grid;
  gap: var(--contact-gap);
  grid-template-columns: 1fr;
}

.page-contact .channel-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: clamp(18px, 2.4vw, 28px);
  border: 1px solid var(--line);
  border-radius: var(--radius-m);
  background: var(--panel);
  transition: border-color var(--dur) var(--ease), background-color var(--dur) var(--ease);
}

.page-contact .channel-card:hover {
  border-color: rgba(255, 178, 74, 0.6);
}

.page-contact .channel-card--mail {
  border-color: rgba(57, 242, 208, 0.55);
  background:
    linear-gradient(158deg, rgba(57, 242, 208, 0.11), rgba(16, 42, 66, 0.96) 46%),
    var(--panel);
  box-shadow: inset 0 1px 0 rgba(57, 242, 208, 0.22);
}

.page-contact .channel-card__num {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cyan);
}

.page-contact .channel-card__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0.03em;
  color: var(--white);
}

.page-contact .channel-card__value {
  margin: 0;
  font-size: clamp(16px, 2.4vw, 21px);
  line-height: 1.4;
  color: var(--white);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.page-contact .channel-card__value--mail {
  font-family: var(--font-mono);
  letter-spacing: 0.01em;
  color: var(--cyan);
}

.page-contact .channel-card__value--phone {
  font-family: var(--font-mono);
  letter-spacing: 0.06em;
  color: var(--amber);
}

.page-contact .channel-card__value--addr {
  font-size: clamp(15px, 2vw, 18px);
  color: var(--white);
}

.page-contact .channel-card__note {
  margin: 0;
  font-size: 14px;
  line-height: 1.85;
  color: var(--mist);
}

.page-contact .channel-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}

/* ---------- 复制按钮 ---------- */
.page-contact .copy-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 15px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-pill);
  background: transparent;
  color: var(--mist);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  cursor: pointer;
  transition: color var(--dur) var(--ease), border-color var(--dur) var(--ease),
    background-color var(--dur) var(--ease);
}

.page-contact .copy-btn:hover,
.page-contact .copy-btn:focus-visible {
  border-color: var(--cyan);
  color: var(--cyan);
  background: rgba(57, 242, 208, 0.08);
}

.page-contact .copy-btn [data-copy-status] {
  pointer-events: none;
}

/* ---------- 问题准备清单 ---------- */
.page-contact .prep-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line);
}

.page-contact .prep-item {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 6px 14px;
  align-items: start;
  padding-block: 16px;
  border-bottom: 1px dashed var(--line);
}

.page-contact .prep-item__num {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: 0.06em;
  color: var(--cyan);
  padding-top: 2px;
}

.page-contact .prep-item__body {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.page-contact .prep-item__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0.03em;
  color: var(--white);
}

.page-contact .prep-item__text {
  margin: 0;
  font-size: 14px;
  line-height: 1.85;
  color: var(--mist);
}

.page-contact .prep-item__copy {
  grid-column: 2;
  justify-self: start;
}

/* ---------- 回复节奏 ---------- */
.page-contact .timeline {
  position: relative;
}

.page-contact .timeline__scale {
  display: flex;
  justify-content: space-between;
  padding-top: 10px;
  border-top: 2px solid rgba(57, 242, 208, 0.45);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  color: rgba(159, 182, 201, 0.9);
  background-image: repeating-linear-gradient(
    90deg,
    var(--line-strong) 0 1px,
    transparent 1px 12.5%
  );
  background-size: 100% 7px;
  background-repeat: no-repeat;
  background-position: top;
}

.page-contact .steps {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.page-contact .step {
  padding-left: 14px;
  border-left: 2px solid var(--line-strong);
  transition: border-color var(--dur) var(--ease);
}

.page-contact .step:hover {
  border-left-color: var(--cyan);
}

.page-contact .step__num {
  margin: 0 0 6px;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--amber);
}

.page-contact .step__title {
  margin: 0 0 5px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0.03em;
  color: var(--white);
}

.page-contact .step__text {
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  color: var(--mist);
}

.page-contact .contact-section--rhythm .media-frame {
  margin-top: clamp(24px, 3vw, 34px);
}

.page-contact .rhythm-note {
  margin: 0;
  padding: 14px 16px;
  border-left: 2px solid var(--amber);
  background: rgba(255, 178, 74, 0.07);
  font-size: 14px;
  line-height: 1.8;
  color: rgba(238, 246, 251, 0.9);
}

/* ---------- 问题分流 ---------- */
.page-contact .dispatch {
  display: grid;
  border-top: 1px solid var(--line);
}

.page-contact .dispatch__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 4px;
  border-bottom: 1px solid var(--line);
  text-decoration: none;
  color: var(--white);
  transition: background-color var(--dur) var(--ease), padding-left var(--dur) var(--ease);
}

.page-contact .dispatch__link:hover,
.page-contact .dispatch__link:focus-visible {
  background: rgba(57, 242, 208, 0.07);
  padding-left: 12px;
}

.page-contact .dispatch__body {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.page-contact .dispatch__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 17px;
  letter-spacing: 0.04em;
  color: var(--white);
}

.page-contact .dispatch__desc {
  font-size: 13px;
  line-height: 1.75;
  color: var(--mist);
}

.page-contact .dispatch__arrow {
  flex: 0 0 auto;
  font-family: var(--font-mono);
  font-size: 16px;
  color: var(--amber);
  transition: transform var(--dur) var(--ease);
}

.page-contact .dispatch__link:hover .dispatch__arrow {
  transform: translateX(4px);
}

/* ---------- 备案信息与收尾 ---------- */
.page-contact .contact-section--ledger {
  background: linear-gradient(180deg, rgba(10, 26, 43, 0.4), rgba(6, 16, 31, 0));
}

.page-contact .ledger {
  display: grid;
  gap: 16px;
  padding: clamp(18px, 3vw, 30px);
  border: 1px solid var(--line);
  border-radius: var(--radius-m);
  background: rgba(10, 26, 43, 0.88);
}

.page-contact .ledger__row {
  display: grid;
  gap: 4px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(159, 182, 201, 0.12);
}

.page-contact .ledger__row:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.page-contact .ledger__key {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(159, 182, 201, 0.78);
}

.page-contact .ledger__val {
  margin: 0;
  font-size: 15px;
  letter-spacing: 0.02em;
  color: var(--white);
  overflow-wrap: anywhere;
}

.page-contact .closing {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: clamp(22px, 3vw, 32px);
  padding-top: clamp(18px, 2.5vw, 24px);
  border-top: 1px dashed var(--line-strong);
}

.page-contact .closing__text {
  margin: 0;
  max-width: 46ch;
  font-size: 14px;
  line-height: 1.8;
  color: var(--mist);
}

.page-contact .closing__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* ---------- 焦点态 ---------- */
.page-contact a:focus-visible,
.page-contact button:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 2px;
}

/* ---------- 响应式 ---------- */
@media (min-width: 640px) {
  .page-contact .hero-meta {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .page-contact .ledger {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-contact .ledger__row:nth-last-child(2) {
    border-bottom: 0;
  }
}

@media (min-width: 760px) {
  .page-contact .prep-item {
    grid-template-columns: 56px minmax(0, 1fr) auto;
    align-items: center;
    gap: 4px 18px;
  }

  .page-contact .prep-item__num {
    font-size: 14px;
  }

  .page-contact .prep-item__copy {
    grid-column: 3;
    justify-self: end;
  }

  .page-contact .steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }
}

@media (min-width: 940px) {
  .page-contact .channel-grid {
    grid-template-columns: 1.62fr 1fr 1fr;
    align-items: stretch;
  }

  .page-contact .channel-card--mail {
    grid-row: span 1;
  }

  .page-contact .steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .page-contact .dispatch__title {
    font-size: 18px;
  }
}

@media (min-width: 1120px) {
  .page-contact .contact-hero__frame {
    padding: 44px 46px 38px;
  }

  .page-contact .prep-list {
    padding-inline: 4px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-contact * {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }

  .page-contact .dispatch__link:hover .dispatch__arrow {
    transform: none;
  }
}


<main id="main-content" class="page-contact">
  <section class="contact-hero">
    <div class="container">
      <div class="contact-hero__frame">
        <nav class="breadcrumb" aria-label="面包屑导航">
          <ol>
            <li><a href="/">速查首页</a></li>
            <li class="breadcrumb__current" aria-current="page">联络与支持</li>
          </ol>
        </nav>
        <p class="eyebrow">联络与支持 · CONTACT RAIL</p>
        <h1>联系 BET9指南：把问题交给对的通道</h1>
        <p class="contact-hero__lead">资料包下载到一半断开、安卓端更新后打不开、切换面板视图回不到原来的位置，或者订阅清单迟迟没收到——先判断问题落在哪一类，再决定写邮件还是打电话，能省掉一整轮来回。工作日 9:00–18:00 发来的邮件，当天就会进入处理队列。</p>
        <dl class="hero-meta">
          <div class="hero-meta__item">
            <dt class="hero-meta__key">服务时间</dt>
            <dd class="hero-meta__val">工作日 9:00–18:00</dd>
          </div>
          <div class="hero-meta__item">
            <dt class="hero-meta__key">优先通道</dt>
            <dd class="hero-meta__val">客服邮箱</dd>
          </div>
          <div class="hero-meta__item">
            <dt class="hero-meta__key">服务地区</dt>
            <dd class="hero-meta__val">宁夏</dd>
          </div>
        </dl>
      </div>
    </div>
  </section>

  <section class="contact-section" id="channels">
    <div class="container">
      <div class="section-head">
        <p class="eyebrow">01 / 优先联系通道</p>
        <h2>三条通道，按问题轻重来选</h2>
        <p>需要附截图、编号或导出记录的问题走邮箱；只想确认一个版本号或状态，电话更快；线下沟通请先邮件约时间。</p>
      </div>

      <figure class="media-frame media-frame--wide">
        <img src="{zhanqunpic:h:560w:1100}" width="1100" height="560" alt="邮箱、电话、地址三条联系通道的抽象线框图，邮箱通道最突出" loading="lazy" decoding="async">
        <figcaption class="media-frame__caption">三条通道分别承接资料支持、简短确认与线下沟通</figcaption>
      </figure>

      <div class="channel-grid">
        <article class="channel-card channel-card--mail">
          <p class="channel-card__num">01 / 首选</p>
          <h3 class="channel-card__title">客服邮箱</h3>
          <p class="channel-card__value channel-card__value--mail">email@flash-bet9.com.cn</p>
          <p class="channel-card__note">站点客服邮箱，工作日 9:00–18:00 内回复。资料下载出错、订阅导出清单没收到、资料包打开失败这类需要附截图和编号的问题，邮件能留下完整记录，处理起来最快。</p>
          <div class="channel-actions">
            <a class="btn btn--amber btn--sm" href="mailto:email@flash-bet9.com.cn">写邮件</a>
            <button class="copy-btn" type="button" data-copy data-copy-value="email@flash-bet9.com.cn">复制邮箱</button>
          </div>
        </article>

        <article class="channel-card">
          <p class="channel-card__num">02 / 补充</p>
          <h3 class="channel-card__title">联系电话</h3>
          <p class="channel-card__value channel-card__value--phone">17380104817</p>
          <p class="channel-card__note">适合需要马上确认的短问题，比如打开异常是不是版本没更新、手上的资料包编号对不对得上。要描述复现步骤，用邮件说更清楚。</p>
          <div class="channel-actions">
            <a class="btn btn--ghost btn--sm" href="tel:17380104817">拨打电话</a>
            <button class="copy-btn" type="button" data-copy data-copy-value="17380104817">复制电话</button>
          </div>
        </article>

        <article class="channel-card">
          <p class="channel-card__num">03 / 线下</p>
          <h3 class="channel-card__title">联系地址</h3>
          <p class="channel-card__value channel-card__value--addr">宁夏省银川市金凤区北京中路168号</p>
          <p class="channel-card__note">站点服务地区为宁夏。需要当面递交材料或安排线下沟通，请先用邮件说明事由，我们会回复合适的时间与对接方式。</p>
        </article>
      </div>
      <p class="visually-hidden" role="status" aria-live="polite" data-copy-status></p>
    </div>
  </section>

  <section class="contact-section contact-section--prep" id="prepare">
    <div class="container">
      <div class="section-head">
        <p class="eyebrow">02 / 提问前</p>
        <h2>把这几样放在手边，来回能少一半</h2>
        <p>信里写得越具体，第一封回复就越接近答案。下面五项按常用程度排好，手里缺哪项，在邮件里说明一句就行。</p>
      </div>

      <ol class="prep-list">
        <li class="prep-item">
          <span class="prep-item__num">01</span>
          <div class="prep-item__body">
            <h3 class="prep-item__title">入口位置</h3>
            <p class="prep-item__text">出问题的那一页是从哪里进去的：首页左侧三格入口、导航栏目，还是上一封邮件里的链接。</p>
          </div>
          <button class="copy-btn prep-item__copy" type="button" data-copy data-copy-value="入口位置：出问题的那一页从首页左侧三格入口、导航栏目还是邮件链接进入。">复制</button>
        </li>
        <li class="prep-item">
          <span class="prep-item__num">02</span>
          <div class="prep-item__body">
            <h3 class="prep-item__title">清单编号</h3>
            <p class="prep-item__text">资料包封面或月度清单上的编号，能直接定位到具体版本和导出批次，比描述文件名快得多。</p>
          </div>
          <button class="copy-btn prep-item__copy" type="button" data-copy data-copy-value="清单编号：资料包封面或月度清单上的编号，用于定位版本与导出批次。">复制</button>
        </li>
        <li class="prep-item">
          <span class="prep-item__num">03</span>
          <div class="prep-item__body">
            <h3 class="prep-item__title">设备与浏览器</h3>
            <p class="prep-item__text">安卓系统版本、浏览器名称与版本；平板和桌面端也请注明，不同环境的打开路径并不一样。</p>
          </div>
          <button class="copy-btn prep-item__copy" type="button" data-copy data-copy-value="设备与浏览器：安卓系统版本、浏览器名称与版本，平板或桌面端请注明。">复制</button>
        </li>
        <li class="prep-item">
          <span class="prep-item__num">04</span>
          <div class="prep-item__body">
            <h3 class="prep-item__title">现象与截图</h3>
            <p class="prep-item__text">点了几步、屏幕上出现什么提示。截图里保留完整界面和报错文字，比手打一段描述更管用。</p>
          </div>
          <button class="copy-btn prep-item__copy" type="button" data-copy data-copy-value="现象与截图：点了几步、出现什么提示，截图保留完整界面与报错文字。">复制</button>
        </li>
        <li class="prep-item">
          <span class="prep-item__num">05</span>
          <div class="prep-item__body">
            <h3 class="prep-item__title">订阅邮箱</h3>
            <p class="prep-item__text">订阅时填写的那个邮箱，用来查导出记录和投递状态，和发信邮箱不同也没关系。</p>
          </div>
          <button class="copy-btn prep-item__copy" type="button" data-copy data-copy-value="订阅邮箱：订阅时填写的邮箱，用于查导出记录与投递状态。">复制</button>
        </li>
      </ol>
    </div>
  </section>

  <section class="contact-section contact-section--rhythm" id="rhythm">
    <div class="container">
      <div class="section-head">
        <p class="eyebrow">03 / 回复节奏</p>
        <h2>邮件进来之后，会这样往下走</h2>
        <p>工作日 9:00 到 18:00 是处理窗口。客服支持、内容整理与前端维护三个小组共 9 名成员，按问题类型接手。</p>
      </div>

      <div class="timeline">
        <div class="timeline__scale" aria-hidden="true">
          <span>09:00</span>
          <span>12:00</span>
          <span>15:00</span>
          <span>18:00</span>
        </div>
        <ol class="steps">
          <li class="step">
            <p class="step__num">STEP 01</p>
            <h3 class="step__title">进入队列</h3>
            <p class="step__text">工作日 9:00–18:00 收到的邮件当天入队；18:00 之后和休息日收到的，顺延到下一个工作日。</p>
          </li>
          <li class="step">
            <p class="step__num">STEP 02</p>
            <h3 class="step__title">分派接手</h3>
            <p class="step__text">资料下载、订阅导出与安卓打开由客服支持组接手；面板视图显示异常会转给前端维护一起看。</p>
          </li>
          <li class="step">
            <p class="step__num">STEP 03</p>
            <h3 class="step__title">首次答复</h3>
            <p class="step__text">多数问题在一个工作日内答复。需要复现现象或确认版本的，会先回一封邮件说明下一步要做什么。</p>
          </li>
          <li class="step">
            <p class="step__num">STEP 04</p>
            <h3 class="step__title">接着跟进</h3>
            <p class="step__text">跨天处理沿用原来的邮件主题，回复时不必重述背景，直接补上新出现的现象就好。</p>
          </li>
        </ol>
      </div>

      <figure class="media-frame media-frame--wide">
        <img src="{zhanqunpic:h:360w:1000}" width="1000" height="360" alt="工作日9:00至18:00的横向时间刻度与邮件回复节奏示意" loading="lazy" decoding="async">
        <figcaption class="media-frame__caption">从入队到首次答复，工作日内的推进顺序</figcaption>
      </figure>

      <p class="rhythm-note">电话在工作日 9:00–18:00 可以拨打，适合一句话能说清的确认。遇到占线先发邮件，处理顺序按收件时间排。</p>
    </div>
  </section>

  <section class="contact-section" id="routing">
    <div class="container">
      <div class="section-head">
        <p class="eyebrow">04 / 问题去向</p>
        <h2>问题对号入座，少走一步弯路</h2>
        <p>有些答案已经写在页面里，先翻一眼再联系，往往当场就能解决。</p>
      </div>

      <nav class="dispatch" aria-label="问题分流入口">
        <a class="dispatch__link" href="/offerings/">
          <span class="dispatch__body">
            <span class="dispatch__title">资料与服务</span>
            <span class="dispatch__desc">分类资料包、月度导出清单，以及六类安卓打开场景的步骤说明。</span>
          </span>
          <span class="dispatch__arrow" aria-hidden="true">→</span>
        </a>
        <a class="dispatch__link" href="/faq/">
          <span class="dispatch__body">
            <span class="dispatch__title">常见答疑</span>
            <span class="dispatch__desc">下载入口找不到、面板切换不熟、订阅公告不知在哪，先看逐条解答。</span>
          </span>
          <span class="dispatch__arrow" aria-hidden="true">→</span>
        </a>
        <a class="dispatch__link" href="/articles/">
          <span class="dispatch__body">
            <span class="dispatch__title">更新专栏</span>
            <span class="dispatch__desc">每月 10 日同步导出的清单、期号，以及面板切换 v3.2 的动态。</span>
          </span>
          <span class="dispatch__arrow" aria-hidden="true">→</span>
        </a>
        <a class="dispatch__link" href="/privacy-policy/">
          <span class="dispatch__body">
            <span class="dispatch__title">隐私保护说明</span>
            <span class="dispatch__desc">访问、订阅与客服沟通中涉及的信息，在这里说清了怎么处理。</span>
          </span>
          <span class="dispatch__arrow" aria-hidden="true">→</span>
        </a>
        <a class="dispatch__link" href="/agreement/">
          <span class="dispatch__body">
            <span class="dispatch__title">使用协议</span>
            <span class="dispatch__desc">速查清单与资料包的使用范围、外部链接责任和协议更新方式。</span>
          </span>
          <span class="dispatch__arrow" aria-hidden="true">→</span>
        </a>
      </nav>
    </div>
  </section>

  <section class="contact-section contact-section--ledger" id="site-info">
    <div class="container">
      <div class="section-head">
        <p class="eyebrow">05 / 站点信息</p>
        <h2>确认站点身份时看这几项</h2>
        <p>BET9指南 自 2019 年起持续维护中文速查内容，flash-bet9.com.cn 是官方速查清单页。比对域名与备案号，就能确认你打开的是同一个站点。</p>
      </div>

      <div class="ledger">
        <div class="ledger__row">
          <p class="ledger__key">站点域名</p>
          <p class="ledger__val">flash-bet9.com.cn</p>
        </div>
        <div class="ledger__row">
          <p class="ledger__key">服务地区</p>
          <p class="ledger__val">宁夏</p>
        </div>
        <div class="ledger__row">
          <p class="ledger__key">ICP 备案号</p>
          <p class="ledger__val">宁ICP备34616472号-4</p>
        </div>
        <div class="ledger__row">
          <p class="ledger__key">内容维护起始</p>
          <p class="ledger__val">2019 年</p>
        </div>
      </div>

      <div class="closing">
        <p class="closing__text">还没想好从哪开始？回首页看三条主通道，或者直接翻资料与服务。</p>
        <div class="closing__actions">
          <a class="btn btn--amber btn--sm" href="/offerings/">看资料与服务</a>
          <a class="btn btn--ghost btn--sm" href="/">回速查首页</a>
        </div>
      </div>
    </div>
  </section>
</main>
