/*
 * /news, /news/<slug>, /about, /sets, /sets/<slug>: layout only. The pieces (press-card, set-card, hud-btn,
 * section-label, chips, gallery, prose, breadcrumb) come from hud.css, components.css, product.css and listing.css.
 * Mobile-first; tokens only.
 */
.content-page { padding-block: var(--space-6) var(--section-y); }
.content-head { display: grid; gap: var(--space-3); margin-block: var(--space-4) var(--space-6); }
.content-head h1, .article__title, .set-page__title, .about__title {
  font-family: var(--font-hud-display); font-weight: 600; text-transform: uppercase; line-height: var(--leading-display); letter-spacing: var(--tracking-display);
}
.content-head h1 { font-size: var(--fs-h2); }

/* press cards in a grid (news listing, related) */
.content-grid { display: grid; gap: var(--space-5) var(--gutter); grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); margin-bottom: var(--space-8); }
.content-grid .press-card__media { aspect-ratio: 16 / 9; }

/* article */
.article { max-width: 60rem; }
.article__head { display: grid; gap: var(--space-3); margin-block: var(--space-4) var(--space-6); }
.article__title { margin: 0; font-size: var(--fs-h2); overflow-wrap: break-word; }
.article__cover { margin: 0 0 var(--space-8); }
.article__cover img { width: 100%; height: auto; max-height: 34rem; object-fit: cover; background: var(--color-surface); }
.article__body { font-size: var(--type-base); }
.article__body a { color: var(--color-link); }
.article__back { margin-top: var(--space-8); }
.article__guide { margin: 0 0 var(--space-6); padding: var(--space-4); border-left: 0.25rem solid var(--color-primary); background: var(--color-surface); }
.article__guide a { color: var(--color-link); }
.content-related { padding-top: 0; }
.content-related__title { margin-bottom: var(--space-5); font-family: var(--font-hud-display); font-size: var(--fs-h2); text-transform: uppercase; }

/* about */
.about__section { display: grid; gap: var(--space-3); padding-block: var(--space-8); border-top: 1px solid var(--color-border); }
.about__title { margin: 0; font-size: var(--fs-h2); }
@media (min-width: 64rem) {
  .about__section { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: var(--gutter); align-items: start; }
  .about__section > .section-label { grid-column: 1 / -1; }
  .about__title { grid-column: 1; }
  .about__body { grid-column: 2; }
}
.about-cta { padding-block: var(--section-y); background: var(--color-background); }
.about-cta__inner { display: grid; gap: var(--space-5); }
.about-cta__title { margin: 0; font-family: var(--font-hud-display); font-size: var(--fs-h2); font-weight: 600; text-transform: uppercase; line-height: var(--leading-display); color: var(--color-text); }
.about-cta__text { margin: 0; color: var(--color-muted-text); max-width: 40ch; }
.about-cta__buttons { display: flex; flex-wrap: wrap; gap: var(--space-3); }

/* sets listing */
.sets-list { display: grid; gap: var(--space-5) var(--gutter); grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); }
.bundle-card__summary { margin: 0; font-size: var(--type-sm); color: var(--color-muted-text); }
.bundle-card .set-card__price { font-size: var(--fs-lead); }
.bundle-card .set-card__title a { color: inherit; text-decoration: none; }

/* one set */
.set-page__grid { display: grid; gap: var(--space-6); margin-top: var(--space-4); }
.set-page__info { align-content: start; gap: var(--space-4); padding: var(--space-5) var(--space-4); height: auto; }
.set-page__title { margin: 0; font-size: var(--fs-h2); }
.set-page__section { margin-top: var(--space-10); }
.set-page__section h2 { margin-bottom: var(--space-4); font-family: var(--font-hud-display); font-size: var(--fs-h2); text-transform: uppercase; }
.set-items { display: grid; gap: var(--space-6) var(--gutter); grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); }
.set-items__title { margin-bottom: var(--space-2); font-family: var(--font-hud-mono); font-size: var(--type-xs); font-weight: 600; letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--color-primary); }
.set-items__list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--color-border); }
.set-items__item { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); min-height: var(--tap); padding-block: var(--space-2); border-bottom: 1px solid var(--color-border); }
.set-items__item a { display: inline-flex; align-items: center; min-height: var(--tap); color: var(--color-text-strong); }
.set-items__qty { flex: none; font-family: var(--font-hud-mono); font-size: var(--type-xs); color: var(--color-muted-text); }
@media (min-width: 64rem) {
  .set-page__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: start; gap: var(--gutter); }
  .set-page__info { position: sticky; top: calc(var(--header-h) + var(--space-4)); }
}