/* Tuinmaterialen homepage — brand shapes and product motion. */
#tm-home-promo{--tmp-green:#3C9948;--tmp-orange:#F58220;--tmp-ink:#183A28;--tmp-pale:#EFF5EC;width:min(1280px,calc(100% - 48px));margin:24px auto 0;padding:0;font-family:Inter,Arial,sans-serif;color:var(--tmp-ink)}
#tm-home-promo *{box-sizing:border-box}
#tm-home-promo .tmp-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
#tm-home-promo .tmp-tile{--cut:28px;position:relative;display:block;text-decoration:none;color:var(--tmp-ink);background:var(--tmp-pale);overflow:hidden;isolation:isolate;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,var(--cut) 100%,0 calc(100% - var(--cut)));border-radius:0}
#tm-home-promo .tmp-tile--large{grid-column:span 3;aspect-ratio:632/328}
#tm-home-promo .tmp-tile--small{grid-column:span 2;aspect-ratio:416/148;--cut:20px}
#tm-home-promo .tmp-copy{position:relative;z-index:3;padding:30px 28px;width:59%;height:100%;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;pointer-events:none}
#tm-home-promo h1,#tm-home-promo h2{font-family:Kanit,Arial,sans-serif;font-weight:800;letter-spacing:-.025em;line-height:1.05;margin:0;text-transform:none;color:inherit}
#tm-home-promo h1{font-size:clamp(34px,3vw,47px)}
#tm-home-promo h2{font-size:clamp(30px,2.8vw,43px)}
#tm-home-promo p{font-size:14px;line-height:1.5;margin:14px 0 20px;font-weight:400;color:inherit}
#tm-home-promo .tmp-action{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:700;line-height:1.3;white-space:nowrap}
#tm-home-promo .tmp-action svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;fill:none;transition:transform .2s}
#tm-home-promo .tmp-tile:hover .tmp-action svg{transform:translateX(4px)}
#tm-home-promo .tmp-tile:focus-visible{outline:none;box-shadow:inset 0 0 0 4px #00AEEF}
#tm-home-promo .tmp-tile:focus-visible .tmp-action{text-decoration:underline;text-underline-offset:4px}
#tm-home-promo .tmp-action--button{background:#fff;color:var(--tmp-ink);padding:13px 17px;font-family:Kanit,Arial,sans-serif;font-weight:800;font-style:italic;font-size:15px;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px))}
#tm-home-promo .tmp-tile--intro{background:var(--tmp-green);color:#fff}
#tm-home-promo .tmp-tile--intro .tmp-copy{width:62%}
#tm-home-promo .tmp-tile--intro p{margin-top:13px;margin-bottom:25px;color:#fff;font-weight:600}
#tm-home-promo .tmp-montage{position:absolute;inset:0 0 0 48%;z-index:1}
#tm-home-promo .tmp-montage-shape{position:absolute;left:12%;top:12%;width:95%;height:91%;background:var(--tmp-orange);clip-path:polygon(25% 0,100% 0,100% 100%,0 100%,0 25%)}
#tm-home-promo .tmp-montage img{position:absolute;object-fit:contain;display:block;max-width:none;filter:drop-shadow(0 9px 8px #0003)}
#tm-home-promo .tmp-montage-fence{width:107%;height:88%;left:-1%;top:1%;transform:rotate(-6deg)}
#tm-home-promo .tmp-montage-light{width:69%;height:67%;right:-4%;bottom:-4%;transform:rotate(7deg)}
#tm-home-promo .tmp-tile--board{background:#EFF5EC}
#tm-home-promo .tmp-tile--board:before{content:"";position:absolute;inset:0 0 0 48%;background:#E3ECD9;clip-path:polygon(20% 0,100% 0,100% 100%,0 100%)}
#tm-home-promo .tmp-tile--board .tmp-copy{width:55%}
#tm-home-promo .tmp-tile--board h2{color:#287636}
#tm-home-promo .tmp-tile--board .tmp-action{border-bottom:2px solid var(--tmp-orange);padding-bottom:5px}
#tm-home-promo .tmp-scene{position:absolute;inset:8% 0 7% 46%;z-index:2;pointer-events:none}
#tm-home-promo .tmp-slide{position:absolute;inset:0;opacity:0;transform:translateX(26px) rotate(3deg);transition:opacity .7s ease,transform .9s cubic-bezier(.22,.61,.36,1)}
#tm-home-promo .tmp-slide.is-current{opacity:1;transform:translateX(0) rotate(0)}
#tm-home-promo .tmp-slide img{display:block;width:100%;height:100%;object-fit:contain;max-width:none}
#tm-home-promo .tmp-scene--board img{mix-blend-mode:multiply;clip-path:polygon(0 0,87% 0,100% 13%,100% 100%,13% 100%,0 87%)}
#tm-home-promo .tmp-scene--board{inset:11% -2% 11% 48%;transform:rotate(-8deg)}
#tm-home-promo .tmp-product-name{position:absolute;bottom:-2px;left:0;right:0;text-align:center;color:var(--tmp-ink);font-size:10px;font-weight:600}
#tm-home-promo .tmp-scene--board .tmp-product-name{bottom:-12px;transform:rotate(8deg)}
#tm-home-promo .tmp-tile--small .tmp-copy{width:64%;padding:18px 20px}
#tm-home-promo .tmp-tile--small h2{font-size:clamp(21px,1.85vw,27px);line-height:1.03}
#tm-home-promo .tmp-tile--small p{font-size:11px;margin:8px 0 12px;line-height:1.4}
#tm-home-promo .tmp-tile--small .tmp-action{font-size:11px;gap:6px}
#tm-home-promo .tmp-tile--small .tmp-action svg{width:15px;height:15px}
#tm-home-promo .tmp-tile--small .tmp-scene{inset:7% 2% 12% 59%}
#tm-home-promo .tmp-tile--fence{background:#F0F4EE}
#tm-home-promo .tmp-tile--fence h2{color:#287636}
#tm-home-promo .tmp-scene--fence img{filter:drop-shadow(0 5px 3px #0002)}
#tm-home-promo .tmp-tile--light{background:#FFF1DE}
#tm-home-promo .tmp-tile--light h2{font-size:clamp(20px,1.72vw,25px)}
#tm-home-promo .tmp-tile--light .tmp-scene{inset:-3% -1% 8% 56%}
#tm-home-promo .tmp-tile--gravel{background:#EFF3F5}
#tm-home-promo .tmp-tile--gravel .tmp-scene{inset:11% 4% 16% 63%}
#tm-home-promo .tmp-scene--gravel img{object-fit:cover;clip-path:polygon(0 0,75% 0,100% 25%,100% 100%,25% 100%,0 75%)}
#tm-home-promo .tmp-tile--small .tmp-product-name{bottom:-12px;font-size:9px}
#tm-home-promo .tmp-controls{height:30px;display:flex;justify-content:flex-end;align-items:center}
#tm-home-promo .tmp-pause{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:3px 0 3px 10px;border:0;background:transparent;color:#4D6155;font-family:Inter,Arial,sans-serif;font-size:10px;cursor:pointer}
#tm-home-promo .tmp-pause[hidden]{display:none}
#tm-home-promo .tmp-pause svg{height:12px;width:12px;stroke:currentColor;stroke-width:2;fill:none}
#tm-home-promo .tmp-play-symbol{display:none}
#tm-home-promo.is-paused .tmp-play-symbol{display:block}
#tm-home-promo.is-paused .tmp-pause-symbol{display:none}
#tm-home-promo .tmp-pause:focus-visible{outline:2px solid #00AEEF;outline-offset:2px}
@media(min-width:761px) and (max-width:1100px){
 #tm-home-promo .tmp-copy{padding:22px 20px}
 #tm-home-promo h1{font-size:34px}
 #tm-home-promo h2{font-size:34px}
 #tm-home-promo p{font-size:12px;margin:10px 0 15px}
 #tm-home-promo .tmp-action--button{font-size:12px;padding:11px}
 #tm-home-promo .tmp-tile--large{min-height:265px}
 #tm-home-promo .tmp-tile--small{aspect-ratio:auto;height:162px}
 #tm-home-promo .tmp-tile--small .tmp-copy{padding:16px 14px;width:67%}
 #tm-home-promo .tmp-tile--small h2{font-size:21px}
 #tm-home-promo .tmp-tile--light h2{font-size:19px}
 #tm-home-promo .tmp-tile--small p{max-width:135px}
 #tm-home-promo .tmp-tile--small .tmp-action{font-size:10px;gap:3px}
 #tm-home-promo .tmp-tile--small .tmp-product-name{display:none}
}
@media(max-width:760px){
 #tm-home-promo{width:calc(100% - 28px);margin-top:14px}
 #tm-home-promo .tmp-grid{grid-template-columns:minmax(0,1fr);gap:12px}
 #tm-home-promo .tmp-tile--large,#tm-home-promo .tmp-tile--small{grid-column:auto;aspect-ratio:auto;--cut:23px}
 #tm-home-promo .tmp-tile--large{height:240px}
 #tm-home-promo .tmp-copy{padding:23px 20px}
 #tm-home-promo h1{font-size:32px}
 #tm-home-promo .tmp-tile--intro .tmp-copy{width:67%}
 #tm-home-promo h2{font-size:34px}
 #tm-home-promo p{font-size:12px;margin:12px 0 18px}
 #tm-home-promo .tmp-tile--intro p{max-width:150px;margin-bottom:20px}
 #tm-home-promo .tmp-action--button{font-size:12px;padding:11px 12px;gap:7px}
 #tm-home-promo .tmp-tile--board{height:215px}
 #tm-home-promo .tmp-tile--board .tmp-action{font-size:12px}
 #tm-home-promo .tmp-tile--small{height:150px}
 #tm-home-promo .tmp-tile--small .tmp-copy{width:66%;padding:18px 20px}
 #tm-home-promo .tmp-tile--small h2{font-size:26px}
 #tm-home-promo .tmp-tile--light h2{font-size:23px}
 #tm-home-promo .tmp-tile--light .tmp-scene{left:64%;right:0}
 #tm-home-promo .tmp-tile--small p{font-size:11px}
 #tm-home-promo .tmp-tile--small .tmp-action{font-size:11px}
 #tm-home-promo .tmp-pause{min-height:40px;font-size:11px}
 #tm-home-promo .tmp-controls{height:40px}
}
@media(max-width:360px){
 #tm-home-promo h1{font-size:28px}
 #tm-home-promo .tmp-copy,#tm-home-promo .tmp-tile--small .tmp-copy{padding-left:16px}
 #tm-home-promo .tmp-action--button{font-size:11px;padding:10px}
 #tm-home-promo .tmp-tile--small h2{font-size:23px}
 #tm-home-promo .tmp-tile--light h2{font-size:20px}
}
@media(prefers-reduced-motion:reduce){
 #tm-home-promo .tmp-slide,#tm-home-promo .tmp-action svg{transition:none}
 #tm-home-promo .tmp-pause{display:none}
}

#tm-home-assortiment{scroll-margin-top:calc(var(--tmh-height,140px) + 18px)}
