@import "https://api.fontshare.com/v2/css?f[]=pp-pangram-sans@800&display=swap";
:root{--light:#fff;--dark:#0f0f0f;--base-100:#f4f3f0;--base-400:#1c1b19;--hero-cream:#f7f2ea}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background-color:var(--hero-cream);font-family:DM Sans,sans-serif}img{object-fit:cover;width:100%;height:100%}a,p{text-transform:uppercase;color:#000;font-family:DM Mono,mono;font-size:.9rem;font-weight:500;line-height:1.25;text-decoration:none}nav{z-index:100;justify-content:space-between;align-items:flex-start;width:100%;padding:2rem;display:flex;position:fixed}.nav-logo a{text-transform:none;font-family:inherit;font-size:inherit;font-weight:inherit;color:inherit}.logo-mark{letter-spacing:.02em;text-transform:lowercase;background-color:var(--base-100);color:var(--base-400);border-radius:.4rem;padding:.45rem .75rem;font-family:PP Pangram Sans,DM Sans,sans-serif;font-size:1.05rem;font-weight:800;transition:background-color .2s,color .2s,box-shadow .2s;display:inline-block;box-shadow:0 .15rem .6rem #00000014}.logo-mark.logo-inverted{background-color:var(--base-400);color:var(--base-100);box-shadow:0 .2rem .75rem #00000040}.nav-items{flex-flow:wrap;justify-content:flex-end;align-items:flex-start;gap:1.25rem;display:flex}nav.nav-on-dark .nav-items a{color:var(--base-100)}.hero{background-color:var(--hero-cream);width:100%;height:100svh;position:relative;overflow:hidden}.hero-overlay{background-color:var(--dark);clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%);will-change:clip-path;z-index:0;width:100%;height:100svh;position:absolute}.hero-overlay .counter{color:var(--light);position:absolute;bottom:2rem;right:2rem}.hero-overlay .counter h1{font-size:4rem;font-weight:500}.overlay-text-container{height:2rem;position:absolute;top:2rem;left:2rem;overflow:hidden}.overlay-text-container .overlay-text{will-change:transform;flex-direction:column;display:flex;transform:translateY(2rem)}.overlay-text-container .overlay-text p{color:var(--light);align-items:center;height:2rem;display:flex}.hero-images{will-change:gap;z-index:2;justify-content:center;gap:10vw;width:100%;padding:0 2rem;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.hero-images .img{aspect-ratio:5/7;clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%);opacity:0;will-change:opacity, transform, clip-path;width:10vw;transform:translateY(50%)scale(.5)}.hero-header{z-index:-1;width:100%;position:absolute;bottom:2rem}.hero-header h1{text-transform:uppercase;text-align:center;font-size:15vw;font-weight:500;line-height:.85}.hero-header h1 .word{will-change:transform;transform:translateY(100%)}@media (max-width:1000px){nav{padding:1rem}.nav-items{flex-direction:column;align-items:flex-end;gap:.4rem}.logo-mark{border-radius:.3rem;padding:.35rem .55rem;font-size:.9rem}.hero-overlay .counter{bottom:1rem;right:1rem}.hero-images{gap:2.5vw;padding:0 .5rem}.hero-images .img{width:20vw}}
