@font-face {
  font-family: "Galaxie Copernicus";
  font-weight: 400;
  font-style: normal;
  src: url("https://collabfund.com/assets/fonts/GalaxieCopernicus-Book.woff2") format("woff2");
}

:root{ --muted:#8b8f93; --fg:#fff; }
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; min-height:100vh; overflow:hidden;
  font-family:"Galaxie Copernicus",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  background:#000;
}
.bg{
  position:fixed; inset:-8%;
  z-index:-1;
  background-image: url('assets/monet-sunrise.jpg');
  background-size: cover;
  background-position: center;
  transform: translate3d(0,0,0) scale(1.14);
  will-change: transform;
}
.overlay-glaze{
  position:fixed; inset:0; pointer-events:none; will-change: transform;
  background:
    radial-gradient(900px 600px at 72% 28%, rgba(255,95,45,.30), rgba(255,95,45,0) 55%),
    linear-gradient(180deg, rgba(40,76,130,.20) 0%, rgba(40,76,130,.10) 40%, rgba(40,76,130,.15) 75%, rgba(20,40,90,.24) 100%),
    radial-gradient(1200px 800px at 55% 62%, rgba(255,120,60,.14), rgba(255,120,60,0) 65%);
  mix-blend-mode: overlay;
  opacity:.9;
}
.brush{
  position:fixed; inset:-5%; pointer-events:none; will-change: transform;
  background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAB4CAYAAABx7m9rAAAACXBIWXMAAAsSAAALEgHS3X78AAABkElEQVR4nO3dwU3bQBCF4SZf3c8h6Qw1mX4k1d5mJkJQw3lqFqkqgq6n1V1oR7e4s3YxT0Z9x7zP1wC9K5r8E1Qw1m+7o3Hqv4p1q2fG5+2n7bR8t7h1z+gJtQm0w5N2bO7jv3JmCq4l3q2gq7g3JwHj4b3bFeqg9xv2yFv6i1v4f0y7Q1m9I+0r0p9pP0oYfI9mYJr2wQ1k5H6v4C2i2gY7yQ0Vn5pC6F1m4m3CkPp8fqt0d3W0m7y8N6gk8Zf2n9m8i2i2aWw0v7m9f5vK6i2eYb2Gk2Z6Wb0k8e5cP8lQz7m9B4W5a3a+3Y3i6n3Wl9sX4cF5+eGm8j7b7r6d6b+U2r+5xq0G3Q8v/8IP4n2Qk6mL3w3qvE7JmZg9n+gZt3yV0cU2e3Qm7fQk9f3b5+4v4g6m7m8vH5y8+Gm8r7c9qYQmZK3eQJt8Qq6n4GdQmYb7m8FQAAAAAElFTkSuQmCC');
  background-size: 360px 360px; background-repeat: repeat;
  mix-blend-mode: multiply; opacity:.22;
}
.grain{
  position:fixed; inset:0; pointer-events:none; will-change: transform;
  background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAAAQCAYAAAB5GJ0iAAAABHNCSVQICAgIfAhkiAAAAF1JREFUWIXt1cENgCAQBEF0/3/5o3Qk0gVbq1c6D7Qy0wq0w0z7Wv2l7l5z5d2g6Qd/2L8d6gK7Qe0c1yP6bq2GZ6C0y0j5mP9w6gk0x0m2sXk7j8X1Q6Yy7oH0H7u8z0z7aKf0m2o6c2w0gN3z0G0Rj7gAA0m1I1m2bqgAAAABJRU5ErkJggg==');
  background-size:256px 256px; background-repeat:repeat;
  mix-blend-mode:multiply; opacity:.06;
}
.main{ position:relative; width:100%; height:100vh; display:flex; align-items:center; justify-content:center; padding:4vw; }
.logo-wrap{ position:fixed; top:20px; right:20px; text-align:right; z-index:10; }
.logo{
  width: clamp(40px, 3vw, 50px);
  height:auto;
  filter: drop-shadow(0 2px 0 rgba(0,0,0,.05)) drop-shadow(0 10px 22px rgba(0,0,0,.18));
  opacity:0; 
  transform: translateY(-6px);
  animation: logoIn .9s ease-out .4s forwards;
}
@keyframes logoIn{ to{ opacity:1; transform:none } }
.logo-tooltip{
  position:relative; 
  margin-top:8px; 
  color:#fff; 
  font-size:14px; 
  line-height:1.35;
  text-shadow: 0 1px 2px rgba(0,0,0,.24);
  opacity:0;
  transform: translateY(-6px);
  animation: logoIn .9s ease-out .4s forwards;
}
.logo-tooltip a{ color:#fff; text-decoration:none; border-bottom:1px solid #fff; opacity: 0.72; }
.logo-tooltip a:hover{ opacity: .92; }
.logo-wrap:hover .logo-tooltip{ opacity:.92; transform: translateY(4px); }
@media (hover:none){ .logo-wrap:active .logo-tooltip{ opacity:.92; transform: translateY(4px); } }
.footer{ position:fixed; left:0; right:0; bottom:0; text-align:center; color:#fff; font-size:12px; padding:12px; opacity:0; animation: fadeInFooter 1s ease-out 1.2s forwards; }
@keyframes fadeInFooter{ to{ opacity:.9 } }
.footer a{ color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,0) }
.footer a:hover{ border-color:#fff }