/* Exact KAZTO Factory mark from the supplied brand file. */
body{font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif}
.brand{background:#fff;border:1px solid #e3e0d7;border-radius:8px;padding:5px 10px}
.brand-logo{display:block;width:168px;height:46px;object-fit:contain}

/* The mixer sits above the orange ring without colour blending. */
.hero-art .orange-orbit{z-index:1}
.hero-art>img{z-index:2;mix-blend-mode:normal}

/* One full-width mixer and five wheelbarrow cards. */
.products{grid-template-columns:repeat(6,minmax(0,1fr))}
.product{grid-column:span 2}
.product.featured{grid-column:span 6;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr)}
.product.featured .mixer-image{height:460px;padding:28px;overflow:visible}
.product.featured .mixer-image img{width:100%;height:100%;object-fit:contain;object-position:center}
.product.featured .product-body{justify-content:center}
.products>.product:nth-last-child(2),.products>.product:last-child{grid-column:span 3}

/* Animated product gallery. */
.gallery{position:relative;isolation:isolate;cursor:pointer;user-select:none;touch-action:pan-y;background:#fff}
.gallery-slide{position:absolute;inset:18px;width:calc(100% - 36px)!important;height:calc(100% - 36px)!important;object-fit:contain;opacity:0;transform:translateX(7%);pointer-events:none}
.gallery-slide.active{opacity:1;transform:translateX(0);animation:gallery-in-right .32s cubic-bezier(.22,.75,.26,1) both}
.gallery[data-direction="prev"] .gallery-slide.active{animation-name:gallery-in-left}
.gallery-arrow{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:42px;height:42px;border:0;border-radius:50%;background:rgba(23,23,20,.82);color:#fff;font-size:30px;line-height:1;display:grid;place-items:center;cursor:pointer;box-shadow:0 6px 18px #0003;transition:transform .18s,background .18s}
.gallery-arrow:hover{background:var(--orange);transform:translateY(-50%) scale(1.06)}
.gallery-arrow.prev{left:12px}.gallery-arrow.next{right:12px}
.gallery-dots{position:absolute;z-index:3;left:50%;bottom:12px;transform:translateX(-50%);display:flex;gap:6px;padding:6px 9px;border-radius:20px;background:#fffde}
.gallery-dot{width:7px;height:7px;border-radius:50%;background:#b8b5ae;transition:.2s}
.gallery-dot.active{width:20px;border-radius:6px;background:var(--orange)}
.crm-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
@keyframes gallery-in-right{from{opacity:0;transform:translateX(8%)}to{opacity:1;transform:translateX(0)}}
@keyframes gallery-in-left{from{opacity:0;transform:translateX(-8%)}to{opacity:1;transform:translateX(0)}}

@media(max-width:900px){
  .products{grid-template-columns:repeat(2,minmax(0,1fr))}
  .product,.products>.product:nth-last-child(2),.products>.product:last-child{grid-column:auto}
  .product.featured{grid-column:span 2;grid-template-columns:1fr}
  .product.featured .mixer-image{height:390px}
}
@media(max-width:600px){
  .brand{padding:4px 7px}.brand-logo{width:128px;height:38px}
  .products{grid-template-columns:1fr}
  .product,.product.featured,.products>.product:nth-last-child(2),.products>.product:last-child{grid-column:auto}
  .product.featured{grid-template-columns:1fr}
  .product.featured .mixer-image{height:300px;padding:16px}
  .gallery-arrow{width:38px;height:38px;font-size:27px}
}
