/* ==========================================================================
   Cookies Policy 页（/cookies）
   设计稿：node 9385-34238（白底、居中标题区、三分类四列表格）
   ========================================================================== */

.cookies {
  position: relative;
  /* BFC：防止标题外边距塌陷到父级，保证 ::before 从页面 y=0 开始 */
  display: flow-root;
  min-height: 100vh;
  background: #ffffff;
}

/* 全站约定：公共 header.css 依赖 --white / --blue 变量，各页面 :root 统一提供 */
:root {
  --blue: #0A47ED;
  --text-dark: #3E3E3E;
  --white: #FFFFFF;

  --font: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-cn: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 页脚 ::before 以 100vw 铺黑（含滚动条宽度），横向溢出统一由 html 裁剪。
   clip 彻底禁止横向滚动（含程序滚动），旧浏览器回退 hidden */
html {
  overflow-x: hidden;
  overflow-x: clip;
}

body {
  font-family: var(--font);
  background: var(--white);
  color: var(--text-dark);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 全局元素重置（与 news / contact 等页一致，公共 header 依赖这些重置） */
img {
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

ul {
  list-style: none;
}

button {
  font-family: inherit;
  border: none;
  background: none;
  cursor: pointer;
  color: inherit;
}

/* ===== 顶部装饰：75px 纯色 #537EF2，之后较短距离渐变淡入白底 ===== */
.cookies::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 200px;
  background: linear-gradient(180deg, #537ef2 0, #537ef2 75px, rgba(83, 126, 242, 0) 100%);
  pointer-events: none;
}

/* ===== 页头：标题 + 说明（840 居中，y=164 起） ===== */
.cookies__head {
  width: 840px;
  margin: 164px auto 0;
}

.cookies__title {
  font-size: 48px;
  font-weight: 500;
  line-height: 60px;
  color: #041884;
}

.cookies__desc {
  margin-top: 20px;
  font-size: 18px;
  line-height: 30px;
  color: #3e3e3e;
}

/* ===== 分类区（800 居中） ===== */
.cookies__section {
  width: 840px;
  margin: 30px auto 0;
  padding-bottom: 30px;
}

.cookies__section-title {
  font-size: 30px;
  font-weight: 700;
  line-height: 40px;
  color: #000000;
}

/* 表格外层：小屏横向滚动 */
.cookies__table-wrap {
  margin-top: 10px;
  overflow-x: auto;
}

/* ===== 表格：4 列 × 200，行高 48，黑色 1px 边框 ===== */
.cookies__table {
  width: 800px;
  margin: 10px auto 0;
  border-collapse: collapse;
  table-layout: fixed;
}

.cookies__table th,
.cookies__table td {
  width: 200px;
  border: 1px solid #000000;
  vertical-align: middle;
  text-align: left;
}

/* 表头行：浅蓝底 #F5F7FF、18px 居中 */
.cookies__table thead th {
  height: 48px;
  padding: 9px 10px;
  background: #f5f7ff;
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  color: #000000;
  text-align: center;
}

/* 数据行：白底、12px、左内边距 15、垂直居中 */
.cookies__table tbody td {
  height: 48px;
  padding: 6px 15px;
  font-size: 12px;
  line-height: 18px;
  color: #000000;
  word-break: break-word;
}

/* 响应式：小屏表格可横向滚动，页头与分类区通栏收窄 */
@media (max-width: 900px) {
  .cookies__head,
  .cookies__section {
    width: auto;
    margin-left: 20px;
    margin-right: 20px;
  }
}

@media (max-width: 840px) {
  .cookies__head {
    margin-top: 120px;
  }
}

/* ==========================================================================
   富文本正文（后台「专题管理 › 隐私协议」维护，前台 /cookies 生效）
   按语义标签兜底样式：h1/h2/p/table，保证后台编辑后仍与设计稿一致
   ========================================================================== */
.cookies__content {
  width: 840px;
  margin: 164px auto 0;
  padding-bottom: 30px;
}

.cookies__content > *:first-child {
  margin-top: 0;
}

.cookies__content h1 {
  font-size: 48px;
  font-weight: 500;
  line-height: 60px;
  color: #041884;
}

.cookies__content h2 {
  margin-top: 30px;
  font-size: 30px;
  font-weight: 700;
  line-height: 40px;
  color: #000000;
}

.cookies__content p {
  margin-top: 20px;
  font-size: 18px;
  line-height: 30px;
  color: #3e3e3e;
}

.cookies__content table {
  width: 800px;
  max-width: 100%;
  margin: 10px auto 0;
  border-collapse: collapse;
  table-layout: fixed;
}

.cookies__content table th,
.cookies__content table td {
  border: 1px solid #000000;
  vertical-align: middle;
  text-align: left;
}

.cookies__content table th {
  height: 48px;
  padding: 9px 10px;
  background: #f5f7ff;
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  color: #000000;
  text-align: center;
}

.cookies__content table td {
  height: 48px;
  padding: 6px 15px;
  font-size: 12px;
  line-height: 18px;
  color: #000000;
  word-break: break-word;
}

@media (max-width: 900px) {
  .cookies__content {
    width: auto;
    margin-left: 20px;
    margin-right: 20px;
  }
}

@media (max-width: 840px) {
  .cookies__content {
    margin-top: 120px;
  }
}
