.page-privacy {
  --privacy-index-w: 236px;
  --privacy-gap: clamp(24px, 4vw, 64px);
  --privacy-measure: 42em;
  display: block;
}

.page-privacy .visually-hidden-title {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ---------- 页头 ---------- */
.page-privacy .privacy-hero {
  position: relative;
  overflow: hidden;
  border-bottom: 2px solid var(--line);
  padding: clamp(26px, 4vw, 48px) clamp(18px, 5vw, 56px) clamp(34px, 5vw, 68px);
}

.page-privacy .privacy-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(53, 240, 208, 0.16) 1px, transparent 1.4px);
  background-size: 24px 24px;
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.92), transparent 78%);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.92), transparent 78%);
  pointer-events: none;
}

.page-privacy .privacy-hero::after {
  content: "";
  position: absolute;
  right: -10%;
  top: -30%;
  width: 46%;
  height: 150%;
  background: linear-gradient(180deg, rgba(53, 240, 208, 0.07), rgba(230, 57, 70, 0.05));
  transform: rotate(8deg);
  pointer-events: none;
}

.page-privacy .privacy-hero__inner {
  position: relative;
  z-index: 1;
  max-width: var(--shell);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(26px, 4vw, 48px);
}

.page-privacy .privacy-hero__text .breadcrumb {
  margin-bottom: 14px;
  font-size: 12px;
}

.page-privacy .privacy-hero h1 {
  margin: 10px 0 0;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(28px, 5vw, 54px);
  line-height: 1.1;
  letter-spacing: -0.012em;
  color: var(--bone);
  text-wrap: balance;
}

.page-privacy .privacy-hero__lead {
  margin: 18px 0 0;
  max-width: 34em;
  font-size: 15.5px;
  line-height: 1.78;
  color: var(--stone);
}

.page-privacy .privacy-points {
  list-style: none;
  margin: clamp(22px, 3vw, 32px) 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
  counter-reset: pp;
  max-width: 38em;
}

.page-privacy .privacy-points li {
  position: relative;
  counter-increment: pp;
  padding: 12px 14px 12px 46px;
  border: 2px solid var(--line);
  background: rgba(11, 31, 26, 0.72);
  font-size: 14px;
  line-height: 1.65;
  color: var(--stone);
  box-shadow: 4px 4px 0 rgba(6, 18, 15, 0.85);
}

.page-privacy .privacy-points li::before {
  content: "0" counter(pp);
  position: absolute;
  left: 14px;
  top: 12px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--cyan);
}

.page-privacy .privacy-hero__media {
  position: relative;
  overflow: hidden;
  border: 2px solid var(--line);
  background: var(--panel);
  box-shadow: 8px 8px 0 rgba(6, 18, 15, 0.92);
  clip-path: polygon(0 0, 100% 4%, 100% 100%, 0 96%);
}

.page-privacy .privacy-hero__media img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 7 / 5;
  object-fit: cover;
}

/* ---------- 正文区 ---------- */
.page-privacy .privacy-body {
  padding: clamp(38px, 6vw, 84px) clamp(18px, 5vw, 56px) clamp(34px, 8vw, 64px);
}

.page-privacy .privacy-layout {
  max-width: var(--shell);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--privacy-gap);
  align-items: start;
}

/* 条款索引 */
.page-privacy .privacy-index {
  border: 2px solid var(--line);
  background: var(--panel);
  padding: 16px 14px 14px;
  box-shadow: 6px 6px 0 rgba(6, 18, 15, 0.88);
}

.page-privacy .privacy-index__caption {
  margin: 0 0 12px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--stone);
}

.page-privacy .privacy-index__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 2px;
}

.page-privacy .privacy-index__link {
  display: flex;
  gap: 10px;
  align-items: baseline;
  padding: 9px 10px;
  border-left: 2px solid transparent;
  color: var(--stone);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.5;
  transition: color 0.18s var(--ease), border-color 0.18s var(--ease), background-color 0.18s var(--ease);
}

