/**
 * retech/download-list —— Download Center 的三种文档清单形态。
 *
 * CSS 1:1 移植自 ret-ch/assets/css/solutions.css §「Download Center」(830–918)
 * 与响应式补充段(924 ≤1240 / 927–928 ≤1080 / 931–935 ≤700):
 *   .dl-cat-grid / .dl-cat-card(+hover / > a)/ .dl-cat-head / .dl-cat-title /
 *   .dl-cat-count / .dl-cat-desc / .dl-cat-card .route-points /
 *   .dl-cat-card .link-arrow / .dl-doc-grid / .dl-doc-card(+hover)/
 *   .dl-doc-type / .dl-doc-title / .dl-doc-meta(> div / dt / dd)/ .dl-doc-actions /
 *   .btn.is-disabled / .dl-list / .dl-row / .dl-row-title / .dl-row-meta。
 * 类名按 `<共享前缀>-dl-*` 平移,颜色/圆角/阴影/时长全部换成本站 token
 * (`--line`→`--retech-x-line`、`--cyan-dark`→`--retech-x-tech-dark`、
 *  `--green`→`--retech-x-flow`、`--sh-md`→`--retech-x-sh-md` …)。
 *
 * 分工(见 CONVERSION.md §CSS 分层):
 *   · @layer retech-block       本块的静态样式
 *   · @layer retech-responsive  本块的断点(原型只在 1240 / 1080 / 700 三档有规则)
 *   · 共享类(.retech-x-section* / .retech-x-wrap / .retech-x-section-head /
 *     .retech-x-eyebrow / .retech-x-h2 / .retech-x-section-lead / .retech-x-alt /
 *     .retech-x-btn* / .retech-x-link-arrow)的属主是 blocks/style-index.css,
 *     本文件只消费。凡需改共享类观感,一律在本块元素作用域内覆盖
 *     (`.retech-x-dl-cat-card .retech-x-link-arrow { … }` 这类双类选择器),
 *     绝不单独锚定别人的类名 —— check-css 的 E5 会把「同名被两个块文件锚定」判死。
 *
 * ★ `ul.retech-x-route-points` 的**属主是 blocks/output-routes**:分类卡的要点列表
 *   复用它(exactly 原型做法:共享 `.route-points` + `.dl-cat-card` 作用域覆盖)。
 *   本文件只在 `.retech-x-dl-cat-card` 作用域内改边距与圆点颜色(绿 = 循环/产出)。
 *   css-auto-loader 会按渲染出的类名把 output-routes/style.css 按需入队。
 *
 * ★ `.retech-x-dl-disabled` = 原型 `.btn.is-disabled{opacity:.45;pointer-events:none;
 *   cursor:not-allowed}`。共享的 `.retech-x-btn[aria-disabled="true"]`(base 层)给的是
 *   .6,本块的类在 block 层,层序更高 ⇒ 稳定覆盖成原型的 .45。这是**本块自己的类**,
 *   不去改共享按钮。
 *
 * ★ 未移植的一行(原型同段内的 `.factor-card p strong { color:#fff }`):
 *   它属于 `sec sec--dark #detail-template` 的 `.factor-grid`,而 `.factor-card` 的
 *   属主是 blocks/factors —— 本块不锚定别人的类,那条留在 factors 的属地里。
 */

