@font-face { font-family: "GT Eesti"; src: url("/fonts/GT-Eesti-Display-Light.woff2") format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "GT Eesti"; src: url("/fonts/GT-Eesti-Display-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "GT Eesti"; src: url("/fonts/GT-Eesti-Display-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  --color-bg-deep: #151519;
  --color-manatee: #8B8EA8;
  --color-text-primary: #FFFFFF;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; }
html { line-height: 1.5; -webkit-text-size-adjust: 100%; }
body {
  min-height: 100vh;
  background: var(--color-bg-deep);
  color: var(--color-text-primary);
  font-family: "GT Eesti", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
main {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 1.5rem;
}
h1 { font-size: 3rem; line-height: 1; font-weight: 700; letter-spacing: normal; }
h1 .dot { color: var(--color-manatee); }
.tagline { font-size: 1.25rem; line-height: 1.75rem; font-weight: 300; color: var(--color-manatee); margin: 0.75rem 0 2.5rem; }
iframe { display: block; border-radius: 1rem; width: 100%; height: 75vh; }
iframe + iframe { margin-top: 1.5rem; }

@media (min-width: 768px) {
  h1 { font-size: 4.5rem; }
  .tagline { font-size: 1.5rem; line-height: 2rem; }
  iframe { width: 80%; height: 70vh; }
}
@media (min-width: 1024px) {
  h1 { font-size: 6rem; }
}