@layer utilities {
  /* Gizleme yalnizca JS tarafindan eklenen .js-reveal sinifiyla devreye girer;
     JS kapaliyken hicbir icerik maskelenmez. */
  [data-reveal].js-reveal > * {
    clip-path: inset(0 0 105% 0);
    transition: clip-path 640ms cubic-bezier(0.16, 1, 0.3, 1);
    transition-delay: calc(var(--reveal-i, 0) * 90ms);
  }

  [data-reveal].js-reveal.is-revealed > * {
    clip-path: inset(0 0 0 0);
  }

  [data-reveal].js-reveal--self {
    clip-path: inset(0 0 105% 0);
    transition: clip-path 640ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  [data-reveal].js-reveal--self.is-revealed {
    clip-path: inset(0 0 0 0);
  }

  @media (prefers-reduced-motion: reduce) {
    [data-reveal].js-reveal > *,
    [data-reveal].js-reveal--self {
      clip-path: none;
      transition: none;
      transition-delay: 0s;
    }
  }
}