.hero-carousel{isolation:isolate}.hero-slides,.hero-slide{position:absolute;inset:0}.hero-slide{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .65s ease,visibility .65s}.hero-slide.is-active{opacity:1;visibility:visible;pointer-events:auto}.hero-slide-photo,.hero-slide-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.hero-slide--gudang .hero-slide-photo{object-position:center 64%}.hero-slide--produk .hero-slide-photo{object-position:center 44%}.hero-slide-backdrop{filter:blur(16px);transform:scale(1.08);opacity:.65}.hero-slide--petani .hero-slide-photo{object-fit:contain;object-position:center 34%}.hero-carousel .hero-visual-shade{background:linear-gradient(180deg,#061a3477 0%,transparent 35%,#051a34f5 100%)}.hero-carousel .hero-image-caption{bottom:87px;left:28px;right:28px}.hero-carousel .hero-image-caption h2{font-size:31px}.hero-carousel .hero-image-caption>div{margin-top:17px;padding-top:12px}.hero-carousel .hero-visual-top{z-index:2;pointer-events:none}.hero-carousel-controls{position:absolute;z-index:3;left:23px;right:23px;bottom:20px;display:flex;align-items:center;gap:7px;color:#fff}.hero-carousel-controls button{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;border:1px solid #ffffff55;background:#061a3466;color:#fff;padding:0;transition:background .2s}.hero-carousel-controls button:hover{background:#e10600}.hero-carousel-controls .hero-direction svg{width:18px;height:18px}.hero-carousel-controls [data-hero-prev] svg{transform:rotate(180deg)}.hero-carousel-dots{display:flex;gap:0;align-items:center;margin-right:auto}.hero-carousel-dots button{width:30px;height:40px;border:0;background:transparent}.hero-carousel-dots button:hover{background:transparent}.hero-carousel-dots button span{display:block;width:6px;height:6px;border-radius:50%;background:#ffffff66;transition:width .2s,background .2s}.hero-carousel-dots button[aria-pressed=true] span{background:#ff392f;width:20px;border-radius:10px}.hero-slide-count{font-size:10px;font-weight:600;letter-spacing:1px;white-space:nowrap;padding:0 6px}.hero-carousel-controls .hero-autoplay{font-size:17px;font-weight:600}.hero-carousel-announcement{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.hero-slide img{transform:none}.hero-slide-backdrop{transform:scale(1.08)!important}@media(max-width:900px){.hero-carousel .hero-image-caption{left:20px;right:20px}.hero-carousel .hero-image-caption h2{font-size:27px}.hero-carousel-controls{left:16px;right:16px;gap:4px}.hero-carousel-controls button{width:36px;height:36px}.hero-carousel-dots button{width:26px}.hero-slide-count{font-size:9px;padding:0 3px}}@media(max-width:600px){.hero-grid{padding-top:15px;gap:25px}.hero-copy{padding-top:0}.hero-visual.hero-carousel{order:-1;min-height:0;aspect-ratio:4/3}.hero-carousel .hero-image-caption{bottom:69px;left:20px;right:20px}.hero-carousel .hero-image-caption h2{font-size:26px;line-height:1.1}.hero-carousel .hero-image-caption .image-tag{font-size:7px;letter-spacing:1px}.hero-carousel .hero-image-caption>div{margin-top:11px;padding-top:8px}.hero-carousel .hero-image-caption>div>span{font-size:6px}.hero-carousel .hero-image-caption a{padding:5px}.hero-carousel .hero-image-caption a svg{width:17px;height:17px}.hero-carousel-controls{left:16px;right:72px;bottom:14px;gap:7px}.hero-carousel-controls button{width:36px;height:36px}.hero-carousel-dots button{width:29px;height:36px}.hero-slide-count{font-size:9px;padding:0 4px}.hero-slide--petani .hero-slide-photo{object-fit:cover;object-position:center 50%}.hero-slide--produk .hero-slide-photo{object-position:center 40%}.hero-slide--gudang .hero-slide-photo{object-position:center 55%}}@media(prefers-reduced-motion:reduce){.hero-slide,.hero-carousel-controls button,.hero-carousel-dots button span{transition:none}}
/* Application slides retain the whole canopy and truck above the caption. */
.hero-slide--kanopi .hero-slide-photo,.hero-slide--truk .hero-slide-photo{height:75%;object-fit:contain;object-position:center 18%}
.hero-slide--kanopi .hero-slide-backdrop,.hero-slide--truk .hero-slide-backdrop{opacity:.35}
.hero-slide-description{max-width:320px;margin:12px 0 0;color:#e2eaf4;font-size:12px;line-height:1.5}
.hero-carousel .hero-image-caption a:has(span){gap:8px;padding:8px 10px;background:#e10600;border-color:#e10600}
.hero-carousel .hero-image-caption a>span{font-size:11px;font-weight:600;white-space:nowrap}
.hero-carousel .hero-image-caption a:has(span):hover{background:#b80500}
@media(max-width:900px){.hero-carousel-dots button{width:24px}.hero-carousel-controls{gap:3px}}
@media(max-width:600px){
 .hero-slide--kanopi .hero-slide-photo,.hero-slide--truk .hero-slide-photo{height:72%;object-position:center top}
 .hero-slide--kanopi .image-tag,.hero-slide--truk .image-tag{margin-bottom:10px}
 .hero-slide-description{font-size:10px;line-height:1.4;max-width:290px;margin-top:8px}
 .hero-carousel .hero-image-caption a:has(span){gap:5px;padding:6px 8px}
 .hero-carousel .hero-image-caption a>span{font-size:9px}
 .hero-carousel-controls{gap:4px}
 .hero-carousel-dots{flex:1;min-width:0}
 .hero-carousel-dots button{width:24px;flex:1;min-width:0}
 .hero-carousel-dots button[aria-pressed=true] span{width:15px}
}
@media(max-width:420px){.hero-slide-count{display:none}.hero-carousel-controls button{width:32px;height:36px}.hero-carousel-dots button{width:20px;flex:1}}
