:root{
  --bg:#0b1220;
  --surface:#0f1a2e;
  --card:#121f38;
  --text:#e8eefc;
  --muted:rgba(232,238,252,.65);
  --accent:#caa85a; /* gold */
  --accent2:#7dd3fc;
}
body{background:var(--bg); color:var(--text); font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial;}
.bg-surface{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00));}
.topbar{background:rgba(255,255,255,0.04); border-bottom:1px solid rgba(255,255,255,0.06);}
.btn-accent{background:linear-gradient(135deg,var(--accent),#e3c77d); border:0; color:#1a1407; font-weight:700;}
.btn-accent:hover{filter:brightness(1.05); transform:translateY(-1px);}
.nav-glass{background:rgba(11,18,32,0.78); backdrop-filter: blur(10px); border-bottom:1px solid rgba(255,255,255,0.06);}
.brand-logo{height:34px; width:auto; object-fit:contain;}
.brand-mark{width:34px; height:34px; border-radius:10px; background:linear-gradient(135deg,var(--accent),var(--accent2));}
.navbar .nav-link{position:relative; color:rgba(232,238,252,.85);}
.navbar .nav-link:hover{color:#fff;}
.navbar .nav-link::after{
  content:""; position:absolute; left:.35rem; right:.35rem; bottom:.25rem;
  height:2px; background:linear-gradient(90deg,var(--accent),var(--accent2));
  transform:scaleX(0); transform-origin:left; transition:transform .2s ease;
}
.navbar .nav-link:hover::after{transform:scaleX(1);}

.hero{
  padding:72px 0; background:
  radial-gradient(1200px 400px at 10% 10%, rgba(125,211,252,0.18), transparent 60%),
  radial-gradient(900px 400px at 90% 20%, rgba(202,168,90,0.20), transparent 55%),
  linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.00));
  background-size:cover; background-position:center;
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.hero-card{
  max-width:720px;
  background:rgba(18,31,56,0.55);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:24px;
  padding:28px;
  box-shadow:0 20px 60px rgba(0,0,0,.35);
}

.card-soft{
  background:rgba(18,31,56,0.55);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:20px;
  box-shadow:0 14px 40px rgba(0,0,0,.25);
}
.carousel-img{height:420px; object-fit:cover;}
.carousel-caption{
  background:rgba(0,0,0,0.35);
  border:1px solid rgba(255,255,255,0.10);
  border-radius:16px;
  padding:16px;
  backdrop-filter: blur(6px);
}
.product-img{height:220px; width:100%; object-fit:cover;}

.footer{background:rgba(255,255,255,0.04); border-top:1px solid rgba(255,255,255,0.06);}
.footer-link{color:rgba(232,238,252,.75); text-decoration:none;}
.footer-link:hover{color:#fff; text-decoration:underline;}

@media (max-width: 992px){
  .carousel-img{height:300px;}
  .hero{padding:56px 0;}
}