/*
Theme Name: Flexsoftware
Theme URI: https://flexsoftware.nl
Description: Wordpress Theme development by Flexsoftware
Author: Flexsoftware
Requires at least: 6.0
Tested up to: 6.4.0
Requires PHP: 8.1
Version: 1.1.0
Text Domain: flexsoftware
*/

@font-face {
    font-family: "Stara";
    src: url("./assets/fonts/Stara-Medium.ttf") format("truetype");
    font-weight: 300 500;
    font-display: swap;
    font-style: normal;
  }


@font-face {
    font-family: "Stara";
    src: url("./assets/fonts/Stara-Bold.ttf") format("truetype");
    font-weight: bold;
    font-display: swap;
    font-style: normal;
  }

  @font-face {
    font-family: "Stara";
    src: url("./assets/fonts/Stara-ExtraBold.ttf") format("truetype");
    font-weight: 800;
    font-display: swap;
    font-style: normal;
  }


@media (max-width:1023px){.hero-image--diagonal{display:none}}
@media (min-width:1024px){.hero-image--diagonal{opacity:1;z-index:0}.hero-image--diagonal::after,.hero-image--diagonal::before{height:14%}.hero-image--diagonal::after{background:linear-gradient(to bottom,rgba(0,0,0,.72),transparent)}.hero-image--diagonal::before{background:linear-gradient(to top,rgba(0,0,0,.55),transparent)}.hero-image--diagonal img{opacity:1;left:auto;right:0;width:68%;object-position:72% 22%;-webkit-mask-image:linear-gradient(102deg,transparent 0%,transparent 4%,rgba(0,0,0,.18) 16%,rgba(0,0,0,.55) 30%,#000 44%,#000 100%);mask-image:linear-gradient(102deg,transparent 0%,transparent 4%,rgba(0,0,0,.18) 16%,rgba(0,0,0,.55) 30%,#000 44%,#000 100%)}.hero-image--diagonal .hero-image__fade{display:none}}
.image-content__copy ul.acf-wysiwyg-ul{margin-left:0;padding-left:0}.image-content__copy ul.acf-wysiwyg-ul li{padding-left:1.75rem}.image-content__copy ul.acf-wysiwyg-ul li:before{left:0;transform:none}


.hero-space-compact{padding-top:7.5rem;padding-bottom:2.25rem}
.hero-space-diagonal{padding-top:8.5rem;padding-bottom:3.5rem}
.hero-posts-space{padding-top:1rem;padding-bottom:3rem}
@media (min-width:1024px){
.hero-space-compact{padding-top:9rem;padding-bottom:2.75rem}
.hero-space-diagonal{padding-top:10.5rem;padding-bottom:4.5rem}
.hero-posts-space{padding-top:1.25rem;padding-bottom:4rem}
}
@media (min-width:1024px){
.hero-image--diagonal img{
-webkit-mask-image:linear-gradient(to right,transparent 0%,transparent 6%,rgba(0,0,0,.22) 20%,rgba(0,0,0,.62) 36%,#000 50%,#000 100%) !important;
mask-image:linear-gradient(to right,transparent 0%,transparent 6%,rgba(0,0,0,.22) 20%,rgba(0,0,0,.62) 36%,#000 50%,#000 100%) !important;
object-position:68% 28% !important;
width:70% !important;
}
}

@media (max-width:1023px){
body.page-id-605 .hero-image--diagonal{display:none}
body.page-id-18 .hero-image--diagonal{display:block;position:relative;top:auto;left:auto;width:100%;height:18rem;margin-top:1.75rem;opacity:1}
body.page-id-18 .hero-image--diagonal img{width:100% !important;left:0 !important;right:auto !important;object-position:72% 40% !important;opacity:1 !important;-webkit-mask-image:linear-gradient(to top,#000 72%,transparent 100%) !important;mask-image:linear-gradient(to top,#000 72%,transparent 100%) !important}
}


@media (max-width:1023px){
.hero-image--diagonal{display:block !important;position:absolute !important;top:0 !important;left:0 !important;width:100% !important;height:100% !important;margin:0 !important;opacity:1 !important}
.hero-image--diagonal img{width:100% !important;height:100% !important;left:0 !important;right:0 !important;object-fit:cover !important;object-position:78% 34% !important;opacity:1 !important;-webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.2) 16%,rgba(0,0,0,.55) 36%,#000 58%,#000 100%) !important;mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.2) 16%,rgba(0,0,0,.55) 36%,#000 58%,#000 100%) !important}
}
@media (min-width:1024px){
.hero-image--diagonal{display:block !important;opacity:1 !important}
.hero-image--diagonal::before{height:18% !important;background:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.72) 42%,transparent 100%) !important}
.hero-image--diagonal img{left:auto !important;right:0 !important;width:74% !important;height:100% !important;object-fit:cover !important;object-position:70% 22% !important;opacity:1 !important;-webkit-mask-image:linear-gradient(to right,transparent 0%,transparent 4%,rgba(0,0,0,.22) 18%,rgba(0,0,0,.62) 34%,#000 50%,#000 100%) !important;mask-image:linear-gradient(to right,transparent 0%,transparent 4%,rgba(0,0,0,.22) 18%,rgba(0,0,0,.62) 34%,#000 50%,#000 100%) !important}
}
body.page-id-605 .hero-image--diagonal img{object-position:66% 8% !important}
.image-content--overlay{position:relative;overflow:hidden;background:#000;color:#fff;margin-bottom:4rem}
.image-content--overlay .image-content__media{position:absolute;inset:0;width:auto;height:auto;pointer-events:none}
.image-content--overlay .image-content__media img{position:absolute !important;top:0;right:0;left:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:72% 18%}
.image-content--overlay .image-content__media img{-webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.28) 22%,rgba(0,0,0,.62) 42%,#000 64%,#000 100%);mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.28) 22%,rgba(0,0,0,.62) 42%,#000 64%,#000 100%)}
.image-content--overlay .container{position:relative;z-index:2}
.image-content--overlay .image-content__copy{max-width:none;padding:2.75rem 0 3rem;color:#fff}
.image-content--overlay .image-content__copy h2,.image-content--overlay .image-content__copy h3,.image-content--overlay .image-content__copy p,.image-content--overlay .image-content__copy li,.image-content--overlay .image-content__copy strong{color:#fff}
@media (min-width:1024px){
.image-content--overlay{margin-bottom:6rem}
.image-content--overlay .image-content__media img{left:auto;width:58%;object-position:50% 14%}
.image-content--overlay .image-content__media img{-webkit-mask-image:linear-gradient(to right,transparent 0%,transparent 2%,rgba(0,0,0,.2) 16%,rgba(0,0,0,.58) 32%,#000 48%,#000 100%);mask-image:linear-gradient(to right,transparent 0%,transparent 2%,rgba(0,0,0,.2) 16%,rgba(0,0,0,.58) 32%,#000 48%,#000 100%)}
.image-content--overlay .image-content__copy{max-width:46%;padding:4.5rem 0}
}
body.page-id-18 .image-content--overlay .image-content__media img{object-position:62% 24%}


body.page-id-605 .hero-image--diagonal img{top:5.75rem !important;height:calc(100% - 5.75rem) !important;object-position:64% 0% !important}


@media (min-width:1024px){
body.page-id-605 .image-content--overlay .image-content__media img{width:68% !important;object-position:36% 8% !important}
body.page-id-18 .image-content--overlay .image-content__media img{width:64% !important;object-position:48% 18% !important}
}


@media (max-width:1023px){
body.page-id-605 .hero-image--diagonal img{object-position:86% 30% !important;top:4.25rem !important;height:calc(100% - 4.25rem) !important}
}


@media (max-width:1023px){
body.page-id-605 .hero-image--diagonal img{object-position:100% 12% !important}
}


@media (max-width:1023px){
.image-content--overlay .image-content__media img{
width:100% !important;left:0 !important;right:0 !important;
-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,.42) 0%,rgba(0,0,0,.5) 100%) !important;
mask-image:linear-gradient(to right,rgba(0,0,0,.42) 0%,rgba(0,0,0,.5) 100%) !important;
}
}


.hero-image--diagonal::before,.hero-image--diagonal::after{display:none !important;content:none !important}
body.page-id-18 section,body.page-id-605 section{margin-bottom:0 !important}
body.page-id-18 .image-content--overlay .image-content__media img{object-position:46% 0% !important}
@media (min-width:1024px){
body.page-id-18 .image-content--overlay .image-content__media img{object-position:42% 0% !important}
}
@media (max-width:1023px){
.image-content--overlay .image-content__copy p{margin:0 0 1.15rem !important;line-height:1.7}
.image-content--overlay .image-content__copy h2{margin-bottom:1rem !important;line-height:1.15}
.image-content--overlay .image-content__copy h3{margin:1.75rem 0 .8rem !important;line-height:1.3}
.image-content--overlay .image-content__copy ul.acf-wysiwyg-ul{margin:.75rem 0 1.25rem !important}
.image-content--overlay .image-content__copy ul.acf-wysiwyg-ul li{margin-bottom:1rem !important;padding-left:2.35rem !important;line-height:1.55}
}


body.page-id-605 .image-content--overlay,
body.page-id-605 .image-content--overlay + section{
border-top:3px solid #c9a227;
}
body.page-id-18 .image-content--overlay .image-content__media img{object-position:58% 34% !important}
@media (min-width:1024px){
body.page-id-18 .image-content--overlay .image-content__media img{object-position:50% 38% !important}
}
.image-content--overlay .image-content__copy ul.acf-wysiwyg-ul{overflow:visible}
.image-content--overlay .image-content__copy ul.acf-wysiwyg-ul li{overflow:visible}
.image-content--overlay .image-content__copy ul.acf-wysiwyg-ul li::before,
.image-content--overlay .image-content__copy ul.acf-wysiwyg-ul li:before{
left:0 !important;right:auto !important;transform:none !important;translate:none !important;margin-left:0 !important;
}
@media (max-width:1023px){
.image-content--overlay .container{padding-left:1.35rem !important;padding-right:1.25rem !important}
.image-content--overlay .image-content__copy ul.acf-wysiwyg-ul li{padding-left:2.6rem !important}
}
@media (max-width:1023px){
body.page-id-605 .hero-image--diagonal img{object-position:50% 38% !important}
body.page-id-605 .image-content--overlay .image-content__media img{object-position:50% 40% !important}
}


@media (min-width:1024px){
body.page-id-605 .hero-image--diagonal img{width:62% !important;object-position:66% 28% !important}
body.page-id-605 .image-content--overlay .image-content__media img{
left:0 !important;right:auto !important;top:0 !important;width:68% !important;height:100% !important;object-position:72% 12% !important;
-webkit-mask-image:linear-gradient(to left,transparent 0%,transparent 2%,rgba(0,0,0,.2) 16%,rgba(0,0,0,.58) 32%,#000 48%,#000 100%) !important;
mask-image:linear-gradient(to left,transparent 0%,transparent 2%,rgba(0,0,0,.2) 16%,rgba(0,0,0,.58) 32%,#000 48%,#000 100%) !important;
}
body.page-id-605 .image-content--overlay .image-content__copy{
max-width:46% !important;margin-left:auto !important;margin-right:0 !important;
}
}

body{background:#000;color:#fff}
footer{background:#fff;color:#171717}
.footer-logo{height:4.5rem;width:auto;max-width:240px;object-fit:contain}
.bg-white,.bg-white p,.bg-white li,.bg-white h2,.bg-white h3{color:#111}
.bg-primary-200,.bg-primary-200 p,.bg-primary-200 li,.bg-primary-200 h2,.bg-primary-200 h3{color:#111}
.wpcf7 label,.wpcf7{color:#fff}
.wpcf7 input:not([type="submit"]),.wpcf7 textarea,.wpcf7 select{background:#fff;color:#111}
body.page-id-651 section.relative.bg-black,
body.page-id-528 section.relative.bg-black{padding-top:8.5rem !important;padding-bottom:2.25rem !important}
body.page-id-605 section.relative.bg-black,
body.page-id-18 section.relative.bg-black{padding-top:8.5rem !important;padding-bottom:2.5rem !important}
@media (min-width:1024px){
body.page-id-651 section.relative.bg-black,
body.page-id-528 section.relative.bg-black{padding-top:11rem !important;padding-bottom:3rem !important}
body.page-id-605 section.relative.bg-black,
body.page-id-18 section.relative.bg-black{padding-top:12rem !important;padding-bottom:3.5rem !important}
}
.image-content--overlay{position:relative !important;overflow:hidden;background:#000 !important;color:#fff !important}
.image-content--overlay .image-content__media{position:relative !important;inset:auto !important;width:100% !important;height:auto !important;pointer-events:auto}
.image-content--overlay .image-content__media img{
position:relative !important;top:auto !important;left:auto !important;right:auto !important;
width:100% !important;height:14rem !important;max-height:14rem !important;object-fit:cover !important;object-position:50% 32% !important;
-webkit-mask-image:none !important;mask-image:none !important;
}
.image-content--overlay .image-content__copy{max-width:none !important;margin-left:0 !important;margin-right:0 !important;padding:0 !important;color:#fff !important}
@media (min-width:1024px){
.image-content--overlay .image-content__media{width:42% !important;flex:0 0 42%}
.image-content--overlay .image-content__media img{height:22rem !important;max-height:22rem !important}
body.page-id-18 .image-content--overlay .container > .flex{flex-direction:row-reverse}
body.page-id-605 .image-content--overlay .image-content__media img{object-position:50% 28% !important}
body.page-id-18 .image-content--overlay .image-content__media img{object-position:50% 38% !important}
}
@media (max-width:1023px){
body.page-id-605 .hero-image--diagonal img{object-position:50% 38% !important}
body.page-id-605 .image-content--overlay .image-content__media img{object-position:50% 40% !important;height:14rem !important}
body.page-id-18 .image-content--overlay .image-content__media img{object-position:50% 38% !important;height:14rem !important}
}

body.page-id-605 .image-content--overlay .image-content__media,
body.page-id-18 .image-content--overlay .image-content__media{position:relative !important;inset:auto !important;top:auto !important;left:auto !important;right:auto !important;width:100% !important;height:auto !important}
body.page-id-605 .image-content--overlay .image-content__media img,
body.page-id-18 .image-content--overlay .image-content__media img{
position:relative !important;top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;
width:100% !important;height:14rem !important;max-height:14rem !important;object-fit:cover !important;
-webkit-mask-image:none !important;mask-image:none !important;
}
body.page-id-605 .image-content--overlay .image-content__copy,
body.page-id-18 .image-content--overlay .image-content__copy{max-width:none !important;margin-left:0 !important;margin-right:0 !important;width:auto !important;padding:0 !important;color:#fff !important}
@media (min-width:1024px){
body.page-id-605 .image-content--overlay .image-content__media,
body.page-id-18 .image-content--overlay .image-content__media{width:42% !important;flex:0 0 42%}
body.page-id-605 .image-content--overlay .image-content__media img,
body.page-id-18 .image-content--overlay .image-content__media img{height:22rem !important;max-height:22rem !important}
body.page-id-605 .image-content--overlay .image-content__media img{object-position:50% 28% !important}
body.page-id-18 .image-content--overlay .image-content__media img{object-position:50% 38% !important}
body.page-id-18 .image-content--overlay .container > .flex{flex-direction:row-reverse}
}
@media (max-width:1023px){
body.page-id-605 .hero-image--diagonal img{object-position:50% 38% !important}
body.page-id-605 .image-content--overlay .image-content__media img{object-position:50% 40% !important;height:14rem !important;max-height:14rem !important}
body.page-id-18 .image-content--overlay .image-content__media img{object-position:50% 38% !important;height:14rem !important;max-height:14rem !important}
}

@media (max-width:1023px){
body.page-id-605 section.relative.bg-black,
body.page-id-18 section.relative.bg-black{display:flex !important;flex-direction:column !important;padding-top:8.5rem !important}
/* Vierkante websitefoto’s: geen brede banner (rek/crop) op mobiel */
body.page-id-605 .hero-image--diagonal,
body.page-id-18 .hero-image--diagonal{
position:relative !important;
order:2;
top:auto !important;
left:auto !important;
right:auto !important;
width:var(--gh-square, min(100%,18rem)) !important;
max-width:calc(100% - 2rem) !important;
height:auto !important;
aspect-ratio:1 / 1 !important;
margin:1.5rem 0 0 1rem !important;
opacity:1 !important;
overflow:hidden !important;
}
body.page-id-605 .hero-image--diagonal img,
body.page-id-18 .hero-image--diagonal img{
position:relative !important;
top:auto !important;
left:auto !important;
right:auto !important;
width:100% !important;
height:100% !important;
max-width:none !important;
aspect-ratio:1 / 1 !important;
object-fit:cover !important;
object-position:center center !important;
-webkit-mask-image:none !important;
mask-image:none !important;
}
}

@media (min-width:1024px){
body.page-id-605 .hero-image--diagonal img,
body.page-id-18 .hero-image--diagonal img{top:4.25rem !important;height:calc(100% - 4.25rem) !important}
body.page-id-605 section.relative.bg-black,
body.page-id-18 section.relative.bg-black{min-height:0 !important;padding-bottom:2.5rem !important}
}
body.page-id-605 .image-content--overlay,
body.page-id-18 .image-content--overlay{padding-top:1.5rem !important;padding-bottom:3rem !important}
@media (min-width:1024px){
body.page-id-605 .image-content--overlay .image-content__media,
body.page-id-18 .image-content--overlay .image-content__media{width:38% !important;flex:0 0 38%;align-self:center}
body.page-id-605 .image-content--overlay .image-content__media img,
body.page-id-18 .image-content--overlay .image-content__media img{height:32rem !important;max-height:32rem !important}
body.page-id-605 .image-content--overlay .container > .flex,
body.page-id-18 .image-content--overlay .container > .flex{align-items:center;gap:3.5rem}
}
.icon-blocks{padding-top:4.5rem;padding-bottom:4.5rem}
.icon-blocks__grid{display:grid;grid-template-columns:1fr;gap:2.75rem}
.icon-blocks__item{text-align:center;padding:0 1rem}
@media (min-width:768px){
.icon-blocks{padding-top:5.5rem;padding-bottom:5.5rem}
.icon-blocks__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:3.5rem;align-items:start}
}
@media (min-width:1024px){
body.page-id-605 .hero-image--diagonal .hero-image__fade{display:none !important}
}
body.page-id-651 section.bg-black:not(.relative){padding-bottom:5rem !important}
@media (min-width:1024px){
body.page-id-18 section.relative.bg-black{
display:grid !important;
grid-template-columns:minmax(0,1fr);
justify-items:center;
align-items:center;
min-height:0 !important;
padding-top:12rem !important;
padding-bottom:3.5rem !important;
overflow:hidden;
}
body.page-id-18 section.relative.bg-black > .container{
grid-area:1 / 1;
width:100%;
align-self:center;
position:relative;
z-index:2;
}
body.page-id-18 section.relative.bg-black > .hero-image--diagonal{
grid-area:1 / 1;
position:relative !important;
top:auto !important;
left:auto !important;
right:auto !important;
width:100% !important;
max-width:64rem;
height:auto !important;
margin:0 !important;
opacity:1 !important;
display:flex !important;
align-items:center;
justify-content:flex-end;
align-self:center;
justify-self:center;
pointer-events:none;
z-index:1;
}
body.page-id-18 .hero-image--diagonal img{
position:relative !important;
top:auto !important;
right:auto !important;
left:auto !important;
bottom:auto !important;
width:min(27rem, calc(50% - 5rem)) !important;
height:24rem !important;
max-width:none !important;
max-height:none !important;
margin-right:calc((50% - 1rem - min(27rem, 50% - 5rem)) / 2 + 1rem) !important;
object-fit:cover !important;
object-position:82% 18% !important;
opacity:1 !important;
-webkit-mask-image:none !important;
mask-image:none !important;
pointer-events:auto;
}
body.page-id-18 .hero-image--diagonal .hero-image__fade{display:none !important}
}
@media (min-width:1280px){
body.page-id-18 section.relative.bg-black > .hero-image--diagonal{max-width:80rem}
}
@media (min-width:1536px){
body.page-id-18 section.relative.bg-black > .hero-image--diagonal{max-width:96rem}
}
@media (min-width:1024px){
body.page-id-682 section.relative.bg-black{padding-bottom:5rem !important}
body.page-id-605 section.relative.bg-black{padding-bottom:5.5rem !important}
/* Handshake even groot als de andere content-vierkanten */
body.page-id-605 .hero-image--diagonal img{
width:var(--gh-square,24rem) !important;
max-width:var(--gh-square,24rem) !important;
height:var(--gh-square,24rem) !important;
aspect-ratio:1 / 1 !important;
object-fit:cover !important;
object-position:center center !important;
top:auto !important;
bottom:auto !important;
right:max(1.5rem, calc((100% - 80rem) / 2)) !important;
left:auto !important;
-webkit-mask-image:none !important;
mask-image:none !important;
}
body.page-id-605 img[src*="GH-kopie"],
body.page-id-605 img[src*="gouden-netwerk"]{display:block;width:var(--gh-square, min(100%,18rem)) !important;max-width:var(--gh-square, min(100%,18rem)) !important;height:auto !important;aspect-ratio:1 / 1 !important;margin-left:auto;margin-right:auto;object-fit:contain}
body.page-id-605 section:has(img[src*="GH-kopie"]) > .container > .grid,
body.page-id-605 section:has(img[src*="gouden-netwerk"]) > .container > .grid{align-items:center !important;gap:4.5rem !important}
body.page-id-605 .image-content--overlay{padding-top:4rem !important}
.pagination-steps .swiper-pagination-bullet{background:#c9a227 !important;opacity:.55 !important;width:.55rem !important;height:.55rem !important}
.pagination-steps .swiper-pagination-bullet-active{background:#dac167 !important;opacity:1 !important;width:1.75rem !important}
}
.news-card__image{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:center top}
.single-post__image{width:100%;height:auto;object-fit:contain;object-position:center top}

@media (max-width:639px){
h3,.h3{line-height:1.25}
body.page-id-605 section:has(img[src*="GH-kopie"]) h3,
body.page-id-605 section:has(img[src*="gouden-netwerk"]) h3{margin:0 0 1.15rem}
body.page-id-605 section:has(img[src*="GH-kopie"]) p,
body.page-id-605 section:has(img[src*="gouden-netwerk"]) p{line-height:1.75;margin-bottom:1.15rem}
body.page-id-605 section:has(img[src*="GH-kopie"]) > .container,
body.page-id-605 section:has(img[src*="gouden-netwerk"]) > .container{padding-left:1.35rem;padding-right:1.35rem}
}

body.page-id-605 .image-content--overlay{
overflow:hidden !important;
}

body.page-id-11 main > section,
body.home main > section{margin-bottom:0 !important}
body.page-id-11 main > section + section,
body.home main > section + section{
border-top:3px solid #c9a227;
padding-top:1.75rem !important;
padding-bottom:1.75rem !important;
}
body.page-id-11 main > section:nth-of-type(3),
body.home main > section:nth-of-type(3){padding-bottom:1.75rem !important}
body.blog main > section.px-4 > .py-16,
body.page-id-660 main > section.px-4 > .py-16{padding-top:1.5rem !important;padding-bottom:3rem !important}
@media (min-width:1024px){
body.blog main > section.px-4 > .py-16,
body.page-id-660 main > section.px-4 > .py-16{padding-top:2rem !important;padding-bottom:3.5rem !important}
body.page-id-11 main > section + section,
body.home main > section + section{
padding-top:2.25rem !important;
padding-bottom:2.25rem !important;
}
}

/* Taxonomy archives: tighter space between listing and “Ik help je graag…” */
.tax-branche-vakgebied main > section,
.tax-branches main > section,
.tax-locations main > section,
.tax-regio main > section,
.tax-provincie main > section{
margin-bottom:0 !important;
}

/*
 * Websitefotos (LEESMIJ): zelfde vierkante foto-vak overal.
 * Bronbestanden blijven 900/600; weergave via --gh-square.
 * Heroes (diagonal banners) blijven apart — geen geforceerd vierkant.
 */
:root{--gh-square:min(100%,18rem)}
@media (min-width:1024px){:root{--gh-square:24rem}}

.gh-square-media,
body.page-id-11 .gh-square-media,
body.home .gh-square-media,
body.page-id-18 .gh-square-media,
body.page-id-605 .gh-square-media,
body.page-id-18 .image-content--overlay .image-content__media.gh-square-media,
body.page-id-605 .image-content--overlay .image-content__media.gh-square-media,
body.page-id-18 .image-content--overlay .gh-square-media,
body.page-id-605 .image-content--overlay .gh-square-media{
position:relative !important;
inset:auto !important;
flex:0 0 var(--gh-square) !important;
width:var(--gh-square) !important;
max-width:var(--gh-square) !important;
height:auto !important;
aspect-ratio:1 / 1 !important;
align-self:center !important;
margin-left:auto !important;
margin-right:auto !important;
overflow:hidden !important;
pointer-events:auto !important;
}

.gh-square-img,
.gh-square-media > img,
body.page-id-11 .gh-square-img,
body.home .gh-square-img,
body.page-id-18 .gh-square-img,
body.page-id-605 .gh-square-img,
body.page-id-18 .image-content--overlay .gh-square-media img,
body.page-id-605 .image-content--overlay .gh-square-media img,
body.page-id-605 img[src*="gouden-netwerk"],
body.page-id-605 img[src*="GH-kopie"]{
display:block !important;
position:relative !important;
inset:auto !important;
width:100% !important;
max-width:var(--gh-square) !important;
height:auto !important;
max-height:none !important;
aspect-ratio:1 / 1 !important;
object-fit:contain !important;
object-position:center center !important;
-webkit-mask-image:none !important;
mask-image:none !important;
margin-left:auto;
margin-right:auto;
}

/* Ruimte voor grotere foto: tekst opschuiven / minder padding */
.flex:has(> .gh-square-media){
align-items:center !important;
gap:1.75rem !important;
}
@media (min-width:1024px){
.flex:has(> .gh-square-media){gap:2.75rem !important}
.flex:has(> .gh-square-media) > .image-content__copy,
body.page-id-18 .image-content--overlay .image-content__copy,
body.page-id-605 .image-content--overlay .image-content__copy{
padding-top:1.25rem !important;
padding-bottom:1.25rem !important;
padding-left:0 !important;
padding-right:0 !important;
max-width:none !important;
flex:1 1 auto !important;
width:auto !important;
margin:0 !important;
}
body.page-id-605 .image-content--overlay .container > .flex{
flex-direction:row !important;
align-items:center !important;
}
}
@media (max-width:1023px){
.flex:has(> .gh-square-media){
flex-direction:column !important;
align-items:center !important;
}
body.page-id-605 .image-content--overlay .container > .flex{
flex-direction:column !important;
align-items:center !important;
gap:1.75rem !important;
}
body.page-id-605 .image-content--overlay .image-content__copy{
max-width:none !important;
width:100% !important;
margin:0 !important;
}
}
/* === GH mobile hero square (no stretch) === */
@media (max-width:1023px){
body.page-id-605 .hero-image--diagonal,
body.page-id-18 .hero-image--diagonal{
display:block !important;
position:relative !important;
order:2;
top:auto !important;left:auto !important;right:auto !important;
width:var(--gh-square,min(100%,18rem)) !important;
max-width:calc(100% - 2rem) !important;
height:auto !important;
aspect-ratio:1 / 1 !important;
margin:1.5rem 0 0 1rem !important;
opacity:1 !important;
overflow:hidden !important;
}
body.page-id-605 .hero-image--diagonal img,
body.page-id-18 .hero-image--diagonal img{
position:relative !important;top:auto !important;left:auto !important;right:auto !important;
width:100% !important;height:100% !important;max-width:none !important;
aspect-ratio:1 / 1 !important;object-fit:cover !important;object-position:center center !important;
-webkit-mask-image:none !important;mask-image:none !important;
}
}
/* === GH desktop hero = content square === */
@media (min-width:1024px){
body.page-id-605 .hero-image--diagonal img{
width:var(--gh-square,24rem) !important;
max-width:var(--gh-square,24rem) !important;
height:var(--gh-square,24rem) !important;
aspect-ratio:1 / 1 !important;
object-fit:cover !important;
object-position:center center !important;
top:calc(50% + 3.25rem) !important;
transform:translateY(-50%) !important;
bottom:auto !important;
right:max(1.5rem, calc((100% - 80rem) / 2)) !important;
left:auto !important;
-webkit-mask-image:none !important;
mask-image:none !important;
}
}

/*
 * Homepage “Over Goudhaantjes” (content-block grid):
 * zelfde opzet als “Ben jij” (image-content flex), gespiegeld —
 * tekst blijft breed, foto rechts tegen de rand (geen 50/50 + centreren).
 */
@media (min-width:1024px){
body.home section.bg-black:has(.first img.gh-square-img):has(.second) > .container > .grid,
body.page-id-11 section.bg-black:has(.first img.gh-square-img):has(.second) > .container > .grid,
body.home section.bg-black:has(.first img[src*="kandidaatgesprek"]):has(.second) > .container > .grid,
body.page-id-11 section.bg-black:has(.first img[src*="kandidaatgesprek"]):has(.second) > .container > .grid{
display:flex !important;
flex-direction:row !important;
flex-wrap:nowrap !important;
align-items:center !important;
gap:4rem !important;
}
body.home section.bg-black:has(.first img.gh-square-img):has(.second) > .container > .grid > .second,
body.page-id-11 section.bg-black:has(.first img.gh-square-img):has(.second) > .container > .grid > .second,
body.home section.bg-black:has(.first img[src*="kandidaatgesprek"]):has(.second) > .container > .grid > .second,
body.page-id-11 section.bg-black:has(.first img[src*="kandidaatgesprek"]):has(.second) > .container > .grid > .second{
flex:1 1 auto !important;
width:auto !important;
max-width:none !important;
}
body.home section.bg-black:has(.first img.gh-square-img):has(.second) > .container > .grid > .first,
body.page-id-11 section.bg-black:has(.first img.gh-square-img):has(.second) > .container > .grid > .first,
body.home section.bg-black:has(.first img[src*="kandidaatgesprek"]):has(.second) > .container > .grid > .first,
body.page-id-11 section.bg-black:has(.first img[src*="kandidaatgesprek"]):has(.second) > .container > .grid > .first{
flex:0 0 var(--gh-square,24rem) !important;
width:var(--gh-square,24rem) !important;
max-width:var(--gh-square,24rem) !important;
}
body.home section.bg-black:has(.first img.gh-square-img):has(.second) .first img.gh-square-img,
body.page-id-11 section.bg-black:has(.first img.gh-square-img):has(.second) .first img.gh-square-img,
body.home section.bg-black .first img[src*="kandidaatgesprek"],
body.page-id-11 section.bg-black .first img[src*="kandidaatgesprek"]{
margin-left:0 !important;
margin-right:0 !important;
max-width:var(--gh-square,24rem) !important;
width:100% !important;
aspect-ratio:1 / 1 !important;
object-fit:contain !important;
}
}

/* Live fallback: content-foto’s uit Media Library zonder _gh_square meta */
img.w-full.h-auto[src*="goudhaantjes-keurmerk"],
img.w-full.h-auto[src*="kandidaatgesprek"],
img.w-full.h-auto[src*="opdrachtgevers"],
img.w-full.h-auto[src*="gouden-netwerk"],
img.w-full.h-auto[src*="matthijs-bellen"],
.image-content__media:has(img[src*="goudhaantjes-keurmerk"]),
.image-content__media:has(img[src*="kandidaatgesprek"]),
.image-content__media:has(img[src*="opdrachtgevers"]),
.image-content__media:has(img[src*="gouden-netwerk"]),
.image-content__media:has(img[src*="matthijs-bellen"]){
width:var(--gh-square,min(100%,18rem)) !important;
max-width:var(--gh-square,min(100%,18rem)) !important;
}
img.w-full.h-auto[src*="goudhaantjes-keurmerk"],
img.w-full.h-auto[src*="kandidaatgesprek"],
img.w-full.h-auto[src*="opdrachtgevers"],
img.w-full.h-auto[src*="gouden-netwerk"],
img.w-full.h-auto[src*="matthijs-bellen"]{
height:auto !important;
aspect-ratio:1 / 1 !important;
object-fit:contain !important;
}
@media (min-width:1024px){
.image-content__media:has(img[src*="goudhaantjes-keurmerk"]),
.image-content__media:has(img[src*="kandidaatgesprek"]),
.image-content__media:has(img[src*="opdrachtgevers"]),
.image-content__media:has(img[src*="gouden-netwerk"]),
.image-content__media:has(img[src*="matthijs-bellen"]){
flex:0 0 var(--gh-square,24rem) !important;
width:var(--gh-square,24rem) !important;
max-width:var(--gh-square,24rem) !important;
}
}

/* Inschrijven/solliciteren: aside mag NIET sticky zijn */
body.page-id-528 .sticky,
body.page-id-594 .sticky {
  position: static !important;
  top: auto !important;
}

/*
 * ALLEEN mobiel (≤1023px): Home / Over / Werving
 * — eerst tekst, daarna foto
 * — foto links uitlijnen
 * Desktop blijft ongewijzigd.
 */
@media (max-width:1023px){
/* image-content: tekst boven foto */
body.home .flex:has(> .image-content__media) > .image-content__copy,
body.page-id-11 .flex:has(> .image-content__media) > .image-content__copy,
body.page-id-18 .flex:has(> .image-content__media) > .image-content__copy,
body.page-id-605 .flex:has(> .image-content__media) > .image-content__copy{
order:1 !important;
width:100% !important;
}
body.home .flex:has(> .image-content__media) > .image-content__media,
body.page-id-11 .flex:has(> .image-content__media) > .image-content__media,
body.page-id-18 .flex:has(> .image-content__media) > .image-content__media,
body.page-id-605 .flex:has(> .image-content__media) > .image-content__media{
order:2 !important;
}
body.home .flex:has(> .image-content__media),
body.page-id-11 .flex:has(> .image-content__media),
body.page-id-18 .flex:has(> .image-content__media),
body.page-id-605 .flex:has(> .image-content__media),
body.home .flex:has(> .gh-square-media),
body.page-id-11 .flex:has(> .gh-square-media),
body.page-id-18 .flex:has(> .gh-square-media),
body.page-id-605 .flex:has(> .gh-square-media),
body.page-id-18 .image-content--overlay .container > .flex,
body.page-id-605 .image-content--overlay .container > .flex{
flex-direction:column !important;
align-items:flex-start !important;
}

/* content-block: kolom mét foto altijd onder de tekst (los van first/second) */
body.home section.bg-black > .container > .grid > :not(:has(img)),
body.page-id-11 section.bg-black > .container > .grid > :not(:has(img)),
body.page-id-605 section.bg-black > .container > .grid > :not(:has(img)){
order:1 !important;
}
body.home section.bg-black > .container > .grid > :has(img),
body.page-id-11 section.bg-black > .container > .grid > :has(img),
body.page-id-605 section.bg-black > .container > .grid > :has(img){
order:2 !important;
}

/* foto’s links, zelfde start als tekst (container-padding) */
body.home .gh-square-media,
body.page-id-11 .gh-square-media,
body.page-id-18 .gh-square-media,
body.page-id-605 .gh-square-media,
body.home .image-content__media,
body.page-id-11 .image-content__media,
body.page-id-18 .image-content__media,
body.page-id-605 .image-content__media,
body.page-id-18 .image-content--overlay .image-content__media,
body.page-id-605 .image-content--overlay .image-content__media,
body.page-id-18 .image-content--overlay .image-content__media.gh-square-media,
body.page-id-605 .image-content--overlay .image-content__media.gh-square-media,
body.page-id-18 .image-content--overlay .gh-square-media,
body.page-id-605 .image-content--overlay .gh-square-media,
body.home .first,
body.page-id-11 .first,
body.page-id-605 .first,
body.home .second,
body.page-id-11 .second,
body.page-id-605 .second{
align-self:flex-start !important;
margin-left:0 !important;
margin-right:auto !important;
justify-self:start !important;
}
body.home .gh-square-img,
body.page-id-11 .gh-square-img,
body.page-id-18 .gh-square-img,
body.page-id-605 .gh-square-img,
body.home .gh-square-media > img,
body.page-id-11 .gh-square-media > img,
body.page-id-18 .gh-square-media > img,
body.page-id-605 .gh-square-media > img,
body.page-id-18 .image-content--overlay .gh-square-media img,
body.page-id-605 .image-content--overlay .gh-square-media img,
body.home .first img,
body.page-id-11 .first img,
body.page-id-605 .first img,
body.home .second img,
body.page-id-11 .second img,
body.page-id-605 .second img,
body.page-id-18 .image-content__media img,
body.page-id-605 .image-content__media img,
body.page-id-605 img[src*="gouden-netwerk"],
body.page-id-605 img[src*="GH-kopie"]{
margin-left:0 !important;
margin-right:auto !important;
display:block !important;
}

/* Netwerkfoto: crop vanaf onderkant (niet boven) */
body.page-id-605 img[src*="gouden-netwerk"]{
object-fit:cover !important;
object-position:center bottom !important;
}

/* Hero Over / Werving: tekst eerst, foto daarna, uitlijnen met tekst */
body.page-id-18 section.relative.bg-black > .container,
body.page-id-605 section.relative.bg-black > .container{
order:1 !important;
}
body.page-id-18 .hero-image--diagonal,
body.page-id-605 .hero-image--diagonal{
order:2 !important;
margin-top:1.5rem !important;
margin-bottom:0 !important;
margin-left:1rem !important;
margin-right:auto !important;
align-self:flex-start !important;
width:var(--gh-square,min(100%,18rem)) !important;
max-width:calc(100% - 2rem) !important;
}
}