[data-template-motion]{
  --motion-fast:140ms;
  --motion-base:220ms;
  --motion-reveal:600ms;
  --motion-slow:900ms;
  --motion-ease:cubic-bezier(0.22,1,0.36,1);
}
/* Pre-paint guard: hide reveal content before the runtime tags it, so there is
   no shown -> hidden flash. The runtime removes [data-motion-arm] once it takes
   per-element control (and immediately under reduced motion). */
[data-template-motion][data-motion-arm] :is(h1,h2,h3,p,blockquote,article,figure,img,ul,ol):not(nav *):not([data-parallax]){
  opacity:0;
}
[data-template-motion][data-motion-active] [data-reveal][data-motion-ready="out"]{
  opacity:0;
  will-change:transform,opacity;
}
[data-template-motion] [data-reveal="up"][data-motion-ready="out"]{transform:translate3d(0,26px,0);}
[data-template-motion] [data-reveal="left"][data-motion-ready="out"]{transform:translate3d(28px,0,0);}
[data-template-motion] [data-reveal="right"][data-motion-ready="out"]{transform:translate3d(-28px,0,0);}
[data-template-motion] [data-reveal="scale"][data-motion-ready="out"]{transform:scale(0.94);}
[data-template-motion] [data-reveal][data-motion-ready="in"]{
  opacity:1;
  transform:none;
  transition:opacity var(--motion-reveal) var(--motion-ease),
             transform var(--motion-reveal) var(--motion-ease);
  transition-delay:calc(var(--motion-index,0) * var(--motion-step,80ms));
}
[data-template-motion][data-motion-intensity="expressive"]{--motion-step:90ms;}
[data-template-motion][data-motion-intensity="restrained"]{--motion-step:60ms;}
[data-template-motion] [data-parallax]{will-change:transform;}
[data-template-motion] details[open] > :not(summary){
  animation:motion-faq var(--motion-base) var(--motion-ease);
}
@keyframes motion-faq{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
@media (hover:hover) and (pointer:fine){
  [data-template-motion] a[href],[data-template-motion] button{
    transition:transform var(--motion-fast) var(--motion-ease),
               opacity var(--motion-fast) var(--motion-ease),
               box-shadow var(--motion-fast) var(--motion-ease),
               background-color var(--motion-fast) var(--motion-ease),
               color var(--motion-fast) var(--motion-ease),
               border-color var(--motion-fast) var(--motion-ease);
  }
}
[data-template-motion] a[href]:not(nav a):active,
[data-template-motion] button:active{transform:scale(0.97);}
@media (prefers-reduced-motion: reduce){
  [data-template-motion][data-motion-arm] :is(h1,h2,h3,p,blockquote,article,figure,img,ul,ol){opacity:1 !important;}
  [data-template-motion] [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important;}
  [data-template-motion] [data-parallax]{transform:none !important;}
  [data-template-motion] details[open] > :not(summary){animation:none !important;}
  [data-template-motion] a[href]:active,[data-template-motion] button:active{transform:none !important;}
}