/* ── studioross.com · shared nav ─────────────────────────────────
   Brings every project page's nav in line with index.html: the SR
   monogram in place of the wordmark, no divider on scroll, and on
   desktop no bar at all (mark top-left, links stacked top-right).
   Linked after each page's own <style>, so these rules win on equal
   specificity. On lironross.com assets/lr-nav.js removes this sheet
   and applies assets/lr-nav.css instead. ─────────────────────── */
nav.top .name { display: block; line-height: 0; font-size: 0; }
/* 27px tall, but the negative margins keep the layout box at 18px so the
   bar height matches the homepage (51px / 49px scrolled) */
nav.top .name svg { display: block; width: 28px; height: 27px; margin: -4.5px 0; }
nav.top.scrolled { border-bottom-color: transparent; }

@media (min-width: 1024px) {
  nav.top, nav.top.scrolled {
    padding: 20px;
    align-items: flex-start;
    background: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    pointer-events: none;
  }
  nav.top > * { pointer-events: auto; }
  nav.top .name svg { margin: 0; }
  nav.top .links { flex-direction: column; align-items: flex-start; gap: 8px; }
}

/* ── Back / Next: fixed to the bottom corners ─────────────────────
   Back sits at the left gutter. Next starts at the left edge of the nav
   links, so on desktop it reads as the foot of that column (main.js
   measures the column into --nav-links-w). Below 1024px the links live
   in a bar or the burger, so Next goes to the right gutter instead. */
.proj-nav {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  height: 0; width: auto; max-width: none;
  margin: 0 !important;
  padding: 0;
  z-index: 99;
}
/* a zero-height strip never trips the reveal observer: show it at once */
.proj-nav.reveal { opacity: 1; transform: none; }
.proj-nav .back-link { position: absolute; bottom: 20px; left: 24px; }
.proj-nav .back-link:nth-child(2) { left: auto; right: 24px; }
@media (min-width: 720px) {
  .proj-nav .back-link { left: 56px; }
  .proj-nav .back-link:nth-child(2) { left: auto; right: 56px; }
}
@media (min-width: 1024px) {
  .proj-nav .back-link { left: 20px; }
  .proj-nav .back-link:nth-child(2) { right: auto; left: calc(100% - 20px - var(--nav-links-w, 85px)); }
}
/* no footer on project pages (name, copyright and its divider). The
   space it left keeps the last content clear of the fixed Back/Next. */
footer.bot { display: none; }
body:has(.proj-nav) { padding-bottom: 120px; }