:root {
  --ink: #15120f;
  --text: #f1e9dc;
  --gold: #b9a383;
  --gold-deep: #9a805a;
  --gold-light: #cdb98f;
  --font-body: 'Outfit', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: var(--font-body);
  color: var(--text);
  background: var(--ink);
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  padding: 28px;
  overflow-x: hidden;
  position: relative;
  -webkit-font-smoothing: antialiased;
}

/* soft vignette for depth + legibility */
body::after {
  content: ""; position: fixed; inset: 0; z-index: 2; pointer-events: none;
  background: radial-gradient(120% 120% at 50% 45%, transparent 45%, rgba(0, 0, 0, 0.85) 100%);
}

/* slow breathing glow behind the wordmark */
.aura {
  position: fixed; left: 50%; top: 46%; z-index: 1; pointer-events: none;
  width: 62vmax; height: 34vmax;
  transform: translate(-50%, -50%);
  background: radial-gradient(closest-side,
      rgba(205, 185, 143, 0.14), rgba(205, 185, 143, 0.05) 46%, transparent 72%);
  filter: blur(8px);
  animation: breathe 8s ease-in-out infinite alternate;
}
@keyframes breathe {
  from { opacity: 0.5; transform: translate(-50%, -50%) scale(1); }
  to   { opacity: 1;   transform: translate(-50%, -50%) scale(1.09); }
}

/* one-time sunrise light that dawns behind the wordmark */
.sunbeam {
  position: fixed; left: 50%; top: 46%; z-index: 1; pointer-events: none;
  width: 72vmax; height: 42vmax;
  transform: translate(-50%, -50%);
  background: radial-gradient(closest-side,
      rgba(226, 180, 118, 0.30), rgba(214, 165, 104, 0.10) 45%, transparent 72%);
  filter: blur(10px);
  opacity: 0;
  animation: sunbeam 4.5s cubic-bezier(0.22, 1, 0.36, 1) 0.1s both;
}
@keyframes sunbeam {
  0%   { opacity: 0;    transform: translate(-50%, 30%) scale(0.6); }
  40%  { opacity: 0.95; }
  100% { opacity: 0;    transform: translate(-50%, -55%) scale(1.18); }
}

main {
  position: relative;
  z-index: 3;
  margin: auto;
  text-align: center;
  max-width: 1000px;
}


.eyebrow {
  display: inline-flex; align-items: center; justify-content: center; gap: 16px;
  animation: reveal 2s cubic-bezier(0.16, 1, 0.3, 1) 1.3s both;
}
.eyebrow i {
  width: 44px; height: 1px; display: block;
  background: linear-gradient(90deg, transparent, var(--gold));
}
.eyebrow i:last-child { background: linear-gradient(90deg, var(--gold), transparent); }
.eyebrow span {
  font-family: var(--font-body);
  font-size: 12px; font-weight: 300; letter-spacing: 0.5em; text-transform: uppercase;
  padding-left: 0.5em;
  background: linear-gradient(90deg, var(--gold-deep), var(--gold-light) 50%, var(--gold-deep));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

.flourish {
  width: 116px; height: 1px; margin: 26px auto 0;
  background: linear-gradient(90deg, transparent, var(--gold-deep) 24%, var(--gold-deep) 76%, transparent);
  position: relative;
  animation: reveal 2s cubic-bezier(0.16, 1, 0.3, 1) 1.8s both;
}
.flourish::before {
  content: ""; position: absolute; left: 50%; top: 50%;
  width: 5px; height: 5px; background: var(--gold-light);
  transform: translate(-50%, -50%) rotate(45deg);
}

.brand {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(54px, 14vw, 140px);
  line-height: 1.0;
  letter-spacing: 0.08em;
  padding-left: 0.08em;
  text-transform: uppercase;
  margin: 0 0 24px;
  background: linear-gradient(100deg, #d9c9ac 0%, #f1e9dc 32%, #fffaf2 50%, #f1e9dc 68%, #d9c9ac 100%);
  background-size: 220% auto;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: shine 5.5s linear infinite, sunrise 4s cubic-bezier(0.22, 1, 0.36, 1) 0.2s both;
  filter: drop-shadow(0 2px 18px rgba(241, 233, 220, 0.16));
}
@keyframes shine { to { background-position: 200% center; } }
@keyframes reveal { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes sunrise {
  0%   { opacity: 0; transform: translateY(80px) scale(0.985); filter: drop-shadow(0 26px 36px rgba(241, 233, 220, 0.05)); }
  55%  { opacity: 1; }
  100% { opacity: 1; transform: translateY(0) scale(1); filter: drop-shadow(0 2px 18px rgba(241, 233, 220, 0.16)); }
}

@media (prefers-reduced-motion: reduce) {
  .aura, .sunbeam, .brand, .eyebrow, .flourish { animation: none !important; }
}