/* tastemaker · existing LexLab Long-Scroll Narrative / institutional editorial
 * N2 / H3 / Ft3 preserved; source palette/contrast unchanged; intro-only extension.
 * critique: ShowTell 4 · Phil 5 · Hier 5 · Spec 5 · Restr 5 · Var 4
 * User reference: animacje-intro.md. Marketing entrances, not UI-state transitions. */

:root {
  --duration-intro: 600ms;
}

/* Visible HTML is the default: no JS, blocked controller and editor stay readable. */
@media (prefers-reduced-motion: no-preference) {
  .intro-enabled [data-intro]:not(.is-animated) {
    opacity: 0;
  }

  .intro-enabled .fade-up[data-intro]:not(.is-animated) {
    transform: translateY(32px);
  }

  .intro-enabled .fade-left[data-intro]:not(.is-animated) {
    transform: translateX(-40px);
  }

  .intro-enabled .fade-right[data-intro]:not(.is-animated) {
    transform: translateX(40px);
  }

  .intro-enabled [data-intro].is-entering {
    transition: opacity var(--duration-intro) var(--ease-out), transform var(--duration-intro) var(--ease-out);
    transition-delay: var(--anim-delay, 0ms);
    will-change: opacity, transform;
  }

  /* Swiper owns its slide transforms; intro only fades these cards. */
  .intro-enabled .fade-in[data-intro].is-entering {
    transition-property: opacity;
    will-change: opacity;
  }

  .intro-enabled :is(.fade-up, .fade-left, .fade-right)[data-intro].is-entering.is-animated {
    transform: translate(0, 0);
  }

  /* Exceptionally tall units (e.g. one long list) never move the reading surface. */
  .intro-enabled [data-intro].intro-is-tall:not(.is-animated) {
    transform: none;
  }

  @media (max-width: 1279px) {
    .intro-enabled :is(.fade-up, .fade-left, .fade-right)[data-intro]:not(.is-animated):not(.intro-is-tall) {
      transform: translateY(24px);
    }

    /* The fixed-height hero has a real text scroller on short screens. Enter
     * from its existing top padding: a positive Y offset would extend the
     * scrollable bottom edge and flash a scrollbar until the text settles.
     * Keep overflow-y:auto so long copy / enlarged text remains reachable. */
    .intro-enabled .hero-slider .hero__inner :is(.fade-up, .fade-left, .fade-right)[data-intro]:not(.is-animated):not(.intro-is-tall) {
      transform: translateY(-24px);
    }
  }
}

/* Keyboard access / find-in-page / printing must not wait for a reveal. */
.intro-enabled [data-intro]:focus-visible,
.intro-enabled [data-intro]:has(:focus-visible),
.intro-enabled [data-intro]:target,
.intro-enabled [data-intro].intro-instant {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

@media (prefers-reduced-motion: reduce), print {
  [data-intro] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto !important;
  }
}