@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600&family=Geist+Mono:wght@400;500&display=swap');
:root{--onyx:#0B0B0C;--panel:#111113;--ink:#F4F2EE;--ink2:rgba(244,242,238,.66);--ink3:rgba(244,242,238,.4);--line:rgba(244,242,238,.09);--line2:rgba(244,242,238,.16);--sig:#FF4F00;
  --ui:'Geist',system-ui,sans-serif;--mono:'Geist Mono',ui-monospace,monospace}
*{box-sizing:border-box}
html,body{margin:0;background:var(--onyx);color:var(--ink);font:400 16px/1.6 var(--ui);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.wrap{max-width:1200px;margin:0 auto;padding:0 40px}
nav.top{display:flex;justify-content:space-between;align-items:center;padding:26px 40px;max-width:1280px;margin:0 auto}
nav.top img{height:22px;display:block}
nav.top .mail{font:400 12px var(--mono);letter-spacing:.06em;color:var(--ink2)}
.mono{font-family:var(--mono)}
.eyebrow{font:500 11px var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--ink3)}
.mark{display:block;overflow:visible}
.mark .b{fill:var(--ink)}
.mark .pt{fill:var(--sig)}
/* the blades lock onto the point; the point lands with its one glow */
@keyframes in-tl{from{transform:translate(-14px,-14px);opacity:0}to{transform:none;opacity:1}}
@keyframes in-tr{from{transform:translate(14px,-14px);opacity:0}to{transform:none;opacity:1}}
@keyframes in-br{from{transform:translate(14px,14px);opacity:0}to{transform:none;opacity:1}}
@keyframes in-bl{from{transform:translate(-14px,14px);opacity:0}to{transform:none;opacity:1}}
@keyframes land{0%{opacity:0;transform:scale(2.2)}60%{opacity:1;transform:scale(.9)}100%{opacity:1;transform:scale(1)}}
@keyframes breathe{0%,100%{opacity:.55}50%{opacity:.9}}
.mark .b1{animation:in-tr 1.1s cubic-bezier(.2,.8,.2,1) .2s both}
.mark .b2{animation:in-br 1.1s cubic-bezier(.2,.8,.2,1) .3s both}
.mark .b3{animation:in-bl 1.1s cubic-bezier(.2,.8,.2,1) .4s both}
.mark .b4{animation:in-tl 1.1s cubic-bezier(.2,.8,.2,1) .5s both}
.mark .pt{transform-origin:50px 50px;animation:land .7s cubic-bezier(.2,.8,.2,1) 1.4s both}
.glow{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,79,0,.32),rgba(255,79,0,.08) 40%,transparent 70%);pointer-events:none;animation:breathe 6s ease-in-out 2s infinite both}
footer{border-top:1px solid var(--line);padding:28px 40px;display:flex;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;font:400 12px var(--mono);color:var(--ink3);max-width:1280px;margin:0 auto;width:100%;box-sizing:border-box}
@media (max-width:700px){.wrap,nav.top,footer{padding-left:16px;padding-right:16px}}