/*
 * Ambassadeurs, Partners, Trainingen en Reviews als Bold Builder-inhoud,
 * bijgestuurd naar de ontwerpen uit templates/ in het Claude Design-systeem.
 * Laadt op pagina's waarvan de inhoud een van de markers bnb-amb, bnb-pt,
 * bnb-tr of bnb-rv bevat; elke sectie draagt de marker in el_class.
 */

/* --- Gedeeld: kop met zijbeelden (zoals de FAQ) -------------------------- */

.bnb-hero-side {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

/* Het thema zet de beelden op 50% met een specifiekere selector; die hier
   overtroeven, anders lopen de foto's onder de tekst door. */
.bt_bb_section.bnb-hero-side.bt_bb_with_overlay_image .bt_bb_port:before,
.bt_bb_section.bnb-hero-side.bt_bb_with_overlay_right_image .bt_bb_port:after {
	width: 25%;
	mix-blend-mode: normal;
}

.bt_bb_section.bnb-hero-side.bt_bb_with_overlay_image .bt_bb_port:before { background-position: right center; }
.bt_bb_section.bnb-hero-side.bt_bb_with_overlay_right_image .bt_bb_port:after { background-position: left center; }

@media (max-width: 991px) {
	.bt_bb_section.bnb-hero-side.bt_bb_with_overlay_image .bt_bb_port:before,
	.bt_bb_section.bnb-hero-side.bt_bb_with_overlay_right_image .bt_bb_port:after { width: 18%; }
	.bnb-hero-side .bt_bb_row_holder { padding-left: 18%; padding-right: 18%; }
	.bnb-hero-side .bt_bb_headline_subheadline { font-size: 15px; }
}

@media (max-width: 600px) {
	.bnb-hero-side .bt_bb_headline.bt_bb_size_extralarge .bt_bb_headline_tag {
		font-size: 1.75rem !important;
		line-height: 1.2;
	}
}

/* --- Gedeeld: fotokop en contactband met scrim --------------------------- */

.bnb-hero-photo {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.bnb-hero-photo:before,
.bnb-cta-photo:before {
	background: var(--dark-60-color) !important;
	opacity: 1 !important;
}

.bnb-cta-photo > .bt_bb_port {
	padding-top: clamp(3em, 6vw, 5em) !important;
	padding-bottom: clamp(3em, 6vw, 5em) !important;
}

.bnb-hero-photo .bt_bb_headline_subheadline {
	max-width: 62ch;
	margin-left: auto;
	margin-right: auto;
}

.bnb-cta-photo .bt_bb_dual_buttons { gap: 1em; flex-wrap: wrap; }
.bnb-cta-photo .bt_bb_dual_buttons .bt_bb_button a { border-radius: var(--hard-rounded) !important; }
.bnb-cta-photo .bt_bb_dual_buttons .bt_bb_button .bt_bb_icon_holder { order: 2; margin-right: 0; margin-left: 0.8rem; }

/* --- Gedeeld: hoofdstuk-/naamlinks --------------------------------------- */

.bnb-chapters p {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1em 2.5em;
	margin: 0;
	font-family: var(--supertitle-font);
	text-transform: uppercase;
	letter-spacing: var(--supertitle-letter-spacing);
	font-size: var(--title-subtitle-size-small);
}

.bnb-chapters a {
	color: var(--accent-color);
	text-decoration: none;
	padding-bottom: .5em;
	border-bottom: 1px solid var(--accent-50-color);
}

.bnb-chapters a:hover { color: var(--dark-color); border-bottom-color: var(--dark-color); }

/* --- Gedeeld: vinklijst (Partners, Trainingen) --------------------------- */

.bnb-usp ul {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 15px;
	line-height: 1.5;
	color: var(--dark-color);
}

.bnb-usp li {
	display: flex;
	gap: 1em;
	align-items: baseline;
	padding: 1em 0;
	border-top: 1px solid var(--primary-07-color, rgba(59, 59, 59, .07));
}

.bnb-usp li:last-child { border-bottom: 1px solid var(--primary-07-color, rgba(59, 59, 59, .07)); }

.bnb-usp li:before {
	content: "\e908";
	font-family: IBM;
	flex: 0 0 auto;
	font-size: 1.1rem;
	line-height: 1;
	color: var(--accent-color);
}

/* Staat er al een vinkje als element in het item (de oude paginatemplates
   deden dat), dan niet nog eens. */
.bnb-usp li > [data-ico-ibm] { display: none; }

/* --- Gedeeld: citaat in Playfair met attributie in kapitalen ------------- */

.bnb-rv-card blockquote,
.bnb-rv-featured blockquote,
.bnb-pt-text blockquote {
	margin: 0;
	padding: 0;
	border: 0;
	font-family: var(--em-heading-font);
	font-style: italic;
	font-weight: var(--em-heading-font-weight);
	font-size: var(--extrasmall-title-size);
	line-height: 1.6;
	color: var(--dark-color);
}

.bnb-rv-card blockquote:before,
.bnb-rv-featured blockquote:before,
.bnb-pt-text blockquote:before { content: none; }

.bnb-pt-text blockquote {
	padding-left: 1.5em;
	border-left: 1px solid var(--accent-color);
	max-width: 44ch;
}

.bnb-rv-author,
p.bnb-rv-author {
	margin: 1.25em 0 0;
	font-family: var(--supertitle-font);
	text-transform: uppercase;
	letter-spacing: var(--supertitle-letter-spacing);
	font-size: var(--title-subtitle-size-extrasmall);
	color: var(--dark-gray-color);
}

/* --- Ambassadeurs ------------------------------------------------------- */

.bnb-amb .bnb-amb-media .bt_bb_column_content { position: relative; }

.bnb-amb .bnb-amb-media .bt_bb_image { display: block; }

.bnb-amb .bnb-amb-media img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	border-radius: var(--image-hard-rounded);
	background: var(--light-color);
}

.bnb-amb .bnb-amb-logo img { object-fit: contain; padding: 14%; }

.bnb-amb .bnb-amb-num {
	position: absolute;
	left: 1.5em;
	top: 1.5em;
	z-index: 2;
	margin: 0;
}

.bnb-amb .bnb-amb-num p {
	width: 4.5em;
	height: 4.5em;
	margin: 0;
	border-radius: 50%;
	background: var(--accent-color);
	color: var(--light-color);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--supertitle-font);
	font-size: .7rem;
	font-weight: 500;
	letter-spacing: 1px;
}

