:root{ --black:#0A0A0A; --white:#FFFFFF; --gold:#BFA468; }
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'Satoshi', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color:var(--white); background:var(--black); line-height:1.5;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.nav{ position:sticky; top:0; z-index:10; backdrop-filter:saturate(120%) blur(6px);
  background:rgba(10,10,10,0.6); border-bottom:1px solid rgba(255,255,255,.06); }
.nav__brand{ display:flex; align-items:center; gap:.75rem; padding:.9rem 1.2rem; }
.wordmark{ letter-spacing:.18em; font-weight:600; font-size:.9rem; color:var(--white); }

.hero{
  min-height:78vh; display:grid; place-items:center; text-align:center;
  padding:7rem 1.25rem 5rem;
  background:
    radial-gradient(1200px 600px at 50% -10%, rgba(191,164,104,.18), transparent 60%),
    radial-gradient(800px 400px at 90% 20%, rgba(191,164,104,.08), transparent 60%),
    radial-gradient(800px 400px at 10% 30%, rgba(191,164,104,.06), transparent 60%);
}
.hero h1{ font-size: clamp(2rem, 3.5vw, 3.2rem); font-weight:700; letter-spacing:.01em; margin:0 0 1rem; }
.sub{ max-width:780px; margin:0 auto 2rem; color:#DADADA }

.section{ padding:5rem 1.25rem; max-width:980px; margin:0 auto; }
.section--panel{ background:#0D0D0D; border:1px solid rgba(255,255,255,.06); border-radius:20px; }
.section__title{ font-size: clamp(1.4rem, 2.6vw, 2.2rem); font-weight:700; margin:0 0 .75rem; }
.section__text{ color:#EAEAEA; margin:0 auto; max-width:780px; }

.form{ display:flex; gap:.6rem; align-items:center; flex-wrap:wrap; margin-top:1rem; }
.form input{
  flex:1 1 260px; background:#0A0A0A; color:var(--white);
  border:1.5px solid var(--gold); border-radius:14px; padding:.9rem 1rem; outline:none;
  transition:border-color .2s, box-shadow .2s;
}
.form input:focus{ box-shadow:0 0 0 4px rgba(191,164,104,.18); }

.btn{ position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  white-space:nowrap; padding:.9rem 1.1rem; border-radius:14px; border:1px solid transparent; cursor:pointer;
  font-weight:600; letter-spacing:.02em; transition:transform .18s ease, box-shadow .18s ease, background .18s ease; }
.btn--gold{ color:var(--black); background:var(--gold); }
.btn--gold:hover{ transform:translateY(-1px); box-shadow:0 8px 18px rgba(191,164,104,.25); }
.btn .sheen{ position:absolute; inset:0; border-radius:inherit;
  background:linear-gradient(120deg, transparent 30%, rgba(255,255,255,.5) 50%, transparent 70%);
  transform:translateX(-120%); pointer-events:none; }
.btn:hover .sheen{ animation:sheen 1.2s ease; }
@keyframes sheen{ from{transform:translateX(-120%)} to{transform:translateX(120%)} }

.reveal-up{ opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.reveal-up.is-visible{ opacity:1; transform:translateY(0) }
.delay-1{ transition-delay:.08s } .delay-2{ transition-delay:.16s }

.footer{ display:flex; justify-content:center; padding:3rem 1rem; color:#C8C8C8; }
.footer a{ color:var(--gold); text-decoration:none }

@media (prefers-reduced-motion: reduce){ *{animation:none !important; transition:none !important} }
.sr-only{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }

/* Logo feedback sutil */
.logo{ display:block; height:28px; filter:drop-shadow(0 0 0 rgba(191,164,104,0));
  transition:filter .25s ease, transform .2s ease; image-rendering:-webkit-optimize-contrast; }
.logo:hover{ filter:drop-shadow(0 0 12px rgba(191,164,104,.35)); transform:translateY(-1px); }