/*
 * Stijl Zacht (beauty) — licht, vrolijk, vriendelijk. Past bij een nagelstudio, browbar of lashstudio.
 * Koppen: DM Sans 600 · Tekst: DM Sans 400 · Afronding 16–24px, pill-knoppen.
 * Pasteltinten van de klantkleur, zachte vormen, lichte en heldere foto's in afgeronde kaders,
 * knoppen gevuld in de accentkleur. Pastel alleen als achtergrond; tekst blijft AA (--klant-*-op-licht).
 */
:root {
	--bb-font-koppen: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--bb-font-body: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--bb-kop-gewicht: 600;
	--bb-kop-spatie: -0.02em;

	--bb-achtergrond: #FDFBFA;
	--bb-vlak: var(--klant-accent-pastel);
	--bb-zacht: var(--klant-primair-pastel);
	--bb-kaart: #FFFEFD;
	--bb-rand: #EFE7E4;
	--bb-tekst: #2A2427;
	--bb-muted: #6A5F64;

	--bb-radius: 22px;
	--bb-radius-knop: 999px;
	--bb-radius-foto: 24px;
	--bb-radius-icoon: 50%;
	--bb-schaduw: 0 2px 4px rgba(42, 36, 39, .04), 0 12px 30px rgba(42, 36, 39, .07);

	--bb-icoon-lijn: 1.8;
	--bb-icoon-vul: .22;
}
body { font-size: 1.0625rem; }
h1 { letter-spacing: -0.03em; }
.wp-block-uagb-container.bb-sectie--zacht, .wp-block-uagb-container.bb-sectie--tint { overflow: hidden !important; }
/* Zachte vormen op de achtergrond. */
.bb-sectie--zacht::before, .bb-sectie--zacht::after {
	content: ""; position: absolute; z-index: 0; pointer-events: none; border-radius: 50%;
	background: var(--klant-accent-pastel); opacity: .85;
}
.bb-sectie--zacht::before { width: 460px; height: 460px; top: -200px; right: -140px; }
.bb-sectie--zacht::after { width: 280px; height: 280px; bottom: -140px; left: -90px; background: var(--bb-kaart); opacity: .6; }
.bb-sectie--zacht > .uagb-container-inner-blocks-wrap { position: relative; z-index: 1; }
.bb-hero--home .bb-hero__foto img { aspect-ratio: 1 / 1; border-radius: 48% 48% 24px 24px; }
.bb-sectie .bb-eyebrow { width: fit-content !important; max-width: 100%; } /* Spectra zet kinderen op 100% breedte. */
.bb-kopblok--midden .bb-eyebrow { margin-inline: auto; }
.bb-eyebrow { text-transform: none; letter-spacing: 0; font-size: .95rem; display: inline-block; align-self: flex-start; background: var(--klant-accent-zacht); padding: .25em .85em; border-radius: 999px; }
.bb-chips li { background: var(--klant-accent-zacht); }
.bb-chips--voorwie li { background: var(--bb-kaart); border-color: transparent; box-shadow: var(--bb-schaduw); }
.bb-prijscat { border: 0; box-shadow: var(--bb-schaduw); }
.bb-prijsregel__prijs { color: var(--klant-accent-op-licht); }
.bb-prijsregel__lijn { border-bottom-style: dotted; border-bottom-width: 3px; border-color: var(--klant-accent-pastel); }
.bb-filter__knop { border-width: 2px; }
.bb-filter__knop[aria-pressed="true"] { background: var(--klant-accent-hover); border-color: var(--klant-accent-hover); color: var(--klant-accent-tekst); } /* accent-hover haalt altijd 4,5:1 met de knoptekst */
.bb-werk__link img, .bb-werkrij__link img { filter: saturate(1.05) brightness(1.02); }
.bb-teamkaart .bb-behandelaar__foto { border-radius: 0; }
.bb-topbalk { background: var(--klant-accent-zacht); color: var(--klant-primair-op-licht); }
.bb-faq-item summary::after { background: var(--klant-accent-pastel); }
.bb-page .wpforms-container :is(input[type=text], input[type=email], textarea, select) { border-radius: 16px !important; }
