/**
 * Atelier Stralend: aanvullende stijlen bij theme.json.
 * Kleuren, lettertypes en maten komen uit theme.json (var(--wp--preset--...)).
 */

:root {
	--as-steek: 2px dashed var(--wp--preset--color--rand);
	--as-radius-kaart: 32px;
	--as-radius-paneel: 40px;
	--as-label: #6b5a70;
	--as-veldrand: #e8dce6;
	--as-groen: #1f8a5b;
	--as-roze-stip: #c4246b;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

input,
select,
textarea {
	box-sizing: border-box;
	max-width: 100%;
}

/* Grote koppen breken nooit midden in een woord af. */
h1,
h2 {
	overflow-wrap: normal;
	hyphens: manual;
	text-wrap: balance;
}

.as-hero__kop {
	font-size: clamp(40px, 5vw, 72px);
}

/* Focus: geen rand als je klikt of tikt. Alleen wie met het toetsenbord
   (Tab) door de site gaat, ziet een rustige stippellijn in de huisstijl. */
:focus:not(:focus-visible) {
	outline: none;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px dashed var(--wp--preset--color--papaver);
	outline-offset: 3px;
}

/* Header, inhoud en footer sluiten direct op elkaar aan. */
.wp-site-blocks > * + * {
	margin-block-start: 0;
}

/* ---------------------------------------------------------------------------
 * Secties en panelen
 * ------------------------------------------------------------------------ */

.as-sectie {
	padding-block-start: var(--wp--preset--spacing--80);
}

.as-sectie--ruim {
	padding-block: var(--wp--preset--spacing--70);
}

.as-paneel {
	border-radius: var(--as-radius-paneel);
	padding: clamp(24px, 4vw, 56px);
}

.wp-block-group.is-style-kaart {
	border-radius: var(--as-radius-kaart);
	padding: clamp(24px, 3vw, 40px);
}

.wp-block-group.is-style-steek {
	border: var(--as-steek);
	border-radius: 28px;
	padding: clamp(20px, 3vw, 32px);
}

.as-kopblok > * {
	margin-block: 0;
}

.as-kopblok {
	gap: 10px;
}

/* Gestikte zon als decoratie in een vlak */
.as-zon {
	position: relative;
	overflow: hidden;
}

.as-zon::before {
	content: "";
	position: absolute;
	width: clamp(160px, 20vw, 260px);
	aspect-ratio: 1;
	right: -50px;
	top: -60px;
	background: url("../images/zon-papaver.svg") no-repeat center / contain;
	opacity: 0.7;
	pointer-events: none;
}

.as-zon > * {
	position: relative;
	z-index: 1;
}

.as-zon.as-zon--links::before {
	right: auto;
	left: -70px;
	top: -70px;
	width: 200px;
	opacity: 0.6;
}

.as-paneel.as-zon--links {
	padding: clamp(32px, 5vw, 64px);
}

.as-zon.as-zon--onder::before {
	top: auto;
	bottom: -70px;
}

.as-zon.as-zon--wit::before {
	background-image: url("../images/zon-wit.svg");
	opacity: 0.35;
}

.as-zon.as-zon--lila::before {
	background-image: url("../images/zon-lila.svg");
	opacity: 0.55;
}

/* ---------------------------------------------------------------------------
 * Typografie en blokstijlen
 * ------------------------------------------------------------------------ */

.is-style-hand {
	font-family: var(--wp--preset--font-family--hand);
	font-weight: 700;
	font-size: clamp(24px, 2.6vw, 34px);
	line-height: 1;
	letter-spacing: 0;
	transform: rotate(-2deg);
	transform-origin: left center;
}

.is-style-hand:not(.has-text-color) {
	color: var(--wp--preset--color--papaver);
}

.is-style-hand.has-text-align-center {
	transform-origin: center;
}

.is-style-label {
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.is-style-label:not(.has-text-color) {
	color: var(--as-label);
}

mark.as-markeer {
	background: var(--wp--preset--color--zon);
	color: inherit;
	padding: 0 0.12em;
	border-radius: 0.18em;
}

/* Iets meer regelafstand, zodat de markering de j en g van de regel erboven niet raakt. */
.wp-block-heading:has(> mark.as-markeer) {
	line-height: 1.12;
}

.is-style-golf::after {
	content: "";
	display: block;
	width: 220px;
	max-width: 100%;
	height: 14px;
	margin-top: 12px;
	background: url("../images/golf.svg") no-repeat left center / contain;
}

.is-style-golf.has-text-align-center::after {
	margin-inline: auto;
	background-position: center;
}

/* Afbeeldingen */
.wp-block-image.is-style-boog img {
	width: 100%;
	object-fit: cover;
	border-radius: 999px 999px 28px 28px;
}

.wp-block-image.is-style-rond img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 999px;
}

.as-foto img {
	width: 100%;
	object-fit: cover;
	border-radius: 22px;
}

/* Knoppen */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--inkt);
	border: 2px solid currentColor;
	padding: 14px 26px;
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--inkt);
	border-color: var(--wp--preset--color--inkt);
	color: var(--wp--preset--color--wit);
}

.wp-block-button.is-style-donker > .wp-block-button__link {
	background: var(--wp--preset--color--inkt);
	color: var(--wp--preset--color--wit);
}

.wp-block-button.is-style-donker > .wp-block-button__link:hover {
	background: #452653;
}

.wp-block-button.is-style-koop > .wp-block-button__link {
	padding: 18px 30px;
	font-size: 17px;
	font-weight: 800;
	box-shadow: var(--wp--preset--shadow--knop);
}

.wp-block-button.as-knop-wit > .wp-block-button__link {
	background: var(--wp--preset--color--wit);
	color: var(--wp--preset--color--inkt);
}

.wp-block-button.as-knop-wit > .wp-block-button__link:hover {
	background: var(--wp--preset--color--geel);
}

.as-chips .wp-block-button__link {
	padding: 10px 18px;
	font-size: 15px;
}

