/* smooth_pass:begin (5 Nov, smoothness overhaul) */
/* reveals are shorter, and the words never wait: the whole reveal is about 0.4 s (was 0.5 s plus up to 0.9 s of waiting) */
:root{--ml-t-reveal:380ms}
html.fl-js [data-fl]{transition-duration:.38s,.42s}

/* content is visible when the page cannot animate (smooth.js adds reveal-safe on a hidden or stalled tab) */
html.reveal-safe .mo,html.reveal-safe .mo-atom,html.reveal-safe [data-fl],html.reveal-safe .fl-out,
html.reveal-safe.ia-boot main,html.reveal-safe.ia-boot main > :not(.hero):not(.page-head),
html.reveal-safe.ia-boot :is(.hero,.page-head) .wrap > *,html.reveal-safe.ia-boot :is(.hero,.page-head) .copy > *{opacity:1!important;transform:none!important;transition:none!important}

/* reduced motion on a wide screen: the page is held until fit.js has fitted it, so nothing shifts after the first paint.
   If fit.js never runs, it shows itself after 1.4 s */
@media (prefers-reduced-motion:reduce) and (min-width:900px) and (min-height:560px) and (orientation:landscape){
  html:not(.fitted) main.fit{opacity:0;animation:smShow 0s linear 1.4s forwards}
}
@keyframes smShow{to{opacity:1}}
/* a tablet in landscape: the deck shows the hero at once, and fit.js then fits it (a shift of the whole hero). The hero is
   held with the rest until the page is released (ia-boot has its own timeout, so it never stays hidden) */
@media (min-width:900px) and (min-height:560px) and (orientation:landscape) and (prefers-reduced-motion:no-preference){
  html.ia-boot.deck main.fit > :is(.hero,.page-head){opacity:0}
}

/* lite mode (two cores or fewer): an opaque header, so words never ghost behind the nav */
html.ia-motion-lite header.site{background:#fff}

/* the iPad Pro in portrait (834 px) is too narrow for the desktop nav (it needs about 890 px): it gets the compact header
   up to 960 px, the same rules the phone gets at 820 px and under */
@media (min-width:821px) and (max-width:960px){
  nav.main{position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--rule-2);flex-direction:column;align-items:stretch;gap:0;padding:8px 0;display:none;box-shadow:0 18px 40px rgba(10,16,19,.10)}
  nav.main a{padding:14px 22px}
  nav.main .btn{margin:10px 22px;justify-content:center}
  label.navtoggle{display:inline-flex;margin-left:auto;background:none;border:1px solid var(--rule);border-radius:var(--r-sm);width:44px;height:40px;align-items:center;justify-content:center;cursor:pointer}
  .navtoggle span,.navtoggle span::before,.navtoggle span::after{content:"";display:block;width:20px;height:2px;background:var(--ink-hi);position:relative}
  .navtoggle span::before{position:absolute;top:-6px}
  .navtoggle span::after{position:absolute;top:6px}
  #nav:checked ~ nav.main{display:flex}
  nav.main a.nav-login{display:flex;justify-content:center;margin:0 22px 14px;padding:13px 18px;border:1.5px solid var(--blue);border-radius:12px;font-weight:700;color:var(--blue)}
  html.is-signed-in nav.main a.nav-login{display:none}
  nav.main .dd{display:flex;flex-wrap:wrap;align-items:stretch;gap:0}
  nav.main .dd>a:first-child{flex:1 1 auto}
  nav.main .dd-b{width:52px;height:auto;min-height:48px;border-radius:0}
  nav.main .dd-m{position:static;width:100%;min-width:0;margin:0;padding:2px 0 8px;border:0;border-radius:0;box-shadow:none;background:#f4f8fb}
  nav.main .dd-m::before{display:none}
  nav.main .dd-m a:not(.btn){min-height:46px;padding:11px 38px;border-radius:0}
  nav.main .dd-r .dd-m{right:auto}
}
/* smooth_pass:end */
