:root { color-scheme: light dark; }
body {
  margin: 0; min-height: 100vh; display: grid; place-items: center;
  background: light-dark(#f7f6f2, #101418);
  color: light-dark(#1b2430, #e8ecf1);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  overflow-x: hidden;
}
.w-card { position: relative; width: 100%; min-height: 100vh; display: grid; place-items: center; }
.w-sea {
  position: absolute; inset: auto 0 0 0; width: 100%; height: 38vh; min-height: 180px;
  display: block; pointer-events: none;
}
.w-swell { fill: #004080; }
.w-far  { opacity: .18; animation: w-drift 13s ease-in-out infinite alternate; }
.w-mid  { opacity: .34; animation: w-drift 9s  ease-in-out infinite alternate-reverse; }
.w-near { opacity: .55; animation: w-drift 7s  ease-in-out infinite alternate; }
@media (prefers-color-scheme: dark) { .w-swell { fill: #2a6fb8; } }
@keyframes w-drift {
  from { transform: translateX(-18px); }
  to   { transform: translateX(18px); }
}
@media (prefers-reduced-motion: reduce) { .w-swell { animation: none; } }
.w-face { position: relative; text-align: center; padding: 32px 24px 42vh; max-width: 34rem; }
.w-face h1 { margin: 0; font-size: clamp(1.7rem, 5vw, 2.6rem); font-weight: 650; letter-spacing: -0.015em; text-wrap: balance; }
.w-domain {
  margin: 6px 0 26px; font-size: 1.05rem; letter-spacing: .35em; text-transform: lowercase;
  color: light-dark(#004080, #7db2e8); font-weight: 500;
}
.w-says { margin: 0 0 10px; line-height: 1.55; font-size: 1.02rem; }
.w-en { color: light-dark(#5a6675, #9aa7b5); font-size: .93rem; }
.w-reach { margin: 26px 0 8px; font-size: 1rem; }
.w-reach a { color: light-dark(#004080, #7db2e8); text-decoration: none; border-bottom: 1px solid transparent; }
.w-reach a:hover { border-bottom-color: currentColor; }
.w-registry { margin: 0; font-size: .8rem; color: light-dark(#8a94a1, #6b7683); }