/* S2B_BUSINESS_PRO_PUBLIC_20260914 */

.s2b-bp-kicker {
  margin-bottom: 7px;
  color: #aa7b17;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.s2b-bp-ship-section {
  margin: 26px 0;
  padding: 24px;
  border: 1px solid rgba(30,43,58,.11);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(30,43,58,.07);
}

.s2b-bp-ship-section__head {
  margin-bottom: 18px;
}

.s2b-bp-ship-section__head h3 {
  margin: 0;
  color: #1e2b3a;
  font-size: 22px;
  font-weight: 800;
}

.s2b-bp-ship-slider {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  padding: 2px 2px 10px;
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
}

.s2b-bp-ship-card,
.s2b-bp-partner-card {
  flex: 0 0 190px;
  min-height: 205px;
  scroll-snap-align: start;
  border-radius: 18px;
  text-decoration: none !important;
}

.s2b-bp-ship-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px;
  border: 1px solid rgba(30,43,58,.13);
  background: #fff;
  color: #1e2b3a !important;
  box-shadow: 0 8px 24px rgba(30,43,58,.08);
  transition: transform .16s ease, box-shadow .16s ease;
}

.s2b-bp-ship-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(30,43,58,.13);
}

.s2b-bp-ship-card__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 76px;
  padding: 8px;
  border-radius: 13px;
  background: #f7f8fa;
}

.s2b-bp-ship-card__logo img {
  display: block;
  max-width: 100%;
  max-height: 60px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.s2b-bp-ship-card__logo-placeholder {
  width: 52px;
  height: 52px;
  border: 2px dashed rgba(30,43,58,.24);
  border-radius: 50%;
}

.s2b-bp-ship-card__year {
  color: #aa7b17;
  font-size: 13px;
  font-weight: 800;
}

.s2b-bp-ship-card__title {
  color: #1e2b3a;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
}

.s2b-bp-partner-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 11px;
  padding: 18px;
  border: 1.5px dashed rgba(170,123,23,.58);
  background:
    linear-gradient(
      145deg,
      rgba(255,250,239,.96),
      rgba(255,255,255,.98)
    );
  color: #1e2b3a !important;
  text-align: center;
}

.s2b-bp-partner-card__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 66px;
  height: 66px;
  border: 2px dashed rgba(170,123,23,.55);
  border-radius: 15px;
  color: #aa7b17;
  font-size: 24px;
  font-weight: 800;
}

.s2b-bp-partner-card strong {
  font-size: 15px;
  line-height: 1.25;
}

.s2b-bp-profile-cta {
  margin: 18px 0 4px;
}

.s2b-bp-profile-cta a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 17px;
  border-radius: 12px;
  background: #aa7b17;
  color: #fff !important;
  font-weight: 800;
  text-decoration: none !important;
}

.s2b-bp-project-grid {
  display: grid;
  grid-template-columns:
    repeat(auto-fit, minmax(230px, 1fr));
  gap: 16px;
  margin-top: 18px;
}

.s2b-bp-project-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 155px;
  padding: 19px;
  border: 1px solid rgba(30,43,58,.11);
  border-radius: 17px;
  background: #fff;
  color: #1e2b3a !important;
  text-decoration: none !important;
  box-shadow: 0 7px 22px rgba(30,43,58,.06);
}

.s2b-bp-project-card__ship {
  font-size: 18px;
  font-weight: 800;
}

.s2b-bp-project-card__year {
  color: #aa7b17;
  font-size: 13px;
  font-weight: 800;
}

.s2b-bp-project-card__latest {
  font-size: 14px;
  line-height: 1.4;
}

.s2b-bp-project-card__count {
  margin-top: auto;
  color: #65717d;
  font-size: 13px;
}

.s2b-bp-case {
  width: min(1120px, calc(100% - 28px));
  margin: 28px auto 60px;
}

.s2b-bp-case-hero {
  display: grid;
  grid-template-columns:
    170px minmax(0, 1fr) minmax(275px, 320px);
  gap: 28px;
  align-items: center;
  padding: 34px;
  border-radius: 26px;
  background:
    linear-gradient(
      145deg,
      #1e2b3a,
      #293c50
    );
  color: #fff;
}

.s2b-bp-case-hero__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 130px;
  padding: 18px;
  border-radius: 18px;
  background: #fff;
}

.s2b-bp-case-hero__logo img {
  max-width: 100%;
  max-height: 100px;
  object-fit: contain;
}

.s2b-bp-case-logo-placeholder {
  color: #aa7b17;
  font-size: 28px;
  font-weight: 900;
}

.s2b-bp-case-hero h1 {
  margin: 0 0 10px;
  color: #fff;
  font-size: clamp(28px, 4vw, 48px);
  line-height: 1.08;
}

.s2b-bp-case-hero__meta,
.s2b-bp-case-hero__meta a {
  color: rgba(255,255,255,.86);
  font-weight: 700;
}

/* S2B_BP_PUBLIC_PROJECT_SHIP_CARD_CSS_20260917 */

.s2b-bp-case-ship {
  display: grid;
  grid-template-columns:
    128px minmax(0, 1fr);

  gap: 14px;
  align-items: stretch;

  min-width: 0;
  padding: 12px;

  border:
    1px solid
    rgba(255,255,255,.15);

  border-radius: 18px;

  background:
    rgba(255,255,255,.075);

  box-sizing: border-box;
}

.s2b-bp-case-ship__photo {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;

  min-height: 128px;

  border-radius: 13px;

  background:
    rgba(7,16,28,.34);

  text-decoration: none !important;
}

.s2b-bp-case-ship__photo img {
  display: block;

  width: 100%;
  height: 100%;
  min-height: 128px;

  object-fit: contain;
}

.s2b-bp-case-ship__photo-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 100%;
  height: 100%;
  min-height: 128px;

  color: #d8b768;

  font-size: 20px;
  font-weight: 900;
}

.s2b-bp-case-ship__body {
  min-width: 0;
}

.s2b-bp-case-ship__eyebrow {
  margin: 1px 0 4px;

  color: #d8b768;

  font-size: 9px;
  line-height: 1.2;
  font-weight: 900;

  letter-spacing: .14em;
}

