/* Moontide shared mobile nav — hamburger + dropdown, applies site-wide */
.nav__burger{display:none;flex-shrink:0;width:38px;height:38px;border:1px solid var(--line,rgba(188,174,238,.16));
  border-radius:10px;background:transparent;cursor:pointer;align-items:center;justify-content:center;
  padding:0;margin-left:.5rem;position:relative}
.nav__burger span{display:block;position:absolute;left:9px;right:9px;height:1.5px;background:var(--mist,#C9C0E2);
  transition:transform .25s ease,opacity .2s ease}
.nav__burger span:nth-child(1){top:13px}
.nav__burger span:nth-child(2){top:18.5px}
.nav__burger span:nth-child(3){top:24px}
.nav__burger[aria-expanded="true"] span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.nav__burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav__burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}

.nav__cta{white-space:nowrap;flex-shrink:0}
.nav__in{flex-wrap:nowrap}
.brand{min-width:0}

@media(max-width:900px){
  .nav__in{position:relative;gap:.4rem}
  .nav__links{display:none!important}
  .nav__links.is-open{
    display:flex!important;flex-direction:column;align-items:flex-start;gap:0;
    position:absolute;left:0;right:0;top:100%;
    background:linear-gradient(180deg,var(--indigo,#241640),var(--night,#160C2B) 85%);
    border-bottom:1px solid var(--line,rgba(188,174,238,.16));
    padding:.5rem 6vw 1.4rem;box-shadow:0 18px 34px rgba(0,0,0,.35);
    max-height:calc(100vh - 66px);overflow-y:auto;z-index:29
  }
  .nav__links.is-open a{padding:.85rem 0;width:100%;border-bottom:1px solid rgba(188,174,238,.1);font-size:.95rem}
  .nav__links.is-open a:last-child{border-bottom:none}
  .nav__links.is-open a.nav__links-cta{color:var(--teal,#46D2BE);font-weight:500}
  .nav__burger{display:inline-flex}
  /* the standalone "Work With Us" pill overflows the mobile header and forces horizontal
     scroll; its link now lives inside the dropdown (.nav__links-cta) instead, sitewide */
  .nav__cta{display:none!important}
}

/* two-up product photo layout: real photo + styled render side by side */
.fphoto.two-up{display:flex;gap:2px}
.fphoto.two-up img{width:50%;height:auto;display:block;flex:1 1 50%}
