/* Shared site nav dropdowns — loaded by every page. Edit menu items in each page's <nav class="top">. */
nav.top .navgroup{position:relative;display:flex;align-items:center}
nav.top .navgroup>.trigger{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-body);font-size:12px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;white-space:nowrap;background:none;border:none;padding:0;cursor:pointer;color:rgba(255,255,255,0.8);transition:color .2s ease-out}
nav.top .navgroup>.trigger svg{transition:transform .2s ease-out;opacity:.7}
nav.top .navgroup:hover>.trigger,nav.top .navgroup.open>.trigger{color:var(--white)}
nav.top .navgroup:hover>.trigger svg,nav.top .navgroup.open>.trigger svg{transform:rotate(180deg)}
nav.top .navgroup>.trigger.active{color:var(--taupe)}
nav.top.solid .navgroup>.trigger{color:var(--text-muted)}
nav.top.solid .navgroup:hover>.trigger,nav.top.solid .navgroup.open>.trigger,nav.top.solid .navgroup>.trigger.active{color:var(--navy)}
nav.top .dropdown{position:absolute;top:100%;left:-18px;padding-top:18px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s ease-out,transform .18s ease-out,visibility .18s;z-index:70}
nav.top .navgroup:hover .dropdown,nav.top .navgroup.open .dropdown{opacity:1;visibility:visible;transform:none}
nav.top .dropdown .panel{background:var(--white);border:1px solid var(--border-default);border-radius:var(--radius-md,8px);box-shadow:0 18px 44px rgba(13,27,42,0.18);padding:10px;display:flex;flex-direction:column;gap:2px;min-width:272px}
nav.top .dropdown a{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:var(--radius-sm);text-decoration:none;transition:background .18s ease-out}
nav.top .dropdown a:hover{background:var(--gray-light)}
nav.top .dropdown a .t{font-size:12px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--navy)}
nav.top .dropdown a .d{font-size:12.5px;line-height:1.5;color:var(--text-muted);letter-spacing:0;text-transform:none;font-weight:400}
nav.top .dropdown a.current .t{color:var(--taupe)}
@media (max-width:1100px){nav.top .navgroup,nav.top .links>a.nl{display:none}}

/* ---- mobile drawer ---- */
.navtoggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:0 10px;background:none;border:none;cursor:pointer;flex-shrink:0}
.navtoggle span{display:block;height:1.5px;background:var(--white);transition:transform .2s ease-out,opacity .2s ease-out}
nav.top.solid .navtoggle span{background:var(--navy)}
.navtoggle.on span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.navtoggle.on span:nth-child(2){opacity:0}
.navtoggle.on span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.mobilenav{display:none;position:fixed;left:0;right:0;top:0;padding:84px 24px calc(40px + env(safe-area-inset-bottom));z-index:45;background:var(--navy);max-height:100vh;max-height:100dvh;overflow:auto;flex-direction:column;gap:6px;-webkit-overflow-scrolling:touch}
.mobilenav.on{display:flex}
.mobilenav .mgroup{padding:16px 0;border-bottom:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:4px}
.mobilenav .mlabel,.mobilenav .mlabel a{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--taupe)}
.mobilenav .mitem{font-family:var(--font-display);font-size:20px;color:var(--white);padding:12px 0;min-height:44px;display:flex;align-items:center}
.mobilenav .mitem:hover{color:var(--taupe)}
.mobilenav .mflat{font-family:var(--font-display);font-size:20px;color:var(--white);padding:18px 0;border-bottom:1px solid rgba(255,255,255,.12);min-height:44px;display:flex;align-items:center}
.mobilenav .mcta{margin-top:22px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:18px 30px;border-radius:var(--radius-sm);background:var(--white);color:var(--navy);min-height:48px}
@media (max-width:1100px){.navtoggle{display:flex}}
nav.top.menuopen{background:var(--navy)}
nav.top.menuopen .navtoggle span{background:var(--white)}
nav.top.menuopen .lockup .mark-dark{display:none}
nav.top.menuopen .lockup .mark-light{display:block}
nav.top.menuopen .lockup .wm .n,nav.top.menuopen .lockup .n{color:var(--white)}

@media (max-width:520px){nav.top .lockup .wm,nav.top .lockup .n,nav.top .lockup .s,nav.top .lockup .vr{display:none}}
.stickycta{display:none;position:fixed;left:0;right:0;bottom:0;z-index:44;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(13,27,42,.96);backdrop-filter:blur(8px);transform:translateY(110%);transition:transform .24s var(--ease-out,ease-out)}
.stickycta.on{transform:none}
.stickycta a,.stickycta button{display:flex;align-items:center;justify-content:center;width:100%;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:17px 24px;border-radius:var(--radius-sm);background:var(--white);color:var(--navy);border:none;cursor:pointer;font-family:var(--font-body);min-height:48px;transition:transform 160ms var(--ease-out,ease-out),background-color var(--duration-fast,150ms) var(--ease-out,ease-out),color var(--duration-fast,150ms) var(--ease-out,ease-out)}
.stickycta a:active,.stickycta button:active{transform:scale(0.97)}
nav.top .navcta{transition:transform 160ms var(--ease-out,ease-out),background-color var(--duration-fast,150ms) var(--ease-out,ease-out),color var(--duration-fast,150ms) var(--ease-out,ease-out)}
nav.top .navcta:active{transform:scale(0.97)}
@media (max-width:900px){
  .stickycta{display:block}
  body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  nav.top .links .navcta,nav.top .links #navauth{display:none}
}


/* ---- shared motion: a11y + press + hover gating (plans 001–004) ---- */
@media (prefers-reduced-motion: reduce) {
  .reveal {
    transform: none;
    transition: opacity 0.2s var(--ease-out, ease);
  }
  .reveal.in { transform: none; }
  .d1, .d2, .d3 { transition-delay: 0s; }

  .goal:hover,
  .chips a:hover,
  .related a:hover,
  .card:hover,
  .vidwrap:hover img,
  .vidwrap:hover .bigplay .circ,
  .card:hover .thumb img,
  .card:hover .play,
  .prow:hover .go,
  .btn:active,
  .navcta:active,
  .stickycta a:active,
  .stickycta button:active {
    transform: none;
  }

  .stickycta {
    transition: none;
  }
}

@media (hover: hover) and (pointer: fine) {
  .goal:hover { transform: translateY(-3px); }
  .chips a:hover { transform: translateY(-2px); }
  .related a:hover { transform: translateY(-2px); }
  .card:hover { transform: translateY(-3px); }
  .card:hover .thumb img { transform: scale(1.03); }
  .card:hover .play { transform: translate(-50%, -50%) scale(1.06); }
  .vidwrap:hover img { transform: scale(1.02); }
  .vidwrap:hover .bigplay .circ { transform: scale(1.06); }
  .prow:hover .go { transform: translateX(4px); }
}