@import"https://fonts.googleapis.com/css2?family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&family=Host+Grotesk:ital,wght@0,300..800;1,300..800&display=swap";:root{--fg: #241910;--bg: #fefbf4}*{margin:0;padding:0;box-sizing:border-box}body{font-family:DM Mono,monospace}img{width:100%;height:100%;object-fit:cover}h1{font-family:Host Grotesk;font-size:3rem;font-weight:400;line-height:1.1}p{text-transform:uppercase;font-size:.8rem;font-weight:500}a{text-decoration:none;text-transform:uppercase;font-size:.8rem;font-weight:500;color:var(--fg)}.btn{padding:.75rem 1.5rem;border-radius:.25rem}.btn.primary{background-color:var(--bg)}.btn.primary a{color:var(--fg)}.btn.secondary{background-color:var(--fg)}.btn.secondary a{color:var(--bg)}nav{position:fixed;width:100vw;padding:1.5rem 2rem;display:flex;align-items:center;gap:2rem;will-change:opacity;z-index:2}nav>div{flex:1}nav .nav-links{display:flex;gap:3rem}nav .logo{display:flex;justify-content:center;align-items:center}nav .logo img{width:2rem}nav .logo a{text-transform:none;font-family:Host Grotesk;font-size:1.5rem}nav .nav-buttons{display:flex;gap:1.5rem;justify-content:flex-end}section{position:relative;width:100vw;height:100svh;overflow:hidden}.outro{display:flex;justify-content:center;align-items:center;text-align:center;padding:2rem;background-color:var(--bg);color:var(--fg)}canvas{width:100%;height:100%;object-fit:cover}.hero-content{position:absolute;top:25%;left:50%;transform:translate(-50%);transform-style:preserve-3d;perspective:1000px;padding:.5rem 0}.header{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100vw;display:flex;flex-direction:column;align-items:center;gap:1.5rem;text-align:center;color:var(--fg);transform-origin:center;will-change:transform,opacity}.header h1{width:50%;margin-bottom:.5rem}.header p{opacity:.35}.client-logos{width:30%;display:flex;gap:.5rem}.client-logos .client-logo{flex:1}.client-logos .client-logo img{object-fit:contain}.hero-img-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50%;transform-style:preserve-3d;perspective:1000px}.hero-img{position:relative;width:100%;height:100%;transform:translateZ(1000px);opacity:0;will-change:transform,opacity}@media (max-width: 1000px){h1{font-size:2rem}nav .nav-links,nav .nav-buttons{display:none}.header h1,.client-logos,.hero-img-container{width:calc(100% - 4rem)}}
