/* Tess Kuiper — merkstijlen bovenop theme.json. Kleuren en letters komen uit de presets. */

:root {
	--tk-inkt: var(--wp--preset--color--inkt, #1F1D1B);
	--tk-linnen: var(--wp--preset--color--linnen, #F5F0E8);
	--tk-steen: var(--wp--preset--color--steen, #DDD6CC);
	--tk-perzik: var(--wp--preset--color--perzik, #F2D2BE);
	--tk-mokka: var(--wp--preset--color--mokka, #B59A85);
	--tk-koraal: var(--wp--preset--color--koraal, #EA6B4F);
	--tk-zacht: var(--wp--preset--color--zacht, #625C57);
	--tk-serif: var(--wp--preset--font-family--serif);
	--tk-sans: var(--wp--preset--font-family--sans);
	--tk-hand: var(--wp--preset--font-family--hand);
	--tk-label: 700 0.75rem/1.3 var(--tk-sans);
}

body { -webkit-font-smoothing: antialiased; }
h1 em, h2 em, h3 em { font-style: italic; }
:where(.wp-site-blocks) :focus-visible { outline: 2px solid #A33A22; outline-offset: 3px; }

/* ---------- Knoppen ---------- */
.wp-block-button__link { display: inline-flex; align-items: center; gap: 0.75rem; transition: background-color .2s, color .2s, border-color .2s; }
.wp-block-button__link::after { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--tk-koraal); flex: none; }
.wp-block-button.is-style-secundair .wp-block-button__link { background: var(--tk-perzik); color: var(--tk-inkt); }
.wp-block-button.is-style-secundair .wp-block-button__link:hover { background: var(--tk-mokka); color: var(--tk-inkt); }
.wp-block-button.is-style-donker .wp-block-button__link { background: var(--tk-inkt); color: var(--tk-linnen); }
.wp-block-button.is-style-donker .wp-block-button__link:hover { background: var(--tk-mokka); color: var(--tk-inkt); }
.wp-block-button.is-style-rand .wp-block-button__link { background: transparent; color: currentColor; box-shadow: inset 0 0 0 1.5px currentColor; }
.wp-block-button.is-style-rand .wp-block-button__link::after { display: none; }
.wp-block-button.is-style-rand .wp-block-button__link:hover { background: var(--tk-inkt); color: var(--tk-linnen); box-shadow: inset 0 0 0 1.5px var(--tk-inkt); }

/* ---------- Blokstijlen ---------- */
.wp-block-image.is-style-boog img,
.wp-block-image.is-style-boog { border-radius: 999px 999px 24px 24px; overflow: hidden; }
.wp-block-image.is-style-boog img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.wp-block-group.is-style-boog { border-radius: 999px 999px 24px 24px; overflow: hidden; }
.wp-block-group.is-style-kaart { border-radius: 32px; }

p.is-style-sticker {
	display: inline-flex; align-items: center; gap: 0.5rem; width: fit-content;
	padding: 0.5rem 1rem; border-radius: 999px; background: var(--tk-perzik); color: var(--tk-inkt);
	font: var(--tk-label); letter-spacing: 0.16em; text-transform: uppercase; transform: rotate(-4deg);
}
p.is-style-sticker::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--tk-koraal); }
p.is-style-handschrift { font-family: var(--tk-hand); font-size: 1.75rem; line-height: 1.2; transform: rotate(-4deg); }
p.is-style-label, .tk-label { font: var(--tk-label); letter-spacing: 0.16em; text-transform: uppercase; color: var(--tk-zacht); }

.wp-block-heading.is-style-krul em,
.tk-krul em {
	padding-bottom: 0.08em;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 20' preserveAspectRatio='none'%3E%3Cpath d='M3 13 C 40 5, 92 3, 132 9 S 182 17, 197 6' fill='none' stroke='%23EA6B4F' stroke-width='3' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") no-repeat 0 100% / 100% 0.28em;
	-webkit-box-decoration-break: clone; box-decoration-break: clone;
}

.wp-block-list.is-style-punten { list-style: none; padding-left: 0; border-top: 1px solid #DED7CC; }
.wp-block-list.is-style-punten li { position: relative; padding: 0.7rem 0 0.7rem 1.4rem; border-bottom: 1px solid #DED7CC; }
.wp-block-list.is-style-punten li::before { content: ""; position: absolute; left: 0; top: 1.3rem; width: 7px; height: 7px; border-radius: 50%; background: var(--tk-koraal); }

/* ---------- Header en footer ---------- */
.tk-header { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.tk-header .wp-block-site-title a { color: var(--tk-inkt); }
.tk-header .wp-block-button__link { padding: 0.9rem 1.4rem; }
.tk-footer { border-radius: 32px 32px 0 0; }
.tk-footer a { color: var(--tk-linnen); }
.tk-footer .tk-label { color: var(--tk-mokka); }
.tk-footer .wp-block-site-title a { color: var(--tk-linnen); }
.tk-footer-onder { border-top: 1px solid #3A3734; color: #ADA7A0; }

/* ---------- Secties ---------- */
.tk-sectie { padding-top: clamp(4rem, 9vw, 7.5rem); }
.tk-sectie > .tk-label:first-child { margin-bottom: 0.75rem; }

/* Hero */
.tk-hero { padding-top: clamp(1.5rem, 4vw, 3rem); padding-bottom: clamp(3rem, 6vw, 4rem); }
.tk-hero h1 { margin-top: 2rem; }
.tk-hero-beeld { position: relative; padding: 2rem 0 1rem; }
.tk-hero-beeld::before {
	content: ""; position: absolute; z-index: 0; right: 0; top: -2%;
	width: 84%; aspect-ratio: 1; border-radius: 50%; background: var(--tk-mokka);
}
.tk-hero-beeld > * { position: relative; z-index: 1; }
.tk-hero-beeld .wp-block-image { width: 78%; margin-left: auto; margin-right: 4%; }
.tk-hero-beeld .tk-notitie { position: absolute; left: 0; top: 0; z-index: 2; margin: 0; }
.tk-hero-beeld .tk-notitie::after {
	content: ""; display: block; width: 90px; height: 60px; margin: 0.25rem 0 0 4.5rem;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 90 60'%3E%3Cpath d='M6 4 C 14 30, 40 46, 80 50 M70 40 L 81 50 L 68 57' fill='none' stroke='%231F1D1B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat;
}
.tk-hero-beeld .tk-stempel-blok { position: absolute; left: 2%; bottom: 14%; z-index: 2; margin: 0; }

/* Stempel */
.tk-stempel { position: relative; width: 150px; height: 150px; }
.tk-stempel svg { display: block; width: 100%; height: 100%; animation: tk-draai 24s linear infinite; }
.tk-stempel svg text { font-family: var(--tk-sans); font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; }
.tk-stempel-midden {
	position: absolute; inset: 0; margin: auto; width: 44px; height: 56px;
	border-radius: 999px 999px 8px 8px; background: var(--tk-perzik);
	display: flex; align-items: center; justify-content: center;
	font-family: var(--tk-serif); font-style: italic; font-size: 1.5rem; color: var(--tk-inkt);
}
@keyframes tk-draai { to { transform: rotate(360deg); } }

/* Lichtkrant */
.tk-lichtkrant { overflow: hidden; border-radius: 999px; background: var(--tk-inkt); color: var(--tk-linnen); }
.tk-lichtkrant-rij { display: flex; flex-wrap: nowrap; width: max-content; gap: 0; animation: tk-loop 32s linear infinite; }
.tk-lichtkrant-rij > p {
	display: inline-flex; align-items: center; gap: 1.75rem; margin: 0; padding: 0 0.9rem;
	font-family: var(--tk-serif); font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 4.25rem; white-space: nowrap;
}
.tk-lichtkrant-rij > p:nth-child(even) { font-style: italic; }
.tk-lichtkrant-rij > p::after { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--tk-koraal); }
@keyframes tk-loop { to { transform: translateX(-50%); } }

/* Diensten: boogkaarten */
.tk-boogkaart { border-radius: 999px 999px 24px 24px; padding: clamp(7rem, 12vw, 9rem) 2.25rem 2.5rem; min-height: 100%; box-sizing: border-box; }
.tk-boogkaart .tk-nummer { font-family: var(--tk-serif); font-style: italic; font-size: 1.5rem; margin: 0; }
.tk-boogkaart h3 { margin-top: 0.4rem; }
.tk-diensten .wp-block-column { display: flex; }
.tk-diensten .wp-block-column > .tk-boogkaart { flex: 1; }

/* Werkwijze */
.tk-stappen { border-top: 1.5px solid var(--tk-inkt); }
.tk-stappen > .wp-block-column { position: relative; padding-top: 2.25rem; }
.tk-stappen > .wp-block-column::before { content: ""; position: absolute; left: 0; top: -9px; width: 16px; height: 16px; border-radius: 50%; background: var(--tk-mokka); }
.tk-stappen > .wp-block-column:first-child::before { background: var(--tk-koraal); }
.tk-stappen > .wp-block-column:last-child::before { background: var(--tk-inkt); }
.tk-stappen p:not(.tk-label) { color: var(--tk-zacht); font-size: 1rem; }
.tk-stappen h3 { margin: 0.4rem 0; }

/* Werk */
.tk-werk .wp-block-image img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.tk-werk .tk-tag, p.tk-tag {
	display: inline-flex; width: fit-content; padding: 0.4rem 1rem; border-radius: 999px; background: var(--tk-perzik);
	font: var(--tk-label); letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 0;
}
.tk-werk h3 { margin: 0.6rem 0 0.2rem; }
.tk-werk h3 + p { color: var(--tk-zacht); font-size: 0.9375rem; margin-top: 0; }

/* Over mij */
.tk-over { border-radius: 32px; }
.tk-over .wp-block-image { max-width: 340px; }
.tk-over .tk-handtekening { font-family: var(--tk-hand); font-size: 2.75rem; line-height: 1; margin-top: 1.5rem; transform: rotate(-5deg); width: fit-content; }
.tk-over .tk-handtekening::after { content: "."; color: var(--tk-koraal); }

/* Tarieven */
.tk-pakket { border-radius: 28px; padding: 2.25rem; height: 100%; box-sizing: border-box; display: flex; flex-direction: column; }
.tk-pakket.has-linnen-background-color { box-shadow: inset 0 0 0 1.5px var(--tk-inkt); }
.tk-pakket .tk-prijs { font-family: var(--tk-serif); font-size: 3.25rem; line-height: 1; margin: 0.5rem 0 0; }
.tk-pakket .wp-block-buttons { margin-top: auto; padding-top: 1rem; }
.tk-pakket .wp-block-list { font-size: 0.9375rem; }
.tk-tarieven .wp-block-column { display: flex; }
.tk-tarieven .wp-block-column > .tk-pakket { flex: 1; }
.tk-populair { font-family: var(--tk-hand); font-size: 1.4rem; margin: 0; transform: rotate(-3deg); }

/* Vragen */
.tk-vragen .wp-block-details { border-top: 1.5px solid var(--tk-inkt); padding: 0.25rem 0; }
.tk-vragen .wp-block-details:last-of-type { border-bottom: 1.5px solid var(--tk-inkt); }
.tk-vragen summary {
	list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem;
	padding: 1.25rem 0; font-family: var(--tk-serif); font-size: clamp(1.4rem, 2.4vw, 1.75rem); line-height: 1.2;
}
.tk-vragen summary::-webkit-details-marker { display: none; }
.tk-vragen summary::after {
	content: "+"; flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--tk-perzik);
	display: flex; align-items: center; justify-content: center; font-family: var(--tk-sans); font-size: 1.4rem; transition: background-color .2s;
}
.tk-vragen details[open] summary::after { content: "−"; background: var(--tk-mokka); }
.tk-vragen details > p { color: var(--tk-zacht); max-width: 680px; margin: 0 0 1.5rem; }

/* Contact */
.tk-contact { position: relative; overflow: hidden; border-radius: 32px; }
.tk-contact::before { content: ""; position: absolute; right: -80px; top: -80px; width: 340px; height: 340px; border-radius: 50%; background: var(--tk-mokka); }
.tk-contact::after { content: ""; position: absolute; right: 120px; bottom: -120px; width: 220px; height: 300px; border-radius: 999px 999px 0 0; background: var(--tk-perzik); }
.tk-contact > * { position: relative; z-index: 1; }
.tk-contact p.is-style-sticker { margin-bottom: 0; }
.tk-contact h2 em { color: var(--tk-perzik); }
.tk-contact p:not(.is-style-sticker) { color: #E3DBD0; }

/* Pagina's */
.tk-paginakop { padding-top: clamp(3rem, 6vw, 5rem); }

/* Mobiel */
@media (max-width: 781px) {
	.tk-hero-beeld { margin-top: 1rem; }
	.tk-hero-beeld .wp-block-image { width: 82%; }
	.tk-stempel { width: 110px; height: 110px; }
	.tk-contact::before { width: 220px; height: 220px; right: -90px; top: -90px; }
	.tk-contact::after { right: -40px; width: 150px; height: 200px; }
	.tk-boogkaart { padding-top: 6rem; }
}

/* Minder beweging */
@media (prefers-reduced-motion: reduce) {
	.tk-stempel svg, .tk-lichtkrant-rij { animation: none; }
}
.tk-boogkaart h3 { font-size: clamp(2rem, 3vw, 2.5rem); }
.tk-contact { padding: clamp(3rem, 7vw, 5rem) clamp(1.5rem, 5vw, 3.5rem) !important; }
.tk-over { padding: clamp(2.5rem, 6vw, 4rem) clamp(1.5rem, 4vw, 3rem); }
.tk-sectie:last-child { padding-bottom: clamp(4rem, 9vw, 7.5rem); }
.wp-site-blocks { overflow-x: clip; } .tk-footer-onder { padding-bottom: 1.5rem; }

/* ---------- Binnenkort-pagina ---------- */
.tk-binnenkort-body { margin: 0; }
.tk-binnenkort-decor { position: relative; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: 6rem 1.5rem; box-sizing: border-box; overflow: hidden; text-align: center; }
.tk-binnenkort-naam { position: absolute; top: 1.75rem; left: 0; right: 0; margin: 0; font-family: var(--tk-serif); font-size: 1.75rem; z-index: 2; }
.tk-binnenkort { position: relative; z-index: 2; }
.tk-binnenkort > * { margin-left: auto !important; margin-right: auto !important; }
.tk-binnenkort h1 { margin-top: 1.75rem; margin-bottom: 1.25rem; }
.tk-binnenkort .tk-punt { color: var(--tk-koraal); }
.tk-binnenkort p:not(.is-style-sticker):not(.tk-handtekening) { color: var(--tk-zacht); max-width: 30rem; }
.tk-binnenkort .wp-block-buttons { margin-top: 2rem; }
.tk-binnenkort .tk-handtekening { font-family: var(--tk-hand); font-size: 2.5rem; line-height: 1; margin-top: 2rem; transform: rotate(-5deg); width: fit-content; }
.tk-bol { position: absolute; z-index: 1; display: block; animation: tk-zweef 9s ease-in-out infinite; }
.tk-bol-mokka { width: clamp(220px, 32vw, 460px); aspect-ratio: 1; border-radius: 50%; background: var(--tk-mokka); right: -8vw; top: -10vw; }
.tk-bol-boog { width: clamp(140px, 18vw, 260px); aspect-ratio: 3 / 4; border-radius: 999px 999px 0 0; background: var(--tk-perzik); left: 6vw; bottom: 0; animation-delay: -3s; }
.tk-bol-koraal { width: 22px; aspect-ratio: 1; border-radius: 50%; background: var(--tk-koraal); left: 22vw; top: 24vh; animation-delay: -5s; }
@keyframes tk-zweef { 50% { transform: translateY(-14px); } }
@media (max-width: 781px) { .tk-bol-boog { left: -30px; } .tk-bol-mokka { right: -120px; top: -120px; } }
@media (prefers-reduced-motion: reduce) { .tk-bol { animation: none; } }

/* ---------- Losse pagina's ---------- */
.tk-kop { padding-top: clamp(2rem, 5vw, 4rem); }
.tk-kop h1 { margin-top: 1rem; margin-bottom: 1.5rem; }
.tk-kop .has-groot-font-size { color: var(--tk-zacht); max-width: 34rem; }
.tk-kop .wp-block-buttons { margin-top: 2rem; }
.tk-kop-vormen { position: relative; min-height: clamp(260px, 30vw, 400px); }
.tk-kop-vormen::before { content: ""; position: absolute; right: 4%; top: 0; width: 72%; aspect-ratio: 1; border-radius: 50%; background: var(--tk-mokka); }
.tk-kop-vormen::after { content: ""; position: absolute; left: 8%; bottom: 0; width: 40%; aspect-ratio: 3 / 4; border-radius: 999px 999px 24px 24px; background: var(--tk-perzik); }
.tk-kop-vormen > p { position: absolute; z-index: 1; left: 0; top: 8%; margin: 0; }
.tk-kop-portret { position: relative; }
.tk-kop-portret::before { content: ""; position: absolute; right: 0; top: -4%; width: 76%; aspect-ratio: 1; border-radius: 50%; background: var(--tk-mokka); }
.tk-kop-portret > * { position: relative; }
.tk-kop-portret .wp-block-image { width: 82%; margin-left: auto; }
.tk-kop-portret .tk-notitie { position: absolute; left: 0; bottom: 12%; margin: 0; z-index: 2; background: var(--tk-linnen); padding: 0.25rem 0.75rem; border-radius: 999px; }

/* Diensten-rijen */
.tk-dienst-beeld { border-radius: 999px 999px 28px 28px; aspect-ratio: 4 / 5; display: flex; flex-direction: column; justify-content: flex-end; padding: 2.5rem; box-sizing: border-box; overflow: hidden; }
.tk-dienst-beeld .tk-nummer { font-family: var(--tk-serif); font-style: italic; font-size: 1.5rem; margin: 0; }
.tk-dienst-beeld .tk-dienst-woord { font-family: var(--tk-serif); font-style: italic; font-size: clamp(3rem, 7vw, 5.5rem); line-height: 0.95; margin: 0.25rem 0 0; }
.tk-dienst h2 { font-size: clamp(2.25rem, 4vw, 3.25rem); margin: 0.5rem 0 1rem; }
.tk-dienst .wp-block-list { margin: 1.5rem 0; max-width: 30rem; }
.tk-dienst .wp-block-columns { gap: clamp(2rem, 6vw, 6rem); }
@media (min-width: 782px) { .tk-dienst.tk-omgekeerd .wp-block-columns { flex-direction: row-reverse; } }

/* Over mij */
.tk-verhaal p:not(.tk-label):not(.tk-handtekening) { font-size: 1.125rem; }
.tk-verhaal .tk-handtekening { font-family: var(--tk-hand); font-size: 2.75rem; line-height: 1; transform: rotate(-5deg); width: fit-content; }
.tk-verhaal .tk-handtekening::after { content: "."; color: var(--tk-koraal); }
.tk-waarden .wp-block-column { display: flex; }
.tk-waarde { flex: 1; padding: 2.25rem; }
.tk-waarde::before { content: ""; display: block; width: 14px; height: 14px; border-radius: 50%; background: var(--tk-koraal); margin-bottom: 1.5rem; }
.tk-waarde h3 { margin: 0 0 0.5rem; }

/* Tarieven-pagina */
.tk-maatwerk { margin-top: clamp(3rem, 6vw, 4.5rem) !important; padding: clamp(2rem, 5vw, 3rem); }
.tk-maatwerk h3 { margin: 0; font-size: clamp(2rem, 3.5vw, 2.75rem); }

/* Contact-pagina */
.tk-contactpagina .wp-block-list { margin: 2rem 0 1.5rem; max-width: 30rem; }
.tk-contactpagina .wp-block-list strong { display: inline-block; min-width: 6.5rem; font: var(--tk-label); letter-spacing: 0.14em; text-transform: uppercase; color: var(--tk-zacht); }
.tk-formulier { padding: clamp(2rem, 4vw, 3rem); box-shadow: 0 30px 60px -30px rgba(31, 29, 27, 0.25); }
.tk-formulier h3 { margin-top: 0.5rem; }
.tk-formulier-plek { color: var(--tk-zacht); font-style: italic; }

@media (max-width: 781px) {
	.tk-kop-vormen { min-height: 240px; margin-top: 1rem; }
	.tk-dienst-beeld { aspect-ratio: 5 / 4; }
}

/* ---------- Beweging en diepte (alleen met JS en zonder "minder beweging") ---------- */
/* Verschijnen bij scrollen */
.tk-beweging .tk-verschijn { opacity: 0; translate: 0 40px; transition: opacity .9s ease var(--tk-wacht, 0ms), translate 1.1s cubic-bezier(.2, .7, .2, 1) var(--tk-wacht, 0ms); }
.tk-beweging .tk-verschijn.tk-zichtbaar { opacity: 1; translate: 0 0; }

/* Hero komt binnen bij laden */
@keyframes tk-in { from { opacity: 0; translate: 0 34px; } }
@keyframes tk-pop { from { opacity: 0; scale: .6; } }
.tk-beweging .tk-hero p.is-style-sticker { animation: tk-pop .7s cubic-bezier(.3, 1.5, .5, 1) .1s backwards; }
.tk-beweging .tk-hero h1 { animation: tk-in 1s cubic-bezier(.2, .7, .2, 1) .15s backwards; }
.tk-beweging .tk-hero h1 ~ p, .tk-beweging .tk-hero .wp-block-buttons { animation: tk-in 1s cubic-bezier(.2, .7, .2, 1) .35s backwards; }
.tk-beweging .tk-hero-beeld .wp-block-image { animation: tk-in 1.2s cubic-bezier(.2, .7, .2, 1) .25s backwards; }
.tk-beweging .tk-hero-beeld .tk-notitie, .tk-beweging .tk-hero-beeld .tk-stempel-blok { animation: tk-pop .8s cubic-bezier(.3, 1.5, .5, 1) .8s backwards; }

/* Krul tekent zichzelf, werkwijze-lijn loopt vol */
.tk-beweging .is-style-krul em { background-size: 0% .28em; transition: background-size 1.3s cubic-bezier(.6, 0, .2, 1) .35s; }
.tk-beweging .is-style-krul.tk-getekend em { background-size: 100% .28em; }
.tk-beweging .tk-stappen { position: relative; border-top-color: transparent; }
.tk-beweging .tk-stappen::after { content: ""; position: absolute; left: 0; right: 0; top: -1.5px; height: 1.5px; background: var(--tk-inkt); transform-origin: left; transform: scaleX(0); transition: transform 1.8s cubic-bezier(.6, 0, .2, 1); }
.tk-beweging .tk-stappen.tk-getekend::after { transform: scaleX(1); }
.tk-beweging .tk-stappen > .wp-block-column::before { z-index: 1; scale: 0; transition: scale .6s cubic-bezier(.3, 1.6, .5, 1); }
.tk-beweging .tk-stappen.tk-getekend > .wp-block-column::before { scale: 1; }
.tk-beweging .tk-stappen > .wp-block-column:nth-child(2)::before { transition-delay: .45s; }
.tk-beweging .tk-stappen > .wp-block-column:nth-child(3)::before { transition-delay: .9s; }
.tk-beweging .tk-stappen > .wp-block-column:nth-child(4)::before { transition-delay: 1.35s; }

/* Diepte: lagen bewegen met de muis (--tk-mx/--tk-my) en met scrollen (--tk-sy) */
.tk-hero-beeld::before { translate: calc(var(--tk-mx, 0) * -46px) calc(var(--tk-my, 0) * -34px + var(--tk-sy, 0) * 60px); }
.tk-hero-beeld .wp-block-image { translate: calc(var(--tk-mx, 0) * 16px) calc(var(--tk-my, 0) * 12px + var(--tk-sy, 0) * -20px); transform: perspective(1000px) rotateY(calc(var(--tk-mx, 0) * 10deg)) rotateX(calc(var(--tk-my, 0) * -8deg)); filter: drop-shadow(calc(var(--tk-mx, 0) * -40px) 30px 40px rgba(31, 29, 27, .18)); }
.tk-hero-beeld .tk-notitie { translate: calc(var(--tk-mx, 0) * 60px) calc(var(--tk-my, 0) * 44px + var(--tk-sy, 0) * -50px); }
.tk-hero-beeld .tk-stempel-blok { translate: calc(var(--tk-mx, 0) * 84px) calc(var(--tk-my, 0) * 60px + var(--tk-sy, 0) * -90px); }
.tk-hero-beeld .tk-stempel { rotate: calc(var(--tk-sy, 0) * 120deg); }
.tk-hero h1 { translate: calc(var(--tk-mx, 0) * -10px) calc(var(--tk-my, 0) * -6px); }
.tk-kop-vormen::before { translate: calc(var(--tk-mx, 0) * -40px) calc(var(--tk-my, 0) * -30px + var(--tk-sy, 0) * 70px); }
.tk-kop-vormen::after { translate: calc(var(--tk-mx, 0) * 34px) calc(var(--tk-my, 0) * 24px + var(--tk-sy, 0) * -40px); }
.tk-kop-vormen > p { translate: calc(var(--tk-mx, 0) * 60px) calc(var(--tk-my, 0) * 40px); }
.tk-kop-portret::before { translate: calc(var(--tk-mx, 0) * -40px) calc(var(--tk-my, 0) * -30px + var(--tk-sy, 0) * 60px); }
.tk-kop-portret .wp-block-image { transform: perspective(1000px) rotateY(calc(var(--tk-mx, 0) * 10deg)) rotateX(calc(var(--tk-my, 0) * -8deg)); filter: drop-shadow(calc(var(--tk-mx, 0) * -40px) 30px 40px rgba(31, 29, 27, .18)); }
.tk-kop-portret .tk-notitie { translate: calc(var(--tk-mx, 0) * 60px) calc(var(--tk-my, 0) * 44px); }
.tk-contact::before { translate: calc(var(--tk-mx, 0) * -50px) calc(var(--tk-my, 0) * -36px + var(--tk-sy, 0) * 80px); }
.tk-contact::after { translate: calc(var(--tk-mx, 0) * 40px) calc(var(--tk-sy, 0) * -60px); }
.tk-over .wp-block-image { transform: perspective(1000px) rotateY(calc(var(--tk-mx, 0) * 10deg)) rotateX(calc(var(--tk-my, 0) * -8deg)); }
.tk-over .is-style-handschrift { translate: calc(var(--tk-mx, 0) * 40px) calc(var(--tk-my, 0) * 30px); }
.tk-dienst-woord { translate: 0 calc(var(--tk-sy, 0) * 50px); }
.tk-dienst-beeld .tk-nummer { translate: 0 calc(var(--tk-sy, 0) * 80px); }
.tk-binnenkort-decor .tk-bol-mokka { translate: calc(var(--tk-mx, 0) * -50px) calc(var(--tk-my, 0) * -40px); }
.tk-binnenkort-decor .tk-bol-boog { translate: calc(var(--tk-mx, 0) * 40px) calc(var(--tk-my, 0) * 30px); }
.tk-binnenkort-decor .tk-bol-koraal { translate: calc(var(--tk-mx, 0) * 90px) calc(var(--tk-my, 0) * 70px); }
.tk-binnenkort-decor .tk-binnenkort h1 { translate: calc(var(--tk-mx, 0) * -12px) calc(var(--tk-my, 0) * -8px); }

/* Lichtkrant buigt mee met de scrollsnelheid */
.tk-lichtkrant-rij > p { transform: skewX(calc(var(--tk-snelheid, 0) * -14deg)); transition: transform .2s; }

/* 3D-kanteling van kaarten */
.tk-kantel { position: relative; transform: perspective(1100px) rotateX(var(--tk-rx, 0deg)) rotateY(var(--tk-ry, 0deg)) translateY(var(--tk-lift, 0px)); transition: transform .7s cubic-bezier(.2, .7, .2, 1), box-shadow .7s; will-change: transform; }
.tk-kantel.tk-actief { --tk-lift: -8px; transition-duration: .15s, .4s; box-shadow: 0 34px 60px -30px rgba(31, 29, 27, .4); }
.tk-kantel::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(circle at var(--tk-gx, 50%) var(--tk-gy, 50%), rgba(255, 255, 255, .38), transparent 50%); opacity: 0; transition: opacity .4s; }
.tk-kantel.tk-actief::after { opacity: 1; }
.tk-werk .wp-block-image.tk-kantel { border-radius: 24px; }
.tk-pakket.has-linnen-background-color.tk-actief { box-shadow: inset 0 0 0 1.5px var(--tk-inkt), 0 34px 60px -30px rgba(31, 29, 27, .4); }

/* Knoppen: magnetisch */
.wp-block-button__link { transition: background-color .2s, color .2s, border-color .2s, translate .35s cubic-bezier(.2, .7, .2, 1); }

/* "meest gekozen!" wiebelt */
@keyframes tk-wiebel { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg) translateY(-3px); } }
.tk-beweging .tk-populair { animation: tk-wiebel 2.8s ease-in-out infinite; }

/* Cursorstip */
.tk-cursor { position: fixed; left: 0; top: 0; z-index: 9999; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: var(--tk-koraal); pointer-events: none; mix-blend-mode: multiply; transition: width .35s cubic-bezier(.2, .7, .2, 1), height .35s cubic-bezier(.2, .7, .2, 1), margin .35s cubic-bezier(.2, .7, .2, 1), opacity .3s; }
.tk-cursor.tk-cursor-groot { width: 58px; height: 58px; margin: -29px 0 0 -29px; opacity: .35; }

@media (prefers-reduced-motion: reduce) {
	.tk-populair, .tk-bol { animation: none !important; }
	.tk-kantel { transform: none !important; }
}

/* ---------- Contactformulier (Contact Form 7) ---------- */
.wpcf7 form { display: grid; gap: 1.1rem; margin-top: 1.5rem; }
.wpcf7 form > p { margin: 0; }
.wpcf7 label, .wpcf7 .tk-veld-label { display: block; font: var(--tk-label); letter-spacing: 0.14em; text-transform: uppercase; color: var(--tk-zacht); }
.wpcf7 .wpcf7-form-control-wrap { display: block; margin-top: 0.5rem; }
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 textarea {
	width: 100%; box-sizing: border-box; padding: 0.95rem 1.2rem; border: 1.5px solid var(--tk-steen); border-radius: 18px;
	background: var(--tk-linnen); color: var(--tk-inkt); font: 400 1rem/1.5 var(--tk-sans); letter-spacing: 0; text-transform: none;
	transition: border-color .2s, background-color .2s, box-shadow .2s;
}
.wpcf7 textarea { height: 10rem; min-height: 7rem; resize: vertical; border-radius: 22px; }
.wpcf7 input:focus, .wpcf7 textarea:focus { outline: none; border-color: var(--tk-mokka); background: #fff; box-shadow: 0 0 0 4px rgba(181, 154, 133, 0.25); }
.wpcf7 .tk-keuzes .wpcf7-checkbox { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.6rem; }
.wpcf7 .tk-keuzes .wpcf7-list-item { margin: 0; }
.wpcf7 .tk-keuzes .wpcf7-list-item label { display: inline-flex; align-items: center; cursor: pointer; }
.wpcf7 .tk-keuzes input[type="checkbox"] { position: absolute; opacity: 0; pointer-events: none; }
.wpcf7 .tk-keuzes .wpcf7-list-item-label { padding: 0.55rem 1.1rem; border-radius: 999px; background: var(--tk-linnen); box-shadow: inset 0 0 0 1.5px var(--tk-steen); color: var(--tk-inkt); font: 700 0.75rem/1 var(--tk-sans); letter-spacing: 0.12em; transition: background-color .2s, box-shadow .2s; }
.wpcf7 .tk-keuzes input:checked + .wpcf7-list-item-label { background: var(--tk-perzik); box-shadow: inset 0 0 0 1.5px var(--tk-mokka); }
.wpcf7 .tk-keuzes input:focus-visible + .wpcf7-list-item-label { outline: 2px solid #A33A22; outline-offset: 2px; }
.wpcf7 .wpcf7-acceptance { font: 400 0.875rem/1.5 var(--tk-sans); letter-spacing: 0; text-transform: none; color: var(--tk-zacht); }
.wpcf7 .wpcf7-acceptance label { display: flex; gap: 0.6rem; align-items: flex-start; font: inherit; letter-spacing: 0; text-transform: none; }
.wpcf7 .wpcf7-acceptance input { accent-color: var(--tk-mokka); margin-top: 0.2rem; }
.wpcf7 input[type="submit"] {
	justify-self: start; border: 0; cursor: pointer; padding: 1.15rem 2rem; border-radius: 999px; background: var(--tk-mokka); color: var(--tk-inkt);
	font: 700 0.75rem/1 var(--tk-sans); letter-spacing: 0.16em; text-transform: uppercase; transition: background-color .2s, color .2s;
}
.wpcf7 input[type="submit"]:hover { background: var(--tk-inkt); color: var(--tk-linnen); }
.wpcf7 input[type="submit"]:disabled { opacity: .5; cursor: not-allowed; }
.wpcf7 .wpcf7-spinner { margin: 0 0 0 0.75rem; vertical-align: middle; }
.wpcf7 .wpcf7-not-valid-tip { margin-top: 0.4rem; color: #A33A22; font: 400 0.8125rem/1.4 var(--tk-sans); letter-spacing: 0; text-transform: none; }
.wpcf7 .wpcf7-not-valid { border-color: #A33A22 !important; }
.wpcf7 form .wpcf7-response-output { margin: 0.5rem 0 0; padding: 1rem 1.25rem; border-radius: 18px; border: 0; background: var(--tk-linnen); font-size: 0.9375rem; }
.wpcf7 form.sent .wpcf7-response-output { background: var(--tk-perzik); }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.spam .wpcf7-response-output { background: #F6DCD4; color: #7A2A18; }

/* ---------- Uitgebreide secties ---------- */
.tk-intro { max-width: 40rem; color: var(--tk-zacht); font-size: 1.125rem; }
p.tk-meer { margin-top: 1.25rem; }
p.tk-meer a { font: var(--tk-label); letter-spacing: 0.16em; text-transform: uppercase; text-decoration: none; color: var(--tk-inkt); display: inline-flex; align-items: center; gap: 0.6rem; }
p.tk-meer a::after { content: ""; width: 28px; height: 1.5px; background: currentColor; transition: width .3s; }
p.tk-meer a:hover::after { width: 44px; }

/* Voor wie */
.tk-profielen .wp-block-column { display: flex; }
.tk-profiel { flex: 1; padding: 2.25rem; }
.tk-profiel .tk-profiel-nr { font-family: var(--tk-serif); font-style: italic; font-size: 3rem; line-height: 1; margin: 0 0 1.25rem; }
.tk-profiel h3 { margin: 0 0 0.6rem; }

/* Waarom bij mij */
.tk-vergelijk .wp-block-column { display: flex; }
.tk-optie { flex: 1; border-radius: 28px; padding: 2.25rem; }
.tk-optie-licht { box-shadow: inset 0 0 0 1.5px var(--tk-steen); color: var(--tk-zacht); }
.tk-optie-licht h3 { color: var(--tk-inkt); }
.tk-optie-tess { padding: 2.75rem 2.25rem; }
.tk-optie-tess p.is-style-sticker { background: var(--tk-linnen); margin: 0 0 1rem; }
.tk-optie h3 { margin: 0 0 1rem; }
.tk-optie .wp-block-list.is-style-punten { border-top-color: rgba(31, 29, 27, .15); margin: 0; }
.tk-optie .wp-block-list.is-style-punten li { border-bottom-color: rgba(31, 29, 27, .15); }
.tk-optie-licht .wp-block-list.is-style-punten li::before { background: var(--tk-steen); }
@media (min-width: 782px) { .tk-optie-tess { transform: scale(1.04); } }

/* Wat je krijgt */
.tk-krijg { margin-bottom: 0 !important; }
.tk-krijg + .tk-krijg { margin-top: 0 !important; }
.tk-krijg .wp-block-column { display: flex; }
.tk-krijg-item { flex: 1; padding: 1.75rem 0 1.5rem; border-top: 1.5px solid var(--tk-inkt); }
.tk-krijg-item h3 { font-size: clamp(1.6rem, 2.4vw, 2rem); margin: 0 0 0.5rem; display: flex; align-items: center; gap: 0.75rem; }
.tk-krijg-item h3::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--tk-koraal); flex: none; }
.tk-krijg-item p { color: var(--tk-zacht); margin: 0; }

/* Vragen-pagina */
.tk-vragengroep h3 { margin: 0.25rem 0 1rem; }
.tk-vragengroep + .tk-vragengroep { padding-top: clamp(2.5rem, 5vw, 4rem); }
.tk-vragen > .wp-block-buttons { margin-top: 2rem; }

/* ---------- Uitklapmenu ---------- */
.tk-header .wp-block-navigation .wp-block-navigation__submenu-container {
	min-width: 220px !important; padding: 0.6rem; border: 0 !important; border-radius: 22px; background: var(--tk-linnen) !important;
	box-shadow: 0 24px 50px -20px rgba(31, 29, 27, .35), inset 0 0 0 1.5px var(--tk-steen); top: calc(100% + 0.6rem); left: 50% !important; transform: translateX(-50%);
}
.tk-header .wp-block-navigation .wp-block-navigation__submenu-container::before { content: ""; position: absolute; left: 0; right: 0; top: -0.8rem; height: 0.8rem; }
.tk-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 0.75rem 1rem; border-radius: 14px; display: flex; align-items: center; gap: 0.6rem; transition: background-color .2s; }
.tk-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--tk-perzik); }
.tk-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--tk-mokka); flex: none; }
.tk-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item:first-child .wp-block-navigation-item__content::before { background: var(--tk-koraal); }
.tk-header .wp-block-navigation-submenu__toggle { margin-left: 0.25rem; }
.tk-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container { box-shadow: none; background: transparent !important; transform: none; padding: 0.25rem 0 0 1rem; }
.tk-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content::before { display: none; }
.tk-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--tk-linnen) !important; color: var(--tk-inkt) !important; padding: 1.5rem 1.5rem 3rem; }
.tk-header .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { font-family: var(--tk-serif); font-size: 2.5rem; font-weight: 400; letter-spacing: -0.01em; text-transform: none; line-height: 1.1; }
.tk-header .is-menu-open .wp-block-navigation__container { gap: 1.25rem !important; }
.tk-header .is-menu-open .wp-block-navigation__submenu-container { gap: 0.6rem !important; padding: 0.6rem 0 0.4rem !important; }
.tk-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 0 !important; color: var(--tk-zacht); }