.page-privacy .privacy-index__link:hover,
.page-privacy .privacy-index__link:focus-visible {
  color: var(--bone);
  border-left-color: var(--cyan);
  background: rgba(53, 240, 208, 0.08);
}

.page-privacy .privacy-index__num {
  flex: 0 0 auto;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--cyan);
}

/* 条款 */
.page-privacy .privacy-clauses {
  min-width: 0;
}

.page-privacy .privacy-clause {
  padding: clamp(26px, 3.4vw, 44px) 0;
  border-top: 1px solid var(--line);
  scroll-margin-top: calc(var(--topbar-h) + 32px);
}

.page-privacy .privacy-clause:first-child {
  border-top: 0;
  padding-top: 0;
}

.page-privacy .privacy-clause__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 12px;
}

.page-privacy .clause-no {
  flex: 0 0 auto;
  padding: 3px 9px;
  border: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--yellow);
  background: rgba(255, 201, 60, 0.07);
}

.page-privacy .privacy-clause h2 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(20px, 2.6vw, 28px);
  line-height: 1.3;
  letter-spacing: -0.006em;
  color: var(--bone);
}

.page-privacy .privacy-clause p {
  margin: 16px 0 0;
  max-width: var(--privacy-measure);
  font-size: 15.5px;
  line-height: 1.78;
  color: var(--stone);
}

.page-privacy .clause-list {
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
  display: grid;
  gap: 13px;
  max-width: var(--privacy-measure);
}

.page-privacy .clause-list > li {
  position: relative;
  padding-left: 22px;
  font-size: 15.5px;
  line-height: 1.78;
  color: var(--stone);
}

.page-privacy .clause-list > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.78em;
  width: 9px;
  height: 2px;
  background: var(--cyan);
}

.page-privacy .clause-list strong {
  color: var(--bone);
  font-weight: 700;
}

/* ---------- 底部延伸阅读 ---------- */
.page-privacy .privacy-actions {
  padding: 0 clamp(18px, 5vw, 56px) clamp(64px, 8vw, 108px);
}

.page-privacy .privacy-actions__inner {
  max-width: var(--shell);
  margin: 0 auto;
  border-top: 2px solid var(--line);
  padding-top: clamp(28px, 4vw, 48px);
}

.page-privacy .privacy-actions__inner h2 {
  margin: 10px 0 0;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(22px, 3vw, 34px);
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--bone);
}

.page-privacy .privacy-actions__lead {
  margin: 14px 0 0;
  max-width: 38em;
  font-size: 15px;
  line-height: 1.75;
  color: var(--stone);
}

.page-privacy .privacy-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: clamp(22px, 3vw, 32px);
}

.page-privacy .privacy-card {
  display: block;
  padding: 18px 18px 20px;
  border: 2px solid var(--line);
  background: var(--panel);
  color: var(--bone);
  text-decoration: none;
  box-shadow: 5px 5px 0 rgba(6, 18, 15, 0.9);
  transition: transform 0.2s var(--ease), box-shadow 0.2s var(--ease), border-color 0.2s var(--ease);
}

.page-privacy .privacy-card:hover,
.page-privacy .privacy-card:focus-visible {
  transform: translateY(-4px);
  box-shadow: 6px 9px 0 rgba(6, 18, 15, 0.95);
  border-color: var(--cyan);
}

.page-privacy .privacy-card__no {
  display: inline-block;
  margin-bottom: 12px;
  padding: 2px 8px;
  border: 1px solid var(--cyan);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--cyan);
}

.page-privacy .privacy-card__title {
  display: block;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.45;
  color: var(--bone);
}

.page-privacy .privacy-card__desc {
  display: block;
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--stone);
}

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

@media (min-width: 900px) {
  .page-privacy .privacy-hero__inner {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    align-items: end;
  }

  .page-privacy .privacy-hero__media img {
    aspect-ratio: 7 / 6;
  }
}

