:root{color-scheme:dark;--bg:#090a0b;--text:#f4f4f1;--muted:#a1a3a6;--line:#282a2d}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:40px}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:hover{color:#c3c6cf}a:focus-visible,button:focus-visible{outline:2px solid white;outline-offset:7px}img{display:block;max-width:100%}.wrap{width:min(1240px,calc(100% - 96px));margin-inline:auto}.header{height:108px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:12px;font-size:28px;font-weight:600;letter-spacing:-1.1px}.brand-icon{width:35px;height:38px;background:#fff;-webkit-mask:url(assets/emblem-mask.png) center/76px 76px no-repeat;mask:url(assets/emblem-mask.png) center/76px 76px no-repeat}.header nav{display:flex;gap:38px;font-size:15px}.header nav span{margin-left:9px}.hero{min-height:650px;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;position:relative;padding-block:64px 94px}.hero-copy{position:relative;z-index:1}h1{font-size:clamp(58px,6.5vw,92px);line-height:1.02;letter-spacing:-5px;font-weight:500;margin:0 0 32px}h1 span{color:#999da5}.hero-copy p{font-size:18px;line-height:1.7;max-width:390px;color:var(--muted);margin:0 0 35px}.button{display:inline-flex;align-items:center;gap:36px;background:#eeeef0;color:#111216;border-radius:6px;padding:17px 23px;font-size:15px;font-weight:600;min-height:52px}.button:hover{background:#d8dbe2;color:#111216}.logo-stage{width:100%;height:510px;position:relative;perspective:1000px;display:grid;place-items:center;background:radial-gradient(ellipse at center,#727b9520,transparent 67%)}.logo-object{position:relative;width:600px;height:600px;max-width:120%;transform-style:preserve-3d;transform:rotateX(12deg) rotateY(-22deg) rotateZ(-7deg);animation:float-logo 9s ease-in-out infinite;will-change:transform}.logo-layer{position:absolute;inset:0;background:#565e6d;-webkit-mask:url(assets/emblem-mask.png) center/100% 100% no-repeat;mask:url(assets/emblem-mask.png) center/100% 100% no-repeat;backface-visibility:hidden}.layer-back{transform:translateZ(-20px);background:linear-gradient(135deg,#e0e3e8,#252a34 45%,#797f8a)}.layer-4{transform:translateZ(-16px);background:#424957}.layer-3{transform:translateZ(-12px);background:#606a7a}.layer-2{transform:translateZ(-8px);background:#8d96a3}.layer-1{transform:translateZ(-4px);background:#c5cbd2}.layer-face{transform:translateZ(0);background:linear-gradient(135deg,#fff 20%,#f3f5f8 40%,#b2bac7 59%,#fafbfc 75%,#bac2cd)}.logo-shadow{position:absolute;bottom:32px;width:53%;height:25px;border-radius:50%;background:radial-gradient(ellipse,#0009,transparent 72%)}@keyframes float-logo{0%,100%{transform:translateY(7px) rotateX(12deg) rotateY(-22deg) rotateZ(-7deg)}50%{transform:translateY(-16px) rotateX(-8deg) rotateY(20deg) rotateZ(3deg)}}.motion-toggle{position:absolute;bottom:48px;right:12px;width:44px;height:44px;display:grid;place-items:center;border:1px solid #30343c;background:transparent;color:#9da3af;border-radius:50%;cursor:pointer}.motion-toggle[hidden]{display:none}.motion-toggle svg{stroke:currentColor;stroke-width:1.7;fill:none}.play-icon{display:none}.motion-toggle[aria-pressed=true] .pause-icon{display:none}.motion-toggle[aria-pressed=true] .play-icon{display:block}.motion-paused .logo-object{animation-play-state:paused}h2{font-weight:500;font-size:34px;letter-spacing:-1px;margin:0}h3{font-weight:500;font-size:30px;letter-spacing:-.7px;margin:0 0 12px}.apps{padding-block:58px 80px;border-top:1px solid var(--line)}.apps h2{margin-bottom:35px}.product{display:grid;grid-template-columns:80px 1fr auto;align-items:center;gap:30px;padding:38px 0;border-block:1px solid var(--line)}.app-icon{border-radius:19px}.app-copy p{max-width:490px;color:var(--muted);font-size:17px;line-height:1.7;margin:0}.store-link{display:flex;align-items:center;gap:25px;border-bottom:1px solid #727782;padding-block:14px;font-size:15px;white-space:nowrap}.about{display:grid;grid-template-columns:1fr 1.5fr;gap:60px;padding-block:45px 90px}.about p{font-size:24px;line-height:1.6;letter-spacing:-.35px;color:#bdc0c6;margin:0;max-width:700px}.brand-banner{background:#000;border-radius:8px;overflow:hidden}.brand-banner img{width:100%;height:auto}.contact{padding-block:100px;display:grid;grid-template-columns:1fr 1.1fr;gap:70px;align-items:center}.contact h2{font-size:58px;letter-spacing:-2px}.contact p{color:var(--muted);font-size:17px;line-height:1.6;max-width:330px;margin-bottom:0}.email{font-size:clamp(19px,2.1vw,28px);display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid #5d626a;padding-bottom:25px;letter-spacing:-.5px}.socials{display:flex;flex-wrap:wrap;gap:30px;margin-top:25px;font-size:15px}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-block:28px 35px;color:var(--muted);font-size:14px}.skip{position:fixed;top:-100px;left:15px;padding:15px;background:white;color:black;z-index:10}.skip:focus{top:15px}@media(max-width:1000px){.wrap{width:calc(100% - 64px)}h1{font-size:68px;letter-spacing:-3.5px}.hero{min-height:590px}.logo-stage{height:400px}.logo-object{width:480px;height:480px}.product{grid-template-columns:72px 1fr;gap:24px}.app-icon{width:72px;height:72px}.store-link{grid-column:2;justify-self:start}.about{grid-template-columns:1fr 1.4fr;gap:30px}.contact{gap:35px}.socials{gap:20px}}@media(max-width:640px){.wrap{width:calc(100% - 40px)}.header{height:88px}.brand{font-size:25px;gap:8px}.brand-icon{width:30px;height:34px;-webkit-mask-size:66px 66px;mask-size:66px 66px}.header nav{gap:20px;font-size:14px}.header nav a:nth-child(2){display:none}.header nav span{display:none}.hero{grid-template-columns:1fr;padding-block:40px 48px;min-height:0}h1{font-size:clamp(50px,12vw,72px);letter-spacing:-3px;line-height:1.05;margin-bottom:25px}.hero-copy p{font-size:17px;max-width:340px;margin-bottom:27px}.button{padding:16px 21px;font-size:15px}.logo-stage{height:330px;margin-top:15px;perspective:850px;overflow:hidden}.logo-object{width:410px;height:410px;max-width:none}.logo-shadow{bottom:8px}.motion-toggle{bottom:25px;right:0}.apps{padding-block:40px 48px}h2{font-size:29px}.apps h2{margin-bottom:24px}.product{grid-template-columns:60px 1fr;padding:28px 0;gap:20px}.app-icon{width:60px;height:60px;border-radius:15px;align-self:start}.app-copy h3{font-size:27px;margin-bottom:10px}.app-copy p{font-size:16px;line-height:1.65}.store-link{font-size:14px;gap:20px}.about{grid-template-columns:1fr;gap:22px;padding-block:15px 50px}.about p{font-size:20px;line-height:1.65}.brand-banner{border-radius:4px}.contact{grid-template-columns:1fr;padding-block:55px;gap:30px}.contact h2{font-size:44px;letter-spacing:-1.5px}.contact p{font-size:16px}.email{font-size:21px;letter-spacing:-.6px;padding-bottom:20px}.socials{font-size:14px;justify-content:space-between;gap:16px}footer{font-size:13px;padding-block:24px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.logo-object{animation:none;will-change:auto}.motion-toggle{display:none}}

/* The supplied banner has its wordmark on the right: center the artwork, not its canvas. */
.brand-banner{position:relative;display:flex;align-items:center;justify-content:center;height:clamp(180px,25vw,330px);isolation:isolate;border:1px solid #252933}
.brand-banner img{flex:none;width:140%;max-width:none;height:auto;transform:translate(-20.7%,1.3%)}
.brand-banner::after{content:"";position:absolute;inset:-60% -25%;pointer-events:none;background:linear-gradient(110deg,transparent 40%,#b7d7ff09 47%,#dcecff1a 50%,#b7d7ff09 53%,transparent 60%);transform:translateX(-65%);animation:light-pass 9s ease-in-out infinite;z-index:1}
@keyframes light-pass{0%,20%{transform:translateX(-65%);opacity:0}30%{opacity:1}70%{opacity:1}80%,100%{transform:translateX(65%);opacity:0}}
.logo-stage::before{content:"";position:absolute;inset:12%;background-image:linear-gradient(#b5c9ed0d 1px,transparent 1px),linear-gradient(90deg,#b5c9ed0d 1px,transparent 1px);background-size:46px 46px;-webkit-mask-image:radial-gradient(ellipse,#000,transparent 70%);mask-image:radial-gradient(ellipse,#000,transparent 70%);transform:perspective(700px) rotateX(28deg) rotateZ(-15deg);pointer-events:none}
.logo-stage::after{content:"";position:absolute;width:72%;height:72%;border:1px solid #8ca2cc20;border-top-color:#bed4ff55;border-radius:50%;transform:rotateX(60deg) rotateZ(-25deg);animation:orbital-drift 16s ease-in-out infinite;pointer-events:none;z-index:-1}
.logo-stage{isolation:isolate}
@keyframes orbital-drift{0%,100%{transform:rotateX(60deg) rotateY(-15deg) rotateZ(-25deg);opacity:.4}50%{transform:rotateX(65deg) rotateY(20deg) rotateZ(35deg);opacity:.8}}
.social-icon{width:19px;height:19px;flex:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;fill:none}.icon-dot{fill:currentColor;stroke:none}
.socials a{display:inline-flex;align-items:center;gap:9px;min-height:44px}.socials{gap:22px}.socials a>span{color:#828e9e;margin-left:2px}.store-link{gap:12px}.store-link>span{margin-left:12px}.button,.app-icon,.social-icon,.header nav a{transition:transform .25s ease,color .25s ease,background .25s ease}.button:hover{transform:translateY(-3px)}.socials a:hover .social-icon{transform:translateY(-3px);color:#c8dbff}.product:hover .app-icon{transform:translateY(-4px)}.header nav a:hover{color:#c8dbff}
.motion-paused .logo-object,.motion-paused .logo-stage::after,.motion-paused .brand-banner::after,.hero.is-offscreen .logo-object,.hero.is-offscreen .logo-stage::after,.brand-banner.is-offscreen::after{animation-play-state:paused}
@media(max-width:640px){.socials{gap:14px}.socials a{gap:6px;font-size:13px}.social-icon{width:17px;height:17px}.store-link{gap:8px;font-size:13px}.store-link>span{margin-left:0}.logo-stage::after{width:75%;height:75%}.brand-banner{height:180px}}
@media(prefers-reduced-motion:reduce){.brand-banner::after,.logo-stage::after{animation:none}.brand-banner::after{display:none}.button,.app-icon,.social-icon,.header nav a{transition:none}}

/* A touch-responsive emblem above a perspective floor. */
.logo-stage{-webkit-appearance:none;appearance:none;padding:0;border:0;border-radius:12px;font:inherit;color:inherit;cursor:pointer;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.logo-response{position:relative;width:600px;height:600px;max-width:120%;transform-style:preserve-3d;z-index:2}
.logo-response .logo-object{width:100%;height:100%;max-width:none;pointer-events:none}
.logo-stage::before{inset:auto;left:12%;bottom:0;width:76%;height:150px;border-radius:50%;background-image:linear-gradient(#b5c9ed24 1px,transparent 1px),linear-gradient(90deg,#b5c9ed24 1px,transparent 1px);background-size:24px 24px;-webkit-mask-image:radial-gradient(ellipse,#000 20%,transparent 72%);mask-image:radial-gradient(ellipse,#000 20%,transparent 72%);transform:perspective(650px) rotateX(60deg);z-index:0}
.logo-stage::after{inset:auto;left:12%;bottom:0;width:76%;height:150px;border:1px solid #8ca2cc50;border-top-color:#bed4ff28;box-shadow:inset 0 0 0 18px #090a0b,inset 0 0 0 19px #8ca2cc25;transform:perspective(650px) rotateX(60deg);animation:none;opacity:.8;z-index:0}
.logo-shadow{bottom:30px;height:32px;z-index:1;width:46%;background:radial-gradient(ellipse,#000d,transparent 70%);pointer-events:none}
.floor-pulse{position:absolute;left:12%;bottom:0;width:76%;height:150px;border-radius:50%;border:1px solid #d8e6ff;opacity:0;transform:perspective(650px) rotateX(60deg);pointer-events:none;z-index:1}
@media(max-width:1000px){.logo-response{width:480px;height:480px}}
@media(max-width:640px){.logo-response{width:100%;height:auto;aspect-ratio:1;max-width:360px}.logo-stage::before,.logo-stage::after,.floor-pulse{left:10%;width:80%;bottom:0;height:100px}.logo-shadow{bottom:18px;height:25px}}
