@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500&family=Inter:wght@300;400;500&display=swap');

:root{
  --black:#05070B;
  --ivory:#F5F1E8;
  --gold:#C8A56B;
  --soft:rgba(245,241,232,.76);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--black);color:var(--ivory);font-family:Inter,Arial,sans-serif}
.intro{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:#020305;transition:opacity 1.45s ease,visibility 1.45s ease}
.intro.hidden{opacity:0;visibility:hidden}
.intro-line{font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(32px,5vw,78px);line-height:1.05;text-align:center;padding:28px;color:var(--ivory);opacity:0;animation:introFade 1.7s ease forwards}
@keyframes introFade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.hero{min-height:100vh;position:relative;overflow:hidden;background:#05070B;display:flex;flex-direction:column;justify-content:space-between;padding:48px 60px 38px}
.hero::before{content:"";position:absolute;inset:-18px;background:url("hero.jpg") center/cover no-repeat;transform:scale(1.02);animation:slowImage 18s ease-in-out infinite alternate;z-index:0}
@keyframes slowImage{from{transform:scale(1.02) translateX(0)}to{transform:scale(1.055) translateX(-10px)}}
.shade{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(5,7,11,.68) 0%,rgba(5,7,11,.34) 40%,rgba(5,7,11,.07) 72%),linear-gradient(180deg,rgba(5,7,11,.16) 0%,rgba(5,7,11,.08) 56%,rgba(5,7,11,.60) 100%)}
.topbar,.hero-copy,.signature{position:relative;z-index:2}
.brand{font-family:"Cormorant Garamond",Georgia,serif;letter-spacing:.34em;font-size:clamp(20px,2.2vw,34px);color:var(--ivory)}
.brand-sub{margin-top:10px;font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(16px,1.4vw,22px);font-style:italic;color:var(--gold)}
.hero-copy{width:min(520px,92vw);margin-top:auto;margin-bottom:7vh}
.private{margin:0 0 26px;color:var(--gold);text-transform:uppercase;letter-spacing:.34em;font-size:11px}
h1{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-weight:400;font-size:clamp(48px,7vw,108px);line-height:.94;letter-spacing:.01em;text-shadow:0 18px 54px rgba(0,0,0,.38)}
.cta{display:inline-block;margin-top:42px;border:1px solid rgba(200,165,107,.92);padding:15px 25px;color:var(--ivory);text-decoration:none;text-transform:uppercase;letter-spacing:.20em;font-size:11px;background:rgba(5,7,11,.18);backdrop-filter:blur(4px);transition:transform .28s ease,background .28s ease,border-color .28s ease}
.cta:hover{transform:translateY(-2px);background:rgba(200,165,107,.14);border-color:var(--gold)}
.signature{display:flex;gap:32px;flex-wrap:wrap;color:var(--soft);text-transform:uppercase;letter-spacing:.28em;font-size:11px}
.signature span:not(:last-child)::after{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--gold);margin-left:32px;vertical-align:middle}
.closing{padding:92px 24px;background:#05070B;text-align:center;border-top:1px solid rgba(200,165,107,.18)}
.closing p{max-width:760px;margin:0 auto 30px;font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(28px,4vw,52px);line-height:1.08}
.closing a{color:var(--gold);text-decoration:none;letter-spacing:.08em}
@media(max-width:760px){
  .hero{min-height:100svh;padding:30px 24px 28px}
  .hero::before{background-position:63% center}
  .shade{background:linear-gradient(180deg,rgba(5,7,11,.28),rgba(5,7,11,.42) 46%,rgba(5,7,11,.82) 100%),linear-gradient(90deg,rgba(5,7,11,.58),rgba(5,7,11,.12))}
  .brand{letter-spacing:.22em}
  .private{letter-spacing:.22em}
  .hero-copy{margin-bottom:5vh}
  .signature{gap:14px;letter-spacing:.16em}
  .signature span:not(:last-child)::after{margin-left:14px}
}
