:root{
  --bg: #0b0b0c;
  --ink: #e9e6e1;
  --muted: #b8b2a6;
  --gold: #c5a572;
  --line: #232326;
  --ink-soft:#d8d4cd;
  --shadow: rgba(0,0,0,.35);
  --card-black: #0a0a0b;
  --card-raised: rgba(255,255,255,.07);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:
    radial-gradient(1200px 800px at 80% -10%, #1b1b1e 0%, var(--bg) 55%) fixed,
    linear-gradient(180deg, #0b0b0c, #0b0b0c);
  color:var(--ink);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  line-height:1.6;
}
.page{display:flex;min-height:100%;flex-direction:column}
.site-header{
  position:sticky;top:0;z-index:10;
  backdrop-filter: blur(8px);
  background: linear-gradient(to bottom, rgba(11,11,12,0.9), rgba(11,11,12,0));
  border-bottom: 1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 28px;
}
.brand{font-family:"Playfair Display", serif; letter-spacing:0.25rem; font-weight:600; font-size:20px; display:flex; align-items:center; gap:10px}
.brand .dot{color:var(--gold)}
.brand .dot{animation:gold-glow 4s ease-in-out infinite}
.nav a{color:var(--muted);text-decoration:none;margin-left:18px;transition:color .2s}
.nav a:hover{color:var(--ink)}
.nav a.pill{border:1px solid var(--line);padding:8px 14px;border-radius:999px;color:var(--ink)}
.nav a.pill:hover{border-color:var(--gold);background:rgba(197,165,114,.07)}

.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center;padding:72px 28px 48px;max-width:1200px;margin:0 auto}
.hero-copy h1{font-family:"Playfair Display",serif;font-size:56px;line-height:1.1;margin:0 0 12px}
.hero-copy p{color:var(--muted);max-width:52ch;margin:0 0 24px}
.reveal-btn{
  appearance:none;border:1px solid var(--line);color:var(--ink);background:transparent;
  padding:14px 22px;border-radius:999px;cursor:pointer;letter-spacing:0.06em;
  transition:transform .15s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease;
  box-shadow: inset 0 0 0 1px rgba(197,165,114,.25), 0 10px 30px rgba(0,0,0,.2);
}
.reveal-btn:hover{border-color:var(--gold);background:rgba(197,165,114,.07)}
.reveal-btn:active{transform:translateY(1px)}

.reveal.hidden{display:none}
.reveal{display:grid;gap:14px}
.reveal{opacity:0;transform:translateY(8px) scale(.98);filter:blur(2px);transition:opacity .6s ease, transform .6s ease, filter .6s ease}
.reveal.revealed{opacity:1;transform:none;filter:none}
.frame{
  position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--line);
  background:linear-gradient(180deg, #131316, #0b0b0c);
}
.frame:after{content:"";position:absolute;inset:-20%;background:conic-gradient(from 0deg, rgba(197,165,114,.12), rgba(255,255,255,0) 40%, rgba(197,165,114,.12));filter:blur(24px);opacity:.08;animation:orbital 16s linear infinite}
.frame:before{
  content:"";position:absolute;inset:0;border-radius:18px;pointer-events:none;
  background:radial-gradient(600px 200px at 20% -50%, rgba(197,165,114,.25), transparent 50%),
             radial-gradient(400px 160px at 80% 120%, rgba(255,255,255,.08), transparent 60%);
}
.frame img{display:block;width:100%;height:520px;object-fit:cover;object-position:center}
.shimmer{animation:shimmer 2.2s ease-in-out infinite}
@keyframes shimmer{0%{box-shadow:inset 0 0 0 0 rgba(197,165,114,.0)}50%{box-shadow:inset 0 0 0 2px rgba(197,165,114,.18)}100%{box-shadow:inset 0 0 0 0 rgba(197,165,114,.0)}}
.reveal-btn{position:relative}
.reveal-btn:before{content:"";position:absolute;inset:-4px;border-radius:999px;background:radial-gradient(120px 40px at 20% 50%, rgba(197,165,114,.18), transparent 60%);filter:blur(8px);opacity:.0;transition:opacity .25s ease}
.reveal-btn:hover:before{opacity:.6}
.reveal-btn.gold-pulse{box-shadow:inset 0 0 0 1px rgba(197,165,114,.35), 0 10px 30px rgba(197,165,114,.18)}
.caption{color:var(--muted);font-size:14px}

/* Countdown overlay */
.countdown-overlay{position:fixed;inset:0;display:grid;place-items:center;background:radial-gradient(1000px 600px at 60% -10%, rgba(197,165,114,.08), rgba(0,0,0,.85));backdrop-filter: blur(6px);z-index:40}
.countdown-overlay.fade-out{opacity:0;transition:opacity .5s ease;pointer-events:none}
.countdown-wrap{position:relative;display:grid;place-items:center}
.count-ring{position:absolute;width:220px;height:220px;border-radius:50%;background:
  conic-gradient(from 0deg, var(--gold), rgba(197,165,114,.2) 35%, rgba(197,165,114,.0) 60%);
  filter:blur(2px);opacity:.55;animation:spin 1.2s linear infinite}
.count-digit{font-family:"Playfair Display",serif;font-size:92px;letter-spacing:.08em;color:var(--ink);text-shadow:0 10px 40px var(--shadow)}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes orbital{to{transform:rotate(360deg)}}
@keyframes gold-glow{0%{text-shadow:0 0 0 rgba(197,165,114,.0)}50%{text-shadow:0 0 10px rgba(197,165,114,.35)}100%{text-shadow:0 0 0 rgba(197,165,114,.0)}}

.section{border-top:1px solid var(--line);padding:56px 28px}
.container{max-width:1000px;margin:0 auto}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.eyebrow{letter-spacing:.2em;color:var(--ink-soft);text-transform:uppercase;font-size:12px;margin:0 0 6px}
.about h2{font-family:"Playfair Display",serif;font-weight:600;letter-spacing:.08em;margin:0 0 8px}
.about p{color:var(--muted);margin:0}

.site-footer{border-top:1px solid var(--line);padding:36px 28px}
.site-footer .small{opacity:.8}
.site-footer a{
  color:var(--ink-soft);
  text-decoration:none;
  border-bottom:1px solid rgba(197,165,114,.35);
  padding-bottom:2px;
  transition:color .2s ease, border-color .2s ease, text-shadow .2s ease;
}
.site-footer a:hover{
  color:var(--ink);
  border-bottom-color: var(--gold);
  text-shadow: 0 0 8px rgba(197,165,114,.15);
}

@media (max-width: 900px){
  .hero{grid-template-columns:1fr;gap:28px}
  .hero-copy h1{font-size:42px}
  .frame img{height:420px}
  .grid-3{grid-template-columns:1fr}
}

@media (max-width: 600px){
  .site-header{padding:14px 18px}
  .nav a{margin-left:12px}
  .hero{padding:42px 18px 28px}
  .hero-copy h1{font-size:34px}
  .frame img{height:320px}
}

/* Membership */
.membership-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:42px;align-items:center;max-width:1200px;margin:0 auto;padding:64px 28px}
.luxe-card{
  position:relative;border-radius:18px;padding:28px;aspect-ratio:16/10;display:flex;flex-direction:column;justify-content:space-between;
  background:radial-gradient(140% 140% at 80% -10%, #131315 0%, var(--card-black) 55%);
  border:1px solid rgba(197,165,114,.35);
  box-shadow: 0 30px 60px var(--shadow), inset 0 0 0 1px rgba(255,255,255,.03);
  color:var(--ink);
  overflow:hidden;
  transform-style:preserve-3d;
}
.luxe-card .shine{position:absolute;inset:-60%;background:conic-gradient(from 180deg at 50% 50%, rgba(197,165,114,.0), rgba(197,165,114,.18), rgba(197,165,114,.0));filter:blur(18px);opacity:.35;animation:rotate 9s linear infinite}
@keyframes rotate{to{transform:rotate(360deg)}}
.luxe-card .title{font-family:"Playfair Display",serif;letter-spacing:.18em}
.luxe-card .sub{color:var(--muted)}
.luxe-chip{position:absolute;right:22px;top:22px;width:46px;height:34px;border-radius:6px;background:linear-gradient(135deg, #8b6b2e, #c5a572 60%, #f0e0b8);box-shadow:inset 0 0 0 1px rgba(0,0,0,.3)}
.price{font-family:"Playfair Display",serif;font-size:32px;margin:0;color:var(--ink)}
.cta{display:flex;flex-direction:column;gap:12px}
.paypal-btn{appearance:none;background:linear-gradient(180deg, #1a1a1e, #0d0d10);color:var(--ink);border:1px solid var(--gold);padding:14px 18px;border-radius:12px;cursor:pointer;letter-spacing:.04em;box-shadow:0 15px 35px var(--shadow), inset 0 0 0 1px rgba(197,165,114,.25);transition:transform .15s ease, box-shadow .25s ease, border-color .25s ease}
.paypal-btn:hover{transform:translateY(-1px);box-shadow:0 22px 50px var(--shadow), inset 0 0 0 1px rgba(197,165,114,.35)}
.benefits{margin-top:18px;display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:12px 22px;color:var(--ink-soft)}
.benefits li{list-style:none;position:relative;padding-left:18px}
.benefits li:before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 30% 30%, #f9e7bd, #c5a572 60%, #775e2c)}

@media (max-width: 900px){
  .membership-hero{grid-template-columns:1fr}
}
@media (max-width: 600px){
  .paypal-btn{width:100%}
  .benefits{grid-template-columns:1fr}
}