/* Menú principal único. Usa las variables de la página (citizen.css o seo.css) con valores de reserva. */
.site-header { position: relative; z-index: 40; }
.site-header .header-tools { display: flex; align-items: center; gap: 10px; flex: none; }
.main-nav { display: block; flex: 1 1 auto; min-width: 0; margin: 0; border: 0; overflow: visible; }
.main-nav .mn-list, .main-nav .mn-more-list { margin: 0; padding: 0; list-style: none; }
.main-nav .mn-list { display: flex; align-items: center; justify-content: flex-end; gap: 2px; }
.main-nav li { margin: 0; padding: 0; }
.main-nav a, .main-nav .mn-more-btn {
  display: inline-flex; align-items: center; gap: 5px; min-height: 44px; padding: 0 12px; margin: 0;
  border: 0; border-bottom: 3px solid transparent; border-radius: 8px 8px 0 0; background: none;
  color: var(--ink, #0f172a); font: 650 15px/1.2 system-ui, sans-serif; text-decoration: none; white-space: nowrap; cursor: pointer;
}
.main-nav a:hover, .main-nav .mn-more-btn:hover, .main-nav .mn-more.open > .mn-more-btn { background: rgba(100, 116, 139, .14); color: var(--ink, #0f172a); }
.main-nav a[aria-current], .main-nav .mn-more.has-current > .mn-more-btn { border-bottom-color: var(--accent, #fbbf24); font-weight: 800; }
.main-nav a:focus-visible, .main-nav .mn-more-btn:focus-visible, .mn-toggle:focus-visible { outline: 3px solid var(--brand, #334155); outline-offset: -3px; }
.main-nav .mn-chevron { transition: transform .15s; }
.main-nav .mn-more.open .mn-chevron { transform: rotate(180deg); }
.main-nav .mn-more { position: relative; }
.main-nav .mn-more-list {
  display: none; position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; min-width: 270px; padding: 6px;
  border: 1px solid var(--line, #e2e8f0); border-radius: 14px; background: var(--paper, #fff); box-shadow: 0 14px 34px rgba(15, 23, 42, .18);
}
.main-nav .mn-more.open .mn-more-list { display: block; }
.main-nav .mn-more-list a { display: flex; width: 100%; border: 0; border-radius: 9px; padding: 0 12px; font-weight: 600; white-space: normal; }
.main-nav .mn-more-list a[aria-current] { background: rgba(100, 116, 139, .16); font-weight: 800; box-shadow: inset 4px 0 0 var(--accent, #fbbf24); }
.mn-toggle {
  display: none; align-items: center; gap: 7px; min-height: 44px; padding: 0 14px 0 11px; border: 1px solid var(--line, #e2e8f0); border-radius: 999px;
  background: transparent; color: var(--ink, #0f172a); font: 700 15px/1 system-ui, sans-serif; cursor: pointer;
}
.mn-toggle:hover { border-color: currentColor; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .main-nav .mn-more-list { box-shadow: 0 14px 34px rgba(0, 0, 0, .55); }
}
:root[data-theme="dark"] .main-nav .mn-more-list { box-shadow: 0 14px 34px rgba(0, 0, 0, .55); }
@media (max-width: 899.98px) {
  .mn-toggle { display: inline-flex; }
  .main-nav {
    display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 60; padding: 6px 16px 14px;
    background: var(--paper, #fff); border-bottom: 1px solid var(--line, #e2e8f0); box-shadow: 0 16px 28px rgba(15, 23, 42, .2);
    max-height: calc(100vh - 80px); max-height: calc(100dvh - 80px); overflow-y: auto;
  }
  .main-nav.open { display: block; }
  .main-nav .mn-list { display: block; }
  .main-nav a { display: flex; width: 100%; min-height: 48px; padding: 0 8px; border: 0; border-bottom: 1px solid var(--line, #e2e8f0); border-radius: 0; font-size: 16px; white-space: normal; }
  .main-nav a[aria-current] { box-shadow: inset 4px 0 0 var(--accent, #fbbf24); padding-left: 16px; background: rgba(100, 116, 139, .12); }
  .main-nav .mn-more-btn { display: none; }
  .main-nav .mn-more-list { display: block; position: static; min-width: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: none; }
  .main-nav .mn-more-list a { padding: 0 8px; border: 0; border-bottom: 1px solid var(--line, #e2e8f0); border-radius: 0; font-weight: 650; }
  .main-nav .mn-more-list a[aria-current] { padding-left: 16px; }
}
@media (max-width: 1199.98px) { .site-header .header-date { display: none; } }

/* Pie común (site_nav.cjs → footerHTML) */
.site-footer { position: relative; margin-top: 56px; background: #1e293b; color: #cbd5e1; font: 15px/1.55 system-ui, sans-serif; }
.site-footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: linear-gradient(90deg, var(--accent, #fbbf24) 0 33%, #334155 33%); }
.site-footer .sf-in { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 2fr); gap: 40px; max-width: 1240px; margin: 0 auto; padding: 52px max(24px, calc((100vw - 1240px) / 2)) 36px; }
.site-footer a { color: #f1f5f9; text-decoration: none; }
.site-footer a:hover { color: var(--accent, #fbbf24); text-decoration: underline; text-underline-offset: 3px; }
.site-footer a:focus-visible, .site-footer button:focus-visible { outline: 3px solid var(--accent, #fbbf24); outline-offset: 3px; border-radius: 4px; }
.sf-logo { display: inline-flex; align-items: center; gap: 12px; }
.sf-logo .sf-mark { flex: none; color: var(--accent, #fbbf24); }
.sf-logo strong { display: block; font: 800 20px/1.15 "Bricolage Grotesque", system-ui, sans-serif; color: #fff; }
.sf-logo small { display: block; margin-top: 2px; font-size: 13px; color: var(--accent, #fbbf24); font-weight: 650; }
.sf-about { max-width: 42ch; margin: 18px 0 20px; color: #cbd5e1; }
.sf-social { display: flex; gap: 10px; margin: 0; padding: 0; list-style: none; }
.sf-social a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid #475569; border-radius: 999px; color: #f1f5f9; }
.sf-social a:hover { border-color: var(--accent, #fbbf24); background: rgba(251, 191, 36, .12); text-decoration: none; }
.sf-mail { margin: 14px 0 0; font-size: 14px; }
.sf-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin: 0; padding: 0; border: 0; overflow: visible; }
.sf-cols h2 { margin: 0 0 12px; font: 800 13px/1.2 system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--accent, #fbbf24); }
.sf-cols h2::before { display: none; }
.sf-cols ul { margin: 0; padding: 0; list-style: none; }
.sf-cols li { margin: 0; }
.sf-cols a { display: inline-block; padding: 6px 0; color: #e2e8f0; }
.sf-legal { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; max-width: 1240px; margin: 0 auto; padding: 20px max(24px, calc((100vw - 1240px) / 2)) 28px; border-top: 1px solid #334155; font-size: 13px; color: #94a3b8; }
.sf-legal p { margin: 0; max-width: 80ch; }
.sf-legal .analytics-settings { min-height: 40px; padding: 6px 14px; border: 1px solid #475569; border-radius: 999px; background: transparent; color: #e2e8f0; font: inherit; cursor: pointer; }
.sf-legal .analytics-settings:hover { border-color: var(--accent, #fbbf24); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .site-footer { background: #0b1220; border-top: 1px solid #1e293b; } }
:root[data-theme="dark"] .site-footer { background: #0b1220; border-top: 1px solid #1e293b; }
@media (max-width: 860px) {
  .site-footer .sf-in { grid-template-columns: 1fr; gap: 32px; padding-top: 40px; }
}
@media (max-width: 560px) {
  .sf-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 16px; }
  .sf-cols > div:last-child { grid-column: 1 / -1; }
  .site-footer .sf-in, .sf-legal { padding-left: 18px; padding-right: 18px; }
}