.page-contact {
  --pc-gap: clamp(1rem, 2.2vw, 1.5rem);
  --pc-paper-line: rgba(43, 33, 24, 0.14);
  --pc-paper-text: rgba(43, 33, 24, 0.72);
  padding-bottom: clamp(3rem, 7vw, 5.5rem);
}

.page-contact .breadcrumb {
  padding-top: clamp(1.25rem, 3vw, 2rem);
}

/* 首屏说明 */
.page-contact .intro {
  max-width: 80ch;
  padding-top: clamp(0.75rem, 2vw, 1.25rem);
  padding-bottom: clamp(2rem, 5vw, 3.25rem);
}

.page-contact .intro h1 {
  margin: 0.6rem 0 1rem;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(1.9rem, 5.6vw, 3.4rem);
  line-height: 1.14;
  letter-spacing: 0.015em;
  color: var(--mist);
  text-wrap: balance;
}

.page-contact .intro__lead {
  margin: 0;
  max-width: 68ch;
  font-size: clamp(0.95rem, 1.4vw, 1.06rem);
  line-height: 1.8;
  color: var(--soft-text);
}

.page-contact .section-head {
  margin-bottom: var(--pc-gap);
}

/* 联系信息板 */
.page-contact .board {
  display: grid;
  gap: var(--pc-gap);
}

.page-contact .board__channel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: linear-gradient(155deg, var(--ink-800) 0%, var(--ink-900) 58%, var(--ink-850) 100%);
  box-shadow: var(--shadow-soft);
}

.page-contact .board__img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: clamp(110px, 20vw, 176px);
  object-fit: cover;
  opacity: 0.5;
  border-bottom: 1px solid var(--line);
}

.page-contact .board__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 0.9rem;
  padding: 0.85rem clamp(1rem, 2vw, 1.4rem);
  border-bottom: 1px solid var(--line);
  background: rgba(7, 26, 43, 0.45);
}

.page-contact .board__code {
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  color: var(--faint-text);
}

.page-contact .channel-list {
  flex: 1;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-contact .channel {
  display: grid;
  gap: 0.3rem;
  padding: clamp(1rem, 2.4vw, 1.45rem) clamp(1rem, 2vw, 1.4rem);
  border-bottom: 1px dashed var(--line);
}

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

.page-contact .channel__label {
  font-size: 0.68rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--cyan);
}

.page-contact .channel__value {
  display: block;
  max-width: 100%;
  font-family: var(--font-mono);
  font-size: clamp(1rem, 3.6vw, 1.5rem);
  line-height: 1.35;
  color: var(--mist);
  text-decoration: none;
  overflow-wrap: anywhere;
  border-bottom: 1px solid transparent;
  transition: border-color 0.22s ease, color 0.22s ease;
}

.page-contact a.channel__value:hover,
.page-contact a.channel__value:focus-visible {
  color: #ffffff;
  border-bottom-color: var(--cyan);
}

.page-contact .channel__note {
  font-size: 0.84rem;
  line-height: 1.7;
  color: var(--faint-text);
}

/* 问题分诊 */
.page-contact .triage {
  display: flex;
  flex-direction: column;
  min-width: 0;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: var(--ink-800);
  box-shadow: var(--shadow-soft);
}

.page-contact .triage__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.85rem clamp(1rem, 2vw, 1.4rem);
  border-bottom: 1px solid var(--line);
}

.page-contact .triage__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--silver);
}

.page-contact .triage__hint {
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  color: var(--faint-text);
}

.page-contact .triage__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-contact .triage__item a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "idx name"
    "idx desc";
  gap: 0.18rem 0.85rem;
  padding: 0.9rem clamp(1rem, 2vw, 1.4rem);
  border-bottom: 1px solid var(--line);
  color: inherit;
  text-decoration: none;
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

.page-contact .triage__item:last-child a {
  border-bottom: 0;
}

