/* POPHIES Downloads page — page-specific rules only.
   Source: 网站规划.md §6.7 (lines 232–252) and §10 (lines 529–558).
   Shared classes and tokens live in assets/css/tokens.css and style.css. */

/* ---------- The document kinds ---------- */

.dl-kinds { margin-top: 3rem; }

.dl-kind {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.dl-kind .card__link { margin-top: auto; }

/* ---------- A group of live records ---------- */

.dl-group { margin-top: 4rem; }

.dl-group__title {
  margin: 0 0 1.5rem;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid var(--stone);
  font-family: var(--font-display);
  font-size: var(--fs-label);
  font-weight: 700;
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  color: var(--brass);
}

.dl-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.dl-item {
  min-width: 0;
  padding: 1.75rem 0;
}

.dl-item + .dl-item { border-top: 1px solid var(--stone); }

.dl-item__head {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  align-items: baseline;
  justify-content: space-between;
}

.dl-item__title {
  margin: 0;
  font-size: var(--fs-h4);
  font-weight: 700;
  letter-spacing: var(--track-tight);
  color: var(--ink);
}

.dl-item__head .card__tags { margin: 0; }

.dl-item__text {
  max-width: var(--read);
  margin: 0.75rem 0 0;
  font-size: var(--fs-small);
  line-height: 1.65;
  color: var(--graphite);
}

/* ---------- Record metadata ---------- */

.dl-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 2rem;
  margin: 1rem 0 0;
}

.dl-meta__row {
  display: flex;
  gap: 0.5rem;
  align-items: baseline;
  min-width: 0;
}

.dl-meta dt {
  font-family: var(--font-display);
  font-size: var(--fs-label);
  font-weight: 700;
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  color: var(--graphite);
  white-space: nowrap;
}

.dl-meta dd {
  margin: 0;
  font-size: var(--fs-small);
  color: var(--ink);
}

/* ---------- Related products and action ---------- */

.dl-item__products {
  margin: 1rem 0 0;
  font-size: var(--fs-small);
  line-height: 1.6;
  color: var(--graphite);
}

.dl-item__label {
  display: inline-block;
  margin-right: 0.5rem;
  font-family: var(--font-display);
  font-size: var(--fs-label);
  font-weight: 700;
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  color: var(--brass);
}

.dl-item__products a { color: var(--ink); }

.dl-item__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 1.25rem 0 0;
}

/* ---------- Small screens ---------- */

@media (max-width: 660px) {
  .dl-meta { gap: 0.75rem; flex-direction: column; }
  .dl-item { padding: 1.5rem 0; }
  .dl-group { margin-top: 3rem; }
}