/* ============================================================
   Shell: brand variables + header/nav + footer.
   The per-page content and its styling are reproduced verbatim
   from the original site; this file only provides the global
   variables and the header/footer chrome to match the live site.
   ============================================================ */
:root {
  --ak-navy: #2E4A62;
  --ak-navy-deep: #03203D;
  --ak-gold: #B19057;
  --ak-muted: #5a5a6a;
  --ak-text: #333;
  --ak-bg: #fff;
  --ak-border: #e8e8e8;
  --ak-divider-line: #e0e0e0;
  --ak-row-border: #f0f0f0;
  --ak-filter-border: #ddd;
  --ak-hover-bg: #faf9f5;
  --ak-light: #999;
  --ak-error: #b33; --ak-error-bg: #fdf0f0; --ak-error-border: #f0c3c3;
  --ak-success: #2d7a2d; --ak-success-bg: #f0f9f0; --ak-success-border: #c3e6c3;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html, body { overflow-x: hidden; max-width: 100%; }
body { margin: 0; font-family: "Manrope", system-ui, -apple-system, Segoe UI, Roboto, sans-serif; color: var(--ak-text); background: var(--ak-bg); }
img { max-width: 100%; }

/* Gentle page fade-in on load — softens navigation between pages (matches the live site's fade) */
@keyframes ak-page-in { from { opacity: 0; } to { opacity: 1; } }
.page-wrap { animation: ak-page-in .32s ease-out both; }
@media (prefers-reduced-motion: reduce) { .page-wrap { animation: none; } }

/* ---------- header / nav (matches live: brand left, centered wrapping menu, Email me pill right) ---------- */
.site-header { position: sticky; top: 0; z-index: 100; background: #fff; border-bottom: 1px solid #eee; }
.nav-inner { max-width: 1500px; margin: 0 auto; min-height: 84px; display: flex; align-items: center; gap: 16px; padding: 14px clamp(20px, 6vw, 64px); }
.nav-brand { font-family: "Manrope", sans-serif; font-size: 28px; font-weight: 700; color: var(--ak-navy); text-decoration: none; white-space: nowrap; letter-spacing: -.01em; }
.nav-center { flex: 1; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px 28px; }
.nav-center a { font-family: "Manrope", sans-serif; font-size: 15px; font-weight: 400; color: var(--ak-navy); text-decoration: none; padding: 4px 0; border-bottom: 2px solid transparent; }
.nav-center a:hover { color: var(--ak-gold); }
.nav-center a.active { border-bottom-color: var(--ak-navy); }
.nav-email { font-family: "Manrope", sans-serif; font-size: 15px; color: var(--ak-navy); text-decoration: none; border: 1px solid var(--ak-navy); border-radius: 10px; padding: 11px 22px; white-space: nowrap; }
.nav-email:hover { background: var(--ak-navy); color: #fff; }
.nav-toggle { display: none; background: none; border: 0; cursor: pointer; padding: 8px; margin-left: auto; }
.nav-toggle span { display: block; width: 26px; height: 2px; background: var(--ak-navy); margin: 6px 0; }

@media (max-width: 820px) {
  .nav-inner { min-height: 64px; }
  .nav-brand { font-size: 22px; }
  .nav-toggle { display: block; }
  .nav-center, .nav-email { display: none; flex-basis: 100%; }
  .site-header.open .nav-center { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding-top: 8px; }
  .site-header.open .nav-center a { font-size: 17px; padding: 10px 0; border-bottom: 0; }
  .site-header.open .nav-email { display: inline-block; margin-top: 10px; }
}

/* ---------- footer (dark navy, matches live) ---------- */
.site-footer { background: var(--ak-navy-deep); color: rgba(255,255,255,.85); padding: 54px clamp(20px,6vw,64px); }
.footer-inner { max-width: 1100px; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px; }
.footer-brand { font-family: "Manrope", sans-serif; font-size: 22px; font-weight: 700; color: #fff; text-decoration: none; }
.footer-nav { display: flex; f