.page-contact .triage__item a:hover,
.page-contact .triage__item a:focus-visible {
  background: rgba(67, 240, 208, 0.07);
  box-shadow: inset 2px 0 0 var(--cyan);
}

.page-contact .triage__idx {
  grid-area: idx;
  padding-top: 0.2rem;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  color: var(--cyan);
}

.page-contact .triage__name {
  grid-area: name;
  font-size: 1rem;
  font-weight: 600;
  color: var(--mist);
}

.page-contact .triage__desc {
  grid-area: desc;
  font-size: 0.82rem;
  line-height: 1.65;
  color: var(--faint-text);
}

.page-contact .triage__foot {
  margin: auto 0 0;
  padding: 0.9rem clamp(1rem, 2vw, 1.4rem);
  border-top: 1px solid var(--line);
  font-size: 0.8rem;
  line-height: 1.7;
  color: var(--soft-text);
}

.page-contact .triage__foot a {
  color: var(--cyan);
  text-decoration: none;
  border-bottom: 1px solid var(--line-cyan);
}

/* 咨询前准备（纸感面板） */
.page-contact .prep {
  margin-top: clamp(2.25rem, 5vw, 3.5rem);
}

.page-contact .prep__panel {
  display: grid;
  gap: clamp(1.25rem, 3vw, 2.25rem);
  padding: clamp(1.25rem, 3vw, 2.25rem);
  color: var(--brown);
}

.page-contact .prep__intro h2 {
  margin: 0.4rem 0 0.7rem;
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 2.6vw, 1.75rem);
  line-height: 1.3;
  letter-spacing: 0.01em;
  color: var(--brown);
}

.page-contact .prep__intro p {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.75;
  color: var(--pc-paper-text);
}

.page-contact .prep__intro a {
  color: var(--brown);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 106, 61, 0.6);
}

.page-contact .prep__list {
  display: grid;
  gap: 0.85rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-contact .prep__list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "num title"
    "num text";
  gap: 0.2rem 0.9rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--pc-paper-line);
}

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

.page-contact .prep__num {
  grid-area: num;
  padding-top: 0.22rem;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  color: var(--signal);
}

.page-contact .prep__list strong {
  grid-area: title;
  font-size: 0.98rem;
  color: var(--brown);
}

.page-contact .prep__desc {
  grid-area: text;
  font-size: 0.86rem;
  line-height: 1.7;
  color: var(--pc-paper-text);
}

/* 到访与寄送 */
.page-contact .visit {
  margin-top: clamp(2.25rem, 5vw, 3.5rem);
}

.page-contact .visit__grid {
  display: grid;
  gap: var(--pc-gap);
}

.page-contact .visit__address {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  min-width: 0;
  padding: clamp(1.1rem, 2.6vw, 1.75rem);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background:
    repeating-linear-gradient(90deg, rgba(199, 211, 220, 0.07) 0 1px, transparent 1px 44px),
    var(--ink-850);
  box-shadow: var(--shadow-soft);
}

.page-contact .visit__signal {
  position: absolute;
  top: clamp(1.1rem, 2.6vw, 1.75rem);
  right: clamp(1.1rem, 2.6vw, 1.75rem);
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--signal);
  box-shadow: 0 0 0 5px var(--halo-signal);
}

.page-contact .visit__label {
  font-size: 0.68rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--cyan);
}

.page-contact .visit__value {
  margin: 0;
  max-width: 22ch;
  font-family: var(--font-display);
  font-size: clamp(1.1rem, 3vw, 1.5rem);
  line-height: 1.45;
  color: var(--mist);
}

.page-contact .visit__note {
  margin: 0.25rem 0 0;
  font-size: 0.86rem;
  line-height: 1.75;
  color: var(--soft-text);
}

.page-contact .visit__figure {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: var(--ink-900);
}

.page-contact .visit__figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: clamp(180px, 34vw, 300px);
  object-fit: cover;
  opacity: 0.78;
}

