:root{
  --hs-green:#93c127;
  --hs-green-dark:#78a51a;
  --hs-brown:#746654;
  --hs-brown-dark:#51483d;
  --hs-ink:#3f3a34;
  --hs-soft:#f6f6f2;
  --hs-line:#e7e4de;
  --hs-white:#fff;
  --hs-shadow:0 16px 45px rgba(55,48,41,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:#fff!important;background-image:none!important;color:var(--hs-ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{transition:color .2s ease,background-color .2s ease,transform .2s ease,box-shadow .2s ease}
.titel_1{font-size:clamp(24px,2.2vw,34px);line-height:1.15;letter-spacing:.6px;color:var(--hs-brown)}
.text_1,.hm_intro_text,p{font-size:16px;line-height:1.75;color:var(--hs-brown)}
.button{float:none;display:inline-flex;align-items:center;justify-content:center;padding:13px 24px;border:0;border-radius:8px;background:var(--hs-green);box-shadow:0 8px 22px rgba(147,193,39,.22);font-size:16px;letter-spacing:.4px;line-height:1.2}
.button:hover{background:var(--hs-green-dark);transform:translateY(-2px);box-shadow:0 12px 28px rgba(147,193,39,.28)}

/* Header */
.vp_header{position:sticky!important;top:0;z-index:1000!important;padding:10px 0;background:rgba(255,255,255,.97)!important;box-shadow:0 1px 0 rgba(81,72,61,.08);backdrop-filter:blur(10px)}
.header{width:min(92%,1320px)!important;display:flex;align-items:center;justify-content:space-between;float:none!important}
.header_logo{width:154px!important;margin:0!important;float:none!important;flex:0 0 auto}
.header_logo img{display:block;width:100%;height:auto}
.header_menu{width:auto!important;float:none!important;display:flex;align-items:center;justify-content:flex-end;gap:4px}
.menu_item{float:none!important;padding:15px 16px!important;font-size:15px!important;letter-spacing:.5px;border-radius:7px;text-decoration:none!important}
.menu_item:hover{background:#f5f7ef;color:var(--hs-green-dark)}
.menu_selected{color:var(--hs-green-dark)!important;text-decoration:none!important;background:#f3f7ea}
#diensten_hover{float:none;position:relative;display:flex;align-items:stretch}
@media (min-width:851px){
  #diensten_hover{
    position:relative;
    display:flex;
    align-items:stretch;
    padding-bottom:0;
  }
  #diensten_hover>.menu_item{
    display:flex;
    align-items:center;
  }
  #diensten_hover .diensten_dropdown{
    display:flex!important;
    flex-direction:column;
    position:absolute;
    top:calc(100% - 1px);
    left:0;
    min-width:220px;
    margin:0;
    padding-top:8px;
    border:0;
    border-radius:0 0 10px 10px;
    background:transparent;
    box-shadow:none;
    overflow:visible;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(4px);
    transition:opacity .14s ease,transform .14s ease,visibility .14s ease;
    z-index:1100;
  }
  /* Invisible bridge keeps the hover path continuous between button and menu. */
  #diensten_hover .diensten_dropdown:before{
    content:"";
    position:absolute;
    top:-10px;
    left:0;
    width:100%;
    height:18px;
  }
  #diensten_hover .diensten_dropdown a{
    position:relative;
    z-index:1;
    background:#fff;
    border-left:1px solid var(--hs-line);
    border-right:1px solid var(--hs-line);
  }
  #diensten_hover .diensten_dropdown a:first-child{
    border-top:1px solid var(--hs-line);
    border-radius:10px 10px 0 0;
    box-shadow:0 -4px 18px rgba(55,48,41,.06);
  }
  #diensten_hover .diensten_dropdown a:last-child{
    border-bottom:1px solid var(--hs-line);
    border-radius:0 0 10px 10px;
    box-shadow:0 14px 30px rgba(55,48,41,.12);
  }
  #diensten_hover:hover .diensten_dropdown,
  #diensten_hover:focus-within .diensten_dropdown{
    display:flex!important;
    top:calc(100% - 1px)!important;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
  }
  /* Extra hit area below the trigger: no dead zone while moving into the submenu. */
  #diensten_hover::after{
    content:"";
    position:absolute;
    left:-10px;
    right:-10px;
    top:100%;
    height:14px;
    z-index:1099;
  }

}
.diensten_dropdown a{padding:12px 16px;font-size:14px;background:#fff}
.diensten_dropdown a:hover{background:var(--hs-green);color:#fff}
.menu_btn{width:44px;height:44px!important;border-radius:7px;overflow:hidden;align-items:center;justify-content:center;background:#f4f4f1}
.menu_btn img{width:100%;height:100%;object-fit:cover;object-position:center;margin:0!important;opacity:.75}

/* Hero */
.hm_slider{height:auto!important;padding-bottom:0!important;min-height:clamp(340px,36vw,570px);background-position:center;display:flex;align-items:center;overflow:hidden}
.hm_slider:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(29,26,23,.48),rgba(29,26,23,.16));z-index:0;pointer-events:none}
.hm_sl_box{position:relative!important;min-height:inherit;z-index:1}
.hm_sl_center{width:min(92%,1120px)!important;float:none!important}
.hm_sl_subtitel{font-size:clamp(18px,1.7vw,25px)!important;text-shadow:0 2px 18px rgba(0,0,0,.25)}
.hm_sl_titel{height:105px!important;font-size:clamp(34px,5.2vw,72px)!important;line-height:1}
.hm_sl_titel_i{font-size:clamp(38px,6vw,84px)!important;letter-spacing:1px;text-shadow:0 3px 24px rgba(0,0,0,.25)}
.hm_sl_titel_i_selected{font-size:clamp(42px,6.4vw,92px)!important}

/* Home */
.hm_box1_vp{margin-top:0!important;padding:82px 0 44px;z-index:5}
.hm_box1_vp .center_1{width:min(92%,1180px)!important;left:auto!important;float:none!important;margin:0 auto}
.hm_box1_vp .center_2{left:auto!important;float:none!important;display:flex;justify-content:center}
.hm_intro{float:none!important;width:min(100%,980px)!important;margin:0!important;align-items:center}
.hm_intro_titel{float:none!important;margin-bottom:8px}
.hm_intro_text{float:none!important;margin-top:10px!important;max-width:940px}
.hm_intro_text p{margin:0 0 16px}
.hm_vp_serv_fix{margin-top:32px!important;padding:64px 0 74px;background:var(--hs-soft)}
.hm_vp_serv_fix>.hm_intro_titel{padding:0 5%}
.hm_vp_serv{margin-top:36px!important}
.hm_serv_center{width:min(92%,1250px)!important;gap:22px;justify-content:center}
.hm_serv_i{width:calc(33.333% - 15px)!important;padding-bottom:26%!important;margin:0!important;border-radius:14px;box-shadow:0 12px 32px rgba(44,39,34,.12);isolation:isolate;transform:translateZ(0)}
.hm_serv_i:hover{box-shadow:0 18px 42px rgba(44,39,34,.18)!important;transform:translateY(-4px)}
.hm_serv_bg{inset:0!important;width:100%!important;height:100%!important;background:linear-gradient(to top,rgba(30,28,25,.86) 0%,rgba(30,28,25,.16) 70%)!important}
.hm_serv_content{bottom:0!important;height:auto!important;min-height:132px;padding:24px!important;width:100%!important;background:none!important;display:flex;flex-direction:column;justify-content:flex-end}
.hm_serv_i:hover .hm_serv_content{bottom:0!important}
.hm_serv_titel{text-align:left!important;font-size:22px!important}
.hm_serv_text{
  text-align:left!important;
  font-size:15px!important;
  line-height:1.6!important;
  font-weight:500!important;
  color:#fff!important;
  text-shadow:0 1px 3px rgba(0,0,0,.55);
  opacity:1!important;
}
.hm_serv_btn{margin-top:36px!important}
.hm_team_vp{width:min(92%,1250px)!important;margin:82px auto 0!important;float:none!important;border-radius:18px;overflow:hidden;background:#fff;box-shadow:var(--hs-shadow);align-items:stretch}
.hm_team_foto{width:52%!important;height:auto!important;min-height:430px;padding-bottom:0!important;background-image:url('../images/diensten/gyproc/gyproc_img3.jpg')!important;background-position:center!important}
.hm_team_content{width:48%!important;margin:0!important;padding:58px!important;background:#fff}
.hm_team_center{text-align:left!important}
.hm_team_btn{margin-top:24px!important}
.hm_vp_reviews{margin-top:90px!important;padding:70px 5%;background:var(--hs-brown-dark);display:flex;align-items:center;overflow:hidden}
.hm_greenswipe{opacity:.12}
.hm_revs_intro{width:32%!important;margin:0 5% 0 0!important;z-index:1}
.hm_revs_intro .titel_1,.hm_revs_intro .text_1{color:#fff}
.hm_revs_content{width:60%!important;margin:0!important;z-index:1}
.hm_end_vp{margin-top:76px!important}
.hm_end_center{width:min(92%,1250px)!important;gap:14px}
.hm_end_pic_1{border-radius:10px;overflow:hidden}
.hm_end_content{border-radius:10px;background:var(--hs-brown)!important}

/* Services / about content */
.ser_intro_vp{margin-top:0!important;padding:76px 0 52px}
.ser_intro_center{width:min(90%,850px)!important}
.serv_box_vp,.gyproc_intro{margin-top:0!important}
.serv_foto,.gyproc_intro_img{min-height:460px;height:auto!important;border-radius:0}
.serv_content{padding:48px 0}
.gyproc_intro_text{padding:64px!important}
.gyproc_intro_p p{width:100%!important;max-width:720px}
.gyproc_intro_img{background-image:url('../images/diensten/gyproc/gyproc_img3.jpg')!important;background-position:center!important}
.gyproc_intro_img.img2{background-image:url('../images/diensten/interieur/interieur_img1.jpg')!important;background-position:center!important}
.diensten_troeven_fix{padding:72px 0!important;background:var(--hs-soft)}
.serv_plus_center{width:min(92%,1200px)!important;gap:22px}
.serv_plus_i{background:#fff;border:1px solid var(--hs-line);border-radius:14px;padding:28px 18px;width:calc(25% - 17px)!important;box-shadow:0 8px 24px rgba(48,43,38,.05)}
.serv_plus_icon img{max-height:64px;width:auto}

/* Contact */
.contact{width:min(92%,1180px)!important;height:auto!important;margin:76px 0 20px;border-radius:18px;overflow:hidden;box-shadow:var(--hs-shadow);align-items:stretch!important;background:#fff}
.contact__info{width:35%!important;background:var(--hs-brown-dark)!important}
.contact__info__text{padding:56px 44px!important;align-items:flex-start!important;height:100%}
.contact__info__text h1{width:100%;text-align:left!important;color:#fff!important}
.contact__info__text p{width:100%;color:#fff!important;opacity:.96}
.contact__info__text a{color:#fff!important}
.contact__quick{width:100%;margin-top:22px;display:grid;gap:12px}
.contact__quick a{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border:1px solid rgba(255,255,255,.24);border-radius:9px;text-decoration:none;font-weight:600}
.contact__quick a:hover{background:var(--hs-green);border-color:var(--hs-green)}
.contact__owner{width:100%;margin-top:24px;padding-top:22px;border-top:1px solid rgba(255,255,255,.18);color:#fff;font-size:14px;line-height:1.6}
.contact__form{width:65%!important}
.contact__form__inhoud{padding:56px!important;width:100%!important}
.form-group{gap:16px}
.form-group-label{margin:10px 0!important}
input,textarea{width:100%!important;margin-top:7px!important;border:1px solid #d9d5ce!important;border-radius:8px!important;padding:13px 14px!important;background:#fff;outline:none;transition:border-color .2s,box-shadow .2s}
input:focus,textarea:focus{background:#fff!important;border-color:var(--hs-green)!important;box-shadow:0 0 0 4px rgba(147,193,39,.12)}
textarea{height:140px!important;resize:vertical}
.contact_map iframe{width:100%!important;height:390px!important;margin:0!important;display:block}

/* Footer */
.foot_vp{margin-top:82px!important;border-top:0!important;background:#f7f7f4!important;padding:20px 0}
.foot_center{width:min(92%,1250px)!important;padding:42px 0!important;gap:30px;align-items:flex-start}
.foot_logo{width:250px!important}
.foot_logo img{width:100%;height:auto}
.foot_col{width:270px!important}
.foot_map{flex:1}
.foot_map_col{width:25%!important}
.foot_titel,.foot_map_titel{font-size:20px!important;margin-bottom:10px}
.foot_line{font-size:14px!important;line-height:1.6}
.foot_devenox_logo{bottom:28px!important;opacity:.65}

@media (max-width:1100px){
  .header_menu{gap:0}
  .menu_item{padding:14px 10px!important;font-size:14px!important}
  .hm_serv_i{width:calc(50% - 12px)!important;padding-bottom:36%!important}
  .hm_team_vp{flex-direction:column}
  .hm_team_foto,.hm_team_content{width:100%!important}
  .hm_team_foto{min-height:380px}
  .hm_revs_intro,.hm_revs_content{width:100%!important;margin:0!important}
  .hm_vp_reviews{flex-direction:column;gap:40px}
  .serv_plus_center{flex-wrap:wrap}
  .serv_plus_i{width:calc(50% - 11px)!important}
}

@media (max-width:850px){
  .vp_header{position:fixed!important}
  .header{width:100%!important;padding:0 5%}
  .header_logo{width:145px!important;margin-left:0!important}
  .menu_btn{display:flex!important;right:5%!important;top:4px}
  .header_menu{position:absolute!important;top:64px!important;right:-110%!important;width:min(92vw,420px)!important;padding:10px!important;background:#fff!important;box-shadow:var(--hs-shadow);border-radius:12px;display:flex!important;flex-direction:column;align-items:stretch}
  .header_menu_show{right:4%!important}
  .menu_item{width:100%!important;padding:14px 16px!important;text-align:left!important}
  #diensten_hover{width:100%}
  .hm_slider{margin-top:64px!important;min-height:390px!important}
  .hm_sl_center{width:90%!important}
  .hm_box1_vp{padding:58px 0 28px}
  .hm_serv_i{width:100%!important;padding-bottom:58%!important}
  .hm_serv_content{min-height:120px}
  .hm_team_vp{margin-top:58px!important}
  .hm_team_content{padding:38px 28px!important}
  .hm_team_foto{min-height:300px!important}
  .hm_vp_reviews{margin-top:58px!important;padding:54px 6%}
  .hm_revs_center{width:100%!important;margin:0!important}
  .hm_revs_left,.hm_revs_right{display:none!important}
  .gyproc_intro,.reverse{flex-direction:column!important}
  .gyproc_intro_img,.gyproc_intro_text{width:100%!important}
  .gyproc_intro_img{min-height:360px!important}
  .gyproc_intro_text{padding:38px 7%!important;text-align:left!important}
  .serv_plus_i{width:100%!important}
  .contact{margin-top:120px;flex-direction:column}
  .contact__info,.contact__form{width:100%!important}
  .contact__info__text,.contact__form__inhoud{padding:38px 28px!important}
  .form-group{flex-direction:column;gap:0}
  .foot_center{flex-direction:column;align-items:center;text-align:center}
  .foot_col,.foot_map{width:100%!important}
  .foot_map_col{width:50%!important}
  .foot_devenox_logo{position:static!important;margin-top:12px}
}

@media (max-width:560px){
  .hm_slider{min-height:330px!important}
  .hm_sl_titel{height:80px!important}
  .hm_serv_i{padding-bottom:78%!important}
  .hm_serv_text{font-size:13px}
  .hm_team_foto{min-height:230px!important}
  .foot_map_col{width:100%!important}
}

@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}