.category-section { touch-action: pan-y; }
.category-layout { grid-template-columns: .8fr 1.4fr; gap: 3%; }
.work-carousel { min-width: 0; position: relative; }
.work-carousel-stage { position: relative; display: flex; align-items: center; justify-content: center; padding: 32px 0 38px; isolation: isolate; overflow: hidden; }
.work-carousel .category-visual { width: 74%; flex: 0 0 74%; z-index: 2; transition: filter .36s ease, opacity .36s ease, transform .36s ease; }
.work-preview { position: absolute; width: 45%; height: 64%; object-fit: cover; top: 18%; border-radius: 16px; opacity: .25; filter: blur(12px) saturate(.7); pointer-events: none; z-index: 0; }
.work-preview.previous { left: -10%; mask-image: linear-gradient(90deg,transparent,#000 70%); }
.work-preview.next { right: -10%; mask-image: linear-gradient(270deg,transparent,#000 70%); }
.work-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; border: 1px solid #fff; color: #fff; background: #19181770; backdrop-filter: blur(14px); font-size: 24px; transition: background .3s,box-shadow .3s; }
.work-arrow.previous { left: 2%; }.work-arrow.next { right: 2%; }
.work-arrow:hover,.work-arrow:focus-visible { background: var(--orange); border-color: #fff; box-shadow: 0 4px 22px #ff732d40; }
.work-dots { display: flex; justify-content: center; gap: 8px; }
.work-dots button { position: relative; width: 28px; height: 28px; padding: 0; background: transparent; border-radius: 50%; }
.work-dots button::after { content: ''; position: absolute; inset: 9px; border-radius: 50%; background: #ffffff66; transition: transform .25s,background .25s; }
.work-dots button[aria-current="true"]::after { background: var(--orange); transform: scale(1.3); }
.work-dots button:hover::after { background: #fff; }
.work-slide-status { display: block; text-align: center; font-size: 10px; letter-spacing: 1px; margin-top: 5px; }
.work-carousel.switching .category-visual { filter: blur(12px); opacity: .45; transform: scale(.975); }
.work-dragging { user-select: none; cursor: grabbing; }
@media(min-width:701px) {
 :is(#ecommerce,#packaging,#editorial,#amazon) .category-layout { grid-template-columns: 1.4fr .8fr; }
 :is(#ecommerce,#packaging,#editorial,#amazon) .work-carousel { grid-column: 1; grid-row: 1; }
}
@media(max-width:700px) {
 .category-layout { grid-template-columns: 1fr; }
 .work-arrow { width: 36px; height: 36px; font-size: 19px; }
 .work-arrow.previous { left: 0; }.work-arrow.next { right: 0; }
 .work-carousel .category-visual { width: 76%; flex-basis: 76%; }
 .work-carousel-stage { padding-top: 20px; padding-bottom: 24px; }
 .work-carousel .category-image-label { font-size: 8px; padding: 7px; left: 7px; right: 7px; }
 .work-carousel .category-image-label b { width: 24px; height: 24px; font-size: 16px; }
}
