
/* =========================================================
   Hoeve Studio v1.0
   Editorial / atelier concept - deliberately unlike Bisschop
   ========================================================= */
:root{
  --hs-blue:#29479a;
  --hs-blue-deep:#173171;
  --hs-sand:#cabd9a;
  --hs-cream:#f4f0e7;
  --hs-paper:#fbfaf7;
  --hs-ink:#161a21;
  --hs-muted:#6c717b;
  --hs-line:#dcdedc;
  --hs-max:1360px;
}
html{scroll-behavior:smooth}
body{
  margin:0!important;
  background:var(--hs-paper)!important;
  color:var(--hs-ink)!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:15px!important;
  line-height:1.55!important;
}
*{box-sizing:border-box}
#dd-main{background:none!important;min-width:0!important;width:100%!important}
.dd-nav,.dd-header{display:none!important}

.hs-shell{
  width:min(var(--hs-max),calc(100% - 36px));
  margin:18px auto 0;
  background:var(--hs-paper);
  border:1px solid #e5e3dc;
  box-shadow:0 22px 70px rgba(41,71,154,.08);
}

/* Header intentionally looks editorial rather than dealer-like */
.hs-header{
  position:sticky;top:0;z-index:20000;
  background:rgba(251,250,247,.97);
  border-bottom:1px solid #e5e3dc;
  backdrop-filter:blur(10px);
}
.hs-header-inner{
  height:88px;display:grid;grid-template-columns:230px 1fr auto;align-items:center;
  gap:30px;padding:0 32px;
}
.hs-brand img{display:block;max-width:215px;max-height:64px}
.hs-menu{height:100%;display:flex;align-items:center;justify-content:center}
.hs-menu ul,.hs-menu .menu{
  display:flex!important;align-items:center!important;justify-content:center!important;
  list-style:none!important;margin:0!important;padding:0!important;gap:4px!important
}
.hs-menu li{margin:0!important;padding:0!important}
.hs-menu a{
  display:block!important;padding:14px 12px!important;
  color:#2f3745!important;background:none!important;border:0!important;
  text-decoration:none!important;font-weight:700!important;font-size:13px!important;
  border-radius:999px!important
}
.hs-menu a:hover,.hs-menu li.active>a,.hs-menu li.current>a{
  color:var(--hs-blue)!important;background:#ece9df!important
}
.hs-header-contact a{
  display:inline-block;padding:10px 13px;border:1px solid var(--hs-blue);
  color:var(--hs-blue)!important;text-decoration:none!important;font-weight:800;font-size:12px
}
.hs-menu-toggle{display:none}