@media (min-width: 960px) {
  .page-privacy .privacy-layout {
    grid-template-columns: var(--privacy-index-w) minmax(0, 1fr);
  }

  .page-privacy .privacy-index {
    position: sticky;
    top: calc(var(--topbar-h) + 24px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-privacy .privacy-index__link,
  .page-privacy .privacy-card {
    transition: none;
  }

  .page-privacy .privacy-card:hover,
  .page-privacy .privacy-card:focus-visible {
    transform: none;
  }
}
</main>
<<<END>>>

等一下——我在 CSS 后面意外加了 `</main>`。这是输出错误！我要修正。

实际上看我的输出，我写的是：

```
  </button>
</main>

...
</main>
<<<END>>>
```

最后那个 `</main>` 不应该在那里。我来修正——去掉它。

其实我之前已经用 `</main>` 关闭了 main——末尾那个 `</main>` 是多余的。把它删掉。页面 CSS 应该在样式块之后直接结束，不需要 `</main>`。

重新输出，删掉那个末尾的 `</main>`。

还要修正结尾——不应该有 `<<<END>>>` 标记，因为协议只指定了两个标记。

重新输出干净的版本。
<main id="main-content" class="page-privacy">
  <header class="privacy-hero">
    <div class="privacy-hero__inner">
      <div class="privacy-hero__text">
        <nav class="breadcrumb" aria-label="当前位置">
          <a href="/">首页</a>
          <span class="breadcrumb__sep">/</span>
          <span class="breadcrumb__current">隐私政策</span>
        </nav>
        <p class="eyebrow">隐私政策</p>
        <h1>注册、订阅与关注：你的信息如何被使用和保存</h1>
        <p class="privacy-hero__lead">你在 360体育站留下手机号、订阅球队、把球队加进关注列表的时候，最需要知道的是这些信息去了哪里、保留多久、想收回时该怎么做。下面分六个方面说清楚。</p>
        <ul class="privacy-points">
          <li>只记录提供服务必需的信息，不做与查数据无关的用途。</li>
          <li>订阅记录与关注列表保存在你的账号下，可以单条删除，也可以整体注销。</li>
          <li>查询、更正、撤回订阅都能自助完成，也可以通过站内反馈通道提出。</li>
        </ul>
      </div>
      <div class="privacy-hero__media">
        <img src="{zhanqunpic:h:600w:1400}" width="1400" height="600" alt="由网格、节点与连线构成的抽象数据纹理，墨绿底配荧光青线条">
      </div>
    </div>
  </header>

  <section class="section privacy-body" aria-labelledby="privacy-body-title">
    <h2 id="privacy-body-title" class="visually-hidden-title">条款正文</h2>
    <div class="privacy-layout">
      <nav class="privacy-index" aria-label="条款索引">
        <p class="privacy-index__caption">条款索引 · 共 6 条</p>
        <ol class="privacy-index__list">
          <li><a class="privacy-index__link" href="#collect"><span class="privacy-index__num">01</span>收集范围</a></li>
          <li><a class="privacy-index__link" href="#usage"><span class="privacy-index__num">02</span>使用场景</a></li>
          <li><a class="privacy-index__link" href="#storage"><span class="privacy-index__num">03</span>Cookie 与本地存储</a></li>
          <li><a class="privacy-index__link" href="#sharing"><span class="privacy-index__num">04</span>第三方服务</a></li>
          <li><a class="privacy-index__link" href="#retention"><span class="privacy-index__num">05</span>保存与防护</a></li>
          <li><a class="privacy-index__link" href="#rights"><span class="privacy-index__num">06</span>你的权利</a></li>
        </ol>
      </nav>

      <div class="privacy-clauses">
        <article class="privacy-clause" id="collect" data-reveal>
          <div class="privacy-clause__head">
            <span class="clause-no">01</span>
            <h2>注册、订阅与浏览时，我们会拿到哪些信息</h2>
          </div>
          <p>以下三类内容会进入你的账号，其余不会关联到你个人。</p>
          <ul class="clause-list">
            <li><strong>账号信息</strong>——注册时填写的手机号或邮箱，以及你设定的昵称。手机号或邮箱用于登录识别与提醒送达，昵称显示在关注列表和订阅设置里。</li>
            <li><strong>订阅与关注记录</strong>——你订阅了哪支球队、关注列表里放了哪些队、希望用邮件还是站内消息接收提醒。订阅一支球队后，每场赛后 15 分钟内推送该队数据，依据就是这份记录。</li>
            <li><strong>设备与浏览信息</strong>——访问时使用的设备类型、浏览器版本、所在大致地区，以及你在电脑端、平板、手机三档界面上的页面访问情况，用来定位加载异常和调整版式。</li>
          </ul>
        </article>

        <article class="privacy-clause" id="usage" data-reveal>
          <div class="privacy-clause__head">
            <span class="clause-no">02</span>
            <h2>这些信息被用在哪些地方</h2>
          </div>
          <ul class="clause-list">
            <li><strong>把提醒送对人</strong>——订阅记录决定赛后刷新时把哪支球队的数据发给你，按球队与按栏目分别开启的提醒不会互相干扰。</li>
            <li><strong>让关注列表跟着你走</strong>——同一份关注列表在电脑端左侧常驻栏和手机端抽屉里同步显示，最多可同时关注 12 支球队，换设备登录后依然在。</li>
            <li><strong>让查数更快</strong>——按轮次、按球队、按赛季的导出记录与最近浏览位置，帮你接着上次的地方继续看，不必从头翻轮次。</li>
            <li><strong>守住账号</strong>——识别异常登录与异常批量导出，在你没有操作的情况下先一步拦下来。</li>
            <li><strong>决定下一步完善什么</strong>——看清哪些赛季阶段、哪些栏目的资料被用得最多，再决定把编辑力量投到哪一块。</li>
          </ul>
        </article>

        <article class="privacy-clause" id="storage" data-reveal>
          <div class="privacy-clause__head">
            <span class="clause-no">03</span>
            <h2>Cookie 与本地存储分别留住什么</h2>
          </div>
          <p>浏览器端的本地存储用来记住状态，不承担识别个人身份的作用。</p>
          <ul class="clause-list">
            <li><strong>登录状态</strong>——让你在一段时间内不必反复输入账号。</li>
            <li><strong>界面偏好</strong>——侧边轨道展开还是收起、上次停留的栏目、赛事日历上的显示密度。</li>
            <li><strong>未登录时的关注草稿</strong>——还没注册就把球队加进关注列表，草稿会先存在本地，注册后合并进账号。</li>
          </ul>
          <p>你可以随时在浏览器设置里清除 Cookie 和本地存储。清除之后需要重新登录，未登录状态下的界面偏好会回到默认值。</p>
        </article>

        <article class="privacy-clause" id="sharing" data-reveal>
          <div class="privacy-clause__head">
            <span class="clause-no">04</span>
            <h2>哪些环节会涉及第三方服务方</h2>
          </div>
          <ul class="clause-list">
            <li><strong>提醒送达</strong>——邮件与短信通道由第三方服务商承担，只传递送达地址与提醒标题，不含关注列表明细。</li>
            <li><strong>访问统计</strong>——使用第三方统计服务查看栏目使用情况，接收的是聚合后的数据，不指向单个账号。</li>
            <li><strong>依法配合</strong>——在法律法规明确要求或主管部门依法提出时，按要求的范围提供。</li>
            <li><strong>对外合作</strong>——与地方体育媒体、高校体育院系的内容合作只涉及聚合后的轮次统计，合作方接触不到用户账号。</li>
          </ul>
        </article>

        <article class="privacy-clause" id="retention" data-reveal>
          <div class="privacy-clause__head">
            <span class="clause-no">05</span>
            <h2>信息保留多久，以及我们做了哪些防护</h2>
          </div>
          <ul class="clause-list">
            <li><strong>账号信息</strong>——在账号存续期间保留；提交注销后进入删除流程。</li>
            <li><strong>订阅与关注记录</strong>——关闭订阅或从关注列表移除后，不再用于推送，并在 30 天内从待发队列中清理。</li>
            <li><strong>设备与浏览信息</strong>——按统计周期滚动保留，超出周期后自动汇总为不指向个人的数据。</li>
          </ul>
          <p>传输环节走加密通道；数据库访问按岗位角色划分权限，涉及资料导出的操作单独留存操作日志，便于回溯。</p>
        </article>

        <article class="privacy-clause" id="rights" data-reveal>
          <div class="privacy-clause__head">
            <span class="clause-no">06</span>
            <h2>你可以怎么查、怎么改、怎么删</h2>
          </div>
          <ul class="clause-list">
            <li><strong>查询与更正</strong>——登录后可在账号设置里直接查看手机号、邮箱、昵称与关注列表；需要修改的内容也可以在站内反馈通道提交，工作日 9:00 至 18:00 有专人跟进。</li>
            <li><strong>删除</strong>——可以单独移除某支球队的关注记录、关闭某一类提醒，或者申请注销账号。注销后账号信息进入删除流程。</li>
            <li><strong>撤回订阅</strong>——把邮件与站内消息的开关关掉，推送立即停止；再打开就恢复。</li>
          </ul>
          <p>客服邮箱 support@mg-arena360.com.cn，电话 400-1139-3136，来信与来电都会登记跟进。赛事数据与订阅相关的问题，建议优先通过站内反馈通道提交，处理起来更快。</p>
        </article>
      </div>
    </div>
  </section>

  <section class="section privacy-actions" aria-labelledby="privacy-actions-title">
    <div class="privacy-actions__inner">
      <p class="eyebrow">继续了解</p>
      <h2 id="privacy-actions-title">还有这些问题，可以接着看</h2>
      <p class="privacy-actions__lead">如果你关心的是资料能不能引用、日历怎么设、或者想把数据接进自己的栏目，下面三处有对应的说法。</p>
      <div class="privacy-cards">
        <a class="privacy-card" href="/disclaimer/">
          <span class="privacy-card__no">A</span>
          <span class="privacy-card__title">数据来源与资料使用规范</span>
          <span class="privacy-card__desc">下载与引用联赛资料之前，先看统计范围和转载说明。</span>
        </a>
        <a class="privacy-card" href="/answers/">
          <span class="privacy-card__no">B</span>
          <span class="privacy-card__title">使用与订阅常见问题</span>
          <span class="privacy-card__desc">日历怎么按日期看、红黄牌记录在哪查、订阅后什么时候刷新。</span>
        </a>
        <a class="privacy-card" href="/cooperation/">
          <span class="privacy-card__no">C</span>
          <span class="privacy-card__title">数据服务对接与内容合作</span>
          <span class="privacy-card__desc">媒体、高校与活动方的对接方式与响应节奏。</span>
        </a>
      </div>
    </div>
  </section>

  <button type="button" class="to-top" data-to-top aria-label="返回顶部">
    <span class="to-top__arrow" aria-hidden="true">↑</span>
    <span class="to-top__text">顶部</span>
  </button>
</main>

.page-privacy {
  --privacy-index-w: 236px;
  --privacy-gap: clamp(24px, 4vw, 64px);
  --privacy-measure: 42em;
  display: block;
}

.page-privacy .visually-hidden-title {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ---------- 页头 ---------- */
.page-privacy .privacy-hero {
  position: relative;
  overflow: hidden;
  border-bottom: 2px solid var(--line);
  padding: clamp(26px, 4vw, 48px) clamp(18px, 5vw, 56px) clamp(34px, 5vw, 68px);
}

.page-privacy .privacy-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(53, 240, 208, 0.16) 1px, transparent 1.4px);
  background-size: 24px 24px;
  -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.92), transparent 78%);
  mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.92), transparent 78%);
  pointer-events: none;
}