.bnb-amb .bnb-amb-text .bt_bb_text p { max-width: 58ch; line-height: 1.8; }

.bnb-amb .bnb-amb-badge p {
	display: flex;
	align-items: center;
	gap: 1em;
	margin-top: 1.5em;
	font-family: var(--supertitle-font);
	text-transform: uppercase;
	letter-spacing: var(--supertitle-letter-spacing);
	font-size: var(--title-subtitle-size-extrasmall);
	color: var(--accent-color);
}

.bnb-amb .bnb-amb-badge [data-ico-beauty]:before { font-size: 1.45rem; line-height: 1; }

/* --- Partners ------------------------------------------------------------ */

.bnb-pt .bnb-pt-tile img {
	display: block;
	width: 240px;
	max-width: 100%;
	height: 96px;
	padding: 1.25em 2em;
	object-fit: contain;
	background: var(--light-color);
	border-radius: var(--image-medium-rounded);
	margin: 0 auto;
}

.bnb-pt .bnb-pt-card > .bt_bb_column_content { position: sticky; top: 120px; }

@media (max-width: 991px) {
	.bnb-pt .bnb-pt-card > .bt_bb_column_content { position: static; }
}

.bnb-pt .bnb-pt-logo img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: contain;
	padding: 14%;
	background: var(--beige-color);
	border-radius: var(--image-medium-rounded);
}

.bnb-pt .bnb-pt-card .bt_bb_headline.bt_bb_size_extrasmall .bt_bb_headline_superheadline { color: var(--accent-color); opacity: 1; }

.bnb-pt .bnb-pt-text .bt_bb_text p { max-width: 62ch; line-height: 1.8; }

/* --- Trainingen ---------------------------------------------------------- */

/* Stappen: het thema tekent de verbindingslijn vanaf het midden van de kolom
   (voor gecentreerde cirkels); met de cirkel links loopt hij dwars door de
   volgende cirkel. Hier van de rand van de cirkel tot vlak voor de volgende. */
.bnb-tr .bt_bb_steps .bt_bb_inner_step:after {
	left: 8em;
	width: calc(100% - 9em);
}

@media (max-width: 991px) {
	.bnb-tr .bt_bb_steps .bt_bb_inner_step:after { display: none; }
}

.bnb-tr .bnb-tr-card .bt_bb_headline.bt_bb_size_extrasmall .bt_bb_headline_superheadline { color: var(--accent-color); opacity: 1; }

.bnb-tr .bnb-tr-photo img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	border-radius: var(--image-hard-rounded);
}

.bnb-tr .bnb-tr-device .bt_bb_column_inner_content {
	position: relative;
	aspect-ratio: 1 / 1;
}

