/* ═══════════════════════════════════════════════════════════
   FIDEOGRAPH NAV
   Navigation bar, TOC, and progress bar.
   Loaded on every page via functions.php.
═══════════════════════════════════════════════════════════ */

/* ── NAV ── */
.fg-nav {
  background: var(--brand-ink);
  border-bottom: 1px solid rgba(201, 168, 76, .2);
  padding: 0 24px;
  position: sticky;
  top: 0;
  z-index: 90;
}

.fg-nav__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 60px;
  gap: 20px;
}

/* Logo */
.fg-nav__logo {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  flex-shrink: 0;
}

.fg-nav__mark {
  flex-shrink: 0;
}

.fg-nav__logotype-text {
  font-family: var(--font-sans);
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -1px;
  color: #fff;
  line-height: 1;
}

.fg-nav__logotype-accent {
  color: var(--brand-gold);
}

/* Links */
.fg-nav__links {
  display: flex;
  gap: 4px;
  list-style: none;
}

.fg-nav__links a {
  font-size: 11px;
  letter-spacing: .06em;
  color: rgba(255, 255, 255, .45);
  text-decoration: none;
  padding: 5px 12px;
  border-radius: 99px;
  transition: all .15s;
}

.fg-nav__links a:hover,
.fg-nav__links a[aria-current="page"] {
  color: #fff;
  background: rgba(255, 255, 255, .07);
}

.fg-nav__links a[aria-current="page"] {
  color: var(--brand-gold);
  background: rgba(201, 168, 76, .1);
}

/* Search */
.fg-nav__search {
  flex: 1;
  max-width: 400px;
  position: relative;
  display: none;   /* hidden by default; shown on search-focused pages */
}

.fg-nav--has-search .fg-nav__search {
  display: block;
}

.fg-nav__search-input {
  width: 100%;
  padding: 8px 38px 8px 14px;
  font-family: var(--font-serif);
  font-size: 13px;
  color: #fff;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 99px;
  outline: none;
  transition: all .2s;
}

.fg-nav__search-input::placeholder {
  color: rgba(255, 255, 255, .35);
  font-style: italic;
}

.fg-nav__search-input:focus {
  background: rgba(255, 255, 255, .12);
  border-color: rgba(201, 168, 76, .5);
}

.fg-nav__search-btn {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--brand-gold);
  font-size: 16px;
  line-height: 1;
  padding: 0;
}

/* ── STICKY TOC ── */
.fg-toc {
  background: var(--fg-ink-2);
  padding: 0 24px;
  border-bottom: 1px solid rgba(155, 122, 46, .2);
  position: sticky;
  top: 60px;
  z-index: 80;
}

.fg-toc__inner {
  max-width: var(--max-width);
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 14px;
  height: 46px;
  flex-wrap: wrap;
  overflow: hidden;
}

.fg-toc__label {
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--fg-gold);
  white-space: nowrap;
  flex-shrink: 0;
}

.fg-toc__links {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  list-style: none;
}

.fg-toc__links a {
  font-size: 11px;
  color: rgba(250, 246, 237, .45);
  text-decoration: none;
  padding: 3px 10px;
  border-radius: 99px;
  border: 1px solid rgba(250, 246, 237, .1);
  white-space: nowrap;
  transition: all .15s;
}

.fg-toc__links a:hover,
.fg-toc__links a.is-active {
  background: var(--fg-gold);
  color: var(--fg-ink);
  border-color: var(--fg-gold);
}

/* ── MASTHEAD (shared across templates) ── */
.fg-masthead {
  background: var(--fg-ink);
  color: var(--fg-parchment);
  padding: 52px 24px 44px;
  position: relative;
  overflow: hidden;
}

.fg-masthead::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 60% at 50% 0%, rgba(155, 122, 46, .18) 0%, transparent 70%),
    repeating-linear-gradient(90deg, transparent, transparent 80px, rgba(155, 122, 46, .03) 80px, rgba(155, 122, 46, .03) 81px),
    repeating-linear-gradient(0deg,  transparent, transparent 80px, rgba(155, 122, 46, .03) 80px, rgba(155, 122, 46, .03) 81px);
  pointer-events: none;
}