.page-privacy .privacy-hero::after {
  content: "";
  position: absolute;
  right: -10%;
  top: -30%;
  width: 46%;
  height: 150%;
  background: linear-gradient(180deg, rgba(53, 240, 208, 0.07), rgba(230, 57, 70, 0.05));
  transform: rotate(8deg);
  pointer-events: none;
}

.page-privacy .privacy-hero__inner {
  position: relative;
  z-index: 1;
  max-width: var(--shell);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(26px, 4vw, 48px);
}

.page-privacy .privacy-hero__text .breadcrumb {
  margin-bottom: 14px;
  font-size: 12px;
}

.page-privacy .privacy-hero h1 {
  margin: 10px 0 0;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(28px, 5vw, 54px);
  line-height: 1.1;
  letter-spacing: -0.012em;
  color: var(--bone);
  text-wrap: balance;
}

.page-privacy .privacy-hero__lead {
  margin: 18px 0 0;
  max-width: 34em;
  font-size: 15.5px;
  line-height: 1.78;
  color: var(--stone);
}

.page-privacy .privacy-points {
  list-style: none;
  margin: clamp(22px, 3vw, 32px) 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
  counter-reset: pp;
  max-width: 38em;
}

.page-privacy .privacy-points li {
  position: relative;
  counter-increment: pp;
  padding: 12px 14px 12px 46px;
  border: 2px solid var(--line);
  background: rgba(11, 31, 26, 0.72);
  font-size: 14px;
  line-height: 1.65;
  color: var(--stone);
  box-shadow: 4px 4px 0 rgba(6, 18, 15, 0.85);
}

