.page-contact {
  --pc-grid-line: rgba(14, 59, 50, .07);
}

.page-contact .pc-mono {
  font-family: var(--f-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
}

/* ---------- 首屏 ---------- */
.page-contact .pc-hero {
  position: relative;
  padding: 20px 0 56px;
  background-image:
    linear-gradient(to right, var(--pc-grid-line) 1px, transparent 1px),
    linear-gradient(to bottom, var(--pc-grid-line) 1px, transparent 1px);
  background-size: 56px 56px;
  background-position: -1px -1px;
  border-bottom: 1px solid var(--line);
}

.page-contact .pc-hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  align-items: start;
}

.page-contact .pc-hero__copy h1 {
  font-family: var(--f-head);
  font-weight: 800;
  font-size: clamp(30px, 5.4vw, 52px);
  line-height: 1.12;
  letter-spacing: -.01em;
  color: var(--forest-900);
  margin: 12px 0 0;
}

.page-contact .pc-hero__lede {
  margin: 18px 0 0;
  max-width: 56ch;
  font-size: 16px;
  line-height: 1.75;
  color: var(--ink);
}

.page-contact .pc-hero__quick {
  list-style: none;
  margin: 22px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
  max-width: 56ch;
}

.page-contact .pc-hero__quick li {
  display: flex;
  gap: 10px;
  align-items: baseline;
  padding: 9px 12px;
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--ink);
}

.page-contact .pc-hero__quick .pc-mono {
  color: var(--forest-700);
  font-size: 12px;
  font-weight: 600;
}

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

.page-contact .pc-hero__visual {
  position: relative;
  margin: 0;
  padding: 8px;
  background: var(--paper-2);
  border: 1px solid var(--line-2);
  box-shadow: var(--shadow-1);
}

.page-contact .pc-hero__visual::before {
  content: "";
  position: absolute;
  inset: 14px -8px -8px 14px;
  border: 1px solid var(--line);
  background: var(--gold-soft);
  opacity: .28;
  z-index: -1;
}

.page-contact .pc-hero__visual img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 5 / 4;
  object-fit: cover;
  border: 1px solid var(--line);
}

.page-contact .pc-hero__cap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 6px;
  margin-top: 8px;
  padding: 6px 2px 0;
  font-size: 12px;
  color: var(--muted);
  border-top: 1px dashed var(--line-2);
}

.page-contact .pc-hero__cap .pc-mono {
  color: var(--forest-700);
  font-weight: 600;
}

/* ---------- 章节头 ---------- */
.page-contact .pc-head {
  max-width: 62ch;
}

.page-contact .pc-head h2 {
  font-family: var(--f-head);
  font-weight: 800;
  font-size: clamp(24px, 3.4vw, 36px);
  line-height: 1.2;
  color: var(--forest-900);
  margin: 10px 0 0;
}

.page-contact .pc-head__note {
  margin: 12px 0 0;
  font-size: 15px;
  line-height: 1.7;
  color: var(--muted);
}

/* ---------- 三种方式 ---------- */
.page-contact .pc-channels__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-top: 32px;
}

.page-contact .pc-channel {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 22px 20px 20px;
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-top: 4px solid var(--forest-700);
  box-shadow: var(--shadow-1);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}

.page-contact .pc-channel:hover {
  transform: translateY(-2px);
  box-shadow: 0 2px 0 rgba(14, 59, 50, .08), 0 18px 32px -24px rgba(14, 59, 50, .7);
}

.page-contact .pc-channel--mail { border-top-color: var(--gold); }
.page-contact .pc-channel--phone { border-top-color: var(--forest-700); }
.page-contact .pc-channel--ticket { border-top-color: var(--coral); }

.page-contact .pc-channel__idx {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}

.page-contact .pc-channel h3 {
  margin: 0;
  font-family: var(--f-head);
  font-size: 20px;
  font-weight: 700;
  color: var(--forest-900);
}

.page-contact .pc-channel__fit {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--ink);
}

.page-contact .pc-channel__target {
  margin-top: auto;
  display: inline-block;
  padding: 10px 12px;
  font-family: var(--f-mono);
  font-size: 14px;
  font-weight: 600;
  color: var(--forest-900);
  text-decoration: none;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-left: 3px solid var(--gold);
  word-break: break-all;
}

.page-contact .pc-channel__target:hover,
.page-contact .pc-channel__target:focus-visible {
  background: var(--gold-soft);
  border-color: var(--gold);
}

