#spaces-surfaces{--red:#ed4028;--blue:#c5e4f1;--paper:#f4f1e8;--ink:#222923;--surface:var(--red);--on-surface:var(--paper);font-family:"Noto Sans KR",sans-serif;background:var(--paper);color:var(--ink);container-type:inline-size;overflow:clip;line-height:1.5;color-scheme:light;position:relative;width:100%}
#spaces-surfaces *{box-sizing:border-box}
#spaces-surfaces :is(h1,h2,h3,p,figure){font-family:inherit;margin:0}
#spaces-surfaces :is(button,a){font:inherit;color:inherit}
#spaces-surfaces button{padding:0;border:0;background:none;text-align:left;border-radius:0}
#spaces-surfaces img{display:block;max-width:100%}
#spaces-surfaces [hidden]{display:none!important}
#spaces-surfaces .mm-nav{padding:20px 4%;display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #22292328;background:var(--blue)}
#spaces-surfaces .mm-brand{font-size:24px;font-weight:750;letter-spacing:-1.3px;white-space:nowrap}
#spaces-surfaces .mm-brand span{font-size:15px;font-weight:600;letter-spacing:-.6px}
#spaces-surfaces .mm-nav-note{font-size:11px;letter-spacing:1px}
#spaces-surfaces .mm-intro{padding:40px 4% 44px;background:var(--blue);display:grid;grid-template-columns:1.8fr 1fr;gap:32px;align-items:end}
#spaces-surfaces .mm-kicker{font-size:11px;letter-spacing:1px;margin-bottom:20px}
#spaces-surfaces h1{font-size:clamp(30px,4.5cqw,49px);font-weight:600;letter-spacing:-2.7px;line-height:1.28;word-break:keep-all}
#spaces-surfaces .mm-intro-copy{font-size:14px;line-height:1.9;word-break:keep-all;max-width:280px;padding-bottom:4px}
#spaces-surfaces .mm-gallery{background:var(--surface);color:var(--on-surface);padding:27px 4% 34px;position:relative}
#spaces-surfaces .mm-section-label{display:flex;justify-content:space-between;align-items:center;gap:18px;padding-bottom:16px;border-bottom:1px solid currentColor;font-size:11px;letter-spacing:.7px}
#spaces-surfaces .mm-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-top:23px;position:relative}
#spaces-surfaces h2{font-size:clamp(58px,10.3cqw,115px);font-weight:500;line-height:.97;letter-spacing:-.075em;min-width:0}
#spaces-surfaces .mm-line{display:block;overflow:hidden;padding:0 .03em .065em;perspective:600px;transform:translateX(var(--line-x,0px));transition:transform .9s cubic-bezier(.16,1,.3,1)}
#spaces-surfaces .mm-line:last-child{margin-left:13cqw;margin-top:-.065em}
#spaces-surfaces .mm-word{display:inline-block;transform-origin:50% 100%;will-change:transform}
#spaces-surfaces .mm-heading-note{font-size:12px;line-height:1.7;max-width:180px;padding-bottom:10px;flex-shrink:0}
#spaces-surfaces .mm-heading-index{font-size:clamp(36px,5cqw,54px);letter-spacing:-.07em;line-height:1;margin-bottom:8px;font-weight:400;font-variant-numeric:tabular-nums;white-space:nowrap}
#spaces-surfaces .mm-stage{position:relative;margin-top:30px;isolation:isolate}
#spaces-surfaces .mm-grid{display:grid;grid-template-columns:4.5fr 3.2fr 3.3fr;gap:22px;align-items:start;transition:grid-template-columns 900ms cubic-bezier(.16,1,.3,1);position:relative}
#spaces-surfaces .mm-card{position:relative;min-width:0;transform:translateY(calc(var(--lift,0px) + var(--scroll-lift,0px)));transition:transform 900ms cubic-bezier(.16,1,.3,1)}
#spaces-surfaces .mm-card:nth-child(1){margin-top:48px}
#spaces-surfaces .mm-card:nth-child(2){margin-top:0}
#spaces-surfaces .mm-card:nth-child(3){margin-top:115px}
#spaces-surfaces .mm-photo{display:block;width:100%;overflow:hidden;position:relative;isolation:isolate;background:var(--blue)}
#spaces-surfaces .mm-card:nth-child(1) .mm-photo{height:31cqw;min-height:225px;max-height:330px}
#spaces-surfaces .mm-card:nth-child(2) .mm-photo{height:39cqw;min-height:280px;max-height:415px}
#spaces-surfaces .mm-card:nth-child(3) .mm-photo{height:25cqw;min-height:200px;max-height:267px}
#spaces-surfaces .mm-photo>img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;transform:scale(1.065) translate(var(--pan-x,0px),var(--pan-y,0px));transition:transform 900ms cubic-bezier(.16,1,.3,1);will-change:transform}
#spaces-surfaces .mm-shutters{display:flex;position:absolute;inset:0;pointer-events:none;z-index:4}
#spaces-surfaces .mm-shutters i{display:block;flex:1;background:var(--blue);transform:scaleY(0);transform-origin:50% 0;margin-right:-1px}
#spaces-surfaces .mm-shutters i:nth-child(even){transform-origin:50% 100%}
#spaces-surfaces .mm-caption{display:flex;justify-content:space-between;gap:8px;padding:14px 0 12px;border-bottom:1px solid #f4f1e866;overflow:hidden}
#spaces-surfaces .mm-caption h3{font-size:18px;letter-spacing:-.5px;line-height:1.2;font-weight:500}
#spaces-surfaces .mm-caption p{font-size:11px;margin-top:7px;word-break:keep-all}
#spaces-surfaces .mm-num{font-size:11px}
#spaces-surfaces .mm-view{position:absolute;z-index:3;left:var(--cursor-x,70%);top:var(--cursor-y,70%);padding:10px 13px;background:var(--blue);color:var(--ink);font-size:11px;white-space:nowrap;pointer-events:none;transform:translate(-50%,-30%) rotate(-7deg) scale(.7);opacity:0;transition:opacity .2s,transform .5s cubic-bezier(.16,1,.3,1)}
#spaces-surfaces .mm-photo:is(:hover,:focus-visible) .mm-view{opacity:1;transform:translate(-50%,-50%) rotate(0deg) scale(1)}
#spaces-surfaces[data-focus="0"] .mm-grid{grid-template-columns:5.7fr 2.65fr 2.65fr}
#spaces-surfaces[data-focus="1"] .mm-grid{grid-template-columns:3.3fr 5fr 2.7fr}
#spaces-surfaces[data-focus="2"] .mm-grid{grid-template-columns:3.4fr 2.6fr 5fr}
#spaces-surfaces[data-focus="0"] .mm-card:nth-child(1),#spaces-surfaces[data-focus="1"] .mm-card:nth-child(2),#spaces-surfaces[data-focus="2"] .mm-card:nth-child(3){--lift:-22px}
#spaces-surfaces[data-focus="0"] .mm-card:nth-child(2),#spaces-surfaces[data-focus="1"] .mm-card:nth-child(3),#spaces-surfaces[data-focus="2"] .mm-card:nth-child(1){--lift:12px}
#spaces-surfaces .mm-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-top:35px;font-size:12px;line-height:1.8}
#spaces-surfaces .mm-bottom-right{text-align:right}
#spaces-surfaces .mm-overlay{position:absolute;inset:0;z-index:6;color:var(--ink);overflow:hidden}
#spaces-surfaces .mm-overlay-bg{position:absolute;inset:0;background:var(--paper);z-index:0}
#spaces-surfaces .mm-flight{position:absolute;overflow:hidden;z-index:1;background:var(--paper)}
#spaces-surfaces .mm-flight img{position:absolute;max-width:none;object-fit:fill;will-change:left,top,width,height}
#spaces-surfaces .mm-info{position:absolute;right:0;top:0;width:31%;height:100%;padding:23px;z-index:2;background:var(--paper);display:flex;flex-direction:column;justify-content:center;gap:16px}
#spaces-surfaces .mm-info .mm-small{font-size:11px;letter-spacing:.5px}
#spaces-surfaces .mm-info h3{font-size:27px;line-height:1.3;letter-spacing:-1.2px;font-weight:500;word-break:keep-all}
#spaces-surfaces .mm-info p{font-size:12px;line-height:1.8;word-break:keep-all}
#spaces-surfaces .mm-swatch{width:100%;height:68px;object-fit:cover}
#spaces-surfaces .mm-swatch-label{font-size:11px;margin-top:5px}
#spaces-surfaces .mm-product{font-size:12px;min-height:40px;padding:7px 0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid;text-decoration:none}
#spaces-surfaces .mm-close{position:absolute;right:10px;top:8px;min-width:44px;min-height:44px;padding:10px!important;background:var(--paper)!important;color:var(--ink)!important;z-index:4;font-size:12px!important}
#spaces-surfaces .mm-overlay-number{position:absolute;bottom:14px;left:18px;z-index:2;background:var(--paper);color:var(--ink);padding:7px 10px;font-size:11px;letter-spacing:1px;pointer-events:none}
#spaces-surfaces .mm-foot{padding:23px 4%;background:var(--blue);display:flex;justify-content:space-between;gap:24px;font-size:11px;letter-spacing:.5px}
#spaces-surfaces[data-intensity="quiet"] .mm-card{--lift:0px!important}
#spaces-surfaces[data-motion="off"] *{transition:none!important;animation:none!important}
@container(max-width:650px){
#spaces-surfaces .mm-nav{padding:16px 6%}#spaces-surfaces .mm-brand{font-size:20px}#spaces-surfaces .mm-brand span{font-size:13px}#spaces-surfaces .mm-nav-note{display:none}
#spaces-surfaces .mm-intro{grid-template-columns:1fr;gap:22px;padding:30px 6% 34px}#spaces-surfaces h1{font-size:35px;letter-spacing:-2px}#spaces-surfaces .mm-intro-copy{max-width:100%;font-size:13px}
#spaces-surfaces .mm-gallery{padding:23px 6% 27px}#spaces-surfaces .mm-section-label{gap:10px;letter-spacing:0;font-size:11px}
#spaces-surfaces .mm-heading{margin-top:24px}#spaces-surfaces h2{font-size:14cqw}#spaces-surfaces .mm-line:last-child{margin-left:12cqw}#spaces-surfaces .mm-heading-note{display:none}
#spaces-surfaces .mm-grid,#spaces-surfaces[data-focus] .mm-grid{grid-template-columns:1fr 1fr;gap:26px 14px}#spaces-surfaces .mm-stage{margin-top:24px}
#spaces-surfaces .mm-card:nth-child(1){grid-column:1/-1;margin:0}#spaces-surfaces .mm-card:nth-child(2){margin:0}#spaces-surfaces .mm-card:nth-child(3){margin:36px 0 0}
#spaces-surfaces .mm-card:nth-child(1) .mm-photo{height:57cqw;min-height:0;max-height:none}#spaces-surfaces .mm-card:nth-child(2) .mm-photo{height:65cqw;min-height:0;max-height:none}#spaces-surfaces .mm-card:nth-child(3) .mm-photo{height:45cqw;min-height:0;max-height:none}
#spaces-surfaces .mm-caption h3{font-size:16px}#spaces-surfaces .mm-caption{padding-top:11px}#spaces-surfaces .mm-card{--lift:0px!important;--scroll-lift:0px!important}
#spaces-surfaces .mm-view{left:auto;top:auto;bottom:8px;right:8px;transform:none!important;opacity:1;padding:8px;font-size:11px}#spaces-surfaces .mm-view-label{display:none}
#spaces-surfaces .mm-info{top:auto;bottom:0;width:100%;height:224px;padding:18px;display:grid;grid-template-columns:1.4fr 1fr;gap:8px 15px;align-content:center}
#spaces-surfaces .mm-info h3{font-size:21px;grid-column:1/-1}#spaces-surfaces .mm-info .mm-small{grid-column:1/-1}#spaces-surfaces .mm-info p{font-size:11px}#spaces-surfaces .mm-swatch{height:45px}#spaces-surfaces .mm-swatch-label{font-size:10px}#spaces-surfaces .mm-product{grid-column:1/-1;min-height:44px;font-size:11px}
#spaces-surfaces .mm-overlay-number{bottom:237px;font-size:10px;left:10px}#spaces-surfaces .mm-bottom{font-size:11px;gap:15px;margin-top:24px}#spaces-surfaces .mm-foot{font-size:10px;gap:18px}
}
@media(prefers-reduced-motion:reduce){#spaces-surfaces *{transition:none!important;animation:none!important}}

#spaces-surfaces{scroll-margin-top:96px}
#spaces-surfaces :is(.mm-heading h2,.mm-caption h3,.mm-heading-index){font-family:"Inter Tight",Arial,sans-serif}
#spaces-surfaces .mm-intro{padding-block:clamp(40px,5vw,90px)}
#spaces-surfaces .mm-intro-copy{max-width:390px}
#spaces-surfaces :is(.mm-kicker,.mm-section-label,.mm-caption p,.mm-num,.mm-info .mm-small,.mm-swatch-label){font-size:12px}
#spaces-surfaces :is(.mm-info p,.mm-product,.mm-bottom){font-size:14px}
#spaces-surfaces button:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
@container(max-width:650px){
 #spaces-surfaces .mm-info{height:248px;padding:16px;gap:6px 12px}
 #spaces-surfaces .mm-overlay-number{bottom:260px}
 #spaces-surfaces .mm-info p{font-size:12px}
 #spaces-surfaces .mm-info h3{font-size:20px}
 #spaces-surfaces .mm-bottom{font-size:12px}
}