/* Asymmetrical intro, no full width hero */
.hs-home-intro{
  position:relative;
  display:grid;grid-template-columns:44% 56%;
  min-height:660px;
  background:var(--hs-cream);
}
.hs-intro-copy{
  position:relative;z-index:3;
  padding:92px 44px 54px 62px;
  display:flex;flex-direction:column;justify-content:center
}
.hs-overline{
  display:block;margin-bottom:24px;color:#8f7f58;
  font-size:11px;font-weight:900;letter-spacing:2px;text-transform:uppercase
}
.hs-intro-copy h1{
  margin:0 0 24px!important;
  color:var(--hs-ink)!important;
  font-family:Georgia,'Times New Roman',serif!important;
  font-size:clamp(48px,5vw,77px)!important;
  line-height:.98!important;letter-spacing:-3px!important;font-weight:400!important
}
.hs-intro-copy h1 em{
  color:var(--hs-blue)!important;font-style:italic!important;font-weight:400!important
}
.hs-intro-copy>p{
  max-width:500px;margin:0 0 30px!important;color:#555e69!important;
  font-size:17px!important;line-height:1.7!important
}
.hs-intro-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.hs-link-main{
  display:inline-flex;align-items:center;gap:24px;padding:15px 18px;
  background:var(--hs-blue);color:#fff!important;text-decoration:none!important;
  font-weight:800!important;font-size:13px
}
.hs-link-main span{font-size:19px}
.hs-link-main:hover{background:var(--hs-blue-deep)}
.hs-link-sub{
  color:var(--hs-blue)!important;text-decoration:none!important;
  border-bottom:1px solid #9fadd3;padding-bottom:3px;font-weight:700!important
}
.hs-mini-facts{
  display:grid;grid-template-columns:1fr 1fr;gap:22px;
  margin-top:64px;padding-top:22px;border-top:1px solid #d8d2c4
}
.hs-mini-facts strong,.hs-mini-facts small{display:block}
.hs-mini-facts strong{font-size:13px;color:#313946}
.hs-mini-facts small{margin-top:3px;color:#858078;font-size:11px}

/* Visual is a framed image deck, not a hero background */
.hs-visual{position:relative;min-height:660px;overflow:hidden;background:#e8e4da}
.hs-blue-panel{
  position:absolute;right:0;top:0;width:30%;height:100%;
  background:var(--hs-blue)
}
.hs-slider{
  position:absolute;z-index:2;left:7%;top:8%;width:79%;height:77%;
  box-shadow:0 24px 65px rgba(19,38,91,.24);overflow:hidden;background:#ddd
}
.hs-slide{
  position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1s ease;
}
.hs-slide.is-active{opacity:1}
.hs-slide img{width:100%;height:100%;object-fit:cover;object-position:center 55%}
.hs-image-label{
  position:absolute;z-index:4;left:2%;bottom:8%;padding:16px 19px;
  background:var(--hs-paper);border-left:4px solid var(--hs-sand)
}
.hs-image-label span,.hs-image-label strong{display:block}
.hs-image-label span{font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:#968257}
.hs-image-label strong{margin-top:4px;font-family:Georgia,serif;font-size:20px;font-weight:400}
.hs-slider-nav{
  position:absolute;z-index:5;right:4%;bottom:7%;
  display:flex;align-items:center;gap:10px;background:var(--hs-blue);color:#fff;padding:8px
}
.hs-slider-nav button{
  width:38px;height:36px;border:1px solid rgba(255,255,255,.35);background:transparent;color:#fff;
  cursor:pointer;font-size:18px
}
.hs-counter{min-width:62px;text-align:center;font-size:11px;letter-spacing:1px}
.hs-counter b{color:var(--hs-sand)}

/* Ribbon feels like magazine index */
.hs-ribbon{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #e5e3dc;border-bottom:1px solid #e5e3dc;background:#fff}
.hs-ribbon a{
  min-height:132px;padding:26px 24px;text-decoration:none!important;
  border-right:1px solid #e5e3dc;transition:.2s ease
}
.hs-ribbon a:last-child{border-right:0}
.hs-ribbon a:hover{background:var(--hs-blue);transform:translateY(-3px)}
.hs-ribbon small,.hs-ribbon strong,.hs-ribbon span{display:block}
.hs-ribbon small{color:#a6915e;font-size:10px;font-weight:900;letter-spacing:1.4px}
.hs-ribbon strong{margin-top:12px;color:var(--hs-ink)!important;font-family:Georgia,serif;font-size:22px;font-weight:400}
.hs-ribbon span{margin-top:6px;color:#7c8189;font-size:12px}
.hs-ribbon a:hover strong,.hs-ribbon a:hover span{color:#fff!important}

/* inner pages */
.hs-page-intro{
  min-height:250px;display:flex;align-items:end;justify-content:space-between;
  padding:58px 62px 38px;background:var(--hs-blue);color:#fff;overflow:hidden
}
.hs-page-intro h1{
  margin:0!important;color:#fff!important;font-family:Georgia,serif!important;
  font-size:58px!important;font-weight:400!important;letter-spacing:-2px!important
}
.hs-page-intro .hs-overline{color:#dfd1ac;margin-bottom:12px}
.hs-page-mark{
  font:italic 120px/1 Georgia,serif;color:rgba(255,255,255,.08);transform:translateY(20px)
}

/* Main content is editorial and flat, not card-heavy */
.dd-sheet{
  width:100%!important;min-width:0!important;max-width:none!important;
  margin:0!important;padding:0!important;background:transparent!important;box-shadow:none!important
}
.dd-sheet:before,.dd-sheet:after{display:none!important}
.dd-layout-wrapper{padding:54px 58px 68px!important;background:var(--hs-paper)!important}
.dd-content-layout-row{
  display:grid!important;grid-template-columns:210px minmax(0,1fr)!important;gap:54px!important;
  align-items:start!important;background:none!important
}
.dd-layout-cell.dd-sidebar1{
  width:auto!important;min-width:0!important;padding:0!important;background:none!important
}
.dd-layout-cell.dd-content{
  width:auto!important;min-width:0!important;padding:0!important;
  background:none!important;border:0!important;box-shadow:none!important
}

/* Sidebar as a thin editorial index */
.dd-sidebar1 .dd-block{
  margin:0 0 22px!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important
}
.dd-sidebar1 .dd-blockheader{
  margin:0 0 12px!important;padding:0 0 10px!important;background:none!important;color:var(--hs-blue)!important;
  border-bottom:2px solid var(--hs-blue)!important;font-size:11px!important;letter-spacing:1px!important;text-transform:uppercase
}
.dd-sidebar1 .dd-blockcontent{padding:0!important;background:none!important}
.dd-sidebar1 ul{list-style:none!important;margin:0!important;padding:0!important}
.dd-sidebar1 li a{
  display:block!important;padding:9px 0!important;border-bottom:1px solid #e4e2dd!important;
  color:#4b5360!important;background:none!important;text-decoration:none!important;font-size:12px!important;font-weight:700!important
}
.dd-sidebar1 li.active>a,.dd-sidebar1 li.current>a,.dd-sidebar1 li a:hover{
  color:var(--hs-blue)!important;padding-left:8px!important
}

/* Existing content gets spacious editorial treatment */
.dd-content h1,.dd-content h2,.dd-content h3{
  color:var(--hs-blue)!important;font-family:Georgia,'Times New Roman',serif!important;font-weight:400!important
}
.dd-content h1{font-size:42px!important;letter-spacing:-1.5px!important}
.dd-content h2{font-size:29px!important}
.dd-content h3{font-size:21px!important}
.dd-content p{line-height:1.72!important}
.dd-content a{color:var(--hs-blue)!important}
.hoeve-welkom .hw-intro,
.hoeve-motoren .hm-motor-intro,
.hoeve-scooters .hs-intro,
.hoeve-banden .hb-intro,
.hoeve-nieuwsbrief .hn-intro,
.hoeve-contact .hc-intro,
.hoeve-nieuws .hnieuws-intro{
  background:#fff!important;border:1px solid #e3e0d9!important;border-left:0!important;border-top:0!important;
  border-radius:0!important;box-shadow:none!important;padding:28px 30px!important
}
.hoeve-welkom .hw-promo{
  background:var(--hs-blue)!important;border-radius:0!important
}

/* footer is cream/blue split instead of dark dealer footer */
.dd-footer{
  margin:0!important;padding:46px 58px 22px!important;
  background:#e9e3d5!important;color:#454b54!important;border-top:1px solid #d5cebd!important
}
.dd-footer a{color:var(--hs-blue)!important}
.dd-footer p{color:#5b5e63!important}
#toTop{background:var(--hs-blue)!important;border-radius:0!important}

/* responsive */
@media(max-width:940px){
  .hs-header-inner{grid-template-columns:190px 1fr auto}
  .hs-header-contact{display:none}
  .hs-menu-toggle{
    display:flex!important;justify-self:end;width:52px;height:46px;align-items:center;justify-content:center;
    flex-direction:column;gap:6px;border:1px solid #d7d4ca;background:transparent
  }
  .hs-menu-toggle span{display:block;width:23px;height:2px;background:var(--hs-blue)}
  .hs-menu-toggle b{display:none}
  .hs-menu{
    display:none;position:absolute;top:88px;left:0;right:0;background:var(--hs-paper);
    border-top:1px solid #e5e3dc;box-shadow:0 16px 30px rgba(29,54,120,.1)
  }
  .hs-menu.is-open{display:block}
  .hs-menu ul,.hs-menu .menu{display:block!important}
  .hs-menu a{padding:13px 24px!important;border-bottom:1px solid #e5e3dc!important;border-radius:0!important}
  .hs-home-intro{grid-template-columns:1fr}
  .hs-intro-copy{padding:62px 42px 34px}
  .hs-visual{min-height:530px}
  .hs-slider{left:9%;top:8%;width:77%;height:74%}
  .hs-ribbon{grid-template-columns:1fr 1fr}
  .hs-ribbon a:nth-child(2){border-right:0}
  .hs-ribbon a:nth-child(-n+2){border-bottom:1px solid #e5e3dc}
  .dd-content-layout-row{grid-template-columns:1fr!important}
  .dd-sidebar1{display:none!important}
  .dd-layout-wrapper{padding:36px 34px 50px!important}
}
@media(max-width:600px){
  .hs-shell{width:100%;margin:0;border-left:0;border-right:0;box-shadow:none}
  .hs-header-inner{height:72px;grid-template-columns:165px 1fr;padding:0 16px}
  .hs-brand img{max-width:160px;max-height:55px}
  .hs-menu{top:72px}
  .hs-intro-copy{padding:46px 24px 30px}
  .hs-intro-copy h1{font-size:45px!important;letter-spacing:-2px!important}
  .hs-mini-facts{grid-template-columns:1fr;margin-top:38px}
  .hs-visual{min-height:420px}
  .hs-slider{left:6%;top:7%;width:84%;height:72%}
  .hs-blue-panel{width:26%}
  .hs-image-label{left:3%;bottom:7%;padding:11px 13px}
  .hs-image-label strong{font-size:16px}
  .hs-slider-nav{right:3%;bottom:6%}
  .hs-ribbon{grid-template-columns:1fr}
  .hs-ribbon a{border-right:0;border-bottom:1px solid #e5e3dc}
  .hs-page-intro{min-height:190px;padding:38px 24px 24px}
  .hs-page-intro h1{font-size:38px!important}
  .hs-page-mark{display:none}
  .dd-layout-wrapper{padding:25px 20px 40px!important}
  .dd-content h1{font-size:32px!important}
  .dd-footer{padding:34px 24px 20px!important}
}