.page-contact .pc-channel__meta {
  margin: 0;
  font-size: 12.5px;
  color: var(--muted);
}

/* ---------- 咨询前准备 ---------- */
.page-contact .pc-prep {
  background: var(--forest-900);
  color: var(--paper);
}

.page-contact .pc-prep__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  align-items: start;
}

.page-contact .pc-prep .bp-eyebrow {
  color: var(--gold-soft);
}

.page-contact .pc-prep__text h2 {
  font-family: var(--f-head);
  font-weight: 800;
  font-size: clamp(24px, 3.4vw, 36px);
  line-height: 1.2;
  margin: 10px 0 0;
  color: var(--paper-2);
}

.page-contact .pc-prep__lede {
  margin: 14px 0 0;
  max-width: 54ch;
  font-size: 15px;
  line-height: 1.75;
  color: rgba(247, 241, 227, .82);
}

.page-contact .pc-prep__list {
  list-style: none;
  margin: 26px 0 0;
  padding: 0;
  display: grid;
  gap: 14px;
}

.page-contact .pc-prep__list li {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 12px;
  padding: 14px 16px;
  background: rgba(255, 253, 247, .06);
  border: 1px solid var(--line-light);
  border-left: 3px solid var(--gold);
}

.page-contact .pc-prep__num {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  font-size: 13px;
  font-weight: 700;
  color: var(--forest-900);
  background: var(--gold);
  border-radius: 50%;
}

.page-contact .pc-prep__list h3 {
  margin: 0 0 4px;
  font-family: var(--f-head);
  font-size: 16.5px;
  font-weight: 700;
  color: var(--paper-2);
}

.page-contact .pc-prep__list p {
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
  color: rgba(247, 241, 227, .78);
}

.page-contact .pc-prep__link {
  margin: 20px 0 0;
  font-size: 14px;
  line-height: 1.7;
  color: rgba(247, 241, 227, .78);
}

.page-contact .pc-prep__link a {
  color: var(--gold-soft);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-contact .pc-prep__visual {
  margin: 0;
  padding: 8px;
  background: rgba(255, 253, 247, .08);
  border: 1px solid var(--line-light);
}

.page-contact .pc-prep__visual img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

.page-contact .pc-prep__cap {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed var(--line-light);
  font-size: 12.5px;
  color: rgba(247, 241, 227, .7);
}

/* ---------- 响应节奏 ---------- */
.page-contact .pc-timeline {
  list-style: none;
  margin: 32px 0 0;
  padding: 0;
  display: grid;
  gap: 0;
  border-left: 2px dashed var(--line-2);
  margin-left: 4px;
}

.page-contact .pc-timeline__item {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 4px;
  padding: 0 0 24px 26px;
}

.page-contact .pc-timeline__item::before {
  content: "";
  position: absolute;
  left: -8px;
  top: 4px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--paper-2);
  border: 2px solid var(--cyan);
}

.page-contact .pc-timeline__item--alert::before {
  border-color: var(--coral);
  background: var(--coral);
}

.page-contact .pc-timeline__time {
  font-size: 13px;
  font-weight: 600;
  color: var(--forest-700);
}

.page-contact .pc-timeline__body h3 {
  margin: 2px 0 4px;
  font-family: var(--f-head);
  font-size: 17px;
  font-weight: 700;
  color: var(--forest-900);
}

.page-contact .pc-timeline__body p {
  margin: 0;
  max-width: 60ch;
  font-size: 14.5px;
  line-height: 1.7;
  color: var(--ink);
}

/* ---------- 联系信息卡 ---------- */
.page-contact .pc-info__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 26px;
  align-items: start;
}

.page-contact .pc-info__card {
  position: relative;
}

.page-contact .pc-info__stack {
  position: absolute;
  inset: 12px -6px -10px 10px;
  background: var(--paper-3);
  border: 1px solid var(--line);
  transform: rotate(-.6deg);
}

.page-contact .pc-info__sheet {
  position: relative;
  padding: 24px 20px;
  background: var(--paper-2);
  border: 1px solid var(--line-2);
  border-top: 4px solid var(--gold);
  box-shadow: var(--shadow-1);
}

.page-contact .pc-info__sheet h2 {
  margin: 10px 0 0;
  font-family: var(--f-head);
  font-size: clamp(20px, 2.8vw, 26px);
  font-weight: 800;
  color: var(--forest-900);
}

.page-contact .pc-info__rows {
  margin: 18px 0 0;
  padding: 0;
  display: grid;
  gap: 0;
}

