:root {
  --bg: #1E2024;
  --surface: #2A2D32;
  --raised: #34383E;
  --line: #3F444B;
  --ink: #E8E6E1;
  --muted: #A7A39B;
  --rust: #B5683C;
  --rust-hover: #D07E4C;
}

html { letter-spacing: 0; }
body {
  margin: 0;
  background: #1E2024;
  color: #E8E6E1;
  font-family: "Inter", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.7;
}
a { color: #B5683C; text-decoration: none; }
a:hover, a:focus { color: #D07E4C; text-decoration: underline; }
h1, h2, h3, h4, h5, h6, .navbar-brand {
  font-family: "Playfair Display", Georgia, serif;
  color: #E8E6E1;
  letter-spacing: .2px;
  font-weight: 600;
}
h1 { font-size: 40px; font-weight: 700; margin-top: 0; }
h2 { font-size: 26px; }
h3 { font-size: 20px; }

/* ---- header / nav ---- */
.bg-primary { background: #34383E !important; }
.bg-dark { background: #16181B !important; }
.text-light, .text-light a { color: #E8E6E1 !important; }
.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  box-shadow: 0 2px 16px rgba(0, 0, 0, .45);
}
.navbar {
  min-height: auto;
  padding: .7rem max(1rem, 4vw);
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  border-bottom: 1px solid #3F444B;
}
.navbar-brand {
  color: #E8E6E1;
  font-size: 1.2rem;
  white-space: normal;
}
.nav-links {
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .15rem;
}
.nav-links .nav-link {
  color: #E8E6E1;
  text-decoration: none;
  padding: .3rem .55rem;
  display: inline-block;
  font-size: .92rem;
  border-radius: 6px;
}
.nav-links .nav-link:hover { color: #D07E4C; background: rgba(181, 104, 60, .12); text-decoration: none; }
.nav-toggle { color: #E8E6E1 !important; font-size: 1.3rem; }

/* CSS-only dropdown (no JS) */
.nav-dropdown { position: relative; display: inline-flex; }
.dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 14rem;
  background: #2A2D32;
  border: 1px solid #3F444B;
  border-radius: 8px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .5);
  padding: .4rem;
  z-index: 40;
}
.nav-dropdown:hover .dropdown-menu,
.nav-dropdown:focus-within .dropdown-menu { display: grid; }
.dropdown-menu a { padding: .45rem .55rem; color: #E8E6E1; border-radius: 6px; font-size: .9rem; }
.dropdown-menu a:hover { background: #34383E; color: #D07E4C; text-decoration: none; }

/* ---- hero ---- */
.home-hero {
  background:
    linear-gradient(180deg, rgba(20,22,26,.55), rgba(20,22,26,.78)),
    url("/assets/images/img_1959a7bdf02f.png") center center / cover no-repeat,
    #1E2024;
  padding: 6rem 1rem;
}
.home-hero h1 { color: #fff; font-size: 3rem; margin-bottom: .6rem; }
.hero-tagline { color: #D8D4CC; max-width: 46rem; margin: 0 auto; }
.hero-kicker {
  margin: 0 0 .5rem;
  color: #B5683C;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: .78rem;
}

/* ---- layout ---- */
.page-band { padding: 2.6rem 1rem; }
.content-panel, .quick-panel, .club-sidebar {
  background: #2A2D32;
  border: 1px solid #3F444B;
  border-radius: 8px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .25);
  padding: 1.5rem;
  margin-bottom: 1.4rem;
}
.lead { font-size: 1.1rem; color: #C9C5BD; }
.btn.btn-primary {
  background: #B5683C;
  border-color: #B5683C;
  color: #1B1410;
  font-weight: 600;
}
.btn.btn-primary:hover { background: #D07E4C; border-color: #D07E4C; color: #16110d; }

/* ---- content link styling (scoped, editorial links stay visible) ---- */
.site-prose a, .category-intro a, .content-card a, .article-body a, .related-panel a {
  color: #C9824F;
  text-decoration: underline;
  text-decoration-color: rgba(181, 104, 60, .5);
  text-underline-offset: 2px;
}
.site-prose a:hover, .category-intro a:hover, .article-body a:hover { color: #D07E4C; }

/* ---- cards / figures ---- */
.event-column { padding: .45rem; }
.content-card, .event-card {
  background: #34383E;
  border: 1px solid #3F444B;
  border-radius: 8px;
  overflow: hidden;
  height: 100%;
}
.event-card .card-title a { color: #E8E6E1; text-decoration: none; }
.card-image img, .content-figure img, .card-gallery img, .article-main-image img {
  display: block; max-width: 100%; height: auto;
}
.card-image img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.content-heading { margin-top: 1.5rem; }
.content-list { padding-left: 1.25rem; }
.content-figure { margin: 1rem 0; border-radius: 6px; overflow: hidden; border: 1px solid #3F444B; }
.figure-right { float: right; max-width: 42%; margin-left: 1rem; }
.figure-left { float: left; max-width: 42%; margin-right: 1rem; }
figcaption { font-size: .82rem; color: #A7A39B; padding-top: .35rem; }
.card-gallery figure { margin: 0; }

.table-wrap { overflow-x: auto; margin: 1rem 0; }
.table { background: #34383E; color: #E8E6E1; }
.table th, .table td { border-color: #3F444B; }
.media-frame iframe { border: 0; background: #2A2D32; }
.page-breadcrumbs { margin-bottom: 1rem; }
.breadcrumb .breadcrumb-item a { color: #B5683C; }

.quick-panel { display: grid; gap: .5rem; }
.quick-panel a {
  display: block;
  padding: .55rem .65rem;
  background: #34383E;
  border: 1px solid #3F444B;
  border-radius: 8px;
  color: #C9824F;
}
.quick-panel a:hover { color: #D07E4C; text-decoration: none; border-color: #B5683C; }

.toc {
  background: #34383E;
  border: 1px solid #3F444B;
  border-radius: 8px;
  padding: .9rem;
  margin: 1rem 0;
}
.article-main-image { float: right; max-width: 33%; margin: 0 0 1rem 1rem; }
.article-meta { color: #A7A39B; font-size: .85rem; }

/* ---- footer ---- */
.site-footer { color: #C9C5BD; padding: 2.4rem 1rem; border-top: 1px solid #3F444B; }
.site-footer h2 { color: #E8E6E1; font-size: 1.2rem; }
.site-footer a { color: #B5683C; }
.site-footer a:hover { color: #D07E4C; }
.footer-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .45rem .9rem;
  font-size: .9rem;
}
.empty-copy { color: #A7A39B; }
.club-sidebar .nav a { color: #C9824F; }

@media (max-width: 840px) {
  .navbar { display: block; }
  .nav-links { display: none; justify-content: flex-start; margin-top: .6rem; }
  .site-header.nav-open .nav-links { display: flex; }
  .home-hero { padding: 4rem 1rem; }
  .home-hero h1 { font-size: 2.1rem; }
  .figure-right, .figure-left, .article-main-image { float: none; max-width: 100%; margin: 1rem 0; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .footer-grid { grid-template-columns: 1fr; }
  .content-panel, .quick-panel, .club-sidebar { padding: 1.1rem; }
}
@media print {
  .site-header, .site-footer, .club-sidebar, .quick-panel { display: none; }
  body { background: #fff; color: #000; }
  .content-panel { box-shadow: none; border: 0; }
}
