.elementor-7143 .elementor-element.elementor-element-6fafce0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-7143 .elementor-element.elementor-element-3a145f9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-7143 .elementor-element.elementor-element-3a145f9:not(.elementor-motion-effects-element-type-background), .elementor-7143 .elementor-element.elementor-element-3a145f9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-7143 .elementor-element.elementor-element-c3557cc{--display:flex;}.elementor-7143 .elementor-element.elementor-element-e774f18{--divider-border-style:solid;--divider-color:#000;--divider-border-width:1px;}.elementor-7143 .elementor-element.elementor-element-e774f18 .elementor-divider-separator{width:0%;}.elementor-7143 .elementor-element.elementor-element-e774f18 .elementor-divider{padding-block-start:15px;padding-block-end:15px;}/* Start custom CSS */.bs-compare {
  --bs-navy: #00274C;
  --bs-blue: #0511F2;
  --bs-cyan: #28F6FA;
  --bs-line: #DCE3EA;
  --bs-muted: #4A5E73;
  --bs-white: #FFFFFF;
  margin: 2em 0;
  font-family: Poppins, "Helvetica Neue", Arial, sans-serif;
  color: var(--bs-navy);
}
.bs-compare table {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
  line-height: 1.5;
  background: var(--bs-white);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 0 0 1px var(--bs-line);
}
.bs-compare caption {
  caption-side: bottom;
  text-align: left;
  padding-top: 10px;
  font-size: 14px;
  color: var(--bs-muted);
}
.bs-compare th,
.bs-compare td {
  text-align: left;
  vertical-align: top;
  padding: 16px 20px;
  border-bottom: 1px solid var(--bs-line);
}
.bs-compare tbody tr:last-child th,
.bs-compare tbody tr:last-child td {
  border-bottom: 0;
}
.bs-compare thead th {
  font-family: "Work Sans", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  font-size: 18px;
  background: var(--bs-navy);
  color: var(--bs-white);
  border-bottom: 0;
}
.bs-compare thead th.bs-geo {
  color: var(--bs-cyan);
}
.bs-compare tbody th {
  width: 24%;
  font-weight: 600;
  color: var(--bs-muted);
}
.bs-compare td.bs-geo {
  background: rgba(5, 17, 242, 0.04);
}

/* Mobiel: elke rij wordt een kaartje */
@media (max-width: 640px) {
  .bs-compare table,
  .bs-compare tbody,
  .bs-compare tr,
  .bs-compare th,
  .bs-compare td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  .bs-compare table {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
  }
  .bs-compare thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
  .bs-compare tbody tr {
    margin-bottom: 14px;
    background: var(--bs-white);
    border-radius: 14px;
    box-shadow: 0 0 0 1px var(--bs-line);
    overflow: hidden;
  }
  .bs-compare tbody th {
    width: 100%;
    padding: 12px 16px;
    background: var(--bs-navy);
    color: var(--bs-white);
    font-family: "Work Sans", "Helvetica Neue", Arial, sans-serif;
    font-weight: 700;
    border-bottom: 0;
  }
  .bs-compare td {
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 12px;
    padding: 12px 16px;
  }
  .bs-compare tbody tr td:last-child {
    border-bottom: 0;
  }
  .bs-compare td::before {
    content: attr(data-label);
    font-family: "Work Sans", "Helvetica Neue", Arial, sans-serif;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 1px;
    color: var(--bs-navy);
  }
  .bs-compare td.bs-geo::before {
    color: var(--bs-blue);
  }
  .bs-compare caption {
    display: block;
    padding-top: 0;
  }
}

/* Zebra-strepen van het thema neutraliseren, alleen in deze tabel */
.bs-compare table tbody > tr:nth-child(n) > th,
.bs-compare table tbody > tr:nth-child(n) > td { background-color: var(--bs-white); }
.bs-compare table tbody > tr:nth-child(n) > td.bs-geo { background-color: #F5F5FE; }
@media (max-width: 640px) {
  .bs-compare table tbody > tr:nth-child(n) > th { background-color: var(--bs-navy); }
}

/* Kort gezegd-blok */
.bs-tldr { background: #00274C; color: #FFFFFF; border-radius: 16px; padding: 24px 28px; margin: 8px 0 0; font-family: Poppins, "Helvetica Neue", Arial, sans-serif; }
.bs-tldr .bs-eyebrow { font-family: "Work Sans", "Helvetica Neue", Arial, sans-serif; font-weight: 600; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: #28F6FA; margin: 0 0 8px; }
.bs-tldr p { margin: 0; color: #FFFFFF; line-height: 1.7; }
.bs-tldr p + p { margin-top: 8px; }
.bs-tldr strong { color: #FFFFFF; }

/* Genummerde stappen */
.bs-steps { list-style: none; counter-reset: bs-step; padding: 0; margin: 0; display: grid; gap: 14px; font-family: Poppins, "Helvetica Neue", Arial, sans-serif; color: #00274C; }
.bs-steps li { counter-increment: bs-step; position: relative; padding: 18px 20px 18px 72px; background: #FFFFFF; border-radius: 14px; box-shadow: 0 0 0 1px #DCE3EA; line-height: 1.65; }
.bs-steps li::before { content: counter(bs-step); position: absolute; left: 20px; top: 16px; width: 36px; height: 36px; border-radius: 50%; background: #0511F2; color: #FFFFFF; font-family: "Work Sans", "Helvetica Neue", Arial, sans-serif; font-weight: 700; font-size: 17px; display: flex; align-items: center; justify-content: center; }
@media (max-width: 640px) {
  .bs-steps li { padding: 16px 16px 16px 60px; font-size: 16px; line-height: 1.6; }
  .bs-steps li::before { left: 14px; top: 14px; width: 32px; height: 32px; font-size: 15px; }
}

/* Bronnen */
.bs-sources { font-size: 14px; line-height: 1.6; color: #4A5E73; }
.bs-sources ol { padding-left: 1.2em; margin: 0; }
.bs-sources li { margin-bottom: 6px; }


/* Tijdlijn */
.bs-timeline { list-style: none; margin: 8px 0 24px; padding: 0; position: relative; font-family: Poppins, "Helvetica Neue", Arial, sans-serif; color: #00274C; }
.bs-timeline::before { content: ""; position: absolute; left: 11px; top: 10px; bottom: 10px; width: 2px; background: #A9B8C8; }
.bs-timeline li { position: relative; padding: 0 0 22px 44px; line-height: 1.6; }
.bs-timeline li:last-child { padding-bottom: 0; }
.bs-timeline li::before { content: ""; position: absolute; left: 4px; top: 5px; width: 16px; height: 16px; border-radius: 50%; background: #0511F2; box-shadow: 0 0 0 4px #FFFFFF; }
.bs-timeline li.bs-now::before { background: #28F6FA; box-shadow: 0 0 0 4px #FFFFFF, 0 0 0 6px #0511F2; }
.bs-timeline time { display: block; font-family: "Work Sans", "Helvetica Neue", Arial, sans-serif; font-weight: 700; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: #1A90B0; }
.bs-timeline p { margin: 2px 0 0; }

/* Versietabel: bredere labels op mobiel */
@media (max-width: 640px) {
  .bs-versions td { grid-template-columns: 96px 1fr; }
}
.bs-versions td.bs-geo { font-weight: 600; }
.bs-sources a, .bs-tldr a { word-break: break-word; }

@media (max-width: 640px) {
  .bs-timeline li { font-size: 16px; }
  .bs-versions tbody th::before { content: "PHP "; }
}/* End custom CSS */