:root { color-scheme: dark; --gold: #d9b667; --ivory: #f4e9cd; --ease: cubic-bezier(.23,1,.32,1); }
* { box-sizing: border-box; }
html { background: #000; -webkit-font-smoothing: antialiased; }
body { margin: 0; background: #000; color: var(--ivory); }
.landing {
  min-height: 100vh; min-height: 100svh;
  padding: max(22px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(28px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  gap: clamp(20px, 3vh, 40px); overflow: clip;
}
.stage { width: min(91vw, 83svh, 1100px); perspective: 1300px; }
.emblem { transform-style: preserve-3d; transition: transform 220ms var(--ease); }
.logo { display: block; width: 100%; height: auto; overflow: visible; pointer-events: none; }
.announcement { width: 100%; text-align: center; }
h1 {
  margin: 0; font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(28px, min(5.9vw, 7svh), 105px); font-weight: 700;
  line-height: 1.06; letter-spacing: -.045em;
  color: var(--ivory); text-wrap: balance;
}
.contact {
  display: inline-flex; align-items: center; min-height: 44px;
  margin-top: clamp(16px, 2.6vh, 32px); padding: 4px 8px;
  color: var(--gold); font: 400 clamp(15px, 1.35vw, 22px)/1.5 Arial, sans-serif;
  letter-spacing: .075em; text-decoration-color: transparent;
  text-underline-offset: 6px; transition: color 150ms ease, text-decoration-color 150ms ease;
}
.contact:hover { color: #fff0be; text-decoration-color: currentColor; }
.contact:focus-visible { outline: 2px solid var(--gold); outline-offset: 5px; border-radius: 2px; }
::selection { background: var(--gold); color: #000; }
@media (max-aspect-ratio: 3/4) {
  .landing { gap: 38px; }
  .stage { width: 100%; }
  h1 { font-size: clamp(28px, 7.5vw, 60px); }
}
@media (max-height: 480px) and (min-aspect-ratio: 4/3) {
  .landing { padding-block: 16px; gap: 8px; }
  .stage { width: 70svh; }
  h1 { font-size: max(24px, 6svh); }
  .contact { margin-top: 4px; }
}
@media (prefers-reduced-motion: no-preference) {
  .stage { animation: arrive 850ms var(--ease) both; }
  .announcement { animation: appear 700ms ease-out both; }
  @keyframes arrive { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
  @keyframes appear { from { opacity: 0; } to { opacity: 1; } }
}
@media (prefers-reduced-motion: reduce) { .emblem { transition: none; transform: none !important; } }