:root {
  --bg:#0a0a0a; --fg:#e8e6e3; --muted:#b3aea6; --gold:#c5a146; --card:#151515;
  --radius:18px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--bg); color:var(--fg);
  font:16px/1.6 var(--font);
  min-height:100vh; display:flex; flex-direction:column;
}
a{color:inherit;text-decoration:none}

/* ===== Header ===== */
.site-header{
  display:flex; justify-content:space-between; align-items:center;
  padding:26px 12%; max-width:1600px; margin:0 auto;
}
.brand{display:flex; align-items:center; gap:10px}
.brand-neo{color:var(--gold); font-weight:800; font-size:22px; letter-spacing:.7px}
.brand-protocol{color:var(--fg); font-weight:700; font-size:22px}
.nav{display:flex; align-items:center; gap:16px}

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 20px; border-radius:999px; font-weight:700; border:0; cursor:pointer;
  transition:opacity .2s ease, transform .2s ease, box-shadow .25s ease;
  text-decoration:none;
}
.btn.small{padding:8px 16px; font-size:14px}
.btn.primary{background:var(--gold); color:#000}
.btn.ghost{background:transparent; border:1px solid #3a3a3a}
.btn:hover{opacity:.94; transform:translateY(-1px)}

/* ===== Hero ===== */
.hero{
  position:relative; text-align:center; padding:80px 16px 40px;
  background:
    radial-gradient(1200px 700px at 50% -10%, rgba(197,161,70,.15), transparent 70%),
    radial-gradient(900px 500px at 80% 20%, rgba(197,161,70,.05), transparent 60%),
    linear-gradient(to bottom, #0a0a0a 0%, #000 100%);
  overflow:hidden;
}
.hero::before{
  content:""; position:absolute; inset:-8vh 0; z-index:0; pointer-events:none;
  background:url("/assets/anchsilver.png") center 56% / 38vmax no-repeat;
  opacity:.12; filter:brightness(1.06);
}
.hero-inner{position:relative; z-index:1; max-width:900px; margin:0 auto}
h1{font-size:clamp(40px,5vw,56px); margin-bottom:12px}
.lede{color:var(--muted); font-size:clamp(18px,2vw,22px)}

/* ===== Catalog ===== */
.catalog{padding:60px 12%; flex:1}
.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:32px;
  max-width:1200px; margin:0 auto;
}
.product{
  background:var(--card); border-radius:18px; padding:24px; text-align:center;
  border:1px solid #222; transition:transform .25s ease, box-shadow .3s ease;
}
.product:hover{
  transform:translateY(-3px);
  box-shadow:0 0 18px rgba(197,161,70,.25);
}
.product img{
  width:90px; height:auto; margin-bottom:18px; opacity:.85;
  filter:drop-shadow(0 0 4px rgba(197,161,70,.3));
}
.product h2{font-size:20px; margin-bottom:8px}
.product .desc{color:var(--muted); font-size:15px; margin-bottom:16px}

/* ===== Footer ===== */
.site-footer{
  text-align:center; padding:24px 16px; border-top:1px solid #222;
  color:#999; font-size:13px;
}

/* ===== Responsive ===== */
@media (max-width:520px){
  .site-header{padding:20px 7%}
  .brand-neo,.brand-protocol{font-size:19px}
  .grid{gap:24px}
}