/* ===== Pencil fly-in on scroll (needs .is-inview on .block) ===== */

/* Base state: hidden before scroll */
.blocks__list .block-header img {
  opacity: 0;
  transition: transform 700ms ease, opacity 700ms ease;
  will-change: transform, opacity;
}

/* ---- Your existing hardcoded styles + START (off-screen) position ---- */

/* Blocks 1 & 3: pencil is on the right (order:2), rotated -180, fly IN from left */
.blocks__list #block-1 .block-header img,
.blocks__list #block-3 .block-header img {
  transform: translateX(80px) rotate(-180deg);
  width: 60%;
  order: 2;
  top: 15px;
}

/* Blocks 2 & 4: pencil is on the left (order:1), rotated 360, fly IN from right */
.blocks__list #block-2 .block-header img,
.blocks__list #block-4 .block-header img {
  transform: translateX(-80px) rotate(360deg);
  width: 60%;
  order: 1;
  top: 15px;
}

/* ---- When block is in view: show and move to final position ---- */

.blocks__list .block.is-inview .block-header img {
  opacity: 1;
}

/* Final transforms must keep the same rotation, but remove translateX */
.blocks__list .block.is-inview#block-1 .block-header img,
.blocks__list .block.is-inview#block-3 .block-header img {
  transform: translateX(0) rotate(-180deg);
}

.blocks__list .block.is-inview#block-2 .block-header img,
.blocks__list .block.is-inview#block-4 .block-header img {
  transform: translateX(0) rotate(360deg);
}

/* Accessibility: disable animation if user prefers reduced motion */
@media (prefers-reduced-motion: reduce) {
  .blocks__list .block-header img {
    transition: none;
    opacity: 1;
  }

  .blocks__list #block-1 .block-header img,
  .blocks__list #block-3 .block-header img,
  .blocks__list #block-2 .block-header img,
  .blocks__list #block-4 .block-header img,
  .blocks__list .block.is-inview#block-1 .block-header img,
  .blocks__list .block.is-inview#block-3 .block-header img,
  .blocks__list .block.is-inview#block-2 .block-header img,
  .blocks__list .block.is-inview#block-4 .block-header img {
    transform: rotate(0deg);
  }

  /* Если тебе важно сохранить исходные повороты даже при reduced motion — скажи, я поправлю */
}