:root{
  --maroon-deep: #2B0A14;
  --maroon: #4A1428;
  --rose: #7A2438;
  --gold: #D4AF6A;
  --gold-soft: #E9CFA0;
  --ivory: #F6ECDD;
  --ivory-dim: rgba(246,236,221,0.68);
}

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

html,body{ height:100%; }

body{
  background:
    radial-gradient(circle at 50% -10%, var(--rose) 0%, var(--maroon) 42%, var(--maroon-deep) 100%);
  color: var(--ivory);
  font-family: 'Poppins', sans-serif;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow-x:hidden;
  position:relative;
}

/* soft drifting veil / light gauze texture over the background */
.veil{
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    repeating-linear-gradient(115deg, rgba(212,175,106,0.05) 0px, rgba(212,175,106,0.05) 1px, transparent 1px, transparent 64px),
    repeating-linear-gradient(25deg, rgba(212,175,106,0.04) 0px, rgba(212,175,106,0.04) 1px, transparent 1px, transparent 64px);
  animation: veilDrift 26s linear infinite;
  z-index:0;
}
@keyframes veilDrift{
  0%{ transform: translate3d(0,0,0); }
  100%{ transform: translate3d(-64px,-64px,0); }
}

.wrap{
  position:relative;
  z-index:1;
  padding: 8vh 6vw 4vh;
  max-width: 620px;
  display:flex;
  flex-direction:column;
  align-items:center;
  animation: riseIn 1.1s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes riseIn{
  from{ opacity:0; transform: translateY(18px); }
  to{ opacity:1; transform: translateY(0); }
}

.logo{
  width: 108px;
  height: 108px;
  object-fit: contain;
  border-radius: 50%;
  padding: 14px;
  background: radial-gradient(circle, rgba(246,236,221,0.10) 0%, rgba(246,236,221,0.02) 70%);
  border: 1px solid rgba(212,175,106,0.35);
  margin-bottom: 28px;
  filter: drop-shadow(0 0 24px rgba(212,175,106,0.25));
}

.ornament{ width: 220px; margin-bottom: 22px; opacity:0.9; }
.ornament-svg{ width:100%; height:auto; overflow:visible; }
.ornament-path{
  fill:none;
  stroke: var(--gold);
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-dasharray: 420;
  stroke-dashoffset: 420;
  animation: draw 2.6s ease forwards 0.4s;
}
.ornament-dot{
  fill: var(--gold);
  opacity:0;
  animation: dotIn 0.6s ease forwards 2.6s;
}
@keyframes draw{ to{ stroke-dashoffset:0; } }
@keyframes dotIn{ to{ opacity:1; } }

.eyebrow{
  font-family:'Poppins', sans-serif;
  font-size: 12.5px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--gold-soft);
  margin-bottom: 14px;
  font-weight: 500;
}

.headline{
  font-family: 'Cormorant Garamond', serif;
  font-weight: 600;
  font-style: italic;
  font-size: clamp(2.4rem, 6vw, 3.6rem);
  line-height: 1.15;
  color: var(--ivory);
  margin-bottom: 22px;
  text-shadow: 0 2px 30px rgba(0,0,0,0.35);
}

.sub{
  font-size: 15px;
  line-height: 1.75;
  color: var(--ivory-dim);
  max-width: 460px;
  margin-bottom: 34px;
  font-weight: 300;
}

.contact{
  display:flex;
  align-items:center;
  gap: 12px;
  font-size: 13.5px;
  letter-spacing: 0.02em;
}
.contact-link{
  color: var(--gold);
  text-decoration: none;
  font-weight: 500;
  border-bottom: 1px solid transparent;
  transition: border-color 0.25s ease, color 0.25s ease;
}
.contact-link:hover{ border-color: var(--gold); color: var(--gold-soft); }
.dot{ color: rgba(212,175,106,0.5); }

.footer{
  position:relative;
  z-index:1;
  padding: 22px 6vw 28px;
  font-size: 11.5px;
  letter-spacing: 0.03em;
  color: rgba(246,236,221,0.4);
  text-align:center;
}

@media (prefers-reduced-motion: reduce){
  .veil{ animation:none; }
  .wrap{ animation:none; opacity:1; transform:none; }
  .ornament-path, .ornament-dot{ animation:none; stroke-dashoffset:0; opacity:1; }
}

@media (max-width:480px){
  .logo{ width:88px; height:88px; }
  .ornament{ width:180px; }
}