.bnb-tr .bnb-tr-device .bt_bb_column_inner_content_inner {
	position: absolute;
	inset: 10%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.bnb-tr .bnb-tr-device .bt_bb_image { height: 100%; display: flex; align-items: center; justify-content: center; }
.bnb-tr .bnb-tr-device img { max-height: 100%; max-width: 100%; width: auto; height: auto; object-fit: contain; }

.bnb-tr .bt_bb_text p { line-height: 1.8; }

/* --- Reviews ------------------------------------------------------------- */

.bnb-rv .bnb-rv-label .bt_bb_headline_superheadline {
	display: inline-block;
	padding: .5em 1em;
	border: 1px solid var(--dark-color);
	border-radius: var(--hard-rounded);
	color: var(--dark-color);
	opacity: 1;
}

.bnb-rv .bnb-rv-card .bt_bb_column_content_inner { display: flex; flex-direction: column; min-height: 100%; }
.bnb-rv .bnb-rv-card .bt_bb_text { margin-top: 1.25em; display: flex; flex-direction: column; flex: 1 1 auto; }
.bnb-rv .bnb-rv-card .bnb-rv-author { margin-top: auto; padding-top: 1.25em; }

.bnb-rv .bnb-rv-band .bnb-rv-featured blockquote {
	font-size: var(--medium-title-size);
	line-height: 1.3;
	letter-spacing: var(--heading-letter-spacing);
}

.bnb-rv .bnb-rv-band .bnb-rv-author { color: var(--dark-color); }

.bnb-rv .bnb-rv-band .bnb-rv-list .bt_bb_text p:first-child {
	margin: 0;
	font-family: var(--em-heading-font);
	font-size: var(--extrasmall-title-size);
	line-height: 1.6;
	color: var(--dark-color);
}

.bnb-rv .bnb-rv-band .bnb-rv-list .bt_bb_text { padding-bottom: 1.5em; }

/* Reviewkaarten: citaat zonder de decoratieve glyph van het thema */
#reviews.bnb-rv blockquote.bt_bb_headline_tag,
#variant-b.bnb-rv blockquote.bt_bb_headline_tag { padding: 0; margin: 0; min-height: 0; }
#variant-b.bnb-rv blockquote.bt_bb_headline_tag:before { content: none; }
#variant-b.bnb-rv .bt_bb_headline_subheadline {
	margin-top: 1.5em;
	font-family: var(--supertitle-font);
	letter-spacing: var(--supertitle-letter-spacing);
	font-size: var(--title-subtitle-size-small);
	color: var(--accent-color);
}

/* --- Gedeeld: tellers (uit de builder-homepage) ------------------------- */

.bnb-counters .bt_bb_counter_holder {
	display: flex !important;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center; /* niet baseline: de cijferrol heeft geen bruikbare baseline */
	text-align: center;
	font-size: var(--large-title-size);
	height: auto; /* de plugin klemt de holder op 1.2em met overflow hidden; met het
	                 onderschrift eronder én baseline-uitlijning verdween het getal erdoor */
	overflow: visible;
}

.bnb-counters .bt_bb_counter_holder .bt_bb_counter {
	align-self: center;
	height: 1.2em;
	line-height: 1.2;
	overflow: hidden;
}

.bnb-counters .bt_bb_counter_holder .bt_bb_counter_content {
	display: contents;
}

.bnb-counters .bt_bb_counter_holder .bt_bb_counter_content .bt_bb_counter_text {
	order: 2;
	margin: 0;
	padding: 0;
	font-size: inherit;
	font-family: var(--heading-font);
	font-weight: var(--heading-font-weight);
	letter-spacing: var(--heading-letter-spacing);
	color: var(--dark-color);
	white-space: pre;
	line-height: 1.2;
}

.bnb-counters .bt_bb_counter_holder .bt_bb_counter_content .bt_bb_counter_text_below {
	order: 3;
	flex: 0 0 100%;
	margin-top: 0.75rem;
	font-size: 0.875rem; /* niet in em: de holder staat op de grote titelmaat */
	line-height: 1.5;
	color: var(--dark-color);
}

.bnb-counters .bt_bb_counter_holder .bt_bb_counter_content .bt_bb_counter_text_below em {
	font-family: var(--supertitle-font);
	font-style: normal;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: var(--supertitle-letter-spacing);
}


/* Reviewkaarten: kleurschema op de kolom-inhoud (inner_color_scheme), zodat het
   wit binnen de tussenruimte blijft; de afronding van de kolom hier op de inhoud. */
.bnb-rv .bnb-rv-card.bt_bb_shape_hard-rounded > .bt_bb_column_content {
	border-radius: var(--row-hard-rounded);
	overflow: hidden;
}

.bnb-rv .bnb-rv-card.bt_bb_shape_hard-rounded {
	overflow: visible;
}

/* Drie reviewkaarten even hoog: de inhoud vult de kolom. */
.bnb-rv .bnb-rv-card.bt_bb_shape_hard-rounded {
	display: flex;
	flex-direction: column;
}

.bnb-rv .bnb-rv-card.bt_bb_shape_hard-rounded > .bt_bb_column_content {
	flex: 1 1 auto;
}

/* Reviewkaart zoals in het ontwerp: ruimte rondom (het thema geeft
   padding "double" alleen links en rechts) en de naam direct onder het citaat. */
.bnb-rv .bnb-rv-card.bt_bb_shape_hard-rounded > .bt_bb_column_content {
	padding: 2.5em;
}

.bnb-rv .bnb-rv-card .bnb-rv-author {
	margin-top: 0;
}

