:root { color-scheme: dark; font-family: Arial, Helvetica, sans-serif; color: #f6f9ff; background: #082a49; font-synthesis: none; -webkit-font-smoothing: antialiased; }
* { box-sizing: border-box; }
body { margin: 0; }
.landing { position: relative; isolation: isolate; min-height: 100svh; overflow: hidden; }
.backdrop { position: absolute; inset: 0; z-index: -1; }
.backdrop { background: #082a49 url('/assets/city-poster.jpg') center / cover no-repeat; }
.backdrop::after { content: ''; position: absolute; inset: 0; z-index: 2; background: rgba(2, 17, 32, .18); pointer-events: none; }
.city-video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: 0; transition: opacity 1.2s ease-in-out; }
.city-video.is-visible { opacity: 1; }
.logo { position: absolute; bottom: max(2rem, env(safe-area-inset-bottom)); left: max(2rem, env(safe-area-inset-left)); display: block; width: clamp(3rem, 4.725vw, 4.2rem); height: auto; border-radius: .525rem; box-shadow: 0 18px 55px rgba(0, 10, 22, .28); }
.text-content { position: absolute; top: 15svh; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: .8rem; width: 100%; padding: 0 1.25rem; text-align: center; }
.tagline, .launch-date { margin: 0; color: #fff; font-family: "Helvetica Neue", "Avenir Next", "Segoe UI Light", Arial, sans-serif; font-weight: 300; text-align: center; text-shadow: 0 2px 18px rgba(0, 10, 22, .45); }
.tagline { width: min(92vw, 90rem); font-size: clamp(.9375rem, 1.5vw, 2.25rem); letter-spacing: .38em; line-height: 1.5; text-indent: .38em; white-space: nowrap; }
.launch-date { font-size: clamp(.75rem, .85vw, 1rem); letter-spacing: .3em; line-height: 1.5; text-indent: .3em; }
.partner-logos { position: absolute; right: max(2rem, env(safe-area-inset-right)); bottom: max(2rem, env(safe-area-inset-bottom)); display: flex; align-items: center; }
.partner-logos img { display: block; object-fit: contain; filter: drop-shadow(0 5px 18px rgba(0, 10, 22, .36)); }
.zenzen-logo { width: clamp(4.75rem, 6vw, 6.25rem); height: auto; }
@media (max-width: 700px) {
  .city-video { object-position: 61% center; }
  .backdrop { background-position: 61% center; }
  .logo { bottom: max(1.25rem, env(safe-area-inset-bottom)); left: max(1.25rem, env(safe-area-inset-left)); width: 2.8875rem; border-radius: .4rem; }
  .text-content { gap: .7rem; padding: 0 .75rem; }
  .tagline { width: min(92vw, 24rem); white-space: normal; }
  .partner-logos { right: max(1.25rem, env(safe-area-inset-right)); bottom: max(1.25rem, env(safe-area-inset-bottom)); }
  .zenzen-logo { width: 4rem; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; } }