/* ---- v5 motion layer ---- */
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:60;pointer-events:none}
.progress span{display:block;height:100%;background:var(--acc);transform-origin:0 50%;transform:scaleX(0)}
.hd{transition:background .3s,color .3s,border-color .3s,transform .45s cubic-bezier(.2,.7,.2,1)}
.hd.is-hidden{transform:translateY(-100%)}

/* scroll zoom scenes (hero + wall): one photo, camera dolly into its own marble */
.zoom{position:relative;background:#111}
.zoom__stage{position:relative;height:100vh;height:100svh;overflow:hidden;background:#111}
.zoom__tilt{position:absolute;inset:0;transform-origin:50% 100%}
.zoom__cam{position:absolute;inset:0;transform-origin:0 0}
.zoom__cam img{display:block;width:100%;height:100%;object-fit:cover;max-width:none}
.zoom__cam.is-sized img{object-fit:fill}
.zoom--wall .zoom__cam img{object-position:45% 50%}
.zoom__shade{position:absolute;inset:0;pointer-events:none;z-index:1}
.hero .zoom__shade{background:linear-gradient(180deg,rgba(0,0,0,.38) 0,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 50%,rgba(0,0,0,.45) 100%)}
.zoom__shade::after{content:"";position:absolute;inset:0;opacity:var(--vig,0);background:radial-gradient(130% 100% at 50% 55%,rgba(0,0,0,0) 45%,rgba(0,0,0,.55) 100%)}
.zoom--wall .zoom__shade::after{background:radial-gradient(130% 100% at 50% 55%,rgba(0,0,0,0) 50%,rgba(40,20,22,.28) 100%)}
.zoom__name{position:absolute;z-index:3;left:max(var(--pad),calc((100vw - 1440px)/2 + var(--pad)));bottom:84px;color:#fff;opacity:0;text-shadow:0 1px 14px rgba(0,0,0,.35)}
.zoom__name .en{display:block;font-family:"Cormorant",serif;font-weight:400;font-size:clamp(48px,7vw,104px);line-height:1;letter-spacing:-.01em}
.zoom__name .ko{display:block;margin-top:16px;font-size:14px;letter-spacing:.04em;opacity:.9}
.zoom__name:hover .en{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:10px}
.zoom--wall .zoom__name{color:#2a1a1c;text-shadow:none}
.hero::after{display:none}
.hero{height:auto;max-height:none;min-height:0}
.hero__txt{z-index:3}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.06em}
.hero h1 .ln>span{display:inline-block;will-change:transform}
.js:not(.rm) .hero h1 .ln>span{transform:translateY(110%)}
.js:not(.rm) .hero__sub{opacity:0}
.hero__hint{position:absolute;z-index:3;right:max(var(--pad),calc((100vw - 1440px)/2 + var(--pad)));bottom:100px;color:#fff;font-size:12px;letter-spacing:.2em;opacity:.7;padding-bottom:46px}
.hero__hint::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:36px;background:currentColor;transform-origin:50% 0;animation:hint 2.2s cubic-bezier(.6,0,.3,1) infinite}
@keyframes hint{0%{transform:scaleY(0)}50%{transform:scaleY(1);transform-origin:50% 0}51%{transform-origin:50% 100%}100%{transform:scaleY(0);transform-origin:50% 100%}}
.rm .zoom__name{opacity:1}.rm .hero__hint{display:none}
.rm .zoom__name{bottom:28px}.rm .zoom__name .en{font-size:20px}.rm .zoom--wall .zoom__name{color:#fff}

/* product grid */
.grid .ph img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.grid a:hover .ph img{transform:scale(1.06)}

/* spaces – horizontal */
.spaces{background:#141414;color:#fff;overflow:hidden}
.spaces__pin{height:100vh;display:flex;flex-direction:column;justify-content:center;gap:40px}
.spaces__head{display:flex;align-items:baseline;justify-content:space-between;width:100%}
.spaces__head p{font-size:14px;color:#9a9a9a}
.spaces__track{display:flex;gap:32px;padding:0 max(var(--pad),calc((100vw - 1440px)/2 + var(--pad)));will-change:transform}
.sp{flex:0 0 auto;width:min(62vw,940px)}
.sp__ph{display:block;aspect-ratio:16/9;max-height:62vh;overflow:hidden}
.sp__ph img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:filter .4s}
.sp:hover .sp__ph img{filter:brightness(1.06)}
.sp__cap{display:flex;gap:14px;align-items:baseline;margin-top:16px}
.sp .en{margin:0;color:#fff}.sp .ko{margin:0;color:#9a9a9a}
.sp:hover .en{color:#d9a7ae}

/* about */
.about__txt .w{opacity:.14;transition:none}
.rm .about__txt .w{opacity:1}
.about__clip{overflow:hidden}
.about__img img{will-change:transform;transform:scale(1.15)}
.rm .about__img img{transform:none}

/* generic fade-up */
.js:not(.rm) [data-up]{opacity:0;transform:translateY(40px)}

@media (max-width:1023px){
  .spaces__pin{height:auto;padding:96px 0}
  .spaces__track{flex-direction:column;gap:44px;padding:0 var(--pad)}
  .sp{width:100%}
  .sp__ph{aspect-ratio:4/3;max-height:none}
}
@media (max-width:767px){
  .zoom__name{bottom:64px}.zoom__name .ko{font-size:12px;margin-top:10px}
  .hero__hint{bottom:28px;padding-bottom:40px}
  .spaces__head{flex-direction:column;gap:6px}
  .sp__cap{flex-direction:column;gap:2px}
}