@import url('https://fonts.googleapis.com/css2?family=Unbounded:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root{
  --void:#0A0C11;
  --void-2:#0D1017;
  --panel:#12151C;
  --panel-2:#161A22;
  --line:#242933;
  --line-soft:#1B1F28;
  --platinum:#E8EAF0;
  --muted:#8891A3;
  --muted-2:#5B6376;
  --signal:#E9291F;
  --signal-2:#FF4A3D;
  --ion:#4FD5FF;
  --ion-dim: rgba(79,213,255,0.14);
}
html{scroll-behavior:smooth;}
html, body{ overflow-x:hidden; max-width:100vw; }
h1, h2, h3, h4, p{ overflow-wrap:break-word; word-break:break-word; }
body{
  background:var(--void);
  color:var(--platinum);
  font-family:'Inter',sans-serif;
  background-image:
    radial-gradient(ellipse 900px 500px at 85% -5%, rgba(79,213,255,0.08), transparent 60%),
    radial-gradient(ellipse 700px 500px at 10% 10%, rgba(233,41,31,0.06), transparent 55%);
}
.font-display{font-family:'Unbounded',sans-serif;}
.font-mono{font-family:'JetBrains Mono',monospace;}

.grain::before{
  content:"";
  position:fixed; inset:0; pointer-events:none; z-index:60; opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.hairline{border-color:var(--line);}
.glass{
  background:linear-gradient(180deg, rgba(22,26,34,0.75), rgba(18,21,28,0.55));
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.card{
  background:linear-gradient(160deg, var(--panel-2), var(--panel));
  border:1px solid var(--line);
}
.card:hover{border-color:rgba(79,213,255,0.35);}

.signal-text{color:var(--signal-2);}
.ion-text{color:var(--ion);}

.btn-primary{
  background:var(--signal);
  color:#fff;
  box-shadow:0 0 0 1px rgba(255,255,255,0.06) inset, 0 8px 30px -8px rgba(233,41,31,0.55);
}
.btn-primary:hover{background:var(--signal-2);}

.btn-ghost{
  border:1px solid var(--line);
  color:var(--platinum);
}
.btn-ghost:hover{border-color:var(--ion); color:var(--ion);}

/* Ticker */
.ticker-track{
  display:flex; width:max-content;
  animation: ticker 32s linear infinite;
}
.ticker-track:hover{animation-play-state:paused;}
@keyframes ticker{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}

/* Constellation */
.node-dot{ transition: r .25s ease, filter .25s ease; }
.node-label{ transition: fill .25s ease, opacity .25s ease; }
.orbit-line{
  stroke-dasharray: 4 2400;
  animation: draw 1.8s ease forwards;
}
@keyframes draw{ to{ stroke-dashoffset: 0; stroke-dasharray: 2400 0; } }

.pulse-ring{
  animation: pulse 2.6s ease-in-out infinite;
  transform-origin:center;
}
@keyframes pulse{
  0%,100%{ opacity:.55; transform:scale(1);}
  50%{opacity:.15; transform:scale(1.35);}
}

::selection{ background:var(--signal); color:#fff;}
[x-cloak]{ display:none !important; }

.mobile-menu{
  display:none !important;
}
.mobile-menu.is-open{
  display:flex !important;
}

.gallery-fallback{
  display:none !important;
}
.gallery-fallback.show{
  display:flex !important;
}

/* Force the Facebook Page Plugin's generated iframe to never overflow
   its container, regardless of the pixel width Facebook assigns it internally */
.fb-page, .fb-page span, .fb-page iframe{
  max-width:100% !important;
}

/* fade-in-up utility for alpine intersect */
[data-reveal]{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
[data-reveal].shown{ opacity:1; transform:translateY(0); }

.scrollbar-none::-webkit-scrollbar{display:none;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important;}
}