.hero-belt{min-height:660px;background:#163c32;isolation:isolate}
.belt-window{position:absolute;inset:0;overflow:hidden;touch-action:pan-y}
.belt-track{width:100%;height:100%}
.belt-sequence{display:flex;flex-direction:row;width:100%;height:100%;transition:none;will-change:transform}
.belt-scene{position:relative;flex:0 0 100%;margin:0;min-width:0;height:100%;overflow:hidden;background:#dae3de}
.belt-scene>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.belt-scene figcaption{position:absolute;inset:auto 0 104px;padding:55px 28px 24px;color:white;background:linear-gradient(transparent,#08251bb8);display:flex;flex-direction:column;gap:7px}
.belt-scene figcaption>span{font-size:14px}
.belt-scene figcaption button{background:none;border:0;color:inherit;padding:0;text-align:left;font-size:22px;font-weight:700;align-self:flex-start;text-shadow:0 1px 4px #0008}
.belt-toggle{position:absolute;z-index:3;right:20px;top:20px;border:1px solid #ffffff70;border-radius:30px;background:#063c30e8;color:white;padding:12px 18px;font-size:14px;min-height:44px;box-shadow:0 4px 16px #0002}
.hero-ribbon{pointer-events:none}
.hero-pagination{display:flex;justify-content:center;align-items:center;gap:2px;min-height:56px;background:white;border-bottom:1px solid var(--line)}
.hero-dot{display:grid;place-items:center;width:40px;height:44px;padding:0;border:0;background:transparent;border-radius:50%}
.hero-dot:after{content:'';display:block;width:10px;height:10px;background:#becbc4;border-radius:50%;transition:background .2s,transform .2s}
.hero-dot[aria-current=true]:after{background:var(--green);transform:scale(1.3);box-shadow:0 0 0 4px #00695615}
.hero-dot:hover:after{background:var(--green)}
@media(max-width:720px){.hero-belt{min-height:480px;height:480px}.belt-scene figcaption{bottom:100px;padding:40px 20px 22px}.belt-scene figcaption button{font-size:19px}.belt-toggle{top:14px;right:14px;padding:10px 14px}}
@media(prefers-reduced-motion:reduce){.belt-sequence{transition:none}}

.hero{display:block;min-height:0;background:#163c32}.hero-accessible-title{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px!important;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.hero .hero-belt{width:100%;height:clamp(540px,48vw,820px);min-height:0}.belt-scene>img{object-position:center top}.belt-scene figcaption{bottom:0;padding:90px 5% 42px;background:linear-gradient(transparent,rgba(4,28,20,.8))}.belt-scene figcaption>span{font-size:16px}.belt-scene figcaption button{font-size:clamp(25px,3vw,42px)}@media(max-width:720px){.hero .hero-belt{height:520px;min-height:0}.belt-scene figcaption{bottom:0;padding:70px 24px 30px}.belt-scene figcaption>span{font-size:14px}.belt-scene figcaption button{font-size:26px}}



.hero{position:relative}.hero .hero-message{position:absolute;z-index:2;top:0;left:0;right:0;margin:0;padding:38px 5% 80px;color:#fff;font-family:'DM Sans',Arial,sans-serif;font-size:clamp(26px,2.6vw,44px);font-weight:500;line-height:1.2;letter-spacing:-.035em;background:linear-gradient(rgba(4,28,20,.72),transparent);pointer-events:none;text-shadow:0 2px 12px #0004}.hero-message span{font-weight:700}.hero .hero-message{padding-right:210px}@media(max-width:720px){.hero .hero-message{padding:78px 24px 55px;font-size:27px}}


/* Lightweight product navigation over the scene. */
.belt-scene figcaption{gap:8px;padding-top:100px;background:linear-gradient(transparent,rgba(4,22,19,.88))}
.belt-scene figcaption>span{display:flex;align-items:center;gap:12px;font-size:clamp(22px,2.25vw,34px);font-weight:600;line-height:1.2;letter-spacing:-.025em;margin-bottom:14px;text-wrap:balance;text-shadow:0 2px 14px #0008}
.belt-scene figcaption>span:before{content:'';width:28px;height:3px;border-radius:3px;background:#85e8d4;box-shadow:0 0 14px #85e8d455;flex-shrink:0}
.belt-scene figcaption button,.belt-scene .scene-product-link{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;column-gap:20px;width:fit-content;max-width:100%;padding:5px 0;border:0;border-radius:0;background:transparent;color:#fff;font-size:clamp(18px,1.75vw,26px);line-height:1.25;font-weight:500;text-align:left;text-shadow:0 1px 8px #0005}
.belt-scene figcaption button>span,.scene-product-link>span{display:grid;place-items:center;width:44px;height:44px;grid-column:2;grid-row:1/3;border:1px solid #ffffff70;border-radius:50%;background:#ffffff0d;backdrop-filter:blur(12px);font-size:24px;font-weight:400;transition:transform .25s,background .25s,border-color .25s,box-shadow .25s}
.belt-scene figcaption small{grid-column:1;font-size:12px;font-weight:400;line-height:1.5;color:#d5eee7;opacity:0;transform:translateY(3px);transition:opacity .2s,transform .2s;max-width:100%}
.belt-scene figcaption :is(button,a):is(:hover,:focus-visible){color:#a8f2df}
.belt-scene figcaption :is(button,a):is(:hover,:focus-visible)>span{background:#c7fff0;color:#073d32;border-color:#c7fff0;transform:translate(2px,-2px);box-shadow:0 0 22px #91ecd333}
.belt-scene figcaption :is(button,a):is(:hover,:focus-visible) small{opacity:1;transform:translateY(0)}
@media(hover:none){.belt-scene figcaption small{opacity:1;transform:none}}
@media(max-width:720px){.belt-scene figcaption{padding:80px 24px 22px;gap:6px}.belt-scene figcaption>span{font-size:23px;margin-bottom:9px;gap:9px}.belt-scene figcaption>span:before{width:18px}.belt-scene figcaption button,.belt-scene .scene-product-link{font-size:18px;column-gap:14px}.belt-scene figcaption small{font-size:11px}}
@media(prefers-reduced-motion:reduce){.belt-scene figcaption *{transition:none!important}}

/* Animated product callouts. */
.garment-inspector{position:absolute;inset:0;pointer-events:none;z-index:2;visibility:hidden}.inspecting .garment-inspector{visibility:visible}.garment-path{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none}.garment-path path{stroke-linejoin:round;stroke-linecap:round}.path-halo{stroke:#063c3090;stroke-width:6;opacity:0}.path-stroke{stroke:#a8f2df;stroke-width:2;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .6s ease}.path-tip{stroke:#a8f2df;stroke-width:2}.garment-path circle{stroke:#a8f2df;fill:#063c30;stroke-width:2}.path-tip,.garment-path circle{opacity:0;transition:opacity .2s .45s}.inspecting .path-stroke{stroke-dashoffset:0}.inspecting :is(.path-halo,.path-tip,circle){opacity:1}
.garment-card{position:absolute;right:4%;top:27%;width:min(300px,30%);padding:20px;border:1px solid #b1f6e650;border-radius:14px;background:#092a25ed;backdrop-filter:blur(18px);box-shadow:0 12px 35px #0003;color:white;opacity:0;transform:translateY(8px);transition:opacity .25s .25s,transform .25s .25s}.inspecting .garment-card{opacity:1;transform:none}.garment-eyebrow{font-size:12px;color:#a8f2df}.garment-card h3{font-size:20px;line-height:1.2;margin:9px 0 15px;font-weight:600}.garment-card dl{margin:0}.garment-card dl div{display:flex;justify-content:space-between;gap:14px;border-top:1px solid #ffffff20;padding:7px 0;font-size:13px}.garment-card dt{color:#aed0c7}.garment-card dd{margin:0;text-align:right}.garment-card p{font-size:13px;line-height:1.5;margin:12px 0}.garment-card small{font-size:11px;color:#a8f2df}.inspecting figcaption small{visibility:hidden}
@media(max-width:720px){.garment-card{top:155px;right:18px;width:calc(100% - 36px);max-width:280px;padding:13px}.garment-card h3{font-size:16px;margin:5px 0 7px}.garment-card dl div{font-size:12px;padding:3px 0}.garment-card p{display:none}.garment-card small{display:block;margin-top:7px}.garment-path{opacity:.65}}
@media(prefers-reduced-motion:reduce){.garment-inspector *{transition:none!important}}

/* Keep the connector visually behind its origin button. */
.belt-scene figcaption :is(button,a)>span,.belt-scene figcaption :is(button,a):is(:hover,:focus-visible)>span{transform:none}
.garment-path .origin-cutout{stroke:none;fill:black;opacity:1;transition:none}
.garment-path .target-dot{fill:#093e32;stroke:#c7fff0;stroke-width:1.5}
.path-stroke{stroke-width:1.6;filter:drop-shadow(0 0 3px #85e8d455)}.path-halo{stroke-width:4;stroke:#05251d66}.path-tip{stroke-width:1.6}
.garment-card{border-color:#b1f6e638;box-shadow:0 16px 40px #0003}

/* Legible captions and a shared column of precision-drawn arrows. */
.belt-scene figcaption{inset:auto auto 24px 3%;width:clamp(330px,37vw,520px);max-width:calc(100% - 48px);padding:20px 22px;gap:0;background:#102b25;border:1px solid #446158;border-radius:14px;box-shadow:0 12px 32px #0003;font-family:Arial,Helvetica,sans-serif;color:#fff;text-shadow:none}
.belt-scene figcaption>span{font-family:inherit;font-size:clamp(21px,1.75vw,27px);font-weight:700;letter-spacing:0;line-height:1.3;margin:0 0 14px;gap:10px;text-shadow:none;text-wrap:initial}
.belt-scene figcaption>span:before{width:18px;height:2px;box-shadow:none}
.belt-scene figcaption button,.belt-scene .scene-product-link{display:grid;grid-template-columns:minmax(0,1fr) 44px;grid-template-rows:auto;column-gap:16px;align-items:center;width:100%;max-width:none;min-height:62px;padding:9px 0;margin:0;border:0;border-top:1px solid #ffffff24;border-radius:0;background:none;font-family:inherit;font-size:clamp(17px,1.4vw,21px);font-weight:500;line-height:1.35;letter-spacing:0;color:#fff;text-shadow:none}
.belt-scene figcaption small{display:none!important}
.belt-scene figcaption :is(button,a)>span{grid-column:2;grid-row:1;justify-self:end;align-self:center;width:44px;min-width:44px;max-width:44px;height:44px;min-height:44px;max-height:44px;aspect-ratio:1;border-radius:50%;padding:0;margin:0;border:1px solid #8eafa5;background:#21473b;backdrop-filter:none;box-sizing:border-box;display:grid;place-items:center;transform:none;color:#fff}
.belt-scene figcaption :is(button,a)>span svg{display:block;width:20px;height:20px;flex-shrink:0}
.belt-scene figcaption :is(button,a):is(:hover,:focus-visible)>span{background:#bdf5df;border-color:#bdf5df;color:#102b25;box-shadow:0 0 0 4px #bdf5df18;transform:none}
.garment-card{font-family:Arial,Helvetica,sans-serif;background:#102b25;backdrop-filter:none;color:#fff}.garment-card dt,.garment-card p{color:#e2eee9}.garment-card h3{letter-spacing:0}
@media(max-width:720px){.belt-scene figcaption{left:16px;bottom:16px;width:calc(100% - 32px);max-width:none;padding:16px 18px}.belt-scene figcaption>span{font-size:21px;margin-bottom:10px}.belt-scene figcaption button,.belt-scene .scene-product-link{font-size:17px;min-height:58px;column-gap:12px}.garment-card{top:145px;max-width:260px}}

.garment-card{max-width:calc(100% - 32px)}.garment-card dl div{font-size:12px;padding:5px 0}.garment-card h3{font-size:18px}.garment-card p{font-size:12px;margin:9px 0}.garment-card small{display:block;line-height:1.4}

.garment-card{padding:15px;border-radius:12px}.garment-card h3{font-size:17px;line-height:1.25;margin:7px 0 11px}.garment-card dl div{font-size:12px}.garment-card p{font-size:12px;line-height:1.4}.garment-card small{font-size:11px}

/* Lower framing keeps the trouser legs and reflective bands in view. */
.belt-scene-trousers>img{object-position:center 75%}

.belt-scene figcaption .auto-inspected{color:#a8f2df}.belt-scene figcaption .auto-inspected>span{background:#bdf5df;color:#102b25;border-color:#bdf5df;box-shadow:0 0 0 4px #bdf5df18}

/* Narrow edge dissolve: 1.5% overlap, with no blur or change to the scene size. */
.belt-scene+.belt-scene{margin-left:-1.5%;mask-image:linear-gradient(to right,transparent,#000 1.5%,#000);-webkit-mask-image:linear-gradient(to right,transparent,#000 1.5%,#000)}

.hero-wipe{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden;visibility:hidden}.hero-wipe span{position:absolute;inset:0;background:#006956;transform:translateX(-101%)}.hero-wipe span+span{background:#85e8d4}.hero-wipe.is-active{visibility:visible}.hero-wipe.is-active span{animation:megabor-wipe 1.1s cubic-bezier(.76,0,.24,1) both}.hero-wipe.is-active span+span{animation-delay:.08s;animation-duration:.94s}@keyframes megabor-wipe{0%{transform:translateX(-101%)}40%,60%{transform:translateX(0)}100%{transform:translateX(101%)}}@media(prefers-reduced-motion:reduce){.hero-wipe{display:none}.hero-wipe span{animation:none!important}}

/* Colored transition travels with the seam between continuously moving scenes. */
.scene-transition-edge{position:absolute;inset:0 auto 0 0;width:5%;z-index:3;pointer-events:none;background:linear-gradient(90deg,#006956 0%,#006956 30%,#85e8d4 30%,#85e8d4 52%,#85e8d400 100%)}.scene-transition-edge span{position:absolute;left:0;top:0;width:100%;height:50%;background:linear-gradient(90deg,#006956,#85e8d4 55%,transparent);transform:translateX(20%)}.scene-transition-edge span+span{top:50%;transform:translateX(-15%)}@media(prefers-reduced-motion:reduce){.scene-transition-edge{display:none}}

/* Clean horizontal passage: no colored overlays over images or captions. */
.scene-transition-edge,.hero-wipe{display:none!important}.belt-scene+.belt-scene{margin-left:0;mask-image:none;-webkit-mask-image:none}.belt-scene figcaption{z-index:3}

/* A subtle image-only dissolve along the moving seam. */
.belt-scene+.belt-scene{margin-left:-1.5%;mask-image:linear-gradient(90deg,transparent,#000 1.5%,#000);-webkit-mask-image:linear-gradient(90deg,transparent,#000 1.5%,#000)}

.belt-scene-trousers>img{object-position:center top}

.belt-scene-trousers{background:#163c32}.belt-scene-trousers>img{object-fit:contain;object-position:center center}

.belt-scene-trousers>img{position:absolute;top:-9%;left:-9%;width:118%;max-width:none;height:118%;object-fit:contain;object-position:center center}

.belt-scene-trousers{background-image:url("/assets/category-operational-wide-opt.webp");background-size:cover;background-position:center;background-color:#dae3de}

.belt-scene:has(>img[src*="category-polo-wide-opt.webp"]){background:url("/assets/category-polo-wide-opt.webp") center/cover}.belt-scene>img[src*="category-polo-wide-opt.webp"]{position:absolute;top:-4%;left:-4%;width:108%;max-width:none;height:108%;object-fit:contain;object-position:center}

.garment-full-sheet{display:none}@media(max-width:720px){.garment-card{padding:10px;border-radius:10px;pointer-events:auto}.garment-card h3{font-size:14px}.garment-card dl div{font-size:10px;gap:6px}.garment-card small{display:none}.garment-path{opacity:1}.garment-full-sheet{display:block;width:100%;margin-top:10px;padding:9px 5px;border:1px solid #a8f2df70;border-radius:6px;background:#bdf5df;color:#092a25;font-size:11px;font-weight:700;cursor:pointer}.belt-scene.inspecting{background-color:#163c32}.belt-scene.inspecting>img{background:#163c32}}