/* ==========================================================================
   MOBILE NAV — adds a hamburger + slide-down panel to the existing nav-dd
   dropdown nav below 900px, where it currently just disappears with no
   replacement. Uses !important on the handful of properties that need to
   beat page-specific inline rules (some pages hide .nav-links at 640px
   instead of 900px, or set display:none unconditionally).
   ========================================================================== */

.nav-burger { display: none; position: relative; width: 34px; height: 34px; border: none; background: none; cursor: pointer; flex-shrink: 0; padding: 0; }
.nav-burger span { position: absolute; left: 7px; right: 7px; height: 2px; background: var(--text, #f0ede8); border-radius: 2px; transition: transform 0.3s ease, opacity 0.2s ease; }
.nav-burger span:nth-child(1) { top: 11px; }
.nav-burger span:nth-child(2) { top: 16px; }
.nav-burger span:nth-child(3) { top: 21px; }
nav.nav-open .nav-burger span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
nav.nav-open .nav-burger span:nth-child(2) { opacity: 0; }
nav.nav-open .nav-burger span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

@media (max-width: 900px) {
  /* minmax(0,1fr) — not bare 1fr — so this column can actually shrink below
     the logo's intrinsic width instead of forcing nav-right off-screen. */
  nav { grid-template-columns: minmax(0,1fr) auto !important; }
  .logo-img img { height: 22px !important; }
  .nav-burger { display: flex !important; align-items: center; justify-content: center; order: -1; }
  .nav-signin { display: none !important; }

  .nav-links {
    display: flex !important; flex-direction: column; align-items: stretch; gap: 2px;
    position: fixed; top: 62px; left: 0; right: 0;
    background: var(--black, #0a0a0a); border-bottom: 1px solid var(--border, rgba(200,184,154,.08));
    padding: 0 20px; max-height: 0; overflow-y: auto; opacity: 0;
    transition: max-height 0.35s ease, opacity 0.25s ease, padding 0.35s ease;
    pointer-events: none; z-index: 100;
  }
  nav.nav-open .nav-links { max-height: 75vh; opacity: 1; padding: 10px 20px 18px; pointer-events: auto; }
  .nav-links > a { padding: 13px 12px; border-radius: 8px; }

  .nav-dd { width: 100%; }
  .nav-dd-btn { width: 100%; }
  .nav-dd-menu {
    display: flex !important; position: static !important; box-shadow: none !important;
    border: none !important; background: none !important; padding: 0 0 6px 10px !important;
    min-width: 0 !important;
  }
  .nav-dd-menu::before { display: none; }
}
