.shf-catalogue{max-width:1200px;margin:32px auto;padding:24px;color:#283d2e;background:#f8f7f0;border-radius:12px}.shf-catalogue header{margin-bottom:28px}.shf-catalogue .shf-kicker{font-size:12px;letter-spacing:.15em}.shf-catalogue h2{font-size:32px;margin:8px 0 12px}.shf-box-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.shf-box-card{overflow:hidden;border:1px solid #d9ddcf;border-radius:10px;background:white}.shf-box-card img{display:block;width:100%;height:280px;object-fit:contain;background:#f1eee4}.shf-box-card>a{display:block;text-decoration:none}.shf-box-card small{display:block;padding:8px 16px;color:#626951;font-size:12px}.shf-box-card-body{padding:20px}.shf-box-card h3{margin:0 0 12px;font-size:23px}.shf-box-card h3 a{color:#283d2e;text-decoration:none}.shf-card-swatches{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0;font-size:12px}.shf-card-swatches span{display:flex;align-items:center;gap:6px}.shf-card-swatches i{display:inline-block;width:20px;height:20px;border-radius:50%;border:1px solid #b1b5ab}.shf-catalogue a.shf-configure-link{display:inline-block;background:#304d3c;color:white;padding:12px 18px;border-radius:6px;text-decoration:none}.shf-catalogue a:focus-visible{outline:3px solid #ad7e3b;outline-offset:4px}@media(max-width:650px){.shf-box-grid{grid-template-columns:1fr}.shf-catalogue{padding:16px}.shf-box-card img{height:240px}}

.shf-catalogue.shf-columns-1 .shf-box-grid{grid-template-columns:repeat(1,minmax(0,1fr))}
.shf-catalogue.shf-columns-2 .shf-box-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.shf-catalogue.shf-columns-3 .shf-box-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.shf-catalogue.shf-columns-4 .shf-box-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.shf-catalogue .shf-box-card img{height:var(--shf-card-image-height,280px)}
@media(max-width:950px){.shf-catalogue.shf-columns-3 .shf-box-grid,.shf-catalogue.shf-columns-4 .shf-box-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.shf-catalogue[class*="shf-columns-"] .shf-box-grid{grid-template-columns:1fr}}

@media(max-width:650px){.shf-catalogue .shf-box-card img{height:min(var(--shf-card-image-height,280px),240px)}}
