/* glow3d shared header nav + footer links (index, catalog, product, custom-studio, about).
   Loaded after each page's own <style>, so page nav styling stays as-is on desktop. */
nav.site-nav .nav-logo { text-decoration: none; }
nav.site-nav .nav-links a.active { color: #00e5ff; }
.nav-toggle { display: none; }

@media (max-width: 900px) {
  nav.site-nav { flex-wrap: wrap; padding: 1.2rem 1.5rem; }
  nav.site-nav .nav-toggle {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    padding: 0;
    margin: -0.4rem -0.4rem -0.4rem 0;
    background: transparent;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 12px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .nav-toggle span {
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, #00e5ff, #ff6b4a);
    transition: transform 0.3s ease, opacity 0.2s ease;
  }
  .nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .nav-toggle:focus-visible { outline: 2px solid #00e5ff; outline-offset: 2px; }

  /* the link row becomes a drop-down panel inside the header */
  nav.site-nav .nav-links {
    display: none;
    flex-basis: 100%;
    flex-direction: column;
    order: 3; /* below the logo + toggle row */
    gap: 0;
    margin-top: 1rem;
    border-top: 1px solid rgba(255,255,255,0.08);
  }
  nav.site-nav.nav-open .nav-links { display: flex; }
  nav.site-nav .nav-links a {
    margin-left: 0;
    padding: 0.95rem 0.25rem;
    font-size: 1rem;
    letter-spacing: 0.05em;
    border-bottom: 1px solid rgba(255,255,255,0.05);
  }
  nav.site-nav .nav-links a:last-child { border-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .nav-toggle span { transition: none; }
}

/* footer */
footer.site-footer {
  text-align: center;
  padding: 4rem 2rem;
  color: #555;
  font-size: 0.85rem;
  border-top: 1px solid rgba(255,255,255,0.05);
}
.footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem 2rem;
  margin-bottom: 1.4rem;
}
.footer-links a {
  color: #888;
  text-decoration: none;
  letter-spacing: 0.05em;
  transition: color 0.3s;
}
.footer-links a:hover { color: #00e5ff; }