/* Shared on every page: page-transition curtain, nav state, press feedback, text wrapping. */

p,li,figcaption{text-wrap:pretty;}
h1,h2,h3{text-wrap:balance;}

.btn,.pill,.callbar a,.lang-toggle button{-webkit-tap-highlight-color:transparent;}
.btn:active,.pill:active,.callbar a:active{transform:scale(.97);transition-duration:.08s;}

/* Nav: transparent at the top, hairline once scrolled */
.nav{transition:border-color .3s,background-color .3s;}
.nav:not(.scrolled){border-bottom-color:transparent;background-color:rgba(14,17,20,.35);}

/* Page-transition curtain */
.curtain{position:fixed;inset:0;z-index:100;pointer-events:none;visibility:hidden;}
.curtain::before,.curtain span{content:"";position:absolute;inset:0;transform:translateY(100%);}
.curtain::before{background:#E8A93B;}
.curtain span{background:#0E1114;}
.curtain.cover{visibility:visible;pointer-events:auto;}
.curtain.cover::before{animation:cur-in .55s cubic-bezier(.7,0,.2,1) forwards;}
.curtain.cover span{animation:cur-in .55s cubic-bezier(.7,0,.2,1) .08s forwards;}
.curtain.cover.reveal::before{animation:cur-out .55s cubic-bezier(.7,0,.2,1) .08s forwards;}
.curtain.cover.reveal span{animation:cur-out .55s cubic-bezier(.7,0,.2,1) forwards;}
@keyframes cur-in{from{transform:translateY(100%);}to{transform:translateY(0);}}
@keyframes cur-out{from{transform:translateY(0);}to{transform:translateY(-100%);}}

/* Anchored sections clear the fixed nav */
section[id],article[id]{scroll-margin-top:72px;}

@media (prefers-reduced-motion:reduce){
  .curtain{display:none;}
  .nav{transition:none;}
}