/* Scheidingslijn als steek */
.wp-block-separator.is-style-steek {
	border: 0;
	border-top: 2px dashed currentColor;
	opacity: 1;
	height: 0;
	background: none;
	width: 100%;
}

/* Tabellen */
.wp-block-table.is-style-steek {
	border: 2px solid var(--wp--preset--color--rand);
	border-radius: 20px;
	overflow-x: auto;
}

.wp-block-table.is-style-steek table {
	border-collapse: collapse;
	width: 100%;
	min-width: 440px;
	font-size: 15px;
}

.wp-block-table.is-style-steek thead {
	border: 0;
}

.wp-block-table.is-style-steek th,
.wp-block-table.is-style-steek td {
	border: 0;
	border-top: var(--as-steek);
	padding: 12px 16px;
	text-align: left;
}

.wp-block-table.is-style-steek thead th {
	background: var(--wp--preset--color--lila-zacht);
	border-top: 0;
}

/* Lijsten */
.wp-block-list.is-style-vinkjes,
.wp-block-list.is-style-kaal,
.wp-block-list.is-style-stappen {
	list-style: none;
	padding-left: 0;
}

.wp-block-list.is-style-vinkjes li,
.wp-block-list.is-style-kaal li,
.wp-block-list.is-style-stappen li {
	position: relative;
}

.wp-block-list.is-style-vinkjes li + li,
.wp-block-list.is-style-kaal li + li {
	margin-top: 10px;
}

.wp-block-list.is-style-vinkjes li {
	padding-left: 34px;
}

.wp-block-list.is-style-vinkjes li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.15em;
	width: 22px;
	height: 22px;
	background: url("../images/vinkje.svg") no-repeat center / contain;
}

.wp-block-list.is-style-stappen {
	counter-reset: stap;
}

.wp-block-list.is-style-stappen li {
	counter-increment: stap;
	display: flex;
	align-items: center;
	min-height: 40px;
	padding-left: 54px;
}

.wp-block-list.is-style-stappen li + li {
	margin-top: 14px;
}

.wp-block-list.is-style-stappen li::before {
	content: counter(stap);
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 40px;
	height: 40px;
	border-radius: 999px;
	background: var(--wp--preset--color--wit);
	border: 2px dashed var(--wp--preset--color--inkt);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--wp--preset--font-family--kop);
	font-weight: 800;
}

/* Uitklapblokken (veelgestelde vragen) */
.wp-block-details summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-weight: 700;
	font-size: 18px;
	cursor: pointer;
	list-style: none;
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::after {
	content: "+";
	font-size: 24px;
	line-height: 1;
	flex: none;
}

.wp-block-details[open] summary::after {
	content: "–";
}

.wp-block-details > :not(summary) {
	margin-top: 14px;
	color: var(--wp--preset--color--tekst-zacht);
}

.as-faq {
	border-top: var(--as-steek);
}

/* Citaat */
.wp-block-quote {
	border-left: 0;
	padding-left: 0;
}

.wp-block-quote cite {
	display: block;
	margin-top: 18px;
	font-family: var(--wp--preset--font-family--hand);
	font-size: 36px;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0;
}

/* ---------------------------------------------------------------------------
 * Header
 * ------------------------------------------------------------------------ */

.as-topbar p {
	margin: 0;
}

.as-topbar a {
	color: inherit;
}

.as-header {
	background: var(--wp--preset--color--wit);
	border-bottom: var(--as-steek);
}

.as-header__rij {
	padding-block: 14px;
}

.as-logo {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	color: var(--wp--preset--color--inkt);
	text-decoration: none;
}

.as-logo:hover {
	color: var(--wp--preset--color--inkt);
}

.as-logo svg {
	width: 46px;
	height: 46px;
	flex: none;
}

.as-logo__tekst {
	display: flex;
	flex-direction: column;
	line-height: 1;
}

.as-logo__atelier {
	font-family: var(--wp--preset--font-family--hand);
	font-size: 22px;
	font-weight: 700;
	color: var(--wp--preset--color--papaver);
	margin-bottom: -2px;
}

.as-logo__naam {
	font-family: var(--wp--preset--font-family--kop);
	font-size: 26px;
	font-weight: 800;
	letter-spacing: -0.03em;
}

.as-header__iconen {
	gap: 2px;
}

.as-header .wp-block-search__button {
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--wp--preset--color--inkt);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-shadow: none;
}

.as-header .wp-block-search__button:hover {
	background: var(--wp--preset--color--geel);
}

.as-header .wp-block-search__button svg {
	width: 24px;
	height: 24px;
	fill: currentColor;
}

.as-header .wp-block-search__input {
	border: 2px solid var(--as-veldrand);
	border-radius: 999px;
	padding: 8px 16px;
	font-size: 15px;
}

.as-header .wp-block-search__inside-wrapper {
	border: 0;
	padding: 0;
}

/* Mobiel menu */
.wp-block-navigation__responsive-container.is-menu-open {
	padding: 24px clamp(16px, 4vw, 40px);
	background: var(--wp--preset--color--wit);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 56px;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	width: 100%;
	gap: 0;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100%;
	border-bottom: var(--as-steek);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: block;
	width: 100%;
	padding: 14px 0 !important;
	font-family: var(--wp--preset--font-family--kop);
	font-size: 22px;
	font-weight: 800;
}

.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
}

.wp-block-navigation__responsive-container-close {
	background: var(--wp--preset--color--lila-zacht);
}

/* Stappen (winkelmand → afrekenen → bevestiging) */
.as-stappen {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--as-label);
}

.as-stappen li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.as-stappen a {
	color: var(--wp--preset--color--inkt);
}

.as-stappen__nr {
	width: 28px;
	height: 28px;
	flex: none;
	border-radius: 999px;
	border: 2px solid #d8c9d6;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: 800;
}

.as-stappen li[aria-current="step"] {
	color: var(--wp--preset--color--inkt);
}

.as-stappen li[aria-current="step"] .as-stappen__nr {
	background: var(--wp--preset--color--papaver);
	border-color: var(--wp--preset--color--papaver);
	color: var(--wp--preset--color--wit);
}

