:root{
  --bg: #070707;
  --card: #0f0f0f;
  --gold: #E6C35A;
  --gold2:#B8901F;
  --text:#f5f5f5;
  --muted:#b9b9b9;
  --border: rgba(230,195,90,.18);
}

body{
  background: radial-gradient(1200px 500px at 20% 0%, rgba(230,195,90,.12), transparent 55%),
              radial-gradient(1000px 400px at 80% 10%, rgba(184,144,31,.10), transparent 60%),
              var(--bg);
  color: var(--text);
}

.navbar{
  background: rgba(0,0,0,.75) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}

.brand-mark{
  width: 34px; height: 34px;
  border-radius: 10px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  box-shadow: 0 14px 35px rgba(230,195,90,.18);
}

.hero{
  border-bottom: 1px solid var(--border);
}

.hero-card{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border: 1px solid var(--border);
  border-radius: 22px;
}

.badge-gold{
  background: rgba(230,195,90,.12);
  color: var(--gold);
  border: 1px solid var(--border);
}

.btn-gold{
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  color: #0a0a0a;
  border: none;
  font-weight: 700;
}
.btn-gold:hover{ filter: brightness(1.03); color:#0a0a0a; }

.btn-outline-gold{
  border: 1px solid rgba(230,195,90,.55);
  color: var(--gold);
  background: transparent;
}
.btn-outline-gold:hover{
  background: rgba(230,195,90,.10);
  color: var(--gold);
}

.product-card{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border: 1px solid var(--border);
  border-radius: 18px;
  overflow: hidden;
  height: 100%;
}

.product-img{
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: #111;
}

.muted{ color: var(--muted); }

.section-title{
  letter-spacing: .4px;
}

.footer{
  border-top: 1px solid var(--border);
  color: var(--muted);
}

.brand-logo{
  width: 34px;
  height: 34px;
  object-fit: contain;
  border-radius: 10px; /* remove if you want sharp edges */
}