.page-privacy .privacy-points li::before {
  content: "0" counter(pp);
  position: absolute;
  left: 14px;
  top: 12px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--cyan);
}

.page-privacy .privacy-hero__media {
  position: relative;
  overflow: hidden;
  border: 2px solid var(--line);
  background: var(--panel);
  box-shadow: 8px 8px 0 rgba(6, 18, 15, 0.92);
  clip-path: polygon(0 0, 100% 4%, 100% 100%, 0 96%);
}

.page-privacy .privacy-hero__media img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  aspect-ratio: 7 / 5;
  object-fit: cover;
}

/* ---------- 正文区 ---------- */
.page-privacy .privacy-body {
  padding: clamp(38px, 6vw, 84px) clamp(18px, 5vw, 56px) clamp(34px, 8vw, 64px);
}

.page-privacy .privacy-layout {
  max-width: var(--shell);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--privacy-gap);
  align-items: start;
}

/* 条款索引 */
.page-privacy .privacy-index {
  border: 2px solid var(--line);
  background: var(--panel);
  padding: 16px 14px 14px;
  box-shadow: 6px 6px 0 rgba(6, 18, 15, 0.88);
}

.page-privacy .privacy-index__caption {
  margin: 0 0 12px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--stone);
}

.page-privacy .privacy-index__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 2px;
}

