/* A continuous film of projects. Native page scrolling remains in charge. */
.work.scroll-gallery{height:calc(100svh + (var(--visible-projects) - 1)*60svh)}
.work.scroll-gallery .project-panel.is-near{visibility:visible;pointer-events:auto}
.work.scroll-gallery.is-gallery-scrubbing .project-panel{transition:opacity .2s,visibility .2s}
.work.scroll-gallery .project-panel.is-near:not(.is-active) .project-art{opacity:calc(1 - var(--panel-distance,1)*.37)}
.work .project-ribbon{border-top:1px solid #83b8fa19}
.work .gallery-bottom{position:relative}
.work .gallery-bottom:before{content:'';position:absolute;left:0;right:0;top:0;height:1px;background:#8bb8f41a}
.work .gallery-bottom:after{content:'';position:absolute;left:0;top:0;width:calc((100% / var(--visible-projects)) + (100% - 100% / var(--visible-projects)) * var(--collection-progress,0));height:1px;background:linear-gradient(90deg,#3767a8,#b8d7ff);transition:width .6s cubic-bezier(.22,.68,.18,1);pointer-events:none}
.work.is-gallery-scrubbing .gallery-bottom:after{transition:none}
.work.scroll-gallery .project-panel:not(.is-active) .panel-preview-hint{max-width:none;width:210px}
.work .project-panel:focus-within{outline:1px solid #9cc8ff;outline-offset:-1px}
.work.scroll-gallery .project-panel>.panel-content{display:none}
.work.scroll-gallery .project-panel .project-art{inset:0}
.work.scroll-gallery .project-panel:not(.is-active) .panel-spine{bottom:62px}
.work.scroll-gallery .project-panel:not(.is-active) .panel-preview-hint{bottom:20px}
.work.scroll-gallery .gallery-reading{flex:0 0 auto;padding:20px 0 17px;min-height:165px}
.work.scroll-gallery .gallery-reading .panel-content{position:relative;inset:auto;display:grid;grid-template-columns:1fr 1fr;gap:6px 70px;animation:collection-copy .32s ease both}
.work.scroll-gallery .gallery-reading .panel-meta{grid-column:1;grid-row:1;gap:5px 14px;margin:0 0 3px}
.work.scroll-gallery .gallery-reading h3{grid-column:1;grid-row:2/4;font-size:40px;line-height:1.08;letter-spacing:-.045em}
.work.scroll-gallery .gallery-reading h3 br{display:none}
.work.scroll-gallery .gallery-reading h3 br:after{content:' '}
.work.scroll-gallery .gallery-reading .panel-content>p{grid-column:2;grid-row:1/3;max-width:none;font-size:16px;line-height:1.55;padding-top:0}
.work.scroll-gallery .gallery-reading .project-open{grid-column:2;grid-row:3;font-size:14px;min-height:40px;max-width:100%}
.work .gallery-reading .panel-content{opacity:1;pointer-events:auto;transform:none}
@keyframes collection-copy{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(min-width:900px) and (max-height:790px){.work.scroll-gallery .gallery-reading{min-height:146px;padding:16px 0 12px}.work.scroll-gallery .gallery-reading h3{font-size:34px}.work.scroll-gallery .gallery-reading .panel-content{gap:5px 45px}.work.scroll-gallery .gallery-reading .panel-content>p{font-size:15px}.work.scroll-gallery .gallery-reading .project-status{font-size:11px}}
.hero-stage:after{content:'';position:absolute;inset:auto 0 0;height:110px;z-index:7;pointer-events:none;background:linear-gradient(transparent,#070a10)}
.hero-explore,.hero-progress{z-index:9}
@media(max-width:1150px) and (min-width:900px){.work.scroll-gallery .project-panel:not(.is-active) .panel-preview-hint{width:115px}}
@media(prefers-reduced-motion:reduce){.work .gallery-bottom:after{transition:none}}

/* Contain fractional transforms without creating a second page scroll axis. */
body{overflow-x:clip}
