/* ──────────────────────────────────────────────────────────────
   base.css — styles that were byte-identical across the page
   stylesheets: the reset, and the shared nav + footer chrome.

   Loaded BEFORE each page's own stylesheet, so any page can still
   override anything here simply by restating it.

   Note: :root variables, body, nav and .btn-primary differ from page
   to page, so they deliberately stay in the per-page files.
   ────────────────────────────────────────────────────────────── */

*, *::before, *::after {
  box-sizing: border-box; margin: 0; padding: 0;
}

html {
  scroll-behavior: smooth;
}

.nav-logo {
  display: flex; align-items: center; gap: 10px; text-decoration: none;
}

.nav-brand {
  font-family: 'Bebas Neue', sans-serif; font-size: 18px; letter-spacing: 3px; color: var(--white);
}

.nav-links {
  display: flex; gap: 30px; list-style: none; align-items: center;
}

.nav-links a {
  text-decoration: none; color: var(--muted); font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; transition: color 0.2s; white-space: nowrap;
}

.nav-links a:hover {
  color: var(--gold);
}

.nav-links a.current {
  color: var(--gold);
}

.nav-cta:hover {
  background: var(--gold); color: #141210 !important;
}

.footer-copy {
  font-size: 10px; color: var(--muted); letter-spacing: 1px;
}

.footer-links {
  display: flex; gap: 26px;
}

.footer-links a:hover {
  color: var(--gold);
}

.footer-links a.footer-ig {
  display: inline-flex; align-items: center;
}

.footer-links a.footer-ig svg {
  width: 18px; height: 18px;
}