:root{
  --gold:#c9a45c;
  --bg:#090909;
  --card:#111;
  --text:#f5f5f5;
  --muted:#b8b8b8;
}
*{box-sizing:border-box}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.7;
}
a{color:inherit}
.site-nav{
  padding:18px 5%;
  background:#080808;
  border-bottom:1px solid rgba(201,164,92,.2);
}
.nav-links{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}
.nav-links > li{position:relative}
.nav-links a{
  display:block;
  padding:10px 13px;
  text-decoration:none;
  font-size:.92rem;
}
.nav-links a:hover{color:var(--gold)}
.has-submenu > a::after{
  content:"⌄";
  margin-left:7px;
  color:var(--gold);
}
.submenu{
  position:absolute;
  top:100%;
  left:0;
  min-width:250px;
  margin:0;
  padding:8px;
  list-style:none;
  background:#101010;
  border:1px solid rgba(201,164,92,.25);
  box-shadow:0 18px 40px rgba(0,0,0,.45);
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:.2s ease;
  z-index:1000;
}
.has-submenu:hover .submenu,
.has-submenu:focus-within .submenu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.submenu li a{
  padding:10px 12px;
  border-radius:4px;
}
.submenu li a:hover{background:#191919}
.nav-cta{
  border:1px solid var(--gold);
  color:var(--gold);
  border-radius:4px;
}
.blog-page{
  width:min(920px,92%);
  margin:70px auto;
}
.blog-kicker{
  color:var(--gold);
  text-transform:uppercase;
  letter-spacing:.15em;
  font-size:.78rem;
}
.blog-page h1{
  font-size:clamp(2.2rem,5vw,4.3rem);
  line-height:1.08;
  margin:12px 0 18px;
}
.blog-meta{color:var(--muted);margin-bottom:35px}
.blog-page h2{
  margin-top:45px;
  font-size:1.65rem;
}
.blog-page p{color:#ddd}
.blog-page ul{color:#ddd}
.blog-page li{margin:8px 0}
.blog-page .highlight{
  border-left:3px solid var(--gold);
  padding:15px 20px;
  background:#101010;
  margin:28px 0;
}
.blog-back{
  display:inline-block;
  margin-top:35px;
  color:var(--gold);
  text-decoration:none;
}
@media(max-width:850px){
  .nav-links{flex-direction:column;align-items:stretch}
  .submenu{
    position:static;
    display:none;
    opacity:1;
    visibility:visible;
    transform:none;
    box-shadow:none;
  }
  .has-submenu:hover .submenu{display:block}
  .has-submenu:focus-within .submenu{display:block}
}