.rail-section{position:relative;isolation:isolate;padding-block:var(--sp-7) var(--sp-8);overflow:hidden}.rail-section__head{display:grid;justify-items:center;gap:var(--sp-2);text-align:center}.rail-section__title{margin:0;font-size:var(--fs-h2)}.rail-section__hint{margin:0;color:var(--on-surface-muted);font-size:var(--fs-body-sm)}.rail-section__empty{padding-block:var(--sp-9);text-align:center}.rail-hanger{display:block;width:64%;height:auto;margin-inline:auto;overflow:visible}.rail-hanger__hook{stroke:#8a6a3f}.rail-hanger__bar{fill:#c99d6b}.rail{--card-w: 200px;position:relative;margin-top:var(--sp-6);padding-top:6px}.rail__rod{position:absolute;top:14px;left:max(var(--gutter),calc((100% - var(--page-width)) / 2 + var(--gutter)));right:max(var(--gutter),calc((100% - var(--page-width)) / 2 + var(--gutter)));height:4px;border-radius:4px;background:linear-gradient(180deg,#d9bb8c,#a8814e 60%,#8a6a3f);box-shadow:0 2px 4px rgba(var(--color-espresso-rgb),.18)}.rail__list{display:flex;justify-content:center;margin:0;padding:0;list-style:none}.rail__item{position:relative;flex:0 0 var(--w, 60px);height:440px;z-index:var(--z, 1);transition:flex-basis .45s var(--ease)}.rail__piece{position:absolute;top:0;left:50%;display:block;width:var(--card-w);padding:0;border:0;background:none;cursor:pointer;transform-origin:50% 10px;transform:translate(-50%) perspective(900px) rotateY(var(--ry, -62deg)) scale(var(--s, .94));transition:transform .45s var(--ease),filter .45s var(--ease);filter:brightness(var(--b, .9));-webkit-tap-highlight-color:transparent}.rail__piece:focus-visible{outline:none}.rail__piece:focus-visible .rail__garment{outline:2px solid var(--color-espresso);outline-offset:4px}.rail__garment{position:relative;display:block;width:100%;aspect-ratio:.86;margin-top:-6px;overflow:hidden;background:var(--color-blush);clip-path:polygon(0 10%,24% 0,76% 0,100% 10%,100% 100%,0 100%);box-shadow:0 18px 30px -18px rgba(var(--color-espresso-rgb),.45)}.rail__garment img,.rail__garment .media-fallback{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%;-webkit-user-select:none;user-select:none}.rail__caption{display:grid;justify-items:center;gap:4px;min-height:52px;margin-top:var(--sp-3);text-align:center}.rail__name,.rail__price{margin:0}.rail__name{font-size:var(--fs-label);font-weight:var(--fw-semibold);letter-spacing:var(--ls-label);text-transform:uppercase}.rail__price{font-size:var(--fs-body-sm);color:var(--on-surface-muted)}@media(max-width:989px),(hover:none){.rail{--card-w: 170px}.rail__rod{left:0;right:0}.rail__list{justify-content:flex-start;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-inline:var(--gutter);scrollbar-width:none}.rail__list::-webkit-scrollbar{display:none}.rail__item{flex:0 0 var(--card-w);height:370px;scroll-snap-align:center}.rail__piece{transform:translate(-50%);filter:none}}.rail-section.is-staged .rail{display:none}.rail-stage{position:relative;display:grid;justify-items:center;gap:var(--sp-5);padding:var(--sp-5) var(--gutter) 0}.rail-stage[hidden]{display:none}.rail-stage__scene{position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:start;width:min(100%,1100px)}.rail-stage__hero{position:relative;width:min(340px,64vw);animation:rail-in .55s var(--ease) both}.rail-stage__hero .rail__garment{margin-top:-8px}.rail-stage__garment img{transition:opacity .3s var(--ease)}.rail-stage__ghost{align-self:center;width:min(240px,26vw);opacity:.55;filter:blur(7px) saturate(.85);pointer-events:none}.rail-stage__ghost--prev{justify-self:end;margin-right:clamp(8px,4vw,70px)}.rail-stage__ghost--next{justify-self:start;margin-left:clamp(8px,4vw,70px)}.rail-stage__ghost .rail__garment{margin-top:0}.is-cutout>.rail-hanger{position:relative;width:50%}.is-cutout>.rail__garment{z-index:1;aspect-ratio:auto;margin-top:-19.1667%;overflow:visible;background:none;clip-path:none;box-shadow:none;filter:drop-shadow(0 16px 18px rgba(var(--color-espresso-rgb),.28))}.is-cutout>.rail__garment img{position:static;display:block;height:auto}.is-cutout:after{content:"";position:absolute;top:0;left:25%;z-index:2;width:50%;aspect-ratio:120 / 46;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 46'%3E%3Cpath d='M60 23V15c0-3.6 2.9-6.5 6.5-6.5S73 11.4 73 15' fill='none' stroke='%238a6a3f' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 0 0 / 100% 100%;pointer-events:none}.rail-stage__ghost.is-cutout{position:relative}.rail-stage__hero.is-cutout{width:min(340px,64vw,calc(66vh / var(--ar, 1)))}.rail-stage__hero.is-cutout>.rail__garment{filter:drop-shadow(0 22px 24px rgba(var(--color-espresso-rgb),.3))}.rail-stage__ghost.is-cutout{width:min(240px,26vw,calc(56vh / var(--ar, 1)))}.rail-stage__tags{position:absolute;top:18px;left:calc(100% + 6px);display:flex;gap:10px}.swing-tag{position:relative;display:grid;place-items:center;align-content:start;gap:8px;width:34px;height:118px;padding-top:20px;border-radius:4px 4px 3px 3px;font-size:7px;font-weight:var(--fw-semibold);letter-spacing:.12em;text-transform:uppercase;transform-origin:50% -26px;animation:rail-swing 3.2s ease-in-out infinite alternate}.swing-tag:before{content:"";position:absolute;top:7px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--color-cream);box-shadow:inset 0 0 0 1px #00000026}.swing-tag:after{content:"";position:absolute;bottom:100%;left:50%;width:1px;height:26px;background:rgba(var(--color-espresso-rgb),.45)}.swing-tag--brand{background:var(--color-espresso);color:var(--color-cream)}.swing-tag--brand .knot{--knot-size: 16px;color:var(--color-apricot)}.swing-tag__word{writing-mode:vertical-rl;transform:rotate(180deg)}.swing-tag--price{margin-top:14px;background:#d8b48a;color:var(--color-espresso);animation-delay:-1.4s}.swing-tag--price span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:8px}.rail-stage__info{display:grid;justify-items:center;gap:var(--sp-4);text-align:center}.rail-stage__title{margin:0;font-family:var(--font-body);font-size:clamp(.95rem,.85rem + .4vw,1.2rem);font-weight:var(--fw-semibold);letter-spacing:.08em;text-transform:uppercase}.rail-stage__views{display:inline-flex;padding:3px;border:1px solid rgba(var(--color-espresso-rgb),.35);border-radius:999px}.rail-stage__views:empty{display:none}.rail-stage__view{min-height:30px;padding:0 16px;border:0;border-radius:999px;background:none;font-size:11px;font-weight:var(--fw-semibold);letter-spacing:var(--ls-label);text-transform:uppercase;cursor:pointer}.rail-stage__view[aria-pressed=true]{background:var(--color-espresso);color:var(--color-cream)}.rail-stage__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--sp-5)}.rail-stage__link{padding:0;border:0;background:none;font-size:var(--fs-label);font-weight:var(--fw-semibold);letter-spacing:var(--ls-label);text-transform:uppercase;text-decoration:underline;text-underline-offset:.45em;cursor:pointer}.rail-stage__link--muted{color:var(--on-surface-muted)}.rail-stage__link[disabled]{opacity:.45;pointer-events:none}.rail-stage__close,.rail-stage__arrow{position:absolute;z-index:2;display:grid;place-items:center;width:46px;height:46px;border:1px solid rgba(var(--color-espresso-rgb),.18);border-radius:50%;background:rgba(var(--color-cream-rgb),.8);cursor:pointer;transition:background var(--dur-fast) var(--ease)}.rail-stage__close:hover,.rail-stage__arrow:hover{background:var(--color-apricot)}.rail-stage__close svg,.rail-stage__arrow svg{width:18px;height:18px}.rail-stage__close{top:0;right:var(--gutter)}.rail-stage__arrow{top:190px}.rail-stage__arrow--prev{left:var(--gutter)}.rail-stage__arrow--next{right:var(--gutter)}@media(max-width:749px){.rail-stage__ghost{display:none}.rail-stage__scene{grid-template-columns:1fr;justify-items:center}.rail-stage__hero,.rail-stage__hero.is-cutout{width:min(260px,62vw,calc(56vh / var(--ar, 1)))}.rail-stage__tags{left:auto;right:calc(100% - 2px)}.rail-stage__arrow{top:300px;width:40px;height:40px}}@keyframes rail-in{0%{opacity:0;transform:translateY(-14px) scale(.94)}to{opacity:1;transform:none}}@keyframes rail-swing{0%{transform:rotate(-4deg)}to{transform:rotate(4deg)}}@media(prefers-reduced-motion:reduce){.rail__item,.rail__piece{transition:none}.rail-stage__hero,.swing-tag{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/collection-rail.css.map */