.page-privacy .privacy-index__link {
  display: flex;
  gap: 10px;
  align-items: baseline;
  padding: 9px 10px;
  border-left: 2px solid transparent;
  color: var(--stone);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.5;
  transition: color 0.18s var(--ease), border-color 0.18s var(--ease), background-color 0.18s var(--ease);
}

.page-privacy .privacy-index__link:hover,
.page-privacy .privacy-index__link:focus-visible {
  color: var(--bone);
  border-left-color: var(--cyan);
  background: rgba(53, 240, 208, 0.08);
}

.page-privacy .privacy-index__num {
  flex: 0 0 auto;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--cyan);
}

/* 条款 */
.page-privacy .privacy-clauses {
  min-width: 0;
}

.page-privacy .privacy-clause {
  padding: clamp(26px, 3.4vw, 44px) 0;
  border-top: 1px solid var(--line);
  scroll-margin-top: calc(var(--topbar-h) + 32px);
}

.page-privacy .privacy-clause:first-child {
  border-top: 0;
  padding-top: 0;
}

.page-privacy .privacy-clause__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 12px;
}

.page-privacy .clause-no {
  flex: 0 0 auto;
  padding: 3px 9px;
  border: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.14em;
  color: var(--yellow);
  background: rgba(255, 201, 60, 0.07);
}