.as-stappen li.is-klaar .as-stappen__nr {
	background: var(--as-groen);
	border-color: var(--as-groen);
	color: var(--wp--preset--color--wit);
}

.as-stappen__lijn {
	width: 36px;
	border-top: 2px dashed #d8c9d6;
}

@media (max-width: 599px) {
	.as-stappen {
		flex-wrap: nowrap;
		gap: 6px;
		font-size: 13px;
	}

	.as-stappen li {
		gap: 6px;
	}

	.as-stappen__lijn {
		width: auto;
		flex: 1 1 8px;
		min-width: 8px;
	}

	.as-stappen__nr {
		width: 24px;
		height: 24px;
		font-size: 12px;
	}

	/* Bovenbalk: alleen de belofte, de links staan ook in het menu en de footer. */
	.as-topbar > .wp-block-group {
		justify-content: center !important;
	}

	.as-topbar > .wp-block-group > .wp-block-group {
		display: none;
	}

	.as-topbar p {
		font-size: 13px;
		text-align: center;
	}
}

.as-veilig {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-weight: 700;
	font-size: 15px;
}

@media (max-width: 780px) {
	.as-checkout-header .as-stappen {
		display: none;
	}
}

/* ---------------------------------------------------------------------------
 * Footer
 * ------------------------------------------------------------------------ */

.as-footer .as-logo {
	color: var(--wp--preset--color--wit);
}

.as-footer .as-logo__atelier {
	color: var(--wp--preset--color--zon);
}

.as-footer a {
	color: #f6eff5;
	text-decoration: none;
}

.as-footer a:hover {
	color: var(--wp--preset--color--wit);
	text-decoration: underline;
}

.as-footer .wp-block-list {
	list-style: none;
	padding: 0;
	margin: 16px 0 0;
}

.as-footer .wp-block-separator {
	margin-block: 48px 24px;
}

.as-footer .wp-block-list li + li {
	margin-top: 10px;
}

.as-footer .wp-block-separator {
	color: rgba(246, 239, 245, 0.25);
}

.as-zacht-op-donker {
	color: #cdbbd0;
}

/* ---------------------------------------------------------------------------
 * Homepage-onderdelen
 * ------------------------------------------------------------------------ */

/* Collage in de hero */
.as-collage {
	position: relative;
	height: clamp(400px, 42vw, 580px);
}

.as-collage > * {
	margin: 0 !important;
}

.as-collage .as-collage__groot {
	position: absolute;
	left: 0;
	top: 0;
	width: 62%;
	height: 100%;
}

.as-collage .as-collage__rond {
	position: absolute;
	right: 0;
	top: 4%;
	width: 34%;
}

.as-collage .as-collage__klein {
	position: absolute;
	right: 2%;
	bottom: 0;
	width: 40%;
	height: 46%;
}

.as-collage .as-collage__groot img,
.as-collage .as-collage__klein img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.as-collage .as-collage__klein img {
	border-radius: 28px;
}

.as-sticker {
	position: absolute;
	left: 48%;
	top: 40%;
	width: 148px;
	height: 148px;
	margin: 0;
	padding: 20px;
	border-radius: 999px;
	background: var(--wp--preset--color--zon);
	box-shadow: 0 0 0 6px var(--wp--preset--color--wit);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	transform: rotate(-10deg);
	font-family: var(--wp--preset--font-family--hand);
	font-size: 26px;
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--inkt);
	z-index: 2;
}

.as-sticker::before {
	content: "";
	position: absolute;
	inset: 10px;
	border: 2px dashed var(--wp--preset--color--inkt);
	border-radius: 999px;
}

@media (max-width: 781px) {
	.as-collage {
		height: 420px;
	}

	.as-sticker {
		width: 120px;
		height: 120px;
		font-size: 22px;
	}
}

/* USP-balk */
.as-usp {
	border-block: var(--as-steek);
	padding-block: 28px;
}

.as-usp p {
	margin: 0;
}

