/* ═══════════════════════════════════════════════
   Modular Nav System — single source of truth
   Loaded via <link rel="stylesheet" href="/css/nav.css">
   ═══════════════════════════════════════════════ */

/* Skip link */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;left:8px;top:8px;width:auto;height:auto;padding:8px 16px;background:var(--accent,#6366f1);color:#fff;border-radius:6px;z-index:9999;font-weight:600}

/* Header */
.site-header{position:sticky;top:0;z-index:100;background:rgba(10,10,10,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border,#2a2a2a)}

/* Nav bar */
.nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-weight:700;font-size:1.25rem;color:var(--text,#e5e5e5);letter-spacing:-.02em;text-decoration:none}
.logo span{color:var(--accent,#6366f1)}

/* Nav search (desktop) */
.nav-search-desktop{flex:0 1 180px;margin-left:auto;margin-right:16px}
.nav-search-desktop input{width:100%;padding:6px 10px;font-size:.85rem;background:var(--surface,#141414);border:1px solid var(--border,#2a2a2a);border-radius:6px;color:var(--text,#e5e5e5);outline:none}
.nav-search-desktop input:focus{border-color:var(--accent,#6366f1)}
.nav-search-desktop input::placeholder{color:var(--dim,#666)}

/* Nav links */
.nav-links{display:flex;gap:28px;list-style:none;align-items:center;margin:0;padding:0}
.nav-links>li{margin:0}
.nav-links a{color:var(--dim,#999);font-size:.9rem;font-weight:500;text-decoration:none;transition:color .1s}
.nav-links a:hover,.nav-links a:focus-visible{color:var(--text,#e5e5e5)}

/* Nav toggle (hidden on desktop) */
.nav-toggle{display:none;background:none;border:none;color:var(--text,#e5e5e5);cursor:pointer;padding:4px 8px;line-height:1}
.nav-toggle svg{display:block}

/* Dropdowns */
.nav-dropdown{position:relative;display:inline-block}
.nav-dropdown:hover .nav-menu,
.nav-dropdown:focus-within .nav-menu{display:block;opacity:1;visibility:visible;transform:translateY(0)}
.nav-arrow{font-size:.65em;margin-left:3px;opacity:.6;transition:transform .15s}
.nav-dropdown:hover .nav-arrow{transform:rotate(180deg)}
.nav-menu{display:none;position:absolute;top:100%;left:0;background:var(--surface,#141414);border:1px solid var(--border,#2a2a2a);border-radius:0 0 10px 10px;min-width:260px;padding:8px 0;list-style:none;z-index:200;opacity:0;visibility:hidden;transform:translateY(-4px);transition:all .15s;box-shadow:0 8px 24px rgba(0,0,0,.4)}
.nav-menu li{margin:0}
.nav-menu a{display:block;padding:8px 16px;font-size:.85rem;color:var(--dim,#999)!important;border-left:2px solid transparent;transition:all .1s;white-space:nowrap}
.nav-menu a:hover{color:var(--text,#e5e5e5)!important;background:var(--surface2,#1e1e1e);border-left-color:var(--accent,#6366f1)}
.nav-menu .nav-section{padding:4px 16px;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--border,#444);font-weight:600;margin-top:4px}
.nav-menu .nav-section:first-child{margin-top:0}

/* Mobile search hidden on desktop */
.nav-search-mobile{display:none}

/* Mobile */
@media(max-width:768px){
  .nav-toggle{display:block}
  .nav-search-desktop{display:none}
  .nav-links{display:none}
  .nav.open .nav-links{display:flex;flex-direction:column;position:absolute;top:64px;left:0;right:0;background:var(--surface,#141414);border-bottom:1px solid var(--border,#2a2a2a);padding:16px 24px;gap:0;z-index:100;max-height:calc(100vh - 64px);overflow-y:auto}

  /* Mobile search at top of menu */
  .nav.open .nav-links .nav-search-mobile{order:-1;margin-bottom:12px}
  .nav-search-mobile{display:none}
  .nav.open .nav-links .nav-search-mobile{display:block}
  .nav-search-mobile input{width:100%;padding:8px 12px;font-size:.95rem;background:var(--surface2,#1e1e1e);border:1px solid var(--border,#2a2a2a);border-radius:6px;color:var(--text,#e5e5e5);outline:none}
  .nav-search-mobile input:focus{border-color:var(--accent,#6366f1)}

  /* Accordion: collapsed submenus */
  .nav.open .nav-dropdown .nav-menu{
    position:static;
    display:block;
    box-shadow:none;
    border-radius:0;
    border:none;
    padding-left:12px;
    opacity:1;
    visibility:visible;
    transform:none;
    max-height:0;
    overflow:hidden;
    transition:max-height .3s ease;
  }
  .nav.open .nav-dropdown.expanded .nav-menu{
    max-height:500px;
  }
  .nav.open .nav-dropdown:hover .nav-menu{max-height:0}
  .nav.open .nav-dropdown.expanded:hover .nav-menu{max-height:500px}

  /* Arrow rotation on expand */
  .nav.open .nav-dropdown.expanded > a .nav-arrow{
    transform:rotate(180deg);
  }

  /* Dropdown top-level items get padding + bottom border in mobile */
  .nav.open .nav-links > .nav-dropdown{
    border-bottom:1px solid var(--border,#222);
    padding:8px 0;
  }
  .nav.open .nav-links > .nav-dropdown > a{
    padding:4px 0;
    font-size:1rem;
    display:flex;
    align-items:center;
    justify-content:space-between;
  }
}

/* Shared footer — single source of truth for every page using partials.footer */
.site-footer{margin-top:48px;padding:40px 0 24px;border-top:1px solid var(--border,#2a2a2a);text-align:left}
.site-footer .footer-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-bottom:32px}
.site-footer .footer-col h4{margin:0 0 12px;color:var(--text,#e5e5e5);font-size:.8rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.site-footer .footer-col ul{margin:0;padding:0;list-style:none}
.site-footer .footer-col li{margin:0 0 8px}
.site-footer .footer-col a{margin:0;color:var(--dim,#999);font-size:.875rem;text-decoration:none}
.site-footer .footer-col a:hover,.site-footer .footer-col a:focus-visible{color:var(--accent-hover,#818cf8)}
.site-footer .footer-bottom{padding-top:24px;border-top:1px solid var(--border,#2a2a2a);text-align:center}
.site-footer .footer-bottom p{margin:0;color:var(--dim,#999);font-size:.8125rem}

@media(max-width:768px){
  .site-footer .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
}

@media(max-width:480px){
  .site-footer .footer-grid{grid-template-columns:1fr}
}