/*
Theme Name: 3D Dingen
Description: Eigen thema voor 3D Dingen (child theme).
Template: twentytwentyfive
Version: 1.10.1
Text Domain: drie-d-dingen
*/

:root {
	--td-orange: #780116;
	--td-orange-dark: #5a0010;
	--td-ink: #1c1b1a;
	--td-ink-2: #2b2a28;
	--td-paper: #ffffff;
	--td-sand: #f6f3f1;
	--td-tint: #f7e8eb;
	--td-muted: #6b6862;
	--td-line: #e7e1dd;
	--td-on-dark: #cfc9c0;
	--td-radius: 14px;
	--td-max: 1180px;
	--td-heading: var(--wp--preset--font-family--heading, "Source Serif 4", Georgia, serif);
	--td-body: var(--wp--preset--font-family--body, "DM Sans", system-ui, sans-serif);
	--td-layers: repeating-linear-gradient(0deg, rgba(255,255,255,.035) 0 1px, transparent 1px 7px);
}

body { background: var(--td-paper); color: var(--td-ink); font-family: var(--td-body); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { font-family: var(--td-heading); letter-spacing: -0.01em; line-height: 1.15; font-weight: 600; }
.wp-site-blocks > * { margin-block-start: 0; }
.wp-site-blocks { padding: 0; }

/* Structuur */
.td-wrap { max-width: var(--td-max); margin-inline: auto !important; padding-inline: clamp(1.25rem, 4vw, 2.5rem); box-sizing: border-box; width: 100%; }
.td-front .wp-block-post-content > *,
.td-header .td-wrap > *, .td-hero .td-wrap > *, .td-grid > *, .td-steps > *,
.td-cta > *, .td-footer-grid > *, .td-contact > *, .td-strip .td-wrap > * { margin: 0; }
.td-section { padding-block: clamp(4rem, 8vw, 6.5rem); }

/* Header */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: 0; z-index: 50; }
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) { .admin-bar .wp-site-blocks > header.wp-block-template-part { top: 0; } }
.td-header { position: relative; background: transparent; border-bottom: 1px solid var(--td-line); }
/* Wazige achtergrond via ::before, zodat het mobiele menu niet in de header wordt opgesloten */
.td-header::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(255,255,255,.92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.td-header .td-wrap { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding-block: .9rem; }
.td-logo a { display: inline-flex; align-items: center; gap: .6rem; font-family: var(--td-heading); font-weight: 700; font-size: 1.25rem; letter-spacing: -0.02em; color: var(--td-ink); text-decoration: none; white-space: nowrap; }
.td-logo img { width: 52px; height: 52px; flex: none; display: block; }
.td-header .td-wrap { padding-block: .6rem; }
.td-header-right { display: flex !important; align-items: center; gap: 1.25rem; }
.td-header-right > * { margin: 0 !important; }
.td-header .wp-block-navigation { font-weight: 500; font-size: .98rem; gap: 1.75rem; }
.td-header .wp-block-navigation a { color: var(--td-ink); text-decoration: none; transition: color .2s; }
.td-header .wp-block-navigation a:hover { color: var(--td-orange); }
.td-header .wc-block-mini-cart__button, .td-header .wc-block-customer-account a { color: var(--td-ink); }

/* Knoppen */
.wp-block-button__link { border-radius: 6px; padding: .85rem 1.6rem; font-weight: 600; font-size: 1rem; transition: background-color .2s, color .2s, border-color .2s, transform .2s; }
.wp-block-button__link:hover { transform: translateY(-1px); }
.td-btn-primary .wp-block-button__link { background: var(--td-orange); color: #fff; border: 2px solid var(--td-orange); }
.td-btn-primary .wp-block-button__link:hover { background: var(--td-orange-dark); border-color: var(--td-orange-dark); color: #fff; }
.td-btn-ghost .wp-block-button__link { background: transparent; color: inherit; border: 2px solid currentColor; }
.td-btn-ghost .wp-block-button__link:hover { background: currentColor; }
.td-hero .td-btn-ghost .wp-block-button__link { color: var(--td-ink); }
.td-hero .td-btn-ghost .wp-block-button__link:hover { background: var(--td-ink); color: #fff; border-color: var(--td-ink); }
.td-cta .td-btn-ghost .wp-block-button__link:hover { background: #fff; color: var(--td-orange); border-color: #fff; }
.td-cta .td-btn-ghost .wp-block-button__link { color: #fff; }
.wp-block-buttons { gap: .75rem; }

/* Kleine labels */
.td-kicker { display: inline-flex; align-items: center; gap: .6rem; font-size: .78rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--td-orange); margin: 0; }
.td-kicker::before { content: ""; width: 22px; height: 2px; background: currentColor; }

/* Hero */
.td-hero { position: relative; background: linear-gradient(180deg, #ffffff 0%, #f8f4f2 100%); color: var(--td-ink); overflow: hidden; padding-block: clamp(4rem, 9vw, 7rem); border-bottom: 1px solid var(--td-line); }
.td-hero::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, rgba(120,1,22,.035) 0 1px, transparent 1px 8px); pointer-events: none; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 60%); mask-image: linear-gradient(90deg, transparent 0%, #000 60%); }
.td-hero .td-wrap { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; gap: 3rem; align-items: center; }
.td-hero-title { font-size: clamp(2.6rem, 6vw, 4.4rem); line-height: 1.05; color: var(--td-ink); margin: 1.1rem 0 1.25rem; font-weight: 600; }
.td-hero-title em { font-style: italic; color: var(--td-orange); }
.td-lead { font-size: 1.15rem; line-height: 1.65; color: var(--td-muted); max-width: 34rem; margin: 0 0 2rem; }
.td-hero-art { display: flex; justify-content: center; }
.td-cube { width: 100%; max-width: 420px; height: auto; display: block; }

/* Strook */
.td-strip { background: var(--td-orange); color: #fff; }
.td-strip .td-wrap { padding-block: 1rem; }
.td-strip-text { text-align: center; font-weight: 600; font-size: .98rem; margin: 0; }
.td-strip-text span { opacity: .6; margin-inline: .9rem; }

/* Sectiekoppen */
.td-h2 { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.08; margin: .9rem 0 1rem; max-width: 20ch; }
.td-intro { color: var(--td-muted); font-size: 1.1rem; max-width: 40rem; margin: 0; }

/* Dienstenkaarten */
.td-grid { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.25rem; margin-top: 2.75rem !important; }
.td-card { background: #fff; border: 1px solid var(--td-line); border-radius: var(--td-radius); padding: 1.75rem; transition: transform .25s, box-shadow .25s, border-color .25s; }
.td-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -22px rgba(28,27,26,.4); border-color: var(--td-orange); }
.td-num { font-family: var(--td-heading); font-weight: 700; color: var(--td-orange); font-size: .95rem; letter-spacing: .08em; margin: 0; }
.td-card h3 { font-size: 1.3rem; margin: 1.6rem 0 .5rem; }
.td-card p:not(.td-num) { color: var(--td-muted); margin: 0; line-height: 1.6; }

/* Werkwijze */
.td-steps-section { background: var(--td-sand); }
.td-steps { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: 2.75rem !important; }
.td-step { border-top: 3px solid var(--td-ink); padding-top: 1.4rem; }
.td-step:first-child { border-color: var(--td-orange); }
.td-step h3 { font-size: 1.25rem; margin: .8rem 0 .5rem; }
.td-step p:not(.td-num) { color: var(--td-muted); margin: 0; line-height: 1.6; }

/* Call to action */
.td-cta { position: relative; overflow: hidden; background: var(--td-orange); color: #fff; border-radius: 24px; padding: clamp(2.5rem, 5vw, 4rem); display: grid !important; grid-template-columns: 1fr auto; gap: 2rem; align-items: center; }
.td-cta::before { content: ""; position: absolute; inset: 0; background: var(--td-layers); pointer-events: none; }
.td-cta::after { content: ""; position: absolute; width: 320px; height: 320px; right: -80px; top: -120px; background: radial-gradient(circle, rgba(255,255,255,.18), transparent 70%); pointer-events: none; }
.td-cta > * { position: relative; z-index: 1; }
.td-cta h2 { color: #fff; font-size: clamp(1.8rem, 3.5vw, 2.6rem); margin: 0 0 .6rem; }
.td-cta p { color: rgba(255,255,255,.82); margin: 0; font-size: 1.08rem; }

/* Pagina's */
.td-page-hero { position: relative; background: var(--td-ink); padding-block: clamp(3rem, 6vw, 4.5rem); overflow: hidden; }
.td-page-hero::before { content: ""; position: absolute; inset: 0; background: var(--td-layers); pointer-events: none; }
.td-page-hero .td-wrap { position: relative; }
.td-page-title { color: #fff; font-size: clamp(2.2rem, 5vw, 3.5rem); margin: 0; }
.td-page-body { padding-block: clamp(3rem, 6vw, 5rem); }

/* Contact */
.td-contact { display: grid !important; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.td-contact-card { background: #fff; border: 1px solid var(--td-line); border-radius: var(--td-radius); padding: 2rem; }
.td-contact-card.is-dark { background: var(--td-ink); color: var(--td-on-dark); border-color: var(--td-ink); }
.td-contact-card.is-dark h3 { color: #fff; }
.td-contact-card h3 { font-size: 1.4rem; margin: .8rem 0 1rem; }
.td-contact-card p { margin: 0 0 .9rem; line-height: 1.6; }
.td-contact-card a { color: var(--td-orange); }

/* Footer */
.td-footer { background: var(--td-ink); color: var(--td-on-dark); padding-block: 4rem 2rem; font-size: .95rem; }
.td-footer-grid { display: grid !important; grid-template-columns: 1.4fr 1fr 1fr; gap: 2.5rem; }
.td-footer h4 { color: #fff; font-size: 1rem; margin: 0 0 1rem; letter-spacing: 0; }
.td-footer p { margin: 0 0 .5rem; line-height: 1.7; }
.td-footer a { color: var(--td-on-dark); text-decoration: none; }

.td-footer .td-logo a { color: #fff; margin-bottom: 1rem; }
.td-footer-bottom { border-top: 1px solid rgba(255,255,255,.1); margin-top: 3rem !important; padding-top: 1.5rem; font-size: .85rem; }
.td-footer-bottom p { margin: 0; }

/* WooCommerce */
.wc-block-components-product-price, .woocommerce-Price-amount { font-weight: 600; }
.wc-block-components-product-sale-badge, .onsale { background: var(--td-orange) !important; color: #fff !important; border: 0 !important; }

/* Mobiel */
@media (max-width: 900px) {
	.td-hero .td-wrap, .td-cta, .td-contact, .td-footer-grid { grid-template-columns: 1fr; }
	.td-steps { grid-template-columns: 1fr; }
	.td-hero-art { order: -1; }
	.td-cube { max-width: 260px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

.td-cta .td-btn-primary .wp-block-button__link { background: #fff; color: var(--td-orange); border-color: #fff; }
.td-cta .td-btn-primary .wp-block-button__link:hover { background: var(--td-tint); border-color: var(--td-tint); color: var(--td-orange-dark); }
.td-footer .td-logo img { width: 56px; height: 56px; background: #fff; border-radius: 12px; padding: 6px; box-sizing: border-box; }
.td-footer a:hover { color: #e9a3b0; }
.td-contact-card a { color: var(--td-orange); font-weight: 600; }
.td-contact-card.is-dark a { color: #e9a3b0; }
.td-strip-text { letter-spacing: .01em; }

/* Contactformulier */
.td-contact { grid-template-columns: 1fr 1.5fr; align-items: start; }
.td-form { display: grid; gap: 1rem; margin-top: .5rem; }
.td-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.td-form label { display: grid; gap: .35rem; font-weight: 600; font-size: .92rem; color: var(--td-ink); }
.td-form input[type=text], .td-form input[type=email], .td-form input[type=tel], .td-form select, .td-form textarea {
	font: inherit; font-weight: 400; font-size: 1rem; color: var(--td-ink); background: #fff; border: 1px solid var(--td-line); border-radius: 6px; padding: .75rem .9rem; width: 100%; box-sizing: border-box; transition: border-color .2s, box-shadow .2s; }
.td-form input:focus, .td-form select:focus, .td-form textarea:focus { outline: none; border-color: var(--td-orange); box-shadow: 0 0 0 3px rgba(120,1,22,.12); }
.td-form textarea { resize: vertical; min-height: 140px; }
.td-form .td-check { display: flex; gap: .6rem; align-items: flex-start; font-weight: 400; color: var(--td-muted); }
.td-form .td-check input { margin-top: .3rem; accent-color: var(--td-orange); }
.td-form button.wp-block-button__link { cursor: pointer; font: inherit; font-weight: 600; }
.td-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.td-form-msg { border-radius: 8px; padding: 1rem 1.2rem; margin-bottom: 1rem; }
.td-form-msg.is-ok { background: #e8f5ec; color: #14532d; border: 1px solid #b7dfc4; }
.td-form-msg.is-err { background: var(--td-tint); color: var(--td-orange-dark); border: 1px solid #e9b8c1; }
@media (max-width: 640px) { .td-form-row { grid-template-columns: 1fr; } }

/* WhatsApp-knop */
.td-wa { position: fixed; right: 20px; bottom: 20px; z-index: 99; display: flex; align-items: center; gap: .6rem; text-decoration: none; }
.td-wa-icon { width: 58px; height: 58px; border-radius: 50%; background: #1fa855; display: grid; place-items: center; box-shadow: 0 10px 25px -8px rgba(0,0,0,.45); transition: transform .2s; }
.td-wa:hover .td-wa-icon { transform: scale(1.06); }
.td-wa-label { background: #fff; color: var(--td-ink); font-weight: 600; font-size: .9rem; padding: .5rem .85rem; border-radius: 999px; box-shadow: 0 6px 18px -8px rgba(0,0,0,.35); opacity: 0; transform: translateX(8px); transition: opacity .2s, transform .2s; pointer-events: none; }
.td-wa:hover .td-wa-label, .td-wa:focus .td-wa-label { opacity: 1; transform: none; }
@media (max-width: 640px) { .td-wa-label { display: none; } .td-wa-icon { width: 52px; height: 52px; } }

/* Klikbare dienstkaarten */
.td-card-link { position: relative; display: flex; flex-direction: column; }
.td-card-link .td-more { margin-top: auto !important; padding-top: 1.2rem; font-weight: 600; font-size: .95rem; }
.td-card-link .td-more a { color: var(--td-orange); text-decoration: none; }
.td-card-link .td-more a::after { content: ""; position: absolute; inset: 0; border-radius: var(--td-radius); }
.td-card-link .td-more span { display: inline-block; transition: transform .2s; }
.td-card-link:hover .td-more span { transform: translateX(4px); }
.td-card-link:has(:focus-visible) { outline: 2px solid var(--td-orange); outline-offset: 3px; }

/* Dienstpagina's */
.td-page-body .wp-block-post-content > .alignwide { max-width: var(--td-max); margin-inline: auto; }
.td-service-lead { font-size: clamp(1.15rem, 2vw, 1.35rem); line-height: 1.6; color: var(--td-ink); max-width: 46rem; margin: 0 0 1rem !important; }
.td-service-block { margin-top: clamp(3rem, 6vw, 4.5rem) !important; }
.td-service-block .td-h2 { margin-top: .6rem; }
.td-service-block .td-grid { margin-top: 1.75rem !important; }
.td-service-block .td-card h3 { margin-top: 0; }
.td-service-block .td-steps { margin-top: 1.75rem !important; }
.td-tips { background: var(--td-sand); border-radius: var(--td-radius); padding: clamp(1.5rem, 4vw, 2.5rem); }
.td-tiplist { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .8rem; }
.td-tiplist li { position: relative; padding-left: 1.8rem; line-height: 1.6; }
.td-tiplist li::before { content: ""; position: absolute; left: 0; top: .55em; width: .7rem; height: .7rem; border-radius: 2px; background: var(--td-orange); transform: rotate(45deg); }
.td-page-body .td-cta { margin-top: clamp(3rem, 6vw, 4.5rem) !important; }
.td-other { margin-top: 2.5rem !important; color: var(--td-muted); font-size: .95rem; }
.td-other a { color: var(--td-orange); font-weight: 600; text-decoration: none; margin-left: .9rem; }
.td-other a:hover { text-decoration: underline; }
.td-grid-4 { margin-top: 2rem !important; }
.td-page-body .wp-block-post-content > .td-other { max-width: var(--td-max); }

/* Foto's */
.wp-block-image img { display: block; max-width: 100%; height: auto; }
.td-hero-photo { margin: 0; }
.td-hero-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 18px; box-shadow: 0 30px 60px -30px rgba(28,27,26,.45); }
.td-card-img { margin: -1.75rem -1.75rem 1.4rem !important; overflow: hidden; border-radius: var(--td-radius) var(--td-radius) 0 0; }
.td-card-img img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .4s ease; }
.td-card-link:hover .td-card-img img { transform: scale(1.04); }
.td-service-photo { margin-top: 2rem !important; }
.td-service-photo img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; border-radius: 18px; }
.td-contact-photo { margin: 1.5rem 0 0 !important; }
.td-contact-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 10px; }
@media (max-width: 900px) { .td-service-photo img { aspect-ratio: 16 / 10; } }
.td-grid-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 1rem !important; }
.td-grid-5 .td-card { padding: 1.4rem; }
.td-grid-5 .td-card-img { margin: -1.4rem -1.4rem 1.1rem !important; }
.td-grid-5 .td-card h3 { font-size: 1.15rem; hyphens: auto; }
.td-grid-5 .td-card p:not(.td-num):not(.td-more) { font-size: .93rem; }
@media (max-width: 1100px) {
	.td-grid-5 { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
	.td-grid-5 > * { grid-column: span 2; }
	.td-grid-5 > *:nth-child(4), .td-grid-5 > *:nth-child(5) { grid-column: span 3; }
}
@media (max-width: 700px) {
	.td-grid-5 { grid-template-columns: 1fr !important; }
	.td-grid-5 > * { grid-column: auto !important; }
}

/* Offerte / 3D-upload */
.td-off [hidden] { display: none !important; }
.td-off-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 2rem; align-items: start; }
.td-drop { position: relative; display: grid; place-items: center; text-align: center; gap: .4rem; min-height: 360px; padding: 2rem; border: 2px dashed #d9cfc9; border-radius: 16px; background: var(--td-sand); cursor: pointer; transition: border-color .2s, background .2s; }
.td-drop:hover, .td-drop.is-over { border-color: var(--td-orange); background: var(--td-tint); }
.td-drop input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.td-drop-icon { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: var(--td-orange); color: #fff; font-size: 1.6rem; margin-bottom: .4rem; }
.td-drop-title { font-family: var(--td-heading); font-weight: 600; font-size: 1.3rem; color: var(--td-ink); }
.td-drop-sub { color: var(--td-muted); font-size: .92rem; }
.td-viewer { position: relative; border-radius: 16px; overflow: hidden; background: radial-gradient(circle at 50% 35%, #ffffff, #efe9e4); border: 1px solid var(--td-line); }
.td-viewer-canvas { width: 100%; height: 420px; }
.td-viewer-canvas canvas { display: block; cursor: grab; }
.td-viewer-hint { position: absolute; left: 1rem; bottom: .6rem; margin: 0; font-size: .8rem; color: var(--td-muted); }
.td-viewer-reset { position: absolute; top: .8rem; right: .8rem; font: inherit; font-size: .85rem; font-weight: 600; background: #fff; color: var(--td-ink); border: 1px solid var(--td-line); border-radius: 6px; padding: .4rem .8rem; cursor: pointer; }
.td-viewer-reset:hover { border-color: var(--td-orange); color: var(--td-orange); }
.td-off-status { margin-top: .8rem; font-size: .92rem; color: var(--td-muted); min-height: 1.4em; }
.td-off-status.is-ok { color: #14532d; }
.td-off-status.is-warn { color: #8a4b00; }
.td-off-status.is-err { color: var(--td-orange-dark); }
.td-off-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; margin-bottom: 1.2rem; }
.td-off-stats > div { background: var(--td-sand); border-radius: 10px; padding: .8rem .9rem; }
.td-off-stats span { display: block; font-size: .78rem; color: var(--td-muted); text-transform: uppercase; letter-spacing: .06em; }
.td-off-stats strong { font-size: .98rem; color: var(--td-ink); }
.td-price { display: grid; gap: .1rem; background: var(--td-orange); color: #fff; border-radius: 12px; padding: 1.1rem 1.3rem; }
.td-price span { font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; opacity: .85; }
.td-price strong { font-family: var(--td-heading); font-size: 2rem; line-height: 1.1; }
.td-price small { opacity: .85; font-size: .82rem; }
.td-off input[type=number] { font: inherit; font-size: 1rem; border: 1px solid var(--td-line); border-radius: 6px; padding: .75rem .9rem; width: 100%; box-sizing: border-box; }
@media (max-width: 900px) { .td-off-grid { grid-template-columns: 1fr; } .td-viewer-canvas { height: 320px; } .td-drop { min-height: 240px; } }
.td-page-body .wp-block-post-content > .alignwide { max-width: var(--td-max) !important; width: 100%; margin-left: auto !important; margin-right: auto !important; }

/* Materialen */
.td-mat-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important; }
.td-mat h3 { margin-top: 0; }
.td-mat p { margin: 0 0 .7rem; }
.td-mat .td-mat-good { font-size: .93rem; color: var(--td-ink) !important; }
.td-matprops { list-style: none; padding: .9rem 0 0; margin: .4rem 0 0; border-top: 1px solid var(--td-line); display: grid; gap: .35rem; }
.td-matprops li { display: flex; justify-content: space-between; align-items: center; font-size: .88rem; color: var(--td-muted); }
.td-dots { display: inline-flex; gap: 4px; }
.td-dots i { width: 9px; height: 9px; border-radius: 50%; background: var(--td-line); display: block; }
.td-dots i.on { background: var(--td-orange); }
.td-mat-help { font-weight: 500; font-size: .82rem; margin-left: .4rem; color: var(--td-orange); }
html { scroll-behavior: smooth; }
#materialen { scroll-margin-top: 100px; }

/* ---------- v1.9: mobiel ---------- */
body { overflow-x: clip; }
img, video, canvas, iframe { max-width: 100%; }
@media (max-width: 900px) {
	.td-contact { grid-template-columns: minmax(0, 1fr) !important; }
}
.td-contact > *, .td-form, .td-form label, .td-off-grid > * { min-width: 0; }
.td-form input, .td-form select, .td-form textarea { max-width: 100%; box-sizing: border-box; }
.td-mat-grid { grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)) !important; }
@media (max-width: 480px) {
	.td-contact-card { padding: 1.4rem; }
	.td-off-stats { grid-template-columns: 1fr 1fr; }
	.td-off-stats > div:last-child { grid-column: 1 / -1; }
	.td-header .td-logo span { font-size: 1.05rem; }
}
/* Mobiel menu: volledig scherm, grote knoppen */
.td-header .wp-block-navigation__responsive-container-open,
.td-header .wp-block-navigation__responsive-container-close { color: var(--td-ink); padding: .4rem; }
.td-header .wp-block-navigation__responsive-container-open svg,
.td-header .wp-block-navigation__responsive-container-close svg { width: 30px; height: 30px; }
.td-header .wp-block-navigation__responsive-container.is-menu-open { position: fixed; inset: 0; height: 100dvh; background: #fff !important; color: var(--td-ink) !important; padding: 1.25rem 1.5rem 2rem; z-index: 100000; overflow-y: auto; }
.td-header .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 3.5rem !important; align-items: flex-start !important; }
.td-header .is-menu-open .wp-block-navigation__container { gap: 0 !important; width: 100%; align-items: stretch !important; }
.td-header .is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid var(--td-line); }
.td-header .is-menu-open .wp-block-navigation-item__content { display: block; padding: 1rem .25rem !important; font-family: var(--td-heading); font-size: 1.5rem; font-weight: 600; }
.td-header .is-menu-open .wp-block-navigation-item__content:hover { color: var(--td-orange); }

/* ---------- v1.9: prijsopbouw en tarieven ---------- */
.td-price-lines { list-style: none; margin: .5rem 0 .2rem; padding: .6rem 0 0; border-top: 1px solid rgba(255,255,255,.25); display: grid; gap: .2rem; font-size: .86rem; }
.td-price-lines li { display: flex; justify-content: space-between; gap: 1rem; }
.td-price-lines li span:first-child { opacity: .85; }
.td-price-excl { font-size: .9rem; opacity: .9; }
.td-tarieven { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 1.25rem; margin-top: 1.5rem; }
.td-tarief-tabel { width: 100%; border-collapse: collapse; font-size: .95rem; }
.td-tarief-tabel th, .td-tarief-tabel td { text-align: left; padding: .55rem .2rem; border-bottom: 1px solid var(--td-line); vertical-align: top; }
.td-tarief-tabel th { font-weight: 500; color: var(--td-muted); }
.td-tarief-tabel td { text-align: right; white-space: nowrap; font-weight: 600; color: var(--td-ink); }
.td-tarief-tabel td small { display: block; font-weight: 400; color: var(--td-muted); font-size: .8rem; }
.td-ontwerp-card { background: var(--td-ink) !important; color: var(--td-on-dark, #e8e2de); border-color: var(--td-ink) !important; }
.td-ontwerp-card h3 { color: #fff; margin-top: 0; }
.td-ontwerp-card .td-ontwerp-prijs { font-family: var(--td-heading); font-size: 2rem; font-weight: 700; color: #fff; margin: .2rem 0 .1rem; line-height: 1.1; }
.td-ontwerp-card .td-ontwerp-prijs small { font-size: 1rem; font-weight: 500; opacity: .8; }
.td-ontwerp-card ul { margin: .9rem 0 1.2rem; padding-left: 1.1rem; display: grid; gap: .35rem; }
.td-ontwerp-card .wp-block-button__link { background: #fff; color: var(--td-orange); }
html.has-modal-open .td-wa { display: none !important; }
.td-tarief-tabel th .description { display: block; font-size: .8rem; color: var(--td-muted); font-weight: 400; margin-top: .1rem; }
.td-tarief-tabel th br { display: none; }
.td-header .is-menu-open .wp-block-navigation__responsive-container-content { gap: 0 !important; width: 100%; }
.td-header .is-menu-open .wp-block-navigation__container { width: 100%; }
.td-header .is-menu-open .wp-block-navigation-item { align-items: flex-start !important; justify-content: flex-start !important; text-align: left; }
.td-header .is-menu-open .wp-block-navigation-item__content { width: 100%; }
.td-price .td-price-excl, .td-price .td-price-lines span { text-transform: none; letter-spacing: 0; font-size: .86rem; }
.td-price .td-price-excl { font-size: .9rem; }
.td-ontwerp-card p:not(.td-num) { color: rgba(255,255,255,.75); }
.td-ontwerp-card p.td-ontwerp-prijs { color: #fff; }
.td-ontwerp-card ul { color: rgba(255,255,255,.9); }

/* ---------- v1.10: focus en paginaovergangen ---------- */
/* Geen kader meer bij klikken met muis of vinger; wel een nette ring bij navigeren met het toetsenbord (toegankelijkheid). */
html { -webkit-tap-highlight-color: transparent; }
:where(.wp-site-blocks) :focus:not(:focus-visible),
.wp-block-navigation :focus:not(:focus-visible),
a:focus:not(:focus-visible), button:focus:not(:focus-visible) { outline: none !important; }
:where(a, button, summary, [role="button"], .wp-block-button__link, .wp-block-navigation-item__content):focus-visible {
	outline: 2px solid var(--td-orange) !important; outline-offset: 3px; border-radius: 6px;
}
.td-footer :where(a):focus-visible, .td-ontwerp-card :where(a):focus-visible { outline-color: #fff !important; }
/* Menu: subtiele lijn onder de link bij aanwijzen en voor de huidige pagina */
@media (min-width: 600px) {
	.td-header .wp-block-navigation-item__content { position: relative; padding: .35rem 0; }
	.td-header .wp-block-navigation-item__content::after {
		content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; border-radius: 2px;
		background: var(--td-orange); transform: scaleX(0); transform-origin: left; transition: transform .25s ease;
	}
	.td-header .wp-block-navigation-item__content:hover::after,
	.td-header .current-menu-item > .wp-block-navigation-item__content::after,
	.td-header .wp-block-navigation-item__content[aria-current="page"]::after { transform: scaleX(1); }
	.td-header .is-menu-open .wp-block-navigation-item__content::after { display: none; }
}
.td-header .wp-block-navigation-item__content[aria-current="page"] { color: var(--td-orange); }
/* Knoppen: zacht indrukken bij klikken */
.wp-block-button__link:active, .td-card-link:active { transform: scale(.98); }
/* Mobiel menu: zacht openen */
.td-header .wp-block-navigation__responsive-container.is-menu-open { animation: td-menu-in .22s ease-out both; }
@keyframes td-menu-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

/* Vloeiende overgang tussen pagina's (Chrome, Edge, Safari; andere browsers wisselen gewoon zoals vroeger) */
@view-transition { navigation: auto; }
@media (min-width: 600px) { .td-header { view-transition-name: td-header; } }
.td-wa { view-transition-name: td-wa; }
::view-transition-old(root) { animation: td-uit .18s ease-in both; }
::view-transition-new(root) { animation: td-in .32s cubic-bezier(.2,.7,.2,1) both; }
::view-transition-group(td-header), ::view-transition-group(td-wa) { animation: none; }
@keyframes td-uit { to { opacity: 0; transform: translateY(-6px); } }
@keyframes td-in { from { opacity: 0; transform: translateY(10px); } }
/* Inhoud bij het laden van een pagina zacht laten verschijnen (ook in browsers zonder overgangen) */
@supports not (view-transition-name: none) {
	.wp-site-blocks > main { animation: td-in .35s ease-out both; }
}
@media (prefers-reduced-motion: reduce) {
	@view-transition { navigation: none; }
	.td-header .wp-block-navigation__responsive-container.is-menu-open { animation: none; }
	.wp-site-blocks > main { animation: none !important; }
}

/* ---------- v1.10: tekstpagina's (privacybeleid) ---------- */
.td-prose { max-width: 760px; font-size: 1.05rem; line-height: 1.7; }
.td-prose h2 { font-size: 1.45rem; margin: 2.2rem 0 .6rem; }
.td-prose ul { padding-left: 1.2rem; display: grid; gap: .45rem; }
.td-prose a { color: var(--td-orange); }
.td-muted { color: var(--td-muted); font-size: .92rem; }
.td-footer-bottom a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.td-check a { color: var(--td-orange); }

/* ---------- v1.10: contactpagina ruimer ---------- */
.is-layout-constrained > .td-contact { max-width: 1120px !important; width: 100%; }
.td-contact { grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr); gap: 2rem; margin-top: 1rem !important; }
.td-contact-card { padding: 2.5rem; box-shadow: 0 18px 40px -28px rgba(28,27,26,.25); }
.td-contact-card h3 { font-size: 1.6rem; margin: .9rem 0 1.4rem; }
.td-contact-card > p:not(.td-kicker) { line-height: 1.75; }
.td-form { gap: 1.35rem; margin-top: 1rem; }
.td-form label { gap: .5rem; }
.td-form input[type=text], .td-form input[type=email], .td-form input[type=tel], .td-form select, .td-form textarea { padding: .95rem 1.05rem; border-radius: 8px; }
.td-form textarea { min-height: 180px; }
.td-form .td-check { margin-top: .25rem; line-height: 1.55; }
.td-form button.wp-block-button__link { justify-self: start; padding: 1rem 2.2rem; margin-top: .25rem; }
.td-contact-photo { margin: 2rem 0 0 !important; }
.td-contact-photo img { border-radius: 12px; }
@media (max-width: 900px) { .td-contact { grid-template-columns: minmax(0, 1fr) !important; gap: 1.5rem; } }
@media (max-width: 480px) { .td-contact-card { padding: 1.5rem; } .td-form button.wp-block-button__link { justify-self: stretch; } }