@font-face{font-family:Clash;src:url('assets/clash.woff2') format('woff2');font-weight:200 700;font-display:swap}
@font-face{font-family:Satoshi;src:url('assets/satoshi.otf') format('opentype');font-weight:400;font-display:swap}
:root{color-scheme:dark;--black:#080b09;--white:#f3f5ee;--green:#87bd4c;--muted:#8f9c90;--mx:50%;--my:50%;--reveal:11%}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;background:var(--black);overflow:hidden}
body{font-family:Satoshi,Arial,sans-serif;color:var(--white)}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:2px solid #acd77f;outline-offset:5px}
.page{width:100%;height:100vh;height:100dvh;min-height:0;padding:0 max(4.5vw,env(safe-area-inset-right)) 0 max(4.5vw,env(safe-area-inset-left));display:grid;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden;background:radial-gradient(circle at 50% 48%,#141a16 0,transparent 46%),var(--black)}
.header,.footer{position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between}
.header{height:clamp(64px,10vh,92px);padding-top:env(safe-area-inset-top);border-bottom:1px solid #f3f5ee0b}
.footer{height:clamp(50px,8vh,70px);padding-bottom:env(safe-area-inset-bottom);border-top:1px solid #f3f5ee0b;font-size:8px;letter-spacing:1.7px;color:var(--muted)}
.brand{display:block;width:170px;height:47px;position:relative;overflow:hidden;mix-blend-mode:lighten}
.brand img{position:absolute;width:278px;height:auto;max-width:none;left:-54px;top:-57px}
.contact{font-size:10px;letter-spacing:.5px;color:#a5aea0;transition:color .25s}.contact span{color:var(--green);font-size:15px;margin-left:10px}.contact:hover{color:var(--white)}
.stage{position:relative;width:100%;min-width:0;min-height:0;isolation:isolate;display:grid;place-items:center;--size:min(58vw,73vh)}
.stage:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.94%,#ffffff08 50%,transparent 50.06%);pointer-events:none}
.noise{position:absolute;inset:0;opacity:.055;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}
.message{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Clash,Arial,sans-serif;font-size:clamp(74px,min(12.2vw,20vh),220px);font-weight:500;line-height:.69;letter-spacing:-.065em;text-transform:uppercase;pointer-events:none;white-space:nowrap}
.line{display:flex;justify-content:center}.line-coming{transform:translateX(-18%)}.line-soon{transform:translateX(25%)}
.message-base{z-index:4}.message-base .line-coming{color:#f3f5ee;text-shadow:0 8px 40px #0008}.message-base .line-soon{color:transparent;-webkit-text-stroke:1px #b4bdb175}
.message-base .line>span{display:inline-block;opacity:0;transform:translateY(40px) rotateX(-32deg);filter:blur(9px);animation:letter-in .9s cubic-bezier(.16,.8,.25,1) forwards;animation-delay:calc(.1s + var(--i)*.055s)}
.message-reveal{z-index:5;color:var(--green);clip-path:circle(var(--reveal) at var(--mx) var(--my));filter:drop-shadow(0 0 20px #87bd4c1c);transition:clip-path .35s cubic-bezier(.2,.7,.2,1)}
.message-reveal .line>span{display:block}.artifact{z-index:3;position:relative;width:var(--size);height:var(--size);padding:0;border:0;border-radius:50%;background:none;cursor:none;touch-action:manipulation;perspective:1100px}
.artifact:focus-visible{border-radius:50%;outline-offset:-4px}
.artifact-float{position:absolute;inset:0;display:block;animation:float 8s ease-in-out infinite;filter:drop-shadow(0 32px 35px #0009)}
.artifact-tilt{position:absolute;inset:0;display:block;transform-style:preserve-3d;transform:translate3d(var(--tx,0),var(--ty,0),0) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));will-change:transform}
.artifact img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none;mask-image:radial-gradient(circle,#000 52%,transparent 76%)}
.artifact-dim{filter:saturate(.7) brightness(.72);opacity:.86}.artifact-reveal{clip-path:circle(calc(var(--reveal)*1.32) at var(--ax,50%) var(--ay,50%));filter:saturate(1.15) brightness(1.06);transition:clip-path .35s cubic-bezier(.2,.7,.2,1)}
.orbit{position:absolute;inset:17%;border:1px solid #cbd3c71d;border-radius:50%;pointer-events:none}.orbit-one{transform:rotate(61deg) scaleX(.62);animation:orbit-a 13s linear infinite}.orbit-two{inset:13%;border-color:#87bd4c20;transform:rotate(-31deg) scaleX(.79);animation:orbit-b 19s linear infinite reverse}
.glint{position:absolute;inset:16%;border-radius:50%;background:linear-gradient(108deg,transparent 44%,#f3f5ee18 49%,#87bd4c25 51%,transparent 57%);mix-blend-mode:screen;transform:translateX(-90%) rotate(-6deg);opacity:0;pointer-events:none}.artifact.pulse .glint{animation:glint 1.7s ease-out}.artifact.pulse+.message-reveal{--reveal:34%}
.cursor-ring{position:absolute;left:var(--ax,50%);top:var(--ay,50%);width:56px;height:56px;margin:-28px;border:1px solid #acd77f80;border-radius:50%;opacity:0;transform:scale(.7);transition:opacity .2s,transform .3s;pointer-events:none;box-shadow:0 0 22px #87bd4c1c}.stage.engaged .cursor-ring{opacity:1;transform:scale(1)}
.coordinates{position:absolute;z-index:7;left:50%;bottom:4.5%;transform:translateX(-50%);display:flex;gap:11px;align-items:center;color:#607164;font-size:7px;letter-spacing:1.4px}.coordinates i{display:block;width:3px;height:3px;background:var(--green);border-radius:50%;box-shadow:0 0 8px var(--green)}
.motion{border:0;background:none;display:flex;gap:8px;align-items:center;padding:12px 0 12px 12px;color:var(--muted);font-size:8px;letter-spacing:1px;cursor:pointer}.motion-mark{color:var(--green);font-size:11px}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;clip:rect(0,0,0,0);overflow:hidden;white-space:nowrap}
.paused *,.paused *:before,.paused *:after{animation-play-state:paused!important}.paused .artifact-tilt{transform:none!important}.paused .message-reveal,.paused .artifact-reveal{--reveal:14%}
@keyframes letter-in{to{opacity:1;transform:translateY(0) rotateX(0);filter:blur(0)}}
@keyframes float{0%,100%{transform:translateY(4px) rotate(-.4deg)}50%{transform:translateY(-10px) rotate(.45deg)}}
@keyframes orbit-a{to{transform:rotate(421deg) scaleX(.62)}}
@keyframes orbit-b{to{transform:rotate(329deg) scaleX(.79)}}
@keyframes glint{0%{opacity:0;transform:translateX(-90%) rotate(-6deg)}28%{opacity:1}100%{opacity:0;transform:translateX(90%) rotate(-6deg)}}
@media(max-aspect-ratio:4/5){.page{padding-left:max(5.5vw,env(safe-area-inset-left));padding-right:max(5.5vw,env(safe-area-inset-right))}.header{height:70px}.brand{transform:scale(.83);transform-origin:left center}.contact{font-size:8px}.stage{--size:min(98vw,53vh)}.message{font-size:clamp(58px,min(21vw,13vh),140px);line-height:.76}.line-coming{transform:translate(-9%,-45%)}.line-soon{transform:translate(12%,45%)}.coordinates{bottom:2%;font-size:6px}.footer{height:55px}.footer>span{font-size:7px}.message-reveal{--reveal:16%}}
@media(max-width:430px){.contact{font-size:0}.contact:before{content:'CONTACT';font-size:8px;letter-spacing:1.2px}.contact span{font-size:13px}.stage{--size:min(108vw,51vh)}.message{font-size:clamp(52px,min(20.5vw,12.5vh),96px)}.coordinates{display:none}.cursor-ring{display:none}}
@media(max-height:520px) and (min-aspect-ratio:4/5){.header{height:48px}.footer{height:42px}.brand{transform:scale(.72);transform-origin:left center}.stage{--size:min(50vw,82vh)}.message{font-size:min(11vw,24vh)}.line-coming{transform:translateX(-19%)}.line-soon{transform:translateX(27%)}.coordinates{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.message-base .line>span{opacity:1;transform:none;filter:none}.artifact-tilt{transform:none!important}}
