@font-face{font-family:Transcity;src:url(/transcity/Transcity.otf)format("opentype");font-weight:400;font-style:normal;font-display:swap}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;font-family:Lato,-apple-system,BlinkMacSystemFont,sans-serif}body{overflow:hidden}body.scroll-enabled{overflow:hidden auto}.logo-element{z-index:1001;width:200px;height:200px;animation:1.5s ease-in-out infinite logoSway;position:fixed;top:50%;left:50%;overflow:visible;transform:translate(-50%,-50%)rotate(0)}@keyframes logoSway{0%,to{transform:translate(-50%,-50%)rotate(0)}50%{transform:translate(-50%,-50%)rotate(10deg)}}.logo-element.dropping{animation:1.8s ease-in-out forwards logoDrop}@keyframes logoDrop{0%{clip-path:inset(0);top:50%;transform:translate(-50%,-50%)rotate(0)scale(1)}15%{clip-path:inset(0);top:50%;transform:translate(-50%,-50%)rotate(-15deg)scale(1)}30%{clip-path:inset(0);top:50%;transform:translate(-50%,-50%)rotate(12deg)scale(1)}45%{clip-path:inset(0);top:50%;transform:translate(-50%,-50%)rotate(0)scale(1.1)}to{clip-path:inset(0 0 35%);top:calc(100% - 100px);transform:translate(-50%)rotate(0)scale(1.6)}}.logo-img{object-fit:contain;width:100%;height:100%}.preloader-bg{z-index:1000;background:#d5bca6;width:100%;height:100%;position:fixed;top:0;left:0}.preloader-bg.fade-out{animation:.8s forwards bgFade}@keyframes bgFade{0%{opacity:1}to{opacity:0;visibility:hidden;pointer-events:none}}.main-content{opacity:0;visibility:hidden;width:100%;height:100%}.main-content.visible{opacity:1;visibility:visible}.navbar{z-index:100;opacity:0;justify-content:space-between;align-items:center;width:100%;padding:20px 40px;display:flex;position:fixed;top:0;left:0;transform:translateY(-30px)}.main-content.visible .navbar{animation:.6s .5s forwards navSlideIn}@keyframes navSlideIn{to{opacity:1;transform:translateY(0)}}.nav-left{align-items:center;gap:15px;display:flex}.nav-logo{width:35px;height:35px;transform:rotate(-45deg)}.nav-logo-svg{width:100%;height:100%}.nav-brand{flex-direction:column;display:flex}.brand-name{color:#fff;letter-spacing:3px;font-family:Cormorant Garamond,Georgia,serif;font-size:20px;font-weight:600}.brand-tagline{color:#fff9;letter-spacing:2px;text-transform:uppercase;margin-top:2px;font-size:8px}.nav-right{align-items:center;gap:20px;display:flex}.nav-link{color:#fffc;font-size:13px;font-weight:400;text-decoration:none;transition:color .3s}.nav-link:hover{color:#fff}.nav-icon{background:#fff;border-radius:6px;justify-content:center;align-items:center;width:45px;height:45px;padding:10px;display:flex}.nav-icon-svg{width:100%;height:100%;transform:rotate(-45deg)}.hero{background:#d5bca6;width:100%;height:100vh;position:relative;overflow:hidden}.hero-images{z-index:1;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.hero-image-left,.hero-image-right{opacity:0;flex:1;height:100%;position:relative;overflow:hidden}.main-content.images-visible .hero-image-left,.main-content.images-visible .hero-image-right{animation:1s forwards fadeInImage}@keyframes fadeInImage{to{opacity:1}}.hero-image-left img,.hero-image-right img{object-fit:cover;object-position:center;width:200%;height:100%}.hero-image-left img{object-position:right center}.hero-image-right img{object-position:left center;margin-left:-100%}.hero-heading{z-index:10;pointer-events:none;opacity:0;width:100%;height:100%;position:absolute;top:0;left:0}.main-content.images-visible .hero-heading{opacity:1;pointer-events:auto;transition:opacity 1s .5s}#sandCanvas{width:100%;height:100%;display:block}.hero-content{text-align:center;z-index:20;width:90%;max-width:600px;position:absolute;top:40%;left:50%;transform:translate(-50%,-50%)}.hero-title{color:#fff;text-shadow:0 2px 10px #0000004d;margin-bottom:25px;font-family:Cormorant Garamond,Georgia,serif;font-size:clamp(26px,4.5vw,48px);font-weight:400;line-height:1.5}.hero-title strong{font-weight:600}.title-line{opacity:0;display:block;transform:translateY(40px)}.main-content.text-visible .title-line-1{animation:.7s forwards textReveal}.main-content.text-visible .title-line-2{animation:.7s .15s forwards textReveal}.main-content.text-visible .title-line-3{animation:.7s .3s forwards textReveal}@keyframes textReveal{to{opacity:1;transform:translateY(0)}}.hero-cta{color:#fff;opacity:0;text-shadow:0 2px 8px #0000004d;align-items:center;gap:8px;font-size:13px;font-weight:500;text-decoration:none;display:inline-flex;transform:translateY(20px)}.main-content.text-visible .hero-cta{animation:.6s .5s forwards textReveal}.cta-arrow{width:14px;height:14px}.scroll-indicator{color:#ffffffb3;letter-spacing:1px;opacity:0;z-index:100;font-size:11px;position:absolute;bottom:30px;right:40px}.main-content.text-visible .scroll-indicator{animation:.6s .8s forwards fadeIn}@keyframes fadeIn{to{opacity:1}}.ground-bar{z-index:1002;clip-path:polygon(0% 100%,0% 45%,5% 40%,10% 35%,15% 38%,20% 50%,25% 55%,30% 48%,35% 35%,40% 25%,45% 30%,50% 40%,55% 35%,60% 28%,65% 35%,70% 45%,75% 40%,80% 30%,85% 25%,90% 35%,95% 45%,100% 40%,100% 100%);background:#000;width:100%;height:150px;position:absolute;bottom:0;left:0;transform:translateY(100%)}.main-content.visible .ground-bar{animation:.8s cubic-bezier(.22,1,.36,1) .3s forwards groundSlideUp}@keyframes groundSlideUp{to{transform:translateY(0)}}@media (max-width:768px){.navbar{padding:15px 20px}.nav-brand{display:none}.logo-element{width:150px;height:150px}.hero-content{padding:0 20px;top:35%}.scroll-indicator{right:20px}.hero-images{flex-direction:column}.hero-image-left{width:100%;height:100%;display:block;position:absolute;top:0;left:0}.hero-image-right{display:none}.hero-image-left img{object-fit:cover;object-position:center;width:100%;height:100%}.logo-element.dropping{animation:1.8s ease-in-out forwards logoDropMobile}@keyframes logoDropMobile{0%{clip-path:inset(0);top:50%;transform:translate(-50%,-50%)rotate(0)scale(1)}15%{clip-path:inset(0);top:50%;transform:translate(-50%,-50%)rotate(-15deg)scale(1)}30%{clip-path:inset(0);top:50%;transform:translate(-50%,-50%)rotate(12deg)scale(1)}45%{clip-path:inset(0);top:50%;transform:translate(-50%,-50%)rotate(0)scale(1.1)}to{clip-path:inset(0 0 50%);top:calc(100% - 80px);transform:translate(-50%)rotate(0)scale(1.4)}}}
