:root {
  color-scheme: dark;
  --ink: #15151a;
  --ivory: #f7f6f2;
  --iris: #6258f5;
  --lavender: #e8e5ff;
  --slate: #a7a6b3;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  background: var(--ink);
  color: var(--ivory);
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
body { position: relative; isolation: isolate; min-width: 0; margin: 0; }
.atmosphere { position: fixed; z-index: -1; inset: 0; overflow: hidden; pointer-events: none; background: radial-gradient(ellipse at 96% 8%, #6258f52e, transparent 49%), radial-gradient(ellipse at -12% 108%, #6258f521, transparent 54%); }
.contour { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: var(--lavender); stroke-opacity: .095; stroke-width: 1; }
main { display: grid; min-height: 100vh; min-height: 100svh; place-items: center; padding: 100px 24px; }
.announcement { display: flex; width: 100%; flex-direction: column; align-items: center; text-align: center; }
.filter-definition { position: absolute; overflow: hidden; }
.wordmark { display: block; width: 160px; height: 96px; object-fit: contain; filter: url("#light-wordmark"); }
h1 { margin: 26px 0 32px; font-size: clamp(52px, 8.4vw, 116px); font-weight: 500; line-height: 1.08; letter-spacing: -.065em; text-wrap: balance; }
.contact { display: inline-flex; min-height: 44px; align-items: center; padding: 4px 2px; border-bottom: 1px solid #e8e5ff35; color: var(--slate); font-size: 16px; line-height: 1.5; text-decoration: none; transition: color 160ms ease, border-color 160ms ease; }
.contact:hover { border-color: var(--lavender); color: var(--lavender); }
.contact:focus-visible { border-radius: 4px; outline: 2px solid var(--lavender); outline-offset: 8px; color: var(--ivory); }
footer { position: absolute; right: 24px; bottom: max(24px, env(safe-area-inset-bottom)); left: 24px; color: var(--slate); font-size: 12px; line-height: 1.5; text-align: center; }
@media (max-width: 480px) { .wordmark { width: 136px; height: 82px; }h1 { margin-top: 24px; letter-spacing: -.06em; }.contour { width: 160%; left: -30%; }.contact { font-size: 15px; } }
@media (max-height: 420px) { main { padding-block: 28px 70px; }.wordmark { width: 100px; height: 60px; }h1 { margin: 10px 0 14px; font-size: 50px; }footer { bottom: 16px; } }
@media (prefers-reduced-motion: reduce) { .contact { transition: none; } }
@media (forced-colors: active) { .atmosphere { display: none; }.contact { color: LinkText; border-color: LinkText; } }