/* --- Trainingen: zelfde ritme als de template (trainingen.php) ------------
   Sectieafstand van de template is clamp(4.5em, 8vw, 8em) boven en 0 onder;
   de builder-spacing "large" (128px) is ruimer. Tan band en foto-CTA krijgen
   de padding van .bnb-band / .bnb-cta-inner uit homepage-v2.css. Lopende
   tekst in de lichte secties in de gedempte grijze tekstkleur van de
   template; in de tan band en op de foto blijft de eigen kleur. */
.bnb-tr.bt_bb_section:not(.bnb-hero-photo):not(.bnb-cta-photo):not(#certificaat) > .bt_bb_port {
	padding-top: clamp(4.5em, 8vw, 8em) !important;
	padding-bottom: 0 !important;
}

#certificaat.bnb-tr {
	margin-top: clamp(4.5em, 8vw, 8em) !important;
}

#certificaat.bnb-tr > .bt_bb_port {
	padding-top: clamp(3.5em, 6vw, 7em) !important;
	padding-bottom: clamp(3.5em, 6vw, 7em) !important;
}

#contact.bnb-tr.bnb-cta-photo {
	margin-top: clamp(4.5em, 8vw, 8em) !important;
	margin-bottom: clamp(4.5em, 8vw, 8em) !important;
}

#contact.bnb-tr.bnb-cta-photo > .bt_bb_port {
	padding-top: clamp(4em, 7vw, 7em) !important;
	padding-bottom: clamp(4em, 7vw, 7em) !important;
}

.bnb-tr.bt_bb_section:not(.bnb-hero-photo):not(.bnb-cta-photo):not(#certificaat) .bt_bb_text {
	color: var(--dark-gray-color);
}

/* Fotokop: zelfde hoogte en 20px lucht rondom als .bnb-pt-hero in de template. */
#trainingen.bnb-tr.bnb-hero-photo {
	min-height: clamp(440px, 62vh, 600px);
	margin-top: var(--content-padding) !important;
	margin-bottom: var(--content-padding) !important;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

/* Fotokop: tekstbreedte als .bnb-pt-hero-content (zijpadding clamp(20px, 5vw, 4em),
   minus de 20px die de sectiecel al heeft). */
#trainingen.bnb-tr.bnb-hero-photo .bt_bb_column_content {
	padding-left: calc(clamp(20px, 5vw, 4em) - 20px);
	padding-right: calc(clamp(20px, 5vw, 4em) - 20px);
}

/* Theorie: witte kaart zoals .bnb-tr-card in de template (wit op de kolom-
   inhoud, 1.8125em rondom, afgerond). Praktijk: apparaatkaart wit, afgerond,
   vierkant, met het hele apparaat erin (contain) in plaats van uitgesneden. */
.bnb-tr .bnb-tr-card > .bt_bb_column_content {
	padding: 1.8125em !important;
	border-radius: var(--row-hard-rounded);
	overflow: hidden;
}

.bnb-tr .bnb-tr-card {
	overflow: visible;
}

.bnb-tr .bnb-tr-device > .bt_bb_column_inner_content {
	border-radius: var(--row-hard-rounded);
	overflow: hidden;
}

.bnb-tr .bnb-tr-device .bt_bb_column_inner_content_inner {
	inset: 10%;
}

.bnb-tr .bnb-tr-device .bt_bb_image,
.bnb-tr .bnb-tr-device .bt_bb_image > span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.bnb-tr .bnb-tr-device img {
	max-height: 100% !important;
	max-width: 100% !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain;
}

/* Contentbreedte als de template (--bnb-max 1440px): secties op boxed_1600
   zodat ze tot 1440 meegroeien, hier begrensd op 1440. */
.bnb-tr.bt_bb_section:not(.bnb-hero-photo) > .bt_bb_port > .bt_bb_cell {
	max-width: min(1440px, calc(100% - 40px));
}

/* --- Juridische pagina's (Privacybeleid, Algemene voorwaarden) -----------
   Ontwerp "Privacybeleid.dc.html": witte afgeronde paginakop met gecentreerde
   titel (max 720px), daaronder lopende tekst in gedempt grijs met kleine
   tussenkoppen, de conceptnotitie als wit kader in het cursieve titellettertype,
   en onderaan een lijn met "Vragen?" en een omlijnde knop. */
.bnb-legal-head {
	margin-top: var(--content-padding) !important;
}

.bnb-legal-head > .bt_bb_port {
	padding: clamp(3.5em, 6vw, 6em) clamp(24px, 4vw, 4em) !important;
}

.bnb-legal-head .bt_bb_column_content_inner {
	max-width: 720px;
	margin: 0 auto;
}

.bnb-legal-body .bt_bb_text {
	color: var(--dark-gray-color);
	line-height: 1.8;
}

.bnb-legal-body .bt_bb_text p,
.bnb-legal-body .bt_bb_text ul {
	margin: 0 0 1.25em;
	text-wrap: pretty;
}

.bnb-legal-body .bt_bb_text ul {
	padding-left: 1.25em;
	display: grid;
	gap: .5em;
}

