/* ============================================================
   NAV MENU (mobile sheet) + CURRENT-SECTION MARKER
   Shared by the homepage and the Elise page.
   The breakpoint comes from the nav's data-bp attribute so each
   page keeps the width at which its links already collapsed.
   ============================================================ */

/* current section: a quiet dot under the link you're reading */
.nav__links a:not(.nav__cta) { position: relative }
.nav__links a:not(.nav__cta)::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -9px;
  width: 4px;
  height: 4px;
  margin-left: -2px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0;
  transform: scale(.4);
  transition: opacity .3s ease, transform .3s cubic-bezier(.2, .7, .2, 1);
}
.nav__links a.is-current { opacity: 1 }
.nav__links a.is-current::after { opacity: .9; transform: scale(1) }

/* burger */
.nav__burger {
  display: none;
  position: relative;
  width: 40px;
  height: 40px;
  margin-left: 8px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  transition: color .4s ease;
  -webkit-tap-highlight-color: transparent;
}
.nav__burger:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px }
.nav__burger span {
  position: absolute;
  left: 11px;
  right: 11px;
  height: 1.5px;
  border-radius: 2px;
  background: currentColor;
  transition: transform .4s cubic-bezier(.2, .7, .2, 1), opacity .2s ease;
}
.nav__burger span:nth-child(1) { top: 14.5px }
.nav__burger span:nth-child(2) { top: 19.25px }
.nav__burger span:nth-child(3) { top: 24px }
.nav.is-open .nav__burger span:nth-child(1) { transform: translateY(4.75px) rotate(45deg) }
.nav.is-open .nav__burger span:nth-child(2) { opacity: 0 }
.nav.is-open .nav__burger span:nth-child(3) { transform: translateY(-4.75px) rotate(-45deg) }
.nav.is-dark .nav__burger { color: #fff }

html.nav-locked { overflow: hidden }

@keyframes navSheetIn {
  from { opacity: 0; transform: translateY(-8px) }
  to { opacity: 1; transform: none }
}
@keyframes navScrimIn { from { opacity: 0 } to { opacity: 1 } }

/* shared open-state rules, scoped per breakpoint below */
@media (max-width: 860px) {
  .nav[data-bp="860"] .nav__burger { display: block }
  .nav[data-bp="860"] .nav__links { margin-left: auto }
  .nav[data-bp="860"] .nav__links a::after { display: none }
}
@media (max-width: 940px) {
  .nav[data-bp="940"] .nav__burger { display: block }
  .nav[data-bp="940"] .nav__links { margin-left: auto }
  .nav[data-bp="940"] .nav__links a::after { display: none }
}

/* open state (only reachable when the burger is visible) */
.nav.is-open { background: rgba(255, 255, 255, .97); border-bottom-color: rgba(20, 22, 26, .07) }
.nav.is-open .nav__word { color: var(--signal) }
.nav.is-open .nav__mark svg { filter: none }
.nav.is-open .nav__burger { color: var(--ink) }
.nav.is-open::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 100vh;
  z-index: -1;
  background: rgba(20, 22, 26, .28);
  animation: navScrimIn .3s ease both;
}
.nav.is-open .nav__links {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding: 6px var(--gut) 26px;
  background: #fff;
  border-bottom: 1px solid rgba(20, 22, 26, .08);
  animation: navSheetIn .35s cubic-bezier(.2, .7, .2, 1) both;
}
.nav.is-open .nav__links a:not(.nav__cta) {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 0;
  font-size: 1.05rem;
  color: var(--ink) !important;
  opacity: .85;
  border-bottom: 1px solid rgba(20, 22, 26, .07);
}
.nav.is-open .nav__links a.is-current { color: var(--signal) !important; opacity: 1 }
.nav.is-open .nav__links .nav__cta {
  margin-top: 20px;
  padding: 14px 20px;
  text-align: center;
  font-size: .92rem !important;
  background: var(--signal);
  color: #fff !important;
}

@media (prefers-reduced-motion: reduce) {
  .nav__burger span,
  .nav__links a::after { transition: none }
  .nav.is-open .nav__links,
  .nav.is-open::after { animation: none }
}

/* Elise: tuck the sticky trial dock away while the menu is open */
html.nav-locked .dock { opacity: 0; pointer-events: none; transition: opacity .2s ease }