.page-contact .pc-info__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2px;
  padding: 11px 0;
  border-bottom: 1px dashed var(--line-2);
}

.page-contact .pc-info__row dt {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: .04em;
}

.page-contact .pc-info__row dd {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink);
  word-break: break-word;
}

.page-contact .pc-info__row dd a {
  font-family: var(--f-mono);
  font-size: 14.5px;
  font-weight: 600;
  color: var(--forest-700);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-contact .pc-info__note {
  margin: 16px 0 0;
  padding: 12px 14px;
  font-size: 13.5px;
  line-height: 1.65;
  color: var(--forest-900);
  background: var(--gold-soft);
  border-left: 3px solid var(--coral);
}

.page-contact .pc-info__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.page-contact .pc-info__aside {
  padding: 22px 20px;
  background: var(--paper);
  border: 1px solid var(--line);
}

.page-contact .pc-info__aside-title {
  margin: 0 0 14px;
  font-family: var(--f-head);
  font-size: 17px;
  font-weight: 700;
  color: var(--forest-900);
}

.page-contact .pc-info__aside-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}

.page-contact .pc-info__aside-list li {
  display: grid;
  gap: 3px;
  padding-left: 14px;
  border-left: 2px solid var(--cyan);
}

.page-contact .pc-info__aside-list a {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--forest-700);
  text-decoration: none;
}

.page-contact .pc-info__aside-list a:hover,
.page-contact .pc-info__aside-list a:focus-visible {
  color: var(--coral);
}

.page-contact .pc-info__aside-list span {
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--muted);
}

/* ---------- 场景筛选 ---------- */
.page-contact .pc-filters {
  margin-top: 26px;
}

.page-contact .pc-scenarios__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 20px;
}

.page-contact .pc-scenario {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px;
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-left: 3px solid var(--forest-700);
  transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
}

.page-contact .pc-scenario[data-hidden="true"] {
  display: none;
}

.page-contact .pc-scenario h3 {
  margin: 0;
  font-family: var(--f-head);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--forest-900);
}

.page-contact .pc-scenario__list {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 6px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink);
}

.page-contact .pc-scenario__list li::marker {
  color: var(--gold);
}

.page-contact .pc-scenario__next {
  margin: auto 0 0;
  padding-top: 10px;
  border-top: 1px dashed var(--line-2);
  font-size: 13.5px;
  line-height: 1.65;
  color: var(--muted);
}

.page-contact .pc-scenario__next a {
  color: var(--forest-700);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.page-contact .pc-scenarios__foot {
  margin: 22px 0 0;
  padding: 14px 16px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--forest-900);
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
}

.page-contact .pc-scenarios__foot a {
  font-family: var(--f-mono);
  font-weight: 600;
  color: var(--forest-700);
}

/* ---------- 断点 ---------- */
@media (min-width: 700px) {
  .page-contact .pc-channels__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  .page-contact .pc-info__row {
    grid-template-columns: 120px 1fr;
    align-items: baseline;
    gap: 14px;
  }

  .page-contact .pc-timeline__item {
    grid-template-columns: 140px 1fr;
    gap: 18px;
    align-items: start;
  }

  .page-contact .pc-timeline__time {
    text-align: right;
    padding-top: 3px;
  }
}

@media (min-width: 960px) {
  .page-contact .pc-hero {
    padding: 32px 0 72px;
  }

  .page-contact .pc-hero__grid {
    grid-template-columns: 1.05fr .95fr;
    gap: 44px;
    align-items: center;
  }

  .page-contact .pc-channels__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 40px;
  }

  .page-contact .pc-prep__grid {
    grid-template-columns: 1.1fr .9fr;
    gap: 44px;
    align-items: center;
  }

  .page-contact .pc-info__grid {
    grid-template-columns: 1.15fr .85fr;
    gap: 32px;
  }

  .page-contact .pc-scenarios__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-contact .pc-channel,
  .page-contact .pc-scenario {
    transition: none;
  }

  .page-contact .pc-channel:hover {
    transform: none;
  }
}


