/*
 * Newsletter module — SD-22
 * Figma: global modules / newsletter (node 6361-114333)
 * Global Secondary-01 band above the footer: Pattern 01 fullscreen background,
 * headline + 3 decorative images (varying heights) + external CTA. Module-level
 * layout only — CTA uses .dk-cta-primary.
 */

.dk-newsletter {
  position: relative;
  isolation: isolate;
  background-color: var(--dk-color-brand-secondary-01);
  color: var(--dk-color-black);
  padding-block: var(--dk-space-section-m);
  padding-inline: var(--dk-space-page-inline);
}

/* Pattern 01: fullscreen behind section content (Figma newsletter / L) */
.dk-newsletter__pattern {
  position: absolute;
  inset: 0;
  z-index: -1;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: none;
}

.dk-newsletter__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--dk-space-09);
  inline-size: 100%;
  max-inline-size: 88.75rem; /* 1420px — Figma L inner */
  margin-inline: auto;
}

.dk-newsletter__headline {
  margin: 0;
}

.dk-newsletter__images {
  position: relative;
  inline-size: 100%;
  aspect-ratio: 1200 / 351;
  overflow: hidden;
}

.dk-newsletter__img {
  position: absolute;
  object-fit: cover;
  display: block;
}

/* Left */
.dk-newsletter__img:nth-child(1) {
  inset-block-start: 0;
  inset-inline-start: 0;
  inline-size: 36.5%;
  block-size: 100%;
  z-index: 1;
}

/* Middle — offset down, overlaps neighbours */
.dk-newsletter__img:nth-child(2) {
  inset-block-start: 15.38%;
  inset-inline-start: 27.75%;
  inline-size: 36.33%;
  block-size: 84.62%;
  z-index: 3;
}

/* Right */
.dk-newsletter__img:nth-child(3) {
  inset-block-start: 0;
  inset-inline-start: 54.58%;
  inline-size: 45.42%;
  block-size: 100%;
  z-index: 2;
}

.dk-newsletter__cta {
  display: flex;
  margin-block-start: calc(var(--dk-space-04) - var(--dk-space-09));
}