
:root{
  --ink:#0b100e; --ink-2:#0e1512; --moss:#13211a;
  --bone:#ece5d4; --bone-dim:#b3ab9b; --bone-faint:#8e8778;
  --gold:#d2a35a; --gold-deep:#a9752c; --line:rgba(210,163,90,.28);
  --serif:'Cormorant Garamond',serif; --sans:'Inter',sans-serif; --mono:'JetBrains Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--bone);font-family:var(--sans);font-weight:300;line-height:1.8;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--gold);text-decoration:none}

/* ---------- NAV ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:center;
  padding:1rem 5vw;background:linear-gradient(180deg,rgba(11,16,14,.92),rgba(11,16,14,.72) 70%,transparent);
  backdrop-filter:blur(6px);transition:background .4s}
.nav__brand{display:flex;align-items:center;gap:.8rem}
.nav__brand img{width:40px;height:40px}
.nav__brand span{font-family:var(--serif);font-size:.95rem;letter-spacing:.32em;color:var(--bone);text-transform:uppercase}
.nav__links{display:flex;gap:1.4em;list-style:none;align-items:center;font-size:.7rem;letter-spacing:.26em;text-transform:uppercase}
.nav__links a{color:var(--bone-dim);transition:color .3s}
.nav__links a:hover{color:var(--gold)}
.nav__cta{border:1px solid var(--gold);padding:.55rem 1.4rem;color:var(--bone)!important;transition:background .3s,color .3s;white-space:nowrap}
.nav__cta:hover{background:var(--gold);color:var(--ink)!important}
.nav__toggle{display:none;background:none;border:none;color:var(--bone);font-size:1.4rem;cursor:pointer}
@media(max-width:900px){
  /* backdrop-filter on .nav was creating a containing block, trapping the fixed menu
     inside the header strip: menu text spilled over the page with no backdrop. */
  .nav{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(11,16,14,.96);padding:.9rem 5vw}
  .nav__brand img{width:34px;height:34px}
  .nav__brand span{font-size:.78rem;letter-spacing:.22em}
  .nav__links{position:fixed;top:0;left:0;width:100%;height:100svh;margin:0;padding:6rem 8vw 4rem;
    background:#0B100E;flex-direction:column;justify-content:center;align-items:center;gap:1.9em;
    font-size:.92rem;letter-spacing:.24em;transform:translateX(100%);transition:transform .4s;z-index:105;overflow-y:auto}
  .nav__links.open{transform:none}
  .nav__links li{width:100%;text-align:center}
  .nav__links a{display:block;color:var(--bone);padding:.2em 0}
  .nav__cta{display:inline-block;margin-top:.6rem;padding:.8rem 2.2rem}
  .nav__toggle{display:block;position:relative;z-index:120}
}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
.hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:heroZoom 26s ease-out forwards}
@keyframes heroZoom{from{transform:scale(1.12)}to{transform:scale(1)}}
.hero__veil{position:absolute;inset:0;background:
  radial-gradient(120% 80% at 50% 110%, rgba(11,16,14,.92), rgba(11,16,14,.35) 45%, transparent 70%),
  linear-gradient(180deg, rgba(11,16,14,.55), transparent 30%, transparent 60%, rgba(11,16,14,.94))}
.hero__inner{position:relative;z-index:2;padding:0 6vw 11vh;max-width:1100px}
.rv-pill{display:inline-flex;align-items:center;gap:.7em;border:1px solid var(--line);border-radius:100px;background:rgba(11,16,14,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  padding:.55rem 1.3rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.32em;text-transform:uppercase;color:var(--bone-dim)}
.rv-pill::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold)}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(4.2rem,12vw,9.5rem);letter-spacing:.14em;line-height:1;margin:1.6rem 0 .6rem;color:var(--bone)}
.hero__tag{font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,2.6vw,1.8rem);color:var(--gold);letter-spacing:.05em}
.hero__desc{margin-top:1.6rem;font-family:var(--mono);font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;color:var(--bone-dim);line-height:2.2}
.hero__sline{margin-top:1.2rem;font-family:var(--serif);font-style:italic;font-size:clamp(1.15rem,2.1vw,1.45rem);color:#cfc7b4;max-width:34em}
.hero__row{display:flex;gap:2rem;align-items:center;margin-top:2.4rem;flex-wrap:wrap}
.rv-btn{display:inline-block;border:1px solid var(--gold);padding:1rem 2.8rem;font-family:var(--sans);font-size:.74rem;
  letter-spacing:.32em;text-transform:uppercase;color:var(--bone);transition:background .35s,color .35s}
.rv-btn:hover{background:var(--gold);color:var(--ink)}
.rv-btn--solid{background:var(--gold);color:var(--ink)}
.rv-btn--solid:hover{background:transparent;color:var(--bone)}
.hero__dates{font-family:var(--mono);font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--bone-dim)}

/* ---------- TAG STRIP ---------- */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.2rem 5vw;text-align:center;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--bone-dim);background:var(--ink-2)}
.strip b{color:var(--gold);font-weight:400}

