/*
 * Mijnplein homepage — Figma rebuild 3.8.0
 * Source of truth: Desktop homepage STANDAARD node 301:863. It is a centered 1440px crop of the 2200px widescreen master.
 * This file intentionally replaces all earlier widescreen homepage experiments.
 */
:root{
	--mp-red:#E4032E;
	--mp-purple:#482974;
	--mp-blue:#1488CA;
	--mp-yellow:#F0AB21;
	--mp-light:#F0F0F0;
	--mp-master:2200px;
	--mp-master-left:calc(50% - 1100px);
}
html,body{overflow-x:hidden!important}
.mp-figma-home{position:relative!important;height:6060px!important;font-family:"KoHo",Arial,sans-serif!important;background:#fff!important;overflow:hidden!important}
.mp-figma-home *{box-sizing:border-box}
.mp-figma-home .mp-figma-inner{max-width:none!important;margin:0!important}

/* HEADER — Figma 300:814 */
.mp-site-header{
	position:absolute!important;top:0!important;left:0!important;right:0!important;
	z-index:100!important;height:145px!important;min-height:145px!important;
	max-width:none!important;margin:0!important;padding:0!important;
	display:flex!important;align-items:flex-start!important;justify-content:space-between!important;
	background:linear-gradient(to bottom,rgba(0,0,0,.58),rgba(0,0,0,0))!important;
	box-shadow:none!important;color:#fff!important;
}
.admin-bar .mp-site-header{top:32px!important}
.mp-brand-tab{
	display:block!important;width:320px!important;height:113px!important;flex:0 0 320px!important;
	margin:0!important;padding:0!important;border:0!important;border-radius:0!important;
	background:transparent url("../images/mijnplein-logo-tab.png") no-repeat left top/100% 100%!important;
	box-shadow:none!important;
}
.mp-brand-tab span{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important}
.mp-primary-navigation{
	position:absolute!important;right:69px!important;top:36px!important;height:55px!important;
	margin:0!important;padding:0!important;color:#fff!important;
}
.mp-primary-navigation .wp-block-navigation__container{gap:28px!important;align-items:center!important;flex-wrap:nowrap!important}
.mp-primary-navigation .wp-block-navigation-item__content{
	color:#fff!important;font:500 22px/50px "KoHo",Arial,sans-serif!important;padding:0!important;text-decoration:none!important;white-space:nowrap!important;
}
.mp-primary-navigation .mp-nav-language>.wp-block-navigation-item__content{
	border:2px solid #fff!important;border-radius:12px!important;height:46px!important;min-width:67px!important;line-height:42px!important;text-align:center!important;padding:0 20px 0 10px!important;
}
.mp-primary-navigation .mp-nav-vacancies>.wp-block-navigation-item__content{
	background:#fff!important;color:var(--mp-red)!important;border-radius:12px!important;height:46px!important;min-width:161px!important;
	line-height:46px!important;text-align:center!important;padding:0 14px!important;font-weight:700!important;
}
.mp-primary-navigation .wp-block-navigation__responsive-container-open{display:none!important}

/* HERO / INTRO — Figma 300:812 */
.mp-home-hero{
	position:absolute!important;left:0!important;top:0!important;width:100%!important;height:1385px!important;
	padding:0!important;margin:0!important;background:#fff!important;overflow:hidden!important;
}
.mp-home-hero__photo{
	position:absolute!important;left:0!important;top:0!important;width:100%!important;height:811px!important;min-height:0!important;
	background-image:var(--mp-hero-image)!important;background-size:cover!important;background-position:center center!important;
}
.mp-home-hero:after{
	content:""!important;position:absolute!important;left:0!important;top:668px!important;width:100%!important;height:717px!important;
	background:var(--mp-light)!important;z-index:0!important;
}
.mp-home-hero__panels{
	position:absolute!important;left:var(--mp-master-left)!important;top:0!important;width:2200px!important;height:1385px!important;
	display:block!important;margin:0!important;z-index:2!important;
}
.mp-home-hero__copy{
	position:absolute!important;left:222px!important;top:558px!important;width:1132px!important;height:550px!important;
	padding:118px 135px 70px 230px!important;margin:0!important;background:transparent!important;border:0!important;border-radius:0!important;clip-path:none!important;box-shadow:none!important;z-index:2!important;
}
.mp-home-hero__copy:before{
	content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;background:#fff!important;
	border-radius:72px 96px 36px 72px / 76px 88px 44px 76px!important;
	transform:rotate(-1.7deg) skewX(-1.8deg)!important;transform-origin:center!important;
	box-shadow:none!important;
}
.mp-home-hero__copy h1{
	margin:0 0 13px!important;color:var(--mp-red)!important;font:700 56px/60px "KoHo",Arial,sans-serif!important;font-style:normal!important;letter-spacing:0!important;
}
.mp-home-hero__copy p{
	width:767px!important;max-width:767px!important;margin:0 0 18px!important;color:#000!important;font:500 19px/26px "KoHo",Arial,sans-serif!important;
}
.mp-home-hero__copy .mp-figma-actions{display:flex!important;gap:22px!important;align-items:center!important}
.mp-figma-button{
	display:inline-flex!important;align-items:center!important;justify-content:center!important;height:55px!important;min-height:55px!important;
	padding:0 38px!important;border-radius:8px!important;background:var(--mp-blue)!important;color:#fff!important;
	font:500 22px/22.4px "KoHo",Arial,sans-serif!important;text-decoration:none!important;border:1.5px solid var(--mp-blue)!important;box-shadow:none!important;
}
.mp-figma-button--ghost{background:#fff!important;color:var(--mp-blue)!important}
.mp-home-hero__slogan{
	position:absolute!important;left:1029px!important;top:516px!important;width:906px!important;height:463px!important;min-height:0!important;
	padding:0px 0 0 360px!important;margin:0!important;background:transparent!important;border:0!important;border-radius:0!important;
	transform:none!important;color:#fff!important;font:700 55px/60px "KoHo",Arial,sans-serif!important;font-style:italic!important;z-index:1!important;
}
.mp-home-hero__slogan:before{
	content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;
	background:linear-gradient(113deg,var(--mp-red) 0%,#aa145b 34%,var(--mp-purple) 78%)!important;
	border-radius:78px 72px 76px 54px / 54px 64px 78px 58px!important;
	transform:rotate(2.4deg)!important;transform-origin:center!important;
}
.mp-home-quick{
	position:absolute!important;left:calc(50% - 627px)!important;top:1110px!important;width:1440px!important;height:87px!important;
	display:flex!important;align-items:center!important;gap:23px!important;margin:0!important;z-index:3!important;
}
.mp-home-quick>span{color:#7E7E7E!important;font:500 27px/33px "KoHo",Arial,sans-serif!important}
.mp-home-quick a{
	display:flex!important;align-items:center!important;justify-content:center!important;width:203px!important;height:55px!important;
	padding:0!important;background:#fff!important;color:var(--mp-red)!important;border-radius:12px!important;
	font:700 18px/50px "KoHo",Arial,sans-serif!important;text-decoration:none!important;box-shadow:none!important;
}

/* VISIE — absolute position in master page at y=945 */
.mp-home-vision{
	position:absolute!important;left:0!important;top:945px!important;width:100%!important;height:970px!important;
	margin:0!important;padding:0!important;background:transparent!important;overflow:hidden!important;isolation:auto!important;
}
.mp-home-vision__grey{
	position:absolute!important;left:0!important;top:334px!important;width:100%!important;height:636px!important;z-index:0!important;
	background:var(--mp-light)!important;clip-path:polygon(0 17%,100% 0,100% 55%,0 100%)!important;
}
.mp-home-vision>.mp-figma-inner{
	position:absolute!important;left:var(--mp-master-left)!important;top:0!important;width:2200px!important;height:970px!important;display:block!important;z-index:1!important;
}
.mp-home-vision__visual{position:absolute!important;left:455px!important;top:241px!important;width:550px!important;height:409px!important;margin:0!important}
.mp-home-vision__visual img{display:block!important;width:550px!important;height:409px!important;object-fit:cover!important;box-shadow:0 16px 28px rgba(0,0,0,.12)!important}
.mp-home-vision blockquote{
	position:absolute!important;left:1114px!important;top:480px!important;width:630px!important;margin:0!important;padding:0!important;
	color:var(--mp-purple)!important;font:700 36px/40px "KoHo",Arial,sans-serif!important;font-style:normal!important;
}
.mp-home-vision__heading{position:absolute!important;left:451px!important;top:732px!important;width:594px!important}
.mp-home-vision__heading h2{margin:0!important;color:var(--mp-red)!important;font:700 36px/40px "KoHo",Arial,sans-serif!important;font-style:normal!important}
.mp-home-vision__copy{position:absolute!important;left:1114px!important;top:594px!important;width:630px!important;padding:0!important;margin: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/23px "KoHo",Arial,sans-serif!important}
.mp-home-vision__copy a{color:var(--mp-blue)!important;font:400 16px/23px "KoHo",Arial,sans-serif!important;text-decoration:none!important}

/* WERKEN BIJ — y=1834 */
.mp-home-work{
	position:absolute!important;left:0!important;top:1834px!important;width:100%!important;height:970px!important;
	margin:0!important;padding:0!important;background:#fff!important;overflow:hidden!important;isolation:auto!important;
}
.mp-home-work__decor{position:absolute!important;left:var(--mp-master-left)!important;top:0!important;width:2200px!important;height:970px!important;z-index:0!important;display:block!important}
.mp-home-work__purple{
	position:absolute!important;left:214px!important;top:66px!important;width:1021px!important;height:532px!important;
	background:linear-gradient(111deg,var(--mp-purple) 0%,#7b1f72 48%,var(--mp-red) 100%)!important;
	border-radius:72px 112px 66px 58px / 76px 82px 64px 70px!important;transform:rotate(2.7deg)!important;
}
.mp-home-work__red{display:none!important}
.mp-home-work__yellow{
	position:absolute!important;left:786px!important;top:276px!important;width:1323px!important;height:627px!important;
	background:var(--mp-yellow)!important;border-radius:70px 64px 92px 150px / 56px 60px 86px 124px!important;transform:rotate(-2.4deg)!important;
}
.mp-home-work__shape{
	position:absolute!important;left:var(--mp-master-left)!important;top:0!important;width:2200px!important;height:970px!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:2!important;
}
.mp-home-work__shape:before{
	content:""!important;position:absolute!important;left:696px!important;top:192px!important;width:1048px!important;height:604px!important;
	background:#fff!important;border-radius:30px!important;box-shadow:none!important;z-index:0!important;
}
.mp-home-work__visual{position:absolute!important;left:454px!important;top:285px!important;width:570px!important;height:409px!important;margin:0!important;z-index:2!important;box-shadow:none!important}
.mp-home-work__visual img{display:block!important;width:570px!important;height:409px!important;object-fit:cover!important;box-shadow:0 16px 28px rgba(0,0,0,.12)!important}
.mp-home-work__copy{position:absolute!important;left:1114px!important;top:299px!important;width:606px!important;padding:0!important;margin:0!important;z-index:3!important}
.mp-home-work .mp-figma-kicker{display:block!important;margin:0 0 5px!important;color:var(--mp-red)!important;font:600 italic 56px/60px "KoHo",Arial,sans-serif!important}
.mp-home-work__copy h2{width:606px!important;margin:0 0 10px!important;color:var(--mp-purple)!important;font:700 36px/40px "KoHo",Arial,sans-serif!important;font-style:normal!important}
.mp-home-work__copy p{width:585px!important;margin:0 0 23px!important;color:#000!important;font:400 16px/23px "KoHo",Arial,sans-serif!important}
.mp-home-work__copy .mp-figma-actions{display:flex!important;gap:22px!important;flex-wrap:nowrap!important}
.mp-home-work__copy .mp-figma-button{width:236px!important;padding:0!important}

/* VACATURES — y=2767 */
.mp-home-vacancies{
	position:absolute!important;left:0!important;top:2767px!important;width:100%!important;height:1156px!important;
	margin:0!important;padding:68px 0 0!important;background:#fff!important;overflow:hidden!important;
}
.mp-home-vacancies>.mp-figma-inner{width:100%!important;height:100%!important}
.mp-home-vacancies h2{margin:0 0 58px!important;text-align:center!important;color:var(--mp-red)!important;font:600 italic 56px/60px "KoHo",Arial,sans-serif!important}
.mp-vacancy-slider{width:100%!important}
.mp-vacancy-slider__viewport{width:100%!important;overflow:hidden!important;padding-left:max(75px,calc(50% - 913px))!important}
.mp-vacancy-slider__track{display:flex!important;gap:107px!important;align-items:flex-start!important}
.mp-figma-vacancy{
	flex:0 0 413px!important;width:413px!important;height:620px!important;min-height:620px!important;
	padding:60px 0 0!important;margin:0!important;background:var(--mp-light)!important;border-radius:30px!important;box-shadow:none!important;overflow:visible!important;
}
.mp-figma-vacancy__media{width:393px!important;height:393px!important;margin:-60px auto 0!important;box-shadow:0 13px 24px rgba(0,0,0,.13)!important;overflow:hidden!important}
.mp-figma-vacancy__media img{display:block!important;width:393px!important;height:393px!important;object-fit:cover!important}
.mp-figma-vacancy__body{padding:18px 28px 30px!important}
.mp-figma-vacancy__status{display:inline-flex!important;min-height:40px!important;padding:7px 15px!important;border-radius:200px!important;background:var(--mp-red)!important;color:#fff!important;font:700 18px/26px "KoHo",Arial,sans-serif!important}
.mp-figma-vacancy h3{margin:8px 0 0!important;color:var(--mp-purple)!important;font:700 27px/33px "KoHo",Arial,sans-serif!important}
.mp-figma-vacancy__meta{color:var(--mp-purple)!important;font:500 27px/33px "KoHo",Arial,sans-serif!important}
.mp-figma-vacancy__excerpt{margin:17px 0 0!important;color:#000!important;font:400 16px/23px "KoHo",Arial,sans-serif!important}
.mp-vacancy-slider__controls{display:flex!important;justify-content:center!important;gap:38px!important;margin:46px 0 0!important}
.mp-vacancy-slider__controls button{width:42px!important;height:42px!important;border-radius:50%!important;border:0!important;background:#fff!important;box-shadow:0 0 18px rgba(0,0,0,.08)!important;color:var(--mp-blue)!important}
.mp-home-vacancies .mp-home-center{margin-top:21px!important;text-align:center!important}

/* LOCATIES — y=3957 */
.mp-home-locations{
	position:absolute!important;left:0!important;top:3957px!important;width:100%!important;height:1460px!important;
	margin:0!important;padding:64px 0 0!important;background:#fff!important;overflow:hidden!important;
}
.mp-home-locations__heading{width:100%!important;text-align:center!important}
.mp-home-locations__heading .mp-figma-kicker{display:block!important;margin:0!important;color:var(--mp-red)!important;font:600 italic 56px/60px "KoHo",Arial,sans-serif!important}
.mp-home-locations__heading h2{margin:0!important;color:var(--mp-purple)!important;font:700 36px/40px "KoHo",Arial,sans-serif!important;font-style:normal!important}
.mp-location-stage--real{position:absolute!important;left:0!important;top:234px!important;width:100%!important;height:698px!important;margin:0!important;padding:0!important;background:#eee!important;overflow:hidden!important}
.mp-real-map{width:100%!important;height:698px!important}
.mp-location-feature{
	position:absolute!important;z-index:500!important;right:max(308px,calc(50% - 760px))!important;top:90px!important;width:268px!important;
	background:var(--mp-red)!important;color:#fff!important;border-radius:0!important;box-shadow:none!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:var(--mp-red)!important;color:#fff!important}
.mp-location-feature__body:after{
	content:""!important;position:absolute!important;left:0!important;bottom:-32px!important;border-top:32px solid var(--mp-red)!important;border-right:32px solid transparent!important;
}
.mp-location-feature .mp-figma-kicker{font:700 12px/17px "KoHo",Arial,sans-serif!important;color:#fff!important}
.mp-location-feature h3{margin:2px 0 0!important;font:700 19px/26px "KoHo",Arial,sans-serif!important;color:#fff!important}
.mp-location-feature p{margin:0!important;font:500 12px/17px "KoHo",Arial,sans-serif!important;color:#fff!important}
.mp-location-feature a{position:absolute!important;right:14px!important;bottom:21px!important;width:42px!important;height:42px!important;border-radius:50%!important;background:#fff!important;color:var(--mp-blue)!important;display:grid!important;place-items:center!important;text-decoration:none!important}
.mp-location-legend{
	position:absolute!important;right:max(350px,calc(50% - 680px))!important;bottom:31px!important;min-height:58px!important;padding:10px 22px!important;
	display:flex!important;gap:26px!important;align-items:center!important;background:#fff!important;border-radius:200px!important;box-shadow:0 0 27px rgba(0,0,0,.25)!important;
	font:500 19px/26px "KoHo",Arial,sans-serif!important;z-index:500!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}
.mp-location-legend button span{width:32px!important;height:32px!important;border-radius:50%!important;background:var(--mp-red)!important}
.mp-location-legend button[data-location-filter="combined"] span{background:var(--mp-yellow)!important}
.mp-location-details-wrap{position:absolute!important;left:0!important;top:932px!important;width:100%!important;height:528px!important;background:#fff!important;padding:0!important;margin:0!important;overflow:visible!important}
.mp-location-details{
	position:absolute!important;left:calc(50% - 647px)!important;top:0!important;width:1294px!important;height:528px!important;
	display:grid!important;grid-template-columns:275px 1fr!important;gap:100px!important;padding-top:130px!important;margin:0!important;
}
.mp-location-details__title{
	position:absolute!important;left:-117px!important;top:-84px!important;width:438px!important;height:95px!important;padding:19px 50px!important;
	background:var(--mp-yellow)!important;color:#fff!important;border-radius:0 50px 8px 0!important;transform:skewX(-7deg)!important;
	font:600 italic 60px/60px "KoHo",Arial,sans-serif!important;
}
.mp-location-details__title span{display:block!important;transform:skewX(7deg)!important}
.mp-location-office h3,.mp-location-list h3{margin:0 0 19px!important;color:var(--mp-purple)!important;font:700 27px/33px "KoHo",Arial,sans-serif!important}
.mp-location-office p,.mp-location-list a{color:#000!important;font:500 19px/26px "KoHo",Arial,sans-serif!important;text-decoration:none!important}
.mp-location-office p{margin:0 0 20px!important}
.mp-location-list{columns:2!important;column-gap:70px!important}
.mp-location-list h3{column-span:all!important}

/* SLUIT JE AAN — y=5389 */
.mp-home-join{
	position:absolute!important;left:0!important;top:5389px!important;width:100%!important;height:701px!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:54px!important;width:100%!important;height:819px!important;
	background:var(--mp-light)!important;clip-path:polygon(0 8%,100% 0,100% 78%,0 100%)!important;transform:none!important;
}
.mp-home-join>.mp-figma-inner{position:absolute!important;left:var(--mp-master-left)!important;top:0!important;width:2200px!important;height:701px!important;display:block!important;z-index:1!important}
.mp-home-join__visual{position:absolute!important;left:455px!important;top:0!important;width:442px!important;margin:0!important}
.mp-home-join__visual img{display:block!important;width:442px!important;height:393px!important;object-fit:cover!important;box-shadow:0 16px 28px rgba(0,0,0,.12)!important}
.mp-home-join__visual blockquote{width:460px!important;margin:42px 0 0!important;color:var(--mp-red)!important;font:700 36px/40px "KoHo",Arial,sans-serif!important;font-style:normal!important}
.mp-home-join__copy{position:absolute!important;left:1004px!important;top:210px!important;width:632px!important;padding:0!important}
.mp-home-join__copy h2{margin:0 0 22px!important;color:var(--mp-purple)!important;font:700 36px/40px "KoHo",Arial,sans-serif!important}
.mp-home-join__copy p{margin:0 0 19.6px!important;color:#000!important;font:400 16px/23px "KoHo",Arial,sans-serif!important}
.mp-home-join__copy .mp-figma-button{margin-top:8px!important;padding:0 64px!important}

/* FOOTER — begins at y=6060 */
.mp-site-footer{
	position:relative!important;z-index:5!important;min-height:599px!important;height:599px!important;
	margin:0!important;padding:184px 0 0!important;background:var(--mp-purple)!important;color:#fff!important;overflow:hidden!important;
}
.mp-site-footer:before{
	content:""!important;position:absolute!important;left:0!important;top:0!important;width:100%!important;height:187px!important;
	background:linear-gradient(96deg,var(--mp-red),#c20c56 43%,var(--mp-purple))!important;
	clip-path:polygon(0 0,100% 26%,100% 100%,0 70%)!important;z-index:0!important;
}
.mp-footer-tab{
	position:absolute!important;right:0!important;top:23px!important;width:307px!important;height:109px!important;padding:34px 0 0!important;
	background:var(--mp-red)!important;color:#fff!important;text-align:center!important;font:700 27px/33px "KoHo",Arial,sans-serif!important;
	border-radius:44px 0 0 0!important;z-index:2!important;
}
.mp-footer-columns{
	position:relative!important;z-index:2!important;width:1852px!important;max-width:calc(100% - 348px)!important;margin:0 auto!important;
	display:grid!important;grid-template-columns:310px 310px 310px!important;gap:180px!important;color:#fff!important;
}
.mp-footer-columns h3{color:#fff!important;font:700 19px/26px "KoHo",Arial,sans-serif!important;margin:0 0 10px!important}
.mp-footer-columns p,.mp-footer-columns a{color:#fff!important;font:500 19px/26px "KoHo",Arial,sans-serif!important}

/* STANDARD desktop is explicitly the centered crop shown by Figma. */
:root{--mp-master-left:calc(50% - 1100px)}
.mp-site-header{height:145px!important}
.mp-primary-navigation{right:75px!important}
.mp-home-quick{display:none!important}
.mp-location-details{left:73px!important;width:1294px!important}
.mp-location-details__title{left:-73px!important}


/* ==========================================================================
   3.8.1 — WIDESCREEN/STANDAARD detailcorrecties
   ========================================================================== */

/* VACATURES — Figma: square 393px image floats 60px above 413px grey card.
   Older global styles used a landscape ratio and pushed the text too far down. */
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy{
	position:relative !important;
	flex:0 0 413px !important;
	width:413px !important;
	height:620px !important;
	min-height:620px !important;
	margin:60px 0 0 !important;
	padding:0 !important;
	background:#F0F0F0 !important;
	border:0 !important;
	border-radius:30px !important;
	box-shadow:none !important;
	overflow:visible !important;
}
.mp-home-vacancies .mp-figma-vacancy__media{
	position:absolute !important;
	left:10px !important;
	top:-60px !important;
	width:393px !important;
	height:480px !important;
	min-height:0 !important;
	margin:0 !important;
	overflow:visible !important;
	background:transparent !important;
}
.mp-home-vacancies .mp-figma-vacancy__media .mp-figma-card-image{
	position:absolute !important;
	left:0 !important;
	top:0 !important;
	width:393px !important;
	height:393px !important;
	aspect-ratio:auto !important;
	margin:0 !important;
	overflow:hidden !important;
	background:#ddd !important;
	box-shadow:0 13px 24px rgba(0,0,0,.13) !important;
	border-radius:0 !important;
}
.mp-home-vacancies .mp-figma-vacancy__media .mp-figma-card-image img{
	display:block !important;
	width:393px !important;
	height:393px !important;
	max-width:none !important;
	object-fit:cover !important;
	object-position:center !important;
}
.mp-home-vacancies .mp-figma-vacancy__media .mp-figma-vacancy__status{
	position:absolute !important;
	left:0 !important;
	top:440px !important;
	bottom:auto !important;
	margin:0 !important;
	min-height:40px !important;
	padding:7px 15px !important;
	border-radius:200px !important;
	background:#E4032E !important;
	color:#fff !important;
	font:700 18px/26px "KoHo",Arial,sans-serif !important;
	white-space:nowrap !important;
}
.mp-home-vacancies .mp-figma-vacancy__body{
	position:absolute !important;
	left:28px !important;
	right:28px !important;
	top:495px !important;
	padding:0 !important;
	margin:0 !important;
}
.mp-home-vacancies .mp-figma-vacancy__body h3{
	margin:0 !important;
	color:#482974 !important;
	font:700 27px/33px "KoHo",Arial,sans-serif !important;
}
.mp-home-vacancies .mp-figma-vacancy__meta{
	margin:0 !important;
	color:#482974 !important;
	font:500 27px/33px "KoHo",Arial,sans-serif !important;
}
.mp-home-vacancies .mp-figma-vacancy__excerpt{
	margin:17px 0 0 !important;
	color:#000 !important;
	font:400 16px/23px "KoHo",Arial,sans-serif !important;
}
.mp-home-vacancies .mp-figma-vacancy__body>a{
	color:#1488CA !important;
	font:400 16px/23px "KoHo",Arial,sans-serif !important;
	text-decoration:none !important;
}
.mp-home-vacancies .mp-vacancy-slider__viewport{
	padding-top:0 !important;
	padding-bottom:0 !important;
}
.mp-home-vacancies .mp-vacancy-slider__track{
	gap:107px !important;
}

/* LOCATION MAP — marker styling was lost in the clean 3.8.0 rebuild.
   Leaflet was still creating the markers, but the custom spans had no visible shape. */
.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;
}
.mp-location-stage--real .leaflet-marker-icon{
	background:transparent !important;
	border:0 !important;
}
.mp-location-stage--real .leaflet-tooltip{
	font-family:"KoHo",Arial,sans-serif !important;
	border:0 !important;
	border-radius:8px !important;
	box-shadow:0 6px 18px rgba(0,0,0,.14) !important;
}

/* Selected location card stays above markers but below Leaflet controls. */
.mp-location-stage--real .mp-location-feature{z-index:650 !important}
.mp-location-stage--real .mp-location-legend{z-index:650 !important}

/* FOOTER LOGO — use the real Mijnplein wordmark instead of plain KoHo text. */
.mp-site-footer .mp-footer-tab{
	font-size:0 !important;
	line-height:0 !important;
	width:307px !important;
	height:109px !important;
	padding:0 !important;
	background:#E4032E url("../images/mijnplein-wordmark.png") no-repeat center center / 165px auto !important;
	border-radius:44px 0 0 0 !important;
	clip-path:polygon(14% 0,100% 0,100% 100%,0 100%,0 34%,4% 13%) !important;
	box-shadow:none !important;
}


/* ==========================================================================
   3.8.2 — hoofdmenu verticaal uitlijnen met Mijnplein-wordmark
   De zichtbare witte wordmark in het logo ligt hoger dan het midden van
   het rode logo-tabvlak. Daarom lijnen we de navigatie uit op de wordmark
   zelf in plaats van op het volledige 113px hoge tabvlak.
   ========================================================================== */
.mp-site-header .mp-primary-navigation{
	top:22px !important;
	height:55px !important;
	display:flex !important;
	align-items:center !important;
}
.mp-site-header .mp-primary-navigation .wp-block-navigation__container{
	height:55px !important;
	align-items:center !important;
}
.mp-site-header .mp-primary-navigation .wp-block-navigation-item{
	display:flex !important;
	align-items:center !important;
	height:55px !important;
}
.mp-site-header .mp-primary-navigation .wp-block-navigation-item__content{
	display:flex !important;
	align-items:center !important;
	height:55px !important;
	line-height:1 !important;
}
.mp-site-header .mp-primary-navigation .mp-nav-language>.wp-block-navigation-item__content,
.mp-site-header .mp-primary-navigation .mp-nav-vacancies>.wp-block-navigation-item__content{
	height:46px !important;
	min-height:46px !important;
	line-height:46px !important;
}


/* ==========================================================================
   3.8.3 — HEADER standard desktop
   Zelfde Figma-uitlijning als widescreen; de desktopmaster wordt gecropt.
   ========================================================================== */
.mp-site-header{
	height:145px !important;
	min-height:145px !important;
	background:linear-gradient(
		to bottom,
		rgba(0,0,0,.60) 0%,
		rgba(0,0,0,.38) 31%,
		rgba(0,0,0,.16) 62%,
		rgba(0,0,0,0) 100%
	) !important;
	box-shadow:none !important;
}
.mp-site-header .mp-brand-tab{
	position:absolute !important;
	left:0 !important;
	top:0 !important;
	width:320px !important;
	height:113px !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-site-header .mp-primary-navigation{
	top:36px !important;
	height:55px !important;
	display:flex !important;
	align-items:flex-start !important;
}
.mp-site-header .mp-primary-navigation .wp-block-navigation__container{
	height:55px !important;
	align-items:flex-start !important;
}
.mp-site-header .mp-primary-navigation .wp-block-navigation-item,
.mp-site-header .mp-primary-navigation .wp-block-navigation-item__content{
	height:55px !important;
	align-items:flex-start !important;
}
.mp-site-header .mp-primary-navigation .wp-block-navigation-item__content{
	font:500 22px/50px "KoHo",Arial,sans-serif !important;
}
.mp-site-header .mp-primary-navigation .mp-nav-language>.wp-block-navigation-item__content,
.mp-site-header .mp-primary-navigation .mp-nav-vacancies>.wp-block-navigation-item__content{
	margin-top:4px !important;
	height:46px !important;
	min-height:46px !important;
	align-items:center !important;
}


/* ==========================================================================
   3.8.4 — live WordPress header alignment correction
   In the rendered WP Navigation block the visible menu text sat ~46px lower
   than the logo wordmark despite the Figma y-coordinate. Compensate at the
   navigation block level so the visible text baseline matches the logo.
   ========================================================================== */
.mp-site-header .mp-primary-navigation{
	top:-10px !important;
}
.mp-site-header .mp-primary-navigation .wp-block-navigation__responsive-container,
.mp-site-header .mp-primary-navigation .wp-block-navigation__responsive-container-content{
	margin-top:0 !important;
	padding-top:0 !important;
}
.mp-site-header .mp-primary-navigation .wp-block-navigation__container{
	margin-top:0 !important;
	padding-top:0 !important;
}

/* Keep the Figma dark header glow clearly visible over the hero photo. */
.mp-site-header{
	background:
		linear-gradient(
			to bottom,
			rgba(0,0,0,.60) 0%,
			rgba(0,0,0,.44) 28%,
			rgba(0,0,0,.23) 56%,
			rgba(0,0,0,.08) 78%,
			rgba(0,0,0,0) 100%
		) !important;
}


/* ==========================================================================
   3.8.5 — header menu fine-tuning na live screenshot
   3.8.4 zette de WP-navigation te ver omhoog. De zichtbare menutekst wordt
   nu teruggezet naar een optische middenpositie ten opzichte van de witte
   mijnplein-wordmark.
   ========================================================================== */
.mp-site-header .mp-primary-navigation{
	top:20px !important;
}

/* 3.9.0 — Figma node 426:4885: separate "Ga snel naar" frame */
.mp-figma-home{height:6225px !important}
.mp-home-vision{top:1110px !important}
.mp-home-work{top:1999px !important}
.mp-home-vacancies{top:2932px !important}
.mp-home-locations{top:4122px !important}
.mp-home-join{top:5554px !important}


/* 3.9.1 — functional tools appended to editable WordPress navigation */
.mp-site-header .mp-header-tools{
	display:flex !important;
	flex-direction:row !important;
	align-items:center !important;
	gap:14px !important;
	height:55px !important;
	padding:0 !important;
	margin:0 !important;
	white-space:nowrap !important;
}
.mp-site-header .mp-header-tools .mp-header-search{
	margin:0 !important;
	align-self:center !important;
}
.mp-site-header .mp-header-tools .mp-header-search__toggle{
	width:28px !important;
	height:46px !important;
	color:#fff !important;
}
.mp-site-header .mp-header-tools .mp-language-selector{
	height:46px !important;
	align-items:center !important;
}
.mp-site-header .mp-header-tools .mp-language-selector__current{
	height:46px !important;
	min-height:46px !important;
	min-width:67px !important;
	padding:0 10px !important;
	border:2px solid #fff !important;
	border-radius:12px !important;
	color:#fff !important;
	background:transparent !important;
	font:500 22px/42px "KoHo",Arial,sans-serif !important;
}
.mp-site-header .mp-header-vacancy-button{
	display:flex !important;
	align-items:center !important;
	justify-content:center !important;
	min-width:161px !important;
	height:46px !important;
	padding:0 14px !important;
	background:#fff !important;
	color:#E4032E !important;
	border-radius:12px !important;
	text-decoration:none !important;
	font:700 22px/46px "KoHo",Arial,sans-serif !important;
}


/* ==========================================================================
   3.9.2 — Figma refinement pass
   Vacatures 300:1895 · Locaties 301:560 · Footer 300:2351
   ========================================================================== */

/* Remove historical hairline underneath the header. */
.mp-site-header{
	border-bottom:0 !important;
	outline:0 !important;
	box-shadow:none !important;
}
.wp-site-blocks > .wp-block-template-part:first-child{
	border-bottom:0 !important;
	box-shadow:none !important;
}

/* Figma 426:4885 puts the separate quick-menu frame at y=1182. */
.mp-home-quick{
	top:1182px !important;
}

/* VACANCIES
   Figma background card is 520x620, not 413px.
   The 393x393 photo floats 60px above it and is horizontally centered. */
.mp-home-vacancies .mp-vacancy-slider__viewport{
	padding-left:max(0px,calc((100vw - 2200px)/2 + 187px)) !important;
	padding-top:0 !important;
	overflow-y:visible !important;
}
.mp-home-vacancies .mp-vacancy-slider__track{
	gap:30px !important;
	align-items:flex-start !important;
}
.mp-home-vacancies .mp-figma-vacancy{
	position:relative !important;
	flex:0 0 520px !important;
	width:520px !important;
	height:620px !important;
	min-height:620px !important;
	margin:60px 0 0 !important;
	padding:0 !important;
	background:#F0F0F0 !important;
	border-radius:30px !important;
	overflow:visible !important;
	box-shadow:none !important;
}
.mp-home-vacancies .mp-figma-vacancy__media{
	position:static !important;
	width:auto !important;
	height:auto !important;
	margin:0 !important;
}
.mp-home-vacancies .mp-figma-vacancy__media .mp-figma-card-image{
	position:absolute !important;
	left:64px !important;
	top:-60px !important;
	width:393px !important;
	height:393px !important;
	margin:0 !important;
	overflow:hidden !important;
	box-shadow:0 13px 24px rgba(0,0,0,.13) !important;
}
.mp-home-vacancies .mp-figma-vacancy__media .mp-figma-card-image img{
	width:393px !important;
	height:393px !important;
	max-width:none !important;
	object-fit:cover !important;
}
.mp-home-vacancies .mp-figma-vacancy__status{
	position:absolute !important;
	left:68px !important;
	top:380px !important;
	margin:0 !important;
	min-height:40px !important;
	padding:7px 15px !important;
	border-radius:200px !important;
	background:#E4032E !important;
	color:#fff !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:68px !important;
	right:38px !important;
	top:414px !important;
	padding:0 !important;
	margin:0 !important;
}
.mp-home-vacancies .mp-figma-vacancy__body h3{
	margin:24px 0 0 !important;
	font:700 27px/33px "KoHo",Arial,sans-serif !important;
	color:#482974 !important;
}
.mp-home-vacancies .mp-figma-vacancy__meta{
	margin:0 !important;
	font:500 27px/33px "KoHo",Arial,sans-serif !important;
	color:#482974 !important;
}
.mp-home-vacancies .mp-figma-vacancy__excerpt{
	margin:17px 0 0 !important;
	font:400 16px/23px "KoHo",Arial,sans-serif !important;
	color:#000 !important;
}
.mp-home-vacancies .mp-figma-vacancy__body > a{
	display:inline !important;
	font:400 16px/23px "KoHo",Arial,sans-serif !important;
	color:#1488CA !important;
	text-decoration:none !important;
}
.mp-home-vacancies .mp-vacancy-slider__controls{
	margin-top:64px !important;
}

/* LOCATIONS
   The white details panel overlaps the lower 84px of the map in Figma.
   The yellow Locaties tab must therefore sit above Leaflet's panes. */
.mp-location-details-wrap{
	position:absolute !important;
	left:0 !important;
	top:848px !important;
	width:100% !important;
	height:612px !important;
	margin:0 !important;
	padding:0 !important;
	background:transparent !important;
	overflow:visible !important;
	z-index:700 !important;
}
.mp-location-details-wrap:before{
	content:"" !important;
	position:absolute !important;
	left:calc(50% - 740px) !important;
	top:0 !important;
	width:calc(50% + 740px) !important;
	height:612px !important;
	background:#fff !important;
	border-radius:72px 0 0 0 !important;
	z-index:0 !important;
}
.mp-location-details{
	position:absolute !important;
	left:calc(50% - 647px) !important;
	top:0 !important;
	width:1294px !important;
	height:612px !important;
	display:grid !important;
	grid-template-columns:275px 1fr !important;
	gap:100px !important;
	padding:143px 0 0 !important;
	margin:0 !important;
	background:transparent !important;
	z-index:2 !important;
}
.mp-location-details__title{
	position:absolute !important;
	left:0 !important;
	top:0 !important;
	width:438px !important;
	height:95px !important;
	padding:19px 50px !important;
	background:#F0AB21 !important;
	color:#fff !important;
	border-radius:38px 58px 8px 0 !important;
	transform:skewX(-7deg) !important;
	font:600 italic 60px/60px "KoHo",Arial,sans-serif !important;
	z-index:900 !important;
}
.mp-location-details__title span{
	display:block !important;
	transform:skewX(7deg) !important;
}
.mp-location-office{
	padding-top:0 !important;
}
.mp-location-office h3,
.mp-location-list h3{
	margin:0 0 19px !important;
	color:#482974 !important;
	font:700 27px/33px "KoHo",Arial,sans-serif !important;
}
.mp-location-office p,
.mp-location-list a{
	font:500 19px/26px "KoHo",Arial,sans-serif !important;
}
.mp-location-list{
	columns:2 !important;
	column-gap:70px !important;
}
.mp-location-list h3{
	column-span:all !important;
}
.mp-location-list a{
	display:block !important;
	break-inside:avoid !important;
	margin:0 0 19.6px !important;
	color:#000 !important;
	text-decoration:none !important;
}
.mp-location-list a strong{
	color:#1488CA !important;
	font-weight:700 !important;
}
.mp-location-list a span{
	color:#000 !important;
	font-weight:500 !important;
}

/* Leaflet must remain underneath the overlapping title/details panel. */
.mp-location-stage--real .leaflet-pane{z-index:200 !important}
.mp-location-stage--real .leaflet-top,
.mp-location-stage--real .leaflet-bottom{z-index:500 !important}

/* FOOTER — Figma node 300:2351 */
.mp-site-footer{
	position:relative !important;
	width:100% !important;
	height:599px !important;
	min-height:599px !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:0 !important;
	top:0 !important;
	width:100% !important;
	height:187px !important;
	background:linear-gradient(96deg,#E4032E 0%,#C50D54 43%,#482974 100%) !important;
	clip-path:polygon(0 0,100% 26%,100% 100%,0 70%) !important;
	z-index:1 !important;
}
.mp-site-footer:after{
	display:none !important;
}
.mp-site-footer .mp-footer-tab{
	position:absolute !important;
	right:0 !important;
	top:23px !important;
	width:307px !important;
	height:109px !important;
	padding:0 !important;
	background:#E4032E url("../images/mijnplein-wordmark.png") no-repeat center center / 165px auto !important;
	border-radius:40px 0 0 0 !important;
	clip-path:polygon(13% 0,100% 0,100% 100%,0 100%,0 31%,4% 12%) !important;
	z-index:3 !important;
	font-size:0 !important;
}
.mp-site-footer .mp-footer-columns{
	position:absolute !important;
	left:7.91% !important;
	top:184px !important;
	width:980px !important;
	max-width:none !important;
	margin:0 !important;
	padding:0 !important;
	display:grid !important;
	grid-template-columns:210px 212px 230px !important;
	column-gap:117px !important;
	align-items:start !important;
	z-index:2 !important;
}
.mp-site-footer .mp-footer-columns > div{
	width:auto !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-site-footer .mp-footer-columns h3{
	margin:0 0 10px !important;
	color:#fff !important;
	font:700 19px/26px "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 19px/26px "KoHo",Arial,sans-serif !important;
	text-decoration:none !important;
}
.mp-site-footer .mp-footer-navigation{
	margin: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:18px !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:26px !important;
}
.mp-site-footer .mp-footer-navigation .wp-block-navigation-item__content{
	padding:0 !important;
	font:500 19px/34px "KoHo",Arial,sans-serif !important;
	color:#fff !important;
}

.mp-site-footer .mp-footer-social{
	display:flex !important;
	gap:12px !important;
	margin-top:28px !important;
	margin-bottom:29px !important;
}
.mp-site-footer .mp-footer-social a{
	display:grid !important;
	place-items:center !important;
	width:38px !important;
	height:38px !important;
	border:2px solid #fff !important;
	border-radius:50% !important;
	font:700 16px/1 Arial,sans-serif !important;
}
.mp-site-footer .mp-footer-privacy{
	display:block !important;
	color:#fff !important;
	font:500 19px/26px "KoHo",Arial,sans-serif !important;
}
.mp-site-footer .mp-footer-privacy::first-letter{
	color:#F0AB21 !important;
}


/* ==========================================================================
   3.9.3 — authoritative vacancy layout from Figma node 300:1895
   This block deliberately uses higher specificity than all historical rules.
   ========================================================================== */
.mp-home-vacancies .mp-vacancy-slider .mp-vacancy-slider__viewport{
	width:100% !important;
	padding-top:0 !important;
	padding-bottom:0 !important;
	padding-left:max(0px,calc((100vw - 2200px)/2 + 187px)) !important;
	overflow-x:hidden !important;
	overflow-y:visible !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-vacancy-slider__track{
	display:flex !important;
	align-items:flex-start !important;
	gap:30px !important;
	transform:translate3d(0,0,0);
}
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy{
	position:relative !important;
	flex:0 0 520px !important;
	width:520px !important;
	max-width:520px !important;
	height:620px !important;
	min-height:620px !important;
	margin:60px 0 0 !important;
	padding:0 !important;
	background:#F0F0F0 !important;
	border:0 !important;
	border-radius:30px !important;
	overflow:visible !important;
	box-shadow:none !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy .mp-figma-vacancy__media{
	position:static !important;
	left:auto !important;
	top:auto !important;
	width:auto !important;
	height:auto !important;
	min-height:0 !important;
	margin:0 !important;
	padding:0 !important;
	background:transparent !important;
	box-shadow:none !important;
	overflow:visible !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy .mp-figma-card-image{
	position:absolute !important;
	left:64px !important;
	top:-60px !important;
	width:393px !important;
	height:393px !important;
	min-width:393px !important;
	min-height:393px !important;
	max-width:393px !important;
	max-height:393px !important;
	aspect-ratio:1 / 1 !important;
	margin:0 !important;
	padding:0 !important;
	overflow:hidden !important;
	border-radius:0 !important;
	box-shadow:0 13px 24px rgba(0,0,0,.13) !important;
	background:#ddd !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy .mp-figma-card-image img{
	display:block !important;
	position:static !important;
	width:393px !important;
	height:393px !important;
	min-width:393px !important;
	min-height:393px !important;
	max-width:393px !important;
	max-height:393px !important;
	object-fit:cover !important;
	object-position:center !important;
	margin:0 !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy .mp-figma-vacancy__status{
	position:absolute !important;
	left:68px !important;
	top:380px !important;
	right:auto !important;
	bottom:auto !important;
	z-index:4 !important;
	display:inline-flex !important;
	align-items:center !important;
	width:auto !important;
	height:40px !important;
	min-height:40px !important;
	margin:0 !important;
	padding:7px 15px !important;
	border-radius:200px !important;
	background:#E4032E !important;
	color:#fff !important;
	font:700 18px/26px "KoHo",Arial,sans-serif !important;
	white-space:nowrap !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy .mp-figma-vacancy__body{
	position:absolute !important;
	left:68px !important;
	top:442px !important;
	right:38px !important;
	bottom:auto !important;
	width:auto !important;
	height:auto !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy .mp-figma-vacancy__body h3{
	margin:0 !important;
	padding:0 !important;
	color:#482974 !important;
	font:700 27px/33px "KoHo",Arial,sans-serif !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy .mp-figma-vacancy__meta{
	margin:0 !important;
	padding:0 !important;
	color:#482974 !important;
	font:500 27px/33px "KoHo",Arial,sans-serif !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy .mp-figma-vacancy__excerpt{
	margin:17px 0 0 !important;
	padding:0 !important;
	color:#000 !important;
	font:400 16px/23px "KoHo",Arial,sans-serif !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-figma-vacancy .mp-figma-vacancy__body > a{
	display:inline !important;
	margin:0 !important;
	padding:0 !important;
	color:#1488CA !important;
	font:400 16px/23px "KoHo",Arial,sans-serif !important;
	text-decoration:none !important;
}
.mp-home-vacancies .mp-vacancy-slider .mp-vacancy-slider__controls{
	margin-top:64px !important;
}


/* 3.9.6 — locatierij bestuurt uitsluitend kaart/selectie; geen directe pagina-links */
.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;
	box-shadow:none !important;
	text-align:left !important;
	color:#000 !important;
	font:500 19px/26px "KoHo",Arial,sans-serif !important;
	cursor:pointer !important;
	break-inside:avoid !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:hover strong,
.mp-location-list .mp-location-list__item:focus-visible strong,
.mp-location-list .mp-location-list__item.is-active strong{
	color:#E4032E !important;
}
.mp-location-list .mp-location-list__item:focus-visible{
	outline:2px solid #1488CA !important;
	outline-offset:3px !important;
}


/* ==========================================================================
   3.9.7 — exact footer top artwork from Figma/PDF node 300:2351
   The red→purple diagonal strip AND red Mijnplein logo-tab are now one
   rasterized design asset taken directly from the supplied 2200px frame.
   ========================================================================== */
.mp-site-footer{
	position:relative !important;
	background:#482974 !important;
	overflow:hidden !important;
}
.mp-site-footer:before{
	content:"" !important;
	position:absolute !important;
	z-index:1 !important;
	left:50% !important;
	top:0 !important;
	width:2200px !important;
	height:187px !important;
	transform:translateX(-50%) !important;
	background-image:url("../images/footer-top-figma.png") !important;
	background-repeat:no-repeat !important;
	background-position:center top !important;
	background-size:2200px 187px !important;
	clip-path:none !important;
}
/* The exact logo is already part of footer-top-figma.png. */
.mp-site-footer .mp-footer-tab{
	display:none !important;
}
/* Keep all editable footer content above the purple body, below the artwork. */
.mp-site-footer .mp-footer-columns{
	z-index:2 !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.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.5 — footer-logo opnieuw opgebouwd uit Figma 300:2351
   Exacte Figma-afmetingen logo-tab: x≈1893, y=23, w=307, h=109
   binnen het 2200×599 widescreen footerframe.
   ========================================================================== */
.mp-site-footer::before{
	content:"" !important;
	display:block !important;
	position:absolute !important;
	left:0 !important;
	top:0 !important;
	width:100% !important;
	height:187px !important;
	z-index:1 !important;
	transform:none !important;
	background:linear-gradient(96deg,#E4032E 0%,#C20C56 43%,#482974 100%) !important;
	clip-path:polygon(0 0,100% 26%,100% 100%,0 70%) !important;
}

/* Stop using the raster footer-top image; render the logo tab as its own
   vector shape with the exact Mijnplein wordmark. */
.mp-site-footer .mp-footer-tab{
	display:block !important;
	position:absolute !important;
	right:0 !important;
	top:23px !important;
	width:307px !important;
	height:109px !important;
	margin:0 !important;
	padding:0 !important;
	z-index:4 !important;
	background:
		url("../images/mijnplein-wordmark.png") no-repeat 50% 37px / 148px auto,
		url("../images/footer-logo-shape-desktop.svg") no-repeat 0 0 / 307px 109px !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;
}
.mp-site-footer .mp-footer-tab::before,
.mp-site-footer .mp-footer-tab::after{
	content:none !important;
	display:none !important;
}


/* ==========================================================================
   3.11.7 — Werken bij: vacatureblok in normale documentflow
   Deze sectie deelt .mp-home-vacancies met de homepage, maar mag op de
   Werken bij-pagina NOOIT de absolute homepage-positionering erven.
   ========================================================================== */
.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:0 !important;
	margin:0 !important;
	padding:72px 0 84px !important;
	background:#fff !important;
	overflow:hidden !important;
	z-index:auto !important;
}

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

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

/* The slider itself participates in layout and reserves the card height. */
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider{
	position:relative !important;
	left:auto !important;
	top:auto !important;
	width:100% !important;
	height:auto !important;
	min-height:760px !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:620px !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:90px !important;
	width:max-content !important;
	height:620px !important;
	margin:0 !important;
	padding:0 !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy{
	position:relative !important;
	flex:0 0 413px !important;
	width:413px !important;
	height:620px !important;
	min-height:620px !important;
	margin:0 !important;
	padding:60px 0 0 !important;
	background:#F0F0F0 !important;
	border:0 !important;
	border-radius:30px !important;
	box-shadow:none !important;
	overflow:visible !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-card-image,
.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__media{
	width:393px !important;
	height:393px !important;
	margin:-60px auto 0 !important;
	overflow:hidden !important;
	border-radius:18px !important;
	box-shadow:0 13px 24px rgba(0,0,0,.13) !important;
}

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

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__body{
	position:static !important;
	margin:0 !important;
	padding:18px 28px 30px !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__status{
	position:static !important;
	display:inline-flex !important;
	min-height:40px !important;
	margin:0 !important;
	padding:7px 15px !important;
	border-radius:200px !important;
	background:#E4032E !important;
	color:#fff !important;
	font:700 18px/26px "KoHo",Arial,sans-serif !important;
}

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

.mp-pdf-jobs .mp-jobs-vacancies .mp-figma-vacancy__meta{
	margin:0 !important;
	color:#482974 !important;
	font:500 27px/33px "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/23px "KoHo",Arial,sans-serif !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls{
	position:relative !important;
	left:auto !important;
	top:auto !important;
	width:100% !important;
	display:flex !important;
	justify-content:center !important;
	gap:38px !important;
	margin:46px 0 0 !important;
	padding:0 !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button{
	display:grid !important;
	place-items:center !important;
	width:42px !important;
	height:42px !important;
	min-width:42px !important;
	min-height:42px !important;
	margin:0 !important;
	padding:0 !important;
	border:0 !important;
	border-radius:50% !important;
	background:#F0F0F0 !important;
	color:#1488CA !important;
	box-shadow:none !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 26px/1 Arial,sans-serif !important;
	transform:translateY(-1px) !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-home-center{
	position:relative !important;
	left:auto !important;
	top:auto !important;
	width:auto !important;
	margin:24px 0 0 !important;
	padding:0 !important;
	display:flex !important;
	justify-content:center !important;
}

.mp-pdf-jobs .mp-jobs-vacancies .mp-home-center .mp-figma-button{
	width:auto !important;
	min-width:220px !important;
}

/* CTA follows the vacancy block, footer follows CTA. */
.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:39px !important;
}

/* 3.11.8 — footerlogo iets terug omhoog voor betere Figma-overlap */
.mp-site-footer .mp-footer-tab{
	top:31px !important;
}

/* 3.11.9 — footerlogo tussenpositie */
.mp-site-footer .mp-footer-tab{
	top:35px !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 standard 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:20% !important;
	bottom:-30px !important;
	border-top-width:30px !important;
	border-right-width:30px !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.12.29 — CTA overgang: meer wit boven de foto; grijs loopt door tot footer. */
@media (min-width:900px) and (max-width:1599px){
  .mp-home-join{
    background:#fff !important;
  }
  .mp-home-join::before{
    top:96px !important;
    height:calc(100% - 96px) !important;
    background:var(--mp-light) !important;
    clip-path:polygon(0 0,100% 8%,100% 100%,0 100%) !important;
  }
}

/* 3.12.31 — geselecteerde locatiekaart opnieuw opgebouwd naar Figma. */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-stage--real .mp-location-feature{display:block !important;width:268px !important;height:auto !important;min-height:0 !important;padding:0 !important;background:transparent !important;border:0 !important;border-radius:18px 18px 0 0 !important;overflow:visible !important;box-shadow:0 12px 28px rgba(0,0,0,.16) !important;}
  .mp-location-stage--real .mp-location-feature__image{display:block !important;width:268px !important;height:185px !important;margin:0 !important;border-radius:18px 18px 0 0 !important;overflow:hidden !important;}
  .mp-location-stage--real .mp-location-feature__image img{display:block !important;width:100% !important;height:100% !important;border-radius:0 !important;object-fit:cover !important;}
  .mp-location-stage--real .mp-location-feature__body{display:block !important;width:100% !important;min-height:115px !important;box-sizing:border-box !important;margin:0 !important;padding:13px 64px 14px 15px !important;background:#E4032E !important;border-radius:0 !important;color:#fff !important;}
  .mp-location-stage--real .mp-location-feature .mp-figma-kicker{display:block !important;margin:0 0 2px !important;font:700 12px/16px "KoHo",Arial,sans-serif !important;color:#fff !important;}
  .mp-location-stage--real .mp-location-feature h3{margin:0 0 1px !important;font:700 19px/24px "KoHo",Arial,sans-serif !important;color:#fff !important;}
  .mp-location-stage--real .mp-location-feature p{margin:0 !important;font:500 12px/16px "KoHo",Arial,sans-serif !important;color:#fff !important;}
  .mp-location-stage--real .mp-location-feature [data-location-address],.mp-location-stage--real .mp-location-feature__address{display:none !important;}
  .mp-location-stage--real .mp-location-feature a{position:absolute !important;right:14px !important;bottom:18px !important;width:42px !important;height:42px !important;padding:0 !important;margin:0 !important;border:0 !important;border-radius:50% !important;background:#fff !important;color:#1488CA !important;display:grid !important;place-items:center !important;font-size:20px !important;line-height:1 !important;}
  .mp-location-stage--real .mp-location-feature::after{content:"" !important;display:block !important;position:absolute !important;left:0 !important;bottom:-32px !important;width:0 !important;height:0 !important;border-top:32px solid #E4032E !important;border-right:32px solid transparent !important;border-left:0 !important;}
}


/* 3.12.31 — locaties standaard opnieuw als één Figma-geometrie opgebouwd. */
@media (min-width:900px) and (max-width:1599px){
  .mp-home-locations{position:relative !important;}
  .mp-location-stage--real{position:relative !important;height:590px !important;overflow:hidden !important;background:#e7e7e7 !important;}
  .mp-location-stage--real .mp-real-map{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;}
  .mp-location-stage--real .mp-location-feature{width:218px !important;border-radius:15px 15px 0 0 !important;z-index:520 !important;}
  .mp-location-stage--real .mp-location-feature__image{width:218px !important;height:145px !important;}
  .mp-location-stage--real .mp-location-feature__body{min-height:88px !important;padding:10px 54px 10px 12px !important;}
  .mp-location-stage--real .mp-location-feature h3{font-size:16px !important;line-height:19px !important;}
  .mp-location-stage--real .mp-location-feature a{width:36px !important;height:36px !important;right:11px !important;bottom:14px !important;}
  .mp-location-stage--real .mp-location-feature::after{bottom:-26px !important;border-top-width:26px !important;border-right-width:26px !important;}
  .mp-location-stage--real .mp-location-legend{position:absolute !important;left:57% !important;right:auto !important;top:auto !important;bottom:68px !important;transform:none !important;z-index:530 !important;margin:0 !important;white-space:nowrap !important;}

  .mp-location-details-wrap{
    position:relative !important;z-index:500 !important;
    width:min(1120px,calc(100% - 140px)) !important;max-width:none !important;
    min-height:350px !important;margin:-78px auto 0 !important;padding:0 !important;
    background:#fff !important;clip-path:polygon(0 30px,100% 0,100% 100%,0 100%) !important;overflow:visible !important;
  }
  .mp-location-details{
    position:relative !important;width:100% !important;max-width:none !important;min-height:350px !important;
    box-sizing:border-box !important;margin:0 !important;padding:88px 70px 42px !important;
    display:grid !important;grid-template-columns:230px 1fr !important;column-gap:72px !important;align-items:start !important;
  }
  .mp-location-details__title{
    position:absolute !important;left:-72px !important;top:0 !important;width:300px !important;height:76px !important;
    margin:0 !important;padding:0 0 0 56px !important;box-sizing:border-box !important;display:flex !important;align-items:center !important;
    background:#F0AB21 !important;border-radius:38px 38px 0 0 !important;
    transform:rotate(2.4deg) !important;transform-origin:left bottom !important;z-index:4 !important;
  }
  .mp-location-details__title span{display:block !important;transform:rotate(-2.4deg) !important;font-size:34px !important;line-height:1 !important;color:#fff !important;}
  .mp-location-office{grid-column:1 !important;margin:0 !important;padding:0 !important;}
  .mp-location-list{grid-column:2 !important;margin:0 !important;padding:0 !important;display:grid !important;grid-template-columns:1fr 1fr !important;column-gap:54px !important;align-content:start !important;}
  .mp-location-list h3{grid-column:1/-1 !important;margin:0 0 16px !important;}
  .mp-location-list__item{margin:0 0 11px !important;}
}


/* 3.12.32 — locaties: verticale Figma-geometrie gecorrigeerd. */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-stage--real{top:138px !important;height:620px !important;}
  .mp-location-stage--real .mp-real-map{height:100% !important;}
  .mp-location-details-wrap{
    position:absolute !important;left:0 !important;top:63% !important;width:100% !important;height:37% !important;
    min-height:0 !important;margin:0 !important;background:transparent !important;clip-path:none !important;overflow:visible !important;
  }
  .mp-location-details-wrap::before{
    content:"" !important;position:absolute !important;inset:0 !important;background:#fff !important;
    clip-path:polygon(0 0,100% 10%,100% 100%,0 100%) !important;z-index:0 !important;
  }
  .mp-location-details{
    position:relative !important;width:min(960px,calc(100% - 100px)) !important;min-height:0 !important;margin:0 auto !important;
    padding:58px 50px 30px !important;grid-template-columns:205px 1fr !important;column-gap:52px !important;z-index:2 !important;
  }
  .mp-location-details__title{left:0 !important;top:-42px !important;width:292px !important;height:72px !important;padding-left:52px !important;transform:rotate(2.4deg) !important;}
  .mp-location-details__title span{font-size:33px !important;}
  .mp-location-stage--real .mp-location-legend{left:62% !important;top:56% !important;bottom:auto !important;transform:translateX(-50%) !important;}
}

/* 3.12.33 — locaties: kaart/witte overgang exact volgens Figma-verhouding. */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-stage--real{
    top:66px !important;
    height:700px !important;
    overflow:visible !important;
    background:#fff !important;
  }
  .mp-location-stage--real .mp-real-map{
    top:0 !important;
    bottom:auto !important;
    height:430px !important;
  }
  .mp-location-details-wrap{top:352px !important;height:348px !important;}
  .mp-location-details-wrap::before{clip-path:polygon(0 0,100% 11%,100% 100%,0 100%) !important;}
  .mp-location-details{
    width:min(960px,calc(100% - 100px)) !important;
    padding:80px 50px 34px !important;
    grid-template-columns:205px 1fr !important;
    column-gap:64px !important;
  }
  .mp-location-details__title{
    left:-58px !important;
    top:-30px !important;
    width:300px !important;
    height:72px !important;
    padding-left:58px !important;
  }
  .mp-location-stage--real .mp-location-legend{
    left:64% !important;
    top:312px !important;
    bottom:auto !important;
    transform:translateX(-50%) !important;
  }
  .mp-location-list{column-gap:48px !important;}
}

/* 3.12.34 — locaties: stage-offset ook meenemen in witte Figma-plaat. */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-stage--real{top:66px !important;height:700px !important;overflow:visible !important;}
  .mp-location-stage--real .mp-real-map{height:430px !important;}
  /* details-wrap is sibling van de kaartstage en dus t.o.v. de sectie gepositioneerd. */
  .mp-location-details-wrap{top:418px !important;height:348px !important;}
  .mp-location-details-wrap::before{clip-path:polygon(0 0,100% 11%,100% 100%,0 100%) !important;}
  .mp-location-details{width:min(960px,calc(100% - 100px)) !important;padding:80px 50px 34px !important;grid-template-columns:205px 1fr !important;column-gap:64px !important;}
  .mp-location-details__title{left:-58px !important;top:-30px !important;width:300px !important;height:72px !important;padding-left:58px !important;}
  .mp-location-stage--real .mp-location-legend{left:64% !important;top:312px !important;bottom:auto !important;transform:translateX(-50%) !important;}
}

/* 3.12.35 — locaties standaard: dezelfde Figma-flow als widescreen. */
@media (min-width:900px) and (max-width:1599px){
  .mp-home-locations{overflow:visible !important;}
  .mp-location-stage--real{
    position:relative !important;
    top:auto !important;
    height:500px !important;
    margin-top:46px !important;
    overflow:visible !important;
    background:#e7e7e7 !important;
  }
  .mp-location-stage--real .mp-real-map{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:500px !important;
  }
  .mp-location-details-wrap{
    position:relative !important;
    left:auto !important;
    top:auto !important;
    width:100% !important;
    height:auto !important;
    min-height:350px !important;
    margin:-36px 0 0 !important;
    background:#fff !important;
    clip-path:polygon(0 0,100% 9%,100% 100%,0 100%) !important;
    overflow:visible !important;
    z-index:500 !important;
  }
  .mp-location-details-wrap::before{display:none !important;content:none !important;}
  .mp-location-details{
    width:min(960px,calc(100% - 100px)) !important;
    min-height:350px !important;
    margin:0 auto !important;
    padding:80px 50px 34px !important;
    grid-template-columns:205px 1fr !important;
    column-gap:64px !important;
  }
  .mp-location-details__title{
    left:-58px !important;
    top:-55px !important;
    width:300px !important;
    height:72px !important;
    padding-left:58px !important;
    z-index:4 !important;
  }
  .mp-location-stage--real .mp-location-legend{
    left:64% !important;
    top:auto !important;
    bottom:50px !important;
    transform:translateX(-50%) !important;
  }
}

/* 3.12.36 — Figma overgang kaart -> locatiegegevens; tab buiten de schuine witte laag. */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-details-wrap{
    margin:-50px 0 0 !important;
    background:transparent !important;
    clip-path:none !important;
    isolation:isolate !important;
  }
  .mp-location-details-wrap::before{
    display:block !important;
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    background:#fff !important;
    clip-path:polygon(0 0,100% 10%,100% 100%,0 100%) !important;
    z-index:-1 !important;
    pointer-events:none !important;
  }
  .mp-location-details{position:relative !important;z-index:2 !important;padding-top:88px !important;}
  .mp-location-details__title{
    display:flex !important;
    align-items:center !important;
    left:-58px !important;
    top:-34px !important;
    width:300px !important;
    height:72px !important;
    padding-left:58px !important;
    overflow:visible !important;
    z-index:10 !important;
  }
  .mp-location-stage--real .mp-location-legend{bottom:62px !important;z-index:540 !important;}
}

/* 3.12.37 — zichtbare Figma-overlap: witte schuine balk ligt vóór de kaart. */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-details-wrap{margin:-72px 0 0 !important;min-height:370px !important;z-index:600 !important;}
  .mp-location-details-wrap::before{
    z-index:0 !important;
    top:0 !important;right:0 !important;bottom:0 !important;left:0 !important;
    clip-path:polygon(0 0,100% 13%,100% 100%,0 100%) !important;
  }
  .mp-location-details{z-index:2 !important;padding-top:104px !important;}
  .mp-location-details__title{top:-42px !important;z-index:4 !important;}
}

/* 3.12.38 — Figma locatie-overgang: de clipping is de enige witte achtergrondlaag.
   Belangrijk: .mp-location-details zelf mag niet wit zijn, anders bedekt die de schuine clip. */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-details-wrap{background:transparent !important;clip-path:none !important;overflow:visible !important;}
  .mp-location-details-wrap::before{
    display:block !important;content:"" !important;position:absolute !important;inset:0 !important;
    background:#fff !important;clip-path:polygon(0 0,100% 13%,100% 100%,0 100%) !important;
    z-index:0 !important;pointer-events:none !important;
  }
  .mp-location-details{background:transparent !important;box-shadow:none !important;position:relative !important;z-index:2 !important;}
  .mp-location-details__title{z-index:4 !important;}
}

/* 3.12.39 — Figma locatieplaat: de schuine witte plaat begint al IN de kaart.
   De achtergrondlaag steekt boven de content-wrapper uit; de gele tab ligt op de onderrand van de kaart. */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-details-wrap{margin:-18px 0 0 !important;position:relative !important;overflow:visible !important;}
  .mp-location-details-wrap::before{
    top:-72px !important;right:0 !important;bottom:0 !important;left:0 !important;
    clip-path:polygon(0 0,100% 18%,100% 100%,0 100%) !important;
  }
  .mp-location-details{padding-top:78px !important;}
  .mp-location-details__title{
    top:-60px !important;left:-58px !important;z-index:8 !important;
  }
}

/* ========================================================================== 
   3.13.0 — FIGMA VECTOR SHAPES (STANDARD)
   Exacte vectorvormen; geen CSS-benadering met skew/clip-path/rondingen.
   ========================================================================== */
.mp-home-hero__copy:before{border-radius:0!important;transform:none!important;-webkit-mask:url('../images/shapes/figma-shape-hero-white.svg') center/100% 100% no-repeat!important;mask:url('../images/shapes/figma-shape-hero-white.svg') center/100% 100% no-repeat!important}
.mp-home-work__yellow{border-radius:0!important;transform:none!important;-webkit-mask:url('../images/shapes/figma-shape-work-yellow.svg') center/100% 100% no-repeat!important;mask:url('../images/shapes/figma-shape-work-yellow.svg') center/100% 100% no-repeat!important}
.mp-home-work__shape:before{border-radius:0!important;-webkit-mask:url('../images/shapes/figma-shape-work-white.svg') center/100% 100% no-repeat!important;mask:url('../images/shapes/figma-shape-work-white.svg') center/100% 100% no-repeat!important}
.mp-home-join::before{clip-path:none!important;transform:none!important;-webkit-mask:url('../images/shapes/figma-shape-join-grey.svg') center/100% 100% no-repeat!important;mask:url('../images/shapes/figma-shape-join-grey.svg') center/100% 100% no-repeat!important}
.mp-site-footer .mp-footer-tab{border-radius:0!important;clip-path:none!important;transform:none!important;-webkit-mask:url('../images/shapes/figma-shape-footer-tab.svg') center/100% 100% no-repeat!important;mask:url('../images/shapes/figma-shape-footer-tab.svg') center/100% 100% no-repeat!important}
.mp-location-details-wrap{margin:-85px 0 0!important;background:transparent!important;clip-path:none!important}
.mp-location-details-wrap::before{content:""!important;position:absolute!important;left:0!important;right:0!important;top:0!important;height:85px!important;inset:auto 0 auto 0!important;background:transparent!important;clip-path:none!important;border-radius:0!important;transform:none!important;z-index:1!important;pointer-events:none!important}
.mp-location-details-wrap::after{content:""!important;position:absolute!important;left:0!important;right:0!important;top:77px!important;bottom:0!important;width:auto!important;height:auto!important;background:#fff!important;border-radius:0!important;transform:none!important;clip-path:none!important;z-index:0!important;pointer-events:none!important}
.mp-location-details__title{top:0!important;background:var(--mp-yellow)!important;border-radius:0!important;clip-path:none!important;transform:none!important;-webkit-mask:url('../images/shapes/figma-shape-locations-yellow.svg') center/100% 100% no-repeat!important;mask:url('../images/shapes/figma-shape-locations-yellow.svg') center/100% 100% no-repeat!important;z-index:9!important}
.mp-location-details__title span{transform:none!important}

/* ==========================================================================
   3.13.4 — VISIEBLOK / OVERGANG
   Het losse .mp-home-vision__grey element is uit de markup verwijderd.
   Het grijze vlak van de hero loopt 60px verder door zodat het iets verder
   achter de bovenkant van de visiefoto valt; de rest van het visieblok is wit.
   ========================================================================== */
.mp-figma-home .mp-home-hero{
	height:1445px !important;
}
.mp-figma-home .mp-home-hero:after{
	height:777px !important;
}

/* ========================================================================== 
   3.13.9 — LOCATIES: tabs horen bij de kaart, niet bij de contentplaat
   Hierdoor kan de gele Locaties-tab onafhankelijk verder naar links staan.
   Naast de gele tab staat dezelfde Figma-vorm in wit voor Onderwijs & opvang.
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-stage--real{overflow:visible!important;}
  .mp-location-map-tabs{
    display:block!important;
    position:absolute!important;
    left:0!important;right:0!important;bottom:0!important;
    height:clamp(72px,5.70vw,91px)!important;
    z-index:700!important;
    pointer-events:none!important;
  }
  .mp-location-map-tabs .mp-location-details__title{
    display:flex!important;
    position:absolute!important;
    left:clamp(115px,12.81vw,205px)!important;
    right:auto!important;top:auto!important;bottom:0!important;
    width:clamp(300px,28.63vw,458px)!important;height:clamp(72px,5.70vw,91px)!important;
    margin:0!important;padding:0 0 0 clamp(76px,7.54vw,120px)!important;
    align-items:center!important;
    background:var(--mp-yellow)!important;
    color:#fff!important;
    border-radius:0!important;clip-path:none!important;transform:none!important;
    -webkit-mask:url('../images/shapes/figma-shape-locations-yellow.svg') center/100% 100% no-repeat!important;
    mask:url('../images/shapes/figma-shape-locations-yellow.svg') center/100% 100% no-repeat!important;
    z-index:3!important;
  }
  .mp-location-map-tabs .mp-location-details__title span{
    display:block!important;transform:none!important;
    color:#fff!important;font:600 italic clamp(30px,2.35vw,38px)/1 "KoHo",Arial,sans-serif!important;
  }
  .mp-location-details__group-title{
    display:flex!important;
    position:absolute!important;
    left:clamp(305px,33.83vw,541px)!important;
    right:auto!important;top:auto!important;bottom:-1px!important;
    width:clamp(500px,55.94vw,895px)!important;height:clamp(44px,3.32vw,53px)!important;
    margin:0!important;padding:0 clamp(36px,3vw,54px) 0 clamp(96px,10.31vw,165px)!important;
    box-sizing:border-box!important;align-items:center!important;
    background:#fff!important;color:var(--mp-purple)!important;
    border-radius:0!important;clip-path:none!important;transform:none!important;
    -webkit-mask:url('../images/shapes/figma-shape-locations-white.svg') center/100% 100% no-repeat!important;
    mask:url('../images/shapes/figma-shape-locations-white.svg') center/100% 100% no-repeat!important;
    z-index:4!important;
  }
  .mp-location-details__group-title span{
    display:block!important;color:var(--mp-purple)!important;
    font:700 clamp(22px,1.48vw,24px)/1.15 "KoHo",Arial,sans-serif!important;white-space:nowrap!important;
  }
  .mp-location-details-wrap .mp-location-details__title{display:none!important;}
  .mp-location-list h3{display:none!important;}
}

/* ========================================================================== 
   3.13.15 — SLUIT JE AAN: grijze Figma-vorm full-bleed op standaard desktop
   Het grijze vlak loopt nu ook tussen 900 en 1599px over de volle viewport.
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .mp-figma-home > .mp-home-join{
    overflow:visible!important;
  }
  .mp-figma-home > .mp-home-join::before{
    left:50%!important;
    right:auto!important;
    width:100vw!important;
    max-width:none!important;
    margin-left:-50vw!important;
  }
}


/* ==========================================================================
   3.13.16 — SLUIT JE AAN: grijs werkelijk viewport-breed
   De sectie zelf draagt nu de grijze achtergrond. Een witte schuine laag
   maakt de Figma-overgang bovenaan, onafhankelijk van de contentbreedte.
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .mp-figma-home > .mp-home-join{
    background:var(--mp-light)!important;
    overflow:hidden!important;
  }
  .mp-figma-home > .mp-home-join::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    top:0!important;
    width:100%!important;
    height:clamp(150px,12vw,210px)!important;
    background:#fff!important;
    clip-path:polygon(0 0,100% 0,100% 100%,0 62%)!important;
    transform:none!important;
    z-index:0!important;
    pointer-events:none!important;
  }
  .mp-figma-home > .mp-home-join > .mp-figma-inner{
    z-index:1!important;
  }
}

/* ========================================================================== 
   3.13.17 — LOCATIEKAARTJE + FILTERVINKJES volgens Figma
   Foto boven, compacte rode infobalk onder; geen type-label in het kaartje.
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .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:74px!important;
    height:74px!important;
    box-sizing:border-box!important;
    padding:10px 58px 9px 14px!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 17px/20px "KoHo",Arial,sans-serif!important;
    color:#fff!important;
  }
  .mp-location-stage--real .mp-location-feature p{
    margin:0!important;
    font:500 12px/16px "KoHo",Arial,sans-serif!important;
    color:#fff!important;
  }
  .mp-location-stage--real .mp-location-feature a{
    position:absolute!important;
    right:12px!important;
    top:50%!important;
    bottom:auto!important;
    width:38px!important;
    height:38px!important;
    transform:translateY(-50%)!important;
  }
  .mp-location-stage--real .mp-location-feature::after{
    left:0!important;
    bottom:-30px!important;
    border-top:30px solid #E4032E!important;
    border-right:30px 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 18px/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;
  }
}

@media (min-width:900px) and (max-width:1199px){
  .mp-location-stage--real .mp-location-feature__body{
    min-height:66px!important;
    height:66px!important;
    padding:9px 50px 8px 12px!important;
  }
  .mp-location-stage--real .mp-location-feature h3{
    font-size:15px!important;
    line-height:18px!important;
  }
  .mp-location-stage--real .mp-location-feature p{
    font-size:11px!important;
    line-height:14px!important;
  }
  .mp-location-stage--real .mp-location-feature a{
    width:34px!important;
    height:34px!important;
    right:10px!important;
  }
  .mp-location-stage--real .mp-location-feature::after{
    bottom:-26px!important;
    border-top-width:26px!important;
    border-right-width:26px!important;
  }
}


/* ========================================================================== 
   3.13.18 — LOCATIEKAARTJE: afbeelding draagt de vorm, geen rode fotorrand
   De kaartcontainer is transparant; alleen de afbeelding wordt aan de
   bovenkant afgerond/geclipt. De rode infobalk sluit direct onder de foto aan.
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .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 (min-width:900px) and (max-width:1599px){
  .mp-location-stage--real .mp-location-feature::after{
    bottom:-34px!important;
    border-top-width:36px!important;
    border-right-width:36px!important;
  }
}

/* ========================================================================== 
   3.13.20 — LOCATIEKAARTJE: pointer gebruikt exacte Figma-pinvector
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-stage--real .mp-location-feature::after{
    content:""!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    bottom:-38px!important;
    width:36px!important;
    height:40px!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;
  }
}
@media (min-width:900px) and (max-width:1199px){
  .mp-location-stage--real .mp-location-feature::after{
    bottom:-31px!important;
    width:28px!important;
    height:33px!important;
  }
}

/* ========================================================================== 
   3.13.21 — LOCATIEKAARTJE: pointerverhouding exact volgens ontwerp
   Breder en minder steil; 2px overlap voorkomt een haarlijn bij de rode balk.
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-stage--real .mp-location-feature::after{
    left:0!important;
    bottom:-46px!important;
    width:52px!important;
    height:48px!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;
  }
}
@media (min-width:900px) and (max-width:1199px){
  .mp-location-stage--real .mp-location-feature::after{
    bottom:-40px!important;
    width:45px!important;
    height:42px!important;
  }
}

/* ========================================================================== 
   3.13.22 — LOCATIEKAARTJE: één masker voor complete Figma-vorm
   De kaartcontainer draagt nu de afgeronde bovenhoeken én de vlagpunt.
   Het losse pointer-pseudo-element vervalt; de foto loopt randloos tot aan
   het masker en de rode achtergrond vult alleen de gemaskeerde ondervorm.
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .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
   De article-container is weer ongemaskeerd. Alleen de foto gebruikt de vorm
   van het groene Figma-afbeeldingsvlak. Rode body en pointer blijven apart.
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .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:-46px!important;
    width:52px!important;
    height:48px!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;
  }
}
@media (min-width:900px) and (max-width:1199px){
  .mp-location-stage--real .mp-location-feature::after{
    bottom:-40px!important;
    width:45px!important;
    height:42px!important;
  }
}


/* ========================================================================== 
   3.13.24 — LOCATIES: witte tab exact boven de locatielijst
   De echte positie van .mp-location-list wordt door theme.js als custom
   property op de kaart gezet. Daardoor blijft de titel ook bij andere
   desktopresoluties exact met de lijst uitgelijnd.
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .mp-location-stage--real{
    --mp-location-group-title-pad:clamp(96px,10.31vw,165px);
  }
  .mp-location-details__group-title{
    left:calc(var(--mp-location-list-left, 50%) - var(--mp-location-group-title-pad))!important;
    padding-left:var(--mp-location-group-title-pad)!important;
  }
}


/* ==========================================================================
   3.13.25 — NAVIGATIE: paarse submenu's (standaard desktop)
   ========================================================================== */
@media (min-width:900px) and (max-width:1599px){
  .mp-site-header .mp-primary-navigation .wp-block-navigation__submenu-container{
    background:var(--mp-purple)!important;
  }
  .mp-site-header .mp-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
    color:#fff!important;
  }
  .mp-site-header .mp-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover{
    color:#fff!important;
    background:rgba(255,255,255,.10)!important;
  }
}

/* ========================================================================
   3.13.26 — CONTENT PAGE HEADER according to Figma
   Standard desktop is a centered crop of the same 2200px master.
   ======================================================================== */
.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:525px!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;
  left:calc(50% - 1100px)!important;
  top:0!important;
  width:2200px!important;
  height:525px!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.svg') center/100% 100% no-repeat!important;
  mask:url('../images/shapes/figma-shape-content-band.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.svg') center/100% 100% no-repeat!important;
  mask:url('../images/shapes/figma-shape-content-photo.svg') center/100% 100% no-repeat!important;
}
.mp-figma-content-page--strict .mp-figma-content-body{
  margin:0!important;
  padding:0 0 105px!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 — CONTENT HEADER: Figma band sits IN FRONT of the photo.
   Use a self-coloured SVG so the shape cannot bleed below the photo mask.
   ======================================================================== */
.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-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.30 — CONTENT HEADER STANDARD: dedicated 1440px Figma geometry.
   Standard does not use the widescreen left cut-out; the photo spans the
   complete header and the red/purple band starts halfway across the frame.
   ======================================================================== */
.mp-figma-content-page--strict .mp-content-masthead{
  height:500px!important;
}
.mp-figma-content-page--strict .mp-content-photo,
.mp-figma-content-page--strict .mp-content-swoop{
  left:0!important;
  right:auto!important;
  top:0!important;
  width:100%!important;
  height:500px!important;
}
.mp-figma-content-page--strict .mp-content-photo{
  -webkit-mask:url('../images/shapes/figma-shape-content-photo-standard.svg') center/100% 100% no-repeat!important;
  mask:url('../images/shapes/figma-shape-content-photo-standard.svg') center/100% 100% no-repeat!important;
}
.mp-figma-content-page--strict .mp-content-swoop{
  background:transparent url('../images/shapes/figma-shape-content-band-standard-gradient.svg') center/100% 100% no-repeat!important;
}

/* ========================================================================
   3.13.33 — CONTENT HEADER: lift the red→purple Figma band slightly so it
   overlaps the photo edge at the same height as the standard design.
   ======================================================================== */
.mp-figma-content-page--strict .mp-content-swoop{
  top:-16px!important;
}


/* ========================================================================
   3.13.34 — CONTENT HEADER: position the red→purple swoop to match Figma.
   ======================================================================== */
.mp-figma-content-page--strict .mp-content-swoop{
  top:-32px!important;
  transform:rotate(-2.0deg);
}


/* ========================================================================
   3.13.35 — CONTENT HEADER STANDARD: lift swoop further to match Figma.
   ======================================================================== */
.mp-figma-content-page--strict .mp-content-swoop{
  top:-51px!important;
}

/* 3.13.39 — Werken-bij hero volgens Figma: foto boven, grijs vlak eronder, kaart op de overgang */
.mp-pdf-jobs .mp-jobs-photo{
	position:relative!important;
	min-height:560px!important;
	padding:0!important;
	background:#f0f0f0!important;
	background-image:none!important;
	overflow:hidden!important;
}
.mp-pdf-jobs .mp-jobs-photo::before{
	content:""!important;
	position:absolute!important;
	inset:0 0 auto 0!important;
	height:244px!important;
	background-image:var(--mp-jobs-image)!important;
	background-size:cover!important;
	background-position:center!important;
	z-index:0!important;
}
.mp-pdf-jobs .mp-jobs-photo::after{
	content:""!important;
	position:absolute!important;
	left:0!important;
	right:0!important;
	bottom:0!important;
	height:105px!important;
	background:#fff!important;
	clip-path:polygon(0 52%,100% 0,100% 100%,0 100%)!important;
	z-index:1!important;
	pointer-events:none!important;
}
.mp-pdf-jobs .mp-jobs-card{
	position:absolute!important;
	left:50%!important;
	top:106px!important;
	transform:translateX(-50%)!important;
	z-index:2!important;
	width:min(740px,56vw)!important;
	margin:0!important;
	padding:42px 48px 44px!important;
	background:#fff!important;
	border-radius:0!important;
	clip-path:none!important;
	-webkit-mask:url('../images/shapes/figma-shape-jobs-card.svg') center / 100% 100% no-repeat!important;
	mask:url('../images/shapes/figma-shape-jobs-card.svg') center / 100% 100% no-repeat!important;
	box-shadow:none!important;
}
.mp-pdf-jobs .mp-jobs-card>div{max-width:610px!important}
.mp-pdf-jobs .mp-jobs-card h1{
	font-size:clamp(36px,3.1vw,46px)!important;
	line-height:1.04!important;
	margin:0 0 14px!important;
}
.mp-pdf-jobs .mp-jobs-card p{
	font-size:15px!important;
	line-height:1.45!important;
	margin-bottom:22px!important;
}

/* ========================================================================== 
   3.13.40 — Werken bij / Uitgelichte onderwerpen volgens Figma (STANDARD)
   Zelfde masterverhoudingen als widescreen; de complete compositie schaalt
   mee met de standaard viewport in plaats van losse achtergrondvlakken.
   ========================================================================== */
.mp-pdf-jobs .mp-jobs-featured{
  position:relative!important;
  padding:0!important;
  min-height:0!important;
  background:#fff!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
.mp-pdf-jobs .mp-jobs-featured::before,
.mp-pdf-jobs .mp-jobs-featured::after{
  display:none!important;
}
.mp-pdf-jobs .mp-jobs-featured__stage{
  position:relative!important;
  width:100%!important;
  max-width:1440px!important;
  height:78.28vw!important;
  max-height:1127px!important;
  min-height:700px!important;
  margin:0 auto!important;
}
.mp-pdf-jobs .mp-jobs-featured__red,
.mp-pdf-jobs .mp-jobs-featured__yellow{
  position:absolute!important;
  display:block!important;
  pointer-events:none!important;
  z-index:0!important;
}
.mp-pdf-jobs .mp-jobs-featured__red{
  left:13.54%!important;
  top:4.14%!important;
  width:39.63%!important;
  height:29.01%!important;
  background:linear-gradient(96deg,var(--mp-purple) 0%,#8b155e 48%,var(--mp-red) 100%)!important;
  -webkit-mask:url('../images/shapes/figma-shape-jobs-featured-red.svg') center/100% 100% no-repeat!important;
  mask:url('../images/shapes/figma-shape-jobs-featured-red.svg') center/100% 100% no-repeat!important;
}
.mp-pdf-jobs .mp-jobs-featured__yellow{
  left:37.80%!important;
  top:60.36%!important;
  width:58.11%!important;
  height:33.87%!important;
  background:var(--mp-yellow)!important;
  -webkit-mask:url('../images/shapes/figma-shape-work-yellow.svg') center/100% 100% no-repeat!important;
  mask:url('../images/shapes/figma-shape-work-yellow.svg') center/100% 100% no-repeat!important;
}
.mp-pdf-jobs .mp-jobs-featured__shape{
  position:absolute!important;
  left:20.59%!important;
  top:11.53%!important;
  width:58.67%!important;
  min-height:76.22%!important;
  box-sizing:border-box!important;
  padding:42px 40px 40px!important;
  margin:0!important;
  background:#fff!important;
  border-radius:14px!important;
  box-shadow:none!important;
  z-index:2!important;
}
.mp-pdf-jobs .mp-jobs-featured__shape>h2{
  margin:0 0 24px!important;
  text-align:center!important;
  font-size:clamp(30px,2.7vw,38px)!important;
  line-height:1.05!important;
}
.mp-pdf-jobs .mp-jobs-featured .mp-figma-featured-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  column-gap:clamp(22px,3vw,42px)!important;
  row-gap:clamp(24px,3vw,42px)!important;
}
.mp-pdf-jobs .mp-jobs-featured .mp-figma-featured-card{
  min-width:0!important;
  padding:0!important;
}
.mp-pdf-jobs .mp-jobs-featured .mp-figma-featured-card .mp-figma-card-image,
.mp-pdf-jobs .mp-jobs-featured .mp-figma-featured-card .wp-block-image{
  margin:0 0 12px!important;
}
.mp-pdf-jobs .mp-jobs-featured .mp-figma-featured-card .mp-figma-card-image img,
.mp-pdf-jobs .mp-jobs-featured .mp-figma-featured-card .wp-block-image img{
  width:100%!important;
  height:clamp(105px,10.5vw,150px)!important;
  object-fit:cover!important;
}
.mp-pdf-jobs .mp-jobs-featured .mp-figma-featured-card h3{
  margin:0 0 8px!important;
  font-size:clamp(15px,1.25vw,18px)!important;
  line-height:1.15!important;
}
.mp-pdf-jobs .mp-jobs-featured .mp-figma-featured-card p{
  margin:0 0 8px!important;
  font-size:clamp(11px,.9vw,13px)!important;
  line-height:1.4!important;
}

/* ========================================================================== 
   3.13.42 — Werken bij: Recente vacatures exact dezelfde kaartopbouw als home
   Alleen de sectieflow blijft jobs-specifiek; kaart, foto, badge, tekst,
   sliderafstand en navigatie volgen de homepage-geometrie.
   ========================================================================== */
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider{
	min-height:830px !important;
	overflow:visible !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__viewport{
	width:100% !important;
	height:680px !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:30px !important;
	width:max-content !important;
	height:680px !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider .mp-figma-vacancy{
	position:relative !important;
	flex:0 0 520px !important;
	width:520px !important;
	max-width:520px !important;
	height:620px !important;
	min-height:620px !important;
	margin:60px 0 0 !important;
	padding:0 !important;
	background:#F0F0F0 !important;
	border:0 !important;
	border-radius:30px !important;
	overflow:visible !important;
	box-shadow:none !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider .mp-figma-vacancy__media{
	position:static !important;
	width:auto !important;
	height:auto !important;
	min-height:0 !important;
	margin:0 !important;
	padding:0 !important;
	background:transparent !important;
	box-shadow:none !important;
	overflow:visible !important;
	border-radius:0 !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider .mp-figma-card-image{
	position:absolute !important;
	left:64px !important;
	top:-60px !important;
	width:393px !important;
	height:393px !important;
	min-width:393px !important;
	min-height:393px !important;
	max-width:393px !important;
	max-height:393px !important;
	aspect-ratio:1 / 1 !important;
	margin:0 !important;
	padding:0 !important;
	overflow:hidden !important;
	border-radius:0 !important;
	box-shadow:0 13px 24px rgba(0,0,0,.13) !important;
	background:#ddd !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider .mp-figma-card-image img{
	display:block !important;
	position:static !important;
	width:393px !important;
	height:393px !important;
	min-width:393px !important;
	min-height:393px !important;
	max-width:393px !important;
	max-height:393px !important;
	object-fit:cover !important;
	object-position:center !important;
	margin:0 !important;
	border-radius:0 !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider .mp-figma-vacancy__status{
	position:absolute !important;
	left:68px !important;
	top:380px !important;
	right:auto !important;
	bottom:auto !important;
	z-index:4 !important;
	display:inline-flex !important;
	align-items:center !important;
	width:auto !important;
	height:40px !important;
	min-height:40px !important;
	margin:0 !important;
	padding:7px 15px !important;
	border-radius:200px !important;
	background:#E4032E !important;
	color:#fff !important;
	font:700 18px/26px "KoHo",Arial,sans-serif !important;
	white-space:nowrap !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider .mp-figma-vacancy__body{
	position:absolute !important;
	left:68px !important;
	top:442px !important;
	right:38px !important;
	bottom:auto !important;
	width:auto !important;
	height:auto !important;
	margin:0 !important;
	padding:0 !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider .mp-figma-vacancy__body h3{
	margin:0 !important;
	padding:0 !important;
	color:#482974 !important;
	font:700 27px/33px "KoHo",Arial,sans-serif !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider .mp-figma-vacancy__meta{
	margin:0 !important;
	padding:0 !important;
	color:#482974 !important;
	font:500 27px/33px "KoHo",Arial,sans-serif !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider .mp-figma-vacancy__excerpt{
	margin:17px 0 0 !important;
	padding:0 !important;
	color:#000 !important;
	font:400 16px/23px "KoHo",Arial,sans-serif !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider .mp-figma-vacancy__body > a{
	display:inline !important;
	margin:0 !important;
	padding:0 !important;
	color:#1488CA !important;
	font:400 16px/23px "KoHo",Arial,sans-serif !important;
	text-decoration:none !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls{
	position:relative !important;
	left:auto !important;
	top:auto !important;
	width:100% !important;
	display:flex !important;
	justify-content:center !important;
	gap:38px !important;
	margin:64px 0 0 !important;
	padding:0 !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-vacancy-slider__controls button{
	display:grid !important;
	place-items:center !important;
	width:42px !important;
	height:42px !important;
	min-width:42px !important;
	min-height:42px !important;
	margin:0 !important;
	padding:0 !important;
	border:0 !important;
	border-radius:50% !important;
	background:#fff !important;
	box-shadow:0 0 18px rgba(0,0,0,.08) !important;
	color:#1488CA !important;
}
.mp-pdf-jobs .mp-jobs-vacancies .mp-home-center{
	margin:21px 0 0 !important;
}