.fg-masthead__inner {
  position: relative;
  max-width: var(--max-width);
  margin: 0 auto;
}

.fg-masthead--wide .fg-masthead__inner {
  max-width: var(--max-width-wide);
}

.fg-masthead__series {
  font-family: var(--font-serif);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--fg-gold-lt);
  margin-bottom: 14px;
}

.fg-masthead__series::before,
.fg-masthead__series::after {
  content: '—';
  margin: 0 10px;
  opacity: .45;
}

.fg-masthead__title {
  font-family: var(--font-display);
  font-size: clamp(26px, 4.5vw, 48px);
  font-weight: 900;
  line-height: 1.1;
  color: #fff;
  margin-bottom: 10px;
}

.fg-masthead__title em {
  font-style: italic;
  color: var(--fg-gold-lt);
}

.fg-masthead__sub {
  font-family: var(--font-display);
  font-size: clamp(14px, 2vw, 18px);
  font-weight: 400;
  font-style: italic;
  color: rgba(250, 246, 237, .6);
  max-width: 640px;
  line-height: 1.5;
  margin-bottom: 28px;
}

.fg-masthead__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  font-size: 11px;
  color: rgba(250, 246, 237, .45);
  letter-spacing: .06em;
}

.fg-masthead__meta span {
  display: flex;
  align-items: center;
  gap: 6px;
}

.fg-masthead__meta span::before {
  content: '';
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--fg-gold);
  display: block;
}

/* ── VERDICT BANNER ── */
.fg-verdict-banner {
  padding: 14px 24px;
  border-bottom: 3px solid;
}

.fg-verdict-banner--verified {
  background: var(--fg-green-pale);
  border-color: var(--verdict-verified);
}

.fg-verdict-banner--refuted {
  background: var(--fg-red-pale);
  border-color: var(--verdict-refuted);
}

.fg-verdict-banner--disputed {
  background: #eaf0fb;
  border-color: var(--verdict-disputed);
}

.fg-verdict-banner__inner {
  max-width: var(--max-width);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.fg-verdict-banner__sub {
  font-size: 13px;
  font-style: italic;
  margin-top: 4px;
}

.fg-verdict-banner--verified .fg-verdict-banner__sub { color: var(--verdict-verified); }
.fg-verdict-banner--refuted  .fg-verdict-banner__sub { color: var(--verdict-refuted); }
.fg-verdict-banner--disputed .fg-verdict-banner__sub { color: var(--verdict-disputed); }

.fg-verdict-banner__stats {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}

.fg-vstat__n {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 700;
  color: var(--fg-red-mid);
  display: block;
  line-height: 1;
}

.fg-vstat__l {
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--fg-ink-3);
}

/* ── FOOTER ── */
.fg-footer {
  background: var(--brand-ink);
  border-top: 1px solid rgba(201, 168, 76, .1);
  padding: 18px 24px;
}

.fg-footer__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.fg-footer__logotype {
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: -.5px;
  color: #fff;
}

.fg-footer__logotype span {
  color: var(--brand-gold);
}

.fg-footer__tagline {
  font-family: var(--font-garamond);
  font-style: italic;
  font-size: 12px;
  color: rgba(250, 246, 237, .3);
}

.fg-footer__links {
  display: flex;
  gap: 16px;
  list-style: none;
}

.fg-footer__links a {
  font-size: 11px;
  color: rgba(250, 246, 237, .3);
  text-decoration: none;
  transition: color .15s;
}

.fg-footer__links a:hover {
  color: var(--brand-gold);
}

.fg-footer__credit {
  font-size: 10px;
  color: rgba(250, 246, 237, .2);
  letter-spacing: .06em;
}

/* ── RESPONSIVE ── */
@media (max-width: 700px) {
  .fg-nav__links { display: none; }
  .fg-toc        { display: none; }
  .fg-footer__inner { flex-direction: column; align-items: flex-start; }
}
