@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;700;900&family=Inter:wght@400;600&display=swap');
:root{
  --black:#020202;--warm:#0b0806;
  --gold:#d4a73f;--gold2:#f6d982;--gold3:#b8902a;
  --cream:#f4ead7;--muted:#a99a82;--line:rgba(212,167,63,.3);
  --font:Cinzel,Georgia,serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{color:var(--cream);background:var(--black);font-family:Inter,system-ui,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}

/* Grain */
.grain{position:fixed;inset:0;pointer-events:none;opacity:.13;z-index:20;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}

/* ── TOPBAR ── */
.topbar{height:80px;display:flex;align-items:center;justify-content:space-between;
  padding:0 clamp(16px,4vw,56px);position:sticky;top:0;z-index:50;
  background:rgba(0,0,0,.92);backdrop-filter:blur(20px);border-bottom:1px solid var(--line)}
.logo{display:flex;align-items:center;gap:14px;color:inherit}
.vmark{font-family:var(--font);font-size:38px;color:var(--gold2);line-height:1}
.logo-text strong{display:block;font-family:var(--font);font-size:16px;letter-spacing:3px}
.logo-text small{display:block;font-size:9px;color:var(--muted);letter-spacing:3px;margin-top:3px}
.topnav{display:flex;gap:24px;align-items:center}
.topnav a{color:var(--cream);text-transform:uppercase;letter-spacing:2px;font-size:11px;
  font-family:var(--font);transition:color .2s;padding:4px 0;border-bottom:1px solid transparent}
.topnav a:hover,.topnav a.active{color:var(--gold2);border-bottom-color:var(--gold)}
.top-buy{background:linear-gradient(135deg,#f7d77b,#a36b18);color:#070401;
  font-family:var(--font);text-transform:uppercase;letter-spacing:2px;font-size:11px;
  font-weight:700;padding:12px 22px;border:none;cursor:pointer;transition:all .3s;white-space:nowrap}
.top-buy:hover{box-shadow:0 0 22px rgba(212,167,63,.5)}
.nav-tog{display:none;background:none;border:none;color:var(--gold2);font-size:1.5rem;cursor:pointer}

/* ── PAGE HEADER ── */
.page-hd{
  text-align:center;padding:5rem clamp(16px,4vw,56px) 3.5rem;
  background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(212,167,63,.12),transparent 55%),
    linear-gradient(180deg,#050403,var(--black));
  border-bottom:1px solid var(--line);
}
.page-hd .kicker{font-family:var(--font);color:var(--gold3);font-size:11px;letter-spacing:5px;
  text-transform:uppercase;margin-bottom:1rem;display:block}
.page-hd h1{font-family:var(--font);font-size:clamp(2rem,5vw,5rem);color:var(--gold2);
  text-transform:uppercase;letter-spacing:3px;line-height:1;margin-bottom:1rem;
  text-shadow:0 0 40px rgba(212,167,63,.3)}
.page-hd p{color:var(--muted);font-size:clamp(14px,1.1vw,17px);max-width:600px;margin:0 auto;line-height:1.7}
.ph-divider{display:flex;align-items:center;justify-content:center;gap:1rem;margin:1.2rem auto;max-width:300px}
.ph-divider::before,.ph-divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gold3),transparent)}
.ph-divider span{color:var(--gold2);font-size:1.2rem}

