:root {
  --ink: #402b3d;
  --cream: #fffaf5;
  --blush: #e9dcc1;
  --rose: #97804c;
  --soft-rose: #f8f3e8;
}

* { box-sizing: border-box; }

body {
  align-items: center;
  background:
    radial-gradient(circle at 15% 15%, #fff 0 2px, transparent 2.5px) 0 0 / 52px 52px,
    linear-gradient(145deg, #f7efd9, #e7f1ed 58%, #eeeaf7);
  color: var(--ink);
  display: flex;
  flex-direction: column;
  font-family: "DM Sans", sans-serif;
  justify-content: center;
  margin: 0;
  min-height: 100svh;
  overflow-x: hidden;
  padding: 28px;
}

.reveal-card {
  background: rgb(255 250 245 / 82%);
  border: 1px solid rgb(255 255 255 / 70%);
  border-radius: 32px;
  box-shadow: 0 22px 70px rgb(88 57 76 / 14%);
  max-width: 620px;
  overflow: hidden;
  padding: clamp(24px, 4.5vw, 39px) clamp(15px, 4.5vw, 42px);
  position: relative;
  text-align: center;
  transition: background 800ms ease, box-shadow 800ms ease;
  width: 100%;
}

.eyebrow {
  color: var(--rose);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .16em;
  margin: 0 0 19px;
  text-transform: uppercase;
}

h1, h2 {
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 600;
  letter-spacing: -.045em;
  line-height: .98;
  margin: 0;
}

h1 { font-size: clamp(2.85rem, 9vw, 5.2rem); }
h1 em { color: var(--rose); }
h1 span { display: block; white-space: nowrap; }
h1 em { display: block; }

.intro {
  font-size: 1rem;
  line-height: 1.65;
  margin: 28px auto 33px;
  max-width: 370px;
}

.party-details {
  border-bottom: 1px solid rgb(216 109 141 / 24%);
  border-top: 1px solid rgb(216 109 141 / 24%);
  margin: 0 auto 33px;
  max-width: 410px;
  padding: 13px 0;
}

.party-details p { font-size: .89rem; margin: 9px 0; }
.party-details span { color: var(--rose); font-size: .7rem; font-weight: 700; letter-spacing: .1em; margin-right: 10px; text-transform: uppercase; }

.sparkle { color: var(--rose); font-size: 1.35rem; opacity: .65; position: absolute; }
.sparkle-one { left: 9%; top: 14%; }
.sparkle-two { right: 11%; top: 21%; }
.sparkle-three { bottom: 13%; right: 8%; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}