.page-contact .visit__figure figcaption {
  padding: 0.6rem clamp(1rem, 2vw, 1.25rem);
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  color: var(--faint-text);
  border-top: 1px solid var(--line);
}

/* 响应式 */
@media (min-width: 820px) {
  .page-contact .visit__grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    align-items: stretch;
  }
}

@media (min-width: 860px) {
  .page-contact .prep__panel {
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
    align-items: start;
  }
}

@media (min-width: 900px) {
  .page-contact .board {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    align-items: stretch;
  }
}

@media (max-width: 599px) {
  .page-contact .board__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.45rem;
  }

  .page-contact .visit__value {
    max-width: none;
  }
}
<<<PAGE_CSS_END>>>
<<<END>>>

<main id="main-content" class="page-contact">
  <div class="shell">
    <nav class="breadcrumb" aria-label="面包屑导航">
      <ol>
        <li><a href="/">首页</a></li>
        <li aria-current="page">咨询通道</li>
      </ol>
    </nav>
  </div>

  <section class="shell intro">
    <p class="kicker kicker--signal">URUZ · 咨询通道</p>
    <h1>联系澳博中心，把问题交给对的人</h1>
    <p class="intro__lead">
      资料打不开、换了新设备登录不上、想谈渠道合作，或对个人信息怎么被处理有疑问——下面按问题类型分好了通道。邮箱和电话在工作日 9:00 到 18:00 都有同事值守，写清关键信息，通常一轮就能对上。
    </p>
  </section>

  <section class="shell board-wrap" aria-labelledby="board-heading">
    <div class="section-head">
      <span class="section-head__index mono">01</span>
      <h2 class="section-head__title" id="board-heading">直接找到我们</h2>
      <p class="section-head__note">工作日 9:00-18:00 在线</p>
    </div>

    <div class="board">
      <div class="board__channel">
        <img class="board__img" src="{zhanqunpic:h:600w:1200}" width="1200" height="600" alt="冷银信号线在墨蓝网格上延伸并彼此交汇，表达咨询通道持续接通">
        <div class="board__head">
          <span class="tag tag--cyan">值守时段 工作日 9:00-18:00</span>
          <span class="mono board__code">CH · URUZ</span>
        </div>
        <ul class="channel-list">
          <li class="channel">
            <span class="channel__label mono">客服邮箱</span>
            <a class="channel__value" href="mailto:contact@legend-aobo.com.cn">contact@legend-aobo.com.cn</a>
            <span class="channel__note">站点咨询与资料问题都从这里转接，邮件里写清问题所属栏目，我们会派给对应同事。</span>
          </li>
          <li class="channel">
            <span class="channel__label mono">客服电话</span>
            <span class="channel__value">400-7727-1061</span>
            <span class="channel__note">适合需要当场确认的业务咨询，会员身份与资料相关问题在电话里能更快说清楚。</span>
          </li>
        </ul>
      </div>

      <div class="triage">
        <div class="triage__head">
          <h3 class="triage__title">按问题找通道</h3>
          <span class="mono triage__hint">四类</span>
        </div>
        <ul class="triage__list">
          <li class="triage__item">
            <a href="/platform/">
              <span class="triage__idx mono">01</span>
              <span class="triage__name">资料下载</span>
              <span class="triage__desc">指引编号对不上、批次翻不到，或文件打开后是空白页</span>
            </a>
          </li>
          <li class="triage__item">
            <a href="/support/">
              <span class="triage__idx mono">02</span>
              <span class="triage__name">设备登录</span>
              <span class="triage__desc">换手机或换电脑后，身份确认与安全验证停在中途</span>
            </a>
          </li>
          <li class="triage__item">
            <a href="/company/">
              <span class="triage__idx mono">03</span>
              <span class="triage__name">品牌合作</span>
              <span class="triage__desc">渠道洽谈、资料授权与栏目共建的初步沟通</span>
            </a>
          </li>
          <li class="triage__item">
            <a href="/data-privacy/">
              <span class="triage__idx mono">04</span>
              <span class="triage__name">隐私问题</span>
              <span class="triage__desc">浏览、下载与账号校验过程中涉及的个人信息事项</span>
            </a>
          </li>
        </ul>
        <p class="triage__foot">
          登录和下载的常见状况，在 <a href="/support/">支持中心</a> 首屏就能自助走通，常用资料也收在那里，可以先看一眼再联系我们。
        </p>
      </div>
    </div>
  </section>

  <section class="shell prep" aria-labelledby="prep-heading">
    <div class="panel panel--paper prep__panel">
      <div class="prep__intro">
        <p class="kicker">咨询前</p>
        <h2 id="prep-heading">备好四样信息，沟通少绕一圈</h2>
        <p>
          客服拿到下面这些线索，就能直接翻到对应的指引和批次，不必来回确认。资料的使用范围与版本说明写在<a href="/statement/">使用说明</a>里，涉及引用时可以先看一眼。
        </p>
      </div>
      <ol class="prep__list">
        <li>
          <span class="prep__num mono">01</span>
          <strong>批次编号</strong>
          <span class="prep__desc">资料页每份指引都标着批次，例如第 4548 批次，报编号最快。</span>
        </li>
        <li>
          <span class="prep__num mono">02</span>
          <strong>设备类型</strong>
          <span class="prep__desc">手机型号或电脑系统，登录类问题请写清换前和换后各是什么设备。</span>
        </li>
        <li>
          <span class="prep__num mono">03</span>
          <strong>栏目名称</strong>
          <span class="prep__desc">直接说页面属于哪个栏目，比描述点击路径更省事。</span>
        </li>
        <li>
          <span class="prep__num mono">04</span>
          <strong>现象描述</strong>
          <span class="prep__desc">页面提示了什么、卡在哪一步，一两句话说清，附上截图更好定位。</span>
        </li>
      </ol>
    </div>
  </section>

  <section class="shell visit" aria-labelledby="visit-heading">
    <div class="section-head">
      <span class="section-head__index mono">02</span>
      <h2 class="section-head__title" id="visit-heading">到访与寄送</h2>
      <p class="section-head__note">面谈请先邮件约定时间</p>
    </div>

    <div class="visit__grid">
      <div class="visit__address">
        <span class="visit__signal" aria-hidden="true"></span>
        <span class="visit__label mono">联系地址</span>
        <p class="visit__value">上海市浦东新区博云路88号澳博中心大厦12层</p>
        <p class="visit__note">
          需要当面沟通的合作伙伴，请先用客服邮箱约定时段，我们会安排熟悉对应业务的同事接待。纸质资料寄送也请沿用这一地址，并在邮件里告知寄出时间，便于跟进签收。
        </p>
      </div>

      <figure class="visit__figure">
        <img src="{zhanqunpic:h:500w:800}" width="800" height="500" alt="俯视视角的冷色街区网格与一枚定位标记，标示浦东博云路一带的联系点方位" loading="lazy" decoding="async">
        <figcaption class="mono">浦东 · 博云路 88 号</figcaption>
      </figure>
    </div>
  </section>
