/* ════════════════════════════════════════════════════════════════════
   AURORA — UNIFIED SITE NAV + FOOTER
   One canonical header + footer for EVERY public page, so navigation is
   identical everywhere (same items, links, glass style). Self-contained:
   literal colour values (no --au-*/--ui2-* var dependency) so it renders
   the same regardless of which other stylesheet a page loads. Namespaced
   under .rl-nav / .rl-foot to avoid clashing with .au-nav / .ui2-nav.
   ════════════════════════════════════════════════════════════════════ */

/* Pages added body padding-top to clear their old FIXED nav. The unified
   nav is sticky (in normal flow), so that padding would leave a gap — reset
   it. Belt-and-braces: also neutralise the old fixed nav rules if any linger. */
body { padding-top: 0 !important; }

/* ── Header (sticky glass) ── */
.rl-nav {
  position: sticky; top: 0; z-index: 1000;
  background: rgba(10, 10, 30, 0.72);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
  backdrop-filter: blur(18px) saturate(1.4);
  border-bottom: 1px solid rgba(255, 255, 255, 0.10);
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
}
.rl-nav__inner {
  /* Force a consistent box across every page — some pages ship a global
     reset (content-box vs border-box) or override flex/display, which made
     this bar render 1180 / 1228 / 701-centered depending on the page. Pin
     it so the header is identical and aligns with the footer everywhere. */
  box-sizing: border-box !important;
  display: flex !important;
  width: 100% !important;
  max-width: 1200px !important;       /* match .au-container so the logo aligns with page content */
  margin-left: auto !important; margin-right: auto !important;
  align-items: center; justify-content: space-between;
  gap: 16px; padding: 14px 40px;
}
.rl-nav__logo {
  font-weight: 800; font-size: 1.05rem; letter-spacing: -0.02em;
  color: #F3EFFF; text-decoration: none; white-space: nowrap;
}
.rl-nav__logo span { color: #C9A8FF; }
.rl-nav__links { display: flex; align-items: center; gap: 26px; }
.rl-nav__links a {
  color: rgba(243, 239, 255, 0.78); text-decoration: none;
  font-size: 0.92rem; font-weight: 500; transition: color .15s; white-space: nowrap;
}
.rl-nav__links a:hover { color: #F3EFFF; }
.rl-nav__cta {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 18px; border-radius: 999px;
  background: linear-gradient(100deg, #6366F1 0%, #A855F7 50%, #EC4899 100%);
  color: #fff !important; font-weight: 700; font-size: 0.88rem;
  text-decoration: none; border: 1px solid transparent;
  box-shadow: 0 10px 30px -8px rgba(168, 85, 247, 0.5);
}
.rl-nav__cta:hover { color: #fff; filter: brightness(1.06); }
.rl-nav__auth { display: inline-flex; align-items: center; }
.rl-nav__auth .rl-nav__user {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 14px 7px 8px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.16); background: rgba(255,255,255,0.07);
  color: #F3EFFF; font-size: 0.85rem; font-weight: 600; text-decoration: none;
}
.rl-nav__user-ini { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(100deg,#6366F1,#A855F7,#EC4899); color: #fff; font-weight: 700; font-size: 0.74rem; }

/* ── Mobile (no hamburger — links wrap inline) ── */
@media (max-width: 760px) {
  /* full-width with a small gutter on phones, regardless of page-type width */
  .rl-nav__inner, .rl-foot__inner,
  body.site-editorial .rl-nav__inner, body.site-editorial .rl-foot__inner,
  body.site-tool .rl-nav__inner, body.site-tool .rl-foot__inner,
  body.site-samples .rl-nav__inner, body.site-samples .rl-foot__inner,
  body.site-pricing .rl-nav__inner, body.site-pricing .rl-foot__inner {
    max-width: 100% !important; padding-left: 20px !important; padding-right: 20px !important;
  }
  .rl-nav__inner { flex-wrap: wrap; gap: 6px 16px; }
  .rl-nav__links { flex-wrap: wrap; gap: 10px 16px; }
  .rl-nav__links a { font-size: 0.85rem; }
}

/* ── Footer ── */
.rl-foot {
  background: rgba(255, 255, 255, 0.03);
  border-top: 1px solid rgba(255, 255, 255, 0.10);
  padding: 48px 0 40px;
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
}
.rl-foot__inner { box-sizing: border-box !important; width: 100% !important; max-width: 1200px !important; margin-left: auto !important; margin-right: auto !important; padding: 0 40px; }

/* Per-page-type alignment: the nav/footer inner must match each page's own
   content container width + gutter so the logo sits exactly above the content
   left edge (the default 1200/40 matches .au-container marketing pages). */
body.site-editorial .rl-nav__inner, body.site-editorial .rl-foot__inner { max-width: 980px !important; padding-left: 24px !important; padding-right: 24px !important; }
body.site-tool .rl-nav__inner, body.site-tool .rl-foot__inner { max-width: 860px !important; padding-left: 24px !important; padding-right: 24px !important; }
body.site-samples .rl-nav__inner, body.site-samples .rl-foot__inner { max-width: 1180px !important; padding-left: 20px !important; padding-right: 20px !important; }
body.site-pricing .rl-nav__inner, body.site-pricing .rl-foot__inner { max-width: 1360px !important; padding-left: 32px !important; padding-right: 32px !important; }
.rl-foot__logo { font-weight: 800; font-size: 1.05rem; letter-spacing: -0.02em; color: #F3EFFF; margin-bottom: 16px; }
.rl-foot__logo span { color: #C9A8FF; }
.rl-foot__links { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-bottom: 18px; }
.rl-foot__links a { color: rgba(243, 239, 255, 0.6); text-decoration: none; font-size: 0.88rem; transition: color .15s; }
.rl-foot__links a:hover { color: #F3EFFF; }
.rl-foot__meta { color: rgba(243, 239, 255, 0.5); font-size: 0.82rem; line-height: 1.7; margin: 0; }
.rl-foot__meta a { color: rgba(243, 239, 255, 0.6); text-decoration: none; }
.rl-foot__copy { color: rgba(243, 239, 255, 0.4); font-size: 0.76rem; margin-top: 10px; }