/* Shared static page styling aligned with SPA */
:root {
  font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
  line-height: 1.5;
  font-weight: 400;
  color: #213547;
  background-color: #ffffff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body { margin:0; min-width:320px; min-height:100vh; background:#ffffff; color:#0f172a; }
main { max-width:1100px; margin:0 auto; padding:80px 20px 40px; box-sizing:border-box; }
@media (max-width:760px){ main { padding:80px 16px 40px; } }

/* Header (copied from Header.css) */
.header { background-color:#004080; color:#fff; padding:0.5rem 1rem; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #003366; position:fixed; top:0; width:100%; height:56px; z-index:1000; box-sizing:border-box; }
.header .logo { display:inline-flex; align-items:center; height:32px; padding:0 8px; border-radius:6px; background:rgba(255,255,255,0.08); font-size:15px; font-weight:700; color:#FFD700; text-decoration:none; line-height:1; letter-spacing:.2px; }
.header nav ul { list-style:none; display:flex; gap:1.25rem; margin:0; padding:0; flex-wrap:nowrap; }
.header nav ul li a, .header .menu .menu-trigger { color:#fff; text-decoration:none; font-weight:bold; font-size:15px; transition:color .3s; }
.header nav ul li a:hover, .header .menu .menu-trigger:hover { color:#FFD700; }
.header nav ul li.menu { position:relative; }
.header .menu .submenu { display:none; position:absolute; top:100%; right:0; background:#ffffff; color:#0f172a; padding:12px 14px; border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,0.18); width:clamp(280px,70vw,720px); max-width:calc(100vw - 24px); max-height:calc(100vh - 80px); overflow:auto; z-index:1100; box-sizing:border-box; gap:16px; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
.header nav ul li.menu:hover .submenu, .header nav ul li.menu:focus-within .submenu { display:grid; }
.submenu-section { display:flex; flex-direction:column; gap:6px; min-width:0; }
.submenu-title { font-size:12px; font-weight:700; letter-spacing:.02em; color:#475569; text-transform:uppercase; margin-bottom:4px; }
.submenu a[role="menuitem"] { color:#0f172a; text-decoration:none; font-size:14px; padding:4px 6px; border-radius:6px; }
.submenu a[role="menuitem"]:hover { background:#f1f5f9; }
.submenu-pill { display:inline-flex; align-items:center; padding:4px 8px; border-radius:999px; font-size:12px; line-height:1; width:fit-content; }
.submenu-pill.current { background:#ecfeff; color:#0369a1; border:1px solid #bae6fd; }
.submenu-pill.disabled { background:#f8fafc; color:#94a3b8; border:1px dashed #e2e8f0; cursor:not-allowed; opacity:.8; }

/* Footer (from Footer.css) */
.footer { background-color:#004080; color:#fff; text-align:center; padding:1rem 1.25rem; width:100%; }
.footer .footer-content { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.footer .footer-links a { color:#fff; margin:0 .5rem; text-decoration:none; transition:color .3s; font-size:13px; }
.footer .footer-links a:hover { color:#FFD700; }

/* Elements used by generated static pages */
h1 { font-size:28px; margin:12px 0 6px; line-height:1.2; }
p.lead { color:#475569; margin:0 0 12px; }
.chips { display:flex; gap:8px; flex-wrap:wrap; margin:8px 0 12px; }
.chip { border:1px solid #d1d5e0; border-radius:999px; padding:4px 10px; font-size:13px; text-decoration:none; color:#0f172a; background:#fff; }
.chip:hover { background:#f1f5f9; }
.list { display:grid; grid-template-columns:1fr; gap:6px; }
.item { padding:8px 10px; border:1px solid #e5e7eb; border-radius:8px; background:#fff; }
.muted { color:#64748b; }

/* About page specific helpers */
.pill { display:inline-block; background:#2d2d5a; color:#fff; padding:3px 10px; border-radius:999px; font-size:.7rem; font-weight:600; letter-spacing:.5px; margin-right:6px; }
.note { background:#fff9db; border:1px solid #fce588; padding:10px 14px; border-radius:10px; font-size:.85rem; }
.data-dictionary table { width:100%; border-collapse:collapse; font-size:.85rem; }
.data-dictionary th, .data-dictionary td { border:1px solid #e2e8f0; padding:6px 8px; text-align:left; vertical-align:top; }
.data-dictionary th { background:#f1f5f9; }
.cta { margin:36px 0; padding:22px; border:2px dashed #e2e8f0; border-radius:14px; text-align:center; }
.cta a { display:inline-block; margin:6px 8px 0; padding:8px 14px; background:#0d6efd; color:#fff; text-decoration:none; font-weight:600; border-radius:8px; font-size:.9rem; }
.cta a:hover { background:#0946a6; }
.sr-only { position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden; }

/* Spacing for fixed header so content not hidden */
.has-fixed-header { padding-top:56px; }

/* Embedded map preview styles */
.embed-map { margin:28px 0 46px; }
.embed-map__inner { position:relative; width:100%; padding-top:56.25%; background:#0f172a; border:1px solid #e2e8f0; border-radius:14px; overflow:hidden; }
.embed-map__inner iframe { position:absolute; inset:0; width:100%; height:100%; border:0; background:#fff; }
.embed-map__loading { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:.9rem; color:#f8fafc; background:repeating-linear-gradient(45deg,#1e293b,#1e293b 10px,#334155 10px,#334155 20px); animation: shimmer 1.2s linear infinite; }
/* Hide loader when iframe reports load */
.embed-map--loaded .embed-map__loading { opacity:0; pointer-events:none; transition:opacity .4s ease; }
@keyframes shimmer { 0% { filter:brightness(1); } 50% { filter:brightness(1.25); } 100% { filter:brightness(1); } }
.embed-map__actions { display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin:12px 4px 0; font-size:.85rem; }
.embed-map__open { background:#0d6efd; color:#fff; padding:8px 14px; border-radius:8px; text-decoration:none; font-weight:600; font-size:.85rem; }
.embed-map__open:hover { background:#0946a6; }
.embed-map__hint { color:#64748b; }
@media (max-width:640px){ .embed-map__inner { padding-top:70%; } }
@media print { .embed-map__inner iframe { display:none; } .embed-map__loading { display:none; } .embed-map__actions { display:none; } }
