/* Animate each visible page layer so fixed backgrounds and content reveal together. */
@keyframes roji-page-focus{
  0%{opacity:0;filter:blur(12px)}
  35%{filter:blur(7px)}
  100%{filter:blur(0)}
}
@media(prefers-reduced-motion:no-preference){
  body{animation:none}
  body>header,body>main,body>footer,body>video,body>.page-background-video,
  body>.studio-background,body>.roji-search-embed,body>h1,body>p,body>ul,
  body::before,body::after{
    animation:roji-page-focus 1400ms cubic-bezier(.22,.61,.36,1) backwards;
  }
}
@media(prefers-reduced-motion:reduce){body,body>header,body>main,body>footer,body>video,body>.page-background-video,body>.studio-background,body>.roji-search-embed,body>h1,body>p,body>ul,body::before,body::after{animation:none}}
@media print{body,body>header,body>main,body>footer,body>video,body>.studio-background,body::before,body::after{animation:none!important}}
/* Keep navigation outside the page reveal so backdrop blur paints immediately. */
body>.site-header,body.home-page>main,body.home-page main>.site-header{animation:none!important;filter:none}
@media(prefers-reduced-motion:no-preference){body.home-page>main>:not(.site-header){animation:roji-page-focus 1400ms cubic-bezier(.22,.61,.36,1) backwards}}