@font-face{font-family:Inter;src:url(assets/InterVariable.woff2) format('woff2');font-weight:100 900;font-display:swap}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font:var(--kit-type-body-size)/var(--kit-type-body-leading) var(--kit-font-body);color:var(--kit-color-foreground);background:var(--kit-color-canvas);--scene-ease:cubic-bezier(.2,.85,.2,1);--scene-duration:720ms;--panel-width:max(448px,30vw)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;border:0;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--kit-color-secondary);outline-offset:6px}button:disabled{cursor:default}a{color:inherit;text-decoration:none}button svg{display:block}main{height:100%}.sound{position:fixed;top:16px;left:16px;padding:0;background:none;color:var(--kit-color-secondary);opacity:.6;z-index:50;transition:opacity .25s,transform .2s}.sound:hover,.sound:focus-visible{opacity:1}.sound:active{transform:scale(.85)}.sound-waves{display:none}.sound[aria-pressed=true] .sound-waves{display:block}.sound[aria-pressed=true] .sound-off{display:none}.stage{position:fixed;inset:0;pointer-events:none;overflow:hidden}.objects{position:absolute;inset:0}.project-position{position:absolute;left:50%;top:50%;width:250px;height:270px;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(var(--scale));opacity:var(--opacity,1);transition:transform var(--scene-duration) var(--scene-ease),opacity 600ms ease;will-change:transform;--scale:1}.project-position[data-project="48"]{--x:-109px;--y:-8px;--rotation:-8deg;z-index:2}.project-position[data-project="6000"]{--x:109px;--y:15px;--rotation:8deg;z-index:1}.project{width:100%;height:100%;padding:0;background:none;position:relative;pointer-events:auto;touch-action:none;outline-offset:12px!important;border-radius:35px;transform:translate(var(--drag-x,0px),var(--drag-y,0px));transition:transform 600ms var(--kit-motion-elastic)}.float{display:block;height:100%;width:100%;animation:float 6.4s ease-in-out infinite}.project-position:nth-child(2) .float{animation-delay:-2.4s;animation-duration:7s}.artwork{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative;border:1px dashed var(--kit-color-divider);border-radius:35px;background:var(--kit-color-surface);transform:rotate(var(--rotation));transition:transform 420ms var(--kit-motion-elastic),background 350ms,border-color 350ms;box-shadow:var(--kit-shadow-control);will-change:transform}.placeholder-cross{width:31px;height:31px;position:relative;opacity:.55}.placeholder-cross:before,.placeholder-cross:after{content:'';position:absolute;width:31px;height:1px;background:var(--kit-color-divider);left:0;top:15px;transform:rotate(45deg)}.placeholder-cross:after{transform:rotate(-45deg)}.project:not(:disabled):hover .artwork,.project:not(:disabled):focus-visible .artwork{transform:rotate(calc(var(--rotation) * .4)) scale(1.08) translateY(-7px);border-color:var(--kit-color-divider);background:var(--kit-color-tray)}.project:not(:disabled):active .artwork{transform:rotate(0deg) scale(.97)}.label{position:absolute;bottom:calc(100% + 25px);left:50%;padding:10px 17px;background:var(--kit-material-light-surface);box-shadow:var(--kit-shadow-control);border:1px solid var(--kit-color-card-outline);border-radius:32px;line-height:1;font-size:16px;opacity:0;transform:translate(-50%,18px);transition:opacity .2s,transform .25s var(--kit-motion-ease);white-space:nowrap;pointer-events:none}.project:not(:disabled):hover .label,.project:not(:disabled):focus-visible .label{opacity:1;transform:translate(-50%,0)}.dragging{transition:none;cursor:grabbing}.dragging .label{opacity:0!important}.project-position.entering{animation:arrival 800ms var(--kit-motion-elastic) both}.project-position:nth-child(2).entering{animation-delay:90ms}.numbers-footer{position:fixed;left:0;right:0;bottom:44px;text-align:center;transition:opacity .25s,transform .4s var(--kit-motion-ease);z-index:5}.numbers-wordmark{display:inline-block;font-size:28px;font-weight:550;letter-spacing:-1.25px;line-height:.95}.numbers-wordmark span{display:block;font-size:10px;letter-spacing:.15px;margin-top:7px;font-weight:400}.numbers-footer nav{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:15px;font-size:13px;font-weight:350;color:var(--kit-color-secondary)}.numbers-footer nav a{opacity:.65;transition:opacity .2s}.numbers-footer nav a:hover,.numbers-footer nav a:focus-visible{opacity:1}.numbers-footer nav span{color:var(--kit-color-divider)}.opened .numbers-footer{opacity:0;transform:translateY(32px);pointer-events:none}.opened .project-position{top:50%}.opened[data-selected="48"] .project-position[data-project="48"],.opened[data-selected="6000"] .project-position[data-project="6000"]{--x:calc(var(--panel-width) / -2);--y:0px;--scale:1.6;--rotation:0deg;z-index:3}.opened[data-selected="48"] .project-position[data-project="6000"]{--x:calc(var(--panel-width) / -2 + 510px);--y:0px;--scale:.7;--opacity:.2}.opened[data-selected="6000"] .project-position[data-project="48"]{--x:calc(var(--panel-width) / -2 - 510px);--y:0px;--scale:.7;--opacity:.2}.opened .project{pointer-events:none}.opened .label{opacity:0!important}.opened .artwork{border-radius:35px}.panel-overlay{position:fixed;inset:0;z-index:10;display:flex;justify-content:flex-end;padding:8px;overflow-x:hidden;overflow-y:auto;pointer-events:none;opacity:0;transition:opacity .25s}.panel-overlay[hidden]{display:none}.sheet{width:var(--panel-width);flex:none;min-height:100%;height:fit-content;padding:44px 64px;border:1px solid var(--kit-color-card-outline);border-radius:var(--kit-radius-mobile-action);background:color-mix(in srgb, var(--kit-color-canvas) 92%, transparent);backdrop-filter:blur(32px);position:relative;pointer-events:auto;transform:translateX(calc(100% + 16px));transition:transform var(--scene-duration) var(--kit-motion-ease);outline:none!important;box-shadow:0 0 20px #23232603}.panel-overlay.visible{opacity:1}.panel-overlay.visible .sheet{transform:translateX(0)}.sheet-content{min-height:calc(100dvh - 106px);display:flex;flex-direction:column;transition:opacity .16s,transform .25s}.sheet-content.changing{opacity:0;transform:translateY(10px)}.bio{min-height:208px;display:flex;flex-direction:column;gap:16px}.bio h1{font-size:40px;font-weight:450;letter-spacing:-1.4px;line-height:1.15;margin:0}.bio p{font-size:17px;font-weight:350;line-height:1.5;color:var(--kit-color-reading-body);margin:0}dl{padding-top:44px;margin:0}dl>div{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;font-size:13px;padding:8px 0 15px;margin-bottom:8px;border-bottom:1px dotted var(--kit-color-divider);position:relative}dl>div:last-child{border-bottom:0}dt{color:var(--kit-color-annotation)}dd{text-align:right;max-width:65%;margin:0;font-weight:400;color:var(--kit-color-reading-strong)}.tag{display:inline-block;padding:3px 6px;margin:0 0 4px 4px;border-radius:5px;border:1px solid var(--kit-color-divider);background:var(--kit-color-surface);font-size:11px;line-height:1.2}.project-footer{margin-top:auto;padding-top:32px}.visit{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--kit-color-secondary);padding:8px 0;transition:color .2s}.visit:hover{color:var(--kit-color-foreground)}.footnote{font-size:11px;line-height:1.5;color:var(--kit-color-annotation);margin:8px 0 0}.close{display:none;background:transparent;position:absolute;top:20px;right:20px;width:44px;height:44px;align-items:center;justify-content:center;z-index:5}.navigation{position:fixed;bottom:48px;left:0;right:var(--panel-width);display:flex;justify-content:center;z-index:20;pointer-events:none;opacity:0;transition:opacity .3s}.navigation[hidden]{display:none}.opened .navigation{opacity:1}.arrows{display:flex;padding:0 6px;border:1px solid var(--kit-color-divider);border-radius:30px;background:var(--kit-material-light-surface);box-shadow:var(--kit-shadow-control);pointer-events:auto}.arrows button{background:none;padding:8px 6px;color:var(--kit-color-secondary);opacity:.65;transition:opacity .2s,transform .2s}.arrows button:hover,.arrows button:focus-visible{opacity:1}.arrows button:active{transform:scale(.8)}@keyframes float{0%,100%{transform:translateY(-7px) rotate(-1deg)}50%{transform:translateY(7px) rotate(1deg)}}@keyframes arrival{from{opacity:0;filter:none}to{opacity:1;filter:none}}
@media(max-width:920px){body{--panel-width:100vw}.stage{bottom:96px}.project-position{width:145px;height:165px;--scale:1}.project-position[data-project="48"]{--x:-79px;--y:-8px;--rotation:-8deg}.project-position[data-project="6000"]{--x:79px;--y:10px;--rotation:9deg}.artwork{border-radius:24px}.label{display:none}.numbers-footer{bottom:44px}.numbers-wordmark{font-size:25px}.numbers-footer nav{font-size:12px;margin-top:13px}.panel-overlay{display:block;padding:0 4px 4px;pointer-events:auto;transform:translateY(100%);transition:transform 650ms var(--kit-motion-ease),opacity .3s}.panel-overlay:before{content:'';display:block;height:calc(100% - 272px);pointer-events:none}.sheet{position:relative;width:100%;min-height:100svh;padding:28px 32px 32px;border-radius:20px;background:var(--kit-color-canvas);box-shadow:0 -20px 45px #23232608;transform:none!important;backdrop-filter:none}.panel-overlay.visible{transform:translateY(0)}.sheet-content{min-height:calc(100svh - 62px)}.bio{min-height:208px;max-width:100%;gap:16px}.bio h1{font-size:36px;padding-right:30px}.bio p{font-size:17px;line-height:1.5}.close{display:flex}.navigation{display:none!important}.opened .stage{bottom:0}.opened[data-selected="48"] .project-position[data-project="48"],.opened[data-selected="6000"] .project-position[data-project="6000"]{--x:0px;--y:calc(-18vh);--scale:1.5;--rotation:0deg}.opened[data-selected="48"] .project-position[data-project="6000"]{--x:100vw;--y:-18vh;--scale:.6;--opacity:0}.opened[data-selected="6000"] .project-position[data-project="48"]{--x:-100vw;--y:-18vh;--scale:.6;--opacity:0}dl{padding-top:44px}.opened .artwork{border-radius:24px}}
@media(max-width:360px){.project-position{width:132px;height:150px}.project-position[data-project="48"]{--x:-71px}.project-position[data-project="6000"]{--x:71px}.sheet{padding:28px 24px}.bio h1{font-size:32px}.bio p{font-size:15px}}
@media(prefers-reduced-motion:reduce){body{--scene-duration:1ms}.float,.project-position.entering{animation:none!important}*,*:before,*:after{transition-duration:1ms!important;scroll-behavior:auto!important}}
/* The sound control remains behind the mobile sheet, as in the reference. */
.sound{z-index:5}

.label{bottom:calc(100% + 35px);transform:translate(-50%,18px) rotate(var(--rotation));transform-origin:center bottom}
.project:not(:disabled):hover .label,.project:not(:disabled):focus-visible .label{transform:translate(-50%,0) rotate(var(--rotation))}
@media(max-width:920px){.home48 .sheet.home-navigation-panel{width:100%;height:auto;min-height:100svh;padding:var(--kit-frame-pad-medium);transform:none;border-radius:var(--kit-radius-bundle)}.home48 .sheet .secondary-nav-header{display:flex}}

/* Placement of the unmodified 6000 rail in the Numbers scene. */
@media(min-width:921px){
 .panel-overlay{justify-content:flex-start;padding:0;overflow:visible}
 .home48 .sheet.rail{display:flex;position:fixed;inset-block:0;inset-inline-start:var(--kit-frame-pad-mobile);width:var(--rail);height:100dvh;min-height:0;max-height:none;transform:translateX(calc(-100% - var(--kit-frame-pad-mobile)));border:0;border-radius:0;background:var(--kit-color-canvas);box-shadow:none;backdrop-filter:none}
 .home48 .panel-overlay.visible .sheet.rail{transform:translateX(0)}
 .opened[data-selected="48"] .project-position[data-project="48"],.opened[data-selected="6000"] .project-position[data-project="6000"]{--x:calc((var(--rail) + var(--kit-frame-pad-mobile)) / 2)}
}
.home48 .sheet-content.rail-content-scroll{min-height:0;transition:opacity var(--kit-motion-feedback) var(--kit-motion-ease)}
.home48 .sheet .rail-intro{margin-top:0}
.home48 .sheet .rail-intro h1{font-size:var(--kit-type-section-size);line-height:var(--kit-type-section-leading);font-weight:var(--kit-type-section-weight);letter-spacing:var(--kit-type-section-tracking)}
.home48 .sheet .rail-intro p{margin-top:var(--kit-space-mobile-hatch);font:var(--kit-type-body-size)/var(--kit-type-body-leading) var(--kit-font-body);color:var(--kit-color-reading-body);letter-spacing:normal}
.home48 .sheet .rail-links{margin-top:var(--kit-space-mobile-hatch);padding:0}
.home48 .sheet .rail-links>div{display:block;margin:0;padding:var(--kit-radius-tab) 0;border:0}
.home48 .sheet .rail-links dt{font-size:var(--kit-type-body-size);color:var(--kit-color-annotation)}
.home48 .sheet .rail-links dd{max-width:none;text-align:left;font-size:var(--kit-type-body-size);color:var(--kit-color-reading-strong)}
.home48 .sheet .rail-bottom{padding-top:var(--kit-space-mobile-hatch)}
.home48 .sheet .visit.text-link{min-height:var(--kit-size-mobile-touch);font-size:var(--kit-type-body-size)}
.home48 .sheet .footnote{font-size:var(--kit-type-body-size)}
@media(max-width:920px){.home48 .sheet.rail{display:flex;position:relative;inset:auto;width:100%;min-height:100svh;height:auto;padding:var(--kit-frame-pad-mobile);background:var(--kit-color-canvas);border:0;border-radius:0;box-shadow:none;transform:none}.home48 .sheet-content.rail-content-scroll{display:flex;flex-direction:column;min-height:calc(100svh - 2 * var(--kit-frame-pad-mobile))}.home48 .sheet .rail-hatch{min-height:var(--kit-size-mobile-section)}}

@media(min-width:921px){.home48 .sheet.rail{padding-inline:0}.navigation{left:calc(var(--rail) + var(--kit-frame-pad-mobile));right:0}.home48 .sheet-content.rail-content-scroll{width:100%}}

/* The label and mark share the artwork's float, drag, rotation and hover transform. */
.artwork{border:0;background:transparent;box-shadow:none}
.project:not(:disabled):hover .artwork,.project:not(:disabled):focus-visible .artwork{background:transparent}
.label,.project:not(:disabled):hover .label,.project:not(:disabled):focus-visible .label{transform:translate(-50%,0);bottom:calc(50% + 112px + var(--kit-radius-tab))}
.label{opacity:0;transition:opacity var(--kit-motion-feedback) var(--kit-motion-ease)}
.project-mark{display:block;width:224px;height:224px;flex:none}
[data-brand-clock]{--studio-orange:var(--kit-color-orange);--studio-orange-light:var(--kit-color-orange-light);--studio-orange-edge:var(--kit-color-orange-edge);--studio-orange-rim:var(--kit-color-orange-rim);--studio-orange-highlight:var(--kit-color-orange-highlight)}
@media(max-width:920px){.project-mark{transform:scale(.6)}}

/* A small independent nudge leaves the clock's own minute-angle animation intact. */
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  [data-open="48"]:not(:disabled):hover [data-clock-part="minute"] {
    animation: minute-nudge var(--kit-motion-layout) var(--kit-motion-elastic) both;
  }
}
@keyframes minute-nudge {
  0%, 100% { transform: rotate(0deg); }
  45% { transform: rotate(3deg); }
  75% { transform: rotate(-1deg); }
}

/* Three projects retain their fixed stacking order. */
.project-position[data-project="48"]{--x:-210px;z-index:3}
.project-position[data-project="6000"]{--x:0px;z-index:2}
.project-position[data-project="d3516n"]{--x:210px;--y:0px;--rotation:6deg;z-index:1}
[data-project="6000"] .label,[data-project="6000"] .project:not(:disabled):hover .label,[data-project="6000"] .project:not(:disabled):focus-visible .label{bottom:calc(50% + 100px + var(--kit-radius-tab))}
.project-placeholder{display:grid;place-items:center;border:1px dashed var(--kit-color-divider);border-radius:var(--kit-radius-bundle);background:var(--kit-color-surface);color:var(--kit-color-secondary);font:var(--kit-type-section-weight) var(--kit-type-section-size)/var(--kit-type-section-leading) var(--kit-font-body)}
.opened .project-position{--opacity:.2;--scale:.7}
@media(min-width:921px){
 .opened[data-selected="48"] .project-position[data-project="48"],.opened[data-selected="6000"] .project-position[data-project="6000"],.opened[data-selected="d3516n"] .project-position[data-project="d3516n"]{--x:calc((var(--rail) + var(--kit-frame-pad-mobile)) / 2);--y:0px;--scale:1.6;--opacity:1;--rotation:0deg;z-index:3}
 .opened[data-selected="48"] .project-position[data-project="d3516n"]{--x:calc((var(--rail) + var(--kit-frame-pad-mobile)) / 2 + 750px)}
 .opened[data-selected="6000"] .project-position[data-project="d3516n"]{--x:calc((var(--rail) + var(--kit-frame-pad-mobile)) / 2 + 510px)}
 .opened[data-selected="d3516n"] .project-position[data-project="48"]{--x:calc((var(--rail) + var(--kit-frame-pad-mobile)) / 2 - 750px)}
 .opened[data-selected="d3516n"] .project-position[data-project="6000"]{--x:calc((var(--rail) + var(--kit-frame-pad-mobile)) / 2 - 510px)}
}
@media(max-width:920px){
 .project-position[data-project="48"]{--x:-125px}.project-position[data-project="6000"]{--x:0px}.project-position[data-project="d3516n"]{--x:125px}
 .opened .project-position{--opacity:0}
 .opened[data-selected="48"] .project-position[data-project="48"],.opened[data-selected="6000"] .project-position[data-project="6000"],.opened[data-selected="d3516n"] .project-position[data-project="d3516n"]{--x:0px;--y:-18vh;--scale:1.5;--opacity:1;--rotation:0deg;z-index:3}
}
.home48 .sheet .rail-intro p:empty,.home48 .sheet .rail-links:empty,.home48 .sheet .footnote:empty{display:none}

/* Project imagery uses the same reveal rhythm as the existing scene. */
.showcase{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity var(--kit-motion-layout) var(--kit-motion-ease)}
.showcase-item{position:absolute;left:calc(50% + (var(--rail) + var(--kit-frame-pad-mobile)) / 2);top:50%;width:clamp(130px,16vw,230px);height:clamp(150px,20vw,270px);object-fit:cover;border-radius:var(--kit-radius-bundle);box-shadow:var(--kit-shadow-control);opacity:0;transform:translate(-50%,-50%) scale(.7);transition:transform var(--scene-duration) var(--kit-motion-ease),opacity var(--kit-motion-layout) var(--kit-motion-ease)}
.opened[data-selected="48"] [data-showcase="48"],.opened[data-selected="6000"] [data-showcase="6000"]{opacity:1}
.opened[data-selected="48"] [data-showcase="48"] .showcase-item,.opened[data-selected="6000"] [data-showcase="6000"] .showcase-item{opacity:1}
.opened .showcase-item:nth-child(1){transform:translate(calc(-50% - min(25vw, 360px)),calc(-50% - min(20vh, 180px))) rotate(-8deg)}
.opened .showcase-item:nth-child(2){transform:translate(calc(-50% + min(26vw, 370px)),calc(-50% - min(19vh, 170px))) rotate(7deg)}
.opened .showcase-item:nth-child(3){transform:translate(calc(-50% + min(24vw, 330px)),calc(-50% + min(22vh, 190px))) rotate(-6deg)}
.numbers-footer nav a{opacity:1}
@media(max-width:920px){.showcase-item{left:50%;top:32%;width:clamp(70px,19vw,130px);height:clamp(90px,24vw,160px)}.opened .showcase-item:nth-child(1){transform:translate(-145%,-95%) rotate(-8deg)}.opened .showcase-item:nth-child(2){transform:translate(45%,-100%) rotate(7deg)}.opened .showcase-item:nth-child(3){transform:translate(45%,10%) rotate(-6deg)}}

/* The opened project keeps its own scene; the other projects are not displayed. */
.opened[data-selected="48"] .project-position:not([data-project="48"]),
.opened[data-selected="6000"] .project-position:not([data-project="6000"]),
.opened[data-selected="d3516n"] .project-position:not([data-project="d3516n"]){visibility:hidden;opacity:0;transition:opacity var(--kit-motion-exit) var(--kit-motion-ease),visibility 0s}
.switching .project-position{transition:opacity var(--kit-motion-feedback) var(--kit-motion-ease)!important}
.objects{z-index:1}
.showcase{z-index:0}
.showcase::before{content:"";position:absolute;inset:0;background:color-mix(in srgb,var(--kit-color-canvas) 65%,transparent);backdrop-filter:var(--kit-material-glass-active-filter);-webkit-backdrop-filter:var(--kit-material-glass-active-filter)}
.project-summary{position:absolute;z-index:2;top:calc(50% + 115px);left:calc(50% + (var(--rail) + var(--kit-frame-pad-mobile)) / 2);transform:translateX(-50%);width:min(360px,40vw);display:flex;align-items:center;flex-direction:column;text-align:center;gap:var(--kit-space-mobile-hatch);pointer-events:auto;opacity:0;transition:opacity var(--kit-motion-layout) var(--kit-motion-ease)}
.project-summary[hidden]{display:none}
.opened .project-summary{opacity:1}
.project-summary h2{font-size:var(--kit-type-section-size);font-weight:var(--kit-type-section-weight);line-height:var(--kit-type-section-leading);letter-spacing:var(--kit-type-section-tracking)}
.project-summary p{margin:0;font:var(--kit-type-body-size)/var(--kit-type-body-leading) var(--kit-font-body);color:var(--kit-color-reading-body)}
.project-summary p:empty{display:none}
.project-summary .secondary-action{min-height:var(--kit-size-mobile-touch);padding-inline:var(--kit-space-mobile-hatch)}
@media(min-width:921px){
 .opened[data-selected="48"] .project-position[data-project="48"],.opened[data-selected="6000"] .project-position[data-project="6000"],.opened[data-selected="d3516n"] .project-position[data-project="d3516n"]{--scale:.65;--y:0px}
 .showcase-item{top:36%;width:clamp(145px,18vw,260px);height:clamp(165px,21vw,290px)}
 .opened .showcase-item:nth-child(1){transform:translate(calc(-50% - min(10vw, 150px)),-65%) rotate(-8deg)}
 .opened .showcase-item:nth-child(2){transform:translate(calc(-50% + min(9vw, 130px)),-85%) rotate(7deg)}
 .opened .showcase-item:nth-child(3){width:clamp(85px,10vw,145px);height:clamp(65px,8vw,110px);transform:translate(calc(-50% + min(13vw, 180px)),10%) rotate(-6deg)}
}
@media(max-width:920px){
 .opened[data-selected="48"] .project-position[data-project="48"],.opened[data-selected="6000"] .project-position[data-project="6000"],.opened[data-selected="d3516n"] .project-position[data-project="d3516n"]{--y:-20vh;--scale:1}
 .project-summary{left:50%;top:calc(30% + 95px);width:min(80vw,360px);gap:var(--kit-radius-tab)}
 .showcase-item{top:21%}
 .opened .showcase-item:nth-child(1){transform:translate(-95%,-65%) rotate(-8deg)}
 .opened .showcase-item:nth-child(2){transform:translate(-10%,-85%) rotate(7deg)}
 .opened .showcase-item:nth-child(3){transform:translate(15%,0%) rotate(-6deg)}
}

/* Switching travels inside the project stage, clipped at the sidebar edge. */
.switching[data-selected="48"] .project-position[data-project="48"],
.switching[data-selected="6000"] .project-position[data-project="6000"],
.switching[data-selected="d3516n"] .project-position[data-project="d3516n"]{animation:project-switch-enter var(--scene-duration) var(--scene-ease) both}
@keyframes project-switch-enter{from{translate:var(--switch-enter) 0;opacity:0}to{translate:0 0;opacity:1}}
@media(min-width:921px){.opened .stage{clip-path:inset(0 0 0 calc(var(--rail) + var(--kit-frame-pad-mobile) + var(--kit-radius-tab)))}}
@media(prefers-reduced-motion:reduce){.switching[data-selected] .project-position{animation:none}}

/* The same heading and action spacing used by 6000. */
.project-summary{gap:0}
.project-summary h2{margin:0 0 var(--home-space-heading)}
.project-summary p{margin:0 0 var(--home-space-action)}
@media(max-width:920px){.project-summary{gap:0}}

/* The same 6000 hero grid occupies the full page behind the site. */
.home48 #hero-dot-grid{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.home48 main{position:relative;z-index:1}
.home48 .sheet.rail{background:color-mix(in srgb,var(--kit-color-canvas) 75%,transparent);backdrop-filter:var(--kit-material-glass-active-filter);-webkit-backdrop-filter:var(--kit-material-glass-active-filter)}

/* Treat the preview images as one layered composition behind the mark. */
@media (min-width:921px) {
  .opened[data-selected="48"] .project-position[data-project="48"],
  .opened[data-selected="6000"] .project-position[data-project="6000"],
  .opened[data-selected="d3516n"] .project-position[data-project="d3516n"]{--scale:.4}
  .project-summary{top:calc(50% + 60px);width:min(420px,40vw)}
  .project-summary h2{font-size:var(--type-title)}
  .showcase-item{top:40%;width:clamp(200px,21vw,300px);height:clamp(230px,24vw,340px);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 62%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 62%,transparent 100%)}
  .opened .showcase-item:nth-child(1){transform:translate(-87%,-78%) rotate(-8deg)}
  .opened .showcase-item:nth-child(2){transform:translate(-12%,-94%) rotate(7deg)}
  .opened .showcase-item:nth-child(3){width:clamp(95px,10vw,140px);height:clamp(80px,9vw,125px);transform:translate(20%,-14%) rotate(-6deg)}
}
@media (max-width:920px) {
  .opened[data-selected="48"] .project-position[data-project="48"],
  .opened[data-selected="6000"] .project-position[data-project="6000"],
  .opened[data-selected="d3516n"] .project-position[data-project="d3516n"]{--scale:.7}
  .project-summary{top:calc(30% + 68px)}
  .showcase-item{-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 62%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 62%,transparent 100%)}
  .opened .showcase-item:nth-child(1){transform:translate(-87%,-65%) rotate(-8deg)}
  .opened .showcase-item:nth-child(2){transform:translate(-12%,-80%) rotate(7deg)}
  .opened .showcase-item:nth-child(3){transform:translate(20%,-10%) rotate(-6deg)}
}

/* The description is a concise, balanced part of the project lockup. */
.project-summary p{max-width:24ch;font-size:var(--lisa-body);line-height:var(--kit-type-body-leading);color:var(--kit-color-reading-strong);text-wrap:balance}

/* Project lockup: the hero's variable Inter scale and spacing from 6000. */
.home48 .project-summary.home-intro{display:flex;min-height:0;padding:0;row-gap:0}
.home48 .project-summary h2{font-family:var(--kit-font-body);font-optical-sizing:auto;font-size:var(--type-title);font-weight:var(--kit-type-section-weight);line-height:1.1;letter-spacing:-.03em;margin:0 0 var(--home-space-heading);text-wrap:balance}
.home48 .project-summary p{max-width:28ch;font-family:var(--kit-font-body);font-size:var(--lisa-body);font-weight:400;line-height:1.3;letter-spacing:normal;color:var(--kit-color-foreground);text-wrap:balance;margin:0 0 var(--home-space-action)}
.home48 .project-summary p[hidden],.home48 .project-summary [hidden]{display:none}

/* Variable Inter weight and a tighter title-to-copy gap than copy-to-action. */
.home48 .project-summary h2{margin-block-end:var(--space-1)}
.home48 .project-summary p{margin-block-end:var(--space-4)}