/* Original Detroit Home geometry; the portfolio grid is reached through Work. */
.opening{height:calc(100svh - 74px);min-height:0;max-height:none;overflow:clip}
.frame-stair{height:calc(100% - 50px);bottom:50px;display:block;touch-action:pan-y}
.rail-group{display:contents}
.animated-rail{overflow:visible;cursor:grab}
.animated-rail.is-dragging{cursor:grabbing}
.animated-rail .stair-frame:nth-child(n){position:absolute;left:0;bottom:0;flex:none;width:var(--base-width);height:var(--base-height);transform-origin:bottom left;will-change:transform,scale;touch-action:pan-y}
.animated-rail .stair-frame img,.animated-rail .stair-frame video{width:110%;max-width:none;height:100%;object-fit:cover;transform:translateX(var(--inner-x,0%));transition:transform .6s cubic-bezier(.33,1,.68,1),opacity .22s}
.animated-rail .stair-frame:hover img,.animated-rail .stair-frame:hover video{transform:translateX(var(--inner-x,0%)) scale(1.03)}
.animated-rail .stair-number{transform:scale(var(--inverse-scale,1));transform-origin:top left}
.animated-rail .stair-label{right:auto;white-space:nowrap;transform:translateY(12px) scale(var(--inverse-scale,1));transform-origin:bottom left;transition:transform .4s cubic-bezier(.33,1,.68,1),opacity .4s}
.animated-rail .stair-frame:hover .stair-label,.animated-rail .stair-frame:focus-visible .stair-label{transform:translateY(0) scale(var(--inverse-scale,1));opacity:1}
.opening-type{z-index:20}.opening-index{z-index:20;pointer-events:none}.opening-baseline{z-index:30;background:var(--paper)}
.native-rail{display:flex;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x pan-y;gap:0;height:min(36svh,360px);bottom:60px;cursor:auto}
.native-rail::-webkit-scrollbar{display:none}
.native-rail .rail-group{display:flex;flex:none;align-items:flex-end;gap:14px;padding-right:14px;height:100%}
.native-rail .stair-frame:nth-child(n){position:relative;flex:0 0 auto;width:65vw;height:100%;transform:none!important;scale:1!important}
.native-rail .stair-frame img,.native-rail .stair-frame video{width:100%;height:100%;max-width:100%;transform:none!important}
.native-rail .stair-label{display:flex;opacity:1;transform:none;white-space:normal;left:15px;bottom:15px;font-size:11px}
.native-rail .stair-label::before{content:'Play';font-size:9px;margin-right:10px}
.native-rail .stair-frame::after{opacity:1}
.play-label{font-size:11px;gap:18px;border-bottom:1px solid #fff9;padding-bottom:5px}
.play-label span{font-size:17px}
@media(min-width:768px) and (max-height:760px){.opening h1{font-size:min(16.2vw,27svh)}.opening-note{margin-top:15px}.opening-type{top:12px}.opening-index{top:18px}.animated-rail .stair-frame:nth-child(n){height:min(var(--base-height),47svh)}}
@media(max-width:1000px) and (min-width:768px){.opening h1{font-size:16.2vw}.opening-note{font-size:11px}.opening-index{width:130px}}
@media(max-width:767px){.site-header{height:64px}.opening{height:calc(100svh - 64px);min-height:0}.opening-type{top:24px;left:var(--gutter);right:var(--gutter)}.opening h1{font-size:min(21.6vw,16svh);line-height:.84}.opening-note{font-size:11px;margin-top:20px}.opening-index{top:auto;bottom:calc(min(36svh,360px) + 73px);left:var(--gutter);right:auto;width:145px;font-size:9px}.opening-baseline{height:60px;font-size:9px}.native-rail .stair-frame:nth-child(n){width:65vw}.stair-number{font-size:10px;left:12px;top:12px}.opening-baseline>span{max-width:155px;line-height:1.4}.opening-baseline a{gap:10px}}
@media(prefers-reduced-motion:reduce) and (min-width:768px){.native-rail{height:42svh;bottom:50px}.native-rail .stair-frame:nth-child(n){width:36vw}.opening h1{font-size:min(16.2vw,22svh)}}