.bnb-legal-body .bt_bb_text a {
	color: var(--dark-color);
}

.bnb-legal-body .bt_bb_text a:hover {
	color: var(--accent-color);
}

.bnb-legal-body .bt_bb_headline {
	padding-top: 1.5em;
	margin-bottom: 1.25em;
}

.bnb-legal-body .bnb-legal-note p {
	padding: 1.25em 1.5em;
	background: var(--light-color);
	border-radius: var(--card-hard-rounded-shape);
	font-family: var(--em-heading-font);
	font-style: italic;
	color: var(--dark-color);
}

.bnb-legal-body .bnb-legal-foot {
	margin-top: 1.5em;
	padding-top: 2em;
	border-top: 1px solid var(--primary-07-color);
}

.bnb-legal-body .bnb-legal-foot .bt_bb_text p {
	margin: 0;
}

/* Trainingen, stap 2: de kop "De handen uit de mouwen" (54px) past tussen 1200 en
   ~1420px niet meer op één regel in de halve kolom (tekst 613px, kolom 596px op 1366).
   Iets kleiner in die band, zodat hij op één regel blijft zoals op grotere schermen. */
@media (min-width: 1200px) and (max-width: 1500px) {
	#praktijk.bnb-tr .bt_bb_headline_content {
		font-size: 48px;
	}
}

/* --- Reviews: fotoband met lopende slider (naar voorbeeld Supura) ------- */