.as-icoon {
	width: 52px;
	height: 52px;
	flex: none;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.as-icoon svg {
	width: 26px;
	height: 26px;
}

.as-icoon--groot {
	width: 72px;
	height: 72px;
	border: 2px dashed var(--wp--preset--color--inkt);
}

.as-icoon--groot svg {
	width: 30px;
	height: 30px;
}

.as-icoon--wit {
	background: var(--wp--preset--color--wit);
	width: 56px;
	height: 56px;
}

/* Keuzekaarten "jouw manier" */
.as-keuze {
	min-height: 360px;
}

.as-keuze > .as-keuze__link {
	margin-top: auto;
}

.as-stalen {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.as-stalen span {
	width: 34px;
	height: 34px;
	border-radius: 999px;
	border: 2px solid var(--wp--preset--color--wit);
}

/* Categorietegels */
.as-tegel {
	position: relative;
	border-radius: var(--as-radius-kaart);
	padding: 14px 14px 22px;
	transition: transform 0.2s ease;
}

.as-tegel:hover {
	transform: translateY(-3px);
}

.as-tegel .wp-block-image img {
	width: 100%;
	height: 260px;
	object-fit: cover;
	border-radius: 22px;
}

.as-tegel__tekst {
	padding-inline: 8px 64px;
}

.as-tegel__tekst > * {
	margin: 0;
}

.as-tegel h3 a {
	color: inherit;
	text-decoration: none;
}

.as-tegel h3 a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: var(--as-radius-kaart);
}

.as-tegel::after {
	content: "";
	position: absolute;
	right: 22px;
	bottom: 26px;
	width: 44px;
	height: 44px;
	border-radius: 999px;
	background: var(--wp--preset--color--inkt) url("../images/pijl-wit.svg") no-repeat center / 18px;
	pointer-events: none;
}

/* Twee foto's naast elkaar (moeder & kind) */
.as-duo {
	align-items: flex-end;
}

.as-duo > .wp-block-image {
	flex: 1 1 0;
	min-width: 0;
	margin: 0;
}

.as-duo > .wp-block-image:last-child {
	flex-basis: 0;
	flex-grow: 0.77;
}

/* Borduurring (op naam, 404) */
.as-ring {
	position: relative;
	width: min(100%, 400px);
	aspect-ratio: 1;
	margin-inline: auto;
}

.as-ring__haak {
	position: absolute;
	left: 50%;
	top: -14px;
	width: 64px;
	height: 32px;
	margin-left: -32px;
	border-radius: 8px;
	background: #b98048;
}

.as-ring__doek {
	position: absolute;
	inset: 0;
	border-radius: 999px;
	border: 18px solid #d9a86c;
	box-shadow: 0 0 0 4px #b98048;
	background: #fffdf8;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	text-align: center;
}

.as-ring__doek::before {
	content: "";
	position: absolute;
	inset: 12px;
	border-radius: 999px;
	border: 2px dashed rgba(42, 22, 51, 0.12);
}

.as-ring__naam {
	font-family: var(--wp--preset--font-family--hand);
	font-size: clamp(56px, 7vw, 80px);
	font-weight: 700;
	line-height: 0.9;
	color: var(--wp--preset--color--papaver);
}

.as-ring__regel {
	font-family: var(--wp--preset--font-family--hand);
	font-size: clamp(22px, 2.6vw, 30px);
	color: var(--wp--preset--color--inkt);
}

.as-minikaart {
	border-radius: 22px;
	padding: 14px;
}

.as-minikaart p {
	margin: 0;
}

/* Persoonlijke foto met handgeschreven onderschrift */
.as-portret {
	position: relative;
}

.as-portret__naam {
	position: absolute;
	right: 4%;
	bottom: 2%;
	margin: 0;
}

.wp-block-image.as-met-onderschrift figcaption {
	font-family: var(--wp--preset--font-family--hand);
	font-size: 36px;
	font-weight: 700;
	color: var(--wp--preset--color--papaver);
	text-align: center;
	margin-top: 10px;
}

/* Formulieren (contact, nieuwsbrief) */
.as-formulier {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.as-formulier label {
	display: block;
	margin-bottom: 8px;
	font-weight: 700;
	font-size: 15px;
}

.as-formulier input[type="text"],
.as-formulier input[type="email"],
.as-formulier input[type="tel"],
.as-formulier select,
.as-formulier textarea {
	width: 100%;
	height: 52px;
	padding: 0 16px;
	border: 2px solid var(--as-veldrand);
	border-radius: 14px;
	background: var(--wp--preset--color--wit);
	font: inherit;
	color: inherit;
}

.as-formulier textarea {
	height: auto;
	padding: 14px 16px;
	line-height: 1.5;
	resize: vertical;
}

.as-formulier input:focus,
.as-formulier textarea:focus {
	border-color: var(--wp--preset--color--inkt);
	outline: none;
}

.as-formulier__rij {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
}

.as-formulier__rij > * {
	flex: 1 1 220px;
	min-width: 0;
}

.as-formulier button,
.as-nieuwsbrief button {
	align-self: flex-start;
	min-height: 54px;
	padding: 0 28px;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--papaver);
	color: var(--wp--preset--color--wit);
	font: inherit;
	font-weight: 800;
	cursor: pointer;
}

.as-formulier button:hover,
.as-nieuwsbrief button:hover {
	background: var(--wp--preset--color--papaver-donker);
}

.as-nieuwsbrief label {
	display: block;
	margin-bottom: 8px;
	font-weight: 700;
	font-size: 15px;
}

.as-nieuwsbrief__rij {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.as-nieuwsbrief input {
	flex: 1 1 220px;
	min-width: 0;
	height: 54px;
	padding: 0 20px;
	border: 2px solid var(--wp--preset--color--inkt);
	border-radius: 999px;
	background: var(--wp--preset--color--wit);
	font: inherit;
}

.as-nieuwsbrief small {
	display: block;
	margin-top: 10px;
	font-size: 13px;
	color: var(--wp--preset--color--tekst-gedempt);
}

/* 404 */
.as-404 {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(8px, 1.5vw, 18px);
	font-family: var(--wp--preset--font-family--kop);
	font-size: clamp(120px, 16vw, 220px);
	font-weight: 800;
	letter-spacing: -0.05em;
	line-height: 0.9;
}

.as-404 .as-ring {
	width: clamp(110px, 14vw, 190px);
	flex: none;
	margin: 0;
}

.as-404 .as-ring__doek {
	border-width: clamp(12px, 1.4vw, 18px);
}

.as-404 .as-ring__haak {
	top: calc(-1 * clamp(22px, 2.4vw, 30px));
	width: 44px;
	height: 24px;
	margin-left: -22px;
}

.as-404 svg {
	width: 60%;
	height: 60%;
}

/* Levertijd-label (inc/levering.php) */
.as-levering {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: 14px;
	color: var(--wp--preset--color--tekst-zacht);
}

.is-layout-constrained > .as-levering {
	display: flex;
}

.as-levering__stip {
	width: 8px;
	height: 8px;
	flex: none;
	border-radius: 999px;
	background: var(--as-groen);
}

.as-levering--blauw .as-levering__stip {
	background: var(--wp--preset--color--kobalt);
}

.as-levering--roze .as-levering__stip {
	background: var(--as-roze-stip);
}

.as-legenda {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 24px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
	color: var(--wp--preset--color--tekst-zacht);
}

.as-legenda li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.as-legenda strong {
	color: var(--wp--preset--color--inkt);
}

/* Instagram-raster */
.as-insta img {
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 22px;
}

/* Kleine schermen */
@media (max-width: 781px) {
	.as-paneel {
		border-radius: 28px;
	}

	.wp-block-columns.as-kolommen-omgekeerd {
		flex-direction: column-reverse;
	}
}

/* ---------------------------------------------------------------------------
 * Hulpklassen
 * ------------------------------------------------------------------------ */

.as-midden,
.as-midden .wp-block-quote {
	text-align: center;
}

.as-midden .wp-block-search {
	width: min(100%, 520px);
}

/* Leesbare links op papaverrood */
.has-papaver-background-color a:not(.wp-block-button__link) {
	color: var(--wp--preset--color--wit);
}

/* Mobiel: hamburger rechts naast de iconen */
@media (max-width: 599px) {
	.as-header__rij .wp-block-navigation {
		order: 3;
	}

	/* Past ook op smalle telefoons (375px) zonder zijwaarts scrollen. */
	.as-header .as-header__rij {
		gap: 10px;
	}

	.as-header__rij > .as-logo {
		margin-right: auto;
	}

	.as-logo__naam {
		font-size: 22px;
	}

	.as-logo svg {
		width: 38px;
		height: 38px;
	}
}

/* ---------------------------------------------------------------------------
 * Over ons: gezamenlijke foto
 * ------------------------------------------------------------------------ */

.as-samen {
	position: relative;
	padding-bottom: 28px;
}

.as-samen > * {
	margin-block: 0;
}

.as-samen__foto,
.as-samen__foto img {
	width: 100%;
	margin: 0;
}

.as-samen__foto img {
	aspect-ratio: 5 / 4;
	object-fit: cover;
	border-radius: var(--as-radius-paneel);
}

.as-samen__namen {
	position: absolute;
	left: clamp(12px, 3vw, 28px);
	bottom: 0;
	margin: 0;
	padding: 10px 22px 12px;
	border-radius: 999px;
	background: var(--wp--preset--color--zon);
	box-shadow: var(--wp--preset--shadow--knop);
	font-family: var(--wp--preset--font-family--hand);
	font-size: clamp(28px, 3vw, 38px);
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--inkt);
	transform: rotate(-3deg);
}

/* ---------------------------------------------------------------------------
 * Blog
 * ------------------------------------------------------------------------ */

.as-blog-kop > * {
	margin-block: 0;
}

/* Smaller dan de rest van de kop, maar wel links uitgelijnd. */
.as-blog-kop > .as-blog-intro {
	max-width: min(640px, 100%);
	margin-top: 4px;
	margin-left: max(0px, (100% - 1240px) / 2) !important;
}

/* Onderwerpen als knoppen */
.as-onderwerpen {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 10px !important;
	padding: 0;
	list-style: none;
}

.as-onderwerpen li {
	margin: 0;
}

.as-onderwerpen a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 18px;
	border: 2px solid var(--wp--preset--color--inkt);
	border-radius: 999px;
	background: var(--wp--preset--color--wit);
	font-weight: 700;
	font-size: 15px;
	color: var(--wp--preset--color--inkt);
	text-decoration: none;
}

