/* Arev Studio clothing rack (store 1) — test page. Transform/opacity animations only. */
.rack-stage{--rack-h:380px;--rack-room:#cfc6b8;--rack-room-hi:#efe9df;position:relative;isolation:isolate;height:580px;overflow:hidden;
 background:radial-gradient(120% 90% at 50% 30%,#f2ede5 0,#e7e0d4 62%,#d9d0c1 100%);color:#2a2620;contain:layout paint;user-select:none;-webkit-user-select:none}
.rack-rail{position:absolute;z-index:1;left:0;right:0;top:58px;height:7px;background:linear-gradient(#f0dfb4,#c09a62 45%,#8c6b40);box-shadow:0 7px 12px #3b2a1430}
.rack-rail::before,.rack-rail::after{content:"";position:absolute;bottom:3px;width:4px;height:62px;background:linear-gradient(90deg,#8c6b40,#e3cc98 50%,#8c6b40)}
.rack-rail::before{left:7%}.rack-rail::after{right:7%}
.rack-scroll{position:absolute;z-index:2;inset:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;outline-offset:-3px}
.rack-scroll::-webkit-scrollbar{display:none}.rack-scroll:focus-visible{outline:2px solid #b08a52}
.rack-track{display:flex;align-items:flex-start;gap:22px;padding:55px 40px 0;width:max-content}
#shopView .rack-item{position:relative;display:block;flex:none;padding:30px 0 0;border:0;background:none;cursor:pointer;transform-origin:50% 3px;touch-action:pan-x pan-y;-webkit-tap-highlight-color:transparent;transition:none}
.rack-item:active:not(:disabled){transform:none}
/* hook: curls over the rail, runs behind the collar (z below the photo) */
.rack-hanger{position:absolute;z-index:0;left:50%;top:0;width:22px;height:44px;margin-left:-11px;pointer-events:none}
.rack-hanger svg{display:block;width:100%;height:100%}
.rack-img{position:relative;z-index:1;display:block;height:calc(var(--rack-h) * var(--rack-scale,1));width:auto;max-width:none;
 filter:drop-shadow(6px 18px 16px #2b221824);transition:transform 260ms cubic-bezier(.22,1,.36,1)}
.rack-jacket .rack-hanger{height:36px}.rack-jacket .rack-img{margin-top:-2px}
.rack-knit .rack-img,.rack-panel .rack-img{margin-top:-4px}
.rack-drape .rack-img{margin-top:-3px}
.rack-hint{position:absolute;z-index:3;left:24px;right:24px;bottom:22px;margin:0;text-align:center;font-size:13px;color:#6e6457;pointer-events:none;transition:opacity 200ms ease}
.rack-nav{position:absolute;z-index:3;top:calc(50% + 10px);width:46px;height:46px;margin-top:-23px;border-radius:50%;border:1px solid #2a262022;background:#f7f3ecdd;color:#2a2620;display:none;place-items:center;padding:0}
.rack-nav svg{width:22px;height:22px}.rack-prev{left:16px}.rack-next{right:16px}.rack-nav:disabled{opacity:.25}
@media (hover:hover) and (pointer:fine){.rack-nav{display:grid}.rack-item:hover .rack-img{transform:translateY(-6px)}.rack-nav:not(:disabled):hover{background:#fff}}
/* showroom window: the room takes the garment's tone (as in the reference video) */
.rack-veil{position:absolute;z-index:5;inset:0;opacity:0;pointer-events:none;background-color:var(--rack-room);
 -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:opacity 460ms cubic-bezier(.22,1,.36,1),background-color 760ms ease}
.rack-veil::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 55% at 38% 46%,var(--rack-room-hi),transparent 70%);opacity:.75}
.rack-stage.is-focused .rack-veil{opacity:.96;pointer-events:auto}
.rack-stage.is-focused .rack-hint,.rack-stage.is-focused .rack-nav{opacity:0;pointer-events:none}
.rack-figure{position:absolute;z-index:6;transform-origin:0 0;pointer-events:none;will-change:transform}
.rack-figure-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 26px 30px #120d0838)}
.rack-floor{position:absolute;z-index:5;height:20px;border-radius:50%;background:radial-gradient(closest-side,#0e0a0640,transparent);opacity:0;pointer-events:none}
.rack-stage.is-focused .rack-floor{opacity:1}
#shopView .rack-thumb{position:absolute;z-index:7;right:26px;bottom:26px;width:86px;height:86px;padding:6px;border:1px solid #ffffff55;border-radius:10px;background:#ffffff22;display:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.rack-thumb img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 8px #0000002e)}
#shopView .rack-stage.is-focused .rack-thumb:not([hidden]){display:block}
.rack-detail{position:absolute;z-index:7;left:62%;right:5%;top:20%;color:#231f1a;transition:color 500ms ease}
.rack-detail h3{font:400 clamp(30px,3.2vw,46px)/1.06 Georgia,serif;letter-spacing:-.02em;margin:0 0 10px}
.rack-color-name{margin:0 0 16px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.rack-detail strong{display:block;font-size:22px;font-weight:400;margin-bottom:12px}
.rack-note{margin:0 0 20px;font-size:15px;line-height:1.55;opacity:.82}
.rack-swatches{display:flex;gap:12px;margin-bottom:18px}
#shopView .rack-swatches button{width:34px;height:34px;border-radius:50%;padding:0;border:2px solid #f6f1e9;background:var(--sw);box-shadow:0 0 0 1px #2a262033;cursor:pointer;transition:box-shadow 160ms ease}
#shopView .rack-swatches button[aria-pressed=true]{box-shadow:0 0 0 2px currentColor}
.rack-views{display:inline-flex;border:1px solid currentColor;border-radius:30px;padding:3px;margin-bottom:16px}
.rack-views[hidden]{display:none}
#shopView .rack-views button{min-height:40px;padding:0 18px;border:0;border-radius:30px;background:transparent;color:inherit;font-size:13px}
#shopView .rack-views button[aria-pressed=true]{background:#231f1a;color:#f6f1e9}
.rack-demo{font-size:12px;opacity:.65;margin:4px 0 0}
.rack-stage.is-dark .rack-detail{color:#f4efe7}
#shopView .rack-stage.is-dark .rack-views button[aria-pressed=true]{background:#f4efe7;color:#1c1814}
#shopView .rack-back{position:absolute;z-index:8;top:18px;left:20px;display:none;align-items:center;gap:10px;min-height:44px;padding:10px 16px;border:0;border-radius:3px;background:#231f1a;color:#f6f1e9;font-size:14px}
#shopView .rack-stage.is-dark .rack-back{background:#f4efe7;color:#1c1814}
.rack-back svg{width:20px;height:20px}
#shopView .rack-stage.is-focused .rack-back{display:inline-flex}
@media(max-width:700px){
 .rack-stage{--rack-h:255px;height:600px}
 .rack-track{gap:16px;padding:55px 22px 0}
 #shopView .rack-thumb{right:14px;bottom:auto;top:250px;width:66px;height:66px;padding:5px}
 .rack-detail{left:20px;right:20px;top:auto;bottom:20px;display:grid;grid-template-columns:1fr auto;gap:2px 14px;align-items:end}
 .rack-detail h3{font-size:28px;margin:0}.rack-detail strong{grid-column:2;grid-row:1;font-size:18px;margin:0 0 4px;white-space:nowrap}
 .rack-color-name{grid-column:1/-1;margin:4px 0 10px}.rack-note{display:none}
 .rack-swatches{grid-column:1/-1;margin-bottom:12px}.rack-views{grid-column:1/-1;justify-self:start;margin-bottom:8px}.rack-demo{grid-column:1/-1}
 .rack-hint{font-size:12px}
}
@media(max-height:560px) and (min-width:701px){.rack-stage{--rack-h:250px;height:420px}.rack-detail{top:12%}}
@media(prefers-reduced-motion:reduce){.rack-veil,.rack-img,.rack-hint,.rack-detail{transition:none}}
