:root { color-scheme: dark; --gold: #ffae24; --red: #e33b12; }
* { box-sizing: border-box; }
html { min-height: 100%; background: #080c00; }
body {
  margin: 0;
  min-height: 100svh;
  color: var(--gold);
  font-family: 'Roxie Rossa', 'Bodoni MT', 'Didot', 'Times New Roman', serif;
  font-weight: 400;
  background: linear-gradient(180deg, #0002, #0000 35%, #0009), url('curtain.svg') center / 100% 100% no-repeat scroll;
}
.invitation {
  min-height: 100svh;
  width: min(100%, 540px);
  margin-inline: auto;
  padding: clamp(54px, 14svh, 94px) 24px 52px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.brand { font-weight: 400; margin: 0; font-size: clamp(64px, 17vw, 78px); line-height: .8; letter-spacing: -4px; }
.brand span { display: block; }
.brand .number { font-size: .77em; line-height: .95; letter-spacing: -3px; margin-left: 62px; }
.coming-soon { color: var(--red); font-weight: 400; font-size: 32px; line-height: 1.2; margin: 21px 0 17px; }
.key { display: block; height: 204px; width: 94px; object-fit: contain; }
.invitation-link { font-size: 31px; line-height: 1.25; margin-top: 12px; text-decoration: none; color: var(--gold); padding: 4px 12px; border-bottom: 1px solid transparent; transition: color .2s, border-color .2s; }
.invitation-link:hover { color: #ffd991; border-color: currentColor; }
footer { margin-top: 13px; }
.instagram { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 4px; color: #e96c13; font-size: 18px; text-decoration: none; }
.instagram svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.instagram .dot { fill: currentColor; stroke: none; }
.instagram:hover { color: var(--gold); }
a:focus-visible { outline: 2px solid #ffd991; outline-offset: 6px; border-radius: 2px; }
.registration { display: grid; place-items: center; }
.registration .coming-soon { margin: 24px; }
@media (max-height: 600px) { .invitation { padding-top: 32px; padding-bottom: 24px; } .key { height: 170px; } }