:root{
  --bg:#0e1210; --bg2:#141a17; --paper:#fbf8f1; --ink:#221a10; --ink-soft:#5c5142;
  --gold:#d9a94a; --gold-bright:#f0c876; --gold-dim:#8a6a28;
  --sand:#c9ab7a; --teal:#5a9184; --maroon:#a8503a;
  --line:rgba(217,169,74,0.18);
  --site-bg:#fffdf8; --site-ink:#22190f; --site-soft:#6b5d47; --site-line:#e6dcc4;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--bg); color:var(--paper); font-family:'Work Sans',sans-serif; overflow-x:hidden;}
h1,h2,h3{font-family:'Fraunces',Georgia,serif; text-wrap:balance; font-weight:600; margin:0;}
.mono{font-family:'JetBrains Mono',monospace;}
a{color:inherit; text-decoration:none;}
img,svg{display:block; max-width:100%;}
::selection{background:var(--gold); color:#1a1409;}

/* reveal-on-scroll */
.reveal{opacity:0; transform:translateY(28px); transition:opacity .9s cubic-bezier(.16,1,.3,1), transform .9s cubic-bezier(.16,1,.3,1);}
.reveal.in{opacity:1; transform:none;}
.reveal-stagger > *{opacity:0; transform:translateY(20px); transition:opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1);}
.reveal-stagger.in > *{opacity:1; transform:none;}
.reveal-stagger.in > *:nth-child(1){transition-delay:.05s;}
.reveal-stagger.in > *:nth-child(2){transition-delay:.15s;}
.reveal-stagger.in > *:nth-child(3){transition-delay:.25s;}
.reveal-stagger.in > *:nth-child(4){transition-delay:.35s;}
@media (prefers-reduced-motion: reduce){
  .reveal, .reveal-stagger > *{opacity:1; transform:none; transition:none;}
  html{scroll-behavior:auto;}
}

/* ---------- NAV ---------- */
nav.top{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:20px clamp(20px,5vw,64px);
  backdrop-filter:blur(10px);
  background:linear-gradient(180deg, rgba(14,18,16,0.75), rgba(14,18,16,0));
  transition:background .3s, padding .3s, box-shadow .3s;
}
nav.top.scrolled{background:rgba(14,18,16,0.92); box-shadow:0 1px 0 var(--line); padding:14px clamp(20px,5vw,64px);}
.brand{display:flex; align-items:center; gap:10px; font-family:'Fraunces',serif; font-weight:600; font-size:1.05rem; letter-spacing:.01em;}
.brand .lotus{width:26px; height:26px;}
.navlinks{display:flex; gap:32px; font-size:0.86rem; color:#e8dcc2;}
.navlinks a{position:relative; padding:4px 0;}
.navlinks a::after{content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--gold); transition:width .3s;}
.navlinks a:hover::after{width:100%;}
.navcta{border:1px solid var(--gold); color:var(--gold-bright); padding:8px 20px; border-radius:26px; font-size:0.82rem; font-weight:600; transition:background .25s, color .25s;}
.navcta:hover{background:var(--gold); color:#1a1409;}
@media (max-width:820px){.navlinks{display:none;}}

/* ---------- HERO ---------- */
.hero{
  position:relative; min-height:100vh; display:flex; align-items:center; justify-content:center;
  text-align:center; overflow:hidden; padding:120px 24px 80px;
}
.hero-bg{position:absolute; inset:0; z-index:0;}
.hero-bg canvas{width:100%; height:100%; display:block;}
.hero-vignette{position:absolute; inset:0; z-index:1; background:radial-gradient(ellipse 70% 55% at 50% 38%, rgba(14,18,16,0) 0%, rgba(14,18,16,0.55) 72%, rgba(14,18,16,0.92) 100%);}
.hero-content{position:relative; z-index:2; max-width:780px;}
.hero-glyph{width:120px; margin:0 auto 22px; filter:drop-shadow(0 0 26px rgba(217,169,74,0.45));}
.hero .kicker{font-family:'JetBrains Mono',monospace; font-size:0.74rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--gold-bright); opacity:0; animation:fadeUp .9s .2s ease forwards;}
.hero h1{font-size:clamp(2.6rem,6.2vw,5rem); line-height:1.02; margin:18px 0 20px; opacity:0; animation:fadeUp 1s .4s ease forwards;}
.hero h1 em{font-style:normal; color:var(--gold-bright); background:linear-gradient(90deg,var(--gold-dim),var(--gold-bright)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero p{font-size:1.08rem; color:#d8cdb4; max-width:52ch; margin:0 auto 34px; opacity:0; animation:fadeUp 1s .6s ease forwards;}
.hero-buttons{display:flex; gap:16px; justify-content:center; flex-wrap:wrap; opacity:0; animation:fadeUp 1s .8s ease forwards;}
@keyframes fadeUp{from{opacity:0; transform:translateY(18px);} to{opacity:1; transform:none;}}

.btn{display:inline-flex; align-items:center; gap:8px; padding:14px 30px; border-radius:30px; font-size:0.92rem; font-weight:600; transition:transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s;}
.btn-gold{background:linear-gradient(135deg,var(--gold-bright),var(--gold)); color:#1a1409; box-shadow:0 8px 24px -8px rgba(217,169,74,0.55);}
.btn-gold:hover{transform:translateY(-3px) scale(1.02); box-shadow:0 14px 30px -8px rgba(217,169,74,0.7);}
.btn-outline{border:1px solid rgba(251,248,241,0.35); color:var(--paper);}
.btn-outline:hover{background:rgba(251,248,241,0.08); transform:translateY(-3px);}

.scroll-cue{position:absolute; bottom:28px; left:50%; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column; align-items:center; gap:8px; color:#c9bd9e; font-size:0.68rem; font-family:'JetBrains Mono',monospace; letter-spacing:.1em;}
.scroll-cue .line{width:1px; height:34px; background:linear-gradient(180deg,var(--gold-bright),transparent); animation:pulse 2s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:.3;} 50%{opacity:1;}}

/* ---------- STATS ---------- */
.stats{
  background:var(--bg2); padding:56px clamp(20px,5vw,64px);
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.stat{text-align:center;}
.stat .num{font-family:'Fraunces',serif; font-size:clamp(1.8rem,3.6vw,2.6rem); font-weight:700; color:var(--gold-bright); font-variant-numeric:tabular-nums;}
.stat .lbl{font-size:0.8rem; color:#b8ac91; margin-top:4px;}
@media (max-width:760px){.stats{grid-template-columns:repeat(2,1fr);}}

/* ---------- LIGHT SECTIONS (site body proper) ---------- */
.light-zone{background:var(--site-bg); color:var(--site-ink);}
.section{padding:100px clamp(20px,6vw,64px); max-width:1280px; margin:0 auto;}
.section-intro{max-width:640px; margin:0 auto 56px; text-align:center;}
.kicker-light{font-family:'JetBrains Mono',monospace; font-size:0.72rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--gold-dim);}
.section h2{font-size:clamp(1.9rem,3.6vw,2.7rem); margin:12px 0 16px; color:var(--site-ink);}
.section-intro p{color:var(--site-soft); font-size:1.02rem; margin:0;}

/* programs grid with SVG art + hover */
.programs{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
.program-card{
  position:relative; border-radius:18px; overflow:hidden; background:#fff;
  border:1px solid var(--site-line); box-shadow:0 1px 2px rgba(34,25,16,0.04);
  transition:transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s;
}
.program-card:hover{transform:translateY(-8px); box-shadow:0 24px 48px -20px rgba(34,25,16,0.25);}
.program-art{height:190px; position:relative; overflow:hidden;}
.program-art svg{width:100%; height:100%; transition:transform .6s cubic-bezier(.16,1,.3,1);}
.program-card:hover .program-art svg{transform:scale(1.08);}
.program-body{padding:22px 24px 26px;}
.program-body h3{font-size:1.15rem; margin-bottom:8px;}
.program-body p{font-size:0.9rem; color:var(--site-soft); margin:0 0 14px;}
.program-link{font-size:0.82rem; font-weight:600; color:var(--maroon); display:inline-flex; align-items:center; gap:6px;}
.program-link svg{width:14px; height:14px; transition:transform .3s;}
.program-card:hover .program-link svg{transform:translateX(4px);}

/* quote / parallax band */
.quote-band{
  position:relative; padding:140px 24px; text-align:center; color:#fbf3df; overflow:hidden;
  background:linear-gradient(180deg,#1a2320,#0e1210);
}
.quote-band .silhouette{position:absolute; bottom:-10%; left:50%; transform:translateX(-50%); width:min(900px,140%); opacity:.5; z-index:0;}
.quote-band blockquote{position:relative; z-index:1; font-family:'Fraunces',serif; font-size:clamp(1.5rem,3.4vw,2.3rem); font-weight:500; max-width:20ch; margin:0 auto 18px; line-height:1.3;}
.quote-band span{position:relative; z-index:1; font-size:0.85rem; color:var(--gold-bright); font-family:'JetBrains Mono',monospace; letter-spacing:.08em;}

/* membership */
.tiers{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.tier{
  border:1px solid var(--site-line); border-radius:20px; padding:32px 28px; background:#fff;
  transition:transform .35s cubic-bezier(.16,1,.3,1), box-shadow .35s, border-color .35s; position:relative;
}
.tier:hover{transform:translateY(-6px); box-shadow:0 20px 44px -22px rgba(34,25,16,0.28);}
.tier.highlight{background:linear-gradient(160deg,#fff8e8,#fff); border-color:var(--gold);}
.tier.highlight::before{content:"MOST JOINED"; position:absolute; top:-12px; right:26px; background:var(--maroon); color:#fdf1e6; font-size:0.65rem; font-family:'JetBrains Mono',monospace; letter-spacing:.06em; padding:5px 12px; border-radius:14px;}
.tier .name{font-weight:600; font-size:0.82rem; letter-spacing:.06em; color:var(--gold-dim); text-transform:uppercase;}
.tier .price{font-family:'Fraunces',serif; font-size:2.1rem; font-weight:700; margin:10px 0 18px;}
.tier .price span{font-size:0.85rem; font-weight:400; color:var(--site-soft);}
.tier ul{list-style:none; margin:0 0 24px; padding:0; display:flex; flex-direction:column; gap:12px;}
.tier li{display:flex; gap:10px; font-size:0.9rem; color:var(--site-soft); align-items:flex-start;}
.tier li svg{width:16px; height:16px; flex:none; margin-top:2px; color:var(--teal);}
.tier button{width:100%; padding:13px; border-radius:26px; font-size:0.88rem; font-weight:600; cursor:pointer; border:1px solid var(--maroon); background:transparent; color:var(--maroon); transition:background .25s,color .25s;}
.tier.highlight button{background:var(--maroon); color:#fdf1e6; border:none;}
.tier button:hover{background:var(--maroon); color:#fdf1e6;}

/* sponsorship */
.spon{background:var(--bg2); color:var(--paper);}
.spon .kicker-light{color:var(--gold-bright);}
.spon .section h2{color:var(--paper);}
.spon .section-intro p{color:#c9bd9e;}
.progress-shell{max-width:560px; margin:0 auto 48px;}
.progress-track{height:12px; border-radius:8px; background:rgba(251,248,241,0.1); overflow:hidden;}
.progress-fill{height:100%; width:0; border-radius:8px; background:linear-gradient(90deg,var(--gold-dim),var(--gold-bright)); transition:width 1.6s cubic-bezier(.16,1,.3,1);}
.progress-track.in .progress-fill{width:63%;}
.progress-label{display:flex; justify-content:space-between; font-size:0.78rem; color:#c9bd9e; margin-top:10px; font-family:'JetBrains Mono',monospace;}
.spon-tiers{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.spon-tier{border:1px solid var(--line); border-radius:16px; padding:24px; text-align:center; background:rgba(251,248,241,0.03); transition:transform .3s, border-color .3s;}
.spon-tier:hover{transform:translateY(-6px); border-color:var(--gold);}
.spon-tier .amt{font-family:'Fraunces',serif; font-size:1.6rem; font-weight:700; color:var(--gold-bright); margin:8px 0;}
.spon-tier p{font-size:0.84rem; color:#c9bd9e; margin:0 0 16px;}
.spon-tier button{width:100%; padding:11px; border-radius:22px; border:none; background:var(--gold-bright); color:#1a1409; font-weight:600; font-size:0.84rem; cursor:pointer; transition:filter .2s;}
.spon-tier button:hover{filter:brightness(1.08);}

/* CTA footer band */
.cta-band{
  position:relative; padding:120px 24px; text-align:center; overflow:hidden;
  background:radial-gradient(1000px 400px at 50% -10%, rgba(217,169,74,0.18), transparent 70%), var(--site-bg);
}
.cta-band h2{font-size:clamp(1.9rem,3.8vw,3rem); color:var(--site-ink); max-width:14ch; margin:0 auto 18px;}
.cta-band p{color:var(--site-soft); max-width:44ch; margin:0 auto 32px;}

footer{background:#0e1210; color:#8a7f66; padding:48px clamp(20px,5vw,64px) 32px; font-size:0.82rem;}
.foot-top{display:flex; justify-content:space-between; flex-wrap:wrap; gap:24px; padding-bottom:28px; border-bottom:1px solid var(--line); margin-bottom:20px;}
.foot-links{display:flex; gap:26px; flex-wrap:wrap;}
.foot-links a:hover{color:var(--gold-bright);}

@media (max-width:820px){
  .programs, .tiers, .spon-tiers{grid-template-columns:1fr;}
}
