    /* --- Reveal animation --- */
    .reveal {
        opacity: 0;
        transform: translate3d(0, 16px, 0);
        transition:
          opacity .6s ease,
          transform .6s cubic-bezier(.2,.65,.3,1);
        will-change: opacity, transform;
      }
      .reveal[data-dir="left"]  { transform: translate3d(-28px, 0, 0); }
      .reveal[data-dir="right"] { transform: translate3d( 28px, 0, 0); }
      .reveal[data-dir="up"]    { transform: translate3d( 0, 28px, 0); }
      .reveal[data-dir="down"]  { transform: translate3d( 0,-28px, 0); }
  
      .reveal.in-view {
        opacity: 1;
        transform: translate3d(0,0,0);
      }
  
      /* per-element delay via CSS var */
      .reveal[data-delay] { transition-delay: var(--reveal-delay, 0ms); }