<main id="main-content" class="page-contact">
  <nav class="bp-crumbs bp-shell" aria-label="面包屑">
    <ol class="bp-crumbs__list">
      <li><a href="/">首页</a></li>
      <li class="bp-crumbs__sep" aria-hidden="true">/</li>
      <li class="bp-crumbs__here" aria-current="page">咨询通道</li>
    </ol>
  </nav>

  <section class="pc-hero">
    <div class="bp-shell pc-hero__grid">
      <div class="pc-hero__copy" data-reveal>
        <p class="bp-eyebrow">咨询通道 · 工作日 09:00—18:00</p>
        <h1>先说清楚区域和时段，<br>入口一次就对得上</h1>
        <p class="pc-hero__lede">
          澳门财运网把上门服务的时段、覆盖与流程整理成能直接查的清单。您说清所在片区、想要的类目和期望时间，客服就能把对应的入口指给您，省掉来回转述。
        </p>
        <ul class="pc-hero__quick">
          <li><span class="pc-mono">01</span>邮箱咨询｜情况写得细，答复带入口</li>
          <li><span class="pc-mono">02</span>电话咨询｜时段和档位当场问清</li>
          <li><span class="pc-mono">03</span>站内工单｜紧急事项随时提交，按序跟进</li>
        </ul>
        <div class="pc-hero__actions">
          <a class="bp-btn bp-btn--gold" href="#channels">看三种咨询方式</a>
          <a class="bp-btn bp-btn--outline" href="#scenarios">按场景查准备清单</a>
        </div>
      </div>
      <figure class="pc-hero__visual" data-reveal>
        <img src="{zhanqunpic:h:800w:1000}" width="1000" height="800" alt="服务入口地图与咨询标签纸层叠的视觉图">
        <figcaption class="pc-hero__cap">
          <span class="pc-mono">MAP / 咨询入口</span>
          <span>覆盖 · 时段 · 流程 · 工单</span>
        </figcaption>
      </figure>
    </div>
  </section>

  <section class="bp-section pc-channels" id="channels">
    <div class="bp-shell">
      <div class="bp-section__head pc-head">
        <p class="bp-eyebrow">怎么找到我们</p>
        <h2>三种方式，按手头情况挑一个</h2>
        <p class="pc-head__note">拿不准走哪条，先用邮箱把情况写全，客服会把入口一并回给您。</p>
      </div>
      <div class="pc-channels__grid">
        <article class="pc-channel pc-channel--mail" data-reveal>
          <span class="pc-channel__idx pc-mono">01 / EMAIL</span>
          <h3>客服邮箱</h3>
          <p class="pc-channel__fit">适合想把区域、类目、期望时段一次写全，或者需要留一份文字记录。</p>
          <a class="pc-channel__target" href="mailto:info@lucky-caiyun.com.cn">info@lucky-caiyun.com.cn</a>
          <p class="pc-channel__meta">工作日 9:00-18:00 内回复</p>
        </article>

        <article class="pc-channel pc-channel--phone" data-reveal>
          <span class="pc-channel__idx pc-mono">02 / TEL</span>
          <h3>联系电话</h3>
          <p class="pc-channel__fit">适合当场问清覆盖档位，或者对时段清单里的字段有疑问想听人解释。</p>
          <a class="pc-channel__target" href="tel:17545677488">17545677488</a>
          <p class="pc-channel__meta">工作日 9:00-18:00 接听</p>
        </article>

        <article class="pc-channel pc-channel--ticket" data-reveal>
          <span class="pc-channel__idx pc-mono">03 / TICKET</span>
          <h3>站内“服务入口”工单</h3>
          <p class="pc-channel__fit">适合紧急事项，或非工作时段先把需求放进来，等客服按顺序跟进。</p>
          <a class="pc-channel__target" href="/features/">前往服务功能中心提交</a>
          <p class="pc-channel__meta">提交后按到达顺序处理</p>
        </article>
      </div>
    </div>
  </section>

  <section class="bp-section pc-prep">
    <div class="bp-shell pc-prep__grid">
      <div class="pc-prep__text" data-reveal>
        <p class="bp-eyebrow">开口之前</p>
        <h2>备好三项，第一封回信就有答案</h2>
        <p class="pc-prep__lede">客服要把您的需求对到具体入口，主要看三件事。提前写下来，第一次来回就能定路径，不必再问一轮。</p>
        <ol class="pc-prep__list">
          <li>
            <span class="pc-prep__num pc-mono">A</span>
            <div>
              <h3>您在哪个片区</h3>
              <p>区、街道或片区写细一点。覆盖分直连、预约、接力三档，说得具体，客服就能直接告诉您落在哪一档。</p>
            </div>
          </li>
          <li>
            <span class="pc-prep__num pc-mono">B</span>
            <div>
              <h3>您要办哪一类</h3>
              <p>12 个服务大类、48 个常见上门服务项目，说出最接近的那项就行，剩下的由客服帮您归到合适类目。</p>
            </div>
          </li>
          <li>
            <span class="pc-prep__num pc-mono">C</span>
            <div>
              <h3>您想在什么时间</h3>
              <p>给一个首选时间再加一个备选。晚间安排差别较大，可以先翻时段适配清单，再决定报哪个时段。</p>
            </div>
          </li>
        </ol>
        <p class="pc-prep__link">清单字段看不懂？<a href="/guide/">使用指南</a>里有逐步说明；也可以先到<a href="/features/">服务功能中心</a>看条目示例。</p>
      </div>
      <figure class="pc-prep__visual" data-reveal>
        <img src="{zhanqunpic:h:600w:900}" width="900" height="600" alt="覆盖区域、服务类目、期望时段三项咨询准备清单" loading="lazy" decoding="async">
        <figcaption class="pc-prep__cap">A 区域 · B 类目 · C 时段，写清这三项再联系</figcaption>
      </figure>
    </div>
  </section>

  <section class="bp-section pc-rhythm">
    <div class="bp-shell">
      <div class="bp-section__head pc-head">
        <p class="bp-eyebrow">响应节奏</p>
        <h2>工作日的来信，当天给答复</h2>
        <p class="pc-head__note">客服邮箱在工作日 9:00-18:00 内回复。时段清单每周二更新、覆盖区域每月首个工作日校订，若您问的片区刚调整过，回信会带上当前档位。</p>
      </div>
      <ol class="pc-timeline">
        <li class="pc-timeline__item">
          <span class="pc-timeline__time pc-mono">09:00</span>
          <div class="pc-timeline__body">
            <h3>开始处理</h3>
            <p>前一日晚间和当日上午的来信、工单进入队列，先看区域与服务类目能否直接对上入口。</p>
          </div>
        </li>
        <li class="pc-timeline__item">
          <span class="pc-timeline__time pc-mono">09:00—18:00</span>
          <div class="pc-timeline__body">
            <h3>当天回复</h3>
            <p>这段时间发到客服邮箱的咨询，会收到含覆盖档位、推荐时段和下一步入口的答复。</p>
          </div>
        </li>
        <li class="pc-timeline__item">
          <span class="pc-timeline__time pc-mono">18:00</span>
          <div class="pc-timeline__body">
            <h3>当日收尾</h3>
            <p>当天来信回复完毕；晚间与休息日收到的咨询，顺延到下一个工作日继续跟进。</p>
          </div>
        </li>
        <li class="pc-timeline__item pc-timeline__item--alert">
          <span class="pc-timeline__time pc-mono">全天候</span>
          <div class="pc-timeline__body">
            <h3>紧急事项走工单</h3>
            <p>任何时段都能在站内“服务入口”提交工单，写清区域与服务类目，客服按到达顺序优先处理。</p>
          </div>
        </li>
      </ol>
    </div>
  </section>

  <section class="bp-section pc-info">
    <div class="bp-shell pc-info__grid">
      <div class="pc-info__card" data-reveal>
        <div class="pc-info__stack" aria-hidden="true"></div>
        <div class="pc-info__sheet">
          <p class="bp-eyebrow">联系信息</p>
          <h2>澳门财运网客服联系方式</h2>
          <dl class="pc-info__rows">
            <div class="pc-info__row">
              <dt>客服邮箱</dt>
              <dd><a href="mailto:info@lucky-caiyun.com.cn">info@lucky-caiyun.com.cn</a></dd>
            </div>
            <div class="pc-info__row">
              <dt>联系电话</dt>
              <dd><a href="tel:17545677488">17545677488</a></dd>
            </div>
            <div class="pc-info__row">
              <dt>联系地址</dt>
              <dd>湖北省武汉市洪山区光谷大道77号光谷金融港B座12层</dd>
            </div>
            <div class="pc-info__row">
              <dt>备案号</dt>
              <dd><span class="bp-tag bp-tag--indigo">鄂ICP备17274484号</span></dd>
            </div>
          </dl>
          <p class="pc-info__note">该邮箱为站点客服邮箱，工作日 9:00-18:00 内回复；紧急事项请通过站内“服务入口”提交工单。</p>
          <div class="pc-info__actions">
            <a class="bp-btn bp-btn--ink bp-btn--sm" href="mailto:info@lucky-caiyun.com.cn">写邮件</a>
            <a class="bp-btn bp-btn--outline bp-btn--sm" href="tel:17545677488">拨打电话</a>
          </div>
        </div>
      </div>
      <div class="pc-info__aside" data-reveal>
        <h3 class="pc-info__aside-title">来问之前，也能自己先查一遍</h3>
        <ul class="pc-info__aside-list">
          <li><a href="/features/">服务功能中心</a><span>覆盖区域三档与时段适配清单，手机上也能直接查。</span></li>
          <li><a href="/guide/">使用指南</a><span>清单字段怎么读、旧版本资料怎么找，几步说清。</span></li>
          <li><a href="/topics/">专题中心</a><span>资料版本与服务入口的历次更新，按版本线索引。</span></li>
          <li><a href="/overview/">品牌总览</a><span>服务地图怎么形成、维护团队如何分工。</span></li>
        </ul>
      </div>
    </div>
  </section>

  <section class="bp-section bp-section--tight pc-scenarios" id="scenarios" data-filter-root>
    <div class="bp-shell">
      <div class="bp-section__head pc-head">
        <p class="bp-eyebrow">常见咨询场景</p>
        <h2>四种情形，各自的准备清单</h2>
        <p class="pc-head__note">选一个最接近的场景，看看开口前最好先备好什么。当前共 <span class="bp-filter-count" data-filter-count>4</span> 个场景。</p>
      </div>

      <div class="bp-filters pc-filters" role="group" aria-label="按咨询场景筛选">
        <button class="bp-filter" type="button" data-filter="all" aria-pressed="true">全部场景</button>
        <button class="bp-filter" type="button" data-filter="first" aria-pressed="false">首次预约</button>
        <button class="bp-filter" type="button" data-filter="price" aria-pressed="false">价格对比</button>
        <button class="bp-filter" type="button" data-filter="archive" aria-pressed="false">旧资料查找</button>
        <button class="bp-filter" type="button" data-filter="partner" aria-pressed="false">合作咨询</button>
      </div>

      <div class="pc-scenarios__grid">
        <article class="pc-scenario" data-filter-item data-tags="first">
          <span class="bp-tag bp-tag--gold">首次预约</span>
          <h3>第一次用，想知道能不能上门</h3>
          <ul class="pc-scenario__list">
            <li>所在区与街道、片区名称</li>
            <li>最接近的服务类目，说个大概也行</li>
            <li>期望的日子和时段，另附一个备选</li>
          </ul>
          <p class="pc-scenario__next">建议先看<a href="/features/">时段适配清单</a>，按分类逐项列明推荐时段与准备事项。</p>
        </article>

        <article class="pc-scenario" data-filter-item data-tags="price">
          <span class="bp-tag bp-tag--coral">价格对比</span>
          <h3>在比两家的报价，想比得准</h3>
          <ul class="pc-scenario__list">
            <li>先看对方流程指引包含哪几个环节</li>
            <li>再确认自家区域属直连、预约还是接力档</li>
            <li>记下基础时长，别只盯一个总价</li>
          </ul>
          <p class="pc-scenario__next">流程指引与三段时长，在<a href="/features/">服务功能中心</a>有完整条目。</p>
        </article>

        <article class="pc-scenario" data-filter-item data-tags="archive">
          <span class="bp-tag bp-tag--indigo">旧资料查找</span>
          <h3>想找从前看过的版本或说明</h3>
          <ul class="pc-scenario__list">
            <li>先确认覆盖区域，资料按区域归集</li>
            <li>再从 V2023、V2024、V2025、V2026 里挑版本线</li>
            <li>说明想看的服务类目，能少翻几层</li>
          </ul>
          <p class="pc-scenario__next">版本索引在<a href="/topics/">专题中心</a>，按覆盖区域与服务类目查找。</p>
        </article>

        <article class="pc-scenario" data-filter-item data-tags="partner">
          <span class="bp-tag bp-tag--gold">合作咨询</span>
          <h3>本地服务信息点，想加入进来</h3>
          <ul class="pc-scenario__list">
            <li>能覆盖的服务类目与片区范围</li>
            <li>可承接的时段能力，含晚间安排</li>
            <li>是否有可对外说明的流程指引</li>
          </ul>
          <p class="pc-scenario__next">合作服务信息点按直连、预约、接力三档纳入，目前已有 86 个；可用邮箱联系，或先看<a href="/overview/">品牌总览</a>。</p>
        </article>
      </div>

      <p class="pc-scenarios__foot">备齐这三项后，写信到 <a href="mailto:info@lucky-caiyun.com.cn">info@lucky-caiyun.com.cn</a>，或在工作日拨打 <a href="tel:17545677488">17545677488</a>。</p>
    </div>
  </section>
</main>