/*
 * Mijnplein homepage — MOBILE Figma rebuild 3.10.0
 * Source of truth: Figma node 302:1789, 375 × 7963.
 * Mobile is a separate stacked composition, NOT a scaled desktop layout.
 */
:root{
	--mp-red:#E4032E;
	--mp-purple:#482974;
	--mp-blue:#1488CA;
	--mp-yellow:#F0AB21;
	--mp-light:#F0F0F0;
}
html,body{overflow-x:hidden!important}
.mp-figma-home{
	position:relative!important;
	width:100%!important;
	height:7146px!important;
	min-height:7146px!important;
	margin:0!important;
	padding:0!important;
	overflow:hidden!important;
	background:#fff!important;
	font-family:"KoHo",Arial,sans-serif!important;
}
.mp-figma-home *{box-sizing:border-box}
.mp-figma-home .mp-figma-inner{width:auto!important;max-width:none!important;margin:0!important}

/* --------------------------------------------------------------------------
   HEADER — Figma 302:1499, 375 × 98
   -------------------------------------------------------------------------- */
.mp-site-header{
	position:absolute!important;
	left:0!important;right:0!important;top:0!important;
	z-index:1000!important;
	height:98px!important;min-height:98px!important;
	margin:0!important;padding:0!important;
	background:linear-gradient(to bottom,rgba(0,0,0,.60),rgba(0,0,0,0))!important;
	border:0!important;box-shadow:none!important;
}
.admin-bar .mp-site-header{top:46px!important}
.mp-site-header .mp-brand-tab{
	position:absolute!important;
	left:0!important;top:0!important;
	width:172px!important;height:61px!important;
	margin:0!important;padding:0!important;border:0!important;
	background:transparent url("../images/mijnplein-logo-tab.png") no-repeat left top/172px 61px!important;
}
.mp-site-header .mp-brand-tab span{
	position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;
}
.mp-site-header .mp-primary-navigation{
	position:absolute!important;
	right:12px!important;top:10px!important;
	margin:0!important;padding:0!important;
}
.mp-site-header .mp-primary-navigation>.wp-block-navigation__container{display:none!important}
.mp-site-header .mp-primary-navigation .wp-block-navigation__responsive-container-open{
	display:flex!important;
	width:44px!important;height:44px!important;
	align-items:center!important;justify-content:center!important;
	margin:0!important;padding:0!important;
	background:#fff!important;color:#482974!important;
	border:0!important;border-radius:12px!important;
	box-shadow:none!important;
}
.mp-site-header .mp-primary-navigation .wp-block-navigation__responsive-container-open svg{
	width:22px!important;height:22px!important;
}