.bnb-rv-hero {
	min-height: clamp(560px, 70vh, 760px);
	margin-top: var(--content-padding) !important;
	margin-bottom: var(--content-padding) !important;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.bnb-rv-hero:before {
	background: linear-gradient(180deg, rgba(31, 27, 24, 0.66) 0%, rgba(31, 27, 24, 0.5) 100%) !important;
	mix-blend-mode: normal !important;
	opacity: 1 !important;
}

.bnb-rv-hero > .bt_bb_port {
	padding-top: clamp(4em, 7vw, 6.5em) !important;
	padding-bottom: clamp(4em, 7vw, 6.5em) !important;
}

.bnb-rv-hero .bt_bb_headline_superheadline { color: rgba(255, 255, 255, 0.72); }
.bnb-rv-hero .bt_bb_headline_content { color: #fff; }
.bnb-rv-hero .bt_bb_headline_content em { color: var(--accent-light-color, #d9c8b3); }

/* Witte kaart met het citaat */
.bnb-rv-hero .bnb-rv-slidecard > .bt_bb_column_content {
	border-radius: var(--row-hard-rounded, 30px);
	overflow: visible;
	box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.45);
}
.bnb-rv-hero .bnb-rv-slidecard .bt_bb_content_slider { border-radius: var(--row-hard-rounded, 30px); overflow: hidden; }
.bnb-rv-hero .bnb-rv-slidecard .bt_bb_column_inner_content { padding: clamp(2em, 4vw, 3.5em) clamp(1.5em, 6vw, 5em); }
.bnb-rv-hero blockquote.bt_bb_headline_tag { padding: 0; margin: 0; min-height: 0; }
.bnb-rv-hero blockquote.bt_bb_headline_tag:before { content: none; }
.bnb-rv-hero .bnb-rv-slidecard .bt_bb_headline_content {
	color: var(--dark-color);
	font-size: clamp(1.05rem, 1.6vw, 1.35rem);
	line-height: 1.7;
	font-weight: 400;
}
.bnb-rv-hero .bnb-rv-slidecard .bt_bb_headline_subheadline {
	margin-top: 1.75em;
	font-family: var(--heading-font);
	font-size: 1.35rem;
	color: var(--accent-color);
}
.bnb-rv-hero .bnb-rv-salon p {
	margin: 0.25em 0 0;
	font-family: var(--supertitle-font);
	font-size: var(--title-subtitle-size-small);
	letter-spacing: var(--supertitle-letter-spacing);
	text-transform: uppercase;
	color: var(--dark-gray-color);
}
.bnb-rv-hero .bnb-rv-slidecard .bt_bb_icon { margin-bottom: 0.5em; }

/* Pijlen buiten de kaart, stippen eronder */
.bnb-rv-hero .bt_bb_content_slider .bt_bb_content_slider_arrow,
.bnb-rv-hero .bt_bb_content_slider .bt_bb_slider_arrow {
	background: #fff;
	color: var(--dark-color);
	border-radius: 50%;
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
}
.bnb-rv-hero .bt_bb_content_slider .bt_bb_content_slider_dot,
.bnb-rv-hero .bt_bb_content_slider .bt_bb_slider_dot { background: rgba(255, 255, 255, 0.55); }
.bnb-rv-hero .bt_bb_content_slider .bt_bb_content_slider_dot.active,
.bnb-rv-hero .bt_bb_content_slider .bt_bb_slider_dot.active { background: #fff; }

/* Knoppen */
.bnb-rv-hero .bnb-rv-buttons.bt_bb_dual_buttons { gap: 1em; flex-wrap: wrap; justify-content: center; }
.bnb-rv-hero .bnb-rv-buttons .bt_bb_button a { border-radius: var(--hard-rounded) !important; }
.bnb-rv-hero .bnb-rv-buttons .bt_bb_button .bt_bb_icon_holder { order: 2; margin-right: 0; margin-left: 0.8rem; }
.bnb-rv-hero .bt_bb_content_slider .slick-dots { text-align: center; left: 0; right: 0; }
.bnb-rv-hero .bnb-rv-buttons { margin-top: calc(0.5em + 30px); } /* 30px extra lucht onder de kaart */
@media (max-width: 767px) {
	.bnb-rv-hero .bt_bb_content_slider .slick-arrow { display: none !important; }
	.bnb-rv-hero .bnb-rv-slidecard .bt_bb_column_inner_content { padding: 2em 1.25em; }
}

/* Kaart houdt altijd de hoogte van de langste review (geen adaptiveHeight) */
.bnb-rv-hero .bnb-rv-slidecard .slick-list { height: auto !important; transition: none !important; }
.bnb-rv-hero .bnb-rv-slidecard .slick-track { display: flex !important; align-items: stretch; }
.bnb-rv-hero .bnb-rv-slidecard .slick-slide { height: auto; display: flex; }
.bnb-rv-hero .bnb-rv-slidecard .slick-slide > div { width: 100%; display: flex; }
.bnb-rv-hero .bnb-rv-slidecard .bt_bb_content_slider_item { width: 100%; display: flex; flex-direction: column; justify-content: center; }
.bnb-rv-hero .bnb-rv-slidecard .bt_bb_content_slider_item > .bt_bb_row_inner { width: 100%; }

/* Sterren, datum en Google-score in de reviewband */
.bnb-rv-hero .bnb-rv-stars p { margin: 0 0 0.5em; color: var(--accent-color); letter-spacing: 0.25em; font-size: 1.1rem; line-height: 1; }
.bnb-rv-hero .bnb-rv-slidecard .bt_bb_icon { display: none; }
.bnb-rv-hero .bnb-rv-score p { margin: 0.25em 0 0; color: rgba(255,255,255,0.85); font-family: var(--supertitle-font); font-size: var(--title-subtitle-size-small); letter-spacing: var(--supertitle-letter-spacing); text-transform: uppercase; }
.bnb-rv-hero .bnb-rv-score strong { font-family: var(--heading-font); font-size: 1.6em; letter-spacing: 0; text-transform: none; vertical-align: -0.1em; margin-right: 0.35em; }

/* --- Themapagina's (Project/tools/gen-thema-pages.py) ------------------------ */

#thema.bnb-thema.bnb-hero-photo {
	min-height: clamp(440px, 62vh, 600px);
	margin-top: var(--content-padding) !important;
	margin-bottom: var(--content-padding) !important;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
#thema.bnb-thema.bnb-hero-photo .bt_bb_column_content {
	padding-left: calc(clamp(20px, 5vw, 4em) - 20px);
	padding-right: calc(clamp(20px, 5vw, 4em) - 20px);
}
#thema.bnb-thema .bt_bb_headline_subheadline { max-width: 62ch; margin-left: auto; margin-right: auto; }

/* Apparaatkaarten: foto in een vaste, vierkante zone, tekst eronder, knop onderaan */
.bnb-thema .bnb-thema-card > .bt_bb_column_content > .bt_bb_column_content_inner { display: flex; flex-direction: column; height: 100%; }
.bnb-thema .bnb-thema-card { margin-bottom: 30px; }
.bnb-thema .bnb-thema-photo { margin: 0 0 1.25em; }
/* Vierkant fotovak zonder aspect-ratio (padding-truc), foto absoluut gepositioneerd
   met object-fit: contain — werkt ook in oudere Safari-versies. */
/* Het thema zet een witte hover-laag (.bt_bb_image_content) óver de foto; hier niet nodig. */
.bnb-thema .bnb-thema-photo .bt_bb_image_content { display: none !important; }
.bnb-thema .bnb-thema-photo a { display: block; position: relative; padding-top: 100%; background: var(--light-color); border-radius: var(--soft-rounded, 12px); overflow: hidden; }
.bnb-thema .bnb-thema-photo img { position: absolute; top: 10%; left: 10%; width: 80% !important; height: 80% !important; max-width: none; object-fit: contain; }
.bnb-thema .bnb-thema-card .bt_bb_headline a { color: inherit; }
.bnb-thema .bnb-thema-card .bt_bb_text { flex: 1 1 auto; color: var(--dark-gray-color); }
.bnb-thema .bnb-thema-card .bt_bb_button { margin-top: 0.75em; }

/* Verder-lezen-kaarten even hoog */
#verder.bnb-thema .bt_bb_row { align-items: stretch; }
#verder.bnb-thema .bnb-tr-card > .bt_bb_column_content > .bt_bb_column_content_inner { display: flex; flex-direction: column; height: 100%; }
#verder.bnb-thema .bnb-tr-card .bt_bb_text { flex: 1 1 auto; }
#verder.bnb-thema .bnb-tr-card { margin-bottom: 30px; }
.bnb-thema .bt_bb_dual_buttons { gap: 1em; flex-wrap: wrap; justify-content: center; }
.bnb-thema .bt_bb_dual_buttons .bt_bb_button a { border-radius: var(--hard-rounded) !important; }
.bnb-thema .bt_bb_dual_buttons .bt_bb_button .bt_bb_icon_holder { order: 2; margin-right: 0; margin-left: 0.8rem; }
.bnb-thema .bnb-tr-card .bt_bb_button { display: block; margin-top: 1em; }

/* --- Assortiment (overzicht van de apparaten) ------------------------------
   Project/tools/assortiment-page.php: de shopkop en het berichtenraster van het
   thema met de portfolio-items. De productfoto's zijn vrijstaand (png) of
   liggend; op een beige vlak en volledig in beeld in plaats van uitgesneden. */
/* 15 sep 2026 (Bart): precies de stijl van de oude WooCommerce-shop — witte vierkante
   tegel met ronde hoeken (15px), de foto er volledig in, en daaronder alleen de naam,
   gecentreerd (24px, gewicht 500, 32px onder de tegel). Categorie, samenvatting en
   knop zijn verborgen; geen beige kaart om de tekst. Selectors volgen de keten van het
   thema (.bt_bb_css_post_grid_content … .bt_bb_grid_item_inner) om die te overrulen. */
.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_css_post_grid_content {
	gap: 40px; /* zelfde goot als de oude shop (li padding 0 20px) */
}

.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner {
	border-radius: 0;
	overflow: visible;
}

.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_thumbnail a {
	display: block;
	width: 100%;
	position: relative;
	padding-top: 100%;
	background: #fff;
	border-radius: 15px;
	overflow: hidden;
}

.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_thumbnail img {
	position: absolute;
	top: 6%;
	left: 6%;
	width: 88% !important;
	height: 88% !important;
	max-width: none;
	object-fit: contain;
	padding: 0;
	border-radius: 0;
	transition: transform 300ms ease;
}

.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_thumbnail a:hover img {
	transform: scale(1.04);
}

.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_grid_item_meta,
.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_grid_item_item_read_more {
	display: none !important;
}

/* Korte omschrijving (excerpt van het portfolio-item) onder de naam — Project/tools/assortiment-excerpts.php */
.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_excerpt {
	display: block;
	margin: 0.6em auto 0;
	max-width: 34ch;
	font-size: 16px;
	line-height: 1.5;
	color: var(--dark-gray-color, #6b6b6b);
	text-align: center;
	-webkit-line-clamp: unset;
	max-height: none;
}

.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_content {
	padding: 32px 0 40px; /* shop: 32px boven de naam, ca. 80px tot de volgende tegel (40 gap + 40) */
	text-align: center;
	background: transparent;
}

.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_title {
	margin: 0;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
	text-align: center;
	/* Volledige naam tonen (het thema kapt op 2 regels af met "…") */
	display: block !important;
	-webkit-line-clamp: unset !important;
	overflow: visible !important;
	max-height: none;
}

.bnb-assortiment-grid .bt_bb_css_post_grid .bt_bb_grid_item_post_title a {
	color: var(--dark-color);
}
#apparaten.bnb-thema .bt_bb_row_holder { justify-content: center !important; }

/* --- Assortiment, tabje Ontharing: de drie lasers onder elkaar om te vergelijken
   (wens 3 van Anne, 15 sep 2026; volgorde Royal › Master › Portable via menu_order,
   zie Project/tools/portfolio-volgorde.php). assets/js/assortiment-compare.js zet
   data-bnb-category op het raster; alleen bij "ontharing" wordt de tegelweergave
   een lijst: witte kaart per apparaat, foto links, naam + omschrijving + knop rechts. */
.bnb-assortiment-grid .bnb-compare-intro {
	margin: -0.5em auto 2em;
	max-width: 60ch;
	text-align: center;
	font-size: 17px;
	color: var(--dark-gray-color, #6b6b6b);
}
.bnb-assortiment-grid .bnb-compare-intro[hidden] {
	display: none;
}
.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_css_post_grid_content {
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
}
.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_css_post_grid_content .bt_bb_grid_item {
	width: 100% !important;
	max-width: none;
	height: auto;
	display: block;
}
.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner {
	display: flex;
	flex-direction: row; /* de plugin zet column */
	flex-wrap: nowrap;
	align-items: center;
	gap: 48px;
	min-width: 0;
	height: auto;
	padding: 32px;
	background: #fff;
	border-radius: 15px;
	overflow: hidden;
}
.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_thumbnail {
	flex: 0 0 auto;
	width: 38%;
	max-width: 340px;
}
.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_thumbnail a {
	background: var(--light-color, #f4f1ec);
}
.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_content {
	flex: 1 1 auto;
	padding: 0;
	text-align: left;
}
.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_title {
	text-align: left;
	font-size: 28px;
}
.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_excerpt {
	margin: 0.8em 0 0;
	max-width: 52ch;
	font-size: 17px;
	text-align: left;
	-webkit-line-clamp: unset;
	max-height: none;
	overflow: visible;
}
/* Categorie-label boven de naam en de knop "Bekijk apparaat" hier wél tonen. */
.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_grid_item_meta_superheadline {
	display: block !important;
	margin: 0 0 0.6em;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_grid_item_item_read_more {
	display: inline-flex !important;
	margin-top: 1.4em;
}
@media (max-width: 767px) {
	.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner {
		flex-direction: column;
		align-items: stretch;
		gap: 20px;
		padding: 20px;
	}
	.bnb-assortiment-grid .bt_bb_css_post_grid[data-bnb-category="ontharing"] .bt_bb_css_post_grid_content .bt_bb_grid_item .bt_bb_grid_item_inner .bt_bb_grid_item_post_thumbnail {
		width: 100%;
		max-width: 260px;
		margin: 0 auto;
	}
}
.bnb-thema.bnb-hero-photo .bt_bb_dual_buttons,
.bnb-thema.bnb-cta-photo .bt_bb_dual_buttons { margin-top: 30px; }

/* --- Reviewkaarten (Trainingen #ervaringen): vijf gouden sterren rechtsboven,
   tegenover het aanhalingsteken, op dezelfde hoogte als het icoon. --------- */
.bnb-rv .bnb-rv-card > .bt_bb_column_content { position: relative; }
.bnb-rv .bnb-rv-card .bt_bb_text.bnb-rv-stars {
	position: absolute;
	top: 2.5em;
	right: 2.5em;
	margin: 0;
	flex: none;
}
.bnb-rv .bnb-rv-card .bnb-rv-stars p {
	margin: 0;
	color: var(--accent-color);
	font-size: 0.95rem;
	letter-spacing: 0.2em;
	line-height: 1.5; /* even hoog als het icoon (23px) */
}

/* --- Assortiment: vergelijktabel lasers (#vergelijk-lasers, wens 3 vervolg 16 sep 2026).
   Gewone Bold Builder-tekst met een HTML-tabel, dus door Margreet in de builder te
   bewerken. Eerste kolom = kenmerk, kop = de drie apparaten (gelinkt). Op smalle
   schermen scrollt de tabel horizontaal binnen .bnb-vergelijk-scroll. */
.bnb-vergelijk .bt_bb_headline_subheadline { max-width: 62ch; margin-left: auto; margin-right: auto; }
.bnb-vergelijk .bnb-vergelijk-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 15px; background: #fff; }
.bnb-vergelijk table { width: 100%; min-width: 720px; border-collapse: collapse; margin: 0; font-size: 16px; line-height: 1.5; }
.bnb-vergelijk th, .bnb-vergelijk td { padding: 16px 20px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--light-color, #f0eee9); }
.bnb-vergelijk thead th { font-family: var(--primary-font); font-size: 18px; font-weight: 500; color: var(--dark-color); background: var(--light-color, #f4f1ec); }
.bnb-vergelijk thead th:first-child { background: transparent; }
.bnb-vergelijk thead th a { color: inherit; }
.bnb-vergelijk tbody th { width: 18%; font-weight: 600; color: var(--dark-color); background: var(--light-color, #f4f1ec); }
.bnb-vergelijk tbody td { color: var(--dark-gray-color, #6b6b6b); width: 27%; }
.bnb-vergelijk tbody td[colspan] { width: auto; }
.bnb-vergelijk tbody tr:last-child th, .bnb-vergelijk tbody tr:last-child td { border-bottom: 0; }
@media (max-width: 767px) {
	.bnb-vergelijk table { font-size: 15px; }
	.bnb-vergelijk th, .bnb-vergelijk td { padding: 12px 14px; }
}

/* Assortiment-filter in de volgorde van het menu Apparatuur (het thema sorteert op naam). */
.bnb-assortiment-grid .bt_bb_css_post_grid_filter { display: flex; flex-wrap: wrap; justify-content: center; }
.bnb-assortiment-grid .bt_bb_css_post_grid_filter_item { order: 9; }
.bnb-assortiment-grid .bt_bb_css_post_grid_filter_item[data-category*=","] { order: 0; } /* Alle apparaten */
.bnb-assortiment-grid .bt_bb_css_post_grid_filter_item[data-category="ontharing"] { order: 1; }
.bnb-assortiment-grid .bt_bb_css_post_grid_filter_item[data-category="bodyshaping"] { order: 2; }
.bnb-assortiment-grid .bt_bb_css_post_grid_filter_item[data-category="gezicht-en-bekkenbodem"] { order: 3; }