/* ════════════════════════════════════════════════
   LYXAA · GLOBAL POLISH LAYER
   Additive enhancements — richer reveals, micro-interactions,
   depth & refined easing applied across every section.
   ════════════════════════════════════════════════ */

:root {
  --pz: cubic-bezier(.16, 1, .3, 1);          /* expo-out, Apple-grade */
  --pz-soft: cubic-bezier(.22, .61, .36, 1);
}

/* ── 1 · Richer base reveal (blur-in on top of existing rise) ── */
.rv { filter: blur(8px); transition: opacity 1.1s var(--pz), transform 1.1s var(--pz), filter 1.1s var(--pz); }
.rv.on { filter: blur(0); }
@media (prefers-reduced-motion: reduce) { .rv { filter: none; } }

/* directional reveal variants (opt-in) */
.rv--l { transform: translate3d(-46px, 0, 0); }
.rv--r { transform: translate3d(46px, 0, 0); }
.rv--scale { transform: scale(.92); }
.rv--l.on, .rv--r.on, .rv--scale.on { transform: none; }

/* auto-stagger any container marked data-stagger */
[data-stagger] > * { opacity: 0; transform: translate3d(0, 30px, 0); filter: blur(6px);
  transition: opacity .9s var(--pz), transform .9s var(--pz), filter .9s var(--pz); }
[data-stagger].on > * { opacity: 1; transform: none; filter: blur(0); }
[data-stagger].on > *:nth-child(1){transition-delay:.04s}
[data-stagger].on > *:nth-child(2){transition-delay:.10s}
[data-stagger].on > *:nth-child(3){transition-delay:.16s}
[data-stagger].on > *:nth-child(4){transition-delay:.22s}
[data-stagger].on > *:nth-child(5){transition-delay:.28s}
[data-stagger].on > *:nth-child(6){transition-delay:.34s}
[data-stagger].on > *:nth-child(7){transition-delay:.40s}
[data-stagger].on > *:nth-child(8){transition-delay:.46s}
@media (prefers-reduced-motion: reduce){ [data-stagger] > *{filter:none;transform:none} }

/* ── 2 · Scroll progress beam (top hairline) ── */
#px-progress { position: fixed; top: 0; left: 0; height: 2px; width: 0;
  background: linear-gradient(90deg, #0071e3, #2a8cf0 55%, #6ab1f7);
  box-shadow: 0 0 12px rgba(0,113,227,.6); z-index: 9999; pointer-events: none;
  transition: width .12s linear; }

/* ── 3 · Magnetic / lift micro-interactions ── */
[data-magnet] { will-change: transform; transition: transform .35s var(--pz); }

/* universal premium hover-lift for cards (only where not already handled) */
.px-lift { transition: transform .5s var(--pz), box-shadow .5s var(--pz); will-change: transform; }
.px-lift:hover { transform: translateY(-6px); }

/* 3D tilt receivers — JS sets --rx/--ry */
[data-tilt] { transform-style: preserve-3d; transition: transform .4s var(--pz); }
[data-tilt].px-tilting { transition: transform .08s linear; }

/* sheen sweep on hover for tagged cards */
.px-sheen { position: relative; overflow: hidden; }
.px-sheen::after { content: ''; position: absolute; top: 0; left: -120%; width: 70%; height: 100%;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,.45), transparent);
  transform: skewX(-18deg); pointer-events: none; opacity: 0; transition: none; }
.px-sheen:hover::after { animation: pxSheen 1s var(--pz); }
@keyframes pxSheen { 0%{left:-120%;opacity:0} 12%{opacity:1} 100%{left:140%;opacity:0} }

/* ── 4 · Link underline sweep for nav + text links ── */
.nav-links a, .px-link { position: relative; }
.nav-links a::after, .px-link::after { content: ''; position: absolute; left: 0; bottom: -3px;
  width: 100%; height: 1.5px; background: currentColor; transform: scaleX(0); transform-origin: right;
  transition: transform .4s var(--pz); opacity: .8; }
.nav-links a:hover::after, .px-link:hover::after { transform: scaleX(1); transform-origin: left; }

/* ── 5 · Button press feedback (global) ── */
button, .btn-blue, [role="button"], a.book, .book { transition: transform .2s var(--pz), box-shadow .3s var(--pz), filter .3s var(--pz); }
button:active, .btn-blue:active, .book:active { transform: translateY(1px) scale(.985); }

/* ── 6 · Section heading entrance refinement (only headings tagged px-head) ── */
.px-head { opacity: 0; transform: translate3d(0, 26px, 0); filter: blur(6px);
  transition: opacity 1s var(--pz), transform 1s var(--pz), filter 1s var(--pz); }
.px-head.on { opacity: 1; transform: none; filter: blur(0); }
@media (prefers-reduced-motion: reduce){ .px-head{filter:none;transform:none} }

/* ── 7 · Image depth-parallax wrapper ── */
[data-parallax] { will-change: transform; }

/* ── 8 · Smooth-scroll quality on the document ── */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
