/* News page.
   Used on: /news/.
   Forum Homini website, editable IIS version v016 20261109 081746. Generated with Claude Opus 5.5. */
/* one calm centred column (the site's rules): three heading sizes, one big gap between blocks, a heading close to its words */
.nw[data-c-news-page] {
  padding-block: var(--gap-section) 0;
  text-align: center;
}
.nw__head[data-c-news-page] {
  display: grid;
  gap: var(--gap-heading);
}
.nw__h1[data-c-news-page],
.nw__h2[data-c-news-page] {
  margin: 0;
  font-family: var(--face-display);
  font-weight: 600;
  line-height: 1.1;
  background:
    linear-gradient(
      180deg,
      #fff3cf,
      #f3d792 40%,
      #c9953f 85%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.nw__h1[data-c-news-page] {
  font-size: var(--fs-xl);
}
.nw__h2[data-c-news-page] {
  font-size: clamp(1.375rem, 1.1rem + 0.8vw, 1.75rem);
}
/* (owner, 3 Nov 2026: "the radio console could be bigger and do it in white") */
.nw__label[data-c-news-page] {
  margin: 0;
  color: #f6efe4;
  font-family: var(--face-text);
  font-size: var(--fs-m);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
@media (max-width: 640px) {
  .nw__label[data-c-news-page] span[data-c-news-page] {
    display: block;
  }
  .nw__label[data-c-news-page] .nw__sep[data-c-news-page] {
    display: none;
  }
}
.nw__lead[data-c-news-page] {
  margin: var(--gap-heading) auto 0;
  max-inline-size: 640px;
}
.nw__lead[data-c-news-page] img[data-c-news-page] {
  display: block;
  inline-size: 100%;
  block-size: auto;
}
@media (min-width: 900px) {
  .nw__lead[data-c-news-page] img[data-c-news-page] {
    max-block-size: calc(100svh - 160px);
    inline-size: auto;
    margin-inline: auto;
  }
}
/* (owner, 3 Nov 2026: "use the same font size as … Karina Marais deel haar storie … you have too many different sizes"): every
     caption on this page, under a photo or above a film, is one size and colour */
.nw[data-c-news-page] .nw__cap[data-c-news-page] {
  margin: var(--s-3) 0 0;
  padding-inline: 16px;
  color: #f6efe4;
  font-family: var(--face-text) !important;
  font-size: var(--fs-m) !important;
  line-height: 1.5;
}
.nw__quote[data-c-news-page] {
  max-inline-size: 40rem;
  margin: var(--gap-section) auto 0;
  padding: 0;
}
.nw__quote[data-c-news-page] p[data-c-news-page] {
  margin: 0;
  color: #f6efe4;
  font-family: var(--face-display);
  font-size: clamp(1.375rem, 1.1rem + 0.8vw, 1.75rem);
  font-style: italic;
  line-height: 1.35;
}
.nw__quote[data-c-news-page] footer[data-c-news-page] {
  margin-block-start: var(--s-3);
  color: #e6c27a;
  font-family: var(--face-text);
  font-size: var(--fs-s);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.nw__block[data-c-news-page] {
  display: grid;
  justify-items: center;
  gap: var(--gap-heading);
  max-inline-size: 48rem;
  margin: var(--gap-section) auto 0;
}
/* (owner, 3 Nov 2026: "the gap between two videos on the phone. It's not centered vertically … That must be in your rules"): the caption
     between two films has the same space above it as below it, on phone and laptop */
.nw[data-c-news-page] .nw__film-block[data-c-news-page] {
  gap: var(--gap-item);
  margin-block-start: var(--gap-item);
}
.nw[data-c-news-page] .nw__film-block[data-c-news-page]:first-of-type {
  margin-block-start: var(--gap-section) !important;
}
.nw__h3[data-c-news-page] {
  margin: 0;
  color: #f3d792;
  font-family: var(--face-display);
  font-size: clamp(1.375rem, 1.1rem + 0.8vw, 1.75rem);
  font-weight: 600;
  line-height: 1.2;
}
.nw__text[data-c-news-page],
.nw__film-cap[data-c-news-page] {
  margin: 0;
  max-inline-size: 36rem;
  color: #f6efe4;
  font-family: var(--face-text);
  font-size: var(--fs-m);
  line-height: 1.5;
}
.nw__player[data-c-news-page] {
  inline-size: 100%;
}
.nw__player[data-c-news-page] iframe[data-c-news-page] {
  display: block;
  inline-size: 100%;
  block-size: 135px;
  border: 0;
}
/* the upright films: the whole film on the screen under the top bar, never cut */
.nw__film[data-c-news-page] {
  margin: 0;
  inline-size: min(100%, calc((100svh - 140px) * 9 / 16));
}
.nw__film[data-c-news-page] .vx,
.nw__video[data-c-news-page] {
  display: block;
  inline-size: 100%;
  aspect-ratio: 9 / 16;
  background: #000;
}
/* the site's landscape-film rules must not widen these upright films: each sits whole inside its frame, nothing cut at the sides */
.nw[data-c-news-page] .nw__film[data-c-news-page] {
  clip-path: none;
}
.nw[data-c-news-page] .nw__film[data-c-news-page] [data-c-news-page]:is(.vx, video) {
  transform: none;
  scale: none;
  position: static;
  left: auto;
  inline-size: 100%;
  max-inline-size: 100%;
  margin-inline: 0;
}
/* the site's edge-to-edge rules must not stretch these photos: each one whole and upright, never squeezed */
.nw[data-c-news-page] .nw__block[data-c-news-page].nw__photos {
  gap: var(--gap-heading);
  max-inline-size: 72rem;
  margin-inline: auto;
  padding-inline: 16px;
}
.nw__row[data-c-news-page] {
  display: grid;
  gap: 0;
  inline-size: 100%;
  justify-items: stretch;
}
.nw[data-c-news-page] .nw__photos[data-c-news-page] .nw__photo[data-c-news-page] {
  margin: 0 auto;
  inline-size: 100%;
  max-inline-size: 640px;
}
.nw[data-c-news-page] .nw__photos[data-c-news-page] .nw__photo[data-c-news-page] img[data-c-news-page] {
  display: block;
  inline-size: 100%;
  max-inline-size: 100%;
  block-size: auto;
  max-block-size: none;
  aspect-ratio: 3 / 4;
}
@media (min-width: 900px) {
  .nw__row[data-c-news-page] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--s-4);
  }
}
.nw__cap--top[data-c-news-page] {
  margin: 0;
}