/* ---------- SECTIONS ---------- */
section{padding:7.5rem 6vw}
.rv-wrap{max-width:1050px;margin:0 auto}
.rv-wrap--narrow{max-width:760px;margin:0 auto}
.rv-eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.4em;text-transform:uppercase;color:var(--gold)}
.rv-eyebrow .num{font-family:var(--serif);font-size:1rem;letter-spacing:.3em;margin-right:1em}
h2{font-family:var(--serif);font-weight:500;font-size:clamp(2.1rem,4.6vw,3.2rem);line-height:1.15;margin:1.1rem 0 .4rem;color:var(--bone)}
.rv-sub{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.28rem;color:var(--gold);margin-bottom:2rem}
p.rv-body{color:#c9c1b0;margin-bottom:1.4rem;font-size:1.01rem}
.rv-quoteline{font-family:var(--serif);font-style:italic;font-size:clamp(1.4rem,2.8vw,1.9rem);color:var(--bone);line-height:1.5;margin:2.6rem 0;padding-left:1.6rem;border-left:1px solid var(--gold)}
.rv-grid2{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center}
@media(max-width:820px){.rv-grid2{grid-template-columns:1fr}}
figure.rv-photo img{width:100%;height:100%;object-fit:cover;border-radius:2px}
figure.rv-photo figcaption{font-family:var(--mono);font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--bone-faint);margin-top:.8rem}
.rv-list{display:grid;grid-template-columns:1fr 1fr;gap:.7rem 2.4rem;margin:2rem 0;font-family:var(--mono);
  font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--bone-dim)}
.rv-list div::before{content:"— ";color:var(--gold)}
@media(max-width:640px){.rv-list{grid-template-columns:1fr}}

/* reveal animation */
.rev{opacity:0;transform:translateY(26px);transition:opacity 1s ease,transform 1s ease}
.rev.in{opacity:1;transform:none}

/* moon section */
.moon{background:linear-gradient(180deg,var(--ink) 0%,#0a0f14 50%,var(--ink) 100%);position:relative}
.moon__phase{display:flex;justify-content:center;gap:clamp(.6rem,2.4vw,1.6rem);margin:3rem 0 1rem;align-items:center}
.moon__phase span{display:block;width:clamp(18px,3vw,30px);height:clamp(18px,3vw,30px);border-radius:50%;border:1px solid var(--line);position:relative;overflow:hidden}
.moon__phase span i{position:absolute;inset:0;background:var(--gold);opacity:.85}
.moon__phase .p1 i{clip-path:inset(0 45% 0 0)} .moon__phase .p2 i{clip-path:inset(0 30% 0 0)}
.moon__phase .p3 i{clip-path:inset(0 18% 0 0)} .moon__phase .p4 i{clip-path:inset(0 8% 0 0)}
.moon__phase .full{width:clamp(34px,5vw,54px);height:clamp(34px,5vw,54px);border-color:var(--gold);box-shadow:0 0 34px rgba(210,163,90,.45)}
.moon__phase .full i{clip-path:none}
.moon__caption{text-align:center;font-family:var(--mono);font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;color:var(--bone-dim)}

@media(min-width:901px) and (max-width:1240px){.nav__links{gap:1em;font-size:.62rem;letter-spacing:.18em}.nav__brand span{font-size:.8rem;letter-spacing:.24em}}

/* ---------- MOBILE FOOTER ---------- */
@media(max-width:760px){
  footer{padding:3.5rem 7vw 3rem!important}
  footer .rv-wrap{grid-template-columns:1fr!important;gap:2.4rem!important;text-align:center}
  footer .rv-wrap img{margin:0 auto 1rem!important}
  footer .rv-wrap>div{min-width:0}
  footer a{display:block;word-break:break-word;overflow-wrap:anywhere;line-height:2.2!important}
  footer p{word-break:break-word;overflow-wrap:anywhere}
}
@media(max-width:520px){
  footer .rv-wrap div[style*="letter-spacing"]{font-size:.72rem!important;letter-spacing:.14em!important}
  footer p[style*="letter-spacing"]{letter-spacing:.16em!important;line-height:1.9!important}
}
html,body{overflow-x:hidden}

/* ---------- MOBILE HERO LEGIBILITY (phones only) ---------- */
@media(max-width:900px){
  /* busy imagery (altar, jungle, fire) was competing with the type.
     Deepen the scrim toward the bottom where the copy sits, and let the
     photograph stay bright at the top where nothing is written. */
  .hero__veil{background:
    linear-gradient(180deg, rgba(11,16,14,.62) 0%, rgba(11,16,14,.28) 22%, rgba(11,16,14,.58) 48%, rgba(11,16,14,.88) 70%, rgba(11,16,14,.97) 100%),
    radial-gradient(140% 70% at 50% 100%, rgba(11,16,14,.85), transparent 72%)}
  .hero__inner{padding-bottom:9vh}
  .hero__inner h1{text-shadow:0 2px 28px rgba(0,0,0,.75)}
  .hero__tag,.hero__sline{text-shadow:0 2px 18px rgba(0,0,0,.85)}
  .hero__sline{color:#e6dfd0}
  .rv-pill{background:rgba(11,16,14,.78);font-size:.6rem;letter-spacing:.2em;padding:.55rem 1.1rem}
}