</main>

.page-contact {
  --pc-gap: clamp(1rem, 2.2vw, 1.5rem);
  --pc-paper-line: rgba(43, 33, 24, 0.14);
  --pc-paper-text: rgba(43, 33, 24, 0.72);
  padding-bottom: clamp(3rem, 7vw, 5.5rem);
}

.page-contact .breadcrumb {
  padding-top: clamp(1.25rem, 3vw, 2rem);
}

/* 首屏说明 */
.page-contact .intro {
  max-width: 80ch;
  padding-top: clamp(0.75rem, 2vw, 1.25rem);
  padding-bottom: clamp(2rem, 5vw, 3.25rem);
}

.page-contact .intro h1 {
  margin: 0.6rem 0 1rem;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(1.9rem, 5.6vw, 3.4rem);
  line-height: 1.14;
  letter-spacing: 0.015em;
  color: var(--mist);
  text-wrap: balance;
}

.page-contact .intro__lead {
  margin: 0;
  max-width: 68ch;
  font-size: clamp(0.95rem, 1.4vw, 1.06rem);
  line-height: 1.8;
  color: var(--soft-text);
}

.page-contact .section-head {
  margin-bottom: var(--pc-gap);
}

/* 联系信息板 */
.page-contact .board {
  display: grid;
  gap: var(--pc-gap);
}

