/* GoedOnline — small utilities. */

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.text-center { text-align: center; }
.text-mute { color: var(--color-mute); }
.text-soft { color: var(--color-ink-soft); }
.text-accent { color: var(--color-accent); }
.text-cta { color: var(--color-cta-fg); }

.fw-medium { font-weight: var(--weight-medium); }
.fw-semibold { font-weight: var(--weight-semibold); }
.fw-bold { font-weight: var(--weight-bold); }

.fs-sm { font-size: var(--fs-sm); }
.fs-md { font-size: var(--fs-md); }
.fs-lg { font-size: var(--fs-lg); }

.is-uppercase { text-transform: uppercase; letter-spacing: var(--tracking-wide); }

.mt-0 { margin-top: 0; }
.mt-3 { margin-top: var(--sp-3); }
.mt-4 { margin-top: var(--sp-4); }
.mt-6 { margin-top: var(--sp-6); }
.mt-8 { margin-top: var(--sp-8); }
.mb-0 { margin-bottom: 0; }
.mb-3 { margin-bottom: var(--sp-3); }
.mb-4 { margin-bottom: var(--sp-4); }
.mb-6 { margin-bottom: var(--sp-6); }
.mb-8 { margin-bottom: var(--sp-8); }

.is-hidden { display: none !important; }

@media (max-width: 720px) {
  .hide-mobile { display: none !important; }
}

@media (min-width: 721px) {
  .hide-desktop { display: none !important; }
}

.has-glow {
  position: relative;
  isolation: isolate;
}

.has-glow::before {
  content: "";
  position: absolute;
  inset: -2rem;
  z-index: -1;
  background: radial-gradient(circle at 50% 30%, rgba(30, 91, 255, .25), transparent 60%);
  pointer-events: none;
}

.dot-grid {
  background-image: radial-gradient(rgba(255, 255, 255, .1) 1px, transparent 1px);
  background-size: 24px 24px;
}

.gradient-aurora {
  background:
    radial-gradient(60% 80% at 0% 0%, rgba(30, 91, 255, .35), transparent 60%),
    radial-gradient(60% 80% at 100% 0%, rgba(198, 242, 78, .12), transparent 60%),
    var(--color-primary);
}
