@import"https://fonts.googleapis.com/css2?family=Host+Grotesk:wght@400;700&display=swap";:root{--base-100: #181717;--base-200: #292725;--base-300: #f5f5f5}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Host Grotesk,serif}img{width:100%;height:100%;object-fit:cover}.container{width:100%;height:100%;position:relative}.hero{position:relative;color:var(--base-300);width:100%;height:100svh;padding:1rem;background-color:red}.preloader-progress,.preloader-mask,.preloader-content{position:fixed;top:0;left:0;width:100%;height:100vh;pointer-events:none}.preloader-progress{background-color:var(--base-200);z-index:1;will-change:opacity}.preloader-progress-bar{position:absolute;top:0;left:50%;transform:translate(-50%) scaleX(0);width:55%;height:100%;background-color:var(--base-300);transform-origin:left;will-change:transform}.preloader-logo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;text-align:center;mix-blend-mode:difference;z-index:2}.preloader-logo h1{position:relative;color:var(--base-300);font-size:4rem;font-weight:500;line-height:1}.preloader-mask{background-color:var(--base-100);mask:linear-gradient(var(--base-300),var(--base-300)),url("data:image/svg+xml,%3csvg%20width='57'%20height='23'%20viewBox='0%200%2057%2023'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20x='0.820908'%20y='1.48151'%20width='55'%20height='21'%20rx='9'%20transform='rotate(-1%200.820908%201.48151)'%20fill='%23D9D9D9'/%3e%3c/svg%3e") center/50% no-repeat;-webkit-mask-composite:source-out;mask-composite:subtract;will-change:transform;z-index:1}.preloader-content{z-index:2}.preloader-footer{position:absolute;bottom:1rem;left:50%;transform:translate(-50%);width:30%;text-align:center}.preloader-footer p{color:var(--base-300);opacity:.5}.line,.char{position:relative;padding-bottom:.2em;margin-bottom:-.2em}@media (max-width: 800px){.preloader-progress-bar{left:0;width:100%;transform:translate(0) scaleX(0)}.preloader-logo h1{font-size:2rem}.preloader-mask{mask:linear-gradient(var(--base-300),var(--base-300)),url("data:image/svg+xml,%3csvg%20width='57'%20height='23'%20viewBox='0%200%2057%2023'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20x='0.820908'%20y='1.48151'%20width='55'%20height='21'%20rx='9'%20transform='rotate(-1%200.820908%201.48151)'%20fill='%23D9D9D9'/%3e%3c/svg%3e") center/90% no-repeat;-webkit-mask-composite:source-out;mask-composite:subtract}.preloader-footer{width:75%}}