:root{--paper: #e6e2d8;--ink: #14110d;--ink-soft: #6d685c;--overlay: #0d0b09}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Hanken Grotesk,sans-serif;background-color:var(--paper);color:var(--ink)}img{width:100%;height:100%;object-fit:cover}p{text-transform:uppercase;font-family:DM Mono,monospace;font-size:.7rem;letter-spacing:.14em}a{text-decoration:none;text-transform:uppercase;font-family:DM Mono,monospace;font-size:.7rem;letter-spacing:.14em;color:var(--ink)}.overlay{position:fixed;top:0;left:0;width:100vw;height:100svh;padding:2em;background-color:var(--overlay);color:#fff;display:flex;gap:2em;overflow:hidden}.projects,.loader,.locations{flex:1;display:flex;flex-direction:column;justify-content:center;gap:1em}.loader{align-items:center;gap:0}.loader h1{text-align:center;text-transform:uppercase;font-family:Inter,sans-serif;font-size:2.5rem;font-style:italic;line-height:.9;-webkit-text-fill-color:transparent;background-clip:text;background-image:linear-gradient(0deg,#3a3a3a,#3a3a3a 50%,#fff 0);background-size:100% 200%;background-position:0% 100%;color:#3a3a3a}.projects-header,.project-item,.locations-header,.location-item{display:flex;gap:2em;opacity:0}.projects-header>*,.project-item>*{flex:1}.locations{align-items:center}.locations-header,.location-item{width:50%}.project-item,.location-item{color:#4f4f4f}.image-grid{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:30%;aspect-ratio:1;display:flex;flex-direction:column;gap:1em;z-index:2}.grid-row{width:100%;display:flex;gap:1em}.img{position:relative;flex:1;aspect-ratio:1;clip-path:polygon(0% 0%,100% 0%,100% 0%,0% 0%)}nav{position:fixed;width:100vw;padding:1em;display:flex;gap:2em}nav>*{flex:1}.links{display:flex;justify-content:space-around;align-items:center}.nav-logo{text-align:center;display:flex;justify-content:center}.nav-logo a{font-family:Inter,sans-serif;font-size:1.75rem;font-weight:bolder;font-style:italic;line-height:.9}.banner-img{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%) scale(0);width:20%;aspect-ratio:4/5}.intro-copy{position:absolute;top:45%;transform:translateY(-50%);width:100%;padding:0 8em;display:flex;justify-content:space-between;align-items:center}.title{position:absolute;bottom:10%;left:50%;transform:translate(-50%)}.intro-copy h3,.title h1{position:relative;text-transform:uppercase;color:var(--ink);font-family:Inter,sans-serif;font-weight:500;font-style:italic;line-height:.88}.title h1{font-size:clamp(2.75rem,6vw,4.25rem);font-weight:700;letter-spacing:-.01em;text-align:center;max-width:14ch}.intro-copy h3{font-size:1.4rem;letter-spacing:.01em}.intro-copy h3,.title h1{clip-path:polygon(0 0,100% 0,100% 100%,0% 100%)}.intro-copy h3 .word,.title h1 .word{display:inline-block;position:relative;will-change:transform;margin-right:.1rem}@media(max-width:900px){.loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.projects,.locations,.intro-copy,.banner-img{display:none}.title{width:100%;bottom:20%;display:flex;justify-content:center}.title h1{font-size:2.5rem}.image-grid{width:75%;gap:.5em}.grid-row{width:95%;justify-content:space-around;gap:.5em}}@media(max-width:768px){nav{padding:1em 1.25em;gap:1em;align-items:center}nav a{font-size:.62rem;letter-spacing:.08em}.links{justify-content:space-between;gap:.75em}.nav-logo a{font-size:1.35rem}.loader h1{font-size:2rem}.title{bottom:16%;padding:0 1.25em}.title h1{font-size:clamp(2.1rem,9vw,2.75rem);max-width:12ch}}@media(max-width:400px){nav a{font-size:.56rem;letter-spacing:.04em}.nav-logo a{font-size:1.15rem}}