/* ── SECTION WRAPPERS ── */
.section{padding:4rem clamp(16px,4vw,56px);border-bottom:1px solid var(--line)}
.section-alt{background:linear-gradient(180deg,var(--black),#060402 50%,var(--black))}
.sec-title{font-family:var(--font);font-size:clamp(1.4rem,2.5vw,2.5rem);color:var(--gold2);
  text-transform:uppercase;letter-spacing:3px;margin-bottom:.75rem}
.sec-sub{color:var(--muted);font-size:15px;margin-bottom:3rem;max-width:600px}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 24px;font-family:var(--font);font-size:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:2px;cursor:pointer;transition:all .3s;border:none}
.btn-gold{background:linear-gradient(135deg,#f7d77b,#a36b18);color:#070401;border:1px solid #f7d77b}
.btn-gold:hover{box-shadow:0 0 28px rgba(212,167,63,.6);transform:translateY(-2px)}
.btn-outline{background:transparent;border:1px solid var(--gold);color:var(--gold2)}
.btn-outline:hover{background:rgba(212,167,63,.1)}
.btn-sm{padding:10px 18px;font-size:11px}
.btn-lg{padding:18px 36px;font-size:14px}

/* ── CARDS ── */
.card-grid{display:grid;gap:1.25rem}
.card{background:rgba(255,255,255,.025);border:1px solid rgba(212,167,63,.25);
  padding:1.75rem;transition:all .35s}
.card:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:0 16px 36px rgba(0,0,0,.45)}
.card h3{font-family:var(--font);color:var(--gold2);letter-spacing:1px;margin-bottom:.4rem}
.card p{color:var(--muted);font-size:13px;line-height:1.55}
.card .price{font-family:var(--font);font-size:1.8rem;color:var(--gold);margin:.75rem 0}
.card .tag{display:inline-block;font-family:var(--font);font-size:8px;letter-spacing:2px;
  text-transform:uppercase;padding:3px 9px;border:1px solid rgba(212,167,63,.3);color:var(--gold3);margin-bottom:.6rem}

/* ── FORMS ── */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;max-width:720px;margin:0 auto}
.form-grid .full{grid-column:1/-1}
.fgroup{display:flex;flex-direction:column;gap:.4rem}
.fgroup label{font-family:var(--font);font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--gold3)}
.fgroup input,.fgroup select,.fgroup textarea{
  background:#0a0807;border:1px solid rgba(212,167,63,.35);color:var(--cream);
  padding:13px 16px;font-family:Inter,sans-serif;font-size:14px;outline:none;
  transition:border-color .2s;width:100%;-webkit-appearance:none;appearance:none;}
.fgroup select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M0 0l6 8 6-8z' fill='%23d4a73f'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
.fgroup input:focus,.fgroup select:focus,.fgroup textarea:focus{border-color:var(--gold2)}
.fgroup input::placeholder,.fgroup textarea::placeholder{color:var(--muted)}
.fgroup textarea{height:120px;resize:vertical}
.form-submit{grid-column:1/-1;background:linear-gradient(135deg,#f7d77b,#a36b18);
  color:#070401;font-family:var(--font);font-size:13px;font-weight:700;
  text-transform:uppercase;letter-spacing:3px;padding:16px;border:none;cursor:pointer;transition:all .3s}
.form-submit:hover{box-shadow:0 0 28px rgba(212,167,63,.55);transform:translateY(-2px)}
.form-confirm{display:none;text-align:center;padding:2.5rem;border:1px solid var(--gold);background:rgba(212,167,63,.04)}
.form-confirm h3{font-family:var(--font);color:var(--gold2);margin-bottom:.75rem;font-size:1.3rem}
.form-confirm p{color:var(--muted);line-height:1.6}

/* ── MODAL ── */
.modal{position:fixed;inset:0;background:rgba(2,2,2,.96);backdrop-filter:blur(16px);
  z-index:200;display:none;align-items:center;justify-content:center;padding:2rem;overflow-y:auto}
.modal.open{display:flex}
.mbox{max-width:620px;width:100%;background:linear-gradient(180deg,#0c0906,#070604);
  border:1px solid var(--gold);padding:2.5rem;position:relative;max-height:90vh;overflow-y:auto}
.mclose{position:absolute;top:.8rem;right:1.2rem;background:none;border:none;
  color:var(--gold);font-size:2.2rem;cursor:pointer;line-height:1}
.mbox h2{font-family:var(--font);color:var(--gold2);font-size:1.5rem;text-align:center;margin-bottom:.5rem}
.msub{text-align:center;color:var(--muted);margin-bottom:1.5rem;font-size:.9rem}

/* ── FOOTER ── */
footer{border-top:1px solid var(--line);padding:24px clamp(16px,4vw,56px);
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.8rem;
  color:var(--muted);font-size:11px;letter-spacing:2px}
footer strong{font-family:var(--font);color:var(--gold2)}
footer nav a{color:var(--muted);margin:0 .5rem;font-family:var(--font);font-size:10px;
  letter-spacing:2px;text-transform:uppercase}
footer nav a:hover{color:var(--gold2)}

/* ── RESPONSIVE ── */
@media(max-width:1060px){
  .topnav{display:none;position:absolute;top:80px;left:0;right:0;background:rgba(0,0,0,.97);
    flex-direction:column;padding:1rem 2rem;border-bottom:1px solid var(--line);z-index:40}
  .topnav.open{display:flex}
  .topnav a{padding:.75rem 0;border-bottom:1px solid rgba(212,167,63,.1)}
  .nav-tog{display:block}
  .top-buy{font-size:10px;padding:10px 14px}
  .form-grid{grid-template-columns:1fr}
  footer{flex-direction:column;text-align:center}
}
@media(max-width:600px){
  .page-hd h1{font-size:clamp(1.8rem,8vw,3rem)}
  .topbar{height:70px}
}