/* Coming-soon page ("/"). Montserrat, uppercase name, the G mark. */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  background: #0a0d0f;
  color: #f2f2f2;
  font-family: Montserrat, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.gm-soon {
  --s: min(14vw, 132px); /* lockup scale: the name's font size */
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}
/* The lockup's width comes from the mark + name row only; the line below
   is zero-width and stretches to exactly that width. */
.gm-soon__lockup { display: inline-grid; justify-items: stretch; row-gap: calc(var(--s) * 0.28); }
.gm-soon__row { display: flex; align-items: center; gap: calc(var(--s) * 0.22); }
.gm-soon__mark {
  width: calc(var(--s) * 0.74);
  height: auto;
  flex-shrink: 0;
  opacity: 0;
  transform: scale(0.8);
  animation: soon-in 0.6s cubic-bezier(0.625, 0.05, 0, 1) 0.15s forwards;
}
.gm-soon__mark .mark-bar {
  opacity: 0;
  transform: translateX(28%);
  animation: soon-bar 0.5s cubic-bezier(0.625, 0.05, 0, 1) 0.4s forwards;
}
.gm-soon__name {
  margin: 0;
  font-weight: 800;
  font-size: var(--s);
  line-height: 0.8;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  clip-path: inset(-10% 100% -10% 0);
  animation: soon-wipe 0.8s cubic-bezier(0.625, 0.05, 0, 1) 0.55s forwards;
}
.gm-soon__line {
  width: 0;
  min-width: 100%;
  margin: 0;
  font-weight: 500;
  font-size: calc(var(--s) * 0.45); /* natural width ~99% of the lockup */
  line-height: 1.1;
  white-space: nowrap;
  text-align: justify;
  text-align-last: justify;
  color: rgba(242, 242, 242, 0.72);
  opacity: 0;
  animation: soon-fade 0.6s ease 1.2s forwards;
}
@keyframes soon-in { to { opacity: 1; transform: scale(1); } }
@keyframes soon-bar { to { opacity: 1; transform: translateX(0); } }
@keyframes soon-wipe { to { clip-path: inset(-10% 0 -10% 0); } }
@keyframes soon-fade { to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .gm-soon__mark, .gm-soon__mark .mark-bar, .gm-soon__name, .gm-soon__line {
    animation: none; opacity: 1; transform: none; clip-path: none;
  }
}