:root {
  --font-sans: "Montserrat", Arial, sans-serif;
  --color-brand-100: #e8ffd1;
  --color-brand-200: #d5ffa3;
  --color-brand-400: #a3ff2e;
  --color-brand-500: #ccff00;
  --color-brand-600: #66cc00;
  --color-brand-700: #4da600;
  --color-cream-50: #ffffff;
  --color-cream-100: #f7f7f3;
  --color-cream-200: #eeeee7;
  --color-cream-300: #e0e0d6;
  --color-ink-400: #949494;
  --color-ink-500: #6e6e6e;
  --color-ink-600: #4d4d4d;
  --color-ink-700: #2e2e2e;
  --color-ink-800: #1e1e1e;
  --color-ink-900: #121212;
  --color-ink-950: #0a0a0a;
}
html {
  scroll-behavior: smooth;
}
body {
  font-family: var(--font-sans);
  background: var(--color-cream-50);
  color: var(--color-ink-950);
  -webkit-font-smoothing: antialiased;
}
::selection {
  background: var(--color-brand-500);
  color: var(--color-ink-950);
}
.dot-grid-cream {
  background-image: radial-gradient(#ccff0033 1.4px, transparent 1.4px);
  background-size: 26px 26px;
}
.dot-grid {
  background-image: radial-gradient(#0a0a0a24 1.4px, transparent 1.4px);
  background-size: 26px 26px;
}
.mark-brand {
  z-index: 0;
  padding: 0 0.16em;
  display: inline-block;
  position: relative;
}
.mark-brand:before {
  content: "";
  background: var(--color-brand-500);
  z-index: -1;
  border-radius: 0.14em;
  position: absolute;
  inset: 0.1em -0.02em 0.08em;
  transform: rotate(-0.7deg);
}
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
/*# sourceMappingURL=style.css.map */