.page-contact .board__channel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: linear-gradient(155deg, var(--ink-800) 0%, var(--ink-900) 58%, var(--ink-850) 100%);
  box-shadow: var(--shadow-soft);
}

.page-contact .board__img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: clamp(110px, 20vw, 176px);
  object-fit: cover;
  opacity: 0.5;
  border-bottom: 1px solid var(--line);
}

.page-contact .board__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 0.9rem;
  padding: 0.85rem clamp(1rem, 2vw, 1.4rem);
  border-bottom: 1px solid var(--line);
  background: rgba(7, 26, 43, 0.45);
}

.page-contact .board__code {
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  color: var(--faint-text);
}

.page-contact .channel-list {
  flex: 1;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-contact .channel {
  display: grid;
  gap: 0.3rem;
  padding: clamp(1rem, 2.4vw, 1.45rem) clamp(1rem, 2vw, 1.4rem);
  border-bottom: 1px dashed var(--line);
}

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

.page-contact .channel__label {
  font-size: 0.68rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--cyan);
}

.page-contact .channel__value {
  display: block;
  max-width: 100%;
  font-family: var(--font-mono);
  font-size: clamp(1rem, 3.6vw, 1.5rem);
  line-height: 1.35;
  color: var(--mist);
  text-decoration: none;
  overflow-wrap: anywhere;
  border-bottom: 1px solid transparent;
  transition: border-color 0.22s ease, color 0.22s ease;
}

.page-contact a.channel__value:hover,
.page-contact a.channel__value:focus-visible {
  color: #ffffff;
  border-bottom-color: var(--cyan);
}

.page-contact .channel__note {
  font-size: 0.84rem;
  line-height: 1.7;
  color: var(--faint-text);
}

/* 问题分诊 */
.page-contact .triage {
  display: flex;
  flex-direction: column;
  min-width: 0;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: var(--ink-800);
  box-shadow: var(--shadow-soft);
}

.page-contact .triage__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.85rem clamp(1rem, 2vw, 1.4rem);
  border-bottom: 1px solid var(--line);
}

.page-contact .triage__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--silver);
}

.page-contact .triage__hint {
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  color: var(--faint-text);
}

.page-contact .triage__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-contact .triage__item a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "idx name"
    "idx desc";
  gap: 0.18rem 0.85rem;
  padding: 0.9rem clamp(1rem, 2vw, 1.4rem);
  border-bottom: 1px solid var(--line);
  color: inherit;
  text-decoration: none;
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

.page-contact .triage__item:last-child a {
  border-bottom: 0;
}

.page-contact .triage__item a:hover,
.page-contact .triage__item a:focus-visible {
  background: rgba(67, 240, 208, 0.07);
  box-shadow: inset 2px 0 0 var(--cyan);
}

.page-contact .triage__idx {
  grid-area: idx;
  padding-top: 0.2rem;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  color: var(--cyan);
}

.page-contact .triage__name {
  grid-area: name;
  font-size: 1rem;
  font-weight: 600;
  color: var(--mist);
}

.page-contact .triage__desc {
  grid-area: desc;
  font-size: 0.82rem;
  line-height: 1.65;
  color: var(--faint-text);
}