@layer retech-block {
  /* ── 段尾小字(原型 `p.sol-note`;共享类属主是 blocks/proof,这里只在
     `.retech-x-dl` 作用域内补齐下载族的尺寸 —— 不让「.retech-x-sol-note 被两个
     块文件锚定」触发 check-css 的 E5)─────────────────────────────────────
     原型 retech.css:217:margin-top:30px / 13px / ink-3。 */
  .retech-x-dl .retech-x-sol-note {
    margin-top: 30px;
    color: var(--retech-x-ink-3);
    font-size: 13px;
    line-height: 1.68;
  }

  /* ── 分类卡栅格(原型 834–861)────────────────────────────────────────── */
  .retech-x-dl-cat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
  }
  .retech-x-dl-cat-card {
    border: 1px solid var(--retech-x-line);
    border-radius: var(--retech-x-r-lg);
    background: var(--retech-x-white);
    transition: border-color var(--retech-x-dur) var(--retech-x-ease-ui),
                box-shadow var(--retech-x-dur) var(--retech-x-ease-ui),
                transform var(--retech-x-dur) var(--retech-x-ease-ui);
  }
  .retech-x-dl-cat-card:hover {
    border-color: rgba(118, 192, 67, 0.5);
    box-shadow: var(--retech-x-sh-md);
    transform: translateY(-3px);
  }
  .retech-x-dl-cat-card > a {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 28px 26px 26px;
  }
  .retech-x-dl-cat-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
  }
  .retech-x-dl-cat-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.32;
    color: var(--retech-x-ink);
    letter-spacing: -0.012em;
  }
  .retech-x-dl-cat-count {
    flex: 0 0 auto;
    color: var(--retech-x-tech-dark);
    font-family: var(--wp--preset--font-family--mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    white-space: nowrap;
  }
  .retech-x-dl-cat-desc {
    display: block;
    margin-top: 11px;
    color: var(--retech-x-ink-3);
    font-size: 13px; /* 原型 --fs-xs(retech.css:95) */
    line-height: 1.6;
  }
  /* 要点列表:基础样式属主是 blocks/output-routes,这里只做卡片作用域内的差异。 */
  .retech-x-dl-cat-card .retech-x-route-points {
    margin-top: 18px;
    padding-top: 18px;
  }
  .retech-x-dl-cat-card .retech-x-route-points li::before {
    box-shadow: inset 0 0 0 3px var(--retech-x-flow);
  }
  .retech-x-dl-cat-card .retech-x-link-arrow {
    color: var(--retech-x-flow-dark);
  }

  /* ── 文档卡栅格(原型 864–900)────────────────────────────────────────── */
  .retech-x-dl-doc-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }
  .retech-x-dl-doc-card {
    display: flex;
    flex-direction: column;
    padding: 26px 24px;
    border: 1px solid var(--retech-x-line);
    border-radius: var(--retech-x-r-lg);
    background: var(--retech-x-white);
    transition: border-color var(--retech-x-dur) var(--retech-x-ease-ui),
                box-shadow var(--retech-x-dur) var(--retech-x-ease-ui);
  }
  .retech-x-dl-doc-card:hover {
    border-color: rgba(24, 175, 196, 0.44);
    box-shadow: var(--retech-x-sh-md);
  }
  .retech-x-dl-doc-type {
    margin-bottom: 10px;
    color: var(--retech-x-tech-dark);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }
  .retech-x-dl-doc-title {
    font-size: 17px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--retech-x-ink);
    letter-spacing: -0.01em;
  }
  .retech-x-dl-doc-meta {
    display: grid;
    gap: 8px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--retech-x-line);
  }
  .retech-x-dl-doc-meta > div {
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr);
    gap: 12px;
    align-items: baseline;
  }
  .retech-x-dl-doc-meta dt {
    color: var(--retech-x-ink-3);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
  }
  .retech-x-dl-doc-meta dd {
    color: var(--retech-x-ink-2);
    font-size: 13px; /* 原型 --fs-xs */
    line-height: 1.5;
  }
  .retech-x-dl-doc-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: auto;
    padding-top: 22px;
  }

  /* 未就绪的下载按钮:不可点击但保留视觉占位(原型 905)。 */
  .retech-x-dl-disabled {
    opacity: 0.45;
    pointer-events: none;
    cursor: not-allowed;
  }

  /* ── 行列表(分类页 `ul.dl-list`,原型 907–917)───────────────────────── */
  .retech-x-dl-list {
    border-top: 1px solid var(--retech-x-line);
  }
  .retech-x-dl-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 20px;
    align-items: center;
    padding: 22px 0;
    border-bottom: 1px solid var(--retech-x-line);
  }
  .retech-x-dl-row-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--retech-x-ink);
  }
  .retech-x-dl-row-meta {
    margin-top: 6px;
    color: var(--retech-x-ink-3);
    font-size: 13px; /* 原型 --fs-xs */
  }
}

@layer retech-responsive {
  /* 原型 solutions.css:924(≤1240):分类卡 3 → 2 列。 */
  @media (max-width: 1240px) {
    .retech-x-dl-cat-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  /* 原型 solutions.css:927–928(≤1080):分类卡仍 2 列,文档卡 2 → 1 列。 */
  @media (max-width: 1080px) {
    .retech-x-dl-cat-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .retech-x-dl-doc-grid {
      grid-template-columns: minmax(0, 1fr);
    }
  }

  /* 原型 solutions.css:931–935(≤700,原型写 767 档收敛到本项目断点)。 */
  @media (max-width: 700px) {
    .retech-x-dl-cat-grid {
      grid-template-columns: minmax(0, 1fr);
    }
    .retech-x-dl-doc-meta > div {
      grid-template-columns: minmax(0, 1fr);
      gap: 3px;
    }
    .retech-x-dl-row {
      grid-template-columns: minmax(0, 1fr);
    }
  }

  /* 尊重系统「减少动态效果」(原型 retech.css 的全局 reduced-motion 段同义)。 */
  @media (prefers-reduced-motion: reduce) {
    .retech-x-dl-cat-card,
    .retech-x-dl-doc-card {
      transition: none;
    }
    .retech-x-dl-cat-card:hover {
      transform: none;
    }
  }
}
