:root{
  --bg:#0a0a0a; --gold:#C6A15B; --off:#e9e7df; --muted:#bfb9a5; --stroke:rgba(198,161,91,.22);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--off);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;scroll-behavior:smooth}
a{color:var(--off);text-decoration:none}
/* Header */
header{position:sticky;top:0;z-index:60;background:rgba(10,10,10,.65);backdrop-filter:blur(6px);border-bottom:1px solid var(--stroke)}
.nav{max-width:1120px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:.9rem 1rem}
.logo{font-family:"Playfair Display",serif;font-weight:700;letter-spacing:.6px}
.logo b{color:var(--gold)}
.btn{display:inline-block;border:1px solid var(--gold);background:var(--gold);color:#0b0b0b;padding:.9rem 1.25rem;border-radius:12px;font-weight:600;letter-spacing:.2px;transition:.18s;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(0,0,0,.45)}
/* Containers */
.container{max-width:1120px;margin:0 auto;padding:0 1rem}
section{padding:8.2rem 0 9.2rem 0;} /* v5 spacing */
.section-title{font-family:"Playfair Display",serif;color:var(--gold);text-align:center;font-size:clamp(1.6rem,2.3vw,2.2rem);margin:0 0 1.2rem}
.kicker{color:var(--muted);font-size:.95rem;margin:0 auto 2.2rem;text-align:center;max-width:60ch;line-height:1.68}
/* Hero */
.hero{position:relative;overflow:hidden;text-align:center;padding:7.5rem 0 3.5rem 0}
.hero .lead{color:#dad7cf;opacity:.96;font-size:1.05rem;line-height:1.7;max-width:70ch;margin:0 auto 1.4rem}
h1{font-family:"Playfair Display",serif;font-weight:700;line-height:1.1;margin:.4rem 0 1rem;font-size:clamp(2.2rem,4vw,3.6rem)}
#matrixCanvas{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.28} /* slightly dimmer than v5 */
.vsl{max-width:920px;margin:1.6rem auto;border-radius:14px;overflow:hidden;border:1px solid var(--stroke);box-shadow:0 12px 30px rgba(0,0,0,.45)}
iframe{display:block;width:100%;height:420px}
/* Grids */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;justify-items:center;align-items:stretch}
@media(max-width:980px){.grid-3{grid-template-columns:1fr}}
.card{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0));border:1px solid var(--stroke);border-radius:14px;padding:1rem 1.2rem;text-align:center}
.card strong{font-size:1rem;color:var(--gold)}
.card p{font-size:.88rem;color:var(--off);opacity:.9;line-height:1.55;margin:.5rem 0 0}
.quote{font-family:"Playfair Display",serif;font-size:1.08rem;color:#efece2;text-align:center;margin-top:3.6rem;margin-bottom:4.6rem}
/* Footer */
footer{padding:4rem 1rem 4.8rem;border-top:1px solid var(--stroke);text-align:center;color:var(--muted)}
footer .tagline{color:var(--gold);margin-bottom:.45rem}
/* Floating mobile CTA */
.floating-cta{position:fixed;left:50%;transform:translateX(-50%);bottom:1rem;z-index:80;background:var(--gold);color:#0b0b0b;border:1px solid var(--gold);border-radius:999px;padding:.95rem 1.35rem;font-weight:650;display:none;box-shadow:0 10px 30px rgba(0,0,0,.45)}
@media(max-width:980px){.floating-cta{display:inline-block}}
/* Mobile */
@media(max-width:768px){
  section{padding:5.2rem 0 6.1rem 0}
  .quote{margin:3rem auto}
  footer{padding:3.2rem 1rem 3.8rem}
  .btn{padding:.9rem 1.25rem;font-size:.95rem}
}


/* ===== Premium Cinematic Polish (non-destructive) ===== */
.section-title { text-shadow: 0 0 12px rgba(198,161,91,0.25); }
.hero h1 { text-shadow: 0 0 18px rgba(198,161,91,0.30); }

.vignette {
  position: fixed;
  pointer-events: none;
  inset: 0;
  z-index: 50;
  background: radial-gradient(120% 120% at 50% 50%, rgba(0,0,0,0) 55%, rgba(0,0,0,0.08) 100%);
}

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .6s cubic-bezier(.25,.1,.25,1), transform .6s cubic-bezier(.25,.1,.25,1); }
.reveal.reveal-in { opacity: 1; transform: translateY(0); }

@keyframes breathe { 0%,100%{ filter: brightness(1);} 50%{ filter: brightness(1.05);} }
.btn { animation: breathe 2.8s ease-in-out infinite; }

#cursor-ring {
  position: fixed;
  width: 24px; height: 24px;
  border: 1px solid rgba(198,161,91,0.65);
  border-radius: 50%;
  box-shadow: 0 0 14px rgba(198,161,91,0.25);
  pointer-events: none;
  z-index: 100;
  transform: translate(-50%, -50%);
  backdrop-filter: blur(0.5px);
  display: none;
}
@media (hover:hover) and (pointer:fine){
  #cursor-ring { display: block; }
}

.hero .container { will-change: transform; }
#matrixCanvas { will-change: transform; }