.as-onderwerpen a:hover,
.as-onderwerpen .current-cat a {
	background: var(--wp--preset--color--inkt);
	color: var(--wp--preset--color--wit);
}

/* Kaarten */
.as-blogkaart {
	height: 100%;
}

.as-blogkaart > *,
.as-blogkaart__tekst > * {
	margin-block: 0;
}

.as-blogkaart__beeld {
	width: 100%;
	margin: 0;
}

.as-blogkaart__beeld img {
	transition: transform 0.25s ease;
}

.as-blogkaart__beeld a {
	display: block;
	overflow: hidden;
	border-radius: 24px;
}

.as-blogkaart:hover .as-blogkaart__beeld img {
	transform: scale(1.03);
}

.as-blogkaart__meta {
	color: var(--wp--preset--color--tekst-gedempt);
}

.as-blogkaart__meta > * {
	margin: 0;
}

.as-onderwerp a {
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	border-radius: 999px;
	background: var(--wp--preset--color--lila);
	font-weight: 700;
	font-size: 13px;
	color: var(--wp--preset--color--inkt);
	text-decoration: none;
}

.as-onderwerp .wp-block-post-terms__separator {
	display: none;
}

.as-blogkaart__titel {
	font-size: clamp(22px, 2vw, 26px);
	letter-spacing: -0.02em;
	line-height: 1.15;
}

.as-blogkaart__titel a {
	color: var(--wp--preset--color--inkt);
	text-decoration: none;
}

.as-blogkaart__titel a:hover {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

.as-blogkaart__samenvatting {
	font-size: 16px;
	line-height: 1.6;
	color: var(--wp--preset--color--tekst-zacht);
}

.as-blogkaart__samenvatting .wp-block-post-excerpt__excerpt {
	margin: 0;
}

.as-blogkaart__samenvatting .wp-block-post-excerpt__more-text {
	margin: 10px 0 0;
}

.as-blogkaart__samenvatting .wp-block-post-excerpt__more-link {
	font-weight: 700;
	color: var(--wp--preset--color--inkt);
}

/* Het nieuwste verhaal groot bovenaan, alleen op de eerste blogpagina. */
@media (min-width: 782px) {
	body.blog:not(.paged) .as-bloglijst .wp-block-post-template > li:first-child {
		grid-column: 1 / -1;
	}

	body.blog:not(.paged) .as-bloglijst .wp-block-post-template > li:first-child .as-blogkaart {
		display: grid;
		grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
		align-items: center;
		gap: clamp(28px, 4vw, 56px);
		padding-bottom: 28px;
		border-bottom: var(--as-steek);
	}

	body.blog:not(.paged) .as-bloglijst .wp-block-post-template > li:first-child .as-blogkaart__titel {
		font-size: clamp(30px, 3vw, 42px);
	}
}

/* Artikel */
.as-artikel__kop > * {
	margin-block: 0;
}

.as-artikel__intro {
	line-height: 1.6;
}

.as-artikel__intro .wp-block-post-excerpt__excerpt {
	margin: 0;
}

.as-artikel__door {
	margin: 0;
	font-weight: 700;
}

.as-artikel__inhoud {
	margin-top: clamp(28px, 4vw, 44px) !important;
	font-size: 18px;
	line-height: 1.75;
}

.as-artikel__inhoud > * + * {
	margin-block-start: 1.1em;
}

.as-artikel__inhoud h2 {
	margin-block-start: 1.8em;
	font-size: clamp(26px, 2.6vw, 32px);
	letter-spacing: -0.02em;
}

.as-artikel__inhoud h3 {
	margin-block-start: 1.5em;
	font-size: 22px;
}

.as-artikel__inhoud a {
	font-weight: 600;
	color: var(--wp--preset--color--papaver);
	text-underline-offset: 3px;
}

.as-artikel__inhoud ul:not(.is-style-vinkjes):not(.is-style-kaal),
.as-artikel__inhoud ol {
	padding-left: 1.3em;
}

.as-artikel__inhoud li + li {
	margin-top: 8px;
}

.as-artikel__inhoud li::marker {
	color: var(--wp--preset--color--papaver);
	font-weight: 700;
}

.as-artikel__inhoud blockquote {
	margin-inline: 0;
	padding: 22px 26px;
	border: 0;
	border-radius: 24px;
	background: var(--wp--preset--color--geel);
	font-family: var(--wp--preset--font-family--hand);
	font-size: 28px;
	line-height: 1.25;
}

.as-artikel__inhoud .wp-block-image img {
	border-radius: 24px;
}

.as-voorbeeldtekst {
	padding: 14px 18px;
	border-radius: 16px;
	background: var(--wp--preset--color--lila-zacht);
	font-size: 15px;
	color: var(--wp--preset--color--tekst-zacht);
}

.as-artikel__voet > * {
	margin-block: 0;
}

.as-schrijvers > * {
	margin-block: 0;
}

/* Vaste twee kolommen: het automatische grid van WordPress maakte deze kaarten
   in Chrome veel te hoog. */
.as-verder.is-layout-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	container-type: normal;
}

