/* Premium-motion v3 shared shell polish. */
:root{
  --na-shell-deep:#053B22;
  --na-shell-green:#1E613A;
  --na-shell-cream:#F9ECC7;
  --na-shell-gold:#D8B233;
  --na-shell-display:var(--font-display,Anton,Impact,"Arial Narrow",sans-serif);
  --na-shell-body:var(--font-body,Archivo,Arial,Helvetica,sans-serif);
}

.topbar .nav,
.topbar .nb,
.topbar .disclosure-panel{
  font-family:var(--na-shell-display);
}

.topbar .involve-menu{position:relative;isolation:isolate}
.topbar .involve-toggle{
  position:relative;
  isolation:isolate;
  min-width:clamp(168px,17vw,312px);
  height:clamp(46px,5.2vw,64px);
  padding:0 clamp(20px,2.7vw,38px);
  overflow:hidden;
  border:2px solid rgba(249,236,199,.38);
  border-radius:999px;
  background:
    radial-gradient(circle at 26% 4%,rgba(249,236,199,.19),transparent 42%),
    linear-gradient(180deg,rgba(249,236,199,.17),rgba(249,236,199,.075));
  color:var(--na-shell-cream);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.23),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 14px 34px rgba(0,24,13,.19);
  backdrop-filter:blur(18px) saturate(1.16);
  -webkit-backdrop-filter:blur(18px) saturate(1.16);
  font-family:var(--na-shell-display);
  font-size:clamp(14px,1.65vw,25px);
  font-style:normal;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
  cursor:pointer;
  transform:translateZ(0);
  transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.topbar .involve-toggle::before{
  content:"";
  position:absolute;
  inset:2px;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(105deg,rgba(255,255,255,.08),transparent 48%,rgba(249,236,199,.06));
  pointer-events:none;
}
.topbar .involve-toggle::after{
  content:"";
  position:absolute;
  top:-80%;
  left:-24%;
  width:24%;
  height:250%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.19),transparent);
  transform:rotate(17deg);
  transition:left .55s ease;
  pointer-events:none;
}
.topbar .involve-toggle:hover,
.topbar .involve-toggle:focus-visible,
.topbar .involve-menu.is-open .involve-toggle{
  border-color:rgba(249,236,199,.66);
  background:
    radial-gradient(circle at 26% 4%,rgba(249,236,199,.24),transparent 43%),
    linear-gradient(180deg,rgba(249,236,199,.21),rgba(249,236,199,.1));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.31),
    inset 0 -1px 0 rgba(0,0,0,.15),
    0 18px 42px rgba(0,24,13,.26),
    0 0 0 1px rgba(216,178,51,.08);
  transform:translateY(-2px);
}
.topbar .involve-toggle:hover::after,
.topbar .involve-toggle:focus-visible::after{left:118%}
.topbar .involve-toggle:focus-visible{outline:3px solid var(--na-shell-gold);outline-offset:4px}
.topbar .involve-toggle-arrow{
  margin-left:clamp(1px,.4vw,6px);
  color:var(--na-shell-cream);
  font-family:var(--na-shell-body);
  font-size:.68em;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.2));
}
.topbar:not(.on-dark) .involve-toggle{
  border-color:rgba(5,59,34,.42);
  background:
    radial-gradient(circle at 26% 4%,rgba(255,255,255,.68),transparent 43%),
    linear-gradient(180deg,rgba(30,97,58,.22),rgba(5,59,34,.08));
  color:var(--na-shell-deep);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -1px 0 rgba(5,59,34,.13),0 14px 34px rgba(5,59,34,.13);
}
.topbar:not(.on-dark) .involve-toggle-arrow{color:var(--na-shell-deep)}

.topbar .involve-dropdown{
  top:calc(100% + 12px);
  min-width:min(310px,88vw);
  padding:9px;
  border:1px solid rgba(249,236,199,.25);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(3,32,19,.94),rgba(8,72,43,.88));
  color:var(--na-shell-cream);
  box-shadow:inset 0 1px 0 rgba(249,236,199,.11),0 28px 78px rgba(0,0,0,.34);
  backdrop-filter:blur(22px) saturate(1.1);
  -webkit-backdrop-filter:blur(22px) saturate(1.1);
}
.topbar .involve-dropdown a{
  border-radius:11px;
  font-family:var(--na-shell-body);
  font-size:11px;
  font-weight:900;
  letter-spacing:.1em;
}
.topbar .involve-dropdown a:hover,
.topbar .involve-dropdown a:focus-visible{
  background:rgba(249,236,199,.12);
  color:var(--na-shell-cream);
  outline:none;
}

@media(max-width:820px){
  .topbar .involve-toggle{
    min-width:132px;
    height:42px;
    padding:0 13px;
    font-size:11px;
    letter-spacing:.08em;
  }
}
@media(max-width:420px){
  .topbar .involve-toggle{min-width:112px;padding:0 9px;font-size:9px}
}
@media(prefers-reduced-motion:reduce){
  .topbar .involve-toggle,.topbar .involve-toggle::after{transition:none}
  .topbar .involve-toggle:hover,.topbar .involve-toggle:focus-visible{transform:none}
}
