/* motion.css — shared motion layer for inner pages (matches the homepage) */
nav{transition:background .3s,transform .45s cubic-bezier(.2,.8,.2,1)}
nav.nav-hide{transform:translateY(-100%)}
/* staged page titles */
.mo-title .w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .05em .12em 0}
.mo-title .w>span{display:inline-block;transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.mo-pre .mo-title .w>span{transform:translateY(112%)}
.mo-fade{transition:opacity 1.1s .6s}
.mo-pre .mo-fade{opacity:0}
/* about: portrait slowly pushes in each time it changes */
.about-portrait img.active{animation:moKB 12s ease-out forwards}
@keyframes moKB{from{transform:scale(1)}to{transform:scale(1.09)}}
/* cards and links */
.blog-card{transition:border-color .25s,transform .5s cubic-bezier(.2,.8,.2,1)}
.blog-card:hover{transform:translateY(-4px)}
.blog-card.pop{animation:moPop .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d,0ms)}
@keyframes moPop{from{opacity:0;transform:translateY(22px) scale(.97)}to{opacity:1;transform:none}}
.contact-links a:hover{transform:translateX(6px)}
.post-body img{transition:transform .9s cubic-bezier(.2,.8,.2,1)}
/* reading progress on long pages */
.mo-progress{position:fixed;top:0;left:0;height:2px;width:100%;z-index:150;background:var(--accent);transform:scaleX(0);transform-origin:left;pointer-events:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .mo-pre .mo-title .w>span{transform:none}.mo-pre .mo-fade{opacity:1}
}

/* h1 on pages whose main heading was an h2: same look as before */
section h1{font-family:'Outfit',sans-serif;font-size:clamp(1.75rem,3.2vw,2.5rem);font-weight:300;letter-spacing:-.02em;line-height:1.2;color:var(--text-primary);margin:0 0 1.5rem}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* keep the wordmark clear of the first nav link */
nav .logo{margin-right:2.25rem}