:root {
  --cyan: #00D1FF;
  --blue: #0077FF;
  --violet: #8B5CF6;
  --magenta: #D946EF;
  --ink: #0B1020;
  --slate: #1F2937;
  --mist: #E5E7EB;
}

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  background: var(--ink);
}

body {
  min-width: 320px;
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0;
  overflow: hidden;
  color: var(--mist);
  background:
    radial-gradient(circle at 24% 38%, rgb(0 209 255 / 8%), transparent 32rem),
    radial-gradient(circle at 76% 56%, rgb(217 70 239 / 8%), transparent 34rem),
    radial-gradient(circle at 50% 48%, #101a36 0%, var(--ink) 58%, #070b16 100%);
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif;
}

.holding-page {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  padding: clamp(1.5rem, 5vw, 5rem);
  isolation: isolate;
}

.holding-page::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: min(76vw, 72rem);
  aspect-ratio: 1;
  border-radius: 999px;
  background:
    radial-gradient(circle, rgb(0 119 255 / 9%) 0%, rgb(139 92 246 / 4%) 38%, transparent 70%);
  filter: blur(40px);
  pointer-events: none;
}

.brand-lockup {
  display: block;
  width: min(88vw, 1200px);
}

.brand-lockup img {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  -webkit-user-drag: none;
  filter: drop-shadow(0 1.5rem 3.5rem rgb(0 0 0 / 18%));
}

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

@media (max-width: 640px) {
  .holding-page {
    padding-inline: 1rem;
  }

  .brand-lockup {
    width: 96vw;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .brand-lockup {
    animation: reveal 650ms cubic-bezier(.2, .8, .2, 1) both;
  }

  @keyframes reveal {
    from {
      opacity: 0;
      transform: translateY(6px) scale(.992);
    }

    to {
      opacity: 1;
      transform: translateY(0) scale(1);
    }
  }
}