@media (max-width: 600px) {
	.as-verder.is-layout-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

.as-verder__link {
	display: flex;
	margin: 0;
}

.as-verder__link a {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 4px;
	box-sizing: border-box;
	padding: 18px 22px;
	border: 2px solid var(--wp--preset--color--rand);
	border-radius: 22px;
	font-family: var(--wp--preset--font-family--kop);
	font-weight: 700;
	font-size: 19px;
	line-height: 1.25;
	color: var(--wp--preset--color--inkt);
	text-decoration: none;
}

.as-verder__link a:hover {
	border-color: var(--wp--preset--color--inkt);
}

.as-verder__link .post-navigation-link__label {
	font-family: var(--wp--preset--font-family--tekst);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--as-label);
}

.wp-block-post-navigation-link.post-navigation-link-next.as-verder__link a {
	text-align: right;
}

.as-terug {
	margin: 0;
	font-weight: 700;
}

.as-terug a {
	color: var(--wp--preset--color--inkt);
}

/* ---------------------------------------------------------------------------
 * Binnenkort open (WooCommerce > Instellingen > Site zichtbaarheid)
 * ------------------------------------------------------------------------ */

.as-binnenkort {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: clamp(32px, 5vw, 56px);
	min-height: 100vh;
	min-height: 100dvh;
	box-sizing: border-box;
}

.as-binnenkort > * {
	margin-block: 0 !important;
}

.as-binnenkort .as-logo__naam {
	font-size: 28px;
}

.as-binnenkort__inhoud {
	margin-block: auto !important;
}

.as-binnenkort__formulier {
	max-width: 560px;
	margin-top: 8px;
}

.as-binnenkort__ring {
	width: min(100%, 420px);
}

.as-binnenkort__ring .as-ring__naam {
	font-size: clamp(54px, 6vw, 76px);
}

.as-binnenkort__voet p {
	margin: 0;
}

.as-binnenkort__voet a {
	font-weight: 700;
	color: var(--wp--preset--color--inkt);
}

@media (max-width: 781px) {
	.as-binnenkort__ring {
		width: min(78%, 320px);
	}

	/* Kleinere zon, zodat hij het logo niet raakt. */
	.as-binnenkort.as-zon::before {
		width: 120px;
		right: -44px;
		top: -44px;
	}
}

/* ---------------------------------------------------------------------------
 * Productpagina: reviews (inc/reviews.php)
 * ------------------------------------------------------------------------ */

.as-reviews-blok {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: clamp(28px, 4vw, 56px);
	padding-block-start: var(--wp--preset--spacing--80);
	scroll-margin-top: 24px;
}

.as-reviews-blok__samenvatting {
	flex: 1 1 300px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: clamp(28px, 3vw, 40px);
	border-radius: 32px;
	background: var(--wp--preset--color--geel);
}

.as-reviews-blok__samenvatting > * {
	margin: 0;
}

.as-reviews-blok h2 {
	margin: 0;
	font-family: var(--wp--preset--font-family--kop);
	font-size: clamp(30px, 3.4vw, 44px);
	font-weight: 800;
	letter-spacing: -0.03em;
	line-height: 1;
}

.as-reviews-blok__score {
	display: flex;
	align-items: center;
	gap: 16px;
}

.as-reviews-blok__getal {
	font-family: var(--wp--preset--font-family--kop);
	font-size: 64px;
	font-weight: 800;
	letter-spacing: -0.04em;
	line-height: 1;
}

.as-reviews-blok__sterren {
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 14px;
	color: var(--wp--preset--color--tekst-zacht);
}

.as-sterren {
	display: inline-flex;
	gap: 2px;
}

.as-reviews-blok__leeg {
	font-weight: 700;
	font-size: 18px;
}

.as-reviews-blok__uitleg {
	font-size: 15px;
	line-height: 1.5;
	color: var(--wp--preset--color--tekst-zacht);
}

.as-reviews-blok__uitleg a {
	font-weight: 700;
	color: var(--wp--preset--color--inkt);
}

.as-reviews-blok__knop {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	min-height: 48px;
	padding: 0 22px;
	border: 2px solid var(--wp--preset--color--inkt);
	border-radius: 999px;
	background: var(--wp--preset--color--wit);
	color: var(--wp--preset--color--inkt);
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
}

