.project-header{position:relative;width:100vw;height:75svh;overflow:hidden}.project-header .container{display:flex;flex-direction:column;gap:1rem;justify-content:flex-end}.project-header .project-header-divider{width:100%;height:1px;border-bottom:1px dashed var(--base-300);opacity:.25}.project-header .project-meta{display:flex;gap:2rem}.project-header .project-meta-col,.project-header .project-meta-sub-col{flex:1}.project-header .project-meta-col:nth-child(2){display:flex;gap:2rem}.project-banner-img{margin:2rem 0;width:100%;aspect-ratio:16/9}.project-banner-img video,.project-banner-img picture,.project-banner-img img{width:100%;height:100%;object-fit:cover;border-radius:8px}.project-overview{position:relative;width:100vw;height:100%;padding:2rem 0 6rem;overflow:hidden}.project-overview .container{display:flex;gap:2rem}.project-overview .container .project-overview-col{flex:1}.project-overview .container .project-overview-col:nth-child(2){display:flex;flex-direction:column;gap:4rem}.project-overview .container .project-overview-col:nth-child(2) .project-overview-copy{width:75%}.project-snapshots{position:relative;width:100vw;height:100svh;background-color:var(--base-300);color:var(--base-100);overflow:hidden}.project-snapshots-wrapper{position:relative;width:500vw;height:100svh;display:flex;overflow:hidden;transform:translate(0)}.project-snapshot{flex:1;display:flex;justify-content:center;align-items:center}.project-snapshot img,.project-snapshot picture{width:65%;height:65%;aspect-ratio:16/9;object-fit:cover;border:1px dashed var(--base-secondary-dark);border-radius:8px}.project-snapshot picture img{width:100%;height:100%;border:none}.snapshots-progress-bar{position:absolute;bottom:2rem;left:50%;transform:translate(-50%);width:20%;height:1rem;display:flex;justify-content:space-between;align-items:center;min-width:300px}.progress-indicator{width:1px;height:50%;background-color:var(--base-secondary-dark)}.progress-bar{position:absolute;top:0;left:0;width:0%;height:100%;border:1px solid var(--base-100);background-color:var(--base-300);transform-origin:left;will-change:width}.project-info{position:relative;width:100vw;height:100%;padding:8rem 0 10rem;overflow:hidden}.project-info .container{display:flex;gap:2rem}.project-info .container .project-info-col{flex:1}.project-info .container .project-info-col:nth-child(2) .project-info-copy{width:75%}.next-project{position:relative;width:100vw;height:100svh;background-color:var(--base-300);color:var(--base-100);overflow:hidden;border-bottom:1px dashed var(--base-secondary-dark);padding-bottom:2rem}.next-project .container.next-project-data{display:flex;flex-direction:column;gap:1rem;justify-content:center}.next-project .next-project-header-divider{width:100%;height:1px;border-bottom:1px dashed var(--base-secondary-dark);opacity:.25}.next-project .next-project-meta{display:flex;gap:2rem}.next-project .next-project-meta-col,.next-project .next-project-meta-sub-col{flex:1}.next-project .next-project-meta-col:nth-child(2){display:flex;gap:2rem}.home-spotlight-top-bar{position:absolute;top:0;left:0;width:100%}.home-spotlight-bottom-bar{position:absolute;bottom:0;left:0;width:100%}.home-spotlight-top-bar .container,.home-spotlight-bottom-bar .container{display:flex;justify-content:space-between}.home-spotlight-bottom-bar p.mono span,.project-overview p.mono span,.project-info p.mono span,.project-overview h3.mono span,.project-info h2.mono span{color:var(--accent-red)}.project-header .project-title h1{font-size:6rem;transition:color .3s ease}.project-header:hover .project-title h1{color:var(--accent-red)}.project-overview h3.mono,.project-info h2.mono{text-transform:uppercase;font-family:DM Mono;font-size:.85rem;font-weight:500;line-height:normal}.project-banner-img video{border:2px solid transparent;transition:border-color .3s ease}.project-banner-img:hover video{border-color:var(--accent-red)}@media (max-width: 1000px){.project-header .project-title h1,.next-project .next-project-title h2{font-size:3rem}.project-header .project-meta,.project-header .project-meta-col:nth-child(2),.next-project .next-project-meta,.next-project .next-project-meta-col:nth-child(2){flex-direction:column}.project-banner-img{aspect-ratio:4/5}.project-overview .container .project-overview-col:nth-child(1),.project-info .container .project-info-col:nth-child(1){display:none}.project-overview .container .project-overview-col:nth-child(2) .project-overview-copy,.project-info .container .project-info-col:nth-child(2) .project-info-copy{width:100%}.snapshots-progress-bar{bottom:5rem;width:calc(100% - 4rem)}}
