#hero {
  min-height: 100vh;
  display: flex; flex-direction: column;
  justify-content: center; align-items: center; text-align: center;
  padding: 0 2rem;
}
.hero-eyebrow {
  font-weight: 300; letter-spacing: 8px; text-transform: uppercase;
  font-size: .72rem; color: var(--gold); margin-bottom: 1.5rem;
  opacity: 0; animation: fadeUp .9s .5s forwards;
}
.hero-title {
  font-family: 'Rye', serif;
  font-size: clamp(4.5rem, 13vw, 11rem); line-height: 1;
  color: var(--parchment);
  text-shadow: 0 0 80px rgba(200,144,42,.35), 2px 4px 0 rgba(0,0,0,.6);
  letter-spacing: 6px;
  opacity: 0; animation: fadeUp .9s .8s forwards;
}
.hero-divider {
  width: 130px; height: 1px;
  background: linear-gradient(to right, transparent, var(--gold), transparent);
  margin: 1.4rem auto;
  opacity: 0; animation: fadeUp .9s 1.05s forwards;
}
.hero-subtitle {
  font-family: 'Rye', serif;
  font-size: clamp(1rem, 2.8vw, 1.7rem); color: var(--gold); letter-spacing: 6px;
  opacity: 0; animation: fadeUp .9s 1.2s forwards; margin-bottom: 2rem;
}
.hero-desc {
  font-family: 'Playfair Display', serif; font-style: italic;
  font-size: clamp(.9rem, 2vw, 1.1rem); color: rgba(232,213,176,.8);
  max-width: 480px; line-height: 1.9;
  opacity: 0; animation: fadeUp .9s 1.45s forwards; margin-bottom: 3rem;
}
.hero-cta {
  display: flex; gap: 1.5rem; flex-wrap: wrap; justify-content: center;
  opacity: 0; animation: fadeUp .9s 1.65s forwards;
}

.btn {
  display: inline-block; padding: .9rem 2.5rem;
  font-weight: 300; letter-spacing: 4px; text-transform: uppercase;
  font-size: .68rem; text-decoration: none; transition: all .3s; cursor: pointer; border: none;
}
.btn-primary { background: var(--gold); color: var(--black); }
.btn-primary:hover { background: var(--parchment); box-shadow: 0 0 30px rgba(200,144,42,.5); }
.btn-outline { border: 1px solid rgba(200,144,42,.7); color: var(--parchment); background: transparent; }
.btn-outline:hover { background: rgba(200,144,42,.08); border-color: var(--parchment); }

.scroll-hint {
  position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: .5rem;
  opacity: 0; animation: fadeUp .9s 2s forwards;
}
.scroll-hint span { letter-spacing: 4px; text-transform: uppercase; font-size: .58rem; color: rgba(200,144,42,.55); font-weight: 300; }
.scroll-line { width: 1px; height: 40px; background: linear-gradient(to bottom, var(--gold), transparent); animation: scrollPulse 2.2s ease-in-out infinite; }