/* Opened navigation remains functional/editorial. */
.mp-site-header .wp-block-navigation__responsive-container.is-menu-open{
	padding:80px 20px 30px!important;
	background:#fff!important;color:#482974!important;
}
.mp-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{
	display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:8px!important;
}
.mp-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{
	color:#482974!important;font:600 22px/34px "KoHo",Arial,sans-serif!important;
}
.mp-site-header .mp-header-tools{
	width:100%!important;display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:12px!important;padding:14px 0!important;
}
.mp-site-header .mp-header-tools .mp-header-search__toggle{color:#482974!important;border:1px solid rgba(72,41,116,.2)!important}
.mp-site-header .mp-header-tools .mp-language-selector__current{color:#482974!important;border-color:#482974!important}
.mp-site-header .mp-header-vacancy-button{
	display:flex!important;align-items:center!important;justify-content:center!important;
	min-height:44px!important;padding:0 16px!important;
	background:#fff!important;color:#E4032E!important;border:1px solid rgba(228,3,46,.2)!important;border-radius:10px!important;
	text-decoration:none!important;font-weight:700!important;
}

/* --------------------------------------------------------------------------
   INTRO — Figma 302:1790, y 0, h 1233
   -------------------------------------------------------------------------- */
.mp-home-hero{
	position:absolute!important;
	left:0!important;top:0!important;
	width:100%!important;height:1233px!important;min-height:1233px!important;
	margin:0!important;padding:0!important;
	background:#F0F0F0!important;
	overflow:hidden!important;
}
.mp-home-hero__photo{
	position:absolute!important;left:0!important;top:0!important;
	width:100%!important;height:431px!important;min-height:0!important;
	background-image:var(--mp-hero-image)!important;
	background-size:cover!important;background-position:center!important;
}
.mp-home-hero__panels{
	position:absolute!important;left:0!important;top:0!important;
	width:375px!important;height:1233px!important;
	display:block!important;margin:0!important;padding:0!important;
}
.mp-home-hero__copy{
	position:absolute!important;
	left:0!important;top:334px!important;
	width:375px!important;height:445px!important;
	margin:0!important;padding:46px 20px 30px!important;
	background:#fff!important;
	border:0!important;border-radius:0 0 56px 0!important;
	clip-path:none!important;transform:none!important;box-shadow:none!important;
}
.mp-home-hero__copy:before{display:none!important}
.mp-home-hero__copy h1{
	width:335px!important;margin:0 0 18px!important;
	color:#E4032E!important;font:700 42px/44px "KoHo",Arial,sans-serif!important;
}
.mp-home-hero__copy p{
	width:335px!important;margin:0 0 18px!important;
	color:#000!important;font:400 16px/22px "KoHo",Arial,sans-serif!important;
}
.mp-home-hero__copy .mp-figma-actions{
	display:grid!important;grid-template-columns:1fr!important;gap:17px!important;
}
.mp-figma-button{
	display:flex!important;align-items:center!important;justify-content:center!important;
	width:335px!important;height:55px!important;min-height:55px!important;
	padding:0 15px!important;
	border:1.5px solid #1488CA!important;border-radius:8px!important;
	background:#1488CA!important;color:#fff!important;
	font:500 22px/22.4px "KoHo",Arial,sans-serif!important;text-decoration:none!important;
	box-shadow:none!important;
}
.mp-figma-button--ghost{background:#fff!important;color:#1488CA!important}
.mp-home-hero__slogan{
	position:absolute!important;
	left:30px!important;top:820px!important;
	width:406px!important;height:226px!important;
	margin:0!important;padding:60px 0 0 50px!important;
	background:linear-gradient(112deg,#E4032E 0%,#972064 46%,#482974 100%)!important;
	color:#fff!important;
	border-radius:44px 54px 44px 42px!important;
	transform:rotate(-2.4deg)!important;transform-origin:center!important;
	font:600 italic 38px/40px "KoHo",Arial,sans-serif!important;
}
.mp-home-quick{display:none!important}

/* --------------------------------------------------------------------------
   VISIE — Figma 302:1394, y 1065, h 1096
   -------------------------------------------------------------------------- */
.mp-home-vision{
	position:absolute!important;
	left:0!important;top:1065px!important;
	width:100%!important;height:1096px!important;min-height:1096px!important;
	margin:0!important;padding:0!important;
	background:#fff!important;overflow:hidden!important;
}
.mp-home-vision__grey{
	position:absolute!important;
	left:0!important;top:235px!important;
	width:100%!important;height:861px!important;
	background:#F0F0F0!important;
	clip-path:polygon(0 6%,100% 0,100% 91%,0 100%)!important;
	z-index:0!important;
}
.mp-home-vision>.mp-figma-inner{
	position:absolute!important;left:0!important;top:0!important;
	width:375px!important;height:1096px!important;display:block!important;z-index:1!important;
}
.mp-home-vision__visual{
	position:absolute!important;left:20px!important;top:40px!important;
	width:335px!important;height:249px!important;margin:0!important;
}
.mp-home-vision__visual img{
	display:block!important;width:335px!important;height:249px!important;object-fit:cover!important;
	box-shadow:0 12px 24px rgba(0,0,0,.12)!important;
}
.mp-home-vision blockquote{
	position:absolute!important;left:20px!important;top:346px!important;
	width:335px!important;margin:0!important;padding:0!important;
	color:#482974!important;font:700 32px/34px "KoHo",Arial,sans-serif!important;
}
.mp-home-vision__copy{
	position:absolute!important;left:20px!important;top:480px!important;
	width:335px!important;margin:0!important;padding:0!important;
}
.mp-home-vision__copy:before{display:none!important}
.mp-home-vision__copy p{
	margin:0 0 19.6px!important;color:#000!important;font:400 16px/22px "KoHo",Arial,sans-serif!important;
}
.mp-home-vision__copy a{color:#1488CA!important;font:400 16px/22px "KoHo",Arial,sans-serif!important;text-decoration:none!important}
.mp-home-vision__heading{
	position:absolute!important;left:20px!important;top:914px!important;width:335px!important;margin:0!important;
}
.mp-home-vision__heading h2{
	margin:0!important;color:#E4032E!important;font:700 36px/40px "KoHo",Arial,sans-serif!important;
}

/* --------------------------------------------------------------------------
   WERKEN BIJ — Figma 302:1393, y 2099, h 1096
   -------------------------------------------------------------------------- */
.mp-home-work{
	position:absolute!important;
	left:0!important;top:2099px!important;
	width:100%!important;height:1096px!important;min-height:1096px!important;
	margin:0!important;padding:0!important;background:#fff!important;overflow:hidden!important;
}
.mp-home-work__decor{position:absolute!important;inset:0!important;display:block!important;z-index:0!important}
.mp-home-work__purple{
	position:absolute!important;
	left:-220px!important;top:52px!important;width:555px!important;height:300px!important;
	background:linear-gradient(110deg,#482974,#8C1C6B 56%,#E4032E)!important;
	border-radius:46px 68px 50px 40px!important;transform:rotate(2deg)!important;
}
.mp-home-work__red{display:none!important}
.mp-home-work__yellow{
	position:absolute!important;
	left:0!important;top:702px!important;width:375px!important;height:338px!important;
	background:#F0AB21!important;border-radius:0 64px 56px 0!important;transform:rotate(-2deg)!important;
}
.mp-home-work__shape{
	position:absolute!important;left:0!important;top:0!important;
	width:375px!important;height:1096px!important;min-height:0!important;
	margin:0!important;padding:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important;transform:none!important;z-index:1!important;
}
.mp-home-work__shape:before{
	content:""!important;position:absolute!important;
	left:20px!important;top:606px!important;width:335px!important;height:370px!important;
	background:#fff!important;border-radius:10px!important;z-index:1!important;
}
.mp-home-work__visual{
	position:absolute!important;left:41px!important;top:106px!important;width:294px!important;height:247px!important;margin:0!important;z-index:2!important;
}
.mp-home-work__visual img{
	display:block!important;width:294px!important;height:247px!important;object-fit:cover!important;
	box-shadow:0 12px 24px rgba(0,0,0,.12)!important;
}
.mp-home-work__copy{
	position:absolute!important;left:38px!important;top:0!important;width:298px!important;height:1096px!important;margin:0!important;padding:0!important;z-index:3!important;
}
.mp-home-work .mp-figma-kicker{
	position:absolute!important;left:2px!important;top:375px!important;width:300px!important;
	margin:0!important;color:#E4032E!important;font:600 italic 42px/44px "KoHo",Arial,sans-serif!important;
}
.mp-home-work__copy h2{
	position:absolute!important;left:0!important;top:480px!important;width:300px!important;
	margin:0!important;color:#482974!important;font:700 32px/34px "KoHo",Arial,sans-serif!important;
}
.mp-home-work__copy p{
	position:absolute!important;left:0!important;top:606px!important;width:298px!important;
	margin:0!important;color:#000!important;font:400 16px/22px "KoHo",Arial,sans-serif!important;
}
.mp-home-work__copy .mp-figma-actions{
	position:absolute!important;left:2px!important;top:795px!important;
	display:grid!important;grid-template-columns:1fr!important;gap:17px!important;
}
.mp-home-work__copy .mp-figma-button{width:294px!important}

/* --------------------------------------------------------------------------
   RECENTE VACATURES — Figma 302:1392, y 3190, h 1016
   -------------------------------------------------------------------------- */
.mp-home-vacancies{
	position:absolute!important;
	left:0!important;top:3190px!important;
	width:100%!important;height:1016px!important;min-height:1016px!important;
	margin:0!important;padding:0!important;background:#fff!important;overflow:hidden!important;
}
.mp-home-vacancies>.mp-figma-inner{position:relative!important;width:375px!important;height:1016px!important;margin:0!important}
.mp-home-vacancies h2{
	position:absolute!important;left:0!important;top:39px!important;width:375px!important;
	margin:0!important;color:#E4032E!important;text-align:center!important;
	font:600 italic 42px/44px "KoHo",Arial,sans-serif!important;
}
.mp-home-vacancies .mp-vacancy-slider{
	position:absolute!important;left:0!important;top:108px!important;width:375px!important;height:686px!important;margin:0!important;
}
.mp-home-vacancies .mp-vacancy-slider__viewport{
	width:375px!important;height:548px!important;padding:0!important;overflow:hidden!important;
}
.mp-home-vacancies .mp-vacancy-slider__track{
	display:flex!important;gap:20px!important;align-items:flex-start!important;
}
.mp-home-vacancies .mp-figma-vacancy{
	position:relative!important;flex:0 0 375px!important;width:375px!important;height:548px!important;min-height:548px!important;
	margin:0!important;padding:0!important;
	background:linear-gradient(to bottom,transparent 0 96px,#F0F0F0 96px 100%)!important;
	border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important;
}
.mp-home-vacancies .mp-figma-vacancy__media{
	position:static!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;overflow:visible!important;
}
.mp-home-vacancies .mp-figma-card-image{
	position:absolute!important;left:20px!important;top:0!important;
	width:335px!important;height:335px!important;min-width:335px!important;min-height:335px!important;max-width:335px!important;max-height:335px!important;
	aspect-ratio:1/1!important;margin:0!important;overflow:hidden!important;
	box-shadow:0 12px 22px rgba(0,0,0,.12)!important;
}
.mp-home-vacancies .mp-figma-card-image img{
	display:block!important;width:335px!important;height:335px!important;max-width:none!important;object-fit:cover!important;
}
.mp-home-vacancies .mp-figma-vacancy__status{
	position:absolute!important;left:21px!important;top:388px!important;right:auto!important;bottom:auto!important;
	display:inline-flex!important;align-items:center!important;
	width:auto!important;height:40px!important;min-height:40px!important;
	margin:0!important;padding:7px 14px!important;
	background:#E4032E!important;color:#fff!important;border-radius:200px!important;
	font:700 18px/26px "KoHo",Arial,sans-serif!important;white-space:nowrap!important;z-index:3!important;
}
.mp-home-vacancies .mp-figma-vacancy__body{
	position:absolute!important;left:20px!important;right:20px!important;top:437px!important;
	margin:0!important;padding:0!important;
}
.mp-home-vacancies .mp-figma-vacancy__body h3{
	margin:0!important;color:#482974!important;font:700 24px/28px "KoHo",Arial,sans-serif!important;
}
.mp-home-vacancies .mp-figma-vacancy__meta{
	margin:0!important;color:#482974!important;font:500 24px/28px "KoHo",Arial,sans-serif!important;
}
.mp-home-vacancies .mp-figma-vacancy__excerpt{
	margin:17px 0 0!important;color:#000!important;font:400 16px/22px "KoHo",Arial,sans-serif!important;
}
.mp-home-vacancies .mp-figma-vacancy__body>a{
	color:#1488CA!important;font:400 16px/22px "KoHo",Arial,sans-serif!important;text-decoration:none!important;
}
.mp-home-vacancies .mp-vacancy-slider__controls{
	position:absolute!important;left:0!important;top:680px!important;width:375px!important;
	display:flex!important;justify-content:center!important;gap:38px!important;margin:0!important;
}
.mp-home-vacancies .mp-vacancy-slider__controls button{
	width:42px!important;height:42px!important;border-radius:50%!important;border:0!important;background:#fff!important;color:#1488CA!important;
	box-shadow:0 0 18px rgba(0,0,0,.08)!important;
}
.mp-home-vacancies .mp-home-center{
	position:absolute!important;left:20px!important;top:891px!important;width:335px!important;margin:0!important;text-align:center!important;
}
.mp-home-vacancies .mp-home-center .mp-figma-button{width:335px!important;margin:0!important}

/* --------------------------------------------------------------------------
   LOCATIES — Figma 302:1391, y 4206, h 1770
   -------------------------------------------------------------------------- */
.mp-home-locations{
	position:absolute!important;
	left:0!important;top:4206px!important;
	width:100%!important;height:1770px!important;min-height:1770px!important;
	margin:0!important;padding:0!important;background:#fff!important;overflow:hidden!important;
}
.mp-home-locations__heading{
	position:absolute!important;left:0!important;top:39px!important;width:375px!important;text-align:center!important;z-index:3!important;
}
.mp-home-locations__heading .mp-figma-kicker{
	display:block!important;margin:0!important;color:#E4032E!important;font:600 italic 42px/44px "KoHo",Arial,sans-serif!important;
}
.mp-home-locations__heading h2{
	margin:25px 0 0!important;color:#482974!important;font:700 32px/34px "KoHo",Arial,sans-serif!important;
}
.mp-location-stage--real{
	position:absolute!important;left:0!important;top:202px!important;width:375px!important;height:574px!important;
	margin:0!important;padding:0!important;background:#eee!important;overflow:hidden!important;
}
.mp-real-map{width:375px!important;height:574px!important}
.mp-location-feature{
	position:absolute!important;left:54px!important;top:72px!important;width:268px!important;
	background:#E4032E!important;color:#fff!important;z-index:650!important;overflow:visible!important;
}
.mp-location-feature__image{width:268px!important;height:185px!important;overflow:hidden!important}
.mp-location-feature__image img{width:100%!important;height:100%!important;object-fit:cover!important}
.mp-location-feature__body{
	position:relative!important;min-height:115px!important;padding:12px 15px!important;background:#E4032E!important;color:#fff!important;
}
.mp-location-feature__body:after{
	content:""!important;position:absolute!important;left:0!important;bottom:-32px!important;
	border-top:32px solid #E4032E!important;border-right:32px solid transparent!important;
}
.mp-location-feature h3{margin:2px 0!important;color:#fff!important;font:700 19px/26px "KoHo",Arial,sans-serif!important}
.mp-location-feature p,.mp-location-feature .mp-figma-kicker{margin:0!important;color:#fff!important;font:500 12px/17px "KoHo",Arial,sans-serif!important}
.mp-location-feature a{
	position:absolute!important;right:14px!important;bottom:21px!important;width:42px!important;height:42px!important;
	display:grid!important;place-items:center!important;border-radius:50%!important;background:#fff!important;color:#1488CA!important;text-decoration:none!important;
}
.mp-location-legend{
	position:absolute!important;left:20px!important;right:20px!important;bottom:22px!important;
	display:grid!important;grid-template-columns:1fr!important;gap:10px!important;
	padding:10px 18px!important;background:#fff!important;border-radius:20px!important;
	box-shadow:0 0 20px rgba(0,0,0,.18)!important;font:500 19px/26px "KoHo",Arial,sans-serif!important;z-index:650!important;
}
.mp-location-legend button{
	display:flex!important;align-items:center!important;gap:10px!important;border:0!important;background:none!important;padding:0!important;font:inherit!important;text-align:left!important;
}
.mp-location-legend button span{width:32px!important;height:32px!important;border-radius:50%!important;background:#E4032E!important}
.mp-location-legend button[data-location-filter="combined"] span{background:#F0AB21!important}
.mp-location-details-wrap{
	position:absolute!important;left:0!important;top:776px!important;width:375px!important;height:994px!important;
	margin:0!important;padding:0 20px!important;background:#fff!important;overflow:hidden!important;z-index:5!important;
}
.mp-location-details-wrap:before{display:none!important}
.mp-location-details{
	position:relative!important;left:auto!important;top:auto!important;
	width:335px!important;height:994px!important;margin:0 auto!important;padding:65px 0 0!important;
	display:block!important;background:#fff!important;
}
.mp-location-details__title{display:none!important}
.mp-location-list{columns:1!important;column-gap:0!important}
.mp-location-list h3{
	margin:0 0 29px!important;color:#482974!important;font:700 24px/28px "KoHo",Arial,sans-serif!important;
}
.mp-location-list .mp-location-list__item{
	display:block!important;width:100%!important;margin:0 0 19.6px!important;padding:0!important;
	border:0!important;background:transparent!important;text-align:left!important;
	color:#000!important;font:500 16px/20px "KoHo",Arial,sans-serif!important;
}
.mp-location-list .mp-location-list__item strong{color:#1488CA!important;font-weight:700!important}
.mp-location-list .mp-location-list__item span{color:#000!important;font-weight:500!important}
.mp-location-list .mp-location-list__item.is-active strong{color:#E4032E!important}
.mp-location-office{
	position:absolute!important;left:0!important;top:720px!important;width:335px!important;margin:0!important;padding:0!important;
}
.mp-location-office h3{
	margin:0 0 28px!important;color:#482974!important;font:700 24px/28px "KoHo",Arial,sans-serif!important;
}
.mp-location-office p{
	margin:0 0 19.6px!important;color:#000!important;font:500 18px/24px "KoHo",Arial,sans-serif!important;
}

/* --------------------------------------------------------------------------
   SLUIT JE AAN — Figma 302:1390, y 5976, h 1138
   -------------------------------------------------------------------------- */
.mp-home-join{
	position:absolute!important;
	left:0!important;top:5976px!important;
	width:100%!important;height:1138px!important;min-height:1138px!important;
	margin:0!important;padding:0!important;background:#fff!important;overflow:hidden!important;
}
.mp-home-join:before{
	content:""!important;position:absolute!important;left:0!important;top:64px!important;
	width:100%!important;height:1074px!important;background:#F0F0F0!important;
	clip-path:polygon(0 6%,100% 0,100% 91%,0 100%)!important;
}
.mp-home-join>.mp-figma-inner{
	position:absolute!important;left:0!important;top:0!important;width:375px!important;height:1138px!important;display:block!important;z-index:1!important;
}
.mp-home-join__visual{
	position:absolute!important;left:20px!important;top:121px!important;width:335px!important;margin:0!important;
}
.mp-home-join__visual img{
	display:block!important;width:335px!important;height:298px!important;object-fit:cover!important;box-shadow:0 12px 22px rgba(0,0,0,.12)!important;
}
.mp-home-join__visual blockquote{
	position:absolute!important;left:0!important;top:331px!important;width:335px!important;
	margin:0!important;color:#E4032E!important;font:700 32px/34px "KoHo",Arial,sans-serif!important;
}
.mp-home-join__copy{
	position:absolute!important;left:20px!important;top:612px!important;width:335px!important;margin:0!important;padding:0!important;
}
.mp-home-join__copy h2{
	margin:0 0 28px!important;color:#482974!important;font:700 32px/34px "KoHo",Arial,sans-serif!important;
}
.mp-home-join__copy p{
	margin:0 0 19.6px!important;color:#000!important;font:400 16px/22px "KoHo",Arial,sans-serif!important;
}
.mp-home-join__copy .mp-figma-button{
	position:absolute!important;left:0!important;top:410px!important;width:335px!important;margin:0!important;
}

/* --------------------------------------------------------------------------
   FOOTER — Figma 302:1613, 375 × 817
   Exact diagonal strip/logo artwork from supplied mobile Figma/PDF.
   -------------------------------------------------------------------------- */
.mp-site-footer{
	position:relative!important;
	width:100%!important;height:817px!important;min-height:817px!important;
	margin:0!important;padding:0!important;background:#482974!important;color:#fff!important;overflow:hidden!important;
}
.mp-site-footer:before{
	content:""!important;
	position:absolute!important;left:50%!important;top:0!important;z-index:1!important;
	width:375px!important;height:82px!important;transform:translateX(-50%)!important;
	background:url("../images/footer-top-mobile-figma.png") no-repeat center top/375px 82px!important;
	clip-path:none!important;
}
.mp-site-footer:after{display:none!important}
.mp-site-footer .mp-footer-tab{display:none!important}
.mp-site-footer .mp-footer-columns{
	position:absolute!important;
	left:20px!important;top:88px!important;
	width:335px!important;height:729px!important;
	margin:0!important;padding:0!important;display:block!important;z-index:2!important;
}
.mp-site-footer .mp-footer-columns>div{
	position:absolute!important;left:0!important;width:335px!important;margin:0!important;padding:0!important;
}
.mp-site-footer .mp-footer-columns>div:nth-child(1){top:0!important}
.mp-site-footer .mp-footer-columns>div:nth-child(2){top:95px!important}
.mp-site-footer .mp-footer-columns>div:nth-child(3){top:455px!important}
.mp-site-footer .mp-footer-columns h3{
	margin:0 0 0!important;color:#fff!important;font:700 18px/24px "KoHo",Arial,sans-serif!important;
}
.mp-site-footer .mp-footer-columns p,
.mp-site-footer .mp-footer-columns a{
	margin:0!important;color:#fff!important;font:500 18px/24px "KoHo",Arial,sans-serif!important;text-decoration:none!important;
}
.mp-site-footer .mp-footer-columns>div:nth-child(2) h3:nth-of-type(2){margin-top:24px!important}
.mp-site-footer .mp-footer-social{
	position:absolute!important;left:0!important;top:219px!important;
	display:flex!important;gap:12px!important;margin:0!important;
}
.mp-site-footer .mp-footer-social a{
	display:grid!important;place-items:center!important;width:39px!important;height:39px!important;border:2px solid #fff!important;border-radius:50%!important;
	font:700 16px/1 Arial,sans-serif!important;
}
.mp-site-footer .mp-footer-privacy{
	position:absolute!important;left:0!important;top:386px!important;display:block!important;
	font:500 18px/24px "KoHo",Arial,sans-serif!important;color:#fff!important;
}
.mp-site-footer .mp-footer-navigation{
	margin:12px 0 0!important;padding:0!important;
}
.mp-site-footer .mp-footer-navigation .wp-block-navigation__container{
	display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:0!important;
}
.mp-site-footer .mp-footer-navigation .wp-block-navigation-item{
	position:relative!important;padding-left:22px!important;margin:0!important;
}
.mp-site-footer .mp-footer-navigation .wp-block-navigation-item:before{
	content:"›"!important;position:absolute!important;left:0!important;top:0!important;color:#F0AB21!important;font-size:24px!important;line-height:34px!important;
}
.mp-site-footer .mp-footer-navigation .wp-block-navigation-item__content{
	padding:0!important;color:#fff!important;font:500 18px/34px "KoHo",Arial,sans-serif!important;
}


/* ==========================================================================
   3.10.1 — mobiele correcties na vergelijking live screenshots ↔ Figma 302:1789
   ========================================================================== */

/* Gebruik de echte viewportbreedte; 375px blijft de ontwerpreferentie. */
.mp-figma-home,
.mp-home-hero,
.mp-home-vision,
.mp-home-work,
.mp-home-vacancies,
.mp-home-locations,
.mp-home-join{
	width:100% !important;
	max-width:100% !important;
}

/* WERKEN BIJ
   De witte kaart en knoppen blijven binnen 20px zijmarge, zoals Figma. */
.mp-home-work__shape{
	width:100% !important;
}
.mp-home-work__shape:before{
	left:20px !important;
	right:20px !important;
	width:auto !important;
}
.mp-home-work__copy{
	left:calc(10.13% + 0px) !important;
	width:79.47% !important;
}
.mp-home-work__visual{
	left:10.67% !important;
	width:78.4% !important;
}
.mp-home-work__visual img{
	width:100% !important;
}
.mp-home-work__copy .mp-figma-actions{
	left:0 !important;
	width:100% !important;
}
.mp-home-work__copy .mp-figma-button{
	width:100% !important;
}

/* VACATURES
   Figma gebruikt een vierkante foto zonder afgeronde beeldhoeken.
   De grijze kaart is recht aan de bovenkant en loopt over de volle 375px. */
.mp-home-vacancies .mp-figma-card-image{
	border-radius:0 !important;
}
.mp-home-vacancies .mp-figma-card-image img{
	border-radius:0 !important;
}
.mp-home-vacancies .mp-figma-vacancy{
	border-radius:0 !important;
	background:linear-gradient(to bottom,transparent 0 96px,#F0F0F0 96px 100%) !important;
}
.mp-home-vacancies .mp-vacancy-slider,
.mp-home-vacancies .mp-vacancy-slider__viewport,
.mp-home-vacancies .mp-vacancy-slider__track,
.mp-home-vacancies .mp-figma-vacancy{
	width:100% !important;
}
.mp-home-vacancies .mp-figma-card-image{
	left:5.33% !important;
	width:89.34% !important;
	max-width:none !important;
}
.mp-home-vacancies .mp-figma-card-image img{
	width:100% !important;
	max-width:none !important;
}
.mp-home-vacancies .mp-figma-vacancy__status{
	left:5.6% !important;
}
.mp-home-vacancies .mp-figma-vacancy__body{
	left:5.33% !important;
	right:5.33% !important;
}
.mp-home-vacancies .mp-home-center{
	left:5.33% !important;
	width:89.34% !important;
}
.mp-home-vacancies .mp-home-center .mp-figma-button{
	width:100% !important;
}

/* LOCATIES
   In Figma hebben de regels 12px line-height + 19.6px onderlinge ruimte.
   Daardoor eindigt de volledige lijst vóór Bestuurskantoor. */
.mp-location-details{
	width:89.34% !important;
}
.mp-location-list .mp-location-list__item{
	line-height:12px !important;
	margin-bottom:19.6px !important;
	min-height:12px !important;
}
.mp-location-list .mp-location-list__item strong,
.mp-location-list .mp-location-list__item span{
	line-height:12px !important;
}
.mp-location-office{
	top:720px !important;
}

/* De kaart en geselecteerde kaart volgen de 375px Figma-verhoudingen,
   maar schalen netjes mee op smallere/bredere telefoons. */
.mp-location-stage--real,
.mp-real-map{
	width:100% !important;
}
.mp-location-feature{
	left:14.36% !important;
	width:71.28% !important;
}
.mp-location-feature__image{
	width:100% !important;
}
.mp-location-details-wrap{
	width:100% !important;
	padding-left:5.33% !important;
	padding-right:5.33% !important;
}

/* SLUIT JE AAN */
.mp-home-join>.mp-figma-inner{
	width:100% !important;
}
.mp-home-join__visual,
.mp-home-join__copy{
	left:5.33% !important;
	width:89.34% !important;
}
.mp-home-join__visual img{
	width:100% !important;
}
.mp-home-join__copy .mp-figma-button{
	width:100% !important;
}

/* FOOTER
   Exacte verticale Figma-posities:
   contact y=88, adressen y=183, socials y=395, privacy y=474,
   snelmenu y=543. */
.mp-site-footer .mp-footer-columns{
	left:5.33% !important;
	top:88px !important;
	width:89.34% !important;
}
.mp-site-footer .mp-footer-columns>div{
	width:100% !important;
}
.mp-site-footer .mp-footer-social{
	top:307px !important; /* 88 + 307 = 395 */
}
.mp-site-footer .mp-footer-privacy{
	top:386px !important; /* 88 + 386 = 474 */
}
.mp-site-footer .mp-footer-columns>div:nth-child(3){
	top:455px !important; /* 88 + 455 = 543 */
}
.mp-site-footer .mp-footer-navigation{
	margin-top:12px !important;
}

.mp-site-footer .mp-footer-social span{
	display:grid !important;
	place-items:center !important;
	width:39px !important;
	height:39px !important;
	border:2px solid #fff !important;
	border-radius:50% !important;
	color:#fff !important;
	font:700 16px/1 Arial,sans-serif !important;
}


/* ==========================================================================
   3.10.2 — footer exact op Figma node 302:1613
   Figma frame: 375 × 817
   Purple starts at y=62. Contact y=88. Adressen y=183.
   Socials y=395. Privacy y=474. Quick menu y=543.
   ========================================================================== */

/* Generic content pages had ~110px bottom padding, causing the large white
   gap visible before the footer on mobile. */
.mp-figma-content-body{
	padding-bottom:24px !important;
}
.mp-pdf-content-page,
.mp-figma-content-page--strict{
	margin-bottom:0 !important;
	padding-bottom:0 !important;
}

/* Footer root: first 62px is transparent/white artwork zone;
   purple body starts exactly at y=62. */
.mp-site-footer{
	position:relative !important;
	width:100% !important;
	height:817px !important;
	min-height:817px !important;
	margin:0 !important;
	padding:0 !important;
	background:
		linear-gradient(to bottom,
			transparent 0,
			transparent 62px,
			#482974 62px,
			#482974 100%) !important;
	color:#fff !important;
	overflow:hidden !important;
}

/* Exact Figma diagonal red→purple strip: y=20..82. */
.mp-site-footer:before{
	content:"" !important;
	position:absolute !important;
	left:0 !important;
	top:20px !important;
	width:100% !important;
	height:62px !important;
	z-index:1 !important;
	transform:none !important;
	background:linear-gradient(100deg,#E4032E 0%,#C11055 48%,#482974 100%) !important;
	clip-path:polygon(0 0,55% 18%,100% 34%,100% 100%,0 100%) !important;
}

/* Logo tab is a separate Figma element: x≈200, y=0, 175×62. */
.mp-site-footer .mp-footer-tab{
	display:block !important;
	position:absolute !important;
	right:0 !important;
	top:0 !important;
	width:175px !important;
	height:62px !important;
	margin:0 !important;
	padding:0 !important;
	z-index:3 !important;
	background:#E4032E url("../images/mijnplein-wordmark.png") no-repeat center 19px / 112px auto !important;
	border:0 !important;
	border-radius:18px 0 0 0 !important;
	clip-path:polygon(7% 0,100% 7%,100% 100%,0 100%,0 34%,4% 10%) !important;
	font-size:0 !important;
	line-height:0 !important;
}

/* Footer content is positioned directly in the 817px Figma frame. */
.mp-site-footer .mp-footer-columns{
	position:absolute !important;
	left:20px !important;
	top:0 !important;
	width:335px !important;
	height:817px !important;
	margin:0 !important;
	padding:0 !important;
	display:block !important;
	z-index:2 !important;
}

.mp-site-footer .mp-footer-columns>div{
	position:absolute !important;
	left:0 !important;
	width:335px !important;
	margin:0 !important;
	padding:0 !important;
}

/* Contact — y=88 */
.mp-site-footer .mp-footer-columns>div:nth-child(1){
	top:88px !important;
}

/* Bezoekadres/Postadres — y=183 */
.mp-site-footer .mp-footer-columns>div:nth-child(2){
	top:183px !important;
}

/* Ga snel naar — y=543 */
.mp-site-footer .mp-footer-columns>div:nth-child(3){
	top:543px !important;
}

.mp-site-footer .mp-footer-columns h3{
	margin:0 !important;
	padding:0 !important;
	color:#fff !important;
	font-family:"KoHo",Arial,sans-serif !important;
	font-size:18px !important;
	font-weight:700 !important;
	line-height:24px !important;
}

.mp-site-footer .mp-footer-columns p,
.mp-site-footer .mp-footer-columns a{
	margin:0 !important;
	padding:0 !important;
	color:#fff !important;
	font-family:"KoHo",Arial,sans-serif !important;
	font-size:18px !important;
	font-weight:500 !important;
	line-height:24px !important;
	text-decoration:none !important;
}

/* Space between Bezoekadres and Postadres in Figma = one 24px line. */
.mp-site-footer .mp-footer-columns>div:nth-child(2) h3:nth-of-type(2){
	margin-top:24px !important;
}

/* Social icons — y=395, x=20 and x=72 */
.mp-site-footer .mp-footer-social{
	position:fixed !important; /* reset below immediately; beats old nested offsets */
}
.mp-site-footer .mp-footer-columns>div:nth-child(1) .mp-footer-social{
	position:absolute !important;
	left:0 !important;
	top:307px !important; /* 88 + 307 = 395 */
	display:flex !important;
	gap:13px !important;
	width:auto !important;
	height:40px !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-site-footer .mp-footer-social a,
.mp-site-footer .mp-footer-social span{
	display:grid !important;
	place-items:center !important;
	width:39px !important;
	height:40px !important;
	margin:0 !important;
	padding:0 !important;
	border:2px solid #fff !important;
	border-radius:50% !important;
	background:transparent !important;
	color:#fff !important;
	font:700 16px/1 Arial,sans-serif !important;
}

/* Privacy — y=474. */
.mp-site-footer .mp-footer-columns>div:nth-child(1) .mp-footer-privacy{
	position:absolute !important;
	left:0 !important;
	top:386px !important; /* 88 + 386 = 474 */
	display:block !important;
	margin:0 !important;
	padding-left:18px !important;
	font:500 18px/24px "KoHo",Arial,sans-serif !important;
}
.mp-site-footer .mp-footer-privacy:before{
	content:"›" !important;
	position:absolute !important;
	left:0 !important;
	top:0 !important;
	color:#F0AB21 !important;
	font-size:27px !important;
	line-height:21px !important;
}
.mp-site-footer .mp-footer-privacy{
	font-size:0 !important;
}
.mp-site-footer .mp-footer-privacy::after{
	content:"Privacyverklaring" !important;
	font:500 18px/24px "KoHo",Arial,sans-serif !important;
	color:#fff !important;
}

/* Quick menu: heading y=543, links start y≈573, line-height 34. */
.mp-site-footer .mp-footer-navigation{
	margin:12px 0 0 !important;
	padding:0 !important;
}
.mp-site-footer .mp-footer-navigation .wp-block-navigation__container{
	display:flex !important;
	flex-direction:column !important;
	align-items:flex-start !important;
	gap:0 !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-site-footer .mp-footer-navigation .wp-block-navigation-item{
	position:relative !important;
	min-height:34px !important;
	margin:0 !important;
	padding:0 0 0 18px !important;
}
.mp-site-footer .mp-footer-navigation .wp-block-navigation-item:before{
	content:"›" !important;
	position:absolute !important;
	left:0 !important;
	top:0 !important;
	color:#F0AB21 !important;
	font-size:27px !important;
	line-height:30px !important;
}
.mp-site-footer .mp-footer-navigation .wp-block-navigation-item__content{
	display:block !important;
	margin:0 !important;
	padding:0 !important;
	color:#fff !important;
	font:500 18px/34px "KoHo",Arial,sans-serif !important;
}

/* No historical footer transforms or inherited padding. */
.mp-site-footer *{
	box-sizing:border-box !important;
}


/* ==========================================================================
   3.10.3 — MOBILE CSS isolation / conflict cleanup
   The old master CSS still contains historical mobile pseudo-elements and
   background surfaces. On mobile this file is authoritative: every coloured
   shape must come from exactly one Figma layer.
   ========================================================================== */

/* Neutralise legacy pseudo-elements that otherwise create duplicate colour
   bands behind the explicit 3.10.x mobile layers. */
.mp-figma-home .mp-home-hero::before,
.mp-figma-home .mp-home-hero::after,
.mp-figma-home .mp-home-vision::before,
.mp-figma-home .mp-home-vision::after,
.mp-figma-home .mp-home-work::before,
.mp-figma-home .mp-home-work::after,
.mp-figma-home .mp-home-vacancies::before,
.mp-figma-home .mp-home-vacancies::after,
.mp-figma-home .mp-home-locations::before,
.mp-figma-home .mp-home-locations::after,
.mp-figma-home .mp-home-join::after{
	content:none !important;
	display:none !important;
	background:none !important;
}

/* The join section intentionally uses only its own single grey vector-like
   ::before layer from view-mobile.css. */
.mp-figma-home .mp-home-join::before{
	content:"" !important;
	display:block !important;
}

/* Working section: only the explicit purple and yellow decor spans may draw
   colour. Prevent historical background/gradient fills on container layers. */
.mp-figma-home .mp-home-work,
.mp-figma-home .mp-home-work__decor,
.mp-figma-home .mp-home-work__shape,
.mp-figma-home .mp-home-work__copy{
	background-color:transparent !important;
	background-image:none !important;
}
.mp-figma-home .mp-home-work{
	background:#fff !important;
}
.mp-figma-home .mp-home-work__purple{
	background:linear-gradient(110deg,#482974 0%,#8C1C6B 56%,#E4032E 100%) !important;
}
.mp-figma-home .mp-home-work__yellow{
	background:#F0AB21 !important;
}
.mp-figma-home .mp-home-work__red{
	display:none !important;
}

/* Vision: one white section + one grey vector plane only. */
.mp-figma-home .mp-home-vision{
	background:#fff !important;
}
.mp-figma-home .mp-home-vision__grey{
	background:#F0F0F0 !important;
}

/* Vacancies: one light-grey card plane; no inherited section colour. */
.mp-figma-home .mp-home-vacancies{
	background:#fff !important;
}
.mp-figma-home .mp-figma-vacancy{
	background:linear-gradient(to bottom,transparent 0 96px,#F0F0F0 96px 100%) !important;
}

/* Locations: map + one white information area, no legacy coloured bands. */
.mp-figma-home .mp-home-locations,
.mp-figma-home .mp-location-details-wrap,
.mp-figma-home .mp-location-details{
	background:#fff !important;
}
.mp-figma-home .mp-location-details-wrap::before,
.mp-figma-home .mp-location-details-wrap::after,
.mp-figma-home .mp-location-details::before,
.mp-figma-home .mp-location-details::after{
	content:none !important;
	display:none !important;
}

/* Hero: only photo, white copy card and one red→purple slogan shape. */
.mp-figma-home .mp-home-hero{
	background:#F0F0F0 !important;
}
.mp-figma-home .mp-home-hero__copy{
	background:#fff !important;
}
.mp-figma-home .mp-home-hero__copy::before,
.mp-figma-home .mp-home-hero__copy::after,
.mp-figma-home .mp-home-hero__slogan::before,
.mp-figma-home .mp-home-hero__slogan::after{
	content:none !important;
	display:none !important;
}
.mp-figma-home .mp-home-hero__slogan{
	background:linear-gradient(112deg,#E4032E 0%,#972064 46%,#482974 100%) !important;
}

/* Footer is not part of .mp-figma-home. Remove all historic footer graphics;
   3.10.2/3.10.3 creates exactly one diagonal strip and one logo tab. */
.mp-site-footer::after{
	content:none !important;
	display:none !important;
}
.mp-site-footer .mp-footer-tab::before,
.mp-site-footer .mp-footer-tab::after{
	content:none !important;
	display:none !important;
}

/* Guarantee the mobile page itself never receives old section padding. */
@media (max-width:899px){
	.mp-figma-home .mp-home-hero,
	.mp-figma-home .mp-home-vision,
	.mp-figma-home .mp-home-work,
	.mp-figma-home .mp-home-vacancies,
	.mp-figma-home .mp-home-locations,
	.mp-figma-home .mp-home-join{
		padding-left:0 !important;
		padding-right:0 !important;
		padding-bottom:0 !important;
	}
}



/* 3.10.4 — exact Figma 302:1393 */
.mp-figma-home .mp-home-work{
 position:absolute!important;left:0!important;top:2099px!important;width:100%!important;height:1096px!important;
 margin:0!important;padding:0!important;background:#fff!important;overflow:hidden!important
}
.mp-figma-home .mp-home-work__decor{position:absolute!important;inset:0!important;z-index:0!important;background:transparent!important}
.mp-figma-home .mp-home-work__purple{
 position:absolute!important;left:-58.67%!important;top:4.74%!important;right:10.67%!important;width:auto!important;height:26.37%!important;
 background:linear-gradient(110deg,#482974 0%,#9B1D69 56%,#E4032E 100%)!important;border-radius:0 48px 48px 0!important;
 transform:rotate(1.8deg)!important;display:block!important
}
.mp-figma-home .mp-home-work__red{display:none!important}
.mp-figma-home .mp-home-work__yellow{
 position:absolute!important;left:0!important;top:64.05%!important;right:.27%!important;width:auto!important;height:30.75%!important;
 background:#F0AB21!important;border-radius:0 44px 54px 0!important;transform:rotate(-1.2deg)!important;display:block!important
}
.mp-figma-home .mp-home-work__shape{
 position:absolute!important;inset:0!important;width:100%!important;height:1096px!important;margin:0!important;padding:0!important;
 background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;transform:none!important;z-index:1!important;overflow:visible!important
}
.mp-figma-home .mp-home-work__shape::before{
 content:""!important;display:block!important;position:absolute!important;left:5.33%!important;top:55.29%!important;width:89.34%!important;height:33.76%!important;
 background:#fff!important;border-radius:10px!important;z-index:1!important
}
.mp-figma-home .mp-home-work__visual{
 position:absolute!important;left:10.67%!important;top:9.67%!important;width:78.4%!important;height:22.53%!important;
 margin:0!important;padding:0!important;z-index:2!important;overflow:hidden!important;box-shadow:0 10px 22px rgba(0,0,0,.13)!important
}
.mp-figma-home .mp-home-work__visual img{
 display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;margin:0!important;border-radius:0!important
}
.mp-figma-home .mp-home-work__copy{
 position:absolute!important;inset:0!important;width:100%!important;height:1096px!important;margin:0!important;padding:0!important;background:transparent!important;z-index:3!important
}
.mp-figma-home .mp-home-work .mp-figma-kicker{
 position:absolute!important;left:10.67%!important;top:34.22%!important;width:89.33%!important;margin:0!important;padding:0!important;
 color:#E4032E!important;font:600 italic 42px/44px "KoHo",Arial,sans-serif!important
}
.mp-figma-home .mp-home-work__copy h2{
 position:absolute!important;left:10.13%!important;top:43.8%!important;width:77.87%!important;margin:0!important;padding:0!important;
 color:#482974!important;font:700 32px/34px "KoHo",Arial,sans-serif!important
}
.mp-figma-home .mp-home-work__copy p{
 position:absolute!important;left:10.13%!important;top:55.29%!important;width:79.2%!important;margin:0!important;padding:0!important;
 color:#000!important;font:400 16px/22px "KoHo",Arial,sans-serif!important
}
.mp-figma-home .mp-home-work__copy .mp-figma-actions{
 position:absolute!important;left:10.67%!important;top:72.54%!important;width:78.67%!important;height:125px!important;
 margin:0!important;padding:0!important;display:block!important
}
.mp-figma-home .mp-home-work__copy .mp-figma-actions .mp-figma-button:first-child,
.mp-figma-home .mp-home-work__copy .mp-figma-actions .mp-figma-button:nth-child(2){
 position:absolute!important;left:0!important;width:100%!important;height:55px!important;min-height:55px!important;margin:0!important;padding:0 16px!important;
 display:flex!important;align-items:center!important;justify-content:center!important;border-radius:8px!important;font:500 22px/22.4px "KoHo",Arial,sans-serif!important;text-decoration:none!important
}
.mp-figma-home .mp-home-work__copy .mp-figma-actions .mp-figma-button:first-child{
 top:0!important;background:#1488CA!important;color:#fff!important;border:0!important
}
.mp-figma-home .mp-home-work__copy .mp-figma-actions .mp-figma-button:nth-child(2){
 top:70px!important;background:#fff!important;color:#1488CA!important;border:1.5px solid #1488CA!important
}


/* ==========================================================================
   3.10.5 — mobiele vacatures opnieuw op Figma 302:1392
   Met behoud van de paarse sectieachtergrond zoals gewenst.
   ========================================================================== */
.mp-figma-home .mp-home-vacancies{
	position:absolute !important;
	left:0 !important;
	top:3190px !important;
	width:100% !important;
	height:1016px !important;
	min-height:1016px !important;
	margin:0 !important;
	padding:0 !important;
	background:#482974 !important;
	overflow:hidden !important;
}
.mp-figma-home .mp-home-vacancies>.mp-figma-inner{
	position:relative !important;
	width:100% !important;
	height:1016px !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-figma-home .mp-home-vacancies h2{
	position:absolute !important;
	left:0 !important;
	top:39px !important;
	width:100% !important;
	margin:0 !important;
	padding:0 !important;
	color:#fff !important;
	text-align:center !important;
	font:600 italic 42px/44px "KoHo",Arial,sans-serif !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider{
	position:absolute !important;
	left:0 !important;
	top:108px !important;
	width:100% !important;
	height:838px !important;
	margin:0 !important;
	padding:0 !important;
	overflow:visible !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__viewport{
	position:relative !important;
	width:100% !important;
	height:644px !important;
	margin:0 !important;
	padding:0 !important;
	overflow:hidden !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__track{
	display:flex !important;
	align-items:flex-start !important;
	gap:20px !important;
	width:max-content !important;
	height:644px !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-vacancy{
	position:relative !important;
	flex:0 0 100vw !important;
	width:100vw !important;
	height:644px !important;
	min-height:644px !important;
	margin:0 !important;
	padding:0 !important;
	background:transparent !important;
	border:0 !important;
	border-radius:0 !important;
	box-shadow:none !important;
	overflow:visible !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-vacancy::before{
	content:"" !important;
	position:absolute !important;
	left:0 !important;
	top:96px !important;
	width:100% !important;
	height:548px !important;
	background:#F0F0F0 !important;
	z-index:0 !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__media{
	position:static !important;
	width:auto !important;
	height:auto !important;
	margin:0 !important;
	padding:0 !important;
	overflow:visible !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-card-image{
	position:absolute !important;
	left:5.33% !important;
	top:0 !important;
	width:89.34% !important;
	height:auto !important;
	aspect-ratio:1/1 !important;
	margin:0 !important;
	padding:0 !important;
	z-index:2 !important;
	overflow:hidden !important;
	border-radius:0 !important;
	box-shadow:0 12px 22px rgba(0,0,0,.18) !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-card-image img{
	display:block !important;
	width:100% !important;
	height:100% !important;
	object-fit:cover !important;
	border-radius:0 !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__status{
	position:absolute !important;
	left:5.6% !important;
	top:388px !important;
	z-index:3 !important;
	display:inline-flex !important;
	align-items:center !important;
	height:40px !important;
	margin:0 !important;
	padding:7px 14px !important;
	background:#E4032E !important;
	color:#fff !important;
	border-radius:200px !important;
	font:700 18px/26px "KoHo",Arial,sans-serif !important;
	white-space:nowrap !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__body{
	position:absolute !important;
	left:5.33% !important;
	right:5.33% !important;
	top:437px !important;
	z-index:3 !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__body h3{
	margin:0 !important;
	color:#482974 !important;
	font:700 24px/28px "KoHo",Arial,sans-serif !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__meta{
	margin:0 !important;
	color:#482974 !important;
	font:500 24px/28px "KoHo",Arial,sans-serif !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__excerpt{
	margin:17px 0 0 !important;
	color:#000 !important;
	font:400 16px/22px "KoHo",Arial,sans-serif !important;
}
.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__body>a{
	color:#1488CA !important;
	font:400 16px/22px "KoHo",Arial,sans-serif !important;
	text-decoration:none !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls{
	position:absolute !important;
	left:0 !important;
	top:680px !important;
	width:100% !important;
	display:flex !important;
	justify-content:center !important;
	gap:30px !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button{
	width:64px !important;
	height:64px !important;
	border:0 !important;
	border-radius:50% !important;
	background:#fff !important;
	color:#1488CA !important;
	box-shadow:none !important;
}
.mp-figma-home .mp-home-vacancies .mp-home-center{
	position:absolute !important;
	left:5.33% !important;
	top:891px !important;
	width:89.34% !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-figma-home .mp-home-vacancies .mp-home-center .mp-figma-button{
	width:100% !important;
	margin:0 !important;
	background:#1488CA !important;
	color:#fff !important;
}


/* ==========================================================================
   3.10.6 — correctie interpretatie paarse achtergrond
   Paars hoort bij het geopende mobiele MENU, niet achter Recente vacatures.
   ========================================================================== */

/* Vacatures terug naar Figma: witte sectie met lichtgrijze kaart. */
.mp-figma-home .mp-home-vacancies{
	background:#fff !important;
}
.mp-figma-home .mp-home-vacancies h2{
	color:#E4032E !important;
}

/* Mobiele navigatie: paarse overlay/panel zoals gewenst. */
.mp-site-header .wp-block-navigation__responsive-container.is-menu-open{
	background:#482974 !important;
	color:#fff !important;
}
.mp-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{
	background:transparent !important;
}
.mp-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{
	color:#fff !important;
}
.mp-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close{
	color:#fff !important;
}
.mp-site-header .wp-block-navigation__responsive-container.is-menu-open .mp-header-tools .mp-header-search__toggle{
	color:#fff !important;
	border-color:rgba(255,255,255,.45) !important;
	background:transparent !important;
}
.mp-site-header .wp-block-navigation__responsive-container.is-menu-open .mp-header-tools .mp-language-selector__current{
	color:#fff !important;
	border-color:#fff !important;
	background:transparent !important;
}
.mp-site-header .wp-block-navigation__responsive-container.is-menu-open .mp-header-vacancy-button{
	background:#fff !important;
	color:#E4032E !important;
	border-color:#fff !important;
}


/* ==========================================================================
   3.10.7 — consistente afronding voor ALLE inhoudsfoto's
   Het Figma-bestand is hierin niet overal consequent. Vanaf deze versie
   geldt één ontwerpregel: inhoudsfoto's krijgen 18px afgeronde hoeken.
   Volvlak-hero's, kaarten/tegels, iconen, logo's en de Leaflet-kaart zelf
   vallen hier bewust niet onder.
   ========================================================================== */
:root{
	--mp-photo-radius:18px;
}

/* Homepage photos */
.mp-home-vision__visual,
.mp-home-work__visual,
.mp-home-join__visual,
.mp-home-vacancies .mp-figma-card-image,
.mp-location-feature__image{
	border-radius:var(--mp-photo-radius) !important;
	overflow:hidden !important;
}
.mp-home-vision__visual img,
.mp-home-work__visual img,
.mp-home-join__visual img,
.mp-home-vacancies .mp-figma-card-image img,
.mp-location-feature__image img{
	border-radius:var(--mp-photo-radius) !important;
}

/* Reusable theme photo blocks/cards */
.mp-figma-card-image,
.mp-card-grid .wp-block-image,
.mp-image-text .wp-block-image,
.mp-content-visual,
.mp-figma-featured-card .wp-block-image,
.mp-figma-target .wp-block-image{
	border-radius:var(--mp-photo-radius) !important;
	overflow:hidden !important;
}
.mp-figma-card-image img,
.mp-card-grid .wp-block-image img,
.mp-image-text .wp-block-image img,
.mp-content-visual img,
.mp-figma-featured-card .wp-block-image img,
.mp-figma-target .wp-block-image img{
	border-radius:var(--mp-photo-radius) !important;
}

/* Editor/content images: only ordinary content figures, not logos/icons. */
.entry-content .wp-block-image:not(.is-style-rounded) img,
.mp-figma-content-body .wp-block-image img{
	border-radius:var(--mp-photo-radius) !important;
}

/* Ensure the vacancy photo remains square in size, only corners are rounded. */
.mp-home-vacancies .mp-figma-card-image{
	aspect-ratio:1 / 1 !important;
}

/* 3.10.7 final mobile photo-radius authority */
.mp-figma-home .mp-home-vacancies .mp-figma-card-image,
.mp-figma-home .mp-home-vacancies .mp-figma-card-image img,
.mp-figma-home .mp-home-work__visual,
.mp-figma-home .mp-home-work__visual img,
.mp-figma-home .mp-home-vision__visual,
.mp-figma-home .mp-home-vision__visual img,
.mp-figma-home .mp-home-join__visual,
.mp-figma-home .mp-home-join__visual img,
.mp-figma-home .mp-location-feature__image,
.mp-figma-home .mp-location-feature__image img{
	border-radius:18px !important;
	overflow:hidden !important;
}


/* ==========================================================================
   3.10.9 — mobiele locatievlaggetjes hersteld
   Leaflet maakt de markers wel aan; na de volledige mobiele CSS-rebuild
   ontbrak alleen de visuele vormgeving van .mp-leaflet-marker.
   ========================================================================== */
.mp-location-stage--real .leaflet-marker-pane{
	z-index:420 !important;
}
.mp-location-stage--real .leaflet-marker-icon{
	background:transparent !important;
	border:0 !important;
}
.mp-location-stage--real .mp-leaflet-marker{
	position:relative !important;
	display:block !important;
	width:34px !important;
	height:44px !important;
	background:#E4032E !important;
	clip-path:polygon(50% 100%,0 72%,0 0,100% 0,100% 72%) !important;
	filter:drop-shadow(0 3px 3px rgba(0,0,0,.16)) !important;
	transform-origin:50% 90% !important;
	transition:transform .18s ease,filter .18s ease !important;
}
.mp-location-stage--real .mp-leaflet-marker--combined{
	background:#F0AB21 !important;
}
.mp-location-stage--real .mp-leaflet-marker i{
	position:absolute !important;
	left:50% !important;
	top:13px !important;
	width:12px !important;
	height:12px !important;
	margin:-6px 0 0 -6px !important;
	background:#fff !important;
	border-radius:50% !important;
}
.mp-location-stage--real .mp-leaflet-marker.is-active{
	transform:scale(1.17) !important;
	filter:drop-shadow(0 5px 6px rgba(0,0,0,.24)) !important;
}

/* Rode informatiekaart en legenda blijven vóór de vlaggetjes. */
.mp-location-stage--real .mp-location-feature,
.mp-location-stage--real .mp-location-legend{
	z-index:650 !important;
}

/* Leaflet-bediening blijft helemaal bovenop. */
.mp-location-stage--real .leaflet-top,
.mp-location-stage--real .leaflet-bottom{
	z-index:700 !important;
}


/* ==========================================================================
   3.11.0 — locatie-markers volgens Figma
   Compacte vlag/pin-vorm met witte kern, rood voor Onderwijs en geel voor
   Onderwijs & opvang. Actieve marker iets groter met zachte highlight.
   ========================================================================== */
.mp-location-stage--real .leaflet-marker-icon{
	background:transparent !important;
	border:0 !important;
}

.mp-location-stage--real .mp-leaflet-marker{
	position:relative !important;
	display:block !important;
	width:32px !important;
	height:42px !important;
	background:#E4032E !important;
	border-radius:7px 7px 5px 5px !important;
	clip-path:polygon(
		10% 0,
		90% 0,
		100% 10%,
		100% 72%,
		50% 100%,
		0 72%,
		0 10%
	) !important;
	filter:drop-shadow(0 3px 4px rgba(0,0,0,.18)) !important;
	transform-origin:50% 88% !important;
	transition:transform .18s ease,filter .18s ease !important;
}

.mp-location-stage--real .mp-leaflet-marker--combined{
	background:#F0AB21 !important;
}

.mp-location-stage--real .mp-leaflet-marker i{
	position:absolute !important;
	left:50% !important;
	top:13px !important;
	width:12px !important;
	height:12px !important;
	margin:-6px 0 0 -6px !important;
	background:#fff !important;
	border-radius:50% !important;
	box-shadow:0 0 0 1px rgba(255,255,255,.08) !important;
}

.mp-location-stage--real .mp-leaflet-marker.is-active{
	transform:scale(1.16) !important;
	filter:
		drop-shadow(0 5px 6px rgba(0,0,0,.24))
		drop-shadow(0 0 10px rgba(228,3,46,.16)) !important;
}

.mp-location-stage--real .mp-leaflet-marker--combined.is-active{
	filter:
		drop-shadow(0 5px 6px rgba(0,0,0,.24))
		drop-shadow(0 0 10px rgba(240,171,33,.20)) !important;
}


/* ==========================================================================
   3.11.1 — EXACTE Figma locatievlaggetjes
   Bron: Figma 302:1280 (rood) / 302:1270 (oranje), exact frame 30×42.
   Geen CSS-benadering meer: de Leaflet-marker bevat exact dezelfde
   vectorgeometrie als het Figma-object.
   ========================================================================== */
.mp-location-stage--real .mp-leaflet-divicon,
.mp-location-stage--real .leaflet-marker-icon.mp-leaflet-divicon{
	width:30px !important;
	height:42px !important;
	margin:0 !important;
	padding:0 !important;
	background:transparent !important;
	border:0 !important;
	overflow:visible !important;
}

.mp-location-stage--real svg.mp-leaflet-marker{
	display:block !important;
	width:30px !important;
	height:42px !important;
	overflow:visible !important;
	color:#E4032E !important;
	background:none !important;
	border:0 !important;
	border-radius:0 !important;
	clip-path:none !important;
	filter:drop-shadow(0 3px 3px rgba(0,0,0,.16)) !important;
	transform-origin:0 42px !important;
	transition:transform .18s ease,filter .18s ease !important;
}

.mp-location-stage--real svg.mp-leaflet-marker--combined{
	color:#F0AB21 !important;
}

.mp-location-stage--real svg.mp-leaflet-marker .mp-marker-fill{
	fill:currentColor !important;
}

.mp-location-stage--real svg.mp-leaflet-marker.is-active{
	transform:scale(1.16) !important;
	filter:drop-shadow(0 5px 6px rgba(0,0,0,.24)) !important;
}

/* Oude CSS-markerconstructie volledig uitschakelen. */
.mp-location-stage--real .mp-leaflet-marker i{
	display:none !important;
}


/* ==========================================================================
   3.11.2 — mobiele vacature navigatieknoppen
   Figma 302:1392 gebruikt twee lichte cirkels met blauwe pijlen.
   De vorige witte achtergrond viel weg tegen de witte sectie.
   Ook 28px omhoog geplaatst op basis van de live mobiele weergave.
   ========================================================================== */
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls{
	top:652px !important;
	gap:30px !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button{
	position:relative !important;
	display:grid !important;
	place-items:center !important;
	width:64px !important;
	height:64px !important;
	min-width:64px !important;
	min-height:64px !important;
	margin:0 !important;
	padding:0 !important;
	border:0 !important;
	border-radius:50% !important;
	background:#F0F0F0 !important;
	color:#1488CA !important;
	box-shadow:none !important;
	opacity:1 !important;
	font-size:0 !important;
	line-height:1 !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button::before{
	display:block !important;
	color:#1488CA !important;
	font:400 42px/1 Arial,sans-serif !important;
	transform:translateY(-1px) !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls [data-vacancy-prev]::before{
	content:"←" !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls [data-vacancy-next]::before{
	content:"→" !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button:disabled{
	opacity:.35 !important;
}


/* ==========================================================================
   3.11.3 — mobiele vacatures + locaties
   Alleen MOBILE. Desktop/standard blijven onaangeroerd.
   ========================================================================== */

/* Vacature-navigatie: gebruik de echte span-pijlen uit de markup. */
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls{
	top:652px !important;
	gap:30px !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button{
	position:relative !important;
	display:grid !important;
	place-items:center !important;
	width:64px !important;
	height:64px !important;
	min-width:64px !important;
	min-height:64px !important;
	margin:0 !important;
	padding:0 !important;
	border:0 !important;
	border-radius:50% !important;
	background:#F0F0F0 !important;
	color:#1488CA !important;
	box-shadow:none !important;
	opacity:1 !important;
	font-size:0 !important;
	line-height:1 !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button::before{
	content:none !important;
	display:none !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button > span{
	display:block !important;
	visibility:visible !important;
	opacity:1 !important;
	color:#1488CA !important;
	font:400 42px/1 Arial,sans-serif !important;
	line-height:1 !important;
	transform:translateY(-2px) !important;
}
.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button:disabled > span{
	opacity:.42 !important;
}

/* LOCATIES — exactere mobiele verticale indeling op Figma 302:1391.
   De lijst en het bestuurskantoor zijn absolute blokken; ze kunnen daardoor
   niet meer door elkaar gaan lopen. */
.mp-figma-home .mp-location-details{
	position:relative !important;
	left:auto !important;
	top:auto !important;
	width:89.34% !important;
	height:994px !important;
	margin:0 auto !important;
	padding:0 !important;
	display:block !important;
	overflow:hidden !important;
	background:#fff !important;
}

/* Figma heading: y≈841 binnen locaties; details-wrap begint y=776,
   dus top≈65px binnen details. */
.mp-figma-home .mp-location-list{
	position:absolute !important;
	left:0 !important;
	top:65px !important;
	width:100% !important;
	height:655px !important;
	margin:0 !important;
	padding:0 !important;
	columns:1 !important;
	column-gap:0 !important;
	overflow:visible !important;
}

.mp-figma-home .mp-location-list h3{
	height:28px !important;
	margin:0 0 20px !important;
	padding:0 !important;
	color:#482974 !important;
	font:700 24px/28px "KoHo",Arial,sans-serif !important;
}

/* Figma item rhythm: 12px textline + 19.6px tussenruimte.
   Reset expliciet alle browser/WP button-min-height/padding. */
.mp-figma-home .mp-location-list .mp-location-list__item{
	display:block !important;
	position:relative !important;
	width:100% !important;
	height:12px !important;
	min-height:0 !important;
	max-height:12px !important;
	margin:0 0 19.6px !important;
	padding:0 !important;
	border:0 !important;
	border-radius:0 !important;
	background:none !important;
	box-shadow:none !important;
	appearance:none !important;
	-webkit-appearance:none !important;
	text-align:left !important;
	white-space:nowrap !important;
	overflow:visible !important;
	color:#000 !important;
	font:500 16px/12px "KoHo",Arial,sans-serif !important;
	cursor:pointer !important;
}

.mp-figma-home .mp-location-list .mp-location-list__item strong,
.mp-figma-home .mp-location-list .mp-location-list__item span{
	display:inline !important;
	margin:0 !important;
	padding:0 !important;
	font-size:16px !important;
	line-height:12px !important;
	vertical-align:top !important;
}

.mp-figma-home .mp-location-list .mp-location-list__item strong{
	color:#1488CA !important;
	font-weight:700 !important;
}
.mp-figma-home .mp-location-list .mp-location-list__item span{
	color:#000 !important;
	font-weight:500 !important;
}
.mp-figma-home .mp-location-list .mp-location-list__item.is-active strong{
	color:#E4032E !important;
}

/* Figma Bestuurskantoor starts y≈1496; details start y=776 => 720px. */
.mp-figma-home .mp-location-office{
	position:absolute !important;
	left:0 !important;
	top:720px !important;
	width:100% !important;
	height:274px !important;
	margin:0 !important;
	padding:0 !important;
	background:#fff !important;
	z-index:2 !important;
}

.mp-figma-home .mp-location-office h3{
	height:28px !important;
	margin:0 0 23px !important;
	padding:0 !important;
	color:#482974 !important;
	font:700 24px/28px "KoHo",Arial,sans-serif !important;
}

.mp-figma-home .mp-location-office p{
	margin:0 0 19.6px !important;
	padding:0 !important;
	color:#000 !important;
	font:500 18px/24px "KoHo",Arial,sans-serif !important;
}

.mp-figma-home .mp-location-office p strong{
	font-weight:700 !important;
}

/* Geen oude pseudo-lagen in het witte detailsvlak. */
.mp-figma-home .mp-location-details::before,
.mp-figma-home .mp-location-details::after,
.mp-figma-home .mp-location-list::before,
.mp-figma-home .mp-location-list::after,
.mp-figma-home .mp-location-office::before,
.mp-figma-home .mp-location-office::after{
	content:none !important;
	display:none !important;
}


/* ==========================================================================
   3.11.4 — footer privacylabel maar één keer
   Gebruik de echte redactionele linktekst; geen gekopieerde ::after-tekst.
   ========================================================================== */
.mp-site-footer .mp-footer-privacy{
	position:absolute !important;
	left:0 !important;
	top:386px !important;
	display:block !important;
	margin:0 !important;
	padding:0 0 0 18px !important;
	color:#fff !important;
	font:500 18px/24px "KoHo",Arial,sans-serif !important;
	text-decoration:none !important;
}
.mp-site-footer .mp-footer-privacy::before{
	content:"›" !important;
	position:absolute !important;
	left:0 !important;
	top:0 !important;
	color:#F0AB21 !important;
	font-size:27px !important;
	line-height:21px !important;
}
.mp-site-footer .mp-footer-privacy::after{
	content:none !important;
	display:none !important;
}


/* ==========================================================================
   3.11.5 — footer-logo opnieuw opgebouwd uit Figma 302:1613
   Geen raster-crop meer voor het logo. Exacte Figma-afmetingen:
   x=200, y=0, w=175, h=62 binnen het 375×817 footerframe.
   ========================================================================== */
.mp-site-footer{
	background:
		linear-gradient(to bottom,
			transparent 0,
			transparent 62px,
			#482974 62px,
			#482974 100%) !important;
}

/* Figma gradient strip: y=20..82. */
.mp-site-footer::before{
	content:"" !important;
	display:block !important;
	position:absolute !important;
	left:0 !important;
	top:20px !important;
	width:100% !important;
	height:62px !important;
	z-index:1 !important;
	transform:none !important;
	background:linear-gradient(100deg,#E4032E 0%,#C11055 48%,#482974 100%) !important;
	clip-path:polygon(0 0,55% 18%,100% 34%,100% 100%,0 100%) !important;
}

/* Figma logo-tab: separate vector layer, not part of the strip. */
.mp-site-footer .mp-footer-tab{
	display:block !important;
	position:absolute !important;
	right:0 !important;
	top:0 !important;
	width:175px !important;
	height:62px !important;
	margin:0 !important;
	padding:0 !important;
	z-index:4 !important;
	background:
		url("../images/mijnplein-wordmark.png") no-repeat 50% 19px / 112px auto,
		url("../images/footer-logo-shape-mobile.svg") no-repeat 0 0 / 175px 62px !important;
	border:0 !important;
	border-radius:0 !important;
	clip-path:none !important;
	box-shadow:none !important;
	color:transparent !important;
	font-size:0 !important;
	line-height:0 !important;
	overflow:visible !important;
}
.mp-site-footer .mp-footer-tab::before,
.mp-site-footer .mp-footer-tab::after{
	content:none !important;
	display:none !important;
}


/* ==========================================================================
   3.11.6 — Werken bij: vacatureblok terug in normale documentflow
   Het blok gebruikt ook class .mp-home-vacancies. Daardoor nam het op mobiel
   per ongeluk de absolute homepage-positionering over (top:3190px), waardoor
   de footer over de vacaturekaart heen schoof.
   ========================================================================== */

.mp-pdf-jobs .mp-jobs-vacancies{
	position:relative !important;
	left:auto !important;
	top:auto !important;
	right:auto !important;
	bottom:auto !important;
	width:100% !important;
	height:auto !important;
	min-height:930px !important;
	margin:0 !important;
	padding:64px 0 72px !important;
	background:#fff !important;
	overflow:hidden !important;
}

.mp-pdf-jobs .mp-jobs-vacancies > .mp-figma-inner{
	position:relative !important;
	left:auto !important;
	top:auto !important;
	width:100% !important;
	height:auto !important;
	min-height:794px !important;
	margin:0 !important;
	padding:0 !important;
}

.mp-pdf-jobs .mp-jobs-vacancies h2{
	position:relative !important;
	left:auto !important;
	top:auto !important;
	width:100% !important;
	margin:0 0 46px !important;
	padding:0 20px !important;
	color:#E4032E !important;
	text-align:center !important;
	font:600 italic 42px/44px "KoHo",Arial,sans-serif !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider{
	position:relative !important;
	left:auto !important;
	top:auto !important;
	width:100% !important;
	height:690px !important;
	margin:0 !important;
	padding:0 !important;
	overflow:visible !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__viewport{
	position:relative !important;
	width:100% !important;
	height:548px !important;
	margin:0 !important;
	padding:0 !important;
	overflow:hidden !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__track{
	display:flex !important;
	align-items:flex-start !important;
	gap:20px !important;
	width:max-content !important;
	height:548px !important;
	margin:0 !important;
	padding:0 !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy{
	position:relative !important;
	flex:0 0 100vw !important;
	width:100vw !important;
	height:548px !important;
	min-height:548px !important;
	margin:0 !important;
	padding:0 !important;
	background:linear-gradient(to bottom,transparent 0 96px,#F0F0F0 96px 100%) !important;
	border:0 !important;
	border-radius:0 !important;
	box-shadow:none !important;
	overflow:visible !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-card-image{
	position:absolute !important;
	left:5.33% !important;
	top:0 !important;
	width:89.34% !important;
	height:auto !important;
	aspect-ratio:1 / 1 !important;
	margin:0 !important;
	z-index:2 !important;
	overflow:hidden !important;
	border-radius:18px !important;
	box-shadow:0 12px 22px rgba(0,0,0,.12) !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-card-image img{
	display:block !important;
	width:100% !important;
	height:100% !important;
	object-fit:cover !important;
	border-radius:18px !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__status{
	position:absolute !important;
	left:5.6% !important;
	top:388px !important;
	z-index:3 !important;
	display:inline-flex !important;
	align-items:center !important;
	height:40px !important;
	margin:0 !important;
	padding:7px 14px !important;
	background:#E4032E !important;
	color:#fff !important;
	border-radius:200px !important;
	font:700 18px/26px "KoHo",Arial,sans-serif !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__body{
	position:absolute !important;
	left:5.33% !important;
	right:5.33% !important;
	top:437px !important;
	z-index:3 !important;
	margin:0 !important;
	padding:0 !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__body h3{
	margin:0 !important;
	color:#482974 !important;
	font:700 24px/28px "KoHo",Arial,sans-serif !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__meta{
	margin:0 !important;
	color:#482974 !important;
	font:500 24px/28px "KoHo",Arial,sans-serif !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__excerpt{
	margin:17px 0 0 !important;
	color:#000 !important;
	font:400 16px/22px "KoHo",Arial,sans-serif !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__body > a{
	color:#1488CA !important;
	font:400 16px/22px "KoHo",Arial,sans-serif !important;
	text-decoration:none !important;
}

/* Navigatie blijft binnen het vacatureblok en telt mee voor de hoogte. */
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls{
	position:absolute !important;
	left:0 !important;
	top:575px !important;
	width:100% !important;
	display:flex !important;
	justify-content:center !important;
	gap:30px !important;
	margin:0 !important;
	padding:0 !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button{
	display:grid !important;
	place-items:center !important;
	width:64px !important;
	height:64px !important;
	min-width:64px !important;
	min-height:64px !important;
	margin:0 !important;
	padding:0 !important;
	border:0 !important;
	border-radius:50% !important;
	background:#F0F0F0 !important;
	color:#1488CA !important;
	font-size:0 !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button > span{
	display:block !important;
	visibility:visible !important;
	opacity:1 !important;
	color:#1488CA !important;
	font:400 42px/1 Arial,sans-serif !important;
	transform:translateY(-2px) !important;
}

/* Bekijk alle vacatures: binnen normale flow, onder de slider. */
.mp-pdf-jobs .mp-jobs-vacancies .mp-home-center{
	position:relative !important;
	left:auto !important;
	top:auto !important;
	width:89.34% !important;
	margin:28px auto 0 !important;
	padding:0 !important;
	text-align:center !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-home-center .mp-figma-button{
	width:100% !important;
	margin:0 !important;
}

/* CTA en footer mogen pas ná het complete vacatureblok starten. */
.mp-pdf-jobs .mp-jobs-cta{
	position:relative !important;
	clear:both !important;
	margin:0 !important;
	z-index:1 !important;
}

/* 3.11.7 — footerlogo iets lager volgens visuele vergelijking */
.mp-site-footer .mp-footer-tab{
	top:28px !important;
}

/* 3.11.8 — footerlogo visueel gecorrigeerd na live vergelijking
   28px was te laag; 14px geeft de juiste overlap tussen witte zone,
   rood/paarse balk en paarse footer. */
.mp-site-footer .mp-footer-tab{
	top:14px !important;
}

/* 3.11.9 — footerlogo definitieve tussenpositie na live vergelijking
   14px = te hoog, 28px = te laag -> middenpositie 21px. */
.mp-site-footer .mp-footer-tab{
	top:21px !important;
}


/* ==========================================================================
   3.12.0 — MOBILE VERTICAL RHYTHM REBUILD
   Source: Figma/PDF mobile frame 302:1789 (375 × 7963).
   Important: Figma uses long lorem-ipsum copy. Editorial copy is often much
   shorter. Therefore section spacing is now based on Figma GAPS, not fixed
   Figma absolute Y coordinates/heights. This prevents large empty areas.
   ========================================================================== */

@media (max-width:899px){

	/* ----------------------------------------------------------------------
	   GLOBAL: sections participate in normal document flow.
	   ---------------------------------------------------------------------- */
	.mp-figma-home{
		position:relative !important;
		display:block !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
		overflow:visible !important;
		background:#fff !important;
	}

	.mp-figma-home > .mp-home-hero,
	.mp-figma-home > .mp-home-vision,
	.mp-figma-home > .mp-home-work,
	.mp-figma-home > .mp-home-vacancies,
	.mp-figma-home > .mp-home-locations,
	.mp-figma-home > .mp-home-join{
		position:relative !important;
		left:auto !important;
		right:auto !important;
		top:auto !important;
		bottom:auto !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
		margin:0 !important;
	}

	/* ----------------------------------------------------------------------
	   HERO
	   Figma text starts y≈315, slogan y≈886 and vision begins y≈1065.
	   Keep that visual rhythm, but let the editorial intro determine height.
	   ---------------------------------------------------------------------- */
	.mp-figma-home .mp-home-hero{
		padding:334px 0 42px !important;
		background:#F0F0F0 !important;
		overflow:hidden !important;
	}

	.mp-figma-home .mp-home-hero__photo{
		position:absolute !important;
		left:0 !important;
		top:0 !important;
		width:100% !important;
		height:431px !important;
	}

	.mp-figma-home .mp-home-hero__panels{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		margin:0 !important;
		padding:0 !important;
	}

	.mp-figma-home .mp-home-hero__copy{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
		margin:0 !important;
		padding:46px 20px 34px !important;
	}

	.mp-figma-home .mp-home-hero__copy h1{
		width:auto !important;
		margin:0 0 18px !important;
	}

	.mp-figma-home .mp-home-hero__copy p{
		width:auto !important;
		margin:0 0 24px !important;
	}

	.mp-figma-home .mp-home-hero__copy .mp-figma-actions{
		display:grid !important;
		grid-template-columns:1fr !important;
		gap:17px !important;
	}

	.mp-figma-home .mp-home-hero__copy .mp-figma-button{
		width:100% !important;
	}

	.mp-figma-home .mp-home-hero__slogan{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:calc(100% + 61px) !important;
		max-width:406px !important;
		height:226px !important;
		margin:42px 0 0 30px !important;
		padding:60px 0 0 50px !important;
	}

	/* ----------------------------------------------------------------------
	   VISIE
	   Figma gaps:
	   photo → quote ≈57px; quote → copy ≈45px; copy → heading ≈65px.
	   ---------------------------------------------------------------------- */
	.mp-figma-home .mp-home-vision{
		padding:40px 20px 66px !important;
		background:#fff !important;
		overflow:hidden !important;
	}

	.mp-figma-home .mp-home-vision__grey{
		position:absolute !important;
		left:0 !important;
		top:235px !important;
		width:100% !important;
		height:calc(100% - 195px) !important;
		min-height:0 !important;
	}

	.mp-figma-home .mp-home-vision > .mp-figma-inner{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		display:block !important;
		z-index:1 !important;
	}

	.mp-figma-home .mp-home-vision__visual{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		aspect-ratio:335 / 249 !important;
		margin:0 !important;
	}

	.mp-figma-home .mp-home-vision__visual img{
		width:100% !important;
		height:100% !important;
		min-height:0 !important;
	}

	.mp-figma-home .mp-home-vision blockquote{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:56px 0 0 !important;
	}

	.mp-figma-home .mp-home-vision__copy{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:42px 0 0 !important;
		padding:0 !important;
	}

	.mp-figma-home .mp-home-vision__heading{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:64px 0 0 !important;
	}

	/* ----------------------------------------------------------------------
	   WERKEN BIJ
	   Figma gaps:
	   photo→kicker ≈20px; kicker→heading ≈20px; heading→body ≈25px;
	   body→button ≈45-50px; button gap ≈15px.
	   ---------------------------------------------------------------------- */
	.mp-figma-home .mp-home-work{
		padding:52px 0 112px !important;
		background:#fff !important;
		overflow:hidden !important;
	}

	.mp-figma-home .mp-home-work__decor{
		position:absolute !important;
		inset:0 !important;
		z-index:0 !important;
	}

	.mp-figma-home .mp-home-work__purple{
		left:-58.67% !important;
		top:0 !important;
		right:10.67% !important;
		width:auto !important;
		height:300px !important;
	}

	.mp-figma-home .mp-home-work__yellow{
		left:0 !important;
		right:0 !important;
		top:auto !important;
		bottom:18px !important;
		width:auto !important;
		height:352px !important;
	}

	.mp-figma-home .mp-home-work__shape{
		position:relative !important;
		inset:auto !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
		margin:0 !important;
		padding:0 20px 46px !important;
		z-index:1 !important;
		overflow:visible !important;
	}

	.mp-figma-home .mp-home-work__shape::before{
		content:"" !important;
		display:block !important;
		position:absolute !important;
		left:20px !important;
		right:20px !important;
		top:430px !important;
		bottom:46px !important;
		width:auto !important;
		height:auto !important;
		background:#fff !important;
		border-radius:10px !important;
		z-index:1 !important;
	}

	.mp-figma-home .mp-home-work__visual{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:calc(100% - 40px) !important;
		height:auto !important;
		aspect-ratio:294 / 247 !important;
		margin:54px auto 0 !important;
		z-index:2 !important;
	}

	.mp-figma-home .mp-home-work__visual img{
		width:100% !important;
		height:100% !important;
	}

	.mp-figma-home .mp-home-work__copy{
		position:relative !important;
		inset:auto !important;
		width:100% !important;
		height:auto !important;
		margin:0 !important;
		padding:0 18px !important;
		z-index:3 !important;
	}

	.mp-figma-home .mp-home-work .mp-figma-kicker{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:auto !important;
		display:block !important;
		margin:20px 0 0 !important;
	}

	.mp-figma-home .mp-home-work__copy h2{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:22px 0 0 !important;
	}

	.mp-figma-home .mp-home-work__copy p{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:26px 0 0 !important;
	}

	.mp-figma-home .mp-home-work__copy .mp-figma-actions{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		margin:46px 0 0 !important;
		padding:0 !important;
		display:grid !important;
		grid-template-columns:1fr !important;
		gap:15px !important;
	}

	.mp-figma-home .mp-home-work__copy .mp-figma-actions .mp-figma-button:first-child,
	.mp-figma-home .mp-home-work__copy .mp-figma-actions .mp-figma-button:nth-child(2){
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
	}

	/* ----------------------------------------------------------------------
	   VACATURES
	   No fixed 1016px section. Card content reserves its own height.
	   ---------------------------------------------------------------------- */
	.mp-figma-home .mp-home-vacancies{
		padding:64px 0 72px !important;
		background:#fff !important;
		overflow:hidden !important;
	}

	.mp-figma-home .mp-home-vacancies > .mp-figma-inner{
		position:relative !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
	}

	.mp-figma-home .mp-home-vacancies h2{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:0 0 40px !important;
		padding:0 20px !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		margin:0 !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__viewport{
		position:relative !important;
		width:100% !important;
		height:620px !important;
		margin:0 !important;
		overflow:hidden !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__track{
		height:620px !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-figma-vacancy{
		height:620px !important;
		min-height:620px !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:28px 0 0 !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-home-center{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:89.34% !important;
		margin:28px auto 0 !important;
	}

	/* ----------------------------------------------------------------------
	   LOCATIES
	   Map keeps its designed height; list and office now flow naturally.
	   ---------------------------------------------------------------------- */
	.mp-figma-home .mp-home-locations{
		padding:54px 0 70px !important;
		background:#fff !important;
		overflow:visible !important;
	}

	.mp-figma-home .mp-home-locations__heading{
		position:relative !important;
		width:100% !important;
		height:auto !important;
		margin:0 !important;
		padding:0 20px 36px !important;
	}

	.mp-figma-home .mp-location-stage--real{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:700px !important;
		margin:0 !important;
	}

	.mp-figma-home .mp-real-map{
		height:700px !important;
	}

	.mp-figma-home .mp-location-details-wrap{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		margin:0 !important;
		padding:54px 20px 0 !important;
		overflow:visible !important;
		background:#fff !important;
	}

	.mp-figma-home .mp-location-details{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		margin:0 !important;
		padding:0 !important;
		overflow:visible !important;
	}

	.mp-figma-home .mp-location-list{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		margin:0 !important;
		padding:0 !important;
	}

	.mp-figma-home .mp-location-office{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		margin:44px 0 0 !important;
		padding:0 !important;
	}

	/* ----------------------------------------------------------------------
	   SLUIT JE AAN
	   Figma gaps:
	   image→quote ≈15px; quote→heading ≈60px; heading→copy ≈25px;
	   copy→button ≈45-55px. No fixed 1138px section anymore.
	   ---------------------------------------------------------------------- */
	.mp-figma-home .mp-home-join{
		padding:70px 20px 78px !important;
		background:#fff !important;
		overflow:hidden !important;
	}

	.mp-figma-home .mp-home-join::before{
		content:"" !important;
		position:absolute !important;
		left:0 !important;
		top:52px !important;
		width:100% !important;
		height:calc(100% - 52px) !important;
		background:#F0F0F0 !important;
		clip-path:polygon(0 6%,100% 0,100% 91%,0 100%) !important;
	}

	.mp-figma-home .mp-home-join > .mp-figma-inner{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		display:block !important;
		z-index:1 !important;
	}

	.mp-figma-home .mp-home-join__visual{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:0 !important;
	}

	.mp-figma-home .mp-home-join__visual img{
		width:100% !important;
		height:auto !important;
		aspect-ratio:335 / 298 !important;
		object-fit:cover !important;
	}

	.mp-figma-home .mp-home-join__visual blockquote{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:18px 0 0 !important;
	}

	.mp-figma-home .mp-home-join__copy{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:58px 0 0 !important;
		padding:0 !important;
	}

	.mp-figma-home .mp-home-join__copy h2{
		margin:0 0 26px !important;
	}

	.mp-figma-home .mp-home-join__copy p{
		margin:0 0 20px !important;
	}

	.mp-figma-home .mp-home-join__copy .mp-figma-button{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		margin:46px 0 0 !important;
	}

	/* ----------------------------------------------------------------------
	   WERKEN BIJ PAGE / shared blocks
	   Short editorial copy should never inherit giant fixed spacers.
	   ---------------------------------------------------------------------- */
	.mp-pdf-jobs .mp-jobs-story,
	.mp-pdf-jobs .mp-jobs-targets,
	.mp-pdf-jobs .mp-jobs-featured,
	.mp-pdf-jobs .mp-jobs-cta{
		height:auto !important;
		min-height:0 !important;
	}

	.mp-pdf-jobs .mp-jobs-cta{
		padding:56px 20px 62px !important;
	}

	.mp-pdf-jobs .mp-jobs-cta h2{
		margin:0 0 26px !important;
	}

	.mp-pdf-jobs .mp-jobs-cta p{
		margin:0 0 34px !important;
	}
}


/* ==========================================================================
   3.12.1 — overgang Recente vacatures → Onze locaties
   Vergeleken met het mobiele Figma/PDF-voorbeeld stond Onze locaties te laag.
   In Figma zit na de blauwe CTA slechts een korte witruimte voordat de
   locatietitel begint.
   ========================================================================== */
@media (max-width:899px){
	.mp-figma-home .mp-home-vacancies{
		padding-bottom:24px !important;
	}

	.mp-figma-home .mp-home-locations{
		padding-top:20px !important;
	}

	/* Houd de onderlinge titel/map-afstand uit Figma intact. */
	.mp-figma-home .mp-home-locations__heading{
		padding-bottom:32px !important;
	}
}


/* ==========================================================================
   3.12.2 — Werken bij mobiel: extra marge onder laatste knop
   In de live mobiele weergave stond 'Bekijk vacatures' te dicht tegen de
   onderzijde van de witte kaart / gele vorm. Volgens Figma hoort daar nog
   duidelijke ademruimte onder.
   ========================================================================== */
@media (max-width:899px){
	.mp-figma-home .mp-home-work__shape{
		padding-bottom:74px !important;
	}

	.mp-figma-home .mp-home-work__shape::before{
		bottom:74px !important;
	}

	.mp-figma-home .mp-home-work__copy .mp-figma-actions{
		margin-bottom:0 !important;
	}

	/* Houd ook tussen gele vorm en 'Recente vacatures' een rustige overgang. */
	.mp-figma-home .mp-home-work{
		padding-bottom:138px !important;
	}
}


/* ==========================================================================
   3.12.3 — mobiele locatie-sectie: marges en volgorde volgens Figma
   In Figma staat direct onder de kaart eerst 'Onderwijs & opvang' met de
   locaties, daarna pas 'Bestuurskantoor'. De vorige flow gebruikte de DOM-
   volgorde en gaf daardoor extra witruimte vóór Bestuurskantoor.
   ========================================================================== */
@media (max-width:899px){

	.mp-figma-home .mp-location-details-wrap{
		padding:34px 20px 0 !important;
	}

	.mp-figma-home .mp-location-details{
		display:flex !important;
		flex-direction:column !important;
		gap:0 !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
		margin:0 !important;
		padding:0 !important;
		overflow:visible !important;
	}

	/* Eerst de locatielijst, zoals in het mobiele Figma-ontwerp. */
	.mp-figma-home .mp-location-list{
		order:1 !important;
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		margin:0 !important;
		padding:0 !important;
	}

	.mp-figma-home .mp-location-list h3{
		margin:0 0 26px !important;
	}

	/* Daarna het bestuurskantoor; compacte maar duidelijke sectiemarge. */
	.mp-figma-home .mp-location-office{
		order:2 !important;
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		margin:36px 0 0 !important;
		padding:0 !important;
	}

	.mp-figma-home .mp-location-office h3{
		margin:0 0 24px !important;
	}

	/* Geen extra lege ruimte aan het einde van de locatie-details. */
	.mp-figma-home .mp-home-locations{
		padding-bottom:56px !important;
	}
}


/* ==========================================================================
   3.12.4 — MOBIELE LOCATIESECTIE DEFINITIEVE FLOW
   - kaart ongeveer half zo hoog als voorheen;
   - geselecteerd locatiekaartje volledig binnen de kaart;
   - legenda direct onder de kaart;
   - tekst/details beginnen pas daarna, dus nooit achter het kaartje.
   ========================================================================== */
@media (max-width:899px){

	/* Kortere kaart: 700px -> 400px. */
	.mp-figma-home .mp-location-stage--real{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:400px !important;
		min-height:400px !important;
		max-height:400px !important;
		margin:0 !important;
		overflow:visible !important;
	}

	.mp-figma-home .mp-real-map{
		width:100% !important;
		height:400px !important;
		min-height:400px !important;
		max-height:400px !important;
	}

	/* Locatiekaartje hoger in de kaart, zodat het niet in de tekstzone valt. */
	.mp-figma-home .mp-location-feature{
		top:28px !important;
		left:14.36% !important;
		width:71.28% !important;
		max-width:none !important;
		z-index:650 !important;
	}

	/* Legenda los onder de kaart, zodat de kortere kaart niet volloopt. */
	.mp-figma-home .mp-location-legend{
		left:20px !important;
		right:20px !important;
		top:auto !important;
		bottom:-66px !important;
		display:flex !important;
		flex-direction:row !important;
		align-items:center !important;
		justify-content:center !important;
		flex-wrap:wrap !important;
		gap:14px 20px !important;
		padding:10px 16px !important;
		border-radius:28px !important;
		font-size:15px !important;
		line-height:20px !important;
		z-index:700 !important;
	}

	.mp-figma-home .mp-location-legend button{
		display:flex !important;
		align-items:center !important;
		gap:8px !important;
		white-space:nowrap !important;
	}

	.mp-figma-home .mp-location-legend button span{
		width:24px !important;
		height:24px !important;
		flex:0 0 24px !important;
	}

	/* Details beginnen ruim onder de kaart + legenda.
	   Dit voorkomt dat 'Onderwijs & opvang' of Bestuurskantoor achter
	   het rode locatiekaartje terechtkomt. */
	.mp-figma-home .mp-location-details-wrap{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
		margin:0 !important;
		padding:96px 20px 0 !important;
		overflow:visible !important;
		background:#fff !important;
		z-index:5 !important;
	}

	.mp-figma-home .mp-location-details{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
		margin:0 !important;
		padding:0 !important;
		display:flex !important;
		flex-direction:column !important;
		gap:0 !important;
		overflow:visible !important;
	}

	.mp-figma-home .mp-location-list{
		order:1 !important;
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
		margin:0 !important;
		padding:0 !important;
	}

	.mp-figma-home .mp-location-office{
		order:2 !important;
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:auto !important;
		min-height:0 !important;
		margin:36px 0 0 !important;
		padding:0 !important;
	}

	.mp-figma-home .mp-home-locations{
		padding-bottom:48px !important;
	}
}


/* ==========================================================================
   3.12.5 — mobiele locatietitel correct boven de kaart
   De tweede regel van "Je vindt ons in heel Salland!" liep visueel tegen
   de kaart aan. De heading krijgt nu een eigen wit vlak en extra onderruimte.
   ========================================================================== */
@media (max-width:899px){

	.mp-figma-home .mp-home-locations__heading{
		position:relative !important;
		z-index:10 !important;
		width:100% !important;
		margin:0 !important;
		padding:0 20px 46px !important;
		background:#fff !important;
		text-align:center !important;
		overflow:visible !important;
	}

	.mp-figma-home .mp-home-locations__heading .mp-figma-kicker{
		display:block !important;
		margin:0 !important;
		padding:0 !important;
	}

	.mp-figma-home .mp-home-locations__heading h2{
		display:block !important;
		width:100% !important;
		margin:24px 0 0 !important;
		padding:0 !important;
		line-height:1.08 !important;
	}

	/* Kaart begint pas na het volledige titelblok. */
	.mp-figma-home .mp-location-stage--real{
		margin-top:0 !important;
	}
}


/* ==========================================================================
   3.12.6 — Werken bij mobiel: extra WITRUIMTE onder "Bekijk vacatures"
   De witte kaart eindigde vrijwel direct onder de tweede knop. Alleen de
   witte binnenkaart krijgt nu extra onderruimte; het gele vlak blijft intact.
   ========================================================================== */
@media (max-width:899px){
	.mp-figma-home .mp-home-work__copy{
		padding-bottom:38px !important;
	}
}


/* ==========================================================================
   3.12.7 — locatiekaart volgens Figma: rode speech/vlag-vorm
   Toegepast op alle viewports.
   Hoofdvlak met afgeronde bovenhoeken / onderhoeken en aparte driehoekige punt.
   ========================================================================== */

.mp-location-stage--real .mp-location-feature{
	position:absolute !important;
	background:#E4032E !important;
	color:#fff !important;
	overflow:visible !important;
	border-radius:18px 18px 12px 12px !important;
	box-shadow:0 10px 24px rgba(0,0,0,.14) !important;
	z-index:650 !important;
}

/* Verwijder eventuele oude tail op child-elementen. */
.mp-location-stage--real .mp-location-feature::before{
	content:none !important;
	display:none !important;
}

.mp-location-stage--real .mp-location-feature::after{
	content:"" !important;
	position:absolute !important;
	left:38% !important;
	bottom:-34px !important;
	width:0 !important;
	height:0 !important;
	border-top:34px solid #E4032E !important;
	border-right:34px solid transparent !important;
	border-left:0 solid transparent !important;
	z-index:1 !important;
}

/* Body zelf blijft rechthoekig; de vlagpunt komt van de kaartcontainer. */
.mp-location-stage--real .mp-location-feature__body{
	position:relative !important;
	background:#E4032E !important;
	color:#fff !important;
	border-radius:0 0 12px 12px !important;
	overflow:visible !important;
}

.mp-location-stage--real .mp-location-feature__body::after{
	content:none !important;
	display:none !important;
}

/* Afbeelding hoort visueel in dezelfde kaart, zonder los zwevend frame. */
.mp-location-stage--real .mp-location-feature__image{
	overflow:hidden !important;
	background:#E4032E !important;
}

.mp-location-stage--real .mp-location-feature__image img{
	display:block !important;
	width:100% !important;
	height:100% !important;
	object-fit:cover !important;
}

/* Pijlknop zoals in Figma: witte cirkel in het rode vlak. */
.mp-location-stage--real .mp-location-feature a{
	display:grid !important;
	place-items:center !important;
	border-radius:50% !important;
	background:#fff !important;
	color:#1488CA !important;
	text-decoration:none !important;
	box-shadow:none !important;
	z-index:2 !important;
}

/* 3.12.7 mobile Figma proportions */
.mp-location-stage--real .mp-location-feature{
	border-radius:16px 16px 10px 10px !important;
}
.mp-location-stage--real .mp-location-feature::after{
	left:46% !important;
	bottom:-34px !important;
	border-top-width:34px !important;
	border-right-width:34px !important;
}


/* ==========================================================================
   3.12.12 — vacature-slider stabiel zonder de kaartlayout te wijzigen
   3.12.11 gebruikte grid/100%-breedtes en brak daardoor de mobiele kaart.
   Deze versie behoudt de beproefde 3.12.10-geometrie en stabiliseert alleen
   de verticale tekstposities en de slide-navigatie.
   ========================================================================== */
@media (max-width:899px){

	/* Hou de bestaande absolute body-positionering en kaartbreedte intact. */
	.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__body,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__body{
		display:block !important;
	}

	/* Titel: altijd ruimte voor maximaal twee regels. */
	.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__body h3,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__body h3{
		min-height:56px !important;
		margin:0 !important;
	}

	/* Meta-regel krijgt dezelfde vaste startpositie bij elke vacature. */
	.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__meta,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__meta{
		min-height:56px !important;
		margin:0 !important;
	}

	/* Omschrijving reserveert twee regels, maar blijft gewone block-flow. */
	.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__excerpt,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__excerpt{
		min-height:44px !important;
		margin:17px 0 0 !important;
	}

	/* Navigatieknoppen hebben altijd dezelfde vaste maat en rijhoogte. */
	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls{
		min-height:64px !important;
		align-items:center !important;
		justify-content:center !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button{
		flex:0 0 64px !important;
		width:64px !important;
		height:64px !important;
		min-width:64px !important;
		min-height:64px !important;
	}
}


/* ==========================================================================
   3.12.13 — mobiele vacatures exact terug naar Figma-ritme
   Vergelijking met mobiel Figma/PDF:
   - foto blijft 335×335;
   - status staat ca. 50–75px onder foto;
   - titel en meta staan DIRECT onder elkaar;
   - excerpt volgt met beperkte marge;
   - navigatie staat los onder de kaart.
   De vaste min-heights uit 3.12.12 veroorzaakten juist grote gaten.
   ========================================================================== */
@media (max-width:899px){

	.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__body,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__body{
		display:block !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__body h3,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__body h3{
		height:auto !important;
		min-height:0 !important;
		max-height:none !important;
		margin:0 !important;
		padding:0 !important;
		overflow:visible !important;
		display:block !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__meta,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__meta{
		height:auto !important;
		min-height:0 !important;
		max-height:none !important;
		margin:0 !important;
		padding:0 !important;
		overflow:visible !important;
		display:block !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__excerpt,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__excerpt{
		height:auto !important;
		min-height:0 !important;
		max-height:none !important;
		margin:17px 0 0 !important;
		padding:0 !important;
		overflow:visible !important;
		display:block !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-figma-vacancy__body > a,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__body > a{
		display:inline-block !important;
		height:auto !important;
		min-height:0 !important;
		margin:0 !important;
		padding:0 !important;
	}

	/* Navigatie los van de tekstinhoud; zelfde y-positie bij iedere slide. */
	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:64px !important;
		min-height:64px !important;
		margin:28px 0 0 !important;
		padding:0 !important;
		display:flex !important;
		align-items:center !important;
		justify-content:center !important;
		gap:30px !important;
		transform:none !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button{
		flex:0 0 64px !important;
		width:64px !important;
		height:64px !important;
		min-width:64px !important;
		min-height:64px !important;
		margin:0 !important;
		padding:0 !important;
	}
}


/* ==========================================================================
   3.12.14 — mobiele vacature-navigatie verfijnd naar Figma
   Figma: lichte ronde knoppen, duidelijke blauwe pijlen, compactere afstand.
   ========================================================================== */
@media (max-width:899px){

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:60px !important;
		min-height:60px !important;
		margin:24px 0 0 !important;
		padding:0 !important;
		display:flex !important;
		align-items:center !important;
		justify-content:center !important;
		gap:24px !important;
		transform:none !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button{
		position:relative !important;
		display:grid !important;
		place-items:center !important;
		flex:0 0 60px !important;
		width:60px !important;
		height:60px !important;
		min-width:60px !important;
		min-height:60px !important;
		margin:0 !important;
		padding:0 !important;
		border:0 !important;
		border-radius:50% !important;
		background:#F3F3F3 !important;
		box-shadow:none !important;
		opacity:1 !important;
		font-size:0 !important;
		line-height:0 !important;
	}

	/* Bouw de pijl zelf, zodat deze op elk toestel hetzelfde oogt. */
	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button > span,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button > span{
		position:relative !important;
		display:block !important;
		width:27px !important;
		height:3px !important;
		background:#1488CA !important;
		color:transparent !important;
		font-size:0 !important;
		line-height:0 !important;
		border-radius:2px !important;
		opacity:1 !important;
		transform:none !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button > span::after,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button > span::after{
		content:"" !important;
		position:absolute !important;
		top:50% !important;
		width:11px !important;
		height:11px !important;
		border-top:3px solid #1488CA !important;
		border-right:3px solid #1488CA !important;
		background:transparent !important;
	}

	.mp-figma-home .mp-home-vacancies [data-vacancy-next] > span::after,
	.mp-pdf-jobs .mp-jobs-vacancies [data-vacancy-next] > span::after{
		right:0 !important;
		transform:translateY(-50%) rotate(45deg) !important;
	}

	.mp-figma-home .mp-home-vacancies [data-vacancy-prev] > span::after,
	.mp-pdf-jobs .mp-jobs-vacancies [data-vacancy-prev] > span::after{
		left:0 !important;
		transform:translateY(-50%) rotate(-135deg) !important;
	}

	/* Inactieve knop blijft zichtbaar zoals in Figma, maar duidelijk lichter. */
	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button:disabled,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button:disabled{
		opacity:.28 !important;
	}

	/* Iets meer afstand tussen de ronde navigatie en de blauwe CTA. */
	.mp-figma-home .mp-home-vacancies .mp-home-center,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-home-center{
		margin-top:36px !important;
	}
}


/* ==========================================================================
   3.12.15 — mobiele vacature-navigatie: echte pijlen herstellen
   De CSS-getekende pijlen uit 3.12.14 vormden op sommige browsers hoekjes.
   Gebruik daarom weer de echte ← / → tekens uit de markup.
   ========================================================================== */
@media (max-width:899px){

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button > span,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button > span{
		position:static !important;
		display:block !important;
		width:auto !important;
		height:auto !important;
		background:transparent !important;
		color:#1488CA !important;
		font:400 34px/1 Arial,sans-serif !important;
		line-height:1 !important;
		border-radius:0 !important;
		opacity:1 !important;
		transform:translateY(-2px) !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button > span::before,
	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button > span::after,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button > span::before,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button > span::after{
		content:none !important;
		display:none !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button:disabled > span,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button:disabled > span{
		color:#89C3E4 !important;
	}
}


/* ==========================================================================
   3.12.17 — vacaturepijlen exact horizontaal uitlijnen
   Gebruik vaste SVG-iconen in plaats van tekstglyphs. Daardoor hebben ← en →
   exact dezelfde optische hoogte en centrering op alle mobiele browsers.
   ========================================================================== */
@media (max-width:899px){

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button{
		position:relative !important;
		display:grid !important;
		place-items:center !important;
	}

	/* Verberg het letterteken; de pijl wordt als SVG-background getekend. */
	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button > span,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button > span{
		display:block !important;
		width:28px !important;
		height:18px !important;
		margin:0 !important;
		padding:0 !important;
		color:transparent !important;
		font-size:0 !important;
		line-height:0 !important;
		background-position:center !important;
		background-repeat:no-repeat !important;
		background-size:28px 18px !important;
		transform:none !important;
	}

	.mp-figma-home .mp-home-vacancies [data-vacancy-prev] > span,
	.mp-pdf-jobs .mp-jobs-vacancies [data-vacancy-prev] > span{
		background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='18' viewBox='0 0 28 18'%3E%3Cpath d='M27 9H3M10 2L3 9l7 7' fill='none' stroke='%231488CA' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
	}

	.mp-figma-home .mp-home-vacancies [data-vacancy-next] > span,
	.mp-pdf-jobs .mp-jobs-vacancies [data-vacancy-next] > span{
		background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='18' viewBox='0 0 28 18'%3E%3Cpath d='M1 9h24M18 2l7 7-7 7' fill='none' stroke='%231488CA' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
	}

	/* Uitgeschakeld: zelfde geometrie, alleen lichter. */
	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button:disabled > span,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button:disabled > span{
		opacity:.28 !important;
	}
}


/* ==========================================================================
   3.12.18 — mobiele vacature-navigatie: pijlen altijd zichtbaar
   De data-URI SVG uit 3.12.17 wordt op sommige mobiele browsers niet getoond.
   Gebruik daarom CSS pseudo-elementen met echte pijltekens, absoluut
   gecentreerd in de knop. Zo staan links/rechts exact op dezelfde lijn.
   ========================================================================== */
@media (max-width:899px){

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button{
		position:relative !important;
		display:block !important;
		overflow:visible !important;
	}

	/* Verberg de markup-span volledig; pseudo-element doet de weergave. */
	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button > span,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button > span{
		display:none !important;
		background:none !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button::before,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button::before{
		position:absolute !important;
		left:50% !important;
		top:50% !important;
		display:block !important;
		width:32px !important;
		height:32px !important;
		margin:0 !important;
		padding:0 !important;
		color:#1488CA !important;
		font:400 32px/32px Arial,sans-serif !important;
		text-align:center !important;
		white-space:nowrap !important;
		transform:translate(-50%,-52%) !important;
		opacity:1 !important;
	}

	.mp-figma-home .mp-home-vacancies [data-vacancy-prev]::before,
	.mp-pdf-jobs .mp-jobs-vacancies [data-vacancy-prev]::before{
		content:"←" !important;
	}

	.mp-figma-home .mp-home-vacancies [data-vacancy-next]::before,
	.mp-pdf-jobs .mp-jobs-vacancies [data-vacancy-next]::before{
		content:"→" !important;
	}

	.mp-figma-home .mp-home-vacancies .mp-vacancy-slider__controls button:disabled::before,
	.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button:disabled::before{
		color:#89C3E4 !important;
		opacity:.35 !important;
	}
}


/* 3.12.23 — Footer privacy link: white text with Mijnplein orange arrow. */
.mp-site-footer .mp-footer-privacy{
	position:relative !important;
	padding-left:18px !important;
	color:#fff !important;
}
.mp-site-footer .mp-footer-privacy::before{
	content:"›" !important;
	position:absolute !important;
	left:0 !important;
	top:50% !important;
	transform:translateY(-52%) !important;
	color:#f0ab21 !important;
	font-weight:700 !important;
	font-size:1.15em !important;
	line-height:1 !important;
}


/* 3.12.24 — Privacy label itself must be fully white; only the preceding arrow is orange. */
.mp-site-footer .mp-footer-privacy,
.mp-site-footer .mp-footer-privacy:link,
.mp-site-footer .mp-footer-privacy:visited,
.mp-site-footer .mp-footer-privacy:hover,
.mp-site-footer .mp-footer-privacy:active{
	color:#fff !important;
}
.mp-site-footer .mp-footer-privacy::first-letter{
	color:#fff !important;
}
.mp-site-footer .mp-footer-privacy::before{
	color:#f0ab21 !important;
}

/* 3.13.9 — desktop kaarttabs niet tonen op mobiel. */
@media (max-width:899px){
  .mp-location-map-tabs,
  .mp-location-details__group-title{display:none!important;}
}

/* ========================================================================== 
   3.13.17 — LOCATIEKAARTJE + FILTERVINKJES volgens Figma
   Foto boven, compacte rode infobalk onder; geen type-label in het kaartje.
   ========================================================================== */
@media (max-width:899px){
  .mp-location-stage--real .mp-location-feature{
    display:block!important;
    background:transparent!important;
    border-radius:16px 16px 0 0!important;
    overflow:visible!important;
  }
  .mp-location-stage--real .mp-location-feature__image{
    display:block!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:1.42 / 1!important;
    border-radius:16px 16px 0 0!important;
    overflow:hidden!important;
  }
  .mp-location-stage--real .mp-location-feature__image img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
  .mp-location-stage--real .mp-location-feature__body{
    position:relative!important;
    width:100%!important;
    min-height:66px!important;
    height:66px!important;
    box-sizing:border-box!important;
    padding:9px 52px 8px 12px!important;
    background:#E4032E!important;
    border-radius:0!important;
    overflow:visible!important;
  }
  .mp-location-stage--real .mp-location-feature .mp-figma-kicker{
    display:none!important;
  }
  .mp-location-stage--real .mp-location-feature h3{
    margin:0 0 1px!important;
    font:700 15px/18px "KoHo",Arial,sans-serif!important;
    color:#fff!important;
  }
  .mp-location-stage--real .mp-location-feature p{
    margin:0!important;
    font:500 11px/14px "KoHo",Arial,sans-serif!important;
    color:#fff!important;
  }
  .mp-location-stage--real .mp-location-feature a{
    position:absolute!important;
    right:10px!important;
    top:50%!important;
    bottom:auto!important;
    width:34px!important;
    height:34px!important;
    transform:translateY(-50%)!important;
  }
  .mp-location-stage--real .mp-location-feature::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    bottom:-26px!important;
    width:0!important;
    height:0!important;
    border-top:26px solid #E4032E!important;
    border-right:26px solid transparent!important;
    border-left:0!important;
  }
  .mp-location-stage--real .mp-location-feature__body::after{
    content:none!important;
    display:none!important;
  }

  .mp-location-legend button span{
    position:relative!important;
    display:grid!important;
    place-items:center!important;
    color:#fff!important;
    font:700 14px/1 Arial,sans-serif!important;
  }
  .mp-location-legend button span::after{
    content:"✓"!important;
    opacity:0!important;
    transform:translateY(-1px)!important;
  }
  .mp-location-legend button.is-active span::after{
    opacity:1!important;
  }
}


/* ========================================================================== 
   3.13.18 — LOCATIEKAARTJE: afbeelding draagt de vorm, geen rode fotorrand
   ========================================================================== */
@media (max-width:899px){
  .mp-location-stage--real .mp-location-feature{
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    overflow:visible!important;
  }
  .mp-location-stage--real .mp-location-feature__image{
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    overflow:visible!important;
  }
  .mp-location-stage--real .mp-location-feature__image img{
    display:block!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    clip-path:inset(0 round 16px 16px 0 0)!important;
  }
  .mp-location-stage--real .mp-location-feature__body{
    margin:0!important;
    border:0!important;
    border-radius:0!important;
  }
}


/* ========================================================================== 
   3.13.19 — LOCATIEKAARTJE: grotere punt, naadloos aangesloten
   ========================================================================== */
@media (max-width:899px){
  .mp-location-stage--real .mp-location-feature::after{
    bottom:-30px!important;
    border-top-width:32px!important;
    border-right-width:32px!important;
  }
}

/* ========================================================================== 
   3.13.20 — LOCATIEKAARTJE: pointer gebruikt exacte Figma-pinvector
   ========================================================================== */
@media (max-width:899px){
  .mp-location-stage--real .mp-location-feature::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    bottom:-33px!important;
    width:30px!important;
    height:35px!important;
    border:0!important;
    background:#E4032E!important;
    -webkit-mask:url('../images/shapes/figma-shape-location-card-pointer.svg') 0 0/100% 100% no-repeat!important;
    mask:url('../images/shapes/figma-shape-location-card-pointer.svg') 0 0/100% 100% no-repeat!important;
    pointer-events:none!important;
  }
}

/* ========================================================================== 
   3.13.21 — LOCATIEKAARTJE: pointerverhouding exact volgens ontwerp
   ========================================================================== */
@media (max-width:899px){
  .mp-location-stage--real .mp-location-feature::after{
    left:0!important;
    bottom:-37px!important;
    width:42px!important;
    height:39px!important;
    border:0!important;
    background:#E4032E!important;
    -webkit-mask:url('../images/shapes/figma-shape-location-card-pointer.svg') 0 0/100% 100% no-repeat!important;
    mask:url('../images/shapes/figma-shape-location-card-pointer.svg') 0 0/100% 100% no-repeat!important;
  }
}

/* ========================================================================== 
   3.13.22 — LOCATIEKAARTJE: één masker voor complete Figma-vorm
   ========================================================================== */
@media (max-width:899px){
  .mp-location-stage--real .mp-location-feature{
    box-sizing:border-box!important;
    padding:0 0 18% 0!important;
    background:#E4032E!important;
    border:0!important;
    border-radius:0!important;
    overflow:visible!important;
    -webkit-mask:url('../images/shapes/figma-shape-location-card.svg') center/100% 100% no-repeat!important;
    mask:url('../images/shapes/figma-shape-location-card.svg') center/100% 100% no-repeat!important;
  }
  .mp-location-stage--real .mp-location-feature__image,
  .mp-location-stage--real .mp-location-feature__image img{
    border-radius:0!important;
    clip-path:none!important;
  }
  .mp-location-stage--real .mp-location-feature::after{
    content:none!important;
    display:none!important;
  }
}

/* ========================================================================== 
   3.13.23 — LOCATIEKAARTJE: masker uitsluitend op het afbeeldingsvlak
   ========================================================================== */
@media (max-width:899px){
  .mp-location-stage--real .mp-location-feature{
    box-sizing:border-box!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    overflow:visible!important;
    -webkit-mask:none!important;
    mask:none!important;
  }
  .mp-location-stage--real .mp-location-feature__image{
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    overflow:visible!important;
  }
  .mp-location-stage--real .mp-location-feature__image img{
    display:block!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    clip-path:none!important;
    -webkit-mask:url('../images/shapes/figma-shape-location-card-image.svg') center/100% 100% no-repeat!important;
    mask:url('../images/shapes/figma-shape-location-card-image.svg') center/100% 100% no-repeat!important;
  }
  .mp-location-stage--real .mp-location-feature::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    bottom:-37px!important;
    width:42px!important;
    height:39px!important;
    border:0!important;
    background:#E4032E!important;
    -webkit-mask:url('../images/shapes/figma-shape-location-card-pointer.svg') 0 0/100% 100% no-repeat!important;
    mask:url('../images/shapes/figma-shape-location-card-pointer.svg') 0 0/100% 100% no-repeat!important;
    pointer-events:none!important;
  }
}

/* ========================================================================
   3.13.26 — MOBILE CONTENT PAGE HEADER according to Figma
   Green reference area = page photo placeholder.
   ======================================================================== */
.mp-figma-content-page--strict .mp-pdf-content-page{
  position:relative!important;
  overflow:hidden!important;
  background:#fff!important;
}
.mp-figma-content-page--strict .mp-content-masthead{
  position:relative!important;
  width:100%!important;
  height:315px!important;
  margin:0!important;
  overflow:hidden!important;
  background:#fff!important;
}
.mp-figma-content-page--strict .mp-content-photo,
.mp-figma-content-page--strict .mp-content-swoop{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:315px!important;
  margin:0!important;
}
.mp-figma-content-page--strict .mp-content-swoop{
  z-index:1!important;
  background:linear-gradient(100deg,#E4032E 0%,#B1125C 45%,#482974 100%)!important;
  -webkit-mask:url('../images/shapes/figma-shape-content-band-mobile.svg') center/100% 100% no-repeat!important;
  mask:url('../images/shapes/figma-shape-content-band-mobile.svg') center/100% 100% no-repeat!important;
  clip-path:none!important;
}
.mp-figma-content-page--strict .mp-content-photo{
  z-index:2!important;
  background-image:var(--mp-content-image)!important;
  background-size:cover!important;
  background-position:center 42%!important;
  background-repeat:no-repeat!important;
  -webkit-mask:url('../images/shapes/figma-shape-content-photo-mobile.svg') center/100% 100% no-repeat!important;
  mask:url('../images/shapes/figma-shape-content-photo-mobile.svg') center/100% 100% no-repeat!important;
}
.mp-figma-content-page--strict .mp-figma-content-body{
  margin:0!important;
  padding:18px 20px 24px!important;
  background:#fff!important;
}
.mp-figma-content-page--strict .mp-figma-content-body::before{display:none!important}
.mp-figma-content-page--strict .mp-figma-content-body>.mp-figma-inner{
  padding-top:0!important;
}
.mp-figma-content-page--strict .mp-figma-copy>.mp-figma-kicker{display:none!important}

/* ========================================================================
   3.13.27 — MOBILE CONTENT HEADER: Figma band in front of the photo.
   ======================================================================== */
.mp-figma-content-page--strict .mp-content-photo{
  z-index:2!important;
}
.mp-figma-content-page--strict .mp-content-swoop{
  z-index:3!important;
  background:transparent url('../images/shapes/figma-shape-content-band-mobile-gradient.svg') center/100% 100% no-repeat!important;
  -webkit-mask:none!important;
  mask:none!important;
  clip-path:none!important;
  pointer-events:none!important;
}

/* ========================================================================
   3.13.28 — MOBILE CONTENT HEADER: align with Figma mobile composition.
   Photo continues lower; gradient tab starts around 55% width; no breadcrumb.
   ======================================================================== */
.mp-figma-content-page--strict .mp-figma-breadcrumb{
  display:none!important;
}
.mp-figma-content-page--strict .mp-figma-content-body{
  padding-top:20px!important;
}

/* ========================================================================
   3.13.29 — MOBILE CONTENT HEADER: Figma band geometry refinement.
   The gradient tab starts around 32% of the viewport and sits closer to
   the photo edge, matching the supplied mobile Figma frame.
   ======================================================================== */
.mp-figma-content-page--strict .mp-content-swoop{
  background-image:url('../images/shapes/figma-shape-content-band-mobile-gradient.svg')!important;
}

/* ==========================================================================
   3.13.36 — INNER PAGES: white footer lead-in on mobile.
   ========================================================================== */
.mp-site-footer--inner::before{
  background-image:url("../images/footer-top-mobile-figma-white.png") !important;
}