/* PixelKompass revision 36 – motion + news alignment */
.page-news-article .news-tracklist30{grid-auto-rows:1fr}
.page-news-article .news-tracklist30 li,
.page-news-article .news-tracklist30 li+li{
  margin-top:0!important;
  min-height:190px!important;
  height:100%;
  box-sizing:border-box;
  align-content:start;
}
.page-news-article .news-tracklist30 .track-detail33{min-height:3.35em}

/* Global scroll motion. JS adds this only to content elements, never navigation. */
.motion36{
  opacity:0;
  transform:translate3d(0,22px,0) scale(.992);
  transition:
    opacity .74s ease var(--motion-delay36,0ms),
    transform .82s cubic-bezier(.2,.72,.2,1) var(--motion-delay36,0ms);
  will-change:opacity,transform;
}
.motion36.motion-left36{transform:translate3d(-22px,0,0)}
.motion36.motion-right36{transform:translate3d(22px,0,0)}
.motion36.is-visible36{opacity:1;transform:none}

/* Slightly more life on cards and editorial imagery without making the UI jumpy. */
.tier-card,.quick-card,.overview-grid11>article,.equipment-links>a,
.news-stat30,.news-tracklist30>li,.choices09>article,.notes09>ol>li,
.reading-list>a,.preset-card21,.bundle-card,.comparison-card{
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background-color .24s ease;
}
@media (hover:hover){
  .tier-card:hover,.quick-card:hover,.overview-grid11>article:hover,.equipment-links>a:hover,
  .news-stat30:hover,.news-tracklist30>li:hover,.choices09>article:hover,.notes09>ol>li:hover,
  .reading-list>a:hover,.preset-card21:hover,.bundle-card:hover,.comparison-card:hover{
    transform:translateY(-4px);
    border-color:rgba(222,181,96,.46);
    box-shadow:0 16px 34px rgba(0,0,0,.18);
  }
  .photo09 img,.inline-panorama img,.news-gallery34 img,.image-editorial img,.photo-intro .intro-image{
    transition:transform .7s cubic-bezier(.2,.72,.2,1),filter .35s ease;
  }
  .photo09:hover img,.inline-panorama:hover img,.news-gallery34 figure:hover img,.image-editorial:hover img,.photo-intro:hover .intro-image{
    transform:scale(1.012);
  }
}

/* News page receives slightly stronger staged movement. */
.page-news-article .news-hero30 .motion36{transform:translate3d(0,18px,0)}
.page-news-article .news-tracklist30>li.motion36:nth-child(3n+1){transform:translate3d(-18px,16px,0)}
.page-news-article .news-tracklist30>li.motion36:nth-child(3n){transform:translate3d(18px,16px,0)}
.page-news-article .news-tracklist30>li.motion36.is-visible36{transform:none}
.page-news-article .news-stat30 strong{font-variant-numeric:tabular-nums}

@media(max-width:720px){
  .page-news-article .news-tracklist30 li,
  .page-news-article .news-tracklist30 li+li{min-height:0!important;height:auto}
  .page-news-article .news-tracklist30 .track-detail33{min-height:0}
  .motion36,.motion36.motion-left36,.motion36.motion-right36,
  .page-news-article .news-tracklist30>li.motion36:nth-child(3n+1),
  .page-news-article .news-tracklist30>li.motion36:nth-child(3n){transform:translate3d(0,16px,0)}
  .motion36.is-visible36,.page-news-article .news-tracklist30>li.motion36.is-visible36{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .motion36,.motion36.motion-left36,.motion36.motion-right36{
    opacity:1!important;transform:none!important;transition:none!important;will-change:auto!important
  }
  .tier-card,.quick-card,.overview-grid11>article,.equipment-links>a,.news-stat30,.news-tracklist30>li,
  .photo09 img,.inline-panorama img,.news-gallery34 img,.image-editorial img,.photo-intro .intro-image{
    transition:none!important;transform:none!important
  }
}
