    /* Shared nav + footer styles */
    .nav {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      margin-bottom: 3.5rem;
      padding-bottom: 1.5rem;
      border-bottom: 1px solid var(--border);
    }
    .nav-brand {
      display: inline-flex;
      align-items: center;
      gap: 0.65rem;
      text-decoration: none;
      font-weight: 700;
      font-size: 1.1rem;
    }
    .nav-logo {
      width: 30px; height: 30px;
      border-radius: 8px;
      object-fit: contain;
      filter: invert(1);
    }
    .nav-links { display: flex; gap: 1.5rem; align-items: center; }
    .nav-link {
      text-decoration: none;
      font-size: 0.9rem;
      color: var(--muted);
      transition: color 0.15s;
    }
    .nav-link:hover { color: var(--text); }

    footer {
      padding-top: 1.5rem;
      border-top: 1px solid var(--border);
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 1rem;
      font-size: 0.85rem;
      color: var(--muted);
    }
    footer a { color: var(--muted); text-decoration: none; }
    footer a:hover { color: var(--text); }
    .footer-links { display: flex; gap: 1rem; flex-wrap: wrap; }

    .nav-mobile-menu {
      display: none;
      text-decoration: none;
      font-size: 0.9rem;
      font-weight: 600;
      color: var(--muted);
    }
    .nav-mobile-menu:hover { color: var(--text); }

    @media (max-width: 720px) {
      .nav-mobile-menu { display: block; }
      .nav-links {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--bg, #fafaf8);
        padding: 1rem 1.5rem;
        border-bottom: 1px solid var(--border, #e8e5e0);
        flex-direction: column;
        gap: 0.75rem;
        z-index: 100;
      }
      .nav-links.show { display: flex; }
      .nav { position: relative; }
      footer { justify-content: center; text-align: center; }
      .footer-links { justify-content: center; }
    }
