/* short body section under the reusable header */
    /* ===== Titel + tekst (case-opzet: leeslijn, koppen, sticky TOC) ===== */
    .sd-copy { padding: var(--section-pad-y) 0; background: var(--e-global-color-bg); }
    .sd-copy__wrap {
      max-width: var(--content-max); margin: 0 auto; padding: 0 var(--gutter);
    }
    .sd-copy__grid {
      display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: clamp(40px, 5vw, 64px);
    }
    .sd-copy__main { max-width: 740px; }
    .sd-read { position: relative; padding-left: 56px; }
    .sd-read::before {
      content: ''; position: absolute; left: 0;
      top: var(--line-top, 0); height: var(--line-len, 100%);
      width: 2px; border-radius: 2px;
      background: var(--e-global-color-border);
    }
    .sd-progress {
      position: absolute; left: 0; top: var(--line-top, 0);
      width: 2px; height: 0; border-radius: 2px;
      background: var(--e-global-color-primary);
      max-height: var(--line-len, 100%);
    }
    .sd-read__sec { position: relative; padding: 20px 0; scroll-margin-top: 120px; }
    .sd-read__sec + .sd-read__sec { margin-top: 80px; }
    .sd-read__sec h3 {
      font-family: 'JetBrains Mono', monospace; font-weight: 700;
      font-size: clamp(28px, 3vw, 42px); line-height: 1.1; letter-spacing: -0.02em;
      color: var(--e-global-color-text); margin: 0 0 24px;
    }
    .sd-read__num {
      position: absolute; left: -73px; top: 22px;
      width: 36px; height: 36px;
      display: flex; align-items: center; justify-content: center;
      background: #fff;
      border: 1px solid var(--e-global-color-border);
      border-radius: 10px;
      font-family: 'JetBrains Mono', monospace;
      font-weight: 600; font-size: 12px; letter-spacing: 0.04em;
      color: var(--e-global-color-text-mute);
      transition: background .35s ease, border-color .35s ease, color .35s ease;
      z-index: 2;
    }
    .sd-read__num.is-active {
      background: var(--e-global-color-primary);
      border-color: var(--e-global-color-primary);
      color: #fff;
    }
    .sd-read__sec p {
      font-family: 'Inter', sans-serif; font-size: 16px; line-height: 1.78;
      color: var(--e-global-color-text-dim); margin: 0 0 18px;
    }
    .sd-read__sec p:last-child { margin-bottom: 0; }
    /* sticky inhoudsopgave (zelfde component als de case) */
    .sd-toc { position: sticky; top: 120px; align-self: start; }
    .sd-toc__label {
      font-family: 'JetBrains Mono', monospace;
      font-size: 12px; font-weight: 700;
      letter-spacing: 0.14em; text-transform: uppercase;
      color: var(--e-global-color-text-mute);
      margin: 0 0 16px;
    }
    .sd-toc__list { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--e-global-color-border); }
    .sd-toc__list a {
      display: flex; align-items: baseline; gap: 10px;
      padding: 9px 0 9px 16px; margin-left: -1px;
      border-left: 2px solid transparent;
      font-family: 'Inter', sans-serif; font-size: 14.5px;
      color: var(--e-global-color-text-dim); text-decoration: none;
      transition: color .2s ease, border-color .2s ease;
    }
    .sd-toc__list a .num {
      font-family: 'JetBrains Mono', monospace; font-size: 11px;
      color: var(--e-global-color-text-mute);
      transition: color .2s ease;
    }
    .sd-toc__list a:hover { color: var(--e-global-color-primary); }
    .sd-toc__list a.is-active {
      color: var(--e-global-color-text); font-weight: 600;
      border-left-color: var(--e-global-color-primary);
    }
    .sd-toc__list a.is-active .num { color: var(--e-global-color-primary); }
    @media (max-width: 1024px) {
      /* TOC drops out, reading column goes full width, and the numbered badge
         offset tightens at the same predictable point the layout collapses */
      .sd-copy__grid { grid-template-columns: 1fr; }
      .sd-copy__main { max-width: 740px; }
      .sd-toc { display: none; }
      .sd-read { padding-left: 40px; }
      .sd-read__num { left: -57px; width: 30px; height: 30px; }
    }
    @media (max-width: 640px) {
      .sd-copy__main { max-width: 100%; }
      /* lijn + badges blijven zichtbaar; de badge-linkerrand staat op dezelfde
         randafstand (gutter) als de tekst, niets steekt de viewport uit */
      .sd-read { padding-left: 46px; }
      .sd-read::before, .sd-progress { left: 14px; }   /* gecentreerd onder de 30px badge */
      .sd-read__sec + .sd-read__sec { margin-top: 48px; }
      .sd-read__num { left: -46px; top: 20px; width: 30px; height: 30px; }
      .sd-read__sec h3 { font-size: clamp(24px, 7vw, 30px); margin-bottom: 16px; }
      .sd-read__sec p { font-size: 15.5px; line-height: 1.7; }
    }
    /* ===== Phone: '500+ Projects Delivered' in de hero-foto (apart stat-vak weg) ===== */
    .sub-hero__photo-stat { display: none; }   /* desktop/tablet: onzichtbaar, stat-vak blijft */
    @media (max-width: 640px) {
      .sub-hero__photo--stat { position: relative; }
      .sub-hero__photo-stat {
        display: flex; flex-direction: column; gap: 4px;
        position: absolute; left: 0; right: 0; bottom: 0;
        padding: 56px 18px 16px;
        background: linear-gradient(180deg, rgba(10, 16, 28, 0) 0%, rgba(10, 16, 28, 0.78) 100%);
        pointer-events: none;
      }
      .sub-hero__photo-stat-num {
        font-family: 'JetBrains Mono', monospace; font-weight: 700;
        font-size: 34px; line-height: 1; letter-spacing: -0.02em; color: #fff;
      }
      .sub-hero__photo-stat-label {
        font-family: 'JetBrains Mono', monospace; font-weight: 500;
        font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase;
        color: rgba(255, 255, 255, 0.85);
      }
      .sub-hero__cells .sub-hero__stat { display: none; }
    }

    /* ===== Other services (kaartjes uit dezelfde categorie) ===== */
    .sd-svc { padding: var(--section-pad-y) 0; background: var(--e-global-color-bg-soft); }
    .faq { background: var(--e-global-color-bg); }
    .sd-svc__wrap { max-width: var(--content-max); margin: 0 auto; padding: 0 var(--gutter); }
    .sd-svc__heading { font-family:'JetBrains Mono',monospace; font-weight:700; font-size:clamp(26px,3vw,38px); line-height:1.18; letter-spacing:-0.02em; color:var(--e-global-color-text); margin:0 0 36px; }
    .sd-svc__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
    .ov-card:hover .btn--ghost { color: var(--e-global-color-primary); }
    .ov-card:hover .btn--ghost::after { width: 100%; }
    .ov-card .btn--ghost { margin-top: auto; align-self: flex-start; }
    /* 3-col -> 2-col on tablet -> 1-col on phone */
    @media (max-width: 1024px) { .sd-svc__grid { grid-template-columns: repeat(3, 1fr); } }
    @media (max-width: 640px) {
      .sd-svc__heading { font-size: clamp(22px, 6.5vw, 30px); margin-bottom: 24px; }
      .sd-svc__grid { grid-template-columns: 1fr; gap: 16px; }
    }

    /* FAQ-kop + CTA niet sticky op deze pagina */
    .faq__left { position: static; top: auto; }