.as-reviews-blok__knop:hover,
.as-reviews-blok__knop[aria-expanded="true"] {
	background: var(--wp--preset--color--inkt);
	color: var(--wp--preset--color--wit);
}

.as-reviews-blok__lijst {
	flex: 999 1 560px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.as-reviews-blok__bedankt {
	margin: 0;
	padding: 14px 18px;
	border-radius: 16px;
	background: var(--wp--preset--color--mint);
	font-weight: 600;
}

.as-review {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 22px 24px;
	border: 2px solid var(--wp--preset--color--rand);
	border-radius: 24px;
}

.as-review--leeg p {
	margin: 0;
	color: var(--wp--preset--color--tekst-zacht);
}

.as-review__kop {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.as-review__geverifieerd {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 700;
	color: #14613f;
}

.as-review__titel {
	margin: 0;
	font-family: var(--wp--preset--font-family--tekst);
	font-size: 18px;
	font-weight: 700;
	letter-spacing: 0;
}

.as-review__tekst {
	font-size: 16px;
	line-height: 1.6;
	color: var(--wp--preset--color--tekst-zacht);
}

.as-review__tekst > * {
	margin: 0;
}

.as-review__tekst > * + * {
	margin-top: 10px;
}

.as-review__fotos {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.as-review__fotos img {
	display: block;
	width: 84px;
	height: 84px;
	object-fit: cover;
	border-radius: 14px;
}

.as-review__meta {
	margin: 0;
	font-size: 14px;
	color: var(--as-label);
}

.as-reviews-blok__meer {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.as-reviews-blok__meer > summary {
	align-self: flex-start;
	font-weight: 700;
	font-size: 16px;
	text-decoration: underline;
	cursor: pointer;
	list-style: none;
}

.as-reviews-blok__meer > summary::-webkit-details-marker {
	display: none;
}

.as-reviews-blok__meer[open] > summary {
	display: none;
}

.as-reviews-blok__meer > .as-review + .as-review,
.as-reviews-blok__meer > summary + .as-review {
	margin-top: 16px;
}

/* Reviewformulier */
.as-reviewformulier.is-dicht {
	display: none;
}

.as-reviewformulier form {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 24px;
	border: 2px solid var(--wp--preset--color--inkt);
	border-radius: 24px;
}

.as-reviewformulier h3 {
	margin: 0;
	font-size: 22px;
}

.as-reviewformulier p {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0;
}

.as-reviewformulier label,
.as-sterkeuze legend {
	font-weight: 700;
	font-size: 15px;
}

.as-optioneel,
.as-hulp {
	font-weight: 500;
	font-size: 13px;
	color: var(--wp--preset--color--tekst-gedempt);
}

.as-reviewformulier input[type="text"],
.as-reviewformulier textarea {
	box-sizing: border-box;
	width: 100%;
	padding: 12px 16px;
	border: 2px solid var(--as-veldrand, #e8dce6);
	border-radius: 16px;
	background: var(--wp--preset--color--wit);
	font: inherit;
	color: var(--wp--preset--color--inkt);
}

.as-reviewformulier input[type="text"]:focus,
.as-reviewformulier textarea:focus {
	border-color: var(--wp--preset--color--inkt);
	outline: none;
}

.as-reviewformulier input[type="file"] {
	font: inherit;
	font-size: 14px;
}

.as-sterkeuze {
	margin: 0;
	padding: 0;
	border: 0;
}

.as-sterkeuze legend {
	margin-bottom: 6px;
	padding: 0;
}

/* Sterren van rechts naar links, zodat "alles tot hier" mee kleurt. */
.as-sterkeuze__sterren {
	display: inline-flex;
	flex-direction: row-reverse;
	justify-content: flex-end;
	gap: 4px;
}

.as-sterkeuze__sterren input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

.as-sterkeuze__sterren label {
	display: inline-flex;
	cursor: pointer;
}

.as-sterkeuze__sterren svg {
	fill: var(--wp--preset--color--wit);
	transition: fill 0.1s;
}

.as-sterkeuze__sterren label:hover svg,
.as-sterkeuze__sterren label:hover ~ label svg,
.as-sterkeuze__sterren input:checked ~ label svg {
	fill: var(--wp--preset--color--zon);
}

.as-sterkeuze__sterren input:focus-visible + label {
	outline: 2px dashed var(--wp--preset--color--papaver);
	outline-offset: 2px;
	border-radius: 6px;
}

.as-reviewformulier__knoppen {
	align-items: flex-start;
}

.as-knop-koop {
	display: inline-flex;
	align-items: center;
	min-height: 52px;
	padding: 0 28px;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--papaver);
	color: var(--wp--preset--color--wit);
	font: inherit;
	font-weight: 800;
	font-size: 16px;
	box-shadow: var(--wp--preset--shadow--knop);
	cursor: pointer;
}

.as-knop-koop:hover {
	background: var(--wp--preset--color--papaver-donker);
}

/* ---------------------------------------------------------------------------
 * Productpagina: vaste koopbalk op mobiel (assets/js/winkel.js)
 * ------------------------------------------------------------------------ */

.as-koopbalk {
	display: none;
}

@media (max-width: 700px) {
	.as-koopbalk:not([hidden]) {
		position: fixed;
		inset: auto 0 0;
		z-index: 30;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
		border-top: var(--as-steek);
		background: var(--wp--preset--color--wit);
		box-shadow: 0 -8px 24px rgba(42, 22, 51, 0.08);
	}

	.as-koopbalk__info {
		display: flex;
		flex-direction: column;
		gap: 2px;
		min-width: 0;
		line-height: 1.2;
	}

	.as-koopbalk__prijs {
		font-size: 17px;
	}

	.as-koopbalk__prijs del {
		font-weight: 500;
		font-size: 13px;
		opacity: 0.7;
	}

	.as-koopbalk__prijs ins {
		text-decoration: none;
	}

	.as-koopbalk__levering {
		overflow: hidden;
		font-size: 13px;
		color: var(--wp--preset--color--tekst-zacht);
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.as-koopbalk__knop {
		flex: none;
		height: 52px;
		padding: 0 24px;
		border: 0;
		border-radius: 999px;
		background: var(--wp--preset--color--papaver);
		color: var(--wp--preset--color--wit);
		font: inherit;
		font-weight: 800;
		font-size: 16px;
		cursor: pointer;
	}

	body.as-heeft-koopbalk footer.wp-block-template-part {
		padding-bottom: 84px;
	}
}

/* ---------------------------------------------------------------------------
 * Winkelmand: gratis verzending en "Vergeet je dit niet?" (inc/winkelmand.php)
 * ------------------------------------------------------------------------ */

.as-gratis {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 16px 20px;
	border-radius: 20px;
	background: var(--wp--preset--color--geel);
}

.as-gratis[hidden] {
	display: none;
}

.as-gratis__tekst {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-size: 15px;
	font-weight: 600;
}

.as-gratis__tekst svg {
	flex: none;
}

.as-gratis__balk {
	height: 10px;
	overflow: hidden;
	border-radius: 999px;
	background: var(--wp--preset--color--wit);
}

.as-gratis__balk > span {
	display: block;
	height: 100%;
	border-radius: 999px;
	background: var(--wp--preset--color--papaver);
	transition: width 0.3s ease;
}

.as-gratis.is-gratis {
	background: var(--wp--preset--color--mint);
}

.as-gratis.is-gratis .as-gratis__balk > span {
	background: #1f8a5b;
}

.as-suggesties-blok {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding-block-start: clamp(48px, 6vw, 80px);
}

.as-suggesties-blok[hidden] {
	display: none;
}

.as-suggesties-blok h2 {
	margin: 0;
	font-family: var(--wp--preset--font-family--kop);
	font-size: clamp(26px, 3vw, 36px);
	font-weight: 800;
	letter-spacing: -0.02em;
}

.as-suggesties-blok__lijst {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.as-suggestie {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 14px;
	border: 2px solid var(--wp--preset--color--rand);
	border-radius: 24px;
}

.as-suggestie__foto {
	flex: none;
	width: 84px;
	height: 96px;
	overflow: hidden;
	border-radius: 16px;
	background: var(--wp--preset--color--roze);
}

.as-suggestie__foto img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.as-suggestie__tekst {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.as-suggestie__tekst strong {
	font-size: 16px;
}

.as-suggestie__reden {
	font-size: 14px;
	color: var(--wp--preset--color--tekst-zacht);
}

.as-suggestie__prijs {
	font-size: 15px;
	font-weight: 700;
}

.as-suggestie__knop {
	display: inline-flex;
	flex: none;
	align-items: center;
	min-height: 44px;
	padding: 0 16px;
	border: 2px solid var(--wp--preset--color--inkt);
	border-radius: 999px;
	font-weight: 700;
	font-size: 14px;
	color: var(--wp--preset--color--inkt);
	text-decoration: none;
}

.as-suggestie__knop:hover {
	background: var(--wp--preset--color--inkt);
	color: var(--wp--preset--color--wit);
}

/* ---------------------------------------------------------------------------
 * Cookiemelding (inc/cookies.php)
 * ------------------------------------------------------------------------ */

.as-cookies {
	position: fixed;
	left: 16px;
	bottom: 16px;
	z-index: 90;
	width: min(420px, calc(100% - 32px));
	padding: 22px 20px 18px;
	border-radius: 24px;
	background: var(--wp--preset--color--wit);
	box-shadow: 0 12px 40px rgba(42, 22, 51, 0.22);
	color: var(--wp--preset--color--inkt);
}

.as-cookies[hidden],
.as-cookies__stap[hidden],
.as-cookies-klaar[hidden] {
	display: none;
}

.as-cookies__stap {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.as-cookies__kop {
	display: flex;
	align-items: center;
	gap: 10px;
}

.as-cookies h2 {
	margin: 0;
	font-family: var(--wp--preset--font-family--kop);
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -0.01em;
}

.as-cookies p {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
	color: var(--wp--preset--color--tekst-zacht);
}

.as-cookies p a {
	font-weight: 600;
	color: var(--wp--preset--color--inkt);
}

.as-cookies__knoppen {
	display: flex;
	gap: 8px;
}

.as-cookies__knop {
	flex: 1 1 0;
	min-height: 50px;
	padding: 0 12px;
	border: 2px solid var(--wp--preset--color--inkt);
	border-radius: 999px;
	background: var(--wp--preset--color--wit);
	color: var(--wp--preset--color--inkt);
	font: inherit;
	font-weight: 700;
	font-size: 15px;
	cursor: pointer;
}

.as-cookies__knop--donker {
	background: var(--wp--preset--color--inkt);
	color: var(--wp--preset--color--wit);
}

.as-cookies__link {
	align-self: center;
	min-height: 40px;
	border: 0;
	background: transparent;
	color: var(--wp--preset--color--inkt);
	font: inherit;
	font-weight: 700;
	font-size: 14px;
	text-decoration: underline;
	cursor: pointer;
}

.as-cookies__keuze {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	font-size: 14px;
	line-height: 1.5;
	cursor: pointer;
}

.as-cookies__keuze input {
	flex: none;
	width: 20px;
	height: 20px;
	margin: 1px 0 0;
	accent-color: var(--wp--preset--color--papaver);
}

.as-cookies-klaar {
	position: fixed;
	left: 16px;
	bottom: 16px;
	z-index: 90;
	margin: 0;
	padding: 12px 16px;
	border-radius: 16px;
	background: var(--wp--preset--color--mint);
	color: #14613f;
	font-size: 14px;
	font-weight: 600;
}

@media (max-width: 600px) {
	.as-cookies {
		left: 0;
		bottom: 0;
		width: 100%;
		padding: 22px 18px calc(20px + env(safe-area-inset-bottom));
		border-radius: 24px 24px 0 0;
		box-shadow: 0 -12px 32px rgba(42, 22, 51, 0.18);
	}

	.as-cookies-klaar {
		right: 16px;
		text-align: center;
	}
}