/* United Interactive — temporary placeholder. Tokens from DESIGN.md v1.2.73. */
:root {
  --background: #22252e;
  --on-background: #f9fbff;
  --on-background-note: rgba(249,251,255,0.7);
  --primary: #4285f5;
  --link: #99ccff;
  --selection: #2c4b91;
}
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  background: var(--background);
  color: var(--on-background);
  font: 400 20px/30px "IBM Plex Sans", system-ui, sans-serif;
  letter-spacing: 0.2px;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}
::selection { background: var(--selection); }
a { color: var(--link); text-decoration: none; }
a:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

.grid { width: 100%; max-width: 1300px; margin: 0 auto; padding: 0 20px; }

.header { height: 60px; display: flex; align-items: center; }
.wordmark {
  font: 700 23px/26px Arimo, Arial, sans-serif;
  color: var(--on-background);
}

.hero { flex: 1; display: flex; align-items: center; padding: 100px 0; }
h1 {
  font: 700 80px/88px "Source Serif 4", Georgia, serif;
  letter-spacing: -0.5px;
  margin: 0 0 40px;
  max-width: 12em;
}
.lead { margin: 0 0 10px; max-width: 34em; }
.note {
  font-size: 15px; line-height: 22px;
  color: var(--on-background-note);
  margin: 0;
}

.footer { padding: 40px 0; }
.legal {
  font: 600 10px/15px Arimo, Arial, sans-serif;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  margin: 0;
}

@media (max-width: 760px) {
  /* Provisional, not yet in DESIGN.md: display scales with the screen below 480px so the longest word fits. Max 56/62. */
  h1 { font-size: min(56px, calc((100vw - 40px) / 7.5)); line-height: 1.107; }
  body { font-size: 18px; }
  .hero { padding: 60px 0; }
}
.nw { white-space: nowrap; }