/* Shared by /, /desktop/, /mobile/ — two-tier nav, menu overlay, back-to-top button.
   Tier 1 (.nav) moves between pages and is the same everywhere; tier 2 (.subnav) jumps
   between sections of the current page and appears once the hero is scrolled past. */

/* ---------- Tier 1: pages ---------- */
.nav{position:fixed;top:24px;left:50%;transform:translateX(-50%);z-index:50;display:flex;align-items:center;gap:8px;height:56px;padding:8px 8px 8px 24px;border-radius:999px;background:rgba(255,255,255,.76);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);border:1px solid rgba(26,26,26,.06);box-shadow:0 8px 32px rgba(26,26,26,.08);width:max-content;max-width:calc(100% - 32px);transition:transform .7s cubic-bezier(.32,.72,0,1),box-shadow .7s cubic-bezier(.32,.72,0,1)}
.nav-hidden .nav{transform:translate(-50%,-220%);box-shadow:none}
.nav .logo{flex:none}
.nav .logo img{height:14px;width:auto}
.nav-pages{display:flex;gap:4px;margin-left:24px}
.nav-pages a{padding:8px 14px;border-radius:999px;font-size:14px;line-height:20px;font-weight:600;color:#666;transition:color .5s cubic-bezier(.32,.72,0,1),background-color .5s cubic-bezier(.32,.72,0,1)}
.nav-pages a:hover{color:#1A1A1A;background:rgba(26,26,26,.04)}
.nav-pages a[aria-current="page"]{color:#1A1A1A;background:rgba(26,26,26,.06)}
.nav-here{display:none;margin-left:12px;padding:4px 10px;border-radius:999px;background:rgba(26,26,26,.06);font-size:12px;line-height:16px;font-weight:700;color:#1A1A1A;white-space:nowrap}
.nav-login{margin-left:8px;padding:8px 12px;border-radius:999px;font-size:14px;line-height:20px;font-weight:600;color:#1A1A1A;white-space:nowrap;transition:background-color .5s cubic-bezier(.32,.72,0,1)}
.nav-login:hover{background:rgba(26,26,26,.04)}
.nav-cta{padding:8px 16px;border-radius:999px;background:#1A1A1A;color:#fff;font-size:14px;line-height:20px;font-weight:600;white-space:nowrap;transition:background-color .5s cubic-bezier(.32,.72,0,1),transform .5s cubic-bezier(.32,.72,0,1)}
.nav-cta:hover{background:#0075F8}
.nav-cta:active{transform:scale(.98)}
.burger{display:none;position:relative;flex:none;width:40px;height:40px;border-radius:50%;margin-left:auto}
.burger i{position:absolute;left:12px;width:16px;height:2px;border-radius:2px;background:#1A1A1A;transition:transform .7s cubic-bezier(.32,.72,0,1),top .7s cubic-bezier(.32,.72,0,1)}
.burger i:first-child{top:15px}.burger i:last-child{top:23px}
.menu-open .burger i:first-child{top:19px;transform:rotate(45deg)}
.menu-open .burger i:last-child{top:19px;transform:rotate(-45deg)}

/* ---------- Tier 2: sections of this page ---------- */
.subnav{position:fixed;top:88px;left:50%;z-index:49;display:flex;align-items:center;gap:4px;padding:4px;border-radius:999px;background:rgba(255,255,255,.82);backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);border:1px solid rgba(26,26,26,.06);box-shadow:0 8px 32px rgba(26,26,26,.08);width:max-content;max-width:calc(100% - 32px);opacity:0;pointer-events:none;transform:translate(-50%,-12px);transition:transform .7s cubic-bezier(.32,.72,0,1),opacity .5s cubic-bezier(.32,.72,0,1)}
.sub-on .subnav{opacity:1;pointer-events:auto;transform:translate(-50%,0)}
.sub-on.nav-hidden .subnav{transform:translate(-50%,-64px)}
.menu-open .subnav{opacity:0;pointer-events:none}
.subnav-page{flex:none;padding:6px 12px 6px 14px;font-size:13px;line-height:20px;font-weight:800;color:#1A1A1A;border-right:1px solid rgba(26,26,26,.1);margin-right:4px;white-space:nowrap}
.subnav-links{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.subnav-links::-webkit-scrollbar{display:none}
.subnav-links a{flex:none;padding:6px 12px;border-radius:999px;font-size:13px;line-height:20px;font-weight:600;color:#666;white-space:nowrap;transition:color .5s cubic-bezier(.32,.72,0,1),background-color .5s cubic-bezier(.32,.72,0,1)}
.subnav-links a:hover{color:#1A1A1A;background:rgba(26,26,26,.04)}
.subnav-links a.active{color:#0053A8;background:#EAF3FE}

/* ---------- Menu overlay (narrow screens) ---------- */
.overlay{position:fixed;inset:0;z-index:40;background:rgba(255,255,255,.86);backdrop-filter:blur(64px);-webkit-backdrop-filter:blur(64px);display:flex;flex-direction:column;justify-content:center;justify-content:safe center;gap:32px;padding:104px 32px 40px;overflow-y:auto;opacity:0;pointer-events:none;transition:opacity .7s cubic-bezier(.32,.72,0,1)}
.menu-open .overlay{opacity:1;pointer-events:auto}
.ov-group{display:flex;flex-direction:column;align-items:flex-start;transform:translateY(32px);opacity:0;transition:transform .7s cubic-bezier(.32,.72,0,1),opacity .7s cubic-bezier(.32,.72,0,1)}
.ov-group:nth-child(2){transition-delay:.06s}.ov-group:nth-child(3){transition-delay:.12s}
.menu-open .ov-group{transform:none;opacity:1}
.ov-group small{margin-bottom:8px;font-size:12px;line-height:16px;font-weight:700;color:#999}
.ov-group a{padding:6px 0;font-size:24px;line-height:34px;font-weight:800;color:#1A1A1A}
.ov-group a[aria-current="page"]{color:#0075F8}
.ov-sub a{font-size:18px;line-height:28px;font-weight:700;color:#4D4D4D}
.ov-foot{flex-direction:row;flex-wrap:wrap;gap:8px}
.ov-foot a{padding:12px 20px;border-radius:16px;font-size:16px;line-height:24px;font-weight:700;background:#F2F2F2}
.ov-foot a.go{background:#1A1A1A;color:#fff}

/* ---------- Back to top ---------- */
.to-top{position:fixed;right:24px;bottom:24px;z-index:30;width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#1A1A1A;border:1px solid rgba(26,26,26,.08);box-shadow:0 8px 24px rgba(26,26,26,.14);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .5s cubic-bezier(.32,.72,0,1),transform .5s cubic-bezier(.32,.72,0,1),background-color .3s,color .3s}
.to-top svg{width:20px;height:20px}
.top-on .to-top{opacity:1;transform:none;pointer-events:auto}
.top-on .to-top:hover,.top-on .to-top:focus-visible{background:#1A1A1A;color:#fff;transform:translateY(-4px)}
.menu-open .to-top{opacity:0;pointer-events:none}

@media (max-width:760px){
  .nav{width:calc(100% - 32px);padding-left:20px}
  .nav-pages,.nav-login,.nav-cta{display:none}
  .nav-here{display:inline-block}
  .burger{display:block}
  .subnav{left:16px;right:16px;width:auto;max-width:none;transform:translateY(-12px)}
  .sub-on .subnav{transform:none}
  .sub-on.nav-hidden .subnav{transform:translateY(-64px)}
  .subnav-page{display:none}
  .to-top{right:16px;bottom:16px;width:44px;height:44px}
}
@media (max-width:420px){
  .nav{top:16px}
  .subnav{top:80px}
}

/* Keeps the last words of a heading or paragraph on one line (no orphaned word). */
.nw{white-space:nowrap}