/* News (Figma node 1:643). Marble ends 83px below the section top; the card area is white. */

.dn-news { }  /* marble continues behind the card (the white band in Figma looks like a designer slip) */

.dn-news__row { display: flex; align-items: flex-end; justify-content: center; gap: 74px; padding-left: 88px; }
.dn-news__main { display: flex; flex-direction: column; gap: 50px; width: var(--content-width); flex: none; }

.dn-news-card { display: flex; align-items: flex-end; gap: 40px; }
.dn-news-card__image { flex: none; width: 486px; height: 360px; object-fit: cover; }
.dn-news-card__body { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.dn-news-card__meta { display: flex; flex-direction: column; gap: 18px; }
.dn-news-card__date { font-size: 18px; font-weight: 600; line-height: 1.2; }
.dn-news-card__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-title);
  line-height: 0.85;
  text-transform: uppercase;
  letter-spacing: 0;
}
.dn-news-card__excerpt { width: 450px; max-width: 100%; line-height: 1.2; }

/* ---------- Vertical slider (home): pinned while scrolling, slides follow the scroll position ---------- */
.dn-news__slides { display: grid; }
.dn-slide { grid-area: 1 / 1; }
.dn-news-card__media { flex: none; width: 486px; height: 360px; overflow: hidden; }
.dn-news-card__media .dn-news-card__image { display: block; width: 100%; height: 100%; }

.dn-indicator__num--roll { position: relative; }
.dn-indicator__num--roll span { position: absolute; inset: 0; margin: auto; }
.dn-indicator__dots { display: flex; flex-direction: column; gap: 28px; }
.dn-indicator__dots button {
  width: 10px; height: 10px; padding: 0; border: 0; border-radius: 50%;
  background: var(--elements-primary); opacity: 0.3; cursor: pointer;
  transition: opacity var(--transition), transform var(--transition);
}
.dn-indicator__dots button:hover { opacity: 0.7; }
.dn-indicator__dots button.is-active { opacity: 1; transform: scale(1.3); }

/* Enabled by js/news-slider.js */
.dn-news.is-slider .dn-news__track {
  height: calc(100vh + 70vh * var(--dn-slides, 3));
  /* the pinned box centres the content in the viewport; pull the track up/down by that slack so the space around the block
     equals the section spacing of the other blocks (--dn-news-top-gap / -bottom-gap are measured in js/news-slider.js) */
  margin-top: calc(-1 * var(--dn-news-top-gap, 0px));
  margin-bottom: calc(-1 * var(--dn-news-bottom-gap, 0px));
}
.dn-news.is-slider .dn-news__sticky {
  position: sticky; top: 0;
  display: flex; align-items: center;
  height: 100vh; min-height: 640px;
}
.dn-news.is-slider .dn-news__row { align-items: center; padding-bottom: 0; }

.dn-news.is-slider .dn-slide {
  visibility: hidden;
  opacity: 0;
  transform: translateY(70px);
  transition: opacity 0.7s ease, transform 0.9s cubic-bezier(0.77, 0, 0.18, 1), visibility 0s linear 0.9s;
}
.dn-news.is-slider .dn-slide.is-past { transform: translateY(-70px); }
.dn-news.is-slider .dn-slide.is-active { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
/* image: curtain wipe from the bottom, the outgoing one wipes away upwards */
.dn-news.is-slider .dn-news-card__image {
  clip-path: inset(100% 0 0 0);
  transform: scale(1.12);
  transition: clip-path 1s cubic-bezier(0.77, 0, 0.18, 1), transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.dn-news.is-slider .dn-slide.is-active .dn-news-card__image { clip-path: inset(0); transform: scale(1); }
.dn-news.is-slider .dn-slide.is-past .dn-news-card__image { clip-path: inset(0 0 100% 0); }
/* text: staggered rise */
.dn-news.is-slider .dn-news-card__body > * {
  opacity: 0; transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.dn-news.is-slider .dn-slide.is-active .dn-news-card__body > * { opacity: 1; transform: none; }
.dn-news.is-slider .dn-slide.is-active .dn-news-card__body > :nth-child(1) { transition-delay: 0.30s; }
.dn-news.is-slider .dn-slide.is-active .dn-news-card__body > :nth-child(2) { transition-delay: 0.42s; }
.dn-news.is-slider .dn-slide.is-active .dn-news-card__body > :nth-child(3) { transition-delay: 0.54s; }

/* number: rolls vertically (the digits are rotated 90deg, so the local x axis runs down the page) */
.dn-news.is-slider .dn-indicator__num--roll span {
  opacity: 0; transform: rotate(90deg) translateX(46px);
  transition: opacity 0.5s ease, transform 0.8s cubic-bezier(0.77, 0, 0.18, 1);
}
.dn-news.is-slider .dn-indicator__num--roll span.is-past { transform: rotate(90deg) translateX(-46px); }
.dn-news.is-slider .dn-indicator__num--roll span.is-active { opacity: 1; transform: rotate(90deg); }

/* Without JS or with reduced motion: no pinning, the three items are listed one under another */
.dn-news:not(.is-slider) .dn-news__slides { gap: 60px; }
.dn-news:not(.is-slider) .dn-slide { grid-area: auto; }
.dn-news:not(.is-slider) .dn-indicator__dots,
.dn-news:not(.is-slider) .dn-indicator__num--roll span:not(.is-active) { display: none; }