/* Section rhythm: neutral information, blue actions, yellow newsletter.
 * Scope by content role; never alternate arbitrary sections by their position.
 */
.cs-contact-page .cs-contact-visual {
  background: var(--cs-paper);
}

/* Social, pinball and location-overview actions precede the yellow newsletter. */
.cs-contact-page .cs-final-yellow,
.cs-locations-page .cs-final-yellow,
.cs-topic-page .cs-final-yellow {
  background: var(--cs-blue);
  color: var(--cs-white);
}

.cs-contact-page .cs-final-yellow h2,
.cs-locations-page .cs-final-yellow h2,
.cs-topic-page .cs-final-yellow h2 {
  color: var(--cs-white);
}

.cs-contact-page .cs-final-yellow .cs-btn-ghost-dark {
  color: var(--cs-white) !important;
  border-color: var(--cs-white);
  box-shadow: 5px 5px 0 var(--cs-ink);
}

.cs-contact-page .cs-final-yellow .cs-btn-ghost-dark:hover {
  background: var(--cs-white);
  color: var(--cs-ink) !important;
}

.cs-contact-page .cs-final-yellow a:focus-visible,
.cs-locations-page .cs-final-yellow a:focus-visible,
.cs-topic-page .cs-final-yellow a:focus-visible {
  outline: 3px solid var(--cs-yellow) !important;
  outline-offset: 6px;
}

/* Keep Kortrijk's yellow coming-soon hero; contrast its newsletter instead. */
.cs-newsletter--blue {
  background: var(--cs-blue);
}

.cs-newsletter--blue::before {
  background-image: radial-gradient(circle, var(--cs-white) 2px, transparent 2.5px);
  opacity: .07;
}

.cs-newsletter--blue h2 {
  color: var(--cs-white) !important;
  text-shadow: 5px 5px 0 var(--cs-ink);
}

.cs-newsletter--blue .cs-newsletter-copy > p {
  color: var(--cs-white);
}

.cs-newsletter--blue .cs-newsletter-kicker {
  background: var(--cs-yellow);
  color: var(--cs-ink);
  box-shadow: 6px 6px 0 var(--cs-ink);
}

/* A distinct event chapter after Home's light photo gallery.
 * Keep the cards' own ink-on-white typography; only the section heading changes.
 */
.cs-home-v2 .cs-v2-events-teaser {
  background: var(--cs-ink);
}

.cs-home-v2 .cs-v2-events-teaser h2,
.cs-home-v2 .cs-v2-events-teaser .cs-v2-title-row a {
  color: var(--cs-white) !important;
}

.cs-home-v2 .cs-v2-events-teaser .cs-event-mini {
  box-shadow: 8px 8px 0 var(--accent, var(--cs-blue));
}

.cs-home-v2 .cs-v2-events-teaser .cs-v2-title-row a:focus-visible {
  outline: 3px solid var(--cs-yellow) !important;
  outline-offset: 6px;
}

/* Featured event gets its own stage before the light, dotted event listing. */
.cs-agenda-page .cs-agenda-featured {
  background: var(--cs-ink);
}

.cs-agenda-page .cs-agenda-featured .cs-feature-event {
  box-shadow: 10px 10px 0 var(--cs-blue);
}

/* B2B process is a new chapter, separate from the preceding photo/information. */
.cs-topic-page .cs-process-section {
  background: var(--cs-ink);
  color: var(--cs-white);
}

.cs-topic-page .cs-process-section h2,
.cs-topic-page .cs-process-section h3,
.cs-topic-page .cs-process-section p {
  color: var(--cs-white);
}

.cs-topic-page .cs-process-section .cs-process-grid > div {
  border-top-color: var(--cs-yellow);
}

.cs-topic-page .cs-process-section .cs-process-grid b {
  color: var(--cs-yellow);
}
