/* Page transitions and entrance reveals, shared by every public page (assets/motion.js).
   Browsers with cross-document view transitions fade the old page out and the new one in by themselves;
   others get the same fade from motion.js. Reduced motion: an almost instant change, no reveals. */
@view-transition{navigation:auto}
::view-transition-old(root){animation:dtd-vt-out .42s ease both}
::view-transition-new(root){animation:dtd-vt-in .6s ease .08s both}
@keyframes dtd-vt-out{to{opacity:0}}
@keyframes dtd-vt-in{from{opacity:0}}
html.vt-fallback body{animation:dtd-vt-in .55s ease both}
html.vt-leaving body{opacity:0;transition:opacity .34s ease}

/* entrance reveals: transform and opacity only */
.rv{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,.7,.1,1);transition-delay:calc(var(--rv,0) * 70ms)}
.rv.rv-l{transform:translateX(-26px)}.rv.rv-r{transform:translateX(26px)}.rv.rv-s{transform:scale(.94)}
.rv.in{opacity:1;transform:none}

/* hover micro-interactions */
.btn,.swp-btn,.nav-cta{transition:background .3s,color .3s,transform .35s cubic-bezier(.2,.7,.1,1),box-shadow .35s}
.btn:hover,.swp-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(10,36,64,.18)}
.btn:active,.swp-btn:active{transform:translateY(0) scale(.98)}
.card .icon{transition:transform .6s cubic-bezier(.2,.7,.1,1)}
a.card:hover .icon{transform:scale(1.06) rotate(-2deg)}
.does li{transition:padding-left .4s cubic-bezier(.2,.7,.1,1)}
.does li:hover{padding-left:6px}
.glyph svg{transition:transform 1.2s cubic-bezier(.2,.7,.1,1)}
.sw-art:hover .glyph svg{transform:scale(1.05) rotate(-2deg)}

@media (prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root){animation-duration:.01s;animation-delay:0s}
  html.vt-fallback body{animation:none}
  html.vt-leaving body{transition:none}
  .rv,.rv.rv-l,.rv.rv-r,.rv.rv-s{opacity:1;transform:none;transition:none}
}