.page-privacy .privacy-clause h2 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(20px, 2.6vw, 28px);
  line-height: 1.3;
  letter-spacing: -0.006em;
  color: var(--bone);
}

.page-privacy .privacy-clause p {
  margin: 16px 0 0;
  max-width: var(--privacy-measure);
  font-size: 15.5px;
  line-height: 1.78;
  color: var(--stone);
}

.page-privacy .clause-list {
  list-style: none;
  margin: 18px 0 0;
  padding: 0;
  display: grid;
  gap: 13px;
  max-width: var(--privacy-measure);
}

.page-privacy .clause-list > li {
  position: relative;
  padding-left: 22px;
  font-size: 15.5px;
  line-height: 1.78;
  color: var(--stone);
}

.page-privacy .clause-list > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.78em;
  width: 9px;
  height: 2px;
  background: var(--cyan);
}

.page-privacy .clause-list strong {
  color: var(--bone);
  font-weight: 700;
}

/* ---------- 底部延伸阅读 ---------- */
.page-privacy .privacy-actions {
  padding: 0 clamp(18px, 5vw, 56px) clamp(64px, 8vw, 108px);
}

.page-privacy .privacy-actions__inner {
  max-width: var(--shell);
  margin: 0 auto;
  border-top: 2px solid var(--line);
  padding-top: clamp(28px, 4vw, 48px);
}

.page-privacy .privacy-actions__inner h2 {
  margin: 10px 0 0;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(22px, 3vw, 34px);
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--bone);
}

.page-privacy .privacy-actions__lead {
  margin: 14px 0 0;
  max-width: 38em;
  font-size: 15px;
  line-height: 1.75;
  color: var(--stone);
}

.page-privacy .privacy-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: clamp(22px, 3vw, 32px);
}

.page-privacy .privacy-card {
  display: block;
  padding: 18px 18px 20px;
  border: 2px solid var(--line);
  background: var(--panel);
  color: var(--bone);
  text-decoration: none;
  box-shadow: 5px 5px 0 rgba(6, 18, 15, 0.9);
  transition: transform 0.2s var(--ease), box-shadow 0.2s var(--ease), border-color 0.2s var(--ease);
}

.page-privacy .privacy-card:hover,
.page-privacy .privacy-card:focus-visible {
  transform: translateY(-4px);
  box-shadow: 6px 9px 0 rgba(6, 18, 15, 0.95);
  border-color: var(--cyan);
}

.page-privacy .privacy-card__no {
  display: inline-block;
  margin-bottom: 12px;
  padding: 2px 8px;
  border: 1px solid var(--cyan);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--cyan);
}

.page-privacy .privacy-card__title {
  display: block;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.45;
  color: var(--bone);
}

.page-privacy .privacy-card__desc {
  display: block;
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--stone);
}

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

@media (min-width: 900px) {
  .page-privacy .privacy-hero__inner {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    align-items: end;
  }

  .page-privacy .privacy-hero__media img {
    aspect-ratio: 7 / 6;
  }
}

@media (min-width: 960px) {
  .page-privacy .privacy-layout {
    grid-template-columns: var(--privacy-index-w) minmax(0, 1fr);
  }

  .page-privacy .privacy-index {
    position: sticky;
    top: calc(var(--topbar-h) + 24px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-privacy .privacy-index__link,
  .page-privacy .privacy-card {
    transition: none;
  }

  .page-privacy .privacy-card:hover,
  .page-privacy .privacy-card:focus-visible {
    transform: none;
  }
}