/* ============================================================
   BIG SISTER AI - SHARED NAV + FOOTER STYLES
   One copy of the nav and footer rules that used to be pasted into every
   page's inline <style> block. Linked from every page EXCEPT
   manifesto.html and manifesto-one-pager.html, which have their own dark
   design.

   Load order matters: the <link> sits BEFORE the page's inline <style>, so
   a page can still override a rule locally (pricing.html and 404.html add
   a footer top border; 404.html keeps its own hover color).

   Depends on tokens each page defines in :root: --ink, --ink-soft, --gray,
   --gray-2, --ice, --line, --maxw, --font-body.
   ============================================================ */

/* ---------- NAV ---------- */
.nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(18px);border-bottom:1px solid var(--line);}
.nav__in{max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;gap:18px;padding:14px 32px;}
.nav__logo{display:flex;align-items:center;gap:11px;}
.nav__logo svg{height:19px;width:auto;}
.nav__badge{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:600;color:var(--ink);background:var(--ice);border:1px solid var(--line);padding:4px 11px;border-radius:9999px;letter-spacing:.01em;white-space:nowrap;}
.nav__spacer{flex:1;}
.nav__links{display:flex;align-items:center;gap:28px;}
.nav__links a{font-size:15px;font-weight:500;color:var(--ink-soft);transition:color .15s;white-space:nowrap;}
.nav__links a:hover{color:var(--gray);}
.nav__links a.is-active{color:var(--ink);font-weight:600;}
.nav__login{font-size:14px;font-weight:500;color:var(--gray-2);transition:color .15s;white-space:nowrap;}
.nav__login:hover{color:var(--ink);}
.nav__toggle{display:none;}

/* ---------- FOOTER ---------- */
.footer{background:var(--ink);color:#fff;padding:60px 32px 40px;}
.footer__in{max-width:var(--maxw);margin:0 auto;}
.footer__top{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap;margin-bottom:44px;}
.footer__logo svg{height:22px;margin-bottom:16px;}
.footer__logomark{display:block;height:22px;width:auto;margin-bottom:16px;}
.footer__logomark path{fill:#fff;}
.footer__tag{font-size:14px;color:rgba(255,255,255,.55);max-width:300px;line-height:1.5;}
.footer__cols{display:flex;gap:48px;flex-wrap:wrap;}
.footer__col h4{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:14px;font-family:var(--font-body);}
.footer__col a{display:block;font-size:14.5px;color:rgba(255,255,255,.78);margin-bottom:10px;transition:color .15s;}
.footer__col a:hover{color:#fff;}
.footer__bot{border-top:1px solid rgba(255,255,255,.12);padding-top:24px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:13px;color:rgba(255,255,255,.45);}

/* ---------- RESPONSIVE ---------- */
@media(max-width:900px){
  .nav__links{display:none;}
}
@media(max-width:560px){
  .nav__badge{display:none;}
}
@media(max-width:480px){
  .nav__in{gap:8px;}
  .nav__in .btn{padding:11px 14px;}
}