.sgh{--petrol:#00444F; --petrol-2:#0b5a66; --lime:#9FC63B; --lime-soft:#eef6dc;
  --ink:#12212f; --mut:#5d7285; --line:#dde5e7; --soft:#f4f8f8; --paper:#ffffff; --on-petrol:#9fc9c9;
  --f-display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --f-body:"Figtree", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --r:14px; --gut:clamp(16px,4vw,48px); --max:1240px;
  color-scheme:light;}
.sgh, .sgh *{box-sizing:border-box}
.sgh-home{margin:0;background:var(--soft);color:var(--ink);font:400 16px/1.55 var(--f-body)}
.sgh a{color:inherit}
.sgh img{max-width:100%;display:block}
.sgh .wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.sgh .label{font:700 11.5px/1 var(--f-body);letter-spacing:.7px;text-transform:uppercase;color:var(--petrol)}
.sgh h1,.sgh h2,.sgh h3{font-family:var(--f-display);text-wrap:balance;margin:0;letter-spacing:-.01em}
.sgh :focus-visible{outline:3px solid var(--lime);outline-offset:2px;border-radius:6px}
.sgh .proto{background:var(--lime);color:var(--petrol);text-align:center;font:700 12px/1.3 var(--f-body);padding:6px 16px;letter-spacing:.3px}
.sgh .topbar{background:var(--petrol);color:var(--on-petrol);font-size:13px}
.sgh .topbar .wrap{display:flex;gap:24px;justify-content:space-between;flex-wrap:wrap;padding-block:8px}
.sgh .topbar b{color:#fff;font-weight:600}
.sgh .topbar span{display:inline-flex;gap:8px;align-items:center}
.sgh .dot{width:7px;height:7px;border-radius:50%;background:var(--lime);display:inline-block}
.sgh header.site{background:var(--paper);border-bottom:5px solid var(--lime);position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
.sgh .hrow{display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;padding-block:14px}
.sgh .logo img{height:44px;width:auto}
.sgh .search{display:flex;background:var(--soft);border:1.5px solid var(--line);border-radius:999px;overflow:hidden;min-width:0}
.sgh .search input{flex:1;min-width:0;border:0;background:transparent;padding:11px 18px;font:500 15px var(--f-body);color:var(--ink)}
.sgh .search input:focus{outline:none}
.sgh .search:focus-within{border-color:var(--petrol)}
.sgh .search button{border:0;background:var(--petrol);color:#fff;padding:0 20px;font:600 14px var(--f-body);cursor:pointer}
.sgh .search-hit{grid-column:1/-1;font-size:13px;color:var(--mut);margin-top:-6px}
.sgh .search-hit a{color:var(--petrol);font-weight:600}
.sgh .icons{display:flex;gap:6px}
.sgh .icons a{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;color:var(--petrol);position:relative}
.sgh .icons a:hover{background:var(--soft)}
.sgh .icons svg{width:22px;height:22px}
.sgh .badge{position:absolute;top:4px;right:2px;background:var(--lime);color:var(--petrol);font:800 10px/16px var(--f-body);min-width:16px;border-radius:8px;text-align:center}
.sgh nav.cats{border-top:1px solid var(--line)}
.sgh nav.cats ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.sgh nav.cats a{display:block;padding:12px 14px;font:600 14.5px var(--f-body);text-decoration:none;white-space:nowrap;color:var(--ink);border-bottom:3px solid transparent;margin-bottom:-1px}
.sgh nav.cats a:hover{color:var(--petrol);border-color:var(--petrol)}
.sgh nav.cats .hot a{color:var(--petrol)}
.sgh nav.cats .hot a::before{content:"";display:inline-block;width:8px;height:8px;border-radius:2px;background:var(--lime);margin-right:7px;vertical-align:1px}
.sgh .hero{background:var(--paper)}
.sgh .hero .wrap{display:grid;grid-template-columns:1.02fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;padding-block:clamp(28px,5vw,64px)}
.sgh .hero h1{font-size:clamp(34px,5.2vw,62px);line-height:1.02;font-weight:800;color:var(--petrol);margin-top:14px}
.sgh .hero h1 em{font-style:normal;background:linear-gradient(transparent 62%,var(--lime) 62% 92%,transparent 92%)}
.sgh .hero p.lead{font-size:clamp(16px,1.5vw,18.5px);color:var(--mut);max-width:34em;margin:18px 0 26px}
.sgh .ctas{display:flex;gap:12px;flex-wrap:wrap}
.sgh .btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:999px;font:700 15px var(--f-body);text-decoration:none;border:2px solid var(--petrol);cursor:pointer;transition:transform .15s,background .15s}
.sgh .btn:hover{transform:translateY(-2px)}
.sgh .btn.primary{background:var(--petrol);color:#fff}
.sgh .btn.ghost{background:transparent;color:var(--petrol)}
.sgh .btn.lime{background:var(--lime);border-color:var(--lime);color:var(--petrol)}
.sgh .facts{display:flex;gap:28px;flex-wrap:wrap;margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.sgh .facts div{display:grid;gap:2px}
.sgh .facts strong{font:800 24px/1 var(--f-display);color:var(--petrol);font-variant-numeric:tabular-nums}
.sgh .facts span{font-size:13px;color:var(--mut)}
.sgh .hero-media{position:relative}
.sgh .hero-media img{border-radius:22px;aspect-ratio:4/3;object-fit:cover;width:100%;box-shadow:0 30px 60px -30px rgba(0,68,79,.45)}
.sgh .tagcard{position:absolute;left:-18px;bottom:22px;background:var(--paper);border-radius:12px;padding:12px 14px;box-shadow:0 12px 30px -12px rgba(18,33,47,.35);display:grid;gap:4px;max-width:270px}
.sgh .tagcard code{font:600 12px/1.2 ui-monospace,"Cascadia Code",Consolas,monospace;color:var(--petrol);background:var(--lime-soft);padding:3px 6px;border-radius:5px;justify-self:start}
.sgh .tagcard small{color:var(--mut);font-size:12.5px}
.sgh .ai-chip{position:absolute;top:16px;right:16px;background:rgba(0,68,79,.88);color:#fff;font:600 12px/1 var(--f-body);padding:8px 12px;border-radius:999px;backdrop-filter:blur(4px)}
.sgh .ai-chip::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--lime);margin-right:7px}
.sgh section{padding-block:clamp(44px,6vw,80px)}
.sgh .shead{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:28px}
.sgh .shead h2{font-size:clamp(26px,3.2vw,38px);font-weight:800;color:var(--petrol);margin-top:8px}
.sgh .shead a{font:700 14px var(--f-body);color:var(--petrol);text-decoration:none;border-bottom:2px solid var(--lime)}
.sgh .catgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.sgh .cat{background:var(--paper);border-radius:var(--r);text-decoration:none;overflow:hidden;display:grid;grid-template-rows:auto 1fr;border:1px solid var(--line);transition:border-color .15s,transform .15s}
.sgh .cat:hover{border-color:var(--petrol);transform:translateY(-3px)}
.sgh .cat img{aspect-ratio:1;object-fit:cover;width:100%;background:var(--soft)}
.sgh .cat span{padding:12px 14px;font:700 15px var(--f-body);display:flex;justify-content:space-between;align-items:center}
.sgh .cat span::after{content:"→";color:var(--lime);font-weight:800}
.sgh .cat.wide{grid-column:span 2;position:relative}
.sgh .cat.wide img{aspect-ratio:2/1}
.sgh .studio{background:var(--petrol);color:#fff;position:relative;overflow:hidden}
.sgh .studio .wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(24px,4vw,56px);align-items:center}
.sgh .studio .label{color:var(--lime)}
.sgh .studio h2{font-size:clamp(28px,3.6vw,44px);font-weight:800;margin:10px 0 14px;line-height:1.05}
.sgh .studio p{color:var(--on-petrol);max-width:30em;margin:0 0 22px}
.sgh .swatches{display:grid;gap:8px;margin-bottom:24px}
.sgh .sw{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:center;background:rgba(255,255,255,.06);border:1.5px solid transparent;border-radius:12px;padding:10px 12px;color:#fff;text-align:left;font:600 15px var(--f-body);cursor:pointer;transition:background .15s,border-color .15s}
.sgh .sw:hover{background:rgba(255,255,255,.11)}
.sgh .sw[aria-pressed="true"]{border-color:var(--lime);background:rgba(159,198,59,.12)}
.sgh .sw i{width:34px;height:34px;border-radius:8px;box-shadow:inset 0 0 0 2px rgba(255,255,255,.25)}
.sgh .sw small{display:block;color:var(--on-petrol);font-weight:500;font-size:12.5px}
.sgh .sw em{font:600 11.5px ui-monospace,Consolas,monospace;font-style:normal;color:var(--lime)}
.sgh .stage{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:4/3;background:var(--petrol-2)}
.sgh .stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s}
.sgh .stage img.on{opacity:1}
.sgh .stage figcaption{position:absolute;left:14px;right:14px;bottom:14px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:end}
.sgh .stage code{background:rgba(0,0,0,.55);color:#fff;font:600 12px/1.2 ui-monospace,Consolas,monospace;padding:7px 10px;border-radius:8px;backdrop-filter:blur(4px)}
.sgh .stage .ai-chip{position:static}
.sgh .compare{display:flex;gap:10px;align-items:center;margin-top:14px;color:var(--on-petrol);font-size:13px}
.sgh .compare b{color:#fff}
.sgh .pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.sgh .prod{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:grid;grid-template-rows:auto 1fr;text-decoration:none;transition:border-color .15s}
.sgh .prod:hover{border-color:var(--petrol)}
.sgh .prod .ph{background:#fff;aspect-ratio:1;display:grid;place-items:center;padding:18px}
.sgh .prod .ph img{max-height:100%;object-fit:contain}
.sgh .prod .pb{padding:14px 16px 16px;display:grid;gap:6px;align-content:start;border-top:1px solid var(--line)}
.sgh .prod .pc{font:700 11px/1 var(--f-body);letter-spacing:.6px;text-transform:uppercase;color:var(--mut)}
.sgh .prod h3{font:600 15px/1.35 var(--f-body);letter-spacing:0;min-height:2.7em}
.sgh .prod .row{display:flex;justify-content:space-between;align-items:center;margin-top:4px}
.sgh .price{font:800 20px/1 var(--f-display);color:var(--petrol);font-variant-numeric:tabular-nums}
.sgh .price small{display:block;font:500 11.5px var(--f-body);color:var(--mut);margin-top:4px}
.sgh .add{width:40px;height:40px;border-radius:50%;border:0;background:var(--lime);color:var(--petrol);font:800 22px/1 var(--f-body);cursor:pointer}
.sgh .add.done{background:var(--petrol);color:#fff;font-size:16px}
.sgh .promise{background:var(--paper)}
.sgh .pgrid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.sgh .pr{padding:22px;border-radius:var(--r);background:var(--soft);display:grid;gap:10px;align-content:start}
.sgh .pr svg{width:34px;height:34px;color:var(--petrol)}
.sgh .pr h3{font:800 19px/1.2 var(--f-display);color:var(--petrol)}
.sgh .pr p{margin:0;color:var(--mut);font-size:15px}
.sgh .showroom{margin-top:22px;background:var(--lime-soft);border-radius:var(--r);padding:22px 24px;display:flex;gap:20px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.sgh .showroom h3{font:800 22px var(--f-display);color:var(--petrol)}
.sgh .showroom p{margin:4px 0 0;color:var(--ink)}
.sgh footer{background:var(--petrol);color:var(--on-petrol);border-top:5px solid var(--lime);font-size:14.5px}
.sgh footer .wrap{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:28px;padding-block:44px}
.sgh footer h4{color:#fff;font:700 13px var(--f-body);letter-spacing:.7px;text-transform:uppercase;margin:0 0 12px}
.sgh footer ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.sgh footer a{text-decoration:none}
.sgh footer a:hover{color:#fff}
.sgh footer .legal{grid-column:1/-1;border-top:1px solid rgba(159,201,201,.25);padding-top:18px;font-size:12.5px;display:flex;gap:18px;flex-wrap:wrap}
.sgh .flogo{background:#fff;border-radius:10px;padding:8px 12px;display:inline-block;margin-bottom:14px}
.sgh .flogo img{height:34px;width:auto}
.sgh.sgh-guide{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:99990;display:flex;align-items:flex-end;gap:6px;pointer-events:none}
.sgh.sgh-guide>*{pointer-events:auto}
.sgh .bubble{background:var(--paper);border:2px solid var(--petrol);border-radius:18px 18px 4px 18px;padding:14px 16px 12px;width:min(310px,calc(100vw - 150px));box-shadow:0 18px 40px -16px rgba(0,68,79,.5);margin-bottom:70px;position:relative;transform-origin:bottom right;animation:sgh-pop .28s ease-out}
.sgh .bubble .who{font:800 12px/1 var(--f-body);letter-spacing:.6px;text-transform:uppercase;color:var(--petrol);display:flex;gap:6px;align-items:center;margin-bottom:6px}
.sgh .bubble .who::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--lime)}
.sgh .bubble p{margin:0;font:500 15px/1.45 var(--f-body);color:var(--ink);min-height:2.9em}
.sgh .bubble .bctl{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:8px}
.sgh .bubble .steps{display:flex;gap:4px}
.sgh .bubble .steps i{width:6px;height:6px;border-radius:50%;background:var(--line)}
.sgh .bubble .steps i.on{background:var(--petrol)}
.sgh .bubble button.next{border:0;background:var(--petrol);color:#fff;font:700 13px var(--f-body);padding:8px 14px;border-radius:999px;cursor:pointer}
.sgh .bubble button.x{position:absolute;top:6px;right:8px;border:0;background:transparent;color:var(--mut);font:700 18px/1 var(--f-body);cursor:pointer;padding:4px}
.sgh .duo{display:flex;align-items:flex-end;gap:0;height:150px}
.sgh .duo img{height:100%;width:auto;filter:drop-shadow(0 10px 12px rgba(0,0,0,.25));transition:transform .3s,filter .3s,opacity .3s;transform-origin:bottom center}
.sgh .duo img.m{height:150px}
.sgh .duo img.b{height:128px;margin-left:-18px}
.sgh .duo img.idle{opacity:.55;transform:scale(.92);filter:grayscale(.3) drop-shadow(0 6px 8px rgba(0,0,0,.2))}
.sgh .duo img.talk{animation:sgh-talk .5s ease-out}
.sgh.sgh-guide.min .bubble{display:none}
.sgh.sgh-guide.min .duo{height:84px;cursor:pointer}
.sgh.sgh-guide.min .duo img.m{height:84px}
.sgh.sgh-guide.min .duo img.b{height:72px}
.sgh .helpchip{display:none;background:var(--lime);color:var(--petrol);font:800 12px var(--f-body);padding:7px 11px;border-radius:999px;margin-bottom:58px;border:0;cursor:pointer}
.sgh.sgh-guide.min .helpchip{display:block}
@keyframes sgh-pop{from{opacity:0;transform:scale(.85) translateY(8px)}to{opacity:1;transform:none}}
@keyframes sgh-talk{0%{transform:translateY(0)}35%{transform:translateY(-10px) rotate(-2deg)}70%{transform:translateY(0) rotate(1deg)}100%{transform:none}}
@media (max-width:900px){.sgh .hero .wrap,.sgh .studio .wrap{grid-template-columns:1fr}
.sgh .pgrid4{grid-template-columns:repeat(2,minmax(0,1fr))}
.sgh footer .wrap{grid-template-columns:1fr 1fr}
.sgh .tagcard{left:10px}

}
@media (max-width:640px){.sgh .hrow{grid-template-columns:auto auto;gap:12px}
.sgh .hrow .search{grid-column:1/-1;order:3}
.sgh .logo img{height:36px}
.sgh .cat.wide{grid-column:span 1}
.sgh .cat.wide img{aspect-ratio:1}
.sgh .catgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.sgh .pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.sgh .prod h3{font-size:14px}
.sgh .pgrid4{grid-template-columns:1fr}
.sgh footer .wrap{grid-template-columns:1fr}
.sgh .duo{height:110px}
.sgh .duo img.m{height:110px}
.sgh .duo img.b{height:94px}
.sgh .bubble{margin-bottom:54px;width:min(260px,calc(100vw - 120px))}
.sgh .bubble p{font-size:14px}
.sgh .topbar .wrap span:nth-child(n+2){display:none}

}
@media (prefers-reduced-motion:reduce){.sgh, .sgh *{animation:none!important;transition:none!important}
}


/* theme-reset binnen .sgh */
.sgh-home{font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
.sgh h1,.sgh h2,.sgh h3,.sgh h4,.sgh p,.sgh ul,.sgh figure{margin:0}
.sgh p.lead{margin:18px 0 26px}.sgh .studio p{margin:0 0 22px}
.sgh img{height:auto}
.sgh button{text-transform:none;letter-spacing:normal;box-shadow:none;min-height:0}
.sgh a{text-decoration:none}
.sgh .prod{display:grid;grid-template-rows:auto 1fr}
.sgh .prod h3 a{color:var(--ink)}
.sgh .prod .ph{display:grid}
.sgh .add{display:grid;place-items:center;text-decoration:none}
.sgh .add.loading{opacity:.5}
.sgh .add.added{background:var(--petrol);color:#fff;font-size:16px}
.sgh .added_to_cart{display:none!important}
.sgh .price del{color:var(--mut);font-size:13px;font-weight:500;margin-right:6px}
.sgh .price ins{text-decoration:none}
.sgh .price .woocommerce-price-suffix{display:none}
.sgh.sgh-guide{font-family:var(--f-body)}
.sgh.sgh-guide img{max-width:none}

/* v1.3: gids "Niet meer tonen" + banda laten plaatsen (home en shop) */
.sgh .bubble .offlink{display:block;margin:8px 0 0;padding:0;border:0;background:none;color:var(--mut);font:600 12px var(--f-body);text-decoration:underline;cursor:pointer}
.sgh .bubble .offlink:hover{color:var(--petrol)}
.sgh .prefoot{background:var(--lime-soft);border-top:1px solid var(--line)}
.sgh .prefoot .wrap{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;padding-block:28px}
.sgh .prefoot img{height:96px;width:auto}
.sgh .prefoot h3{font:800 clamp(22px,2.4vw,28px)/1.1 var(--f-display);color:var(--petrol);margin:0 0 6px}
.sgh .prefoot p{margin:0;color:var(--ink);max-width:46em}
.sgh .prefoot .cta{display:flex;gap:10px;flex-wrap:wrap}
.sgh footer .tipsline{background:none;border:0;padding:0;color:inherit;font:inherit;text-decoration:underline;cursor:pointer}
@media (max-width:760px){.sgh .prefoot .wrap{grid-template-columns:1fr}.sgh .prefoot img{display:none}}
@media (max-width:640px){
  .sgh .topbar{font-size:12px}
  .sgh .topbar span{white-space:nowrap}
  .sgh.sgh-guide.min .helpchip{display:none}
  .sgh.sgh-guide.min .duo{height:64px}
  .sgh.sgh-guide.min .duo img.m{height:64px}.sgh.sgh-guide.min .duo img.b{height:56px}
}

/* v1.4: cookiekeuze + prijs op aanvraag */
.sgh.sgh-cookie{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:99995;max-width:560px;background:#fff;border:2px solid var(--petrol);border-radius:16px;padding:14px 16px;box-shadow:0 18px 40px -16px rgba(0,68,79,.5);font:500 14px/1.45 var(--f-body);color:var(--ink)}
.sgh.sgh-cookie p{margin:0 0 10px}
.sgh.sgh-cookie a{color:var(--petrol);font-weight:700}
.sgh.sgh-cookie .ck-btns{display:flex;gap:8px;flex-wrap:wrap}
.sgh.sgh-cookie button{flex:1;min-width:140px;border-radius:999px;padding:11px 14px;font:700 14px var(--f-body);cursor:pointer;border:2px solid var(--petrol)}
.sgh.sgh-cookie .ck-no{background:#fff;color:var(--petrol)}
.sgh.sgh-cookie .ck-yes{background:var(--petrol);color:#fff}
.sgh-op-aanvraag{font:700 15px "Figtree",sans-serif;color:#5d7285}
.sgh.sgh-maatwerk{max-width:1200px;margin:12px auto;padding:10px 14px;border-left:4px solid var(--lime);background:var(--lime-soft);border-radius:10px;font:500 14px/1.45 var(--f-body);color:var(--ink)}

/* v1.5: keuzehulp */
html.sgh-kh-on{overflow:hidden}
.sgh.sgh-kh{position:fixed;inset:0;z-index:99998;display:grid;place-items:center;padding:16px}
.sgh.sgh-kh[hidden]{display:none}
.sgh-kh .kh-back{position:absolute;inset:0;background:rgba(0,40,46,.55)}
.sgh-kh .kh-panel{position:relative;width:min(760px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#fff;border-radius:20px;border-top:6px solid var(--lime);padding:22px 22px 18px;box-shadow:0 30px 70px -20px rgba(0,0,0,.45);font-family:var(--f-body);color:var(--ink)}
.sgh-kh .kh-x{position:absolute;top:10px;right:12px;width:36px;height:36px;border-radius:50%;border:0;background:var(--soft);color:var(--petrol);font:800 22px/1 var(--f-body);cursor:pointer}
.sgh-kh .kh-head{display:flex;gap:14px;align-items:flex-end;padding-right:40px}
.sgh-kh .kh-face{width:74px;height:96px;object-fit:contain;object-position:bottom;flex:none}
.sgh-kh .kh-who{font:800 12px var(--f-body);letter-spacing:.6px;text-transform:uppercase;color:var(--petrol)}
.sgh-kh .kh-say{margin:4px 0 6px;background:var(--soft);border-radius:14px 14px 14px 4px;padding:10px 14px;font:600 16px/1.4 var(--f-body)}
.sgh-kh .kh-steps{display:flex;gap:6px;margin:14px 0}
.sgh-kh .kh-steps i{flex:1;height:5px;border-radius:3px;background:var(--line)}
.sgh-kh .kh-steps i.on{background:var(--lime)}
.sgh-kh .kh-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.sgh-kh .kh-opts button{border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:14px;font:700 15px var(--f-body);color:var(--ink);cursor:pointer;text-align:left;transition:border-color .15s,background .15s}
.sgh-kh .kh-opts button:hover,.sgh-kh .kh-opts button:focus-visible{border-color:var(--petrol);background:var(--lime-soft)}
.sgh-kh .kh-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.sgh-kh .kh-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;display:grid}
.sgh-kh .kh-card>a{color:var(--ink);text-decoration:none;display:grid}
.sgh-kh .kh-card img{aspect-ratio:1;object-fit:contain;width:100%;background:#fff;padding:8px}
.sgh-kh .kh-card span{font:600 13px/1.3 var(--f-body);padding:0 10px;min-height:3.9em}
.sgh-kh .kh-row{display:flex;justify-content:space-between;align-items:center;padding:6px 10px 10px}
.sgh-kh .kh-row b{font:800 15px var(--f-display);color:var(--petrol)}
.sgh-kh .kh-add{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--lime);color:var(--petrol)!important;font:800 18px/1 var(--f-body);text-decoration:none}
.sgh-kh .kh-add.added{background:var(--petrol);color:#fff!important}
.sgh-kh .added_to_cart{display:none!important}
.sgh-kh .kh-foot{display:flex;justify-content:space-between;gap:10px;margin-top:14px;flex-wrap:wrap}
.sgh-kh .kh-again{border:0;background:none;color:var(--mut);font:600 14px var(--f-body);text-decoration:underline;cursor:pointer}
.sgh-kh .kh-more{background:var(--petrol);color:#fff!important;border-radius:999px;padding:11px 18px;font:700 14px var(--f-body);text-decoration:none}
.sgh-kh .kh-load{display:flex;gap:8px;justify-content:center;padding:40px}
.sgh-kh .kh-load span{width:10px;height:10px;border-radius:50%;background:var(--lime);animation:sgh-dot 1s infinite alternate}
.sgh-kh .kh-load span:nth-child(2){animation-delay:.2s}.sgh-kh .kh-load span:nth-child(3){animation-delay:.4s}
@keyframes sgh-dot{to{transform:translateY(-8px);opacity:.5}}
.sgh-kh .kh-empty{padding:20px;text-align:center}
.sgh .kh-ban{justify-self:start;border:0;border-radius:999px;background:var(--lime);color:var(--petrol);font:700 14px var(--f-body);padding:9px 16px;cursor:pointer}
.sgh nav.cats .kh a{color:var(--petrol)}
@media (max-width:640px){.sgh-kh .kh-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sgh-kh .kh-panel{padding:18px 14px}.sgh-kh .kh-face{width:56px;height:72px}.sgh-kh .kh-say{font-size:15px}}

/* v1.6: moodboards */
.sgh.sgh-mb{max-width:1240px;margin:0 auto;padding:clamp(24px,4vw,48px) var(--gut);font-family:var(--f-body);color:var(--ink)}
.sgh-mb .mb-intro h1{font:800 clamp(34px,5vw,56px)/1 var(--f-display);color:var(--petrol);margin:8px 0 10px}
.sgh-mb .mb-intro p{color:var(--mut);max-width:40em;margin:0 0 16px;font-size:17px}
.sgh-mb .mb-nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
.sgh-mb .mb-nav a{border:1.5px solid var(--line);border-radius:999px;padding:8px 14px;font:700 14px var(--f-body);color:var(--petrol);text-decoration:none;background:#fff}
.sgh-mb .mb-nav a:hover{border-color:var(--petrol);background:var(--lime-soft)}
.sgh-mb .mb-board{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(18px,3vw,36px);background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(14px,2vw,22px);margin-bottom:28px;scroll-margin-top:140px}
.sgh-mb .mb-hero{position:relative;align-self:start;position:sticky;top:150px}
.sgh-mb .mb-hero img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px}
.sgh-mb .mb-tag{position:absolute;left:12px;top:12px;background:rgba(0,68,79,.85);color:#fff;font:700 11.5px var(--f-body);letter-spacing:.6px;text-transform:uppercase;padding:6px 10px;border-radius:999px}
.sgh-mb .mb-body h2{font:800 clamp(26px,3vw,34px)/1.05 var(--f-display);color:var(--petrol);margin:4px 0 8px}
.sgh-mb .mb-body>p{margin:0 0 10px;color:var(--ink)}
.sgh-mb .mb-tip{background:var(--lime-soft);border-left:4px solid var(--lime);border-radius:10px;padding:10px 12px;font-size:14.5px}
.sgh-mb .mb-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0}
.sgh-mb .mb-card{display:grid;align-content:start;gap:4px;border:1px solid var(--line);border-radius:12px;padding:8px;text-decoration:none;color:var(--ink);background:#fff;transition:border-color .15s}
.sgh-mb .mb-card:hover{border-color:var(--petrol)}
.sgh-mb .mb-card img{aspect-ratio:1;object-fit:contain;width:100%;background:#fff}
.sgh-mb .mb-cat{font:700 10.5px var(--f-body);letter-spacing:.5px;text-transform:uppercase;color:var(--mut)}
.sgh-mb .mb-name{font:600 13px/1.3 var(--f-body)}
.sgh-mb .mb-price,.sgh-mb .mb-price .amount{font:800 15px var(--f-display);color:var(--petrol)}
.sgh-mb .mb-cfg{background:var(--petrol);color:#fff;border-color:var(--petrol)}
.sgh-mb .mb-cfg .mb-cat{color:var(--lime)}
.sgh-mb .mb-cfg .mb-name{color:#fff;font-weight:800}
.sgh-mb .mb-cfg .mb-sub{font-size:12.5px;color:#9fc9c9}
.sgh-mb .mb-cfg .mb-go{font:700 13px var(--f-body);color:var(--lime);margin-top:auto}
.sgh-mb .mb-foot{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:14px}
.sgh-mb .mb-foot span{display:block;font-size:13px;color:var(--mut)}
.sgh-mb .mb-foot strong,.sgh-mb .mb-foot strong .amount{font:800 24px var(--f-display);color:var(--petrol)}
.sgh-mb .mb-foot small{display:block;font-size:12px;color:var(--mut)}
@media (max-width:900px){.sgh-mb .mb-board{grid-template-columns:1fr}.sgh-mb .mb-hero{position:relative;top:0}}
@media (max-width:560px){.sgh-mb .mb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v1.6.1: tegelcalculator + collectiepagina */
.sgh.sgh-calc{background:#fff;border:1px solid var(--line);border-left:5px solid var(--lime);border-radius:12px;padding:14px 16px;margin:14px 0;font-family:var(--f-body);color:var(--ink)}
.sgh-calc .calc-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.sgh-calc .calc-head b{font:800 16px var(--f-display);color:var(--petrol)}
.sgh-calc .calc-head span{font-size:13px;color:var(--mut)}
.sgh-calc label[for=sgh-m2]{font:700 12px var(--f-body);text-transform:uppercase;letter-spacing:.5px;color:var(--mut)}
.sgh-calc .calc-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:6px 0}
.sgh-calc input[type=number]{width:120px;border:1.5px solid var(--line);border-radius:10px;padding:9px 10px;font:700 16px var(--f-body)}
.sgh-calc .calc-extra{font-size:13.5px;display:flex;gap:6px;align-items:center}
.sgh-calc .calc-out{margin:6px 0 0;font-size:15px}
.sgh-calc .calc-out strong{color:var(--petrol);font-size:17px}
.sgh-calc .calc-out span{display:block;color:var(--mut);font-size:12.5px}
.sgh.sgh-coll{max-width:1240px;margin:0 auto;padding:clamp(20px,3vw,40px) var(--gut);font-family:var(--f-body);color:var(--ink)}
.sgh-coll h2{font:800 clamp(28px,3.6vw,42px)/1.05 var(--f-display);color:var(--petrol);margin:8px 0 10px}
.sgh-coll>p{color:var(--mut);max-width:44em;margin:0 0 22px;font-size:16.5px}
.sgh-coll .coll-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.sgh-coll .coll-card{display:grid;gap:4px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px;text-decoration:none;color:var(--ink);transition:border-color .15s,transform .15s}
.sgh-coll .coll-card:hover{border-color:var(--petrol);transform:translateY(-3px)}
.sgh-coll .coll-card img{aspect-ratio:1;object-fit:cover;width:100%;border-radius:10px}
.sgh-coll .coll-name{font:800 18px var(--f-display);color:var(--petrol)}
.sgh-coll .coll-meta{font-size:13px;color:var(--mut)}
.sgh-coll .coll-price,.sgh-coll .coll-price .amount{font:700 14px var(--f-body);color:var(--petrol)}
/* v1.7 moodboards: complete badkamer S/M/L */
.sgh-mb .mb-price small{font:600 11px var(--f-body);color:var(--mut)}
.sgh-mb .mb-calc{border:1.5px solid var(--petrol);border-radius:14px;padding:14px;margin:4px 0 14px;background:#fbfdfc}
.sgh-mb .mb-calc-h{font:800 18px var(--f-display);color:var(--petrol);margin-bottom:10px}
.sgh-mb .mb-calc table{width:100%;border-collapse:separate;border-spacing:8px 0;table-layout:fixed;margin:0 -8px;width:calc(100% + 16px)}
.sgh-mb .mb-calc th{font:800 15px var(--f-body);color:var(--petrol);text-align:left;padding:0 0 6px;border:0;background:none}
.sgh-mb .mb-calc th small{display:block;font:600 12px var(--f-body);color:var(--mut)}
.sgh-mb .mb-calc td{vertical-align:top;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;display:table-cell}
.sgh-mb .mb-calc td span{display:block;font-size:12px;color:var(--mut)}
.sgh-mb .mb-calc td b{display:block;font:700 15px var(--f-body);color:var(--ink);margin-bottom:6px}
.sgh-mb .mb-calc td .tot{border-top:1px solid var(--line);padding-top:6px;color:var(--petrol);font-weight:700}
.sgh-mb .mb-calc td strong{display:block;font:800 22px var(--f-display);color:var(--petrol)}
.sgh-mb .mb-incl{margin-top:10px;font-size:13.5px}
.sgh-mb .mb-incl summary{cursor:pointer;font-weight:700;color:var(--petrol)}
.sgh-mb .mb-incl ul{margin:8px 0 0;padding-left:18px;color:var(--ink)}
.sgh-mb .mb-incl li{margin-bottom:6px}
@media (max-width:560px){.sgh-mb .mb-calc thead{display:none}.sgh-mb .mb-calc table,.sgh-mb .mb-calc tbody,.sgh-mb .mb-calc tr{display:block;margin:0;width:100%}
.sgh-mb .mb-calc td{display:block;margin-bottom:8px}.sgh-mb .mb-calc td:before{content:attr(data-l);display:block;font:800 15px var(--f-body);color:var(--petrol);margin-bottom:4px}}
.sgh-mb .mb-hero{position:relative;top:auto}
.sgh-mb .mb-side{display:grid;gap:14px;align-content:start}
.sgh-mb .mb-side .mb-calc{margin:0}
.sgh-mb .mb-side .mb-foot{border-top:0;padding-top:0}
@media (max-width:900px){.sgh-mb .mb-side{order:0}.sgh-mb .mb-body{order:1}}
/* v1.8 moodboards: materiaallijst */
.sgh-mb .mb-calc-sub,.sgh-mb .mb-calc-note{font-size:13px;color:var(--mut);margin:0 0 10px}
.sgh-mb .mb-calc-note{margin:10px 0 0}
.sgh-mb .mb-calc table.mb-list{border-collapse:collapse;border-spacing:0;margin:0;width:100%;table-layout:auto;font-size:13.5px}
.sgh-mb .mb-list th{font:700 11.5px var(--f-body);text-transform:uppercase;letter-spacing:.4px;color:var(--mut);padding:6px 4px;border-bottom:1.5px solid var(--line)}
.sgh-mb .mb-list td{display:table-cell;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:7px 4px;vertical-align:top;color:var(--ink)}
.sgh-mb .mb-list td:nth-child(2){white-space:nowrap;color:var(--mut)}
.sgh-mb .mb-list td:last-child,.sgh-mb .mb-list th:last-child{text-align:right;white-space:nowrap}
.sgh-mb .mb-list td a{color:var(--ink);text-decoration:none}
.sgh-mb .mb-list td a:hover{color:var(--petrol);text-decoration:underline}
.sgh-mb .mb-list tfoot td{border:0;padding-top:12px;font:800 16px var(--f-body);color:var(--petrol)}
.sgh-mb .mb-list tfoot td:last-child,.sgh-mb .mb-list tfoot .amount{font:800 24px var(--f-display);color:var(--petrol)}
.sgh-mb .mb-foot{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:560px){.sgh-mb .mb-calc table.mb-list,.sgh-mb .mb-list tbody,.sgh-mb .mb-list tr{display:table-row-group}.sgh-mb .mb-list thead{display:table-header-group}.sgh-mb .mb-list tr{display:table-row}.sgh-mb .mb-calc table.mb-list{display:table}.sgh-mb .mb-list td:before{content:none}}
.sgh-mb .mb-list td:last-child,.sgh-mb .mb-list td:last-child *{white-space:nowrap!important;display:inline}
.sgh-mb .mb-list td:last-child{display:table-cell;min-width:86px}
/* v1.9 moodboards: inklapbare materiaallijst + mobiel */
.sgh-mb .mb-tot{display:flex;justify-content:space-between;align-items:center;gap:12px}
.sgh-mb .mb-tot .mb-calc-h{display:block;margin:0 0 2px;font-size:17px}
.sgh-mb .mb-tot small{display:block;font-size:12.5px;color:var(--mut)}
.sgh-mb .mb-tot strong{font:800 30px var(--f-display);color:var(--petrol);white-space:nowrap}
.sgh-mb .mb-det{margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.sgh-mb .mb-det summary{cursor:pointer;list-style:none;font:700 14.5px var(--f-body);color:var(--petrol);display:flex;align-items:center;gap:8px}
.sgh-mb .mb-det summary::-webkit-details-marker{display:none}
.sgh-mb .mb-det summary:after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-4px;transition:transform .2s}
.sgh-mb .mb-det[open] summary:after{transform:rotate(-135deg);margin-top:4px}
.sgh-mb .mb-det .close,.sgh-mb .mb-det[open] .open{display:none}
.sgh-mb .mb-det[open] .close{display:inline}
.sgh-mb .mb-items{list-style:none;margin:10px 0 0;padding:0;font-size:13.5px}
.sgh-mb .mb-items li{display:grid;grid-template-columns:1fr auto auto;gap:4px 12px;padding:7px 0;border-bottom:1px solid var(--line);align-items:baseline}
.sgh-mb .mb-items .mi-n a{color:var(--ink);text-decoration:none}
.sgh-mb .mb-items .mi-n a:hover{color:var(--petrol);text-decoration:underline}
.sgh-mb .mb-items .mi-q{color:var(--mut);white-space:nowrap}
.sgh-mb .mb-items .mi-p,.sgh-mb .mb-items .mi-p *{white-space:nowrap;text-align:right;font-weight:700}
.sgh-mb .mb-items .mi-c{display:block;font-size:11.5px;color:var(--mut);font-weight:400;margin-top:2px}
.sgh-mb .mb-items li.mi-tegel{background:#f7f3ec;padding-left:8px;padding-right:8px;border-radius:6px;margin:2px 0}
@media (max-width:560px){
 .sgh-mb .mb-board{padding:12px;border-radius:16px}
 .sgh-mb .mb-tot strong{font-size:26px}
 .sgh-mb .mb-items li{grid-template-columns:1fr auto;padding:8px 0}
 .sgh-mb .mb-items .mi-n{grid-column:1/-1}
 .sgh-mb .mb-items .mi-q{font-size:12.5px}
 .sgh-mb .mb-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;margin:12px -12px;padding:0 12px 6px;-webkit-overflow-scrolling:touch}
 .sgh-mb .mb-card{flex:0 0 46%;scroll-snap-align:start}
 .sgh-mb .mb-foot .btn{width:100%;text-align:center;justify-content:center}
 .sgh-mb .mb-nav{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px 20px;padding:0 16px 4px}
 .sgh-mb .mb-nav a{flex:0 0 auto}
}
.sgh-mb,.sgh-mb .mb-board>*,.sgh-mb .mb-side>*,.sgh-mb .mb-body>*{min-width:0}
.sgh-mb{max-width:100%;overflow-x:clip}
@media (max-width:900px){.sgh-mb .mb-board{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){.sgh-mb .mb-board{display:flex;flex-direction:column;gap:12px}.sgh-mb .mb-side,.sgh-mb .mb-body{display:contents}
.sgh-mb .mb-body h2{order:0;margin:0}.sgh-mb .mb-body>p:not(.mb-tip){order:1;margin:0}.sgh-mb .mb-hero{order:2}.sgh-mb .mb-calc{order:3}.sgh-mb .mb-foot{order:4}.sgh-mb .mb-tip{order:5}.sgh-mb .mb-grid{order:6}}
.sgh-coll{margin:6px 0 26px}

/* Maatwijzer */
.sgh-mw{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px 22px;margin:0 0 26px}
.sgh-mw .mw-head h3{margin:4px 0 6px;font-size:22px}
.sgh-mw .mw-head p{margin:0 0 14px;color:var(--mut);font-size:14px}
.sgh-mw .mw-form{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.sgh-mw .mw-form label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:600;min-width:140px;flex:1 1 140px}
.sgh-mw .mw-form input,.sgh-mw .mw-form select{height:44px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font-size:15px;background:#fff}
.sgh-mw .mw-form .btn{height:44px;flex:0 0 auto}
.sgh-mw .mw-msg{margin:14px 0 8px;font-weight:600}
.sgh-mw .mw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.sgh-mw .mw-card{display:flex;flex-direction:column;gap:4px;border:1px solid var(--line);border-radius:14px;padding:10px;text-decoration:none;color:var(--ink);background:#fff;min-width:0}
.sgh-mw .mw-card img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:10px;background:#f6f4ef}
.sgh-mw .mw-n{font-weight:700;font-size:14px}
.sgh-mw .mw-m{font-size:12.5px;color:var(--mut)}
.sgh-mw .mw-p{font-weight:700;color:var(--petrol)}
@media (max-width:560px){.sgh-mw{padding:16px}.sgh-mw .mw-grid{grid-template-columns:1fr 1fr}}