/* Homepage chapter rhythm. Keep the existing artwork and a shared text edge. */
.home-contrast .learning-brand .learning-logo {
  display: block;
  width: 16rem;
  max-width: 100%;
  height: auto;
}
.home-contrast #direct-aan-de-slag .template-previews > article { background: #fff; }
.home-contrast {
  --home-edge: 60px;
  --home-content: 1240px;
  --home-forest: #172e23;
  --home-lime: #c4f737;
  --paper: #fff;
  background: #fff;
}
.home-contrast .roadmap-wrap,
.home-contrast .compass-cta-inner {
  width: calc(100% - var(--home-edge) * 2);
  max-width: var(--home-content);
}
.home-contrast .roadmap-hero h1 { font-size: clamp(56px, 5.45vw, 88px); overflow-wrap: anywhere; }
.home-contrast .roadmap-eyebrow { letter-spacing: .25em; }
.home-contrast main > .home-band {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: clamp(56px, 6vw, 88px) max(var(--home-edge), calc((100% - var(--home-content)) / 2));
  border: 0;
  border-radius: 0;
  background: var(--home-band-color);
}
.home-contrast .home-tone-mist { --home-band-color: #edf3e8; }
.home-contrast .home-tone-sage { --home-band-color: #dfeacc; }
.home-contrast .home-tone-lime { --home-band-color: var(--home-lime); }
.home-contrast .home-tone-forest {
  --home-band-color: var(--home-forest);
  --ink: #f7faf3;
  --muted: #d2dfd4;
  --line: #6c8575;
  color: #f7faf3;
}
.home-contrast .home-tone-forest :is(h2, h3, .text-link, .growth-checklist li) { color: #f7faf3; }
.home-contrast .home-tone-forest :is(p, figcaption, .eyebrow, .growth-lead) { color: #d2dfd4; }
.home-contrast .home-tone-forest h2 em { color: var(--home-lime); }
.home-contrast .home-tone-forest .text-link { border-color: #8da393; }
.home-contrast .home-tone-forest .text-link:hover { color: var(--home-lime); border-color: var(--home-lime); }
.home-contrast .home-tone-forest .button {
  background: var(--home-lime);
  color: #172e23;
  border-color: var(--home-lime);
}
.home-contrast .home-tone-forest .button span { color: inherit; }
.home-contrast .home-tone-forest .button:hover { background: #dcff82; border-color: #dcff82; }
.home-contrast .home-tone-forest :focus-visible,
.home-contrast .home-tone-forest :is(h2, h3)[tabindex="-1"]:focus { outline-color: #e3ffad; }
.home-contrast .home-tone-lime :is(h2, h3, p, .eyebrow) { color: #172e23; }

/* Reuse the existing marquee and its keyboard, visibility and motion controls. */
.home-contrast .home-ribbon {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 24px var(--home-edge) 24px 0;
  margin: 0;
  border: 0;
  background: var(--home-lime);
  color: #172e23;
}
.home-ribbon .marquee-window { flex: 1; min-width: 0; }
.home-ribbon .marquee-group {
  min-width: 100vw;
  justify-content: space-around;
  gap: clamp(32px, 4vw, 64px);
  padding-right: clamp(32px, 4vw, 64px);
}
.home-ribbon .marquee-group span {
  display: inline-flex;
  align-items: center;
  gap: clamp(32px, 4vw, 64px);
  font-size: clamp(25px, 2.7vw, 40px);
  font-weight: 500;
  letter-spacing: -.04em;
  color: #172e23;
}
.home-ribbon .marquee-group b { font-weight: 400; }
.home-ribbon .marquee-toggle {
  display: none;
  flex: none;
  max-width: 11rem;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid #416119;
  border-radius: 999px;
  font-size: 12px;
  line-height: 1.5;
  color: #172e23;
}
html[data-motion-ready="true"] .home-ribbon .marquee-toggle { display: block; }
.home-ribbon .marquee-toggle:hover { background: #ddff89; }
.home-ribbon .marquee-toggle:focus-visible { outline: 3px solid #172e23; outline-offset: 4px; }
html:not([data-motion-ready="true"]) .home-ribbon .marquee-track { display: block; width: auto; }
html:not([data-motion-ready="true"]) .home-ribbon .marquee-group { min-width: 0; flex-wrap: wrap; padding: 0 24px; gap: 16px 24px; }
html:not([data-motion-ready="true"]) .home-ribbon .marquee-group span { font-size: 22px; white-space: normal; }
html:not([data-motion-ready="true"]) .home-ribbon .marquee-group b { display: none; }

/* An introduction beside three service rows, rather than another equal card grid. */
.home-contrast #diensten {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: 32px 64px;
}
.home-contrast #diensten > .reference-section-heading { display: block; margin: 0; align-self: start; min-width: 0; }
.home-contrast #diensten .reference-heading-copy { width: auto; max-width: none; }
.home-contrast #diensten h2 { font-size: clamp(36px, 3.7vw, 54px); line-height: 1.1; }
.home-contrast #diensten .growth-lead { max-width: 30ch; font-size: 19px; }
.home-services-art { display: block; width: 100%; max-width: 480px; height: auto; margin: 40px 0 0; }
.home-contrast #diensten .services-overview { display: block; margin: 0; min-width: 0; }
.home-contrast #diensten .services-overview article {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 12px 24px;
  min-height: 0;
  padding: 28px 0;
  border: 0;
  border-top: 1px solid #6c8575;
  border-radius: 0;
  background: transparent;
}
.home-contrast #diensten .services-overview article:first-child { padding-top: 0; border-top: 0; }
.home-contrast #diensten .services-overview article > svg {
  grid-column: 1;
  grid-row: 1 / 5;
  box-sizing: border-box;
  width: 58px;
  height: 58px;
  padding: 12px;
  border-radius: 14px;
  background: var(--home-lime);
  color: #172e23;
  margin: 0;
}
.home-contrast #diensten .services-overview :is(h3, p, ul, a) { grid-column: 2; margin: 0; }
.home-contrast #diensten .services-overview h3 { font-size: clamp(24px, 2.1vw, 30px); line-height: 1.25; }
.home-contrast #diensten .services-overview p { font-size: 16px; line-height: 1.7; }
.home-contrast #diensten .growth-checklist { border: 0; padding: 4px 0; }
.home-contrast #diensten .growth-checklist li { padding-block: 5px; font-size: 14px; }
.home-contrast #diensten .growth-checklist li::before { background: #d7efa6; color: #172e23; }
.home-contrast #diensten .services-overview .text-link { justify-self: start; margin-top: 4px; min-height: 44px; font-size: 14px; }
.home-contrast #diensten :is(.services-next, .service-related) { grid-column: 1 / -1; margin: 0; min-width: 0; }
.home-contrast #diensten .services-next { padding-top: 30px; border-color: #6c8575; }
.home-contrast #diensten .services-next h3 { font-size: 22px; }
.home-contrast #diensten .service-related { padding-top: 0; }

/* Evidence gets a distinct chapter; source figures and date context stay intact. */
.home-contrast #resultaten { align-items: center; gap: 64px; }
.home-contrast #resultaten .ads-metrics {
  background: transparent;
  border-block: 1px solid #6c8575;
  border-radius: 0;
  padding: 24px 0;
  margin-bottom: 28px;
}
.home-contrast #resultaten .ads-metrics dt { color: #d2dfd4; }
.home-contrast #resultaten .ads-metrics dd { color: var(--home-lime); font-size: clamp(30px, 3vw, 44px); }
.home-contrast #resultaten .ads-metrics > div { border-color: #6c8575; }
.home-contrast #resultaten figure img { border: 0; border-radius: 8px; }
.home-contrast #resultaten figcaption { margin-top: 18px; }

.home-contrast #groot-idee { overflow: hidden; gap: 24px; }
.home-contrast #groot-idee > img { width: 100%; max-width: 680px; margin: 0; }
.home-contrast #plan-een-gesprek { gap: 48px; }
.home-contrast #plan-een-gesprek h2 { font-size: clamp(36px, 4vw, 60px); line-height: 1.1; }
.home-contrast #plan-een-gesprek .conversation-meta { color: #d2dfd4; }
.home-contrast #jouw-volgende-stap { margin: 0; }

/* One short arrival per illustration; no endless movement or hidden content. */
@keyframes home-art-settle {
  0% { transform: translateY(12px); }
  40% { transform: translateY(-8px); }
  70% { transform: translateY(3px); }
  100% { transform: translateY(0); }
}
@media (prefers-reduced-motion: no-preference) {
  .home-contrast .home-art-arrived { animation: home-art-settle 4.6s ease-in-out 1; }
}
@media (max-width: 1100px) {
  .home-contrast { --home-edge: 40px; }
  .home-contrast #diensten { gap: 30px 36px; }
  .home-contrast #diensten h2 { font-size: 38px; }
  .home-contrast #resultaten { gap: 36px; }
}
@media (max-width: 1000px) {
  .home-contrast .roadmap-hero h1 { font-size: clamp(38px, 7.7vw, 72px); }
}
@media (max-width: 850px) {
  .home-contrast #diensten { grid-template-columns: 1fr; }
  .home-contrast #diensten > .reference-section-heading { display: grid; grid-template-columns: 1fr .65fr; gap: 24px; align-items: center; }
  .home-services-art { margin: 0; }
  .home-contrast #diensten .services-overview article { padding-block: 28px; }
  .home-contrast #diensten .services-overview article:first-child { padding-top: 28px; border-top: 1px solid #6c8575; }
}
@media (max-width: 700px) {
  .home-contrast { --home-edge: 24px; }
  .home-contrast main > .home-band { padding-block: 52px; }
  .home-contrast .home-ribbon { padding: 20px 0 14px; flex-wrap: wrap; gap: 12px; }
  .home-ribbon .marquee-window { flex-basis: 100%; }
  .home-ribbon .marquee-group { gap: 32px; padding-right: 32px; }
  .home-ribbon .marquee-group span { font-size: 28px; gap: 32px; }
  .home-ribbon .marquee-toggle { margin: 0 var(--home-edge) 0 auto; }
  .home-contrast #diensten > .reference-section-heading { display: block; }
  .home-services-art { width: 85%; max-width: 330px; margin: 24px auto 0; }
  .home-contrast #diensten h2 { font-size: clamp(32px, 7vw, 44px); }
  .home-contrast #diensten .services-overview article { grid-template-columns: 44px minmax(0, 1fr); gap: 12px 16px; }
  .home-contrast #diensten .services-overview article > svg { width: 44px; height: 44px; padding: 8px; }
  .home-contrast #diensten .services-overview :is(p, ul, a) { grid-column: 1 / -1; }
  .home-contrast #diensten .services-overview article > svg { grid-row: 1; }
  .home-contrast #diensten .services-overview h3 { align-self: center; font-size: 24px; }
  .home-contrast #diensten .services-next { align-items: start; }
  .home-contrast #resultaten .ads-metrics { padding: 12px 0; }
  .home-contrast #resultaten .ads-metrics > div { padding-inline: 0; }
  .home-contrast #groot-idee { grid-template-columns: 1fr; }
  .home-contrast #plan-een-gesprek { gap: 28px; }
}
@media (max-width: 600px) {
  .home-contrast .roadmap-hero h1 { font-size: clamp(32px, 8.4vw, 50px); }
}
@media (max-width: 380px) {
  .home-contrast { --home-edge: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-contrast .home-ribbon { display: block; padding: 24px var(--home-edge); }
  .home-ribbon .marquee-group { min-width: 0; width: auto; padding: 0; gap: 16px 24px; }
  .home-ribbon .marquee-group span { white-space: normal; gap: 16px; font-size: 22px; }
  .home-ribbon .marquee-group b { display: none; }
  html[data-motion-ready="true"] .home-ribbon .marquee-toggle { display: none; }
  .home-contrast .home-art-arrived { animation: none; }
}
@media print {
  .home-contrast main > .home-band { background: #fff; color: #101010; }
  .home-contrast .home-tone-forest :is(h2, h3, p, li, dt, dd, figcaption, .text-link) { color: #101010; }
  .home-ribbon { display: none !important; }
}