/* Homepage-secties: assortiment (bento) + showroom. Eigen beheer, laadt naast style.css. */

/* ── Uitlijning: alle homepage-secties op dezelfde (brede) container-breedte ──
   Collectie-banner en het 'gespreid betalen'-blok (.gbcta) stonden op 1120px,
   terwijl de assortiment-/showroom-/visualizer-secties de Bootstrap-.container
   (max 1320px) volgen. Hier trekken we die twee gelijk naar dezelfde breedte,
   zodat de hele homepage netjes uitlijnt. Bootstrap-breekpunten aangehouden. */
.collectie-banner .container,
.gbcta {
  max-width: 1320px !important;
  width: 100%;
  margin-left: auto; margin-right: auto;
  padding-left: 12px; padding-right: 12px;
  box-sizing: border-box;
}
@media (max-width: 1399.98px){ .collectie-banner .container, .gbcta { max-width: 1140px !important; } }
@media (max-width: 1199.98px){ .collectie-banner .container, .gbcta { max-width: 960px !important; } }
@media (max-width: 991.98px){  .collectie-banner .container, .gbcta { max-width: 720px !important; } }
@media (max-width: 767.98px){  .collectie-banner .container, .gbcta { max-width: 540px !important; } }
@media (max-width: 575.98px){  .collectie-banner .container, .gbcta { max-width: 100% !important; } }

.stz-hs{
  --koper:#CD7F3B; --koper-d:#b96f2f; --koper-l:#E39A5A;
  --ink:#262625; --text:#4a4543; --paneel:#22272A; --licht:#f5f2ee;
  font-family:"montserrat","Helvetica Neue",Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.stz-hs *{box-sizing:border-box;}
/* .stz-hs-inner krijgt óók de theme-class .container → exact dezelfde breedte/
   uitlijning als alle andere homepage-secties (visualizer, reviews, etc.). */
.stz-hs-inner{margin:0 auto;}
.stz-hs .h-eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--koper);}
.stz-hs .h-eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--koper);}
.stz-hs .h-title{font-family:"degular","montserrat",sans-serif;font-weight:300;line-height:1.05;letter-spacing:-.01em;color:var(--ink);margin:0;}
.stz-hs .h-title em{font-style:normal;color:var(--koper);}
.stz-hs .btn-stz{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:15px;text-decoration:none;border-radius:9999px;padding:14px 28px;transition:.18s;cursor:pointer;border:0;}
.stz-hs .btn-koper{background:var(--koper);color:#fff;} .stz-hs .btn-koper:hover{background:var(--koper-d);transform:translateY(-1px);color:#fff;}
.stz-hs .btn-stz.arrow::after{content:"→";}

/* ── Assortiment (bento) ── */
.stz-assortiment{background:var(--licht);padding:clamp(56px,7vw,96px) 0;}
.stz-assortiment .kop{text-align:center;max-width:660px;margin:0 auto clamp(36px,4vw,52px);}
.stz-assortiment .kop .h-eyebrow{justify-content:center;}
.stz-assortiment .kop .h-title{font-size:clamp(2rem,3.4vw,2.9rem);margin:16px 0 14px;}
.stz-assortiment .kop p{font-size:16px;line-height:1.6;margin:0;}
.stz-bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:158px;gap:14px;}
.stz-bcard{position:relative;border-radius:16px;overflow:hidden;text-decoration:none;display:block;}
.stz-bcard img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;display:block;}
.stz-bcard:hover img{transform:scale(1.05);}
.stz-bcard .veil{position:absolute;inset:0;}
.stz-bcard .label{position:absolute;color:#fff;z-index:1;}
.stz-bcard .tag{font-size:12px;letter-spacing:.1em;text-transform:uppercase;opacity:.9;font-weight:700;}
.stz-bcard .bh{font-family:"degular",sans-serif;font-size:26px;font-weight:600;line-height:1.15;}
.stz-card-groot{grid-column:span 2;grid-row:span 2;}
.stz-card-breed{grid-column:span 2;}

/* ── Showroom centraal ── */
.stz-showroom{background:#fff;padding:clamp(56px,7vw,96px) 0;}
.stz-showroom-hero{position:relative;border-radius:20px;overflow:hidden;min-height:460px;display:flex;align-items:flex-end;}
.stz-showroom-hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.stz-showroom-hero .veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(38,38,37,.85) 0%,rgba(38,38,37,.5) 42%,transparent 72%);}
.stz-showroom-copy{position:relative;padding:clamp(32px,4vw,56px);max-width:540px;color:#fff;}
.stz-showroom-copy .h-eyebrow{color:var(--koper-l);} .stz-showroom-copy .h-eyebrow .dot{background:var(--koper-l);}
.stz-showroom-copy .h-title{color:#fff;font-size:clamp(1.9rem,3.2vw,2.7rem);margin:16px 0 14px;}
.stz-showroom-copy p{font-size:15.5px;line-height:1.6;color:rgba(255,255,255,.85);margin:0 0 22px;}
.stz-showroom-btns{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}
.stz-showroom-btns .ghost{background:rgba(255,255,255,.15);color:#fff;}
.stz-showroom-meta{margin-top:20px;font-size:13px;color:rgba(255,255,255,.72);display:flex;gap:22px;flex-wrap:wrap;}
.stz-showroom-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px;}
.stz-showroom-strip div{aspect-ratio:4/3;border-radius:12px;overflow:hidden;}
.stz-showroom-strip img{width:100%;height:100%;object-fit:cover;display:block;}

@media(max-width:820px){
  .stz-bento{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px;}
  .stz-card-groot{grid-column:span 2;grid-row:auto;}
  .stz-card-breed{grid-column:span 2;}
  .stz-showroom-strip{grid-template-columns:repeat(2,1fr);}
}