/* Artikelen — extends Ontdek brand.css */
html {
  scroll-behavior: smooth;
}

.page-artikelen .gs-section,
.page-artikelen-hub .gs-section,
.page-artikelen-article .gs-section {
  margin-top: 2.5rem;
}

/* --- Landing / hubs --- */
.gs-hub-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.gs-hub-tile {
  display: block;
  padding: 1.1rem 1.2rem 1.25rem;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
  background: #fff;
  color: #303840;
  text-decoration: none;
  min-height: 100%;
}

.gs-hub-tile h3 { margin: 0; font-size: 1.15rem; }
.gs-hub-tile p { margin: 0.5rem 0 0; color: #808080; font-size: 0.95rem; line-height: 1.45; }
a.gs-hub-tile:hover h3 { color: #d22875; }
.gs-hub-tile.is-soon { opacity: 0.72; background: #fafafa; position: relative; }
.gs-soon-badge {
  display: inline-block;
  margin-top: 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #808080;
}

.gs-article-list { display: grid; gap: 0.85rem; margin-top: 1rem; }
.gs-article-teaser {
  display: block;
  padding: 1rem 1.15rem;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
  background: #fff;
  color: inherit;
  text-decoration: none;
}
.gs-article-teaser:hover h3 { color: #d22875; }
.gs-article-teaser h3 { margin: 0.15rem 0 0; font-size: 1.2rem; }
.gs-article-teaser p { margin: 0.4rem 0 0; color: #808080; line-height: 1.45; }
.gs-article-teaser .eyebrow { margin: 0; }

/* --- Article hero --- */
.gs-article { padding-bottom: 3rem; }

.gs-article-hero {
  padding: 0.25rem 0 1.25rem;
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 1.5rem;
}

.gs-article-hero .gs-crumbs {
  margin-bottom: 1rem;
}

.gs-article-hero .eyebrow {
  margin: 0 0 0.35rem;
}

.gs-article-hero h1 {
  margin: 0;
  font-size: clamp(1.65rem, 4.5vw, 2.35rem);
  line-height: 1.18;
  letter-spacing: -0.01em;
  max-width: 22ch;
}

@media (min-width: 768px) {
  .gs-article-hero h1 { max-width: 28ch; }
}

.gs-article-dek {
  margin: 0.85rem 0 0;
  font-size: 1.08rem;
  line-height: 1.55;
  color: #4a5560;
  max-width: 62ch;
}

/* Editorial meta bar */
.gs-article-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.85rem 1.15rem;
  margin: 1.25rem 0 0;
  padding: 0.9rem 0 0;
  border-top: 1px solid #eceff2;
  color: #6a737c;
  font-size: 0.9rem;
  line-height: 1.35;
}

.gs-meta-author {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
  max-width: 100%;
}

.gs-meta-avatar {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: linear-gradient(145deg, #d22875 0%, #b01e62 55%, #2a9d8f 130%);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  box-shadow: 0 0 0 3px rgba(210, 40, 117, 0.12);
}

.gs-meta-author-text {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
}

.gs-meta-author-name {
  color: #303840;
  font-weight: 700;
  font-size: 0.95rem;
}

.gs-meta-author-role {
  color: #808080;
  font-size: 0.8rem;
}

.gs-meta-facts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  align-content: flex-start;
  gap: 0.4rem 0;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0;
  flex: 1 1 auto;
}

.gs-meta-facts > li {
  margin: 0 !important;
  padding-top: 0;
  padding-bottom: 0;
  min-height: 0;
  list-style: none !important;
}

.gs-meta-fact {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0 !important;
  padding: 0.1rem 0.75rem;
  color: #606870;
  white-space: nowrap;
  max-width: 100%;
  line-height: 1.3;
  min-height: 0;
}

/* Separators only between non-pillar facts; pillar gets desktop-only rule below */
.gs-meta-fact + .gs-meta-fact:not(.gs-meta-fact--pillar) {
  border-left: 1px solid #e2e6ea;
}

.gs-meta-fact--pillar {
  border-left: 0;
  padding-left: 0.15rem;
  padding-right: 0;
}

.gs-meta-icon,
svg.gs-meta-icon {
  flex: 0 0 16px;
  width: 16px !important;
  height: 16px !important;
  max-width: 16px !important;
  max-height: 16px !important;
  color: #2a9d8f;
  display: block;
  overflow: visible;
}

.gs-meta-fact-text {
  display: inline-flex;
  align-items: baseline;
  gap: 0.3rem;
  min-width: 0;
}

.gs-meta-fact-label {
  font-weight: 600;
  color: #808080;
}

.gs-meta-fact time {
  color: #303840;
  font-weight: 600;
}

.gs-meta-chip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 0.28rem 0.7rem;
  border-radius: 999px;
  background: #faf5f8;
  border: 1px solid #edd6e4;
  color: #d22875;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-decoration: none;
  white-space: nowrap;
  line-height: 1.2;
}

.gs-meta-chip:hover,
.gs-meta-chip:focus-visible {
  background: #f5e6ef;
  color: #b01e62;
  outline: none;
}

@media (min-width: 576px) {
  .gs-meta-fact--pillar {
    border-left: 1px solid #e2e6ea;
    padding-left: 0.85rem;
  }
}

@media (max-width: 575.98px) {
  .gs-article-meta {
    flex-direction: column;
    align-items: flex-start;
    align-content: flex-start;
    gap: 0.65rem; /* ~10px between author and facts */
    padding-top: 0.75rem;
  }

  .gs-meta-author {
    flex: 0 0 auto;
  }

  .gs-meta-facts {
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    gap: 0.45rem 0; /* tight wrap gap for chip under facts */
    row-gap: 0.45rem;
  }

  .gs-meta-fact {
    padding: 0 0.55rem;
  }

  .gs-meta-fact:first-child {
    padding-left: 0;
  }

  .gs-meta-fact + .gs-meta-fact:not(.gs-meta-fact--pillar) {
    border-left: 1px solid #e2e6ea;
  }

  .gs-meta-fact--pillar {
    border-left: 0 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    padding-right: 0;
    /* stay in the wrap flow; no forced full-width row stretch */
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
}

.gs-article-hero-media {
  margin: 1.25rem 0 0;
  border-radius: 6px;
  overflow: hidden;
  background: #10202c;
}

.gs-article-hero-media img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1200 / 630;
  max-height: 480px;
  object-fit: cover;
  object-position: center 50%; /* per-article focus via inline style (BO: Uitsnede-focus) */
}

.gs-article-hero-media picture {
  display: block;
}

.gs-draft-banner {
  background: #fff3cd;
  border: 1px solid #ffecb5;
  color: #664d03;
  padding: 0.75rem 1rem;
  border-radius: 4px;
  margin: 0 0 1rem;
}

/* --- Summary box --- */
.gs-summary {
  background: linear-gradient(180deg, #faf5f8 0%, #f7f8f9 100%);
  border: 1px solid #edd6e4;
  border-left: 4px solid #d22875;
  border-radius: 0 6px 6px 0;
  padding: 1.15rem 1.2rem 1.25rem;
  margin: 0 0 1.5rem;
  scroll-margin-top: 5.5rem;
}

.gs-summary-title {
  margin: 0 0 0.55rem;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #d22875;
}

.gs-summary-text {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.55;
  color: #303840;
  max-width: 68ch;
}

.gs-summary-points {
  list-style: none;
  margin: 0.85rem 0 0;
  padding: 0;
  color: #303840;
}

.gs-summary-points li {
  position: relative;
  margin: 0.45rem 0;
  padding-left: 1.55rem;
  line-height: 1.45;
}

.gs-summary-points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.28em;
  width: 1.05rem;
  height: 1.05rem;
  border-radius: 50%;
  background: #2a9d8f;
  box-shadow: inset 0 0 0 2px #2a9d8f;
}

.gs-summary-points li::after {
  content: "";
  position: absolute;
  left: 0.32rem;
  top: 0.52em;
  width: 0.28rem;
  height: 0.5rem;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* --- Layout + sticky TOC --- */
.gs-article-layout { display: block; }

.gs-toc {
  background: #f7f8f9;
  border: 1px solid #e5e5e5;
  border-radius: 4px;
  padding: 1rem 1.15rem;
  margin: 0 0 1.5rem;
}

.gs-toc-title {
  margin: 0 0 0.5rem;
  font-weight: 700;
  font-size: 0.92rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #606870;
}

.gs-toc ol {
  margin: 0;
  padding-left: 1.15rem;
}

.gs-toc li { margin: 0.3rem 0; line-height: 1.35; }
.gs-toc a {
  color: #303840;
  text-decoration: none;
}
.gs-toc a:hover { color: #d22875; text-decoration: underline; }
.gs-toc-l3 { margin-left: 0.65rem; font-size: 0.95rem; }

@media (min-width: 992px) {
  .gs-article-layout.has-toc {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    column-gap: 2.25rem;
    align-items: start;
  }

  .gs-toc--aside {
    position: sticky;
    top: 5.25rem;
    margin: 0;
    max-height: calc(100vh - 6.5rem);
    overflow: auto;
    order: 0;
  }

  .gs-article-main { min-width: 0; }
}

/* --- Body headings + anchors --- */
.gs-article-body h2,
.gs-article-body h3,
.gs-heading {
  scroll-margin-top: 5.5rem;
}

.gs-article-body h2 { margin-top: 2rem; }
.gs-article-body h3 { margin-top: 1.35rem; }

/* Heading self-links: look like plain headings in every state (no colour change, underline or hash). */
.gs-heading-anchor,
.gs-heading-anchor:link,
.gs-heading-anchor:visited,
.gs-heading-anchor:hover,
.gs-heading-anchor:focus,
.gs-heading-anchor:active,
.gs-article-body .gs-heading-anchor,
.gs-article-body .gs-heading-anchor:hover,
.gs-article-body .gs-heading-anchor:focus,
.gs-article-body .gs-heading-anchor:visited {
  color: inherit;
  text-decoration: none;
  outline: none;
}
.gs-heading-anchor::before,
.gs-heading-anchor::after {
  content: none !important;
}
/* Keyboard users only: subtle focus ring. */
.gs-heading-anchor:focus-visible,
.gs-article-body .gs-heading-anchor:focus-visible {
  outline: 2px solid rgba(210, 40, 117, 0.45);
  outline-offset: 3px;
  border-radius: 2px;
}

/* Callouts: "> info:" / "> tip:" / "> let op:" */
.gs-callout {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  border-left: 4px solid #2a9d8f;
  background: #eef8f6;
  padding: 0.95rem 1.1rem;
  margin: 1.5rem 0;
  border-radius: 0 6px 6px 0;
  color: #303840;
}
.gs-callout-icon {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  display: inline-flex;
  color: #1f7a6f;
  margin-top: 0.05rem;
}
.gs-callout .gs-callout-icon svg {
  width: 22px !important;
  height: 22px !important;
  max-width: none;
  display: block;
}
.gs-callout-body { min-width: 0; }
.gs-callout-body p { margin: 0; line-height: 1.6; }
.gs-callout-body p + p { margin-top: 0.5rem; }
.gs-callout-body .gs-callout-title {
  font-weight: 700;
  font-size: 0.95rem;
  margin: 0 0 0.2rem;
  color: #1f7a6f;
}
.gs-callout--tip { border-left-color: #d22875; background: #fbf1f6; }
.gs-callout--tip .gs-callout-icon,
.gs-callout--tip .gs-callout-body .gs-callout-title { color: #b51f63; }
.gs-callout--warning { border-left-color: #e0a100; background: #fff8e6; }
.gs-callout--warning .gs-callout-icon,
.gs-callout--warning .gs-callout-body .gs-callout-title { color: #8a5a00; }

/* Plain "> text" quotes */
.gs-quote {
  margin: 1.5rem 0;
  padding: 0.35rem 0 0.35rem 1.1rem;
  border-left: 4px solid #cfd6dc;
  color: #4a5560;
  font-style: italic;
}
.gs-quote p { margin: 0; }
.gs-quote p + p { margin-top: 0.5rem; }

.gs-faq-answer p { margin: 0 0 0.6rem; }
.gs-faq-answer p:last-child { margin-bottom: 0; }

.gs-table-wrap { overflow-x: auto; margin: 1.25rem 0; }
.gs-table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.gs-table th,
.gs-table td {
  border: 1px solid #e5e5e5;
  padding: 0.55rem 0.7rem;
  text-align: left;
  vertical-align: top;
}
.gs-table thead th { background: #f7f8f9; }

.gs-faq details {
  border: 1px solid #e5e5e5;
  border-radius: 4px;
  padding: 0.75rem 1rem;
  margin-bottom: 0.5rem;
  background: #fff;
}
.gs-faq summary { cursor: pointer; font-weight: 600; }

.gs-faq details p { margin: 0.65rem 0 0; color: #303840; }

/* Body + FAQ inline links (category CTAs, etc.) */
.gs-article-body a:not(.gs-heading-anchor),
.gs-faq a:not(.gs-heading-anchor) {
  color: #d22875;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.gs-article-body a:not(.gs-heading-anchor):hover,
.gs-article-body a:not(.gs-heading-anchor):focus-visible,
.gs-faq a:not(.gs-heading-anchor):hover,
.gs-faq a:not(.gs-heading-anchor):focus-visible {
  color: #303840;
}


.gs-cta { margin: 1.75rem 0; }
.gs-article-products .cover-body h3 { font-size: 1.05rem; margin: 0; }
.gs-article-figure { margin: 1.5rem 0; }
.gs-article-figure picture { display: block; }
.gs-article-figure img { display: block; max-width: 100%; height: auto; border-radius: 4px; border: 1px solid #e5e7eb; }
.gs-article-figure figcaption { margin-top: .5rem; font-size: .85rem; line-height: 1.45; color: #6b7280; }
.gs-article-figure figcaption a { color: inherit; text-decoration: underline; }
.gs-article-figure figcaption a:hover { color: #d22875; }

/* Hub hero lightly aligned with article */
.page-artikelen-hub .catalog > .wrap > h1 {
  font-size: clamp(1.55rem, 4vw, 2.1rem);
  line-height: 1.2;
  max-width: 24ch;
}
.page-artikelen .catalog > .wrap > h1 {
  font-size: clamp(1.55rem, 4vw, 2.1rem);
  line-height: 1.2;
}


/* --- Breadcrumbs: single-line, scrollable, compact --- */
nav.crumbs.gs-crumbs,
.gs-crumbs {
  display: block;
  flex-wrap: nowrap;
  margin: 0 0 14px;
  max-width: 100%;
  overflow: hidden;
}

.gs-crumbs-list {
  display: flex;
  flex-wrap: nowrap !important;
  align-items: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  overscroll-behavior-x: contain;
  white-space: nowrap;
}

.gs-crumbs-item {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  min-height: 44px;
  color: #808080;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

.gs-crumbs-item:not(:last-child)::after {
  content: "/";
  display: inline-block;
  margin: 0 0.45rem;
  color: #b0b0b0;
  pointer-events: none;
}

.gs-crumbs-link,
.gs-crumbs-text {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.15rem 0;
  color: inherit;
  text-decoration: none;
  max-width: 42vw;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gs-crumbs-link:hover,
.gs-crumbs-link:focus-visible {
  color: #303840;
  text-decoration: underline;
  outline: none;
}

.gs-crumbs-item.is-current .gs-crumbs-text {
  color: #303840;
  font-weight: 600;
  max-width: 55vw;
}

@media (min-width: 768px) {
  .gs-crumbs-link,
  .gs-crumbs-text {
    max-width: 28ch;
  }
  .gs-crumbs-item.is-current .gs-crumbs-text {
    max-width: 40ch;
  }
}

/* --- Product carousel --- */
.gs-carousel {
  position: relative;
  margin-top: 0.75rem;
}

.gs-carousel-toolbar {
  display: none;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-bottom: 0.65rem;
}

@media (min-width: 768px) {
  .gs-carousel-toolbar { display: flex; }
}

.gs-carousel-btn {
  width: 40px;
  height: 40px;
  border: 1px solid #e5e5e5;
  border-radius: 999px;
  background: #fff;
  color: #303840;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.gs-carousel-btn:hover,
.gs-carousel-btn:focus-visible {
  border-color: #d22875;
  color: #d22875;
  outline: none;
}

.gs-carousel-btn:disabled {
  opacity: 0.35;
  cursor: default;
}

.gs-carousel-viewport {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  outline: none;
  container-type: inline-size;
  container-name: gs-carousel;
}

.gs-carousel-viewport::-webkit-scrollbar { display: none; }

.gs-carousel-track {
  display: flex;
  gap: 0.85rem;
  list-style: none;
  margin: 0;
  padding: 0 0 0.35rem;
  width: max-content;
  min-width: 100%;
  box-sizing: border-box;
}

.gs-carousel-slide {
  flex: 0 0 auto;
  width: calc(100cqw / 1.3 - 0.55rem);
  scroll-snap-align: start;
  min-width: 0;
  box-sizing: border-box;
}

@media (min-width: 576px) {
  .gs-carousel-slide { width: calc((100cqw - 0.85rem) / 2); }
}

@media (min-width: 992px) {
  .gs-carousel-slide { width: calc((100cqw - 2.55rem) / 4); }
}

.gs-carousel.is-fit .gs-carousel-toolbar {
  display: none;
}

.gs-pcard {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.gs-pcard:hover,
.gs-pcard:focus-within {
  border-color: #d8d8d8;
  box-shadow: 0 6px 18px rgba(16, 32, 44, 0.08);
}

.gs-pcard-media {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  background: #f4f6f8;
  padding: 0.75rem;
  text-decoration: none;
}

.gs-pcard-media img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

.gs-pcard-body {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.85rem 0.9rem 1rem;
  flex: 1;
}

.gs-pcard-badge {
  margin: 0;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #808080;
}

.gs-pcard-title {
  margin: 0;
  font-size: 0.98rem;
  font-weight: 650;
  line-height: 1.3;
}

.gs-pcard-title a {
  color: #303840 !important;
  text-decoration: none;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  word-break: break-word;
}

.gs-pcard-title a:hover,
.gs-pcard-title a:focus-visible {
  color: #d22875;
  outline: none;
}

.gs-pcard-price {
  margin: 0.15rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  align-items: baseline;
}

.gs-pcard-now {
  font-weight: 700;
  color: #303840;
  font-size: 1.05rem;
}

.gs-pcard-was {
  color: #808080;
  font-size: 0.9rem;
}

.gs-pcard-stock {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: #2a9d8f;
  font-size: 0.82rem;
  font-weight: 600;
}

.gs-pcard-stock-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #2a9d8f;
}

.gs-pcard-actions {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 0.4rem;
  margin-top: auto;
  padding-top: 0.55rem;
}

.gs-pcard-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  min-height: 40px;
  padding: 0.55rem 0.75rem;
}

.gs-pcard-cart {
  margin: 0;
  width: 100%;
  display: flex;
}

.gs-pcard-cart .btn {
  width: 100%;
}

/* ATC: reuse Op-voorraad teal with white text */
.gs-pcard-add.btn,
.gs-pcard-add.btn-primary {
  background: #2a9d8f;
  border-color: #2a9d8f;
  color: #fff;
}

.gs-pcard-add.btn:hover,
.gs-pcard-add.btn:focus,
.gs-pcard-add.btn:focus-visible,
.gs-pcard-add.btn-primary:hover,
.gs-pcard-add.btn-primary:focus,
.gs-pcard-add.btn-primary:focus-visible {
  background: #1f7d72;
  border-color: #1f7d72;
  color: #fff;
  outline: none;
}

.gs-pcard-add.btn:focus-visible {
  box-shadow: 0 0 0 3px rgba(42, 157, 143, 0.35);
}

/* Breedte (9 okt 2026): kop en tekst gebruiken de volle kolom.
   H1 = volle artikelbreedte; dek/samenvatting = breedte van de hoofdkolom naast de TOC;
   alinea's, lijsten, callouts, tabellen = volle hoofdkolom (overschrijft .prose p 40em / .prose-list 36em). */
.gs-article-hero h1 { max-width: none; }
.gs-article-dek,
.gs-summary-text { max-width: none; }
@media (min-width: 992px) {
  .gs-article-dek,
  .gs-summary-text { max-width: calc(100% - 240px - 2.25rem); }
}
.gs-article-body.prose p,
.gs-article-body .prose-list,
.gs-article-body ol,
.gs-article-body .faq-list p { max-width: none; }

/* Gerelateerd artikel (horizontale kaart, patroon van de homepage Ontdek-spotlight) */
.gs-rl-list { display: grid; gap: 14px; }
.gs-rl-card {
  display: flex;
  flex-direction: row;
  min-width: 0;
  color: inherit;
  text-decoration: none;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  overflow: hidden;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.gs-rl-card:hover,
.gs-rl-card:focus-visible {
  border-color: #d1d5db;
  box-shadow: 0 2px 10px rgba(16, 24, 40, .06);
  text-decoration: none;
  color: inherit;
}
.gs-rl-card:focus-visible { outline: 2px solid #d22875; outline-offset: 2px; }
.gs-rl-media {
  flex: 0 0 38%;
  max-width: 38%;
  aspect-ratio: 16 / 9;
  background: #10202c;
  overflow: hidden;
  display: block;
}
.gs-rl-list.is-single .gs-rl-media { flex-basis: 44%; max-width: 44%; }
.gs-rl-media img { width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; }
.gs-rl-body {
  flex: 1;
  min-width: 0;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.gs-rl-eyebrow {
  display: block;
  margin: 0;
  font-size: 11px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #6b7280;
}
.gs-rl-title {
  display: block;
  margin: 4px 0 0;
  font-size: 1.1rem;
  line-height: 1.3;
  font-weight: 700;
  color: #111827;
  transition: color .15s ease;
}
.gs-rl-list.is-single .gs-rl-title { font-size: 1.25rem; }
.gs-rl-card:hover .gs-rl-title,
.gs-rl-card:focus-visible .gs-rl-title { color: #d22875; }
.gs-rl-lead {
  display: -webkit-box;
  margin: 8px 0 0;
  font-size: .9rem;
  line-height: 1.5;
  color: #6b7280;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.gs-rl-cta {
  display: inline-block;
  align-self: flex-start;
  margin-top: 12px;
  padding: 7px 14px;
  font-size: .85rem;
  font-weight: 600;
  line-height: 1.2;
  color: #fff;
  background: #1a1a1a;
  border-radius: 4px;
  transition: background .15s ease;
}
.gs-rl-card:hover .gs-rl-cta,
.gs-rl-card:focus-visible .gs-rl-cta { background: #d22875; }
@media (max-width: 575.98px) {
  .gs-rl-card { flex-direction: column; }
  .gs-rl-media,
  .gs-rl-list.is-single .gs-rl-media { flex: none; max-width: none; width: 100%; }
  .gs-rl-body { padding: 14px 14px 16px; }
  .gs-rl-title,
  .gs-rl-list.is-single .gs-rl-title { font-size: 1.1rem; }
}