/* ==========================================================================
   Jade May – main.css
   Eén signatuur: foto's die langzaam overlopen in zwart, met parallax.
   Al het andere is stil, ruim en gedisciplineerd.
   ========================================================================== */

/* Fonts (lokaal, geen Google) ------------------------------------------- */
@font-face { font-family: "Noto Serif Display"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/noto-serif-display-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Noto Serif Display"; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/noto-serif-display-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 300; font-style: normal; font-display: swap; src: url("../fonts/poppins-latin-300-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/poppins-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/poppins-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/poppins-latin-600-normal.woff2") format("woff2"); }

/* Tokens ----------------------------------------------------------------- */
:root {
	--jm-black: #000;
	--jm-night: #0F1010;
	--jm-gold: #E6B77F;
	--jm-white: #fff;
	--jm-muted: rgba(255, 255, 255, .62);
	--jm-grey: #A4A4A4;
	--jm-line: rgba(255, 255, 255, .12);
	--jm-line-gold: rgba(230, 183, 127, .35);

	--jm-serif: "Noto Serif Display", "Didot", "Bodoni MT", Georgia, serif;
	--jm-sans: "Poppins", "Helvetica Neue", Arial, sans-serif;

	--jm-gutter: clamp(1.25rem, 4vw, 3rem);
	--jm-content: 720px;
	--jm-wide: 1200px;
	--jm-section: clamp(4.5rem, 3rem + 6vw, 8.5rem);
	--jm-stack: 1.5rem;
	--jm-header-h: 76px;

	--jm-ease: cubic-bezier(.22, .61, .36, 1);
	--jm-fade-dur: 1.1s;
	color-scheme: dark;
}

/* Basis ------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: var(--jm-header-h); }
body {
	margin: 0;
	background: var(--jm-black);
	color: var(--jm-grey);
	font-family: var(--jm-sans);
	font-weight: 300;
	font-size: 1.0625rem;
	line-height: 1.8;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: clip;
}
body.jm-menu-open { overflow: hidden; }
img, video, svg { max-width: 100%; height: auto; display: block; }
::selection { background: var(--jm-gold); color: var(--jm-black); }

h1, h2, h3, h4 {
	font-family: var(--jm-serif);
	color: var(--jm-white);
	font-weight: 600;
	line-height: 1.15;
	margin: 0;
	text-wrap: balance;
}
h1 { font-size: clamp(2.75rem, 1.6rem + 5vw, 6.25rem); font-weight: 700; line-height: 1.05; letter-spacing: -.01em; }
h2 { font-size: clamp(2rem, 1.4rem + 2.6vw, 3.5rem); }
h3 { font-size: clamp(1.375rem, 1.2rem + .7vw, 1.75rem); }
h4 { font-size: 1.125rem; }
p { margin: 0; text-wrap: pretty; }
strong, b { color: var(--jm-white); font-weight: 500; }
em { font-style: italic; color: var(--jm-white); }

a { color: var(--jm-gold); text-decoration-thickness: 1px; text-underline-offset: .2em; transition: color .3s var(--jm-ease); }
a:hover { color: var(--jm-white); }

:focus-visible { outline: 2px solid var(--jm-gold); outline-offset: 3px; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
}
.jm-skip {
	position: absolute; left: 1rem; top: -100px; z-index: 1000;
	background: var(--jm-gold); color: var(--jm-black); padding: .75rem 1.25rem; font-weight: 600;
}
.jm-skip:focus { top: 1rem; }

/* Header ----------------------------------------------------------------- */
.jm-header {
	position: fixed; inset: 0 0 auto; z-index: 100;
	transition: background-color .5s var(--jm-ease), backdrop-filter .5s var(--jm-ease);
}
.jm-header[data-scrolled="true"] {
	background: rgba(0, 0, 0, .78);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
}
.jm-header__bar {
	display: flex; align-items: center; justify-content: space-between; gap: 2rem;
	height: var(--jm-header-h);
	max-width: calc(var(--jm-wide) + 2 * var(--jm-gutter));
	margin-inline: auto;
	padding-inline: var(--jm-gutter);
	padding-top: env(safe-area-inset-top, 0);
}
.jm-header__logo { display: flex; align-items: center; color: var(--jm-white); text-decoration: none; position: relative; z-index: 2; }
.jm-header__logo img { height: 52px; width: auto; }
.jm-header__logo span { font-family: var(--jm-serif); font-size: 1.375rem; font-weight: 700; }

.jm-nav { display: flex; align-items: center; gap: 2.25rem; }
.jm-nav__list, .jm-nav__list ul, .jm-lang { list-style: none; margin: 0; padding: 0; }
.jm-nav__list { display: flex; gap: 2rem; }
.jm-nav__list a {
	color: var(--jm-white); text-decoration: none;
	font-size: .9375rem; font-weight: 400; letter-spacing: .01em;
	display: inline-block; padding-block: .5rem;
	background: linear-gradient(var(--jm-gold), var(--jm-gold)) left bottom / 0 1px no-repeat;
	transition: background-size .4s var(--jm-ease), color .3s;
}
.jm-nav__list a:hover,
.jm-nav__list .current-menu-item > a,
.jm-nav__list .current-menu-ancestor > a { background-size: 100% 1px; color: var(--jm-white); }

.jm-nav__list li { position: relative; }
.jm-nav__list .sub-menu {
	position: absolute; left: -1.25rem; top: 100%; min-width: 230px;
	padding: .75rem 1.25rem; background: rgba(0, 0, 0, .92);
	border: 1px solid var(--jm-line);
	opacity: 0; visibility: hidden; transform: translateY(6px);
	transition: opacity .3s var(--jm-ease), transform .3s var(--jm-ease), visibility .3s;
}
.jm-nav__list li:hover > .sub-menu,
.jm-nav__list li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.jm-nav__list .sub-menu a { display: block; font-size: .875rem; color: var(--jm-muted); }
.jm-nav__list .sub-menu a:hover { color: var(--jm-white); }

.jm-lang { display: flex; gap: .25rem; font-size: .8125rem; }
.jm-lang a { color: var(--jm-muted); text-decoration: none; padding: .35rem .5rem; letter-spacing: .06em; }
.jm-lang a[aria-current] { color: var(--jm-gold); }

.jm-header__toggle { display: none; }

@media (max-width: 1023px) {
	:root { --jm-header-h: 68px; }
	.jm-header__logo img { height: 44px; }

	.jm-header__toggle {
		display: grid; place-items: center;
		width: 48px; height: 48px; margin-right: -12px;
		background: none; border: 0; color: var(--jm-white); cursor: pointer;
		position: relative; z-index: 2;
	}
	.jm-burger { position: relative; width: 26px; height: 12px; }
	.jm-burger span {
		position: absolute; left: 0; width: 100%; height: 1.5px; background: currentColor;
		transition: transform .45s var(--jm-ease), top .45s var(--jm-ease);
	}
	.jm-burger span:first-child { top: 0; }
	.jm-burger span:last-child { top: 10px; }
	.jm-header__toggle[aria-expanded="true"] .jm-burger span:first-child { top: 5px; transform: rotate(45deg); }
	.jm-header__toggle[aria-expanded="true"] .jm-burger span:last-child { top: 5px; transform: rotate(-45deg); }

	.jm-nav {
		position: fixed; inset: 0; z-index: 1;
		flex-direction: column; align-items: stretch; justify-content: space-between; gap: 2rem;
		padding: calc(var(--jm-header-h) + 2rem + env(safe-area-inset-top, 0)) var(--jm-gutter) calc(2rem + env(safe-area-inset-bottom, 0));
		background: linear-gradient(180deg, #000 0%, var(--jm-night) 100%);
		overflow-y: auto;
		opacity: 0; visibility: hidden;
		transition: opacity .5s var(--jm-ease), visibility .5s;
	}
	.jm-nav.is-open { opacity: 1; visibility: visible; }
	.jm-nav__list { flex-direction: column; gap: 0; }
	.jm-nav__list > li { border-bottom: 1px solid var(--jm-line); }
	.jm-nav__list > li > a {
		font-family: var(--jm-serif); font-size: 1.75rem; font-weight: 600;
		padding-block: .9rem; background: none;
	}
	.jm-nav__list .sub-menu {
		position: static; opacity: 1; visibility: visible; transform: none;
		border: 0; background: none; padding: 0 0 1rem; min-width: 0;
	}
	.jm-nav__list .sub-menu a { font-size: 1rem; padding-block: .45rem; }
	.jm-lang { justify-content: flex-start; font-size: .9375rem; }
	.jm-lang a { padding: .75rem 1rem .75rem 0; }

	/* items komen rustig binnen bij openen */
	.jm-nav.is-open .jm-nav__list > li { animation: jm-in .7s var(--jm-ease) both; }
	.jm-nav.is-open .jm-nav__list > li:nth-child(2) { animation-delay: .05s; }
	.jm-nav.is-open .jm-nav__list > li:nth-child(3) { animation-delay: .1s; }
	.jm-nav.is-open .jm-nav__list > li:nth-child(4) { animation-delay: .15s; }
	.jm-nav.is-open .jm-nav__list > li:nth-child(5) { animation-delay: .2s; }
	.jm-nav.is-open .jm-nav__list > li:nth-child(n+6) { animation-delay: .25s; }
}
@keyframes jm-in { from { opacity: 0; transform: translateY(14px); } }

/* Paginaopbouw ----------------------------------------------------------- */
.jm-main { min-height: 60vh; }
.jm-content { padding-inline: var(--jm-gutter); padding-bottom: var(--jm-section); }
.jm-content.starts-with-hero { padding-top: 0; }
.jm-content > * { max-width: var(--jm-content); margin-inline: auto; }
.jm-content > .alignwide { max-width: var(--jm-wide); }
.jm-content > .alignfull { max-width: none; margin-inline: calc(var(--jm-gutter) * -1); }
.jm-content > * + * { margin-block-start: var(--jm-stack); }
.jm-content > :where(h2, h3) { margin-block-start: calc(var(--jm-stack) * 2.25); }
.jm-content > :where(h2, h3) + * { margin-block-start: 1rem; }

/* Kop boven een brede rij lijnt uit met die rij */
.jm-content .wp-block-group.alignfull > :where(h2):has(+ .alignwide) { max-width: var(--jm-wide); }

/* Eindigt de pagina met een volle sectie, dan sluit de CTA er direct op aan */
.jm-content:has(> .alignfull:last-child) { padding-bottom: 0; }

/* Volle secties regelen zelf hun ruimte */
.jm-content > .alignfull,
.jm-content > .alignfull + * { margin-block-start: 0; }
.jm-content > .alignfull + :not(.alignfull) { margin-block-start: var(--jm-section); }
.jm-content > :not(.alignfull) + .alignfull { margin-block-start: var(--jm-section); }

.jm-section, .jm-content > .wp-block-group.alignfull:not(.is-style-jm-reviews) {
	padding-block: var(--jm-section);
	padding-inline: var(--jm-gutter);
}
.jm-content > .wp-block-group.alignfull > * { max-width: var(--jm-content); margin-inline: auto; }
.jm-content > .wp-block-group.alignfull > .alignwide { max-width: var(--jm-wide); }
.wp-block-group > * + * { margin-block-start: var(--jm-stack); }
.wp-block-group > :where(h2, h3) + * { margin-block-start: 1rem; }

.jm-page-head {
	padding: calc(var(--jm-header-h) + var(--jm-section) * .75) var(--jm-gutter) calc(var(--jm-section) * .5);
	max-width: calc(var(--jm-content) + 2 * var(--jm-gutter));
	margin-inline: auto;
}
.jm-page-head__title { font-size: clamp(2.5rem, 1.8rem + 3.5vw, 4.5rem); }
.jm-page-head__meta { color: var(--jm-gold); font-size: .875rem; margin-bottom: 1rem; }

.has-large-font-size { line-height: 1.7; color: var(--jm-muted); }
.has-text-align-center { text-align: center; }
.is-content-justification-center { justify-content: center; }

/* Signatuur: foto's die overlopen in zwart (+ parallax) ------------------- */
.wp-block-cover {
	position: relative; display: flex; overflow: hidden;
	min-height: 70vh; padding: var(--jm-section) var(--jm-gutter);
	align-items: flex-end; justify-content: center;
	isolation: isolate;
}
.wp-block-cover.alignfull { margin-inline: calc(var(--jm-gutter) * -1); }
.wp-block-cover__image-background,
.wp-block-cover__video-background {
	position: absolute; inset: 0; width: 100%; height: 100%;
	object-fit: cover; z-index: -2; max-width: none;
}
.wp-block-cover__background { position: absolute; inset: 0; z-index: -1; }
.wp-block-cover__background.has-background-dim-10 { opacity: .1; }
.wp-block-cover__background.has-background-dim-20 { opacity: .2; }
.wp-block-cover__background.has-background-dim-30 { opacity: .3; }
.wp-block-cover__background.has-background-dim-40 { opacity: .4; }
.wp-block-cover__background.has-background-dim-50 { opacity: .5; }
.wp-block-cover__background.has-black-background-color { background: #000; }
.wp-block-cover__inner-container { width: 100%; max-width: var(--jm-content); position: relative; }
.wp-block-cover__inner-container > * + * { margin-block-start: var(--jm-stack); }
.wp-block-cover.is-position-center-center { align-items: center; }
.wp-block-cover h1, .wp-block-cover h2 { text-shadow: 0 2px 30px rgba(0, 0, 0, .35); }

/* Core "vaste achtergrond" werkt niet op iOS: altijd onze parallax gebruiken */
.wp-block-cover.has-parallax { background-attachment: scroll !important; }

/* Vloeit over in zwart (het effect van online diensten) */
.wp-block-cover.is-style-jm-fade::after,
.wp-block-cover.is-style-jm-blend::after,
.jm-cta.has-image::after {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
}
.wp-block-cover.is-style-jm-fade::after {
	background: linear-gradient(180deg,
		rgba(0, 0, 0, .35) 0%,
		rgba(0, 0, 0, 0) 22%,
		rgba(0, 0, 0, .15) 45%,
		rgba(0, 0, 0, .7) 72%,
		#000 95%);
}
/* Zachte randen aan beide kanten: voor foto's midden op de pagina */
.wp-block-cover.is-style-jm-blend::after,
.jm-cta.has-image::after {
	background: linear-gradient(180deg,
		#000 0%,
		rgba(0, 0, 0, .55) 18%,
		rgba(0, 0, 0, .35) 50%,
		rgba(0, 0, 0, .7) 78%,
		#000 100%);
}
.wp-block-cover.is-style-jm-blend { align-items: center; min-height: 80vh; }

/* Parallax-ruimte: afbeelding iets groter dan het vlak */
.jm-parallax-ready .jm-parallax,
.jm-parallax-ready .wp-block-cover.is-style-jm-fade .wp-block-cover__image-background,
.jm-parallax-ready .wp-block-cover.is-style-jm-blend .wp-block-cover__image-background {
	top: -12%; height: 124%; inset-inline: 0;
	will-change: transform;
	transform: translate3d(0, var(--jm-py, 0px), 0);
}

/* Hero met video */
.wp-block-cover.jm-hero { min-height: 100svh; padding-top: calc(var(--jm-header-h) + 2rem); }
.wp-block-cover.jm-hero .wp-block-cover__inner-container { max-width: var(--jm-wide); }
.jm-hero__sub { font-family: var(--jm-serif); font-size: clamp(1.25rem, 1rem + 1vw, 1.75rem); color: var(--jm-white); font-weight: 600; }
.jm-hero .has-large-font-size { max-width: 36ch; }

/* Nachtvlak: zachte overgang van zwart naar #0F1010 en terug */
.wp-block-group.is-style-jm-surface {
	background: linear-gradient(180deg, #000 0%, var(--jm-night) 18%, var(--jm-night) 82%, #000 100%);
}

/* Tekst + beeld --------------------------------------------------------- */
.wp-block-columns { display: flex; flex-wrap: wrap; gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
.wp-block-column { flex: 1 1 0; min-width: 0; }
.wp-block-column > * + * { margin-block-start: var(--jm-stack); }
.wp-block-column > :where(h2, h3) + * { margin-block-start: 1rem; }
@media (max-width: 781px) {
	.wp-block-columns { flex-direction: column; align-items: stretch; }
	.wp-block-column { flex-basis: 100% !important; }
	.wp-block-columns.is-reversed-on-mobile { flex-direction: column-reverse; }
}
.wp-block-image { margin: 0; }
.wp-block-image img { width: 100%; }
.jm-portrait img { aspect-ratio: 4 / 5; object-fit: cover; }

/* Drie pijlers --------------------------------------------------------- */
.wp-block-columns.jm-pillars { align-items: stretch; gap: 0; }
.jm-pillars > .wp-block-column { padding: 2rem clamp(1.25rem, 2.5vw, 2.5rem); border-left: 1px solid var(--jm-line); }
.jm-pillars > .wp-block-column:first-child { border-left: 0; padding-left: 0; }
.jm-pillars > .wp-block-column:last-child { padding-right: 0; }
.jm-pillars h3 { color: var(--jm-gold); font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem); }
@media (max-width: 781px) {
	.jm-pillars > .wp-block-column,
	.jm-pillars > .wp-block-column:first-child { border-left: 0; border-top: 1px solid var(--jm-line); padding: 1.75rem 0; }
	.jm-pillars > .wp-block-column:first-child { border-top: 0; padding-top: 0; }
}

/* Dienstenkaarten -------------------------------------------------------- */
.wp-block-columns.jm-services { align-items: stretch; gap: clamp(1.25rem, 2vw, 2rem); }
.jm-services > .wp-block-column { position: relative; }
.jm-services .wp-block-image { overflow: hidden; }
.jm-services .wp-block-image img { aspect-ratio: 4 / 5; object-fit: cover; transition: transform 1.2s var(--jm-ease); }
.jm-services > .wp-block-column:hover .wp-block-image img { transform: scale(1.04); }
.jm-services h3 a { color: var(--jm-white); text-decoration: none; }
.jm-services h3 a::after { content: ""; position: absolute; inset: 0; } /* hele kaart klikbaar */
.jm-services p { font-size: .9375rem; }

/* Knoppen ---------------------------------------------------------------- */
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 1rem; }
.wp-block-buttons.is-content-justification-center { justify-content: center; }
.wp-block-button__link,
.jm-button,
.elementor-form .elementor-button {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 52px; padding: 1rem 2.25rem;
	background: var(--jm-gold); color: var(--jm-black);
	border: 1px solid var(--jm-gold); border-radius: 2px;
	font-family: var(--jm-sans); font-size: .9375rem; font-weight: 600; letter-spacing: .02em;
	text-decoration: none; text-align: center; line-height: 1.3;
	cursor: pointer;
	transition: background-color .35s var(--jm-ease), color .35s var(--jm-ease), border-color .35s var(--jm-ease);
}
.wp-block-button__link:hover,
.jm-button:hover,
.elementor-form .elementor-button:hover { background: transparent; color: var(--jm-gold); }

.wp-block-button.is-style-jm-ghost .wp-block-button__link { background: transparent; color: var(--jm-white); border-color: rgba(255, 255, 255, .45); }
.wp-block-button.is-style-jm-ghost .wp-block-button__link:hover { border-color: var(--jm-gold); color: var(--jm-gold); }

/* Op mobiel altijd volle breedte */
@media (max-width: 767px) {
	.wp-block-buttons { flex-direction: column; align-items: stretch; }
	.wp-block-buttons > .wp-block-button { width: 100%; }
	.wp-block-button__link, .jm-button, .elementor-form .elementor-button { display: flex; width: 100%; }
}

/* Reviews: compacte slider ---------------------------------------------- */
.wp-block-group.is-style-jm-reviews { padding: var(--jm-section) var(--jm-gutter); }
.is-style-jm-reviews > :where(h2, p) { text-align: center; }
.jm-reviews__track {
	display: flex; gap: 0;
	max-width: 760px !important; margin-inline: auto !important;
	overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
}
.jm-reviews__track::-webkit-scrollbar { display: none; }
.jm-reviews__track > * + * { margin-block-start: 0 !important; }
.jm-reviews__track .wp-block-quote {
	flex: 0 0 100%; scroll-snap-align: center;
	margin: 0; padding: 0 clamp(.25rem, 3vw, 2.5rem);
	border: 0; text-align: center;
}
.jm-reviews__track .wp-block-quote::before {
	content: "\201C"; display: block;
	font-family: var(--jm-serif); font-size: 4.5rem; line-height: .6; height: 2.25rem;
	color: var(--jm-gold); opacity: .8;
}
.jm-reviews__track .wp-block-quote p {
	color: var(--jm-white); font-size: clamp(1rem, .95rem + .3vw, 1.125rem); line-height: 1.85;
}
.jm-reviews__track .wp-block-quote p + p { margin-top: .75rem; }
.jm-reviews__track .wp-block-quote cite {
	display: block; margin-top: 1.25rem;
	font-style: normal; font-size: .8125rem; letter-spacing: .08em; color: var(--jm-gold);
}
/* ingekort tot JS-knop "Lees verder" uitklapt */
.jm-review__body.is-clamped { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.jm-review__more {
	margin-top: .75rem; background: none; border: 0; padding: .5rem;
	color: var(--jm-gold); font: 500 .8125rem var(--jm-sans); letter-spacing: .04em; cursor: pointer;
	text-decoration: underline; text-underline-offset: .3em;
}
.jm-reviews__nav { display: flex; align-items: center; justify-content: center; gap: 1.25rem; margin-top: 2rem !important; }
.jm-reviews__arrow {
	width: 44px; height: 44px; display: grid; place-items: center;
	background: none; border: 1px solid var(--jm-line); border-radius: 50%;
	color: var(--jm-white); cursor: pointer; transition: border-color .3s, color .3s;
}
.jm-reviews__arrow:hover { border-color: var(--jm-gold); color: var(--jm-gold); }
.jm-reviews__dots { display: flex; gap: .5rem; }
.jm-reviews__dots button {
	width: 24px; height: 24px; padding: 0; background: none; border: 0; cursor: pointer;
	display: grid; place-items: center;
}
.jm-reviews__dots button::before {
	content: ""; width: 6px; height: 6px; border-radius: 50%; background: rgba(255, 255, 255, .3);
	transition: background .3s, transform .3s;
}
.jm-reviews__dots button[aria-current="true"]::before { background: var(--jm-gold); transform: scale(1.3); }

/* Eren / tribute --------------------------------------------------------- */
.jm-tribute { text-align: center; }
.jm-tribute .wp-block-buttons { justify-content: center; }

/* CTA onderaan ----------------------------------------------------------- */
.jm-cta {
	position: relative; overflow: hidden; isolation: isolate;
	display: grid; place-items: center; text-align: center;
	min-height: clamp(420px, 70vh, 680px);
	padding: var(--jm-section) var(--jm-gutter);
	background: linear-gradient(180deg, #000 0%, var(--jm-night) 50%, #000 100%);
}
.jm-cta__media { position: absolute; inset: 0; z-index: -2; }
.jm-cta__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; max-width: none; }
.jm-cta__inner { max-width: 640px; }
.jm-cta__title { font-size: clamp(2rem, 1.4rem + 2.6vw, 3.5rem); }
.jm-cta__text { margin: 1.25rem auto 2.25rem; color: var(--jm-white); max-width: 46ch; }

/* Formulieren (Elementor) ----------------------------------------------- */
.elementor-form .elementor-field-group { margin-bottom: 1.5rem !important; }
.elementor-form .elementor-field-label {
	color: var(--jm-white) !important; font: 400 .9375rem/1.5 var(--jm-sans) !important;
	margin-bottom: .5rem !important; display: block;
}
.elementor-form .elementor-field-textual,
.elementor-form select {
	width: 100%; min-height: 52px;
	background: rgba(255, 255, 255, .04) !important; color: var(--jm-white) !important;
	border: 0 !important; border-bottom: 1px solid rgba(255, 255, 255, .25) !important; border-radius: 0 !important;
	font: 300 1rem var(--jm-sans) !important; /* 16px: geen zoom op iOS */
	padding: .85rem 1rem !important;
	transition: border-color .3s, background-color .3s;
}
.elementor-form .elementor-field-textual:focus,
.elementor-form select:focus { outline: none; border-bottom-color: var(--jm-gold) !important; background: rgba(255, 255, 255, .07) !important; }
.elementor-form textarea.elementor-field-textual { min-height: 140px; }
.elementor-form .elementor-field-option label { color: var(--jm-grey); font-size: .9375rem; }
.elementor-form input[type="checkbox"] { accent-color: var(--jm-gold); width: 18px; height: 18px; margin-right: .6rem; vertical-align: -3px; }
.elementor-form .elementor-message { font-family: var(--jm-sans); color: var(--jm-white); }
.elementor-form .jm-is-hidden { display: none !important; }

/* Blog ------------------------------------------------------------------- */
.jm-posts {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 2.5rem;
	max-width: var(--jm-wide); margin-inline: auto; padding: 0 var(--jm-gutter) var(--jm-section);
}
.jm-card__link { display: block; color: inherit; text-decoration: none; }
.jm-card__media { overflow: hidden; }
.jm-card__media img { aspect-ratio: 3 / 2; object-fit: cover; width: 100%; transition: transform 1.2s var(--jm-ease); }
.jm-card__link:hover img { transform: scale(1.04); }
.jm-card__body { padding-top: 1.25rem; }
.jm-card__meta { color: var(--jm-gold); font-size: .8125rem; }
.jm-card__title { font-size: 1.5rem; margin: .5rem 0 .75rem; }
.jm-card__excerpt { font-size: .9375rem; }
.jm-post__image { max-width: var(--jm-wide); margin: 0 auto var(--jm-section); padding-inline: var(--jm-gutter); }

.jm-404 { text-align: center; padding: calc(var(--jm-header-h) + var(--jm-section)) var(--jm-gutter) var(--jm-section); max-width: 640px; margin-inline: auto; }
.jm-404 p { margin: 1.25rem 0 2.25rem; }

/* Footer ----------------------------------------------------------------- */
.jm-footer { border-top: 1px solid var(--jm-line); padding: clamp(3.5rem, 2.5rem + 4vw, 6rem) var(--jm-gutter) 2rem; padding-bottom: calc(2rem + env(safe-area-inset-bottom, 0)); }
.jm-footer__grid {
	display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 3rem;
	max-width: var(--jm-wide); margin-inline: auto;
}
.jm-footer__name { font-family: var(--jm-serif); font-size: 1.5rem; font-weight: 700; color: var(--jm-white); }
.jm-footer__tagline { font-size: .9375rem; margin-top: .5rem; max-width: 30ch; }
.jm-footer__heading { font-family: var(--jm-sans); font-size: .9375rem; font-weight: 500; color: var(--jm-white); margin-bottom: 1rem; }
.jm-footer__list, .jm-socials { list-style: none; margin: 0; padding: 0; }
.jm-footer__list li + li { margin-top: .35rem; }
.jm-footer__list a { color: var(--jm-grey); text-decoration: none; font-size: .9375rem; display: inline-flex; align-items: center; gap: .5rem; padding-block: .3rem; }
.jm-footer__list a:hover { color: var(--jm-gold); }
.jm-socials { display: flex; gap: .25rem; margin-top: 1.5rem; margin-left: -.6rem; }
.jm-socials a { display: grid; place-items: center; width: 44px; height: 44px; color: var(--jm-muted); }
.jm-socials a:hover { color: var(--jm-gold); }
.jm-footer__legal { max-width: var(--jm-wide); margin: 3.5rem auto 0; padding-top: 1.5rem; border-top: 1px solid var(--jm-line); font-size: .8125rem; color: rgba(255, 255, 255, .4); }
@media (max-width: 899px) {
	.jm-footer__grid { grid-template-columns: 1fr 1fr; gap: 2.5rem 1.5rem; }
	.jm-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 479px) {
	.jm-footer__grid { grid-template-columns: 1fr; }
}

/* Langzaam invliegen ----------------------------------------------------- */
.jm-js .jm-reveal {
	opacity: 0; transform: translate3d(0, 28px, 0);
	transition: opacity var(--jm-fade-dur) var(--jm-ease), transform var(--jm-fade-dur) var(--jm-ease);
	transition-delay: var(--jm-delay, 0s);
}
.jm-js .jm-reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
	.jm-js .jm-reveal { opacity: 1; transform: none; }
	.jm-parallax-ready .jm-parallax,
	.jm-parallax-ready .wp-block-cover__image-background { transform: none !important; }
}

/* Editor: zelfde uitstraling ---------------------------------------------- */
.editor-styles-wrapper { background: var(--jm-black); }

/* Fixes na eerste test op mobiel ----------------------------------------- */
/* Ingelogd: header onder de adminbalk */
.admin-bar .jm-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .jm-header { top: 46px; } }

/* Intro-tekst: core-preset overschrijven (was 36px op mobiel) */
p.has-large-font-size { font-size: clamp(1.125rem, 1rem + .5vw, 1.375rem) !important; line-height: 1.7; }

/* Dienstenkaarten op mobiel: horizontaal swipen i.p.v. drie hoge foto's onder elkaar */
@media (max-width: 781px) {
	.wp-block-columns.jm-services {
		flex-direction: row; flex-wrap: nowrap; align-items: stretch; gap: 1rem;
		overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
		margin-inline: calc(var(--jm-gutter) * -1); padding-inline: var(--jm-gutter);
		scroll-padding-inline: var(--jm-gutter); scrollbar-width: none;
	}
	.wp-block-columns.jm-services::-webkit-scrollbar { display: none; }
	.jm-services > .wp-block-column { flex: 0 0 78% !important; scroll-snap-align: start; }
}

/* Groter logo, zoals op de originele site; krimpt rustig bij scrollen */
:root { --jm-header-h: 116px; }
.jm-header__logo img { height: 104px; transition: height .5s var(--jm-ease); }
.jm-header[data-scrolled="true"] .jm-header__bar { height: 88px; }
.jm-header[data-scrolled="true"] .jm-header__logo img { height: 80px; }
.jm-header__bar { transition: height .5s var(--jm-ease); }
@media (max-width: 1023px) {
	:root { --jm-header-h: 104px; }
	.jm-header__logo img { height: 96px; }
	.jm-header[data-scrolled="true"] .jm-header__bar { height: 76px; }
	.jm-header[data-scrolled="true"] .jm-header__logo img { height: 72px; }
}

/* ==========================================================================
   Elementor-helpers (CSS-klassen in Elementor → Geavanceerd → CSS-klassen)
   jm-blend   : foto met zachte randen boven én onder
   jm-surface : nachtvlak dat zacht in- en uitloopt
   jm-pillars : drie kolommen met dunne scheidingslijnen
   jm-services: dienstenkaarten (op mobiel swipebaar)
   jm-reviews : compacte reviews-slider
   jm-choice  : keuzeblok online / real life
   ========================================================================== */
.e-con.jm-blend { position: relative; isolation: isolate; }
.e-con.jm-blend::after {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background: linear-gradient(180deg, #000 0%, rgba(0,0,0,.6) 18%, rgba(0,0,0,.55) 50%, rgba(0,0,0,.75) 78%, #000 100%);
}
.e-con.jm-blend > .e-con-inner, .e-con.jm-blend > .elementor-element { position: relative; z-index: 1; }

.e-con.jm-surface { background: linear-gradient(180deg, #000 0%, var(--jm-night) 18%, var(--jm-night) 82%, #000 100%); }

:is(.e-con.jm-pillars, .e-con.jm-pillars > .e-con-inner) > .e-con { border-left: 1px solid var(--jm-line); padding-inline: clamp(1.25rem, 2.5vw, 2.5rem) !important; }
:is(.e-con.jm-pillars, .e-con.jm-pillars > .e-con-inner) > .e-con:first-child { border-left: 0; padding-left: 0 !important; }
:is(.e-con.jm-pillars, .e-con.jm-pillars > .e-con-inner) > .e-con:last-child { padding-right: 0 !important; }
@media (max-width: 767px) {
	:is(.e-con.jm-pillars, .e-con.jm-pillars > .e-con-inner) > .e-con, :is(.e-con.jm-pillars, .e-con.jm-pillars > .e-con-inner) > .e-con:first-child { border-left: 0; border-top: 1px solid var(--jm-line); padding: 1.75rem 0 !important; }
	:is(.e-con.jm-pillars, .e-con.jm-pillars > .e-con-inner) > .e-con:first-child { border-top: 0; padding-top: 0 !important; }
}

.e-con.jm-services .elementor-widget-image { overflow: hidden; }
.e-con.jm-services .elementor-widget-image img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; transition: transform 1.2s var(--jm-ease); }
:is(.e-con.jm-services, .e-con.jm-services > .e-con-inner) > .e-con:hover .elementor-widget-image img { transform: scale(1.04); }
.e-con.jm-services .elementor-heading-title a { color: var(--jm-white); }
@media (max-width: 767px) {
	.e-con.jm-services {
		flex-direction: row !important; flex-wrap: nowrap !important; overflow-x: auto; scroll-snap-type: x mandatory;
		margin-inline: -20px; padding-inline: 20px !important; scroll-padding-inline: 20px; scrollbar-width: none;
	}
	.e-con.jm-services::-webkit-scrollbar { display: none; }
	:is(.e-con.jm-services, .e-con.jm-services > .e-con-inner) > .e-con { flex: 0 0 78% !important; width: 78% !important; scroll-snap-align: start; }
}

/* Reviews (Elementor Pro Testimonial Carousel) */
.jm-reviews .elementor-testimonial__content { position: relative; }
.jm-reviews .elementor-testimonial__content::before {
	content: "\201C"; display: block; font-family: var(--jm-serif); font-size: 4.5rem; line-height: .6; height: 2.25rem; color: var(--jm-gold); opacity: .8; text-align: center;
}
.jm-reviews .elementor-testimonial__text { color: var(--jm-white) !important; font: 300 clamp(1rem, .95rem + .3vw, 1.125rem)/1.85 var(--jm-sans) !important; font-style: normal !important; }
.jm-reviews .elementor-testimonial__text.is-clamped { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.jm-reviews .elementor-testimonial__name { color: var(--jm-gold) !important; font: 400 .8125rem var(--jm-sans) !important; letter-spacing: .08em; }
.jm-reviews .elementor-testimonial__footer { justify-content: center; margin-top: 1rem; }
.jm-reviews .swiper-pagination-bullet { background: rgba(255,255,255,.4); opacity: 1; }
.jm-reviews .swiper-pagination-bullet-active { background: var(--jm-gold); }
.jm-reviews .elementor-swiper-button { color: var(--jm-white); }
.jm-reviews .jm-review__more { display: block; margin: .75rem auto 0; }

/* Keuzeblok */
:is(.e-con.jm-choice, .e-con.jm-choice > .e-con-inner) > .e-con { min-height: clamp(420px, 60vh, 560px); overflow: hidden; }
:is(.e-con.jm-choice, .e-con.jm-choice > .e-con-inner) > .e-con .elementor-heading-title { color: var(--jm-white); }
:is(.e-con.jm-choice, .e-con.jm-choice > .e-con-inner) > .e-con > .elementor-element { position: relative; z-index: 1; }
@media (max-width: 767px) { :is(.e-con.jm-choice, .e-con.jm-choice > .e-con-inner) > .e-con { min-height: 380px; } }

/* Elementor-kit stijlt alle h2's en links: footer en menu terugzetten */
body .jm-footer .jm-footer__heading { font-family: var(--jm-sans); font-size: .9375rem; font-weight: 500; line-height: 1.5; color: var(--jm-white); margin-bottom: 1rem; }
body .jm-footer .jm-footer__list a { color: var(--jm-grey); }
body .jm-footer .jm-footer__list a:hover, body .jm-footer .jm-socials a:hover { color: var(--jm-gold); }
body .jm-footer .jm-socials a { color: var(--jm-muted); }
body .jm-nav__list a { color: var(--jm-white); }

/* Witregel tussen alinea's in Elementor-tekst */
.elementor-widget-text-editor p + p { margin-top: 1em; }

/* ==========================================================================
   "Ervaar mijn dominantie" – tegels die overlopen in zwart (jm-tiles / jm-tile)
   ========================================================================== */
.jm-values .elementor-heading-title { letter-spacing: .24em; text-transform: uppercase; }
:is(.e-con.jm-tiles, .e-con.jm-tiles > .e-con-inner) { align-items: flex-start; }
:is(.e-con.jm-tiles, .e-con.jm-tiles > .e-con-inner) > .jm-tile {
	position: relative; overflow: hidden; text-decoration: none;
	border: 1px solid rgba(255, 255, 255, .08);
	transition: border-color .8s var(--jm-ease);
}
.jm-tile:hover, .jm-tile:focus-visible { border-color: var(--jm-line-gold); }
.jm-tile::before { transition: opacity .8s var(--jm-ease); }
.jm-tile:hover::before { opacity: .85 !important; }
.jm-tile .elementor-heading-title { transition: transform .8s var(--jm-ease); }
.jm-tile:hover .elementor-widget-heading .elementor-heading-title { transform: translateY(-4px); }
.jm-tile__more .elementor-heading-title {
	display: inline-flex; align-items: center; gap: .6rem;
	padding-bottom: .35rem;
	background: linear-gradient(var(--jm-gold), var(--jm-gold)) left bottom / 24px 1px no-repeat;
	transition: background-size .8s var(--jm-ease), gap .8s var(--jm-ease);
}
.jm-tile__more .elementor-heading-title::after { content: "\2192"; }
.jm-tile:hover .jm-tile__more .elementor-heading-title { background-size: 100% 1px; gap: .9rem; }

@media (min-width: 1025px) {
	/* Middelste tegel iets lager: rustig, redactioneel ritme */
	:is(.e-con.jm-tiles, .e-con.jm-tiles > .e-con-inner) > .jm-tile:nth-child(2) { margin-top: 72px; }
}
@media (max-width: 1024px) {
	:is(.e-con.jm-tiles, .e-con.jm-tiles > .e-con-inner) {
		flex-direction: row !important; flex-wrap: nowrap !important;
		overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
		margin-inline: -20px; padding-inline: 20px !important; scroll-padding-inline: 20px;
		scrollbar-width: none;
	}
	:is(.e-con.jm-tiles, .e-con.jm-tiles > .e-con-inner)::-webkit-scrollbar { display: none; }
	:is(.e-con.jm-tiles, .e-con.jm-tiles > .e-con-inner) > .jm-tile { flex: 0 0 82% !important; width: 82% !important; max-width: 420px; scroll-snap-align: start; }
}

/* Parallax-laag van Elementor zelf zacht laten in- en uitlopen: geen harde fotorand meer */
.e-con.jm-blend > .elementor-motion-effects-container {
	-webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 24%, #000 76%, transparent 100%);
	mask-image: linear-gradient(180deg, transparent 0%, #000 24%, #000 76%, transparent 100%);
}

/* Tegels zonder rand: de foto liep onder de 1px-rand door en gaf lichte lijntjes langs de randen */
:is(.e-con.jm-tiles, .e-con.jm-tiles > .e-con-inner) > .jm-tile { border: 0 !important; background-clip: padding-box; }
.jm-tile:focus-visible { outline: 1px solid var(--jm-gold); outline-offset: 4px; }

/* ==========================================================================
   Inhoudspagina's: rasters, lijsten, FAQ
   ========================================================================== */
:is(.e-con.jm-grid, .e-con.jm-grid > .e-con-inner) > .e-con {
	flex: 1 1 calc(50% - 16px); max-width: calc(50% - 16px);
	border-top: 1px solid var(--jm-line-gold); padding-top: 24px !important;
}
:is(.e-con.jm-grid--3, .e-con.jm-grid--3 > .e-con-inner) > .e-con { flex-basis: calc(33.333% - 22px); max-width: calc(33.333% - 22px); }
:is(.e-con.jm-grid, .e-con.jm-grid > .e-con-inner) > .e-con:has(.elementor-widget-video) { border-top: 0; padding-top: 0 !important; }
@media (max-width: 767px) {
	:is(.e-con.jm-grid, .e-con.jm-grid > .e-con-inner) > .e-con,
	:is(.e-con.jm-grid--3, .e-con.jm-grid--3 > .e-con-inner) > .e-con { flex-basis: 100%; max-width: 100%; }
}

.jm-list ul { columns: 2; column-gap: 3rem; list-style: none; padding: 0; margin: 0; }
.jm-list li { break-inside: avoid; position: relative; padding: .5rem 0 .5rem 1.4rem; border-bottom: 1px solid var(--jm-line); color: var(--jm-white); }
.jm-list li::before { content: ""; position: absolute; left: 0; top: 1.1em; width: 6px; height: 6px; background: var(--jm-gold); transform: rotate(45deg); }
@media (max-width: 767px) { .jm-list ul { columns: 1; } }

.jm-faq .elementor-toggle-item { border-bottom: 1px solid var(--jm-line); margin: 0 !important; }
.jm-faq .elementor-toggle-item:first-child { border-top: 1px solid var(--jm-line); }
body .jm-faq .elementor-tab-title {
	display: flex; align-items: center; gap: 1rem; padding: 1.25rem 0 !important; border: 0 !important; background: none !important;
	font-family: var(--jm-serif); font-size: clamp(1.125rem, 1rem + .4vw, 1.375rem); font-weight: 600; line-height: 1.35;
}
body .jm-faq .elementor-tab-title a, body .jm-faq .elementor-toggle-title { color: var(--jm-white) !important; }
body .jm-faq .elementor-tab-title.elementor-active a, body .jm-faq .elementor-tab-title.elementor-active .elementor-toggle-title { color: var(--jm-gold) !important; }
body .jm-faq .elementor-toggle-icon { order: 2; margin-left: auto; color: var(--jm-gold) !important; font-size: .875rem; }
body .jm-faq .elementor-tab-content { border: 0 !important; padding: 0 0 1.75rem !important; color: var(--jm-grey); font: 300 1rem/1.8 var(--jm-sans); }
body .jm-faq .elementor-tab-content ul { padding-left: 1.2rem; }

.jm-img img { width: 100%; }
:is(.e-con.jm-tiles--flat, .e-con.jm-tiles--flat > .e-con-inner) > .jm-tile:nth-child(2) { margin-top: 0 !important; }

body .jm-faq .elementor-tab-title, body .jm-faq .elementor-tab-title .elementor-toggle-title {
	font-family: var(--jm-serif) !important; font-size: clamp(1.125rem, 1rem + .4vw, 1.375rem) !important; font-weight: 600 !important; line-height: 1.35 !important; letter-spacing: 0 !important;
}

/* Videorasters: verticale video's compacter (4 / 3 / 2 kolommen) */
:is(.e-con.jm-grid, .e-con.jm-grid > .e-con-inner):has(.elementor-widget-video) { gap: 16px !important; }
:is(.e-con.jm-grid, .e-con.jm-grid > .e-con-inner):has(.elementor-widget-video) > .e-con { flex: 1 1 calc(25% - 12px) !important; max-width: calc(25% - 12px) !important; }
@media (max-width: 1024px) { :is(.e-con.jm-grid, .e-con.jm-grid > .e-con-inner):has(.elementor-widget-video) > .e-con { flex-basis: calc(33.333% - 11px) !important; max-width: calc(33.333% - 11px) !important; } }
@media (max-width: 767px) { :is(.e-con.jm-grid, .e-con.jm-grid > .e-con-inner):has(.elementor-widget-video) > .e-con { flex-basis: calc(50% - 8px) !important; max-width: calc(50% - 8px) !important; } }

/* ==========================================================================
   Uniforme paginaheader subpagina's (jm-pagehero): sterke overloop naar zwart
   ========================================================================== */
.e-con.jm-pagehero { position: relative; isolation: isolate; }
.e-con.jm-pagehero::after {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background: linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.15) 22%, rgba(0,0,0,.25) 45%, rgba(0,0,0,.78) 72%, #000 94%);
}
.e-con.jm-pagehero > .e-con-inner, .e-con.jm-pagehero > .elementor-element { position: relative; z-index: 1; }
.e-con.jm-pagehero > .elementor-motion-effects-container {
	-webkit-mask-image: linear-gradient(180deg, #000 0%, #000 70%, transparent 100%);
	mask-image: linear-gradient(180deg, #000 0%, #000 70%, transparent 100%);
}

/* Panelen voor voorkeuren / grenzen */
.e-con.jm-panel { border: 1px solid var(--jm-line); border-top: 1px solid var(--jm-line-gold); background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,0) 60%); }
.e-con.jm-panel .jm-list ul { columns: 1; }
.e-con.jm-panel .jm-list li:last-child { border-bottom: 0; }

/* Meer lucht tussen tekstblokken */
.elementor-widget-text-editor p + p { margin-top: 1.1em; }
.jm-list li { padding-block: .6rem; }