/* ==========================================================================
   Page transition wipe shared by every public page (js/modules/flourish.js).
   Loaded after chrome.css. Everything here is off for reduced motion.
   ========================================================================== */

/* ---------- page transition ----------
   Out: a charcoal panel with a brass leading edge slides in from the left (300ms),
   then the next page starts covered (js/head.js adds .pt-in) and the panel slides off. */
html.pt-out::after,html.pt-in::after{content:"";position:fixed;inset:0;z-index:2147483000;pointer-events:none;will-change:transform}
html.pt-out::after{background:linear-gradient(to left,var(--accent,#D4A373) 0 2px,#16171A 2px);animation:pt-out .3s cubic-bezier(.65,0,.35,1) both}
html.pt-in::after{background:linear-gradient(to right,var(--accent,#D4A373) 0 2px,#16171A 2px);animation:pt-in .5s cubic-bezier(.16,1,.3,1) .04s both}
@keyframes pt-out{from{transform:translateX(-100%)}to{transform:translateX(0)}}
@keyframes pt-in{from{transform:translateX(0)}to{transform:translateX(101%)}}

@media (prefers-reduced-motion: reduce){
  html.pt-out::after,html.pt-in::after{display:none}
}
