/* ===== Varianten 'onderdeel van DIA Groep' (live 27-10-2026) – gemeenschappelijk: één, groter logo ===== */
body.huisstijl-deblaay{--hs-logo-h:80px;--hs-logo-hm:46px}
body.huisstijl-prime{--hs-logo-h:66px;--hs-logo-hm:40px}
body.huisstijl-sinis{--hs-logo-h:84px;--hs-logo-hm:50px}
@media (max-width:1279px){body.huisstijl-deblaay{--hs-logo-h:68px}body.huisstijl-prime{--hs-logo-h:56px}body.huisstijl-sinis{--hs-logo-h:72px}}
/* Prime: Montserrat-menu iets compacter zodat het grotere logo vrij staat */
@media (min-width:800px){body.huisstijl-prime #wrapper nav.desktop-nav ul.mainnav>li>a{font-size:92%}}
@media (min-width:1024px) and (max-width:1279px){body.huisstijl.huisstijl #wrapper nav.desktop-nav ul.mainnav>li>a{font-size:84%}body.huisstijl-deblaay{--hs-logo-h:58px}body.huisstijl-prime{--hs-logo-h:50px}body.huisstijl-sinis{--hs-logo-h:62px}}
@media (min-width:1280px) and (max-width:1599px){body.huisstijl.huisstijl #wrapper nav.desktop-nav ul.mainnav>li>a{font-size:90%}}
body.huisstijl.huisstijl.huisstijl #wrapper .site-header .wrap .site-logo.hs-brand{position:absolute!important;left:2em!important;top:0!important;height:6.2em!important;max-width:none!important;width:auto!important;display:flex!important;align-items:center;transform:none!important;pointer-events:all}
.hs-brand a{text-decoration:none!important}
.hs-brand .hs-brand-logo{display:block;line-height:0}
.hs-brand .hs-brand-logo img{display:block;height:var(--hs-logo-h);width:auto;max-width:none}
@media (max-width:799px){
 body.huisstijl.huisstijl.huisstijl #wrapper .site-header .wrap .site-logo.hs-brand{left:5%!important;height:4.6em!important}
 .hs-brand .hs-brand-logo img{height:var(--hs-logo-hm)}
}
/* menu open (mobiel): logo blijft leesbaar op witte ondergrond */
body.huisstijl.nav .hs-brand{background:#fff;padding:0 .6em;border-radius:var(--hs-radius-s)}
@media (max-width:799px){
 body.huisstijl #content .home-intro .wrap-title{min-height:0!important}
 body.huisstijl #content .home-intro .wrap-title p{font-size:min(3em,9.5vw)!important}
}
/* ---- groepsbalk (variant 2) ---- */
.hs-v2 .hs-groupbar{position:fixed;top:0;left:0;right:0;height:34px;z-index:1006;background:#f3f3f2;border-bottom:1px solid #e4e4e3;font:500 13px/34px var(--hs-body)}
.hs-v2 .hs-gb-in{display:flex;align-items:center;height:100%;padding:0 2em;gap:14px;white-space:nowrap}
.hs-v2 .hs-groupbar a{text-decoration:none!important}
.hs-v2 .hs-gb-dia{display:flex;align-items:center;gap:7px;color:#353535!important;font-weight:700;letter-spacing:.02em}
.hs-v2 .hs-gb-dia img{height:15px;width:auto;display:block}
.hs-v2 .hs-gb-sep{width:1px;height:14px;background:#cacac9;flex:none}
.hs-v2 .hs-groupbar ul{display:flex;margin:0;padding:0;list-style:none}
.hs-v2 .hs-groupbar li{margin:0;padding:0}
.hs-v2 .hs-groupbar li+li::before{content:'·';color:#a9a9a9;margin:0 10px}
.hs-v2 .hs-groupbar li a{color:#6d6e6d!important}
.hs-v2 .hs-groupbar li a:hover{color:#00a376!important}
.hs-v2 .hs-groupbar li a.is-current{color:var(--hs-text)!important;font-weight:700;box-shadow:inset 0 -2px 0 var(--hs-accent)}
.hs-v2 .hs-groupbar .s{display:none}
body.hs-v2 #wrapper::before{display:none}
body.hs-v2 #wrapper{padding-top:34px}
body.huisstijl.huisstijl.hs-v2:not(.nav) #wrapper .site-header{top:34px!important}
body.hs-v2.nav .hs-groupbar{display:none}
@media (max-width:799px){
 .hs-v2 .hs-groupbar{height:30px;font-size:11px;line-height:30px}
 .hs-v2 .hs-gb-dia span{display:none}
 .hs-v2 .hs-gb-in{padding:0 4%;gap:8px;overflow-x:auto;scrollbar-width:none}
 .hs-v2 .hs-gb-in::-webkit-scrollbar{display:none}
 .hs-v2 .hs-groupbar .l{display:none}.hs-v2 .hs-groupbar .s{display:inline}
 .hs-v2 .hs-groupbar li+li::before{margin:0 5px}
 body.hs-v2 #wrapper{padding-top:30px}
 body.huisstijl.huisstijl.hs-v2:not(.nav) #wrapper .site-header{top:30px!important}
}
/* groepsbalk op DIA Installatie Advies-pagina's (standaard DIA-opmaak, geen huisstijlklasse) */
body.hs-v2:not(.huisstijl) .hs-groupbar{--hs-text:#1d1d1b;--hs-accent:#00b482;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-weight:500;font-size:13px;line-height:34px}
body.hs-v2:not(.huisstijl) #wrapper{padding-top:0}
body.hs-v2:not(.huisstijl):not(.nav) #wrapper .site-header{transform:translateY(34px)}
@media (max-width:799px){
 body.hs-v2:not(.huisstijl) .hs-groupbar{font-size:11px;line-height:30px}
 body.hs-v2:not(.huisstijl):not(.nav) #wrapper .site-header{transform:translateY(30px)}
}
/* heel smalle telefoons: alles past zonder scrollen */
@media (max-width:374px){
 .hs-v2 .hs-groupbar{font-size:10px!important}
 .hs-v2 .hs-gb-in{gap:6px;padding:0 3%}
 .hs-v2 .hs-groupbar li+li::before{margin:0 3px}
}
/* ===== R3 (27-10-2026): hero-tekst altijd links van de foto ===== */
@media (min-width:800px){
 body.huisstijl #content .home-intro .wrap-title{width:56%!important;max-width:none!important;margin:0!important;padding-left:max(5vw,calc((100vw - 1300px)/2))!important;padding-right:2.5em!important;box-sizing:border-box!important}
 body.huisstijl #content .home-intro .wrap-title p,body.huisstijl #content .home-intro .wrap-title h1{max-width:none!important}
 body.huisstijl #content .home-intro .wrap-title p.green-after-span{padding-left:.7em}
}
@media (min-width:800px) and (max-width:1100px){body.huisstijl #content .home-intro .wrap-title{width:62%!important}}
/* ===== R3: mensen in plaats van panden ===== */
.hs-person{margin:0;position:relative;overflow:hidden;background:#111}
.hs-person img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.hs-person figcaption{position:absolute;left:0;right:0;bottom:0;padding:2.6em 1.2em 1em;background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.78));color:#fff;line-height:1.3;font-size:15px;text-align:left}
.hs-person figcaption a,.hs-person figcaption strong{display:block;color:#fff!important;font-weight:700;font-size:1.12em;text-decoration:none!important}
.hs-person figcaption a:hover{text-decoration:underline!important}
.hs-person figcaption span{display:block;color:rgba(255,255,255,.88);font-weight:400;font-size:.92em}
body.huisstijl .hs-person figcaption{font-family:var(--hs-body)}
body #content .hs-person figcaption a,body #content .specialisme-intro .hs-person figcaption a:not(.button),body #content .hs-person figcaption strong{color:#fff!important}
/* hoofdpagina: portret rechts in de hero */
body.huisstijl #content .home-intro .hs-hero.hs-person{position:absolute;z-index:1;top:0;right:0;width:44%;height:100%;border-radius:var(--hs-radius-l) 0 0 0}
@media (min-width:800px) and (max-width:1100px){body.huisstijl #content .home-intro .hs-hero.hs-person{width:38%}}
@media (max-width:799px){
 body.huisstijl #content .home-intro .hs-hero.hs-person{display:block!important;position:relative;width:auto;height:auto;aspect-ratio:5/4;margin:0 5% 1.6em;border-radius:var(--hs-radius-m,16px)}
}
/* subpagina's: portret naast de titel */
body.huisstijl .specialisme-intro .hs-person-intro{border-radius:var(--hs-radius-l) var(--hs-radius-l) 0 0}
@media (min-width:900px){
 body.hs-has-person{--pf-w:clamp(190px,20vw,320px);--pf-r:200px;--wrap-l:max(5vw,calc((100vw - 1300px)/2))}
 body.hs-has-person #content .specialisme-intro{min-height:31em}
 body.hs-has-person #content .specialisme-intro .wrap-title,body.hs-has-person #content .specialisme-intro .specialisme-label{padding-right:0!important;max-width:calc(100vw - var(--pf-r) - var(--pf-w) - 48px - var(--wrap-l))!important;margin-left:var(--wrap-l)!important;margin-right:0!important;box-sizing:border-box}
 body.hs-has-person #content .specialisme-intro .hs-person-intro{position:absolute;z-index:6;right:var(--pf-r);bottom:0;width:var(--pf-w);aspect-ratio:4/5;top:auto}
}
@media (min-width:900px) and (max-width:1279px){body.hs-has-person #content .specialisme-intro .wrap h1{font-size:250%}}
@media (min-width:1280px){body.hs-has-person{--pf-r:240px}}
@media (max-width:899px){
 body.hs-has-person #content .specialisme-intro .hs-person-intro{width:auto;max-width:420px;aspect-ratio:5/4;margin:1.4em 5% 0;border-radius:16px}
}
/* projectoverzicht per bedrijf */
.hs-ov-sub{margin:.3em 0 0;font-size:1.15em;opacity:.8}
/* projectpagina's en -overzicht in bedrijfsstijl */
body.huisstijl .bg-dia-intro h1,body.huisstijl .bg-dia-intro .wrap{color:var(--hs-text)!important}
body.huisstijl.template_referentie .green,body.huisstijl.template_referentie h1.green,body.huisstijl.template_referentie h2.green{color:var(--hs-accent)!important}
body.huisstijl.template_referentie .green-after-span span::after{background-color:var(--hs-accent)!important}
@media (max-width:799px){body.huisstijl.hs-has-person #content .home-intro .wrap-title{height:auto!important;max-height:none!important;min-height:0!important;padding-bottom:2em!important}}
@media (max-width:799px){body.huisstijl.hs-has-person #content .home-intro .wrap-title h1{margin-bottom:0!important}}