.s2b-bp-case-ship__name {
  display: block;

  overflow: hidden;

  margin-bottom: 10px;

  color: #fff !important;

  font-size: 17px;
  line-height: 1.15;
  font-weight: 900;

  text-decoration: none !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.s2b-bp-case-ship__specs {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap: 8px 10px;

  margin: 0;
}

.s2b-bp-case-ship__spec {
  min-width: 0;
}

.s2b-bp-case-ship__spec dt {
  margin: 0 0 2px;

  color:
    rgba(255,255,255,.58);

  font-size: 9px;
  line-height: 1.15;
  font-weight: 700;
}

.s2b-bp-case-ship__spec dd {
  overflow: hidden;

  margin: 0;

  color: #fff;

  font-size: 12px;
  line-height: 1.2;
  font-weight: 800;

  text-overflow: ellipsis;
  white-space: nowrap;
}

.s2b-bp-case-ship__link {
  display: inline-block;

  margin-top: 10px;

  color: #f0cb72 !important;

  font-size: 11px;
  font-weight: 800;

  text-decoration: none !important;
}

.s2b-bp-case-ship__link:hover,
.s2b-bp-case-ship__link:focus {
  color: #fff !important;
  text-decoration: underline !important;
}

@media (
  min-width: 681px
) and (
  max-width: 980px
) {
  .s2b-bp-case-hero {
    grid-template-columns:
      150px minmax(0, 1fr);
  }

  .s2b-bp-case-ship {
    grid-column: 1 / -1;

    grid-template-columns:
      120px minmax(0, 1fr);
  }

  .s2b-bp-case-ship__photo,
  .s2b-bp-case-ship__photo img,
  .s2b-bp-case-ship__photo-placeholder {
    min-height: 100px;
  }
}

/* /S2B_BP_PUBLIC_PROJECT_SHIP_CARD_CSS_20260917 */

.s2b-bp-case-links {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  margin: 18px 0 34px;
}

.s2b-bp-case-links a {
  color: #1e2b3a;
  font-weight: 750;
}

.s2b-bp-case-timeline {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.s2b-bp-event {
  display: grid;
  grid-template-columns: 115px minmax(0, 1fr);
  gap: 22px;
  padding: 24px;
  border: 1px solid rgba(30,43,58,.1);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 9px 28px rgba(30,43,58,.06);
}

.s2b-bp-event__date {
  display: flex;
  flex-direction: column;
  gap: 3px;
  color: #65717d;
}

.s2b-bp-event__date strong {
  color: #aa7b17;
  font-size: 25px;
}

.s2b-bp-event__content h2 {
  margin: 0 0 6px;
  color: #1e2b3a;
}

.s2b-bp-event__relation {
  margin-bottom: 14px;
  color: #65717d;
  font-size: 13px;
  font-weight: 700;
}

.s2b-bp-event__description {
  line-height: 1.65;
}

.s2b-bp-case-gallery {
  display: grid;
  grid-template-columns:
    repeat(auto-fit, minmax(200px, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.s2b-bp-case-image {
  margin: 0;
}

.s2b-bp-case-image img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 13px;
  object-fit: cover;
}

.s2b-bp-start-grid {
  display: grid;
  gap: 14px;
  max-width: 760px;
}

.s2b-bp-start-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 18px;
  border: 1px solid rgba(30,43,58,.12);
  border-radius: 16px;
  background: #fff;
}

.s2b-bp-start-card strong,
.s2b-bp-start-card span {
  display: block;
}

.s2b-bp-start-card span {
  margin-top: 3px;
  color: #65717d;
  font-size: 13px;
}

@media (max-width: 680px) {
  .s2b-bp-ship-section {
    margin-left: -2px;
    margin-right: -2px;
    padding: 18px 14px;
  }

  .s2b-bp-ship-card,
  .s2b-bp-partner-card {
    flex-basis: 165px;
  }

  .s2b-bp-case-hero {
    grid-template-columns: 1fr;
    padding: 24px;
  }

  .s2b-bp-case-ship {
    grid-template-columns:
      112px minmax(0, 1fr);

    width: 100%;
  }

  .s2b-bp-case-ship__photo,
  .s2b-bp-case-ship__photo img,
  .s2b-bp-case-ship__photo-placeholder {
    min-height: 112px;
  }

  .s2b-bp-case-hero__logo {
    width: min(180px, 100%);
    min-height: 100px;
  }

  .s2b-bp-event {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .s2b-bp-case-links {
    flex-direction: column;
  }

  .s2b-bp-start-card {
    align-items: stretch;
    flex-direction: column;
  }
}

/* =========================================================
 * S2B_BUSINESS_PRO_REQUEST_S2B_STYLE_20260914
 * ========================================================= */

.s2b-bp-request-form {
  box-sizing: border-box;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto 50px;
  color: #172536;
}

/* Ship2Buy accent header */
.s2b-bp-request-form::before {
  content: "SHIP2BUY BUSINESS PRO";
  display: block;

  margin: 5px 0 26px;
  padding: 15px 20px;

  border: 1px solid rgba(206, 164, 61, .35);
  border-radius: 13px;

  background:
    linear-gradient(
      135deg,
      #12283d 0%,
      #183b57 65%,
      #22506c 100%
    );

  color: #d8af48;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;

  box-shadow:
    0 10px 28px rgba(18, 40, 61, .13);
}

/* Algemene form spacing */
.s2b-bp-request-form .form-item {
  margin-bottom: 18px;
}

.s2b-bp-request-form label,
.s2b-bp-request-form legend {
  color: #172536;
  font-weight: 750;
}

.s2b-bp-request-form .description {
  color: #667685;
  line-height: 1.45;
}

/* =========================================================
 * PAKKETTEN
 * ========================================================= */

.s2b-bp-request-form .form-radios {
  display: grid;
  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 12px;
  margin: 12px 0 24px;
}

.s2b-bp-request-form
.form-radios
.form-item {
  position: relative;

  box-sizing: border-box;
  margin: 0 !important;
  padding: 0;

  border: 1px solid #dce3e8;
  border-radius: 12px;

  background: #fff;

  box-shadow:
    0 4px 14px rgba(22, 43, 62, .05);

  transition:
    border-color .16s ease,
    box-shadow .16s ease,
    transform .16s ease;
}

.s2b-bp-request-form
.form-radios
.form-item:hover {
  border-color: #c99a2d;

  box-shadow:
    0 8px 22px rgba(22, 43, 62, .10);

  transform: translateY(-1px);
}

.s2b-bp-request-form
.form-radios
.form-item:has(input:checked) {
  border-color: #c99a2d;

  background:
    linear-gradient(
      180deg,
      #fffdf8 0%,
      #fff8e7 100%
    );

  box-shadow:
    0 0 0 2px rgba(201, 154, 45, .12),
    0 8px 22px rgba(22, 43, 62, .09);
}

.s2b-bp-request-form
.form-radios
input[type="radio"] {
  position: absolute;
  top: 18px;
  left: 16px;

  width: 18px;
  height: 18px;

  accent-color: #c99a2d;
}

.s2b-bp-request-form
.form-radios
label {
  box-sizing: border-box;
  display: block;

  min-height: 94px;

  margin: 0;
  padding: 17px 15px 17px 48px;

  cursor: pointer;

  color: #172536;
  line-height: 1.45;
}

/* =========================================================
 * AUTOMATISCH VERLENGEN
 * ========================================================= */

.s2b-bp-request-form
.form-item-auto-renew {
  margin: 20px 0 25px !important;
  padding: 16px 18px;

  border: 1px solid #dce3e8;
  border-left: 4px solid #c99a2d;
  border-radius: 10px;

  background: #f8fafb;
}

.s2b-bp-request-form
input[type="checkbox"] {
  width: 18px;
  height: 18px;

  accent-color: #c99a2d;
}

/* =========================================================
 * FACTUURGEGEVENS
 * ========================================================= */

.s2b-bp-request-form fieldset {
  box-sizing: border-box;

  margin: 25px 0;
  padding: 0 22px 23px;

  border: 1px solid #dce3e8;
  border-radius: 13px;

  background: #fff;

  box-shadow:
    0 6px 22px rgba(20, 42, 61, .06);

  overflow: hidden;
}

.s2b-bp-request-form
fieldset > legend {
  box-sizing: border-box;

  width: calc(100% + 44px);

  margin:
    0 -22px 21px;

  padding:
    14px 20px;

  border: 0;

  background:
    linear-gradient(
      90deg,
      #142d44 0%,
      #1d4865 100%
    );

  color: #fff;
  font-size: 1rem;
  font-weight: 800;
}

.s2b-bp-request-form
fieldset > legend span {
  color: inherit;
}

/* Velden */
.s2b-bp-request-form
input[type="text"],
.s2b-bp-request-form
input[type="email"],
.s2b-bp-request-form
input[type="number"],
.s2b-bp-request-form
select,
.s2b-bp-request-form
textarea {
  box-sizing: border-box;

  width: 100%;
  min-height: 46px;

  padding: 10px 12px;

  border: 1px solid #ccd6dd;
  border-radius: 8px;

  background: #fff;

  color: #172536;
  font-size: .97rem;

  transition:
    border-color .15s ease,
    box-shadow .15s ease;
}

.s2b-bp-request-form
input[type="text"]:focus,
.s2b-bp-request-form
input[type="email"]:focus,
.s2b-bp-request-form
input[type="number"]:focus,
.s2b-bp-request-form
select:focus,
.s2b-bp-request-form
textarea:focus {
  border-color: #c99a2d;
  outline: none;

  box-shadow:
    0 0 0 3px rgba(201, 154, 45, .14);
}

/* =========================================================
 * BEVESTIGING
 * ========================================================= */

.s2b-bp-request-form
.form-item-confirm {
  margin-top: 24px !important;
  padding: 15px 17px;

  border: 1px solid #dce3e8;
  border-radius: 10px;

  background: #f8fafb;
}

/* =========================================================
 * CTA
 * ========================================================= */

.s2b-bp-request-form
.form-actions {
  margin-top: 24px;
}

.s2b-bp-request-form
.form-actions
.button,
.s2b-bp-request-form
.form-actions
input[type="submit"] {
  box-sizing: border-box;

  display: inline-flex;
  width: 100%;
  min-height: 54px;

  align-items: center;
  justify-content: center;

  margin: 0;
  padding: 12px 22px;

  border: 1px solid #b88720;
  border-radius: 10px;

  background:
    linear-gradient(
      180deg,
      #ddb94f 0%,
      #c99a2d 100%
    );

  color: #172536 !important;

  font-size: 1rem;
  font-weight: 800;

  text-align: center;
  text-decoration: none;

  box-shadow:
    0 7px 18px rgba(145, 107, 25, .19);

  transition:
    transform .15s ease,
    box-shadow .15s ease,
    filter .15s ease;
}

.s2b-bp-request-form
.form-actions
.button:hover,
.s2b-bp-request-form
.form-actions
input[type="submit"]:hover {
  filter: brightness(1.04);

  transform: translateY(-1px);

  box-shadow:
    0 9px 23px rgba(145, 107, 25, .24);
}

/* =========================================================
 * RESPONSIVE
 * ========================================================= */

@media (max-width: 820px) {
  .s2b-bp-request-form
  .form-radios {
    grid-template-columns: 1fr;
  }

  .s2b-bp-request-form
  .form-radios
  label {
    min-height: 70px;
  }
}

@media (max-width: 620px) {
  .s2b-bp-request-form::before {
    margin-bottom: 18px;
    padding: 13px 15px;

    font-size: .68rem;
  }

  .s2b-bp-request-form fieldset {
    padding:
      0 15px 18px;
  }

  .s2b-bp-request-form
  fieldset > legend {
    width:
      calc(100% + 30px);

    margin:
      0 -15px 17px;

    padding:
      13px 15px;
  }
}

/* /S2B_BUSINESS_PRO_REQUEST_S2B_STYLE_20260914 */

/* =========================================================
 * S2B_BUSINESS_PRO_REQUEST_VISUAL_FIX_20260914
 * ========================================================= */

/*
 * ---------------------------------------------------------
 * PAKKETKEUZE — HELE KAART IS DE SELECTIE
 * ---------------------------------------------------------
 */

.s2b-bp-request-form
.form-radios
.form-item {
  position: relative;
  overflow: hidden;
}

/*
 * Native radio blijft toegankelijk voor keyboard/screenreader,
 * maar verdwijnt visueel.
 */
.s2b-bp-request-form
.form-radios
input[type="radio"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/*
 * Hele kaart klikbaar.
 */
.s2b-bp-request-form
.form-radios
.form-item
label {
  position: relative;

  display: flex;
  min-height: 102px;

  align-items: center;

  padding:
    18px 48px 18px 20px;

  border-radius: 11px;

  cursor: pointer;
}

/*
 * Eigen selectie-indicator rechtsboven.
 */
.s2b-bp-request-form
.form-radios
.form-item
label::after {
  content: "";

  position: absolute;
  top: 16px;
  right: 16px;

  box-sizing: border-box;
  width: 21px;
  height: 21px;

  border: 2px solid #c8d1d8;
  border-radius: 50%;

  background: #fff;

  transition:
    border-color .16s ease,
    background .16s ease,
    box-shadow .16s ease;
}

/*
 * Gekozen pakket.
 */
.s2b-bp-request-form
.form-radios
.form-item:has(input:checked) {
  border-color: #c99a2d !important;

  background:
    linear-gradient(
      180deg,
      #fffdf8 0%,
      #fff7df 100%
    ) !important;

  box-shadow:
    inset 0 0 0 1px rgba(201, 154, 45, .18),
    0 8px 22px rgba(24, 42, 59, .10) !important;
}

.s2b-bp-request-form
.form-radios
.form-item:has(input:checked)
label {
  color: #172536;
  font-weight: 700;
}

.s2b-bp-request-form
.form-radios
.form-item:has(input:checked)
label::after {
  border-color: #c99a2d;

  background:
    radial-gradient(
      circle,
      #c99a2d 0 43%,
      #fff 46% 100%
    );

  box-shadow:
    0 0 0 3px rgba(201, 154, 45, .12);
}

/*
 * Keyboard focus.
 */
.s2b-bp-request-form
.form-radios
.form-item:has(input:focus-visible) {
  outline: 3px solid rgba(201, 154, 45, .28);
  outline-offset: 2px;
}


/*
 * ---------------------------------------------------------
 * PAKKETBLOK KOP — GELIJK AAN S2B ACCORDION LOOK
 * ---------------------------------------------------------
 */

.s2b-bp-request-form
fieldset > legend {
  position: relative;

  border-left:
    5px solid #d1a238 !important;

  background:
    linear-gradient(
      100deg,
      #132b41 0%,
      #173d59 58%,
      #1b4d6a 100%
    ) !important;

  color: #fff !important;
}


/*
 * ---------------------------------------------------------
 * FACTUURGEGEVENS DETAILS / ACCORDION
 * ---------------------------------------------------------
 */

.s2b-bp-request-form
details {
  box-sizing: border-box;

  margin: 26px 0 !important;
  padding: 0 !important;

  border:
    1px solid #d8e0e5 !important;

  border-radius:
    13px !important;

  background:
    #fff !important;

  box-shadow:
    0 6px 20px rgba(20, 42, 61, .06);

  overflow: hidden;
}


/*
 * Exact de donkere S2B-headerstijl.
 */
.s2b-bp-request-form
details > summary {
  position: relative;

  box-sizing: border-box;
  display: flex !important;

  min-height: 70px;

  align-items: center;

  margin: 0 !important;
  padding:
    18px 58px 18px 22px !important;

  border: 0 !important;
  border-left:
    5px solid #d1a238 !important;

  border-radius:
    0 !important;

  background:
    linear-gradient(
      100deg,
      #132b41 0%,
      #173c58 55%,
      #1b4c68 100%
    ) !important;

  color:
    #fff !important;

  font-size:
    1.05rem !important;

  font-weight:
    800 !important;

  line-height:
    1.25;

  cursor: pointer;

  list-style: none !important;
}


/*
 * Browser standaard driehoek weg.
 */
.s2b-bp-request-form
details > summary::-webkit-details-marker {
  display: none !important;
}

.s2b-bp-request-form
details > summary::marker {
  display: none;
  content: "";
}


/*
 * Eigen gouden chevron zoals organisatiebeheer.
 */
.s2b-bp-request-form
details > summary::after {
  content: "";

  position: absolute;
  top: 50%;
  right: 23px;

  width: 11px;
  height: 11px;

  border-right:
    3px solid #d6a83d;

  border-bottom:
    3px solid #d6a83d;

  transform:
    translateY(-68%)
    rotate(45deg);

  transition:
    transform .18s ease;
}


/*
 * Open = chevron omhoog.
 */
.s2b-bp-request-form
details[open] > summary::after {
  transform:
    translateY(-30%)
    rotate(225deg);
}


/*
 * Hover subtiel.
 */
.s2b-bp-request-form
details > summary:hover {
  background:
    linear-gradient(
      100deg,
      #163149 0%,
      #1b4562 55%,
      #205572 100%
    ) !important;
}


/*
 * Inhoud van accordion.
 */
.s2b-bp-request-form
details > .details-wrapper {
  padding:
    24px 22px 8px !important;

  background:
    #fff;
}


/*
 * Sommige Drupal themes hebben geen .details-wrapper.
 * Geef directe inhoud na summary eveneens ruimte.
 */
.s2b-bp-request-form
details[open] > summary ~ * {
  box-sizing: border-box;
}


/*
 * ---------------------------------------------------------
 * AUTO RENEW —zelfde gouden S2B-accent
 * ---------------------------------------------------------
 */

.s2b-bp-request-form
.form-item-auto-renew {
  border-left:
    5px solid #d1a238 !important;

  background:
    linear-gradient(
      90deg,
      #fbfcfd 0%,
      #f7f9fa 100%
    ) !important;
}


/*
 * ---------------------------------------------------------
 * MOBILE
 * ---------------------------------------------------------
 */

@media (max-width: 620px) {

  .s2b-bp-request-form
  .form-radios
  .form-item
  label {
    min-height: 78px;

    padding:
      15px 46px 15px 16px;
  }

  .s2b-bp-request-form
  .form-radios
  .form-item
  label::after {
    top: 50%;
    right: 15px;

    transform:
      translateY(-50%);
  }

  .s2b-bp-request-form
  details > summary {
    min-height: 62px;

    padding:
      15px 52px 15px 17px !important;
  }

  .s2b-bp-request-form
  details > summary::after {
    right: 19px;
  }

  .s2b-bp-request-form
  details > .details-wrapper {
    padding:
      19px 15px 5px !important;
  }
}

/* /S2B_BUSINESS_PRO_REQUEST_VISUAL_FIX_20260914 */

/* =========================================================
 * S2B_BUSINESS_PRO_REQUEST_MOBILE_POLISH_20260914
 * ========================================================= */

/*
 * =========================================================
 * 1. FIELDSET / "KIES UW ABONNEMENT" VOLLEDIG BREED
 * =========================================================
 */

.s2b-bp-request-form fieldset {
  position: relative;
}

/*
 * Browser/Bootstrap geeft <legend> soms een max-width,
 * waardoor rechts een witte strook blijft staan.
 */
.s2b-bp-request-form
fieldset > legend {
  box-sizing: border-box !important;

  display: block !important;

  width:
    calc(100% + 44px) !important;

  max-width:
    none !important;

  margin:
    0 -22px 21px !important;

  padding:
    17px 20px !important;

  border-left:
    5px solid #d1a238 !important;

  border-radius:
    0 !important;

  background:
    linear-gradient(
      100deg,
      #132b41 0%,
      #173d59 58%,
      #1b4d6a 100%
    ) !important;

  color:
    #fff !important;
}

.s2b-bp-request-form
fieldset > legend > span,
.s2b-bp-request-form
fieldset > legend .fieldset-legend {
  display: block !important;
  width: 100% !important;
  color: #fff !important;
}


/*
 * =========================================================
 * 2. PAKKETSELECTIE — GOUDEN CHECK
 * =========================================================
 */

.s2b-bp-request-form
.form-radios
.form-item
label::after {
  content: "";

  display: flex;
  align-items: center;
  justify-content: center;

  box-sizing: border-box;

  width: 23px;
  height: 23px;

  border:
    2px solid #c7d0d7;

  border-radius:
    50%;

  background:
    #fff;

  color:
    #fff;

  font-size:
    14px;

  font-weight:
    900;

  line-height:
    1;

  transition:
    border-color .15s ease,
    background .15s ease,
    box-shadow .15s ease;
}

.s2b-bp-request-form
.form-radios
.form-item:has(input:checked)
label::after {
  content: "✓";

  border-color:
    #c99a2d !important;

  background:
    #c99a2d !important;

  color:
    #fff !important;

  box-shadow:
    0 0 0 4px
    rgba(201, 154, 45, .13);
}


/*
 * =========================================================
 * 3. CHECKBOX AUTOMATISCH VERLENGEN
 * =========================================================
 */

.s2b-bp-request-form
.form-item-auto-renew {
  position: relative !important;

  box-sizing: border-box;

  padding:
    18px 18px 18px 52px !important;

  border-left:
    5px solid #d1a238 !important;
}

/*
 * Bootstrap zet checkbox normaal met negatieve margin
 * buiten de kaart. Dat schakelen we volledig uit.
 */
.s2b-bp-request-form
.form-item-auto-renew
input[type="checkbox"],
.s2b-bp-request-form
.form-item-auto-renew
.form-check-input {
  position:
    absolute !important;

  top:
    21px !important;

  left:
    18px !important;

  float:
    none !important;

  box-sizing:
    border-box !important;

  width:
    21px !important;

  height:
    21px !important;

  margin:
    0 !important;

  padding:
    0 !important;

  border:
    2px solid #bdc8d0 !important;

  border-radius:
    5px !important;

  appearance:
    none !important;

  -webkit-appearance:
    none !important;

  background-color:
    #fff !important;

  background-image:
    none !important;

  box-shadow:
    none !important;

  cursor:
    pointer;

  transition:
    border-color .15s ease,
    background-color .15s ease,
    box-shadow .15s ease;
}

.s2b-bp-request-form
.form-item-auto-renew
input[type="checkbox"]:checked,
.s2b-bp-request-form
.form-item-auto-renew
.form-check-input:checked {
  border-color:
    #c99a2d !important;

  background-color:
    #c99a2d !important;

  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M3.2 8.3 6.4 11.2 12.8 4.7' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;

  background-repeat:
    no-repeat !important;

  background-position:
    center !important;

  background-size:
    15px 15px !important;

  box-shadow:
    0 0 0 4px
    rgba(201, 154, 45, .12) !important;
}

.s2b-bp-request-form
.form-item-auto-renew
input[type="checkbox"]:focus-visible {
  outline:
    3px solid rgba(201, 154, 45, .28);

  outline-offset:
    2px;
}

/*
 * Bootstrap kan ook op het label negatieve margins zetten.
 */
.s2b-bp-request-form
.form-item-auto-renew
label {
  display:
    block !important;

  margin:
    0 !important;

  padding:
    0 !important;

  color:
    #172536 !important;

  font-weight:
    700 !important;

  line-height:
    1.35;
}

.s2b-bp-request-form
.form-item-auto-renew
.description {
  margin:
    7px 0 0 !important;

  padding:
    0 !important;
}


/*
 * =========================================================
 * 4. MOBIEL
 * =========================================================
 */

@media (max-width: 620px) {

  .s2b-bp-request-form
  fieldset > legend {
    width:
      calc(100% + 30px) !important;

    max-width:
      none !important;

    margin:
      0 -15px 18px !important;

    padding:
      16px 18px !important;
  }

  .s2b-bp-request-form
  .form-item-auto-renew {
    padding:
      18px 16px 18px 47px !important;
  }

  .s2b-bp-request-form
  .form-item-auto-renew
  input[type="checkbox"],
  .s2b-bp-request-form
  .form-item-auto-renew
  .form-check-input {
    top:
      21px !important;

    left:
      15px !important;
  }

  .s2b-bp-request-form
  .form-radios
  .form-item
  label::after {
    width:
      22px;

    height:
      22px;
  }
}

/* /S2B_BUSINESS_PRO_REQUEST_MOBILE_POLISH_20260914 */

/* =========================================================
 * S2B_BUSINESS_PRO_MANAGE_S2B_STYLE_20260914
 * ========================================================= */

.s2b-bp-manage-page {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto 48px;
}

/* Hero */
.s2b-bp-manage-hero {
  position: relative;
  overflow: hidden;

  margin: 8px 0 22px;
  padding: 28px 32px;

  border-left: 6px solid #d8aa34;
  border-radius: 22px;

  background:
    linear-gradient(
      135deg,
      #14283d 0%,
      #123a56 55%,
      #0f536d 100%
    );

  box-shadow:
    0 12px 30px rgba(18, 40, 61, .12);

  color: #fff;
}

.s2b-bp-manage-hero::after {
  position: absolute;
  right: -70px;
  bottom: -100px;

  width: 300px;
  height: 300px;

  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 50%;

  content: "";
}

.s2b-bp-manage-hero__kicker {
  position: relative;
  z-index: 1;

  margin-bottom: 7px;

  color: #dbad3b;

  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .14em;
}

.s2b-bp-manage-hero h2 {
  position: relative;
  z-index: 1;

  margin: 0;

  color: #fff;

  font-size: clamp(1.8rem, 4vw, 2.6rem);
  font-weight: 800;
  line-height: 1.05;
}

.s2b-bp-manage-hero__intro {
  position: relative;
  z-index: 1;

  max-width: 720px;
  margin: 12px 0 20px;

  color: rgba(255, 255, 255, .86);

  font-size: 1rem;
}

.s2b-bp-manage-hero__status {
  position: relative;
  z-index: 1;

  display: inline-flex;
  gap: 12px;
  align-items: center;

  padding: 9px 12px;

  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 10px;

  background: rgba(255, 255, 255, .08);
}

.s2b-bp-manage-hero__status span {
  color: rgba(255, 255, 255, .82);
}

.s2b-bp-manage-hero__status strong {
  display: inline-flex;
  align-items: center;

  min-height: 28px;
  padding: 3px 10px;

  border-radius: 999px;

  font-size: .82rem;
  font-weight: 800;
}

.s2b-bp-manage-hero__status .is-active {
  background: #e7f7ec;
  color: #176b38;
}

.s2b-bp-manage-hero__status .is-inactive {
  background: #fff4d7;
  color: #76540a;
}


/* Promotion action */
.s2b-bp-manage-promotion,
.s2b-bp-manage-promotion:visited {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  min-height: 46px;
  margin: 0 0 22px !important;
  padding: 10px 18px !important;

  border: 2px solid #d5a632 !important;
  border-radius: 12px !important;

  background: #fff !important;
  color: #18314a !important;

  font-weight: 800 !important;
  text-decoration: none !important;
}

.s2b-bp-manage-promotion:hover,
.s2b-bp-manage-promotion:focus {
  background: #fff8e4 !important;
}


/* Relation accordion/card */
details.s2b-bp-manage-relation {
  overflow: hidden;

  margin: 0 0 20px;

  border: 1px solid #dfe4e8;
  border-radius: 16px;

  background: #fff;

  box-shadow:
    0 8px 24px rgba(24, 49, 74, .06);
}

details.s2b-bp-manage-relation > summary {
  position: relative;

  display: flex;
  align-items: center;

  min-height: 66px;
  padding: 18px 58px 18px 26px;

  border-left: 6px solid #d8aa34;

  background:
    linear-gradient(
      90deg,
      #152a41 0%,
      #123b58 58%,
      #12536d 100%
    );

  color: #fff;

  cursor: pointer;

  font-size: 1.08rem;
  font-weight: 800;
  line-height: 1.25;

  list-style: none;
}

details.s2b-bp-manage-relation > summary::-webkit-details-marker {
  display: none;
}

details.s2b-bp-manage-relation > summary::marker {
  content: "";
}

details.s2b-bp-manage-relation > summary::after {
  position: absolute;
  top: 50%;
  right: 24px;

  width: 12px;
  height: 12px;

  border-right: 3px solid #d9ab37;
  border-bottom: 3px solid #d9ab37;

  content: "";

  transform:
    translateY(-68%)
    rotate(45deg);

  transition: transform .18s ease;
}

details.s2b-bp-manage-relation[open] > summary::after {
  transform:
    translateY(-30%)
    rotate(225deg);
}

details.s2b-bp-manage-relation > .details-wrapper {
  padding: 22px 24px 24px;
}


/* Add event button */
.s2b-bp-manage-add,
.s2b-bp-manage-add:visited {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  min-height: 42px;

  margin: 18px 18px 12px !important;
  padding: 9px 16px !important;

  border: 0 !important;
  border-radius: 10px !important;

  background:
    linear-gradient(
      135deg,
      #164a68,
      #0f6481
    ) !important;

  color: #fff !important;

  font-weight: 800 !important;
  text-decoration: none !important;

  box-shadow:
    0 5px 13px rgba(17, 74, 101, .16);
}

.s2b-bp-manage-add:hover,
.s2b-bp-manage-add:focus {
  filter: brightness(.95);
}


/* Event table */
.s2b-bp-manage-table {
  width: calc(100% - 36px) !important;

  margin: 0 18px 20px !important;

  border: 1px solid #e0e5e9;
  border-collapse: separate !important;
  border-spacing: 0;

  border-radius: 11px;

  background: #fff;

  overflow: hidden;
}

.s2b-bp-manage-table thead th {
  padding: 11px 13px !important;

  border-bottom: 1px solid #d8e0e5 !important;

  background: #f3f6f8 !important;
  color: #23384b !important;

  font-size: .78rem;
  font-weight: 800 !important;
  letter-spacing: .025em;
  text-transform: uppercase;
}

.s2b-bp-manage-table tbody td {
  padding: 14px 13px !important;

  border-bottom: 1px solid #edf0f2 !important;

  vertical-align: middle;
}

.s2b-bp-manage-table tbody tr:last-child td {
  border-bottom: 0 !important;
}

.s2b-bp-manage-table tbody tr:hover {
  background: #fbfcfd;
}

.s2b-bp-manage-table td:first-child {
  color: #536475;
  font-weight: 700;
}

.s2b-bp-manage-table td:nth-child(3) {
  color: #172b3e;
  font-weight: 700;
}

.s2b-bp-manage-table td:last-child a {
  display: inline-flex;

  margin: 2px 5px 2px 0;
  padding: 6px 10px;

  border: 1px solid #d8dee3;
  border-radius: 8px;

  background: #fff;
  color: #174e6b;

  font-size: .86rem;
  font-weight: 700;
  text-decoration: none;
}

.s2b-bp-manage-table td:last-child a:hover,
.s2b-bp-manage-table td:last-child a:focus {
  border-color: #d6a637;
  background: #fff9e8;
  color: #172b3e;
}


/* Mobile */
@media (max-width: 760px) {
  .s2b-bp-manage-page {
    margin-bottom: 30px;
  }

  .s2b-bp-manage-hero {
    margin-top: 0;
    padding: 22px 20px;

    border-left-width: 5px;
    border-radius: 0 0 18px 18px;
  }

  .s2b-bp-manage-hero__status {
    width: 100%;
    justify-content: space-between;
  }

  .s2b-bp-manage-promotion {
    width: 100%;
  }

  details.s2b-bp-manage-relation {
    border-radius: 13px;
  }

  details.s2b-bp-manage-relation > summary {
    min-height: 62px;
    padding:
      16px
      52px
      16px
      19px;

    border-left-width: 5px;

    font-size: 1rem;
  }

  details.s2b-bp-manage-relation > summary::after {
    right: 20px;
  }

  .s2b-bp-manage-add {
    width: calc(100% - 30px);

    margin:
      16px
      15px
      12px !important;
  }

  .s2b-bp-manage-table {
    display: block;

    width: calc(100% - 30px) !important;

    margin:
      0
      15px
      18px !important;

    overflow-x: auto;
  }

  .s2b-bp-manage-table table,
  table.s2b-bp-manage-table {
    min-width: 680px;
  }
}

/* /S2B_BUSINESS_PRO_MANAGE_S2B_STYLE_20260914 */

/* =========================================================
 * S2B_BUSINESS_PRO_ACCORDION_PARITY_20260914
 *
 * Business Pro beheer:
 * zelfde accordion-header als organisatiebeheer.
 * ========================================================= */

.s2b-bp-manage-page
details.s2b-bp-manage-relation {
  overflow: hidden !important;

  margin: 0 0 22px !important;

  border: 1px solid #dfe3e7 !important;
  border-radius: 17px !important;

  background: #fff !important;

  box-shadow:
    0 8px 24px rgba(17, 40, 61, .06) !important;
}


/*
 * Header / uitklapbalk.
 *
 * Meerdere selectors bewust opgenomen zodat Drupal/
 * Bootstrap/theme-regels nooit terugvallen op grijs.
 */
.s2b-bp-manage-page
details.s2b-bp-manage-relation > summary,

.s2b-bp-manage-page
.s2b-bp-manage-relation > summary,

.s2b-bp-manage-page
.s2b-bp-manage-relation summary {

  box-sizing: border-box !important;

  position: relative !important;

  display: flex !important;

  width: 100% !important;
  min-height: 72px !important;

  align-items: center !important;

  margin: 0 !important;

  padding:
    19px
    64px
    19px
    24px !important;

  border: 0 !important;
  border-left:
    6px
    solid
    #d8aa34 !important;

  border-radius: 0 !important;

  background:
    linear-gradient(
      105deg,
      #162940 0%,
      #123a58 58%,
      #12546f 100%
    ) !important;

  background-color: #16324b !important;

  color: #fff !important;

  cursor: pointer !important;

  font-size: 1.05rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;

  text-decoration: none !important;

  list-style: none !important;

  box-shadow: none !important;

  appearance: none !important;
}


/* Ook tekst/span binnen summary wit houden. */
.s2b-bp-manage-page
.s2b-bp-manage-relation > summary * {

  color: #fff !important;
}


/* Native browserpijl volledig verwijderen. */
.s2b-bp-manage-page
.s2b-bp-manage-relation > summary::-webkit-details-marker {
  display: none !important;
}

.s2b-bp-manage-page
.s2b-bp-manage-relation > summary::marker {
  display: none !important;
  content: "" !important;
}


/* Gouden S2B-chevron rechts. */
.s2b-bp-manage-page
.s2b-bp-manage-relation > summary::after {

  box-sizing: border-box !important;

  position: absolute !important;

  top: 50% !important;
  right: 27px !important;

  display: block !important;

  width: 14px !important;
  height: 14px !important;

  margin: 0 !important;

  border: 0 !important;
  border-right:
    3px
    solid
    #d9ab37 !important;

  border-bottom:
    3px
    solid
    #d9ab37 !important;

  background: transparent !important;

  content: "" !important;

  transform:
    translateY(-68%)
    rotate(45deg) !important;

  transition:
    transform
    .18s
    ease !important;
}


/* Bij openklappen pijl omhoog. */
.s2b-bp-manage-page
.s2b-bp-manage-relation[open] > summary::after {

  transform:
    translateY(-30%)
    rotate(225deg) !important;
}


/* Geen hover-kleur van thema laten winnen. */
.s2b-bp-manage-page
.s2b-bp-manage-relation > summary:hover,

.s2b-bp-manage-page
.s2b-bp-manage-relation > summary:focus {

  background:
    linear-gradient(
      105deg,
      #172d46 0%,
      #13415f 58%,
      #145b76 100%
    ) !important;

  background-color: #17354f !important;

  color: #fff !important;

  outline: none !important;
}


/* Open inhoud: wit vlak zoals organisatiebeheer. */
.s2b-bp-manage-page
.s2b-bp-manage-relation[open] {

  background: #fff !important;
}

.s2b-bp-manage-page
.s2b-bp-manage-relation > .details-wrapper,

.s2b-bp-manage-page
.s2b-bp-manage-relation > .form-wrapper {

  background: #fff !important;
}


/* Mobiel: zelfde verhoudingen als organisatiebeheer. */
@media (max-width: 760px) {

  .s2b-bp-manage-page
  details.s2b-bp-manage-relation {

    margin-bottom: 17px !important;

    border-radius: 14px !important;
  }

  .s2b-bp-manage-page
  .s2b-bp-manage-relation > summary {

    min-height: 64px !important;

    padding:
      16px
      56px
      16px
      19px !important;

    border-left-width: 5px !important;

    font-size: 1rem !important;
  }

  .s2b-bp-manage-page
  .s2b-bp-manage-relation > summary::after {

    right: 21px !important;

    width: 13px !important;
    height: 13px !important;
  }
}

/* /S2B_BUSINESS_PRO_ACCORDION_PARITY_20260914 */

/* =========================================================
 * S2B_BUSINESS_PRO_GOLD_CHEVRONS_20260914
 * Zelfde gouden accordion-pijl als organisatiebeheer.
 * ========================================================= */

/* Alle standaard/theme-pijlen uitschakelen. */
body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary {
  position: relative !important;
  background-image: none !important;
  list-style: none !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary::-webkit-details-marker {
  display: none !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary::marker {
  content: "" !important;
  display: none !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary::before {
  display: none !important;
  content: none !important;
}

/* Eventuele Drupal/Bootstrap-arrow binnen de summary verbergen. */
body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary
.details-title::before,

body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary
.details-title::after {
  display: none !important;
  content: none !important;
}


/* Onze eigen gouden V. */
body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary::after {
  position: absolute !important;

  top: 50% !important;
  right: 28px !important;

  display: block !important;

  width: 16px !important;
  height: 16px !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  border-right: 5px solid #d9ae3d !important;
  border-bottom: 5px solid #d9ae3d !important;

  border-radius: 1px !important;

  background: transparent !important;

  content: "" !important;

  transform:
    translateY(-65%)
    rotate(45deg) !important;

  transform-origin: center !important;

  transition:
    transform .18s ease !important;

  pointer-events: none !important;
}


/* Open = gouden chevron omhoog. */
body .s2b-bp-manage-page
details.s2b-bp-manage-relation[open] > summary::after {
  transform:
    translateY(-30%)
    rotate(225deg) !important;
}


@media (max-width: 760px) {

  body .s2b-bp-manage-page
  details.s2b-bp-manage-relation > summary::after {
    right: 22px !important;

    width: 15px !important;
    height: 15px !important;

    border-right-width: 4px !important;
    border-bottom-width: 4px !important;
  }
}

/* /S2B_BUSINESS_PRO_GOLD_CHEVRONS_20260914 */

/* =========================================================
 * S2B_BUSINESS_PRO_SVG_CHEVRON_20260914
 *
 * Definitieve accordion-chevron.
 * Geen native/theme/pseudo caret meer.
 * ========================================================= */

body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary::before,

body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary::after {
  display: none !important;
  content: none !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary::-webkit-details-marker {
  display: none !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary::marker {
  content: "" !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary {
  list-style: none !important;

  /*
   * Gouden V omlaag +
   * bestaande S2B donkerblauwe gradient.
   */
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='16' viewBox='0 0 24 16'%3E%3Cpath d='M3 3.5 12 12.5 21 3.5' fill='none' stroke='%23d9ae3d' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E"),
    linear-gradient(
      105deg,
      #162940 0%,
      #123a58 58%,
      #12546f 100%
    ) !important;

  background-repeat:
    no-repeat,
    no-repeat !important;

  background-position:
    right 26px center,
    center !important;

  background-size:
    24px 16px,
    100% 100% !important;

  padding-right: 72px !important;
}

/* Open = dezelfde gouden chevron omhoog. */
body .s2b-bp-manage-page
details.s2b-bp-manage-relation[open] > summary {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='16' viewBox='0 0 24 16'%3E%3Cpath d='M3 12.5 12 3.5 21 12.5' fill='none' stroke='%23d9ae3d' stroke-width='4' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E"),
    linear-gradient(
      105deg,
      #162940 0%,
      #123a58 58%,
      #12546f 100%
    ) !important;

  background-repeat:
    no-repeat,
    no-repeat !important;

  background-position:
    right 26px center,
    center !important;

  background-size:
    24px 16px,
    100% 100% !important;
}

@media (max-width: 760px) {
  body .s2b-bp-manage-page
  details.s2b-bp-manage-relation > summary,

  body .s2b-bp-manage-page
  details.s2b-bp-manage-relation[open] > summary {
    background-position:
      right 20px center,
      center !important;

    background-size:
      22px 15px,
      100% 100% !important;

    padding-right: 60px !important;
  }
}

/* /S2B_BUSINESS_PRO_SVG_CHEVRON_20260914 */


/* =========================================================
 * S2B_BUSINESS_PRO_PROJECTS_OVERVIEW_STYLE_CSS_20260914
 * ========================================================= */

.s2b-bp-projects-page {
  box-sizing: border-box;

  max-width: 1280px;

  margin: 0 auto;
}

.s2b-business-project-intro {
  position: relative;

  overflow: hidden;

  margin:
    0
    0
    24px;

  padding:
    31px
    34px;

  border-left:
    6px solid #d8ad45;

  border-radius:
    19px;

  background:
    linear-gradient(
      108deg,
      #142940 0%,
      #163c58 58%,
      #15516d 100%
    );

  color: #fff;

  box-shadow:
    0 12px 32px
    rgba(15, 39, 58, .13);
}

.s2b-business-project-intro::before {
  display: block;

  margin-bottom: 8px;

  color:
    #d8ad45;

  content:
    "SHIP2BUY BUSINESS PRO";

  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .13em;
}

.s2b-business-project-intro h2 {
  margin:
    0
    0
    10px;

  color: #fff;

  font-size:
    clamp(
      1.9rem,
      4vw,
      2.8rem
    );

  font-weight: 850;
}

.s2b-business-project-intro p {
  max-width: 900px;

  margin:
    7px
    0;

  color:
    rgba(
      255,
      255,
      255,
      .84
    );

  line-height: 1.55;
}

.s2b-business-project-intro p strong {
  display: inline-flex;

  margin-top: 9px;

  padding:
    7px
    11px;

  border:
    1px solid
    rgba(
      216,
      173,
      69,
      .48
    );

  border-radius:
    9px;

  background:
    rgba(
      216,
      173,
      69,
      .10
    );

  color: #f0cb72;
}

table.s2b-bp-projects-table,
.s2b-bp-projects-table {
  overflow: hidden;

  width: 100%;

  margin-bottom: 24px;

  border:
    1px solid #dfe4e8;

  border-radius:
    15px;

  background:
    #fff;

  box-shadow:
    0 8px 24px
    rgba(24, 49, 74, .06);
}

.s2b-bp-projects-table thead {
  background:
    linear-gradient(
      100deg,
      #162940 0%,
      #123a58 58%,
      #12546f 100%
    );

  color:
    #fff;
}

.s2b-bp-projects-table th {
  padding:
    15px
    13px !important;

  border: 0 !important;

  color:
    #fff !important;

  font-weight:
    800;
}

.s2b-bp-projects-table td {
  padding:
    16px
    13px !important;

  vertical-align:
    middle;

  border-top:
    1px solid #edf0f2;
}

.s2b-bp-projects-table td:first-child a,
.s2b-bp-projects-table td:first-child a:visited {
  color:
    #173d59;

  font-weight:
    900;

  text-decoration:
    none;
}

.s2b-bp-projects-table td:first-child a:hover,
.s2b-bp-projects-table td:first-child a:focus {
  color:
    #b78319;

  text-decoration:
    underline;
}

.s2b-bp-projects-table td:last-child a,
.s2b-bp-projects-table td:last-child a:visited {
  display:
    inline-flex;

  min-height:
    38px;

  align-items:
    center;

  padding:
    7px
    12px;

  border:
    1px solid #d8ad45;

  border-radius:
    9px;

  background:
    #fffaf0;

  color:
    #173d59;

  font-weight:
    800;

  text-decoration:
    none;
}

.s2b-bp-projects-table td:last-child a:hover,
.s2b-bp-projects-table td:last-child a:focus {
  background:
    #fff3cf;
}

@media (max-width: 760px) {
  .s2b-business-project-intro {
    padding:
      25px
      19px;

    border-left-width:
      5px;

    border-radius:
      15px;
  }

  .s2b-bp-projects-page {
    overflow-x:
      hidden;
  }

  .s2b-bp-projects-table {
    display:
      block;

    overflow-x:
      auto;
  }
}

/* /S2B_BUSINESS_PRO_PROJECTS_OVERVIEW_STYLE_CSS_20260914 */


/* =========================================================
 * S2B_BP_ORG_CHEVRON_FINAL_20260914
 *
 * Exacte geometrie van organisatiebeheer:
 * 10x10 px, 2 px goud.
 *
 * Staat bewust ALS LAATSTE regel zodat de oude SVG-
 * en Bootstrap/theme-regels niets meer overschrijven.
 * ========================================================= */

body .s2b-bp-manage-page
details.s2b-bp-manage-relation > summary {
  position:
    relative !important;

  padding-right:
    3rem !important;

  list-style:
    none !important;

  /*
   * Verwijder de latere SVG-chevron,
   * behoud alleen de donkere S2B-gradient.
   */
  background-image:
    linear-gradient(
      105deg,
      #162940 0%,
      #123a58 58%,
      #12546f 100%
    ) !important;

  background-repeat:
    no-repeat !important;

  background-position:
    center !important;

  background-size:
    100% 100% !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation
> summary::-webkit-details-marker {
  display:
    none !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation
> summary::marker {
  display:
    none !important;

  content:
    "" !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation
> summary::before {
  display:
    none !important;

  content:
    none !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation
> summary::after {
  position:
    absolute !important;

  top:
    50% !important;

  right:
    1.2rem !important;

  display:
    block !important;

  width:
    10px !important;

  height:
    10px !important;

  margin:
    0 !important;

  padding:
    0 !important;

  border:
    0 !important;

  border-right:
    2px solid #d8ad45 !important;

  border-bottom:
    2px solid #d8ad45 !important;

  border-radius:
    0 !important;

  background:
    transparent !important;

  content:
    "" !important;

  transform:
    translateY(-65%)
    rotate(45deg) !important;

  transform-origin:
    center !important;

  transition:
    transform .16s ease !important;

  pointer-events:
    none !important;
}

body .s2b-bp-manage-page
details.s2b-bp-manage-relation[open]
> summary::after {
  transform:
    translateY(-35%)
    rotate(225deg) !important;
}

/*
 * Eventuele Bootstrap/Drupal interne carets eveneens uit.
 */
body .s2b-bp-manage-page
details.s2b-bp-manage-relation
> summary .details-title::before,

body .s2b-bp-manage-page
details.s2b-bp-manage-relation
> summary .details-title::after,

body .s2b-bp-manage-page
details.s2b-bp-manage-relation
> summary .details-summary-prefix,

body .s2b-bp-manage-page
details.s2b-bp-manage-relation
> summary .details-summary-suffix {
  display:
    none !important;

  content:
    none !important;

  background:
    none !important;
}

/* /S2B_BP_ORG_CHEVRON_FINAL_20260914 */


/* =========================================================
 * S2B_BUSINESS_PRO_EVENT_FORM_S2B_STYLE_20260914
 * ========================================================= */

body:has(.s2b-bp-event-form) .page-title {
  display: none !important;
}

.s2b-bp-event-form {
  box-sizing: border-box;

  overflow: hidden;

  width: 100%;
  max-width: 1050px;

  margin: 24px auto 52px;
  padding: 0 30px 32px;

  border: 1px solid #d9e1e7;
  border-radius: 20px;

  background: #fff;

  color: #172536;

  box-shadow:
    0 12px 34px rgba(18, 40, 61, .08);
}


/* HERO */

.s2b-bp-event-form-hero {
  position: relative;

  overflow: hidden;

  margin:
    0 -30px 30px;

  padding:
    32px 36px 30px;

  border-left:
    6px solid #d8ad45;

  background:
    linear-gradient(
      108deg,
      #12283d 0%,
      #173c58 60%,
      #1b506d 100%
    );

  color: #fff;

  box-shadow:
    0 9px 26px rgba(18, 40, 61, .13);
}

.s2b-bp-event-form-hero::after {
  position: absolute;

  top: -105px;
  right: -55px;

  width: 300px;
  height: 300px;

  border:
    1px solid rgba(255,255,255,.06);

  border-radius: 50%;

  content: "";
}

.s2b-bp-event-form-hero__kicker {
  position: relative;
  z-index: 1;

  margin-bottom: 8px;

  color: #d8ad45;

  font-size: .73rem;
  font-weight: 900;

  letter-spacing: .13em;

  text-transform: uppercase;
}

.s2b-bp-event-form-hero h1 {
  position: relative;
  z-index: 1;

  margin: 0 0 15px;

  color: #fff !important;

  font-size:
    clamp(2rem, 4vw, 3rem);

  font-weight: 850;

  line-height: 1.08;
}

.s2b-bp-event-form-hero__meta {
  position: relative;
  z-index: 1;

  display: flex;

  flex-wrap: wrap;

  gap: 8px 22px;

  align-items: center;
}

.s2b-bp-event-form-hero__meta strong {
  color: #fff;

  font-size: 1.06rem;
  font-weight: 850;
}

.s2b-bp-event-form-hero__meta span {
  color:
    rgba(255,255,255,.76);

  font-weight: 700;
}


/* FORM ITEMS */

.s2b-bp-event-form .form-item {
  margin-bottom: 22px;
}

.s2b-bp-event-form label {
  display: block;

  margin-bottom: 7px;

  color: #172536;

  font-weight: 800;
}

.s2b-bp-event-form .form-required::after {
  color: #b88720;
}

.s2b-bp-event-form .description {
  margin-top: 6px;

  color: #667685;

  font-size: .88rem;

  line-height: 1.45;
}


/* INPUTS */

.s2b-bp-event-form input[type="text"],
.s2b-bp-event-form input[type="number"],
.s2b-bp-event-form input[type="date"],
.s2b-bp-event-form textarea {
  box-sizing: border-box;

  width: 100%;

  min-height: 48px;

  padding: 11px 13px;

  border:
    1px solid #ccd6dd;

  border-radius: 9px;

  background: #fff;

  color: #172536;

  font-size: .98rem;

  transition:
    border-color .15s ease,
    box-shadow .15s ease;
}

.s2b-bp-event-form textarea {
  min-height: 180px;

  resize: vertical;
}

.s2b-bp-event-form input[type="text"]:focus,
.s2b-bp-event-form input[type="number"]:focus,
.s2b-bp-event-form input[type="date"]:focus,
.s2b-bp-event-form textarea:focus {
  border-color: #c99a2d;

  outline: none;

  box-shadow:
    0 0 0 3px
    rgba(201,154,45,.14);
}


/* FOTO UPLOAD */

.s2b-bp-event-form .form-managed-file {
  box-sizing: border-box;

  padding: 17px;

  border:
    1px dashed #bac8d2;

  border-radius: 12px;

  background:
    #f7f9fb;
}

.s2b-bp-event-form
.form-managed-file
.button,
.s2b-bp-event-form
.form-managed-file
input[type="submit"] {
  margin-top: 8px;

  border:
    1px solid #244962 !important;

  border-radius:
    8px !important;

  background:
    #173d59 !important;

  color:
    #fff !important;

  font-weight:
    750 !important;
}


/* OPENBAAR PUBLICEREN */

.s2b-bp-event-form
.form-item-published {
  margin:
    29px 0 !important;

  padding:
    17px 18px;

  border:
    1px solid rgba(216,173,69,.36);

  border-left:
    5px solid #d8ad45;

  border-radius:
    12px;

  background:
    #fffaf0;
}

.s2b-bp-event-form
.form-item-published
label {
  display: inline;

  margin: 0;

  cursor: pointer;
}


/* ACTIES */

.s2b-bp-event-form
.form-actions {
  display: flex;

  flex-wrap: wrap;

  gap: 12px;

  align-items: center;

  margin-top: 28px !important;
}

.s2b-bp-event-form
.form-actions
input[type="submit"],
.s2b-bp-event-form
.form-actions
button[type="submit"] {
  box-sizing: border-box;

  display: inline-flex !important;

  min-height: 52px;

  align-items: center;
  justify-content: center;

  padding:
    12px 25px !important;

  border:
    1px solid #b88720 !important;

  border-radius:
    10px !important;

  background:
    linear-gradient(
      180deg,
      #ddb94f 0%,
      #c99a2d 100%
    ) !important;

  color:
    #172536 !important;

  font-size:
    1rem !important;

  font-weight:
    850 !important;

  text-decoration: none !important;

  box-shadow:
    0 7px 18px
    rgba(145,107,25,.19);

  transition:
    filter .15s ease,
    transform .15s ease,
    box-shadow .15s ease;
}

.s2b-bp-event-form
.form-actions
input[type="submit"]:hover,
.s2b-bp-event-form
.form-actions
button[type="submit"]:hover {
  filter:
    brightness(1.04);

  transform:
    translateY(-1px);

  box-shadow:
    0 9px 23px
    rgba(145,107,25,.24);
}

.s2b-bp-event-form
.form-actions
a,
.s2b-bp-event-form
.form-actions
a:visited {
  display: inline-flex;

  min-height: 48px;

  align-items: center;
  justify-content: center;

  padding:
    10px 18px;

  border:
    1px solid #cfd8de;

  border-radius:
    10px;

  background: #fff;

  color:
    #173d59;

  font-weight: 800;

  text-decoration: none;
}

.s2b-bp-event-form
.form-actions
a:hover {
  border-color:
    #d8ad45;

  background:
    #fffaf0;

  color:
    #173d59;
}


/* DRUPAL MESSAGES BINNEN DEZE FLOW */

body:has(.s2b-bp-event-form)
.messages {
  max-width: 1050px;

  margin-left: auto;
  margin-right: auto;

  border-radius: 10px;
}


/* MOBILE */

@media (max-width: 700px) {

  .s2b-bp-event-form {
    margin-top: 12px;

    padding:
      0 16px 22px;

    border-radius:
      15px;
  }

  .s2b-bp-event-form-hero {
    margin:
      0 -16px 22px;

    padding:
      25px 19px 23px;

    border-left-width:
      5px;
  }

  .s2b-bp-event-form
  .form-actions {
    flex-direction:
      column;

    align-items:
      stretch;
  }

  .s2b-bp-event-form
  .form-actions
  input[type="submit"],
  .s2b-bp-event-form
  .form-actions
  button,
  .s2b-bp-event-form
  .form-actions
  a {
    width: 100%;
  }
}

/* /S2B_BUSINESS_PRO_EVENT_FORM_S2B_STYLE_20260914 */


/* =========================================================
 * S2B_BP_EVENT_PUBLISHED_CHECKBOX_ALIGN_20260914
 * ========================================================= */

.s2b-bp-event-form
.form-item-published {
  display: grid !important;

  grid-template-columns:
    20px minmax(0, 1fr);

  column-gap: 10px;
  row-gap: 5px;

  align-items: start;
}

/* Native / Bootstrap checkbox. */
.s2b-bp-event-form
.form-item-published
input[type="checkbox"] {
  grid-column: 1;
  grid-row: 1;

  width: 18px;
  height: 18px;

  margin: 2px 0 0 !important;

  align-self: start;
}

/* Label exact naast het vinkje. */
.s2b-bp-event-form
.form-item-published
label {
  grid-column: 2;
  grid-row: 1;

  margin: 0 !important;

  line-height: 1.35;
}

/* Uitleg netjes onder het label. */
.s2b-bp-event-form
.form-item-published
.description {
  grid-column: 2;
  grid-row: 2;

  margin: 0 !important;
}

/*
 * Bootstrap kan checkbox + label in een .form-check plaatsen.
 * Ook die variant uitlijnen.
 */
.s2b-bp-event-form
.form-item-published
.form-check {
  grid-column: 1 / -1;

  display: grid;

  grid-template-columns:
    20px minmax(0, 1fr);

  column-gap: 10px;

  align-items: start;

  padding-left: 0 !important;
}

.s2b-bp-event-form
.form-item-published
.form-check-input {
  position: static !important;

  float: none !important;

  width: 18px;
  height: 18px;

  margin: 2px 0 0 !important;
}

.s2b-bp-event-form
.form-item-published
.form-check-label {
  margin: 0 !important;

  line-height: 1.35;
}

/* /S2B_BP_EVENT_PUBLISHED_CHECKBOX_ALIGN_20260914 */


/* =========================================================
 * S2B_BUSINESS_PRO_PROJECTS_CENTRAL_PROMOTION_CSS_20260914
 * ========================================================= */

.s2b-bp-projects-form {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto 50px;
}

.s2b-bp-project-controls {
  display: grid;

  grid-template-columns:
    minmax(220px, 1.4fr)
    minmax(200px, 1fr)
    minmax(220px, 1fr);

  gap: 14px;

  margin:
    22px 0 18px;

  padding: 18px;

  border:
    1px solid rgba(20, 47, 70, .12);

  border-radius: 14px;

  background: #f8fafb;
}

.s2b-bp-project-controls
.form-item {
  margin: 0 !important;
}

.s2b-bp-project-controls
label {
  display: block;

  margin-bottom: 6px;

  color: #172536;

  font-weight: 800;
}

.s2b-bp-project-controls
input,
.s2b-bp-project-controls
select {
  box-sizing: border-box;

  width: 100%;
  min-height: 46px;

  padding: 9px 12px;

  border:
    1px solid #cbd6de;

  border-radius: 9px;

  background: #fff;

  color: #172536;
}

.s2b-bp-project-controls
input:focus,
.s2b-bp-project-controls
select:focus {
  border-color: #c99a2d;

  outline: none;

  box-shadow:
    0 0 0 3px
    rgba(201,154,45,.13);
}

.s2b-bp-projects-table {
  width: 100%;
}

.s2b-bp-projects-table
td,
.s2b-bp-projects-table
th {
  vertical-align: middle;
}

.s2b-bp-projects-table
input.s2b-bp-project-promotion {
  width: 19px;
  height: 19px;

  margin: 0;
}

.s2b-bp-projects-table
input.s2b-bp-project-promotion:checked {
  accent-color: #c99a2d;
}

.s2b-bp-project-manage-link {
  white-space: nowrap;

  border:
    1px solid rgba(184,135,32,.55) !important;

  background: #fff !important;

  color: #172536 !important;

  font-weight: 800;
}

.s2b-bp-project-actions {
  margin-top: 20px;
}

.s2b-bp-project-actions
.button,
.s2b-bp-project-actions
input[type="submit"] {
  display: flex;

  width: 100%;
  min-height: 52px;

  align-items: center;
  justify-content: center;

  border:
    1px solid #b88720;

  border-radius: 10px;

  background:
    linear-gradient(
      180deg,
      #ddb94f 0%,
      #c99a2d 100%
    );

  color:
    #172536 !important;

  font-weight: 850;
}

.s2b-bp-manage-projects-back {
  display: inline-flex;

  align-items: center;

  margin:
    18px 0 28px;

  padding:
    10px 17px;

  border:
    1px solid #c99a2d !important;

  border-radius: 10px;

  background:
    #fff !important;

  color:
    #172536 !important;

  font-weight: 800;

  text-decoration: none !important;
}

.s2b-bp-manage-projects-back:hover {
  background:
    #fff8e6 !important;
}

@media (max-width: 850px) {
  .s2b-bp-project-controls {
    grid-template-columns: 1fr;
  }

  .s2b-bp-projects-table {
    display: block;

    overflow-x: auto;

    -webkit-overflow-scrolling: touch;
  }
}

/* /S2B_BUSINESS_PRO_PROJECTS_CENTRAL_PROMOTION_CSS_20260914 */


/* =========================================================
 * S2B_BP_PROJECT_TABLE_HEADER_VISIBLE_FINAL_20260914
 *
 * Drupal/Bootstrap responsive table-regels mogen de
 * Business Pro tabelkop niet visueel verbergen.
 * ========================================================= */

body .s2b-bp-projects-form
table.s2b-bp-projects-table
thead {
  display: table-header-group !important;

  visibility: visible !important;
  opacity: 1 !important;

  position: static !important;

  width: auto !important;
  height: auto !important;

  overflow: visible !important;

  clip: auto !important;
  clip-path: none !important;

  white-space: normal !important;

  background:
    linear-gradient(
      100deg,
      #162940 0%,
      #123a58 58%,
      #12546f 100%
    ) !important;
}

body .s2b-bp-projects-form
table.s2b-bp-projects-table
thead tr {
  display: table-row !important;

  visibility: visible !important;
  opacity: 1 !important;

  background: transparent !important;
}

body .s2b-bp-projects-form
table.s2b-bp-projects-table
thead th {
  display: table-cell !important;

  visibility: visible !important;
  opacity: 1 !important;

  position: static !important;

  width: auto !important;
  height: auto !important;

  padding: 14px 12px !important;

  overflow: visible !important;

  border: 0 !important;

  background:
    #173b57 !important;

  color:
    #ffffff !important;

  font-size:
    .78rem !important;

  font-weight:
    850 !important;

  line-height:
    1.25 !important;

  letter-spacing:
    .025em !important;

  text-indent:
    0 !important;

  text-transform:
    uppercase !important;

  white-space:
    normal !important;

  clip:
    auto !important;

  clip-path:
    none !important;
}

/*
 * Ook eventuele spans/labels binnen TH expliciet wit.
 */
body .s2b-bp-projects-form
table.s2b-bp-projects-table
thead th *,
body .s2b-bp-projects-form
table.s2b-bp-projects-table
thead th span {
  visibility: visible !important;
  opacity: 1 !important;

  color: #ffffff !important;

  background: transparent !important;
}

/* Mobiel: header blijft eveneens zichtbaar. */
@media (max-width: 760px) {
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table
  thead {
    display: table-header-group !important;
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table
  thead tr {
    display: table-row !important;
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table
  thead th {
    display: table-cell !important;
  }
}

/* /S2B_BP_PROJECT_TABLE_HEADER_VISIBLE_FINAL_20260914 */


/* =========================================================
 * S2B_BP_PROJECT_TOP_ACTIONS_CSS_20260914
 * ========================================================= */

/*
 * De hero had zowel echte markup als een ::before-kicker.
 * Alleen de echte, toegankelijke tekst blijft staan.
 */
.s2b-bp-projects-form
.s2b-business-project-intro::before {
  display: none !important;
  content: none !important;
}

.s2b-bp-projects-form
.s2b-business-project-intro__kicker {
  display: block;

  margin: 0 0 8px;

  color: #d8ad45;

  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .13em;
  line-height: 1.2;

  text-transform: uppercase;
}

/* Actiebalk direct onder de Business Pro-hero. */
.s2b-bp-project-top-actions {
  box-sizing: border-box;

  display: flex;
  gap: 12px;

  align-items: center;
  justify-content: space-between;

  margin: -4px 0 18px;
  padding: 0;
}

.s2b-bp-project-top-actions
.s2b-bp-project-back,
.s2b-bp-project-top-actions
.s2b-bp-project-back:visited {
  box-sizing: border-box;

  display: inline-flex;

  min-height: 46px;

  align-items: center;
  justify-content: center;

  margin: 0 !important;
  padding: 10px 17px !important;

  border: 2px solid #173d59 !important;
  border-radius: 10px !important;

  background: #fff !important;

  color: #173d59 !important;

  font-weight: 800 !important;

  text-decoration: none !important;
}

.s2b-bp-project-top-actions
.s2b-bp-project-back:hover,
.s2b-bp-project-top-actions
.s2b-bp-project-back:focus {
  background: #f2f6f8 !important;
}

.s2b-bp-project-top-actions
.s2b-bp-project-save-top {
  box-sizing: border-box;

  width: auto !important;
  min-width: 220px;
  min-height: 46px;

  margin: 0 !important;
  padding: 10px 20px !important;

  border: 1px solid #b88720 !important;
  border-radius: 10px !important;

  background:
    linear-gradient(
      180deg,
      #ddb94f 0%,
      #c99a2d 100%
    ) !important;

  color: #172536 !important;

  font-weight: 850 !important;

  box-shadow:
    0 6px 16px rgba(145, 107, 25, .17);
}

.s2b-bp-project-top-actions
.s2b-bp-project-save-top:hover,
.s2b-bp-project-top-actions
.s2b-bp-project-save-top:focus {
  filter: brightness(1.04);
}

@media (max-width: 680px) {
  .s2b-bp-project-top-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .s2b-bp-project-top-actions
  .s2b-bp-project-back,
  .s2b-bp-project-top-actions
  .s2b-bp-project-save-top {
    width: 100% !important;
  }
}

/* /S2B_BP_PROJECT_TOP_ACTIONS_CSS_20260914 */


/* =========================================================
 * S2B_BUSINESS_PRO_REQUEST_PLAN_FEATURES_CSS_20260915
 * ========================================================= */

.s2b-bp-request-form
.form-radios
.form-item
label {
  align-items: flex-start !important;

  min-height: 270px !important;

  padding:
    20px
    50px
    20px
    20px !important;
}

.s2b-bp-plan-card {
  display: flex;
  width: 100%;

  flex-direction: column;
}

.s2b-bp-plan-card__name {
  padding-right: 24px;

  color: #172536;

  font-size: 1.08rem;
  font-weight: 850;
  line-height: 1.25;
}

.s2b-bp-plan-card__price {
  margin-top: 6px;

  color: #9b741d;

  font-size: 1rem;
  font-weight: 800;
  line-height: 1.35;
}

.s2b-bp-plan-card__features {
  display: flex;

  margin-top: 17px;

  flex-direction: column;
  gap: 9px;

  color: #536473;

  font-size: .88rem;
  font-weight: 500;
  line-height: 1.4;
}

.s2b-bp-plan-card__feature {
  position: relative;

  display: block;

  padding-left: 20px;
}

.s2b-bp-plan-card__feature::before {
  content: "✓";

  position: absolute;
  top: 0;
  left: 0;

  color: #c99a2d;

  font-weight: 900;
}

.s2b-bp-plan-card__feature strong {
  color: #172536;
  font-weight: 800;
}

@media (max-width: 820px) {
  .s2b-bp-request-form
  .form-radios
  .form-item
  label {
    min-height: 0 !important;
  }

  .s2b-bp-plan-card__features {
    margin-top: 15px;
  }
}

/* /S2B_BUSINESS_PRO_REQUEST_PLAN_FEATURES_CSS_20260915 */


/* S2B_BUSINESS_PRO_BANNER_MATERIAL_20260915 */

.s2b-bp-banner-form {
  max-width: 1120px;
  margin: 0 auto;
}

.s2b-bp-banner-intro {
  margin: 0 0 24px;
  padding: 26px 28px;
  border-radius: 18px;
  background: #1e2b3a;
  color: #fff;
  box-shadow: 0 14px 34px rgba(30,43,58,.16);
}

.s2b-bp-banner-intro h2 {
  margin: 6px 0 8px;
  color: #fff;
}

.s2b-bp-banner-intro p {
  margin: 0 0 14px;
  color: rgba(255,255,255,.88);
}

.s2b-bp-banner-state {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
}

.s2b-bp-banner-state--off {
  background: rgba(255,255,255,.12);
  color: #fff;
  border: 1px solid rgba(255,255,255,.22);
}

.s2b-bp-banner-state--on {
  background: #d6aa47;
  color: #172331;
}

.s2b-bp-banner-current,
.s2b-bp-banner-fallback {
  margin: 0 0 24px;
  padding: 20px;
  background: #fff;
  border: 1px solid rgba(30,43,58,.12);
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(30,43,58,.08);
}

.s2b-bp-banner-current h3,
.s2b-bp-banner-fallback h3 {
  margin: 0 0 12px;
  color: #1e2b3a;
}

.s2b-bp-banner-preview {
  width: 100%;
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid rgba(30,43,58,.12);
  background: #f7f8fa;
}

.s2b-bp-banner-preview img {
  display: block;
  width: 100%;
  max-height: 340px;
  object-fit: cover;
  object-position: center;
}

.s2b-bp-banner-logo-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 150px;
  padding: 20px;
  border-radius: 14px;
  background: #f7f8fa;
}

.s2b-bp-banner-logo-preview img {
  display: block;
  max-width: 260px;
  max-height: 130px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.s2b-bp-banner-form .form-item {
  margin-bottom: 20px;
}

.s2b-bp-banner-form .form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 26px;
}

@media (max-width: 767px) {
  .s2b-bp-banner-intro {
    padding: 20px;
    border-radius: 15px;
  }

  .s2b-bp-banner-preview img {
    max-height: 240px;
  }

  .s2b-bp-banner-form .form-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .s2b-bp-banner-form .form-actions .button {
    width: 100%;
  }
}

/* /S2B_BUSINESS_PRO_BANNER_MATERIAL_20260915 */


/* S2B_BP_BANNER_FORM_POLISH_20260915 */

.s2b-bp-banner-form {
  width: 100%;
  max-width: 1060px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 22px;
  padding-right: 22px;
  padding-bottom: 42px;
  box-sizing: border-box;
}

.s2b-bp-banner-field-card {
  position: relative;
  margin: 0 0 18px !important;
  padding: 20px 22px !important;
  background: #fff;
  border: 1px solid rgba(30, 43, 58, .12);
  border-radius: 16px;
  box-shadow: 0 7px 22px rgba(30, 43, 58, .06);
  box-sizing: border-box;
}

.s2b-bp-banner-field-card::before {
  content: "";
  position: absolute;
  top: 20px;
  bottom: 20px;
  left: 0;
  width: 4px;
  border-radius: 0 4px 4px 0;
  background: #d5a93f;
}

.s2b-bp-banner-field-card > label,
.s2b-bp-banner-field-card .form-item__label,
.s2b-bp-banner-field-card legend {
  display: block;
  margin-bottom: 9px;
  color: #1e2b3a;
  font-size: 17px;
  line-height: 1.35;
  font-weight: 800;
}

.s2b-bp-banner-field-card input[type="text"],
.s2b-bp-banner-field-card input[type="url"],
.s2b-bp-banner-field-card input[type="file"] {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.s2b-bp-banner-field-card input[type="text"],
.s2b-bp-banner-field-card input[type="url"] {
  min-height: 52px;
  padding: 11px 14px;
  border: 1px solid #cfd6dd;
  border-radius: 10px;
  background: #fff;
  color: #1e2b3a;
  font-size: 16px;
  transition:
    border-color .15s ease,
    box-shadow .15s ease;
}

.s2b-bp-banner-field-card input[type="text"]:focus,
.s2b-bp-banner-field-card input[type="url"]:focus {
  outline: none;
  border-color: #d5a93f;
  box-shadow: 0 0 0 3px rgba(213, 169, 63, .16);
}

.s2b-bp-banner-field-card .description,
.s2b-bp-banner-field-card .form-item__description {
  margin-top: 9px;
  color: #5e6872;
  font-size: 14px;
  line-height: 1.55;
}

.s2b-bp-banner-field-card--image .form-managed-file {
  margin-top: 8px;
}

.s2b-bp-banner-ready-card {
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}

.s2b-bp-banner-ready-card .form-type-checkbox {
  margin: 0;
}

.s2b-bp-banner-ready-card input[type="checkbox"] {
  width: 22px;
  height: 22px;
  margin-right: 9px;
  accent-color: #d5a93f;
}

.s2b-bp-banner-ready-card label {
  color: #1e2b3a;
  font-weight: 800;
}

.s2b-bp-banner-form .form-actions {
  margin-top: 25px;
}

.s2b-bp-banner-form .form-actions .button--primary,
.s2b-bp-banner-form .form-actions input[type="submit"] {
  min-height: 52px;
  padding: 12px 24px;
  border: 0 !important;
  border-radius: 12px !important;
  background: #d5a93f !important;
  color: #172331 !important;
  font-weight: 900;
  box-shadow: 0 7px 18px rgba(30, 43, 58, .12);
}

.s2b-bp-banner-form .form-actions .button--primary:hover,
.s2b-bp-banner-form .form-actions input[type="submit"]:hover {
  filter: brightness(.97);
}

.s2b-bp-banner-form .form-actions a.button {
  min-height: 52px;
  padding: 12px 22px;
  border: 1px solid #1e2b3a;
  border-radius: 12px;
  background: #fff;
  color: #1e2b3a;
  font-weight: 800;
}

@media (max-width: 767px) {
  .s2b-bp-banner-form {
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 30px;
  }

  .s2b-bp-banner-field-card {
    margin-bottom: 14px !important;
    padding: 18px 17px !important;
    border-radius: 14px;
  }

  .s2b-bp-banner-field-card::before {
    top: 17px;
    bottom: 17px;
  }

  .s2b-bp-banner-field-card > label,
  .s2b-bp-banner-field-card .form-item__label {
    font-size: 16px;
  }

  .s2b-bp-banner-form .form-actions {
    margin-top: 20px;
    gap: 10px;
  }
}

/* /S2B_BP_BANNER_FORM_POLISH_20260915 */


/* S2B_BP_BANNER_CHECKBOX_FIX_20260915 */

.s2b-bp-banner-ready-card.form-check,
.s2b-bp-banner-ready-card .form-check,
.s2b-bp-banner-ready-card.form-type-checkbox,
.s2b-bp-banner-ready-card .form-type-checkbox {
  padding-left: 22px !important;
}

.s2b-bp-banner-ready-card input[type="checkbox"],
.s2b-bp-banner-ready-card .form-check-input {
  appearance: none !important;
  -webkit-appearance: none !important;

  float: none !important;
  position: relative !important;

  display: inline-block !important;
  vertical-align: middle !important;

  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;

  margin: 0 10px 0 0 !important;

  border: 2px solid #1e2b3a !important;
  border-radius: 6px !important;

  background-color: #fff !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 15px 15px !important;

  box-shadow: none !important;
  cursor: pointer;
}

.s2b-bp-banner-ready-card input[type="checkbox"]:checked,
.s2b-bp-banner-ready-card .form-check-input:checked {
  border-color: #d5a93f !important;
  background-color: #d5a93f !important;

  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23172331' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.4' d='M3 8.2 6.4 11.4 13 4.8'/%3E%3C/svg%3E") !important;
}

.s2b-bp-banner-ready-card input[type="checkbox"]:focus,
.s2b-bp-banner-ready-card .form-check-input:focus {
  outline: none !important;
  border-color: #d5a93f !important;
  box-shadow: 0 0 0 3px rgba(213, 169, 63, .18) !important;
}

.s2b-bp-banner-ready-card label,
.s2b-bp-banner-ready-card .form-check-label {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
}

@media (max-width: 767px) {
  .s2b-bp-banner-ready-card.form-check,
  .s2b-bp-banner-ready-card .form-check,
  .s2b-bp-banner-ready-card.form-type-checkbox,
  .s2b-bp-banner-ready-card .form-type-checkbox {
    padding-left: 17px !important;
  }
}

/* /S2B_BP_BANNER_CHECKBOX_FIX_20260915 */


/* S2B_BP_BANNER_UPLOAD_PREVIEW_20260915 */

/*
 * De uploadkaart is voortaan de centrale plek voor de preview.
 * De oudere losse preview bovenaan wordt daarom niet dubbel getoond.
 */
.s2b-bp-banner-current {
  display: none !important;
}

.s2b-bp-upload-preview {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid rgba(30, 43, 58, .12);
}

.s2b-bp-upload-preview__label {
  margin-bottom: 10px;
  color: #1e2b3a;
  font-size: 14px;
  line-height: 1.3;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.s2b-bp-upload-preview__image {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 100%;
  min-height: 140px;

  overflow: hidden;

  border: 1px solid rgba(30, 43, 58, .12);
  border-radius: 13px;

  background: #f5f7f9;
}

.s2b-bp-upload-preview__image img {
  display: block;

  width: 100%;
  height: auto;
  max-height: 320px;

  object-fit: contain;
}

/*
 * Lange uploadbestandsnamen mogen de mobiele kaart
 * niet meer uitrekken.
 */
.s2b-bp-banner-field-card--image a {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.s2b-bp-banner-field-card--image .form-managed-file {
  max-width: 100%;
  overflow: hidden;
}

@media (max-width: 767px) {
  .s2b-bp-upload-preview {
    margin-top: 17px;
    padding-top: 16px;
  }

  .s2b-bp-upload-preview__image {
    min-height: 110px;
    border-radius: 11px;
  }

  .s2b-bp-upload-preview__image img {
    max-height: 260px;
  }
}

/* /S2B_BP_BANNER_UPLOAD_PREVIEW_20260915 */

/* S2B_BP_BANNER_PREVIEW_IN_DESCRIPTION_CSS_20260915 */

.s2b-bp-banner-upload-advice {
  margin-top: 14px;
}

.s2b-bp-banner-field-card--image .s2b-bp-upload-preview {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid rgba(30, 43, 58, .12);
}

.s2b-bp-banner-field-card--image
.s2b-bp-upload-preview__image {
  width: 100%;
  aspect-ratio: 4 / 3;
  min-height: 0;
  overflow: hidden;
  border-radius: 13px;
  background: #f4f6f8;
}

.s2b-bp-banner-field-card--image
.s2b-bp-upload-preview__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

/* /S2B_BP_BANNER_PREVIEW_IN_DESCRIPTION_CSS_20260915 */


/* S2B_BP_BANNER_PREVIEW_4X3_CARD_20260915 */

.s2b-bp-banner-field-card--image
.s2b-bp-upload-preview__image {
  width: 100%;
  aspect-ratio: 4 / 3 !important;
  overflow: hidden;
  border-radius: 14px;
  background: #eef1f4;
}

.s2b-bp-banner-field-card--image
.s2b-bp-upload-preview__image img {
  display: block;
  width: 100% !important;
  height: 100% !important;

  /*
   * Zelfde principe als de toekomstige advertentiekaart:
   * beeld vult het 4:3-vlak en wordt waar nodig gecropt.
   */
  object-fit: cover !important;
  object-position: center center !important;
}

.s2b-bp-upload-preview__label {
  margin-bottom: 10px;
  color: #1e2b3a;
  font-weight: 900;
}

/* /S2B_BP_BANNER_PREVIEW_4X3_CARD_20260915 */


/* S2B_BP_BANNER_RATIO_ADVISORY_CSS_20260915 */

.s2b-bp-banner-ratio-advice {
  margin-top: 12px;
  padding: 12px 14px;

  border-left: 4px solid #d5a93f;
  border-radius: 8px;

  background: #fff8e8;
  color: #394653;

  font-size: 14px;
  line-height: 1.5;
}

.s2b-bp-banner-ratio-advice strong {
  color: #1e2b3a;
}

/* /S2B_BP_BANNER_RATIO_ADVISORY_CSS_20260915 */


/* S2B_BP_BANNER_MANAGEMENT_NAV_CSS_20260915 */

.s2b-bp-banner-manage-link,
.s2b-bp-subscription-manage-link {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  min-height: 46px;
  padding: 10px 18px !important;

  border: 1px solid #1e2b3a !important;
  border-radius: 10px !important;

  background: #fff !important;
  color: #1e2b3a !important;

  font-weight: 800;
  text-decoration: none !important;
}

.s2b-bp-banner-manage-link {
  border-color: #d5a93f !important;
  box-shadow:
    inset 0 -3px 0 rgba(213, 169, 63, .22);
}

.s2b-bp-banner-manage-link:hover,
.s2b-bp-banner-manage-link:focus,
.s2b-bp-subscription-manage-link:hover,
.s2b-bp-subscription-manage-link:focus {
  background: #f7f8fa !important;
  color: #1e2b3a !important;
}

@media (max-width: 767px) {
  .s2b-bp-project-top-actions
  .s2b-bp-banner-manage-link {
    width: 100%;
  }
}

/* /S2B_BP_BANNER_MANAGEMENT_NAV_CSS_20260915 */


/* ==========================================================
 * S2B_BP_START_S2B_STYLE_CSS_20260915
 * Business Pro - organisatie kiezen
 * ========================================================== */

/* Alleen op /business-pro/start de standaard Drupal paginatitel weg. */
body.path-business-pro-start .block-page-title-block,
body:has(.s2b-bp-start-page) .block-page-title-block {
  display: none !important;
}

.s2b-bp-start-page {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 16px 52px;
  box-sizing: border-box;
}

/* HERO */

.s2b-bp-start-intro {
  position: relative;
  overflow: hidden;

  margin: 0 0 22px;
  padding: clamp(28px, 5vw, 48px);

  border: 1px solid rgba(213,169,63,.30);
  border-radius: 26px;

  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(213,169,63,.20) 0,
      rgba(213,169,63,0) 34%
    ),
    linear-gradient(
      135deg,
      #142238 0%,
      #1e2b3a 58%,
      #293c52 100%
    );

  box-shadow:
    0 16px 38px rgba(15,29,45,.15);

  color: #fff;
}

.s2b-bp-start-intro::after {
  content: "";
  position: absolute;
  right: -80px;
  bottom: -125px;

  width: 250px;
  height: 250px;

  border: 1px solid rgba(213,169,63,.20);
  border-radius: 50%;

  pointer-events: none;
}

.s2b-bp-start-intro .s2b-bp-kicker {
  display: flex;
  align-items: center;
  gap: 9px;

  margin: 0 0 11px;

  color: #e2bb58 !important;

  font-size: 13px;
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.s2b-bp-start-intro .s2b-bp-kicker::before {
  content: "";

  width: 24px;
  height: 2px;

  border-radius: 999px;
  background: #d5a93f;
}

.s2b-bp-start-intro h1 {
  max-width: 760px;

  margin: 0 0 12px !important;

  color: #fff !important;

  font-size: clamp(30px,5vw,46px) !important;
  line-height: 1.08 !important;
  font-weight: 850 !important;
  letter-spacing: -.025em;
}

.s2b-bp-start-intro p {
  max-width: 760px;

  margin: 0 !important;

  color: rgba(255,255,255,.82) !important;

  font-size: clamp(16px,2.1vw,19px);
  line-height: 1.55;
}

/* GRID */

.s2b-bp-start-grid {
  display: grid;

  grid-template-columns:
    repeat(
      auto-fit,
      minmax(min(100%, 300px), 1fr)
    );

  gap: 18px;

  width: 100%;
}

/* KAART */

.s2b-bp-start-card {
  display: flex;
  flex-direction: column;

  min-width: 0;
  min-height: 205px;

  padding: 22px;

  border: 1px solid rgba(30,43,58,.12);
  border-radius: 21px;

  background: #fff;

  box-shadow:
    0 8px 24px rgba(15,29,45,.055);

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease;
}

.s2b-bp-start-card:hover {
  transform: translateY(-2px);

  box-shadow:
    0 14px 30px rgba(15,29,45,.085);
}

.s2b-bp-start-card--active {
  border-color: rgba(213,169,63,.48);

  box-shadow:
    inset 0 3px 0 #d5a93f,
    0 10px 28px rgba(15,29,45,.065);
}

.s2b-bp-start-card__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;

  gap: 11px;

  margin: 0 0 22px;
}

.s2b-bp-start-card__name {
  color: #1e2b3a;

  font-size: 21px;
  line-height: 1.25;
  font-weight: 850;
}

/* STATUS */

.s2b-bp-start-card__status {
  display: inline-flex;
  align-items: center;

  min-height: 29px;

  padding: 5px 11px;

  border-radius: 999px;

  font-size: 12px;
  line-height: 1.2;
  font-weight: 850;
}

.s2b-bp-start-card__status--available {
  border: 1px solid rgba(30,43,58,.10);

  background: #f2f4f6;
  color: #66717e;
}

.s2b-bp-start-card__status--pending {
  border: 1px solid rgba(213,169,63,.30);

  background: #fff6dc;
  color: #86651d;
}

.s2b-bp-start-card__status--active {
  border: 1px solid rgba(40,124,73,.18);

  background: #ecf7f0;
  color: #267346;
}

/* CTA */

.s2b-bp-start-card__action.button {
  display: flex !important;
  align-items: center;
  justify-content: center;

  width: 100% !important;
  min-height: 50px;

  margin: auto 0 0 !important;
  padding: 11px 16px !important;

  border: 1px solid #c99c34 !important;
  border-radius: 13px !important;

  background:
    linear-gradient(
      180deg,
      #dfb84f 0%,
      #d2a438 100%
    ) !important;

  color: #172536 !important;

  box-shadow:
    0 6px 15px rgba(173,130,28,.16),
    inset 0 1px 0 rgba(255,255,255,.34) !important;

  font-size: 16px !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;

  text-align: center;
  text-decoration: none !important;
}

.s2b-bp-start-card__action.button:hover,
.s2b-bp-start-card__action.button:focus {
  transform: translateY(-1px);

  background:
    linear-gradient(
      180deg,
      #e7c15b 0%,
      #d8ab40 100%
    ) !important;

  color: #142235 !important;
}

/* Actief abonnement: beheerknop navy. */

.s2b-bp-start-card__action--active.button {
  border-color: #1e2b3a !important;

  background:
    linear-gradient(
      180deg,
      #2a3d53 0%,
      #1e2b3a 100%
    ) !important;

  color: #fff !important;

  box-shadow:
    inset 0 -3px 0 rgba(213,169,63,.45),
    0 6px 16px rgba(15,29,45,.15) !important;
}

.s2b-bp-start-card__action--active.button:hover,
.s2b-bp-start-card__action--active.button:focus {
  background:
    linear-gradient(
      180deg,
      #344a62 0%,
      #23354a 100%
    ) !important;

  color: #fff !important;
}

/* MOBIEL */

@media (max-width: 767px) {

  .s2b-bp-start-page {
    padding:
      10px
      12px
      34px;
  }

  .s2b-bp-start-intro {
    margin-bottom: 15px;
    padding: 23px 19px;

    border-radius: 20px;
  }

  .s2b-bp-start-intro h1 {
    font-size: 31px !important;
  }

  .s2b-bp-start-intro p {
    font-size: 16px;
    line-height: 1.48;
  }

  .s2b-bp-start-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .s2b-bp-start-card {
    min-height: 0;
    padding: 19px;

    border-radius: 18px;
  }

  .s2b-bp-start-card__head {
    gap: 9px;
    margin-bottom: 18px;
  }

  .s2b-bp-start-card__name {
    font-size: 20px;
  }

  .s2b-bp-start-card__action.button {
    min-height: 48px;

    font-size: 16px !important;
  }

}

/* /S2B_BP_START_S2B_STYLE_CSS_20260915 */


/* ==========================================================
 * S2B_BP_PROJECTS_MOBILE_CARDS_20260915
 *
 * Desktop behoudt de tabel.
 * Mobiel wordt iedere tabelrij een zelfstandige S2B-kaart.
 * ========================================================== */

/* De eigen Business Pro hero vervangt de generieke Drupal titel. */
body:has(.s2b-bp-projects-form) .block-page-title-block {
  display: none !important;
}

@media (max-width: 760px) {

  /*
   * De oude mobiele regel forceerde juist een klassieke tabelkop.
   * Op mobiel verbergen we die volledig.
   */
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    margin: 0 !important;

    overflow: visible !important;

    border: 0 !important;
    border-collapse: separate !important;

    background: transparent !important;
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table thead,
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table thead tr,
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table thead th {
    display: none !important;

    width: 0 !important;
    height: 0 !important;

    padding: 0 !important;
    margin: 0 !important;

    overflow: hidden !important;

    visibility: hidden !important;
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody {
    display: grid !important;

    width: 100% !important;

    gap: 14px;
  }

  /*
   * Eén schip = één kaart.
   */
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody tr {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 8px 16px !important;

    overflow: hidden !important;

    border:
      1px solid rgba(30,43,58,.12) !important;

    border-radius: 18px !important;

    background: #fff !important;

    box-shadow:
      0 8px 22px rgba(15,29,45,.06) !important;
  }

  /*
   * Iedere cel krijgt links een eigen label.
   */
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td {
    display: grid !important;

    grid-template-columns:
      minmax(92px, 34%)
      minmax(0, 1fr);

    align-items: center;

    gap: 12px;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    padding: 12px 0 !important;

    overflow: visible !important;

    border: 0 !important;
    border-bottom:
      1px solid rgba(30,43,58,.09) !important;

    background: transparent !important;

    color: #1e2b3a !important;

    font-size: 15px !important;
    line-height: 1.4 !important;

    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;

    text-align: left !important;
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:last-child {
    border-bottom: 0 !important;
  }

  /*
   * Mobiele veldlabels.
   */
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td::before {
    color: #667085;

    font-size: 12px;
    line-height: 1.25;
    font-weight: 850;

    letter-spacing: .04em;
    text-transform: uppercase;
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(1)::before {
    content: "Schip";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(2)::before {
    content: "Relatie";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(3)::before {
    content: "Projecten";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(4)::before {
    content: "Laatste";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(5)::before {
    content: "Projectadvertentie";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(6)::before {
    content: "Actie";
  }

  /*
   * Schipnaam mag duidelijk het belangrijkste gegeven zijn.
   */
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:first-child {
    color: #172536 !important;
    font-weight: 850 !important;
  }

  /*
   * Links/knoppen mogen niet buiten de kaart lopen.
   */
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td a,
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td button,
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td .button {
    max-width: 100% !important;
  }

  /*
   * Checkbox/radio-wrapper netjes rechts van het label.
   */
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table
  tbody td input[type="checkbox"] {
    width: 22px !important;
    height: 22px !important;

    margin: 0 !important;

    accent-color: #d5a93f;
  }

  /*
   * Filters compacter op telefoon.
   */
  .s2b-bp-projects-form
  .s2b-bp-project-controls {
    gap: 14px !important;

    padding: 18px !important;

    border-radius: 18px !important;
  }

  .s2b-bp-projects-form
  .s2b-bp-project-controls
  input,
  .s2b-bp-projects-form
  .s2b-bp-project-controls
  select {
    min-height: 50px !important;

    font-size: 16px !important;
  }

}

/*
 * Extra smalle telefoons:
 * iets meer ruimte voor de daadwerkelijke waarde.
 */
@media (max-width: 390px) {

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody tr {
    padding:
      6px
      14px !important;
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td {
    grid-template-columns:
      88px
      minmax(0,1fr);

    gap: 10px;

    font-size: 14px !important;
  }

}

/* /S2B_BP_PROJECTS_MOBILE_CARDS_20260915 */


/* ==========================================================
 * S2B_BP_PROJECTS_MOBILE_CARD_LABEL_FIX_20260915
 * Correcte 7-koloms mapping + leesbare mobiele labels.
 * ========================================================== */

@media (max-width: 760px) {

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td {
    grid-template-columns:
      112px
      minmax(0, 1fr) !important;

    gap: 14px !important;
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td::before {
    font-size: 11px !important;
    line-height: 1.2 !important;

    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(1)::before {
    content: "Schip";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(2)::before {
    content: "Relatie";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(3)::before {
    content: "Projecten";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(4)::before {
    content: "Gepubliceerd";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(5)::before {
    content: "Laatste";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(6)::before {
    content: "Projectadvertentie";
  }

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(7)::before {
    content: "Actie";
  }

  /*
   * Actieknop mag de volle waardekolom gebruiken.
   */
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(7) a,
  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td:nth-child(7) .button {
    width: 100% !important;
    justify-content: center !important;
  }

}

/*
 * Smalle telefoons: niet terug naar de oude 88px,
 * want dan breken de veldlabels letter voor letter.
 */
@media (max-width: 390px) {

  body .s2b-bp-projects-form
  table.s2b-bp-projects-table tbody td {
    grid-template-columns:
      106px
      minmax(0, 1fr) !important;

    gap: 11px !important;
  }

}

/* /S2B_BP_PROJECTS_MOBILE_CARD_LABEL_FIX_20260915 */


/* ==========================================================
 * S2B_BP_PAGE_TOP_WHITE_SEPARATOR_20260915
 * Dunne scheiding tussen Uitgelicht-slider en Business Pro.
 * ========================================================== */

.s2b-bp-projects-form {
  border-top: 0 !important;
}

.s2b-bp-projects-form::before {
  content: "";
  display: block;

  width: calc(100% + 32px);
  height: 1px;

  margin: 0 -16px 12px;

  background: rgba(255,255,255,.92);

  pointer-events: none;
}

/* /S2B_BP_PAGE_TOP_WHITE_SEPARATOR_20260915 */


/* ==========================================================
 * S2B_BP_TOP_ACTIONS_VISUAL_PARITY_20260915
 * Back / Bedrijfsadvertentie / Projectadvertenties opslaan
 * vormen visueel één consistente actiegroep.
 * ========================================================== */

.s2b-bp-project-top-actions
.s2b-bp-banner-manage-link {
  box-sizing: border-box !important;

  display: inline-flex !important;

  width: auto !important;
  min-width: 220px;
  min-height: 46px;

  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 10px 20px !important;

  border: 2px solid #d5a93f !important;
  border-radius: 10px !important;

  background: #fff !important;

  color: #1e2b3a !important;

  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;

  text-align: center !important;
  text-decoration: none !important;

  box-shadow:
    0 3px 9px rgba(145,107,25,.08) !important;
}

.s2b-bp-project-top-actions
.s2b-bp-banner-manage-link:hover,
.s2b-bp-project-top-actions
.s2b-bp-banner-manage-link:focus {
  background: #fffaf0 !important;

  border-color: #c99a2d !important;

  color: #172536 !important;
}

/*
 * Mobiel: alle drie exact dezelfde buitenmaat.
 */
@media (max-width: 680px) {

  .s2b-bp-project-top-actions
  .s2b-bp-project-back,

  .s2b-bp-project-top-actions
  .s2b-bp-banner-manage-link,

  .s2b-bp-project-top-actions
  .s2b-bp-project-save-top {
    box-sizing: border-box !important;

    width: 100% !important;
    min-width: 0 !important;
    min-height: 52px !important;

    margin: 0 !important;
    padding: 12px 18px !important;

    border-radius: 12px !important;

    font-size: 16px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;

    text-align: center !important;
  }

  .s2b-bp-project-top-actions
  .s2b-bp-banner-manage-link {
    display: flex !important;
  }

}

/* /S2B_BP_TOP_ACTIONS_VISUAL_PARITY_20260915 */


/* S2B_BP_PROMOTION_COUNT_WORD_SPACE_20260915
 * De teller staat binnen inline-flex; normale leading whitespace
 * na de count wordt daardoor niet betrouwbaar gerenderd.
 */
.s2b-bp-promotion-count {
  margin-right: .28em !important;
}

/* /S2B_BP_PROMOTION_COUNT_WORD_SPACE_20260915 */


/* =========================================================
 * S2B_MY_ADVERTISEMENTS_HUB_20260916
 * Centrale Business Pro-advertentiehub.
 * ========================================================= */

body:has(.s2b-my-ads-page)
.block-page-title-block {
  display: none !important;
}

.s2b-my-ads-page {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto 44px;
}

.s2b-my-ads-hero {
  position: relative;
  overflow: hidden;

  margin: 0 0 26px;
  padding: 30px 34px 34px;

  border-radius: 0 0 38px 38px;

  background:
    radial-gradient(
      circle at 88% 18%,
      rgba(215, 174, 61, .17),
      transparent 34%
    ),
    linear-gradient(
      135deg,
      #102d43 0%,
      #194965 100%
    );

  color: #fff;

  box-shadow:
    0 12px 28px rgba(18, 43, 63, .10);
}

.s2b-my-ads-hero::after {
  content: "";

  position: absolute;
  left: 34px;
  bottom: 0;

  width: 76px;
  height: 4px;

  border-radius: 999px;
  background: #d9ae3d;
}

.s2b-my-ads-kicker,
.s2b-my-ads-card-kicker {
  color: #c79b2b;

  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.s2b-my-ads-hero h1 {
  margin: 9px 0 10px;

  color: #fff;

  font-size: clamp(31px, 5vw, 46px);
  font-weight: 900;
  line-height: 1.08;
}

.s2b-my-ads-hero p {
  max-width: 760px;
  margin: 0;

  color: rgba(255, 255, 255, .88);

  font-size: 17px;
  line-height: 1.55;
}

.s2b-my-ads-empty,
.s2b-my-ads-subscription,
.s2b-my-ads-card {
  border: 1px solid #dce3e8;
  border-radius: 16px;

  background: #fff;

  box-shadow:
    0 7px 22px rgba(18, 43, 63, .07);
}

.s2b-my-ads-empty {
  display: flex;
  flex-direction: column;
  gap: 5px;

  margin-top: 20px;
  padding: 22px;
}

.s2b-my-ads-empty strong {
  color: #173d59;
  font-size: 19px;
}

.s2b-my-ads-empty span {
  color: #667781;
  line-height: 1.45;
}

.s2b-my-ads-subscription {
  margin-top: 20px;
  margin-bottom: 18px;
  padding: 22px;
}

.s2b-my-ads-subscription--inactive {
  border-style: dashed;
}

.s2b-my-ads-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;

  margin: 7px 0 17px;
}

.s2b-my-ads-card-head h2,
.s2b-my-ads-card h2 {
  margin: 0;

  color: #173d59;

  font-size: 23px;
  font-weight: 900;
  line-height: 1.16;
}

.s2b-my-ads-status {
  flex: 0 0 auto;

  display: inline-flex;
  align-items: center;

  padding: 5px 10px;

  border-radius: 999px;

  font-size: 12px;
  font-weight: 900;
}

.s2b-my-ads-status--active {
  border: 1px solid #9bcbab;
  background: #eef8f1;
  color: #23643a;
}

.s2b-my-ads-status--inactive {
  border: 1px solid #d6dde2;
  background: #f4f6f7;
  color: #66747d;
}

.s2b-my-ads-subscription > p,
.s2b-my-ads-subscription .s2b-my-ads-card-head + p {
  color: #61727c;
}

.s2b-my-ads-meta {
  display: grid;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));
  gap: 10px;

  margin: 0 0 18px;
}

.s2b-my-ads-meta > div {
  min-width: 0;
  padding: 12px;

  border-radius: 10px;
  background: #f6f8f9;
}

.s2b-my-ads-meta span,
.s2b-my-ads-meta strong {
  display: block;
}

.s2b-my-ads-meta span {
  margin-bottom: 3px;

  color: #7a8790;

  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.s2b-my-ads-meta strong {
  overflow-wrap: anywhere;

  color: #263f50;

  font-size: 14px;
  line-height: 1.35;
}

.s2b-my-ads-features {
  display: grid;
  gap: 10px;

  margin: 0 0 20px;
}

.s2b-my-ads-features > div {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr);
  gap: 9px;

  align-items: start;
}

.s2b-my-ads-features b {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 22px;
  height: 22px;

  border-radius: 50%;

  background: #eef7f0;
  color: #2d7b46;
}

.s2b-my-ads-features strong,
.s2b-my-ads-features small {
  display: block;
}

.s2b-my-ads-features strong {
  color: #263f50;
  font-size: 14px;
}

.s2b-my-ads-features small {
  margin-top: 2px;

  color: #6a7982;

  font-size: 13px;
  line-height: 1.45;
}

.s2b-my-ads-grid {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.s2b-my-ads-card {
  display: flex;
  flex-direction: column;

  min-width: 0;
  padding: 22px;
}

.s2b-my-ads-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 46px;
  height: 46px;

  margin-bottom: 15px;

  border-radius: 12px;

  background: #f3e6bd;
  color: #9d7317;

  font-size: 23px;
  font-weight: 900;
}

.s2b-my-ads-card h2 {
  margin-top: 7px;
}

.s2b-my-ads-card p {
  flex: 1 1 auto;

  margin: 10px 0 14px;

  color: #61727c;

  font-size: 14px;
  line-height: 1.5;
}

.s2b-my-ads-card-state {
  margin-bottom: 18px;

  color: #425d6d;

  font-size: 13px;
  font-weight: 850;
}

.s2b-my-ads-button.button {
  box-sizing: border-box !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 48px !important;
  padding: 10px 18px !important;

  border-radius: 11px !important;

  font-weight: 850 !important;
  line-height: 1.2 !important;

  text-align: center !important;
  text-decoration: none !important;
}

.s2b-my-ads-button--gold.button,
.s2b-my-ads-button--gold.button:visited {
  border: 2px solid #b98721 !important;

  background:
    linear-gradient(
      180deg,
      #dfb943 0%,
      #d4a52c 100%
    ) !important;

  color: #172536 !important;
}

.s2b-my-ads-button--secondary.button,
.s2b-my-ads-button--secondary.button:visited {
  border: 2px solid #173d59 !important;

  background: #fff !important;
  color: #173d59 !important;
}

.s2b-my-ads-button--gold.button:hover,
.s2b-my-ads-button--gold.button:focus {
  filter: brightness(1.035);
}

.s2b-my-ads-button--secondary.button:hover,
.s2b-my-ads-button--secondary.button:focus {
  background: #f5f8fa !important;
}

@media (max-width: 767.98px) {

  .s2b-my-ads-page {
    margin-bottom: 30px;
  }

  .s2b-my-ads-hero {
    padding: 26px 35px 30px;

    border-radius:
      0 0 38px 38px;
  }

  .s2b-my-ads-hero::after {
    left: 35px;
  }

  .s2b-my-ads-hero h1 {
    font-size: 31px;
  }

  .s2b-my-ads-hero p {
    font-size: 15px;
  }

  .s2b-my-ads-subscription,
  .s2b-my-ads-empty {
    margin-left: 0;
    margin-right: 0;
    padding: 18px;
  }

  .s2b-my-ads-meta {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .s2b-my-ads-grid {
    grid-template-columns:
      minmax(0, 1fr);
    gap: 12px;
  }

  .s2b-my-ads-card {
    padding: 18px;
  }

  .s2b-my-ads-button.button {
    width: 100% !important;
    min-height: 54px !important;
  }

}

@media (max-width: 420px) {

  .s2b-my-ads-meta {
    grid-template-columns:
      minmax(0, 1fr);
  }

}

/* /S2B_MY_ADVERTISEMENTS_HUB_20260916 */


/* =========================================================
 * S2B_BP_SUBSCRIPTION_STYLE_V3_CSS_20260916
 * Business Pro abonnementbeheer in Ship2Buy-stijl.
 * ========================================================= */

body:has(.s2b-bp-subscription-form)
.block-page-title-block {
  display: none !important;
}

.s2b-bp-subscription-form {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto 44px;
}


/* Terug naar centrale Mijn advertenties-hub. */

.s2b-bp-subscription-back.button,
.s2b-bp-subscription-back.button:visited {
  box-sizing: border-box !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 48px !important;

  margin: 18px 0 14px !important;
  padding: 10px 18px !important;

  border: 2px solid #173d59 !important;
  border-radius: 12px !important;

  background: #fff !important;
  color: #173d59 !important;

  font-weight: 850 !important;
  text-decoration: none !important;
}


/* Business Pro hero. */

.s2b-bp-subscription-hero {
  position: relative;
  overflow: hidden;

  margin: 0 0 20px;
  padding: 29px 30px 31px;

  border-radius: 18px;

  background:
    radial-gradient(
      circle at 88% 18%,
      rgba(218, 173, 57, .18),
      transparent 34%
    ),
    linear-gradient(
      135deg,
      #112d43 0%,
      #194963 100%
    );

  box-shadow:
    0 10px 28px rgba(18, 43, 63, .12);
}

.s2b-bp-subscription-hero::after {
  content: "";

  position: absolute;
  left: 30px;
  bottom: 0;

  width: 74px;
  height: 4px;

  border-radius: 999px;
  background: #d8ac38;
}

.s2b-bp-subscription-kicker {
  margin-bottom: 7px;

  color: #d8b044;

  font-size: 12px;
  font-weight: 900;
  letter-spacing: .13em;

  text-transform: uppercase;
}

.s2b-bp-subscription-hero h1 {
  margin: 0 0 6px;

  color: #fff;

  font-size: clamp(30px, 5vw, 43px);
  font-weight: 900;
  line-height: 1.08;
}

.s2b-bp-subscription-hero h2 {
  margin: 0 0 20px;

  color: rgba(255,255,255,.90);

  font-size: 21px;
  font-weight: 750;
}


/* Pakket / status / looptijd. */

.s2b-bp-subscription-meta {
  display: grid;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.s2b-bp-subscription-meta > div {
  min-width: 0;
  padding: 11px 12px;

  border: 1px solid rgba(255,255,255,.13);
  border-radius: 10px;

  background: rgba(255,255,255,.08);
}

.s2b-bp-subscription-meta span,
.s2b-bp-subscription-meta strong {
  display: block;
}

.s2b-bp-subscription-meta span {
  margin-bottom: 3px;

  color: rgba(255,255,255,.64);

  font-size: 10px;
  font-weight: 850;
  letter-spacing: .05em;

  text-transform: uppercase;
}

.s2b-bp-subscription-meta strong {
  overflow-wrap: anywhere;

  color: #fff;

  font-size: 14px;
  line-height: 1.35;
}

.s2b-bp-subscription-meta
strong.is-active {
  color: #8ee0a7;
}


/* Automatische verlenging. */

.s2b-bp-subscription-form
.form-type-checkbox {
  margin: 18px 0 !important;
  padding: 18px !important;

  border: 1px solid #dce3e8;
  border-radius: 14px;

  background: #fff;

  box-shadow:
    0 5px 18px rgba(18, 43, 63, .05);
}

.s2b-bp-subscription-form
.form-type-checkbox label {
  color: #173d59;

  font-weight: 850;
}

.s2b-bp-subscription-form
.form-type-checkbox .description,
.s2b-bp-subscription-form
.form-type-checkbox .form-item__description {
  margin-top: 5px;

  color: #697983;
  line-height: 1.5;
}


/* Acties. */

.s2b-bp-subscription-actions {
  display: grid !important;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap: 10px !important;

  margin-top: 18px !important;
}


/* Gouden primaire actie. */

.s2b-bp-subscription-form
.s2b-bp-subscription-actions
.form-submit,

.s2b-bp-subscription-request.button {
  box-sizing: border-box !important;

  min-height: 52px !important;

  padding: 11px 18px !important;

  border: 2px solid #b88720 !important;
  border-radius: 12px !important;

  background:
    linear-gradient(
      180deg,
      #dfb843 0%,
      #d4a52d 100%
    ) !important;

  color: #172536 !important;

  font-weight: 900 !important;

  text-align: center !important;
  text-decoration: none !important;

  box-shadow:
    0 6px 16px rgba(145,107,25,.14)
    !important;
}

.s2b-bp-subscription-form
.s2b-bp-subscription-actions
.form-submit {
  grid-column: 1 / -1;
  width: 100% !important;
  margin: 0 !important;
}


/* Advertentiebeheer. */

.s2b-bp-subscription-form
.s2b-bp-subscription-manage-link,

.s2b-bp-subscription-form
.s2b-bp-banner-manage-link {
  box-sizing: border-box !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  min-height: 50px !important;

  margin: 0 !important;
  padding: 11px 16px !important;

  border: 2px solid #173d59 !important;
  border-radius: 12px !important;

  background: #fff !important;
  color: #173d59 !important;

  font-weight: 850 !important;

  text-align: center !important;
  text-decoration: none !important;
}

.s2b-bp-subscription-back:hover,
.s2b-bp-subscription-back:focus,

.s2b-bp-subscription-form
.s2b-bp-subscription-manage-link:hover,

.s2b-bp-subscription-form
.s2b-bp-banner-manage-link:hover {
  background: #f4f7f9 !important;
}


/* Mobiel. */

@media (max-width: 767.98px) {

  .s2b-bp-subscription-form {
    margin-bottom: 30px;
  }

  .s2b-bp-subscription-back.button {
    width: calc(100% - 32px) !important;

    margin:
      14px
      16px
      12px !important;
  }

  .s2b-bp-subscription-hero {
    padding:
      26px
      35px
      30px;

    border-radius:
      0 0 38px 38px;
  }

  .s2b-bp-subscription-hero::after {
    left: 35px;
  }

  .s2b-bp-subscription-hero h1 {
    font-size: 31px;
  }

  .s2b-bp-subscription-hero h2 {
    font-size: 19px;
  }

  .s2b-bp-subscription-meta {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .s2b-bp-subscription-form
  .form-type-checkbox {
    margin-left: 16px !important;
    margin-right: 16px !important;
  }

  .s2b-bp-subscription-actions {
    grid-template-columns:
      minmax(0, 1fr);

    margin-left: 16px !important;
    margin-right: 16px !important;
  }

  .s2b-bp-subscription-form
  .s2b-bp-subscription-actions
  .form-submit {
    grid-column: auto;
  }

  .s2b-bp-subscription-request.button {
    display: flex !important;

    width: calc(100% - 32px) !important;

    margin:
      16px
      16px
      0 !important;

    align-items: center;
    justify-content: center;
  }

}

@media (max-width: 420px) {

  .s2b-bp-subscription-meta {
    grid-template-columns:
      minmax(0, 1fr);
  }

}

/* /S2B_BP_SUBSCRIPTION_STYLE_V3_CSS_20260916 */


/* =========================================================
 * S2B_PROJECT_BACK_BUTTON_STYLE_20260916
 * Terug naar Projectadvertenties — S2B-stijl.
 * ========================================================= */

.s2b-bp-manage-projects-back.button,
.s2b-bp-manage-projects-back.button:visited {
  position: relative;

  box-sizing: border-box !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 50px !important;

  margin: 16px 0 20px !important;
  padding: 11px 20px 11px 24px !important;

  border: 2px solid #173d59 !important;
  border-radius: 12px !important;

  background: #fff !important;
  color: #173d59 !important;

  font-size: 15px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;

  text-decoration: none !important;

  box-shadow:
    0 5px 16px rgba(18, 43, 63, .08) !important;

  transition:
    background .16s ease,
    transform .16s ease,
    box-shadow .16s ease;
}

.s2b-bp-manage-projects-back.button::before {
  content: "";

  position: absolute;

  top: 9px;
  bottom: 9px;
  left: 0;

  width: 4px;

  border-radius: 0 4px 4px 0;

  background: #d6a62f;
}

.s2b-bp-manage-projects-back.button:hover,
.s2b-bp-manage-projects-back.button:focus {
  background: #f7f9fa !important;
  color: #173d59 !important;

  transform: translateY(-1px);

  box-shadow:
    0 7px 19px rgba(18, 43, 63, .12) !important;
}

@media (max-width: 767.98px) {

  .s2b-bp-manage-projects-back.button {
    width: calc(100% - 32px) !important;

    margin:
      14px
      16px
      18px !important;

    min-height: 52px !important;
  }

}

/* /S2B_PROJECT_BACK_BUTTON_STYLE_20260916 */


/* S2B_MY_ADS_SLIDER_GAP_TEST_20260916 */
.s2b-my-ads-page {
  margin-top: 1px !important;
}
/* /S2B_MY_ADS_SLIDER_GAP_TEST_20260916 */


/* =========================================================
 * S2B_BP_REAL_AD_SIZE_PREVIEW_20260916
 *
 * Preview op dezelfde relatieve afbeeldingsgrootte als de
 * echte Business Pro-bedrijfsadvertentie:
 *
 * mobiel  : 38%
 * tablet  : 27%
 * desktop : 21%
 *
 * De bronafbeelding wordt dus niet kunstmatig over de hele
 * beheerpagina uitvergroot.
 * ========================================================= */

.s2b-bp-banner-field-card--image
.s2b-bp-upload-preview {
  margin-top: 20px;
  padding-top: 18px;

  border-top:
    1px solid rgba(30, 43, 58, .12);
}

.s2b-bp-banner-field-card--image
.s2b-bp-upload-preview__label {
  margin-bottom: 12px;
}


/*
 * Zelfde basis als de echte mobiele advertentiekaart:
 * .s2b-bp-ad-card { flex: 0 0 38%; }
 */
.s2b-bp-banner-field-card--image
.s2b-bp-upload-preview__image {
  box-sizing: border-box !important;

  width: 38% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0 !important;

  aspect-ratio: 4 / 3 !important;

  margin:
    0
    auto !important;

  overflow: hidden !important;

  border:
    1px solid rgba(30, 43, 58, .14) !important;

  border-radius: 14px !important;

  background: #f3f5f7 !important;

  box-shadow:
    0 7px 18px rgba(30, 43, 58, .09);
}


/*
 * Exact dezelfde beeldbehandeling als live:
 * object-fit cover + gecentreerde crop.
 */
.s2b-bp-banner-field-card--image
.s2b-bp-upload-preview__image img {
  display: block !important;

  width: 100% !important;
  height: 100% !important;

  max-width: none !important;
  max-height: none !important;

  aspect-ratio: 4 / 3 !important;

  object-fit: cover !important;
  object-position: center center !important;

  background: #f3f5f7 !important;
}


/*
 * Tablet:
 * echte advertentiekaart = 27%.
 */
@media (min-width: 768px) {

  .s2b-bp-banner-field-card--image
  .s2b-bp-upload-preview__image {
    width: 27% !important;
  }

}


/*
 * Desktop:
 * echte advertentiekaart = 21%.
 *
 * Bij de huidige Business Pro-formbreedte komt dit
 * grofweg neer op circa 210–225px breed.
 */
@media (min-width: 1200px) {

  .s2b-bp-banner-field-card--image
  .s2b-bp-upload-preview__image {
    width: 21% !important;
  }

}


/*
 * Lokale client-side preview direct zichtbaar.
 */
.s2b-bp-upload-preview--live {
  display: block !important;
}

/* /S2B_BP_REAL_AD_SIZE_PREVIEW_20260916 */

/* S2B_BP_BANNER_TOP_BACK_MY_ADS_CSS_20260916 */

.s2b-bp-banner-top-back {
  margin: 14px 0 18px !important;
}

.s2b-bp-banner-top-back
.s2b-bp-banner-back-my-ads.button,
.s2b-bp-banner-top-back
.s2b-bp-banner-back-my-ads.button:visited {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 46px !important;
  padding: 10px 18px !important;

  border: 2px solid #173d59 !important;
  border-radius: 11px !important;

  background: #fff !important;
  color: #173d59 !important;

  font-weight: 800 !important;
  text-decoration: none !important;

  box-shadow: 0 4px 14px rgba(30,43,58,.08) !important;
}

.s2b-bp-banner-top-back
.s2b-bp-banner-back-my-ads.button:hover,
.s2b-bp-banner-top-back
.s2b-bp-banner-back-my-ads.button:focus {
  background: #f7f9fa !important;
  color: #173d59 !important;
}

@media (max-width: 767px) {
  .s2b-bp-banner-top-back
  .s2b-bp-banner-back-my-ads.button {
    width: 100% !important;
  }
}

/* /S2B_BP_BANNER_TOP_BACK_MY_ADS_CSS_20260916 */



/* =========================================================
 * S2B_BP_PUBLIC_PROJECT_COMPANY_HERO_CSS_V2_20260917
 * Logo + bedrijfsnaam + bedrijfslink in projecthero.
 * ========================================================= */

.s2b-bp-case-hero__company {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr);
  gap: 18px;
  align-items: center;

  min-width: 0;
  width: 100%;
}

.s2b-bp-case-hero__company-info {
  min-width: 0;
}

.s2b-bp-case-hero__company-name {
  display: block;

  color: #fff !important;

  font-size: 18px;
  line-height: 1.2;
  font-weight: 900;

  text-decoration: none !important;
  overflow-wrap: anywhere;
}

.s2b-bp-case-hero__company-name:hover,
.s2b-bp-case-hero__company-name:focus {
  color: #fff !important;
  text-decoration: underline !important;
}

.s2b-bp-case-hero__company-link {
  display: inline-block;

  margin-top: 8px;

  color: #f0cb72 !important;

  font-size: 12px;
  line-height: 1.25;
  font-weight: 800;

  text-decoration: none !important;
}

.s2b-bp-case-hero__company-link:hover,
.s2b-bp-case-hero__company-link:focus {
  color: #fff !important;
  text-decoration: underline !important;
}

/* De verwijderde losse links leverden voorheen deze ruimte. */
.s2b-bp-case-timeline {
  margin-top: 34px;
}

/* Desktop */
@media (min-width: 981px) {
  .s2b-bp-case-hero {
    grid-template-columns:
      minmax(330px, .95fr)
      minmax(220px, 1fr)
      minmax(275px, 320px);

    gap: 24px;
  }
}

/* Tablet */
@media (min-width: 681px) and (max-width: 980px) {
  .s2b-bp-case-hero {
    grid-template-columns: 1fr;
  }

  .s2b-bp-case-hero__company {
    grid-template-columns:
      150px minmax(0, 1fr);
  }

  .s2b-bp-case-ship {
    grid-column: auto;
  }
}

/* Mobiel */
@media (max-width: 680px) {
  .s2b-bp-case-hero__company {
    grid-template-columns:
      112px minmax(0, 1fr);

    gap: 14px;
  }

  .s2b-bp-case-hero__logo {
    width: 100%;
    min-height: 100px;
    padding: 12px;
  }

  .s2b-bp-case-hero__logo img {
    max-height: 78px;
  }

  .s2b-bp-case-hero__company-name {
    font-size: 16px;
  }

  .s2b-bp-case-hero__company-link {
    margin-top: 6px;
    font-size: 11px;
  }

  .s2b-bp-case-timeline {
    margin-top: 28px;
  }
}

/* /S2B_BP_PUBLIC_PROJECT_COMPANY_HERO_CSS_V2_20260917 */


/* =========================================================
 * S2B_BP_PUBLIC_PROJECT_COMPANY_TEXT_FIX_V2_20260917
 * Bedrijfsnaam gewone tekst.
 * CTA op eigen regel en in Ship2Buy-goud.
 * ========================================================= */

.s2b-bp-case .s2b-bp-case-hero__company-info {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;

  min-width: 0;
}

.s2b-bp-case .s2b-bp-case-hero__company-name {
  display: block !important;

  margin: 0 !important;

  color: #fff !important;

  font-size: 17px;
  line-height: 1.22;
  font-weight: 900;

  text-decoration: none !important;
}

.s2b-bp-case .s2b-bp-case-hero__company-link,
.s2b-bp-case .s2b-bp-case-hero__company-link:visited {
  display: block !important;

  margin: 6px 0 0 !important;

  color: #f0cb72 !important;

  font-size: 12px;
  line-height: 1.25;
  font-weight: 800;

  text-decoration: none !important;
}

.s2b-bp-case .s2b-bp-case-hero__company-link:hover,
.s2b-bp-case .s2b-bp-case-hero__company-link:focus {
  color: #fff !important;
  text-decoration: underline !important;
}

@media (max-width: 680px) {

  .s2b-bp-case .s2b-bp-case-hero__company-name {
    font-size: 16px;
  }

  .s2b-bp-case .s2b-bp-case-hero__company-link {
    margin-top: 5px !important;
    font-size: 12px;
  }
}

/* /S2B_BP_PUBLIC_PROJECT_COMPANY_TEXT_FIX_V2_20260917 */


/* =========================================================
 * S2B_BP_PUBLIC_PROJECT_COMPANY_LINK_FINAL_20260917
 * Compacte CTA gelijk aan 'Bekijk schip'.
 * ========================================================= */

.s2b-bp-case
  .s2b-bp-case-hero
  a.s2b-bp-case-hero__company-link,
.s2b-bp-case
  .s2b-bp-case-hero
  a.s2b-bp-case-hero__company-link:visited {
  display: inline-block !important;

  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;

  margin: 7px 0 0 !important;
  padding: 0 !important;

  border: 0 !important;
  border-radius: 0 !important;

  background: transparent !important;
  background-image: none !important;

  color: #f0cb72 !important;

  font-size: 12px !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;

  text-decoration: none !important;

  box-shadow: none !important;
  transform: none !important;
}

.s2b-bp-case
  .s2b-bp-case-hero
  a.s2b-bp-case-hero__company-link:hover,
.s2b-bp-case
  .s2b-bp-case-hero
  a.s2b-bp-case-hero__company-link:focus,
.s2b-bp-case
  .s2b-bp-case-hero
  a.s2b-bp-case-hero__company-link:focus-visible {
  background: transparent !important;
  color: #fff !important;
  text-decoration: underline !important;
  box-shadow: none !important;
  transform: none !important;
}

@media (max-width: 680px) {
  .s2b-bp-case
    .s2b-bp-case-hero
    a.s2b-bp-case-hero__company-link,
  .s2b-bp-case
    .s2b-bp-case-hero
    a.s2b-bp-case-hero__company-link:visited {
    margin-top: 5px !important;
    font-size: 12px !important;
  }
}

/* /S2B_BP_PUBLIC_PROJECT_COMPANY_LINK_FINAL_20260917 */

/* =========================================================
   S2B_BP_SLIDER_CONTENT_GAP_20260917
   10px ruimte tussen de Uitgelicht-slider en Business Pro.
   ========================================================= */

.s2b-bp-banner-form {
  margin-top: 10px !important;
}

/* /S2B_BP_SLIDER_CONTENT_GAP_20260917 */

/* =========================================================
 * S2B_BP_REQUEST_SUBMIT_NOTE_20260918
 * ========================================================= */

.s2b-bp-submit-note {
  margin: 10px 8px 0;
  color: #687786;
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
}

/* /S2B_BP_REQUEST_SUBMIT_NOTE_20260918 */

/* =========================================================
 * S2B_BP_REQUEST_ORGANIZATION_CARD_20260918
 * ========================================================= */

.s2b-business-pro-request-org {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 3px;

  box-sizing: border-box;
  width: 100%;
  margin: 18px 0 24px;
  padding: 18px 20px 18px 25px;

  overflow: hidden;

  border: 1px solid rgba(23, 45, 66, .13);
  border-radius: 18px;

  background:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #f8fafc 100%
    );

  box-shadow:
    0 8px 22px rgba(16, 32, 51, .055);
}

.s2b-business-pro-request-org::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;

  width: 5px;

  background: #c99d36;
}

.s2b-business-pro-request-org__eyebrow {
  color: #a67b24;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: .11em;
}

.s2b-business-pro-request-org__name {
  display: block;
  margin-top: 2px;

  color: #172d42;
  font-size: clamp(25px, 5vw, 31px);
  font-weight: 850;
  line-height: 1.15;
}

.s2b-business-pro-request-org__text {
  display: block;
  margin-top: 4px;

  color: #687786;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
}

/* /S2B_BP_REQUEST_ORGANIZATION_CARD_20260918 */

/* =========================================================
 * S2B_BP_PLAN_PRESELECTED_STYLE_20260918
 * ========================================================= */

.s2b-bp-plan-preselected {
  display: flex;
  flex-direction: column;
  gap: 3px;

  margin: 0 0 15px;
  padding: 13px 15px;

  border-left: 4px solid #c99d36;
  border-radius: 12px;

  background: #fff8e8;

  color: #687786;
  font-size: 13px;
  line-height: 1.45;
}

.s2b-bp-plan-preselected strong {
  color: #172d42;
  font-size: 14px;
  font-weight: 850;
}

.s2b-bp-plan-preselected span {
  display: block;
}

/* /S2B_BP_PLAN_PRESELECTED_STYLE_20260918 */

/* =========================================================
 * S2B_BP_SHIP_CARD_LOGO_STRONGER_20260918
 *
 * Project-/partnerkaart op scheepspagina:
 * - bedrijfslogo visueel dominant;
 * - minder loze ruimte rond logo;
 * - jaartal en projecttekst rustiger;
 * - kaartafmetingen blijven gelijk aan partnerkaart.
 * ========================================================= */

.s2b-bp-ship-card {
  gap: 8px;
  padding: 14px;
}

/*
 * Groter logovlak zonder de kaart zelf groter te maken.
 */
.s2b-bp-ship-card__logo {
  position: relative;

  height: 96px;
  padding: 4px;

  overflow: hidden;

  border-radius: 13px;

  background: #f7f8fa;
}

/*
 * Optisch groter logo.
 *
 * De transform helpt ook wanneer het aangeleverde
 * logobestand zelf relatief veel transparante/witte marge bevat.
 */
.s2b-bp-ship-card__logo img {
  display: block;

  width: auto;
  height: auto;

  max-width: 118%;
  max-height: 82px;

  object-fit: contain;

  transform: scale(1.22);
  transform-origin: center center;
}

/*
 * Jaartal ondersteunend in plaats van dominant.
 */
.s2b-bp-ship-card__year {
  margin-top: 1px;

  color: #aa7b17;

  font-size: 11px;
  line-height: 1.15;
  font-weight: 750;
}

/*
 * Projectomschrijving compacter.
 */
.s2b-bp-ship-card__title {
  display: -webkit-box;

  margin: 0;

  overflow: hidden;

  color: #1e2b3a;

  font-size: 14px;
  line-height: 1.22;
  font-weight: 800;

  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

/*
 * Mobiel: logo blijft duidelijk het belangrijkste onderdeel.
 */
@media (max-width: 680px) {
  .s2b-bp-ship-card {
    padding: 12px;
    gap: 7px;
  }

  .s2b-bp-ship-card__logo {
    height: 90px;
    padding: 3px;
  }

  .s2b-bp-ship-card__logo img {
    max-width: 122%;
    max-height: 78px;

    transform: scale(1.25);
  }

  .s2b-bp-ship-card__year {
    font-size: 10px;
  }

  .s2b-bp-ship-card__title {
    font-size: 13px;
    line-height: 1.2;
  }
}

/* /S2B_BP_SHIP_CARD_LOGO_STRONGER_20260918 */

/* =========================================================
 * S2B_BP_SHIP_CARD_REMOVE_BOTTOM_SPACE_20260918
 * Alleen de projectkaart op scheepspagina mag op inhoudshoogte
 * vallen, zodat de loze ruimte onder de tekst verdwijnt.
 * ========================================================= */

.s2b-bp-ship-slider {
  align-items: flex-start;
}

.s2b-bp-ship-card {
  min-height: 0 !important;
  height: auto !important;
  align-self: flex-start;
}

/* Partnerkaart voorlopig ongemoeid laten. */
/* /S2B_BP_SHIP_CARD_REMOVE_BOTTOM_SPACE_20260918 */

/* =========================================================
 * S2B_BP_PARTNER_CARD_COMPACT_20260918
 *
 * Rechter Business Pro-partnerkaart compacter maken zodat
 * deze niet langer de hoogte van het hele sliderblok bepaalt.
 * ========================================================= */

.s2b-bp-partner-card {
  min-height: 0 !important;
  height: auto !important;
  align-self: flex-start;

  padding: 14px;
  gap: 8px;
}

.s2b-bp-partner-card__logo {
  width: 58px;
  height: 58px;

  font-size: 22px;
}

.s2b-bp-partner-card strong {
  font-size: 14px;
  line-height: 1.2;
}

/* Mobiel */
@media (max-width: 680px) {
  .s2b-bp-partner-card {
    padding: 12px;
    gap: 7px;
  }

  .s2b-bp-partner-card__logo {
    width: 56px;
    height: 56px;
  }

  .s2b-bp-partner-card strong {
    font-size: 13px;
  }
}

/* /S2B_BP_PARTNER_CARD_COMPACT_20260918 */

/* =========================================================
 * S2B_BP_SHIP_CARDS_EQUAL_HEIGHT_20260918
 *
 * Projectkaart en Business Pro-partnerkaart krijgen
 * exact dezelfde vaste hoogte.
 * ========================================================= */

.s2b-bp-ship-slider {
  align-items: flex-start;
}

.s2b-bp-ship-card,
.s2b-bp-partner-card {
  box-sizing: border-box;

  height: 205px !important;
  min-height: 205px !important;
  max-height: 205px !important;

  align-self: flex-start;
}

/*
 * Mobiel compacter, maar beide kaarten exact gelijk.
 */
@media (max-width: 680px) {
  .s2b-bp-ship-card,
  .s2b-bp-partner-card {
    height: 180px !important;
    min-height: 180px !important;
    max-height: 180px !important;
  }
}

/* /S2B_BP_SHIP_CARDS_EQUAL_HEIGHT_20260918 */

/* =========================================================
 * S2B_BP_MONTHLY_PRICE_STYLE_20260918
 * Maandprijs primair, jaarfacturering secundair.
 * ========================================================= */

.s2b-bp-plan-card__price {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  column-gap: 7px;
  row-gap: 3px;

  margin-top: 9px;

  color: #9b741d;
}

.s2b-bp-plan-card__price-main {
  color: #a67b24;

  font-size: clamp(1.8rem, 3vw, 2.2rem);
  line-height: 1;
  font-weight: 900;
  letter-spacing: -.025em;
}

.s2b-bp-plan-card__price-period {
  color: #34495b;

  font-size: .95rem;
  line-height: 1.2;
  font-weight: 800;
}

.s2b-bp-plan-card__price-yearly {
  display: block;
  flex: 0 0 100%;

  margin-top: 4px;

  color: #71808e;

  font-size: .76rem;
  line-height: 1.35;
  font-weight: 650;
}

@media (max-width: 680px) {
  .s2b-bp-plan-card__price-main {
    font-size: 2rem;
  }

  .s2b-bp-plan-card__price-period {
    font-size: .9rem;
  }

  .s2b-bp-plan-card__price-yearly {
    font-size: .74rem;
  }
}

/* /S2B_BP_MONTHLY_PRICE_STYLE_20260918 */


/* ==========================================================
 * S2B_BP_PROJECT_SHIPCONNECT_FINAL_20260922
 * ========================================================== */

.s2b-bp-project-top-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 22px;
}

.s2b-bp-project-top-actions .button,
.s2b-bp-project-top-actions .form-submit,
.s2b-bp-project-top-actions .s2b-bp-project-new {
  min-height: 45px;
  padding: 0 17px;
  border-radius: 11px;
  font-weight: 800;
  text-decoration: none;
}

.s2b-bp-project-top-actions
.s2b-bp-project-shipconnect {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  border: 1px solid #163654;
  background: #fff;
  color: #0b213b;
}

.s2b-bp-project-top-actions
.s2b-bp-project-shipconnect:hover,
.s2b-bp-project-top-actions
.s2b-bp-project-shipconnect:focus-visible {
  border-color: #dda316;
  background: #fffaf0;
}

.s2b-bp-project-top-actions
.s2b-bp-project-new {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.s2b-bp-project-top-actions
.s2b-bp-project-new.is-disabled {
  cursor: not-allowed;
  border: 1px solid #d9dee5;
  background: #edf0f4;
  color: #87919e;
  opacity: .86;
}


/* Empty-state. */

.s2b-bp-project-empty {
  margin: 18px 0 28px;
  padding: 32px;

  border: 1px solid #dde4ec;
  border-left: 5px solid #e3a91b;
  border-radius: 18px;

  background:
    linear-gradient(
      135deg,
      #fff 0%,
      #f5f8fb 100%
    );

  box-shadow:
    0 10px 30px rgba(9, 31, 55, .07);
}

.s2b-bp-project-empty__content {
  max-width: 720px;
}

.s2b-bp-project-empty__kicker {
  margin: 0 0 7px;

  color: #bd8405;
  font-size: 13px;
  font-weight: 850;
  letter-spacing: .1em;
}

.s2b-bp-project-empty h3 {
  margin: 0 0 9px;

  color: #12243a;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 850;
}

.s2b-bp-project-empty p {
  max-width: 700px;
  margin: 0 0 22px;

  color: #687587;
  font-size: 15px;
  line-height: 1.6;
}

.s2b-bp-project-empty__button,
.s2b-bp-project-empty__button:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 48px;
  padding: 0 20px;

  border: 1px solid #c88d08;
  border-radius: 11px;

  background:
    linear-gradient(
      180deg,
      #efba2f,
      #e3a91b
    );

  color: #142033;
  font-weight: 850;
  text-decoration: none;
}


/* Acties per schip. */

.s2b-bp-project-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.s2b-bp-project-row-actions .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 38px;
  padding: 0 12px;

  border-radius: 9px;

  font-size: 13px;
  line-height: 1.2;
  font-weight: 800;
  white-space: nowrap;
  text-decoration: none;
}

.s2b-bp-project-row-actions
.s2b-bp-project-add-link {
  border: 1px solid #c88d08;
  background: #e3a91b;
  color: #142033;
}

.s2b-bp-project-row-actions
.s2b-bp-project-manage-link {
  border: 1px solid #cbd4df;
  background: #fff;
  color: #102a49;
}

.s2b-bp-project-row-actions
.s2b-bp-project-add-link:hover,
.s2b-bp-project-row-actions
.s2b-bp-project-add-link:focus-visible {
  background: #efb72d;
  color: #101a28;
}

.s2b-bp-project-row-actions
.s2b-bp-project-manage-link:hover,
.s2b-bp-project-row-actions
.s2b-bp-project-manage-link:focus-visible {
  border-color: #102a49;
  background: #f5f8fb;
}


@media (max-width: 720px) {
  .s2b-bp-project-top-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .s2b-bp-project-top-actions .button,
  .s2b-bp-project-top-actions .form-submit,
  .s2b-bp-project-top-actions
  .s2b-bp-project-new {
    width: 100%;
  }

  .s2b-bp-project-empty {
    padding: 23px 18px;
    border-radius: 15px;
  }

  .s2b-bp-project-empty__button {
    width: 100%;
  }

  .s2b-bp-project-row-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .s2b-bp-project-row-actions .button {
    width: 100%;
  }
}

/* /S2B_BP_PROJECT_SHIPCONNECT_FINAL_20260922 */

/* ==========================================================
 * S2B_BP_SUBSCRIPTION_CHECKBOX_FINAL_20260922
 *
 * Mijn Business Pro:
 * Bootstrap checkbox mag niet met negatieve margin
 * buiten de verlengingskaart vallen.
 * ========================================================== */

.s2b-bp-subscription-form
.form-item-auto-renew {
  position: relative !important;

  box-sizing: border-box !important;
  width: 100%;

  margin:
    0 0 22px
    !important;

  padding:
    22px 24px 22px 60px
    !important;

  border:
    1px solid
    #dde4ea;

  border-left:
    5px solid
    #dfb33f;

  border-radius:
    18px;

  background:
    #fff;

  box-shadow:
    0 8px 26px
    rgba(15,35,55,.055);
}


/*
 * Bootstrap .form-check-input gebruikt normaliter
 * een negatieve margin-left.
 * Hier staat het vinkje absoluut BINNEN de kaart.
 */
.s2b-bp-subscription-form
.form-item-auto-renew
input[type="checkbox"],

.s2b-bp-subscription-form
.form-item-auto-renew
.form-check-input {
  position:
    absolute
    !important;

  top:
    23px
    !important;

  left:
    22px
    !important;

  float:
    none
    !important;

  width:
    22px
    !important;

  height:
    22px
    !important;

  margin:
    0
    !important;

  padding:
    0
    !important;

  box-sizing:
    border-box
    !important;
}


.s2b-bp-subscription-form
.form-item-auto-renew
label,

.s2b-bp-subscription-form
.form-item-auto-renew
.form-check-label {
  display:
    block
    !important;

  margin:
    0
    !important;

  padding:
    0
    !important;

  color:
    #1e3247;

  font-weight:
    800;

  line-height:
    1.4;
}


.s2b-bp-subscription-form
.form-item-auto-renew
.description,

.s2b-bp-subscription-form
.form-item-auto-renew
.form-item__description {
  display:
    block;

  margin:
    7px 0 0
    !important;

  padding:
    0
    !important;

  color:
    #667587;

  line-height:
    1.55;
}


/*
 * Teruglink staat door de Form API-weight direct
 * onder de hero. Hier alleen de nette tussenruimte.
 */
.s2b-bp-subscription-form
.s2b-bp-subscription-back {
  margin:
    0 0 22px
    !important;
}


@media (max-width: 620px) {

  .s2b-bp-subscription-form
  .form-item-auto-renew {
    padding:
      19px 16px 19px 52px
      !important;

    border-radius:
      16px;
  }

  .s2b-bp-subscription-form
  .form-item-auto-renew
  input[type="checkbox"],

  .s2b-bp-subscription-form
  .form-item-auto-renew
  .form-check-input {
    top:
      20px
      !important;

    left:
      17px
      !important;
  }
}

/* /S2B_BP_SUBSCRIPTION_CHECKBOX_FINAL_20260922 */

/* =========================================================
 * S2B_BP_ADVERTISING_CHOICE_S2B_STYLE_20260922
 *
 * /business-pro/adverteren:
 * compacte Ship2Buy Business Pro organisatiekeuze.
 * ========================================================= */

.s2b-bp-advertising-choice-page
.s2b-bp-start-grid {
  grid-template-columns:
    repeat(
      auto-fit,
      minmax(260px, 360px)
    );

  justify-content: start;
  gap: 18px;

  max-width: 780px;
}


/* KAART */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card {
  position: relative;

  display: flex;
  flex-direction: column;

  min-width: 0;
  min-height: 0;

  padding: 0;

  overflow: hidden;

  border:
    1px solid
    rgba(23, 45, 66, .16);

  border-radius: 18px;

  background: #fff;

  box-shadow:
    0 9px 26px
    rgba(15, 29, 45, .08);

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease;
}

.s2b-bp-advertising-choice-page
.s2b-bp-start-card::before {
  content: "";

  position: absolute;
  z-index: 3;

  top: 0;
  left: 0;
  right: 0;

  height: 4px;

  background: #d5a93f;
}

.s2b-bp-advertising-choice-page
.s2b-bp-start-card:hover {
  transform: translateY(-3px);

  border-color:
    rgba(213, 169, 63, .50);

  box-shadow:
    0 15px 34px
    rgba(15, 29, 45, .13);
}


/* NAVY BOVENVLAK */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__head {
  position: relative;

  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;

  gap: 10px;

  box-sizing: border-box;

  min-height: 118px;

  margin: 0;
  padding: 23px 22px 21px;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(213, 169, 63, .16) 0,
      rgba(213, 169, 63, 0) 40%
    ),
    linear-gradient(
      135deg,
      #142238 0%,
      #1d334a 58%,
      #16445f 100%
    );

  color: #fff;
}

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__head::before {
  content: "ORGANISATIE";

  display: block;

  color: #e0b94f;

  font-size: 10px;
  line-height: 1;
  font-weight: 900;

  letter-spacing: .12em;
}


/* NAAM */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__name {
  max-width: 100%;

  color: #fff !important;

  font-size: 22px;
  line-height: 1.15;
  font-weight: 900;

  letter-spacing: -.015em;

  overflow-wrap: anywhere;
}


/* STATUS */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__status,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__status--active {
  display: inline-flex;
  align-items: center;

  min-height: 28px;

  padding: 5px 10px;

  border:
    1px solid
    rgba(226, 187, 88, .36);

  border-radius: 999px;

  background:
    rgba(213, 169, 63, .12);

  color: #f0cc70;

  font-size: 11px;
  line-height: 1.15;
  font-weight: 850;
}


/* GOUDEN ACTIEBALK */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:visited {
  display: flex !important;

  align-items: center !important;
  justify-content: space-between !important;

  gap: 14px;

  box-sizing: border-box;

  width: 100% !important;
  min-height: 54px;

  margin: auto 0 0 !important;
  padding: 13px 18px !important;

  border: 0 !important;

  border-top:
    1px solid
    rgba(23, 45, 66, .10)
    !important;

  border-radius: 0 !important;

  background:
    #d5a93f !important;

  color:
    #172d42 !important;

  box-shadow:
    none !important;

  font-size:
    15px !important;

  line-height:
    1.2 !important;

  font-weight:
    900 !important;

  text-align: left;

  text-decoration:
    none !important;

  transition:
    background-color .18s ease,
    color .18s ease;
}

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button::after {
  content: "→";

  flex: 0 0 auto;

  margin-left: auto;

  font-size: 20px;
  font-weight: 900;
  line-height: 1;
}

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:hover,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:focus-visible,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button:hover,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button:focus-visible {
  transform: none !important;

  background:
    #e1b84e !important;

  color:
    #10263a !important;

  outline: none;
}


/* MOBIEL */

@media (max-width: 767px) {

  .s2b-bp-advertising-choice-page
  .s2b-bp-start-grid {
    grid-template-columns: 1fr;
    max-width: none;

    gap: 14px;
  }

  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card {
    border-radius: 16px;
  }

  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__head {
    min-height: 100px;

    padding:
      19px 18px 17px;
  }

  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__name {
    font-size: 20px;
  }

  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__action.button {
    min-height: 48px;

    padding:
      10px 15px !important;

    font-size:
      15px !important;
  }
}

/* /S2B_BP_ADVERTISING_CHOICE_S2B_STYLE_20260922 */

/* =========================================================
 * S2B_BP_ADVERTISING_CHOICE_LAYOUT_PARITY_20260922
 *
 * /business-pro/adverteren sluit visueel aan op:
 * - Mijn advertenties
 * - publiek/persoonlijk profiel
 *
 * Geen losse witte tegels met klein donker blok.
 * Iedere organisatie is één brede geïntegreerde S2B-kaart.
 * ========================================================= */


/* Hero dezelfde goud-linker signatuur geven. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-intro {
  border:
    1px solid
    rgba(213,169,63,.25)
    !important;

  border-left:
    7px solid
    #d5a93f
    !important;

  border-radius:
    24px !important;
}


/* Organisaties onder elkaar, volle beschikbare breedte. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-grid {
  display:
    flex !important;

  flex-direction:
    column !important;

  gap:
    15px !important;

  width:
    100% !important;

  max-width:
    none !important;

  margin:
    0 !important;
}


/* Eén geïntegreerde kaart. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card {
  position:
    relative;

  display:
    grid !important;

  grid-template-columns:
    minmax(0, 1fr)
    245px !important;

  align-items:
    stretch !important;

  box-sizing:
    border-box !important;

  width:
    100% !important;

  min-width:
    0 !important;

  min-height:
    118px !important;

  margin:
    0 !important;

  padding:
    0 !important;

  overflow:
    hidden !important;

  border:
    1px solid
    rgba(255,255,255,.13)
    !important;

  border-left:
    7px solid
    #d5a93f
    !important;

  border-radius:
    22px !important;

  background:
    radial-gradient(
      circle at 92% 10%,
      rgba(213,169,63,.12) 0,
      rgba(213,169,63,0) 34%
    ),
    linear-gradient(
      115deg,
      #14243a 0%,
      #153a56 62%,
      #12516a 100%
    )
    !important;

  box-shadow:
    0 12px 30px
    rgba(15,29,45,.13)
    !important;

  transform:
    none !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease
    !important;
}


/* Oude gouden bovenstreep uitschakelen. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card::before {
  display:
    none !important;

  content:
    none !important;
}


.s2b-bp-advertising-choice-page
.s2b-bp-start-card:hover {
  transform:
    translateY(-2px)
    !important;

  box-shadow:
    0 17px 36px
    rgba(15,29,45,.17)
    !important;
}


/* Linker inhoudsvlak. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__head {
  display:
    flex !important;

  flex-direction:
    column !important;

  align-items:
    flex-start !important;

  justify-content:
    center !important;

  box-sizing:
    border-box !important;

  width:
    100% !important;

  min-width:
    0 !important;

  min-height:
    116px !important;

  gap:
    8px !important;

  margin:
    0 !important;

  padding:
    22px 26px !important;

  background:
    transparent !important;

  color:
    #fff !important;
}


/* Zelfde kleine gouden eyebrow als elders. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__head::before {
  content:
    "ORGANISATIE" !important;

  display:
    block !important;

  margin:
    0 0 1px !important;

  color:
    #e0b94f !important;

  font-size:
    11px !important;

  line-height:
    1.1 !important;

  font-weight:
    900 !important;

  letter-spacing:
    .13em !important;
}


/* Organisatienaam. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__name {
  margin:
    0 !important;

  color:
    #fff !important;

  font-size:
    24px !important;

  line-height:
    1.12 !important;

  font-weight:
    900 !important;

  letter-spacing:
    -.02em !important;
}


/* Status klein, niet dominant. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__status,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__status--active {
  min-height:
    0 !important;

  margin:
    2px 0 0 !important;

  padding:
    5px 10px !important;

  border:
    1px solid
    rgba(213,169,63,.38)
    !important;

  border-radius:
    999px !important;

  background:
    rgba(213,169,63,.10)
    !important;

  color:
    #ebc760 !important;

  font-size:
    11px !important;

  line-height:
    1.15 !important;

  font-weight:
    800 !important;
}


/* Rechter geïntegreerde actiezone. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:visited {
  display:
    flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  gap:
    12px !important;

  box-sizing:
    border-box !important;

  width:
    100% !important;

  height:
    100% !important;

  min-height:
    116px !important;

  margin:
    0 !important;

  padding:
    20px 22px !important;

  border:
    0 !important;

  border-left:
    1px solid
    rgba(255,255,255,.13)
    !important;

  border-radius:
    0 !important;

  background:
    rgba(7,22,37,.28)
    !important;

  color:
    #fff !important;

  box-shadow:
    none !important;

  font-size:
    15px !important;

  line-height:
    1.3 !important;

  font-weight:
    850 !important;

  text-align:
    center !important;

  text-decoration:
    none !important;

  transform:
    none !important;

  transition:
    background-color .18s ease,
    color .18s ease
    !important;
}


.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button::after {
  content:
    "→" !important;

  display:
    inline-block !important;

  margin-left:
    4px !important;

  color:
    #e0b94f !important;

  font-size:
    20px !important;

  font-weight:
    900 !important;

  line-height:
    1 !important;
}


/* Hover zoals S2B: goud als actieve keuze. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:hover,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:focus-visible,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button:hover,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button:focus-visible {
  background:
    #d5a93f !important;

  color:
    #172d42 !important;

  transform:
    none !important;

  outline:
    none !important;
}


.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:hover::after,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:focus-visible::after {
  color:
    #172d42 !important;
}


/* Mobiel: dezelfde kaart, actie onderaan. */

@media (max-width: 767px) {

  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card {
    grid-template-columns:
      1fr !important;

    min-height:
      0 !important;

    border-left-width:
      5px !important;

    border-radius:
      18px !important;
  }


  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__head {
    min-height:
      100px !important;

    padding:
      18px 18px 17px !important;
  }


  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__name {
    font-size:
      21px !important;
  }


  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__action.button,
  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__action--active.button {
    justify-content:
      space-between !important;

    min-height:
      50px !important;

    height:
      auto !important;

    padding:
      11px 16px !important;

    border-left:
      0 !important;

    border-top:
      1px solid
      rgba(255,255,255,.13)
      !important;

    text-align:
      left !important;
  }
}

/* /S2B_BP_ADVERTISING_CHOICE_LAYOUT_PARITY_20260922 */

/* =========================================================
 * S2B_BP_ADVERTISING_HERO_MY_ADS_PARITY_20260922
 *
 * /business-pro/adverteren:
 * hero exact volgens de visuele canon van .s2b-my-ads-hero.
 *
 * Organisatiekaarten blijven onaangeroerd.
 * ========================================================= */


/* Exact dezelfde hero-box als Mijn advertenties. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-intro {
  position: relative !important;
  overflow: hidden !important;

  margin:
    0 0 26px !important;

  padding:
    30px 34px 34px !important;

  border:
    0 !important;

  border-left:
    0 !important;

  border-radius:
    0 0 38px 38px !important;

  background:
    radial-gradient(
      circle at 88% 18%,
      rgba(215, 174, 61, .17),
      transparent 34%
    ),
    linear-gradient(
      135deg,
      #102d43 0%,
      #194965 100%
    )
    !important;

  color:
    #fff !important;

  box-shadow:
    0 12px 28px
    rgba(18, 43, 63, .10)
    !important;
}


/* Exact hetzelfde korte gouden accent onderaan. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-intro::after {
  content:
    "" !important;

  position:
    absolute !important;

  left:
    34px !important;

  right:
    auto !important;

  bottom:
    0 !important;

  width:
    76px !important;

  height:
    4px !important;

  border:
    0 !important;

  border-radius:
    999px !important;

  background:
    #d9ae3d !important;

  pointer-events:
    none !important;
}


/*
 * De oude start-hero gebruikte een extra goud streepje vóór
 * BUSINESS PRO. Mijn advertenties gebruikt dat niet.
 */

.s2b-bp-advertising-choice-page
.s2b-bp-start-intro
.s2b-bp-kicker::before {
  display:
    none !important;

  content:
    none !important;
}


/* BUSINESS PRO kicker exact volgens Mijn advertenties. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-intro
.s2b-bp-kicker {
  display:
    block !important;

  margin:
    0 !important;

  color:
    #c79b2b !important;

  font-size:
    12px !important;

  font-weight:
    900 !important;

  line-height:
    1.2 !important;

  letter-spacing:
    .13em !important;

  text-transform:
    uppercase !important;
}


/* Titel exact volgens Mijn advertenties. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-intro h1 {
  max-width:
    none !important;

  margin:
    9px 0 10px !important;

  color:
    #fff !important;

  font-size:
    clamp(31px, 5vw, 46px)
    !important;

  font-weight:
    900 !important;

  line-height:
    1.08 !important;

  letter-spacing:
    normal !important;
}


/* Subtitel exact volgens Mijn advertenties. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-intro p {
  max-width:
    760px !important;

  margin:
    0 !important;

  color:
    rgba(255, 255, 255, .88)
    !important;

  font-size:
    17px !important;

  line-height:
    1.55 !important;
}


/* Mobiele canon eveneens exact overnemen. */

@media (max-width: 767.98px) {

  .s2b-bp-advertising-choice-page
  .s2b-bp-start-intro {
    margin-bottom:
      26px !important;

    padding:
      26px 35px 30px !important;

    border-radius:
      0 0 38px 38px !important;
  }


  .s2b-bp-advertising-choice-page
  .s2b-bp-start-intro::after {
    left:
      35px !important;
  }


  .s2b-bp-advertising-choice-page
  .s2b-bp-start-intro h1 {
    font-size:
      31px !important;
  }


  .s2b-bp-advertising-choice-page
  .s2b-bp-start-intro p {
    font-size:
      15px !important;
  }
}

/* /S2B_BP_ADVERTISING_HERO_MY_ADS_PARITY_20260922 */

/* =========================================================
 * S2B_BP_ADVERTISING_CHOICE_LIGHT_BUTTONS_20260922
 *
 * Lichte S2B actiezone voor organisatiekeuze.
 * Navy kaart blijft behouden; actie wordt rustiger/licht.
 * ========================================================= */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:visited {
  border-left:
    1px solid
    rgba(213, 169, 63, .35)
    !important;

  background:
    linear-gradient(
      180deg,
      #fffdf8 0%,
      #f6f1e5 100%
    )
    !important;

  color:
    #173d59 !important;

  box-shadow:
    inset 3px 0 0
    rgba(213, 169, 63, .18)
    !important;
}

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button::after {
  color:
    #b88920 !important;
}

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:hover,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:focus-visible,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button:hover,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button:focus-visible {
  background:
    #d5a93f !important;

  color:
    #172d42 !important;

  box-shadow:
    none !important;
}

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:hover::after,
.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:focus-visible::after {
  color:
    #172d42 !important;
}


/* Mobiel: bovenrand i.p.v. linker scheiding. */

@media (max-width: 767px) {

  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__action.button,
  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__action--active.button {
    border-left:
      0 !important;

    border-top:
      1px solid
      rgba(213, 169, 63, .35)
      !important;

    box-shadow:
      inset 0 3px 0
      rgba(213, 169, 63, .13)
      !important;
  }
}

/* /S2B_BP_ADVERTISING_CHOICE_LIGHT_BUTTONS_20260922 */

/* =========================================================
 * S2B_BP_ADVERTISING_CHOICE_SHIPCONNECT_BUTTONS_20260922
 *
 * "Kies deze organisatie" volgt dezelfde visuele taal als
 * de ShipConnect-keuzekaarten:
 * donker/transparant, lichte rand, wit label, gouden pijl.
 *
 * Status-pill "Advertenties beheren" blijft onaangeraakt.
 * ========================================================= */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button,

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button,

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:visited {
  box-sizing:
    border-box !important;

  display:
    flex !important;

  align-items:
    center !important;

  justify-content:
    space-between !important;

  width:
    calc(100% - 28px) !important;

  min-height:
    78px !important;

  margin:
    14px !important;

  padding:
    16px 20px !important;

  border:
    1px solid
    rgba(255, 255, 255, .30)
    !important;

  border-radius:
    17px !important;

  background:
    rgba(255, 255, 255, .055)
    !important;

  color:
    #fff !important;

  font-size:
    15px !important;

  font-weight:
    850 !important;

  line-height:
    1.25 !important;

  text-align:
    left !important;

  text-decoration:
    none !important;

  box-shadow:
    inset 0 0 0 1px
    rgba(255, 255, 255, .025)
    !important;

  transition:
    background .16s ease,
    border-color .16s ease,
    transform .16s ease
    !important;
}


/* Gouden ShipConnect-pijl rechts. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button::after {
  flex:
    0 0 auto;

  margin-left:
    18px;

  color:
    #d9ae3d !important;

  font-size:
    25px !important;

  font-weight:
    900 !important;

  line-height:
    1 !important;
}


/* Rustige S2B hover/focus. */

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:hover,

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:focus-visible,

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button:hover,

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action--active.button:focus-visible {
  border-color:
    rgba(217, 174, 61, .72)
    !important;

  background:
    rgba(255, 255, 255, .105)
    !important;

  color:
    #fff !important;

  transform:
    translateY(-1px);

  box-shadow:
    inset 0 0 0 1px
    rgba(217, 174, 61, .10)
    !important;
}

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:hover::after,

.s2b-bp-advertising-choice-page
.s2b-bp-start-card__action.button:focus-visible::after {
  color:
    #e2b943 !important;
}


/*
 * Mobiel:
 * knop als echte ShipConnect-keuzekaart onder de organisatie.
 */
@media (max-width: 767.98px) {

  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__action.button,

  .s2b-bp-advertising-choice-page
  .s2b-bp-start-card__action--active.button {
    width:
      calc(100% - 36px) !important;

    min-height:
      76px !important;

    margin:
      0 18px 18px !important;

    padding:
      16px 20px !important;

    border:
      1px solid
      rgba(255, 255, 255, .30)
      !important;

    border-radius:
      17px !important;

    background:
      rgba(255, 255, 255, .055)
      !important;

    box-shadow:
      inset 0 0 0 1px
      rgba(255, 255, 255, .025)
      !important;
  }
}

/* /S2B_BP_ADVERTISING_CHOICE_SHIPCONNECT_BUTTONS_20260922 */

/* =========================================================
 * S2B_BP_ADVERTISING_EXACT_SHIPCONNECT_CHOICE_20260922
 *
 * Letterlijk dezelfde componentwaarden als
 * a.s2b-shipconnect-scope-choice uit ship-connections.css.
 *
 * Alleen gescoped naar /business-pro/adverteren zodat
 * Business-Pro parent-CSS de component niet kan vervormen.
 * ========================================================= */

.s2b-bp-advertising-choice-page
a.s2b-shipconnect-scope-choice,

.s2b-bp-advertising-choice-page
a.s2b-shipconnect-scope-choice:visited {
  position:
    relative !important;

  box-sizing:
    border-box !important;

  display:
    flex !important;

  min-height:
    68px !important;

  align-items:
    center !important;

  padding:
    15px 54px 15px 19px !important;

  border:
    1px solid
    rgba(255, 255, 255, .24)
    !important;

  border-radius:
    14px !important;

  background:
    rgba(255, 255, 255, .08)
    !important;

  color:
    #fff !important;

  font-weight:
    850 !important;

  text-decoration:
    none !important;

  box-shadow:
    none !important;

  transform:
    none !important;
}


.s2b-bp-advertising-choice-page
a.s2b-shipconnect-scope-choice:hover,

.s2b-bp-advertising-choice-page
a.s2b-shipconnect-scope-choice:focus {
  border-color:
    #d9ae3d !important;

  background:
    rgba(255, 255, 255, .14)
    !important;

  color:
    #fff !important;

  transform:
    none !important;
}


/* Exact dezelfde gouden chevron. */

.s2b-bp-advertising-choice-page
a.s2b-shipconnect-scope-choice::after {
  position:
    absolute !important;

  top:
    50% !important;

  right:
    22px !important;

  width:
    11px !important;

  height:
    11px !important;

  margin:
    0 !important;

  border:
    0 !important;

  border-right:
    3px solid #d9ae3d !important;

  border-bottom:
    3px solid #d9ae3d !important;

  content:
    "" !important;

  transform:
    translateY(-50%)
    rotate(-45deg)
    !important;
}


/* Exact hetzelfde organisatie-icoon. */

.s2b-bp-advertising-choice-page
a.s2b-shipconnect-scope-choice--organization::before {
  display:
    inline !important;

  margin-right:
    10px !important;

  content:
    "🏢" !important;
}


/*
 * Alleen plaatsing binnen de Business-Pro organisatiekaart.
 * De component zelf blijft exact ShipConnect.
 */
.s2b-bp-advertising-choice-page
.s2b-bp-start-card
> a.s2b-shipconnect-scope-choice {
  width:
    auto !important;

  margin:
    0 18px 18px !important;
}


/* /S2B_BP_ADVERTISING_EXACT_SHIPCONNECT_CHOICE_20260922 */