.page-contact .triage__foot {
  margin: auto 0 0;
  padding: 0.9rem clamp(1rem, 2vw, 1.4rem);
  border-top: 1px solid var(--line);
  font-size: 0.8rem;
  line-height: 1.7;
  color: var(--soft-text);
}

.page-contact .triage__foot a {
  color: var(--cyan);
  text-decoration: none;
  border-bottom: 1px solid var(--line-cyan);
}

/* 咨询前准备（纸感面板） */
.page-contact .prep {
  margin-top: clamp(2.25rem, 5vw, 3.5rem);
}

.page-contact .prep__panel {
  display: grid;
  gap: clamp(1.25rem, 3vw, 2.25rem);
  padding: clamp(1.25rem, 3vw, 2.25rem);
  color: var(--brown);
}

.page-contact .prep__intro h2 {
  margin: 0.4rem 0 0.7rem;
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 2.6vw, 1.75rem);
  line-height: 1.3;
  letter-spacing: 0.01em;
  color: var(--brown);
}

.page-contact .prep__intro p {
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.75;
  color: var(--pc-paper-text);
}

.page-contact .prep__intro a {
  color: var(--brown);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 106, 61, 0.6);
}

.page-contact .prep__list {
  display: grid;
  gap: 0.85rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-contact .prep__list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "num title"
    "num text";
  gap: 0.2rem 0.9rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid var(--pc-paper-line);
}

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

.page-contact .prep__num {
  grid-area: num;
  padding-top: 0.22rem;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  color: var(--signal);
}

.page-contact .prep__list strong {
  grid-area: title;
  font-size: 0.98rem;
  color: var(--brown);
}

.page-contact .prep__desc {
  grid-area: text;
  font-size: 0.86rem;
  line-height: 1.7;
  color: var(--pc-paper-text);
}

/* 到访与寄送 */
.page-contact .visit {
  margin-top: clamp(2.25rem, 5vw, 3.5rem);
}

.page-contact .visit__grid {
  display: grid;
  gap: var(--pc-gap);
}

.page-contact .visit__address {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  min-width: 0;
  padding: clamp(1.1rem, 2.6vw, 1.75rem);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background:
    repeating-linear-gradient(90deg, rgba(199, 211, 220, 0.07) 0 1px, transparent 1px 44px),
    var(--ink-850);
  box-shadow: var(--shadow-soft);
}

.page-contact .visit__signal {
  position: absolute;
  top: clamp(1.1rem, 2.6vw, 1.75rem);
  right: clamp(1.1rem, 2.6vw, 1.75rem);
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--signal);
  box-shadow: 0 0 0 5px var(--halo-signal);
}

.page-contact .visit__label {
  font-size: 0.68rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--cyan);
}

.page-contact .visit__value {
  margin: 0;
  max-width: 22ch;
  font-family: var(--font-display);
  font-size: clamp(1.1rem, 3vw, 1.5rem);
  line-height: 1.45;
  color: var(--mist);
}

.page-contact .visit__note {
  margin: 0.25rem 0 0;
  font-size: 0.86rem;
  line-height: 1.75;
  color: var(--soft-text);
}

.page-contact .visit__figure {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius);
  background: var(--ink-900);
}

.page-contact .visit__figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: clamp(180px, 34vw, 300px);
  object-fit: cover;
  opacity: 0.78;
}

.page-contact .visit__figure figcaption {
  padding: 0.6rem clamp(1rem, 2vw, 1.25rem);
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  color: var(--faint-text);
  border-top: 1px solid var(--line);
}

/* 响应式 */
@media (min-width: 820px) {
  .page-contact .visit__grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    align-items: stretch;
  }
}

@media (min-width: 860px) {
  .page-contact .prep__panel {
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
    align-items: start;
  }
}

@media (min-width: 900px) {
  .page-contact .board {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    align-items: stretch;
  }
}

@media (max-width: 599px) {
  .page-contact .board__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.45rem;
  }

  .page-contact .visit__value {
    max-width: none;
  }
}
<<<END>>>