@font-face {
  font-family: "Space Grotesk";
  src: url("assets/fonts/dcdfa961a0481c29.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}

@font-face {
  font-family: "DM Sans";
  src: url("assets/fonts/045087a158008760.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
}

@font-face {
  font-family: "Space Mono";
  src: url("assets/fonts/7a09cf10eb80636b.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Space Mono";
  src: url("assets/fonts/e3619975bd91f9e8.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root {
  --font-space-grotesk: "Space Grotesk", Arial, sans-serif;
  --font-dm-sans: "DM Sans", Arial, sans-serif;
  --font-space-mono: "Space Mono", monospace;
  --accent: #c8ff4d;
  --accent-hover: #dcff7a;
  --accent-text: #0e0e10;
  --bg: #0e0e10;
  --bg-elevated: #121214;
  --bg-deep: #0a0a0c;
  --surface: #161618;
  --border: #ffffff14;
  --text: #e8e6e1;
  --text-muted: #e8e6e199;
  --error: #ff7a6b;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  line-height: 1.5;
}

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-dm-sans);
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
p {
  margin-block-start: 0;
  margin-block-end: 0;
}

button,
input,
textarea {
  box-sizing: border-box;
  font: inherit;
}

a {
  color: inherit;
}

::selection {
  background: var(--accent);
  color: var(--accent-text);
}

@keyframes pm-marquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

.animate-marquee {
  animation: pm-marquee 28s linear infinite;
}

a[style*="background:var(--accent)"],
button[style*="background:var(--accent)"] {
  transition: background-color 0.2s ease, transform 0.2s ease;
}

a[style*="background:var(--accent)"]:hover,
button[style*="background:var(--accent)"]:hover {
  background: var(--accent-hover) !important;
}

input:focus,
textarea:focus {
  border-color: var(--accent) !important;
}

.faq-answer {
  padding: 0 0 26px;
  max-width: 680px;
  color: rgba(232, 230, 225, 0.65);
  font-size: 16px;
  line-height: 1.65;
}

.form-error {
  margin-top: 7px;
  color: var(--error);
  font-size: 13px;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .animate-marquee {
    animation: none;
  }
}