/* Keep above-the-fold type still at first paint. Moving headings and copy on
   load looks like a late font swap on narrow screens, even without metric CLS. */
@media (prefers-reduced-motion: no-preference) {
  @keyframes editorial-photo-arrive {
    from { opacity: .82; transform: translate3d(0, 10px, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
  }

  .home-editorial .hero-photo {
    animation: editorial-photo-arrive .68s cubic-bezier(.18,.72,.22,1) .12s both;
  }

  [data-editorial-motion].editorial-ready {
    opacity: 0;
    transform: translate3d(0, 26px, 0);
    transition: opacity .78s cubic-bezier(.18,.72,.22,1),
                transform .78s cubic-bezier(.18,.72,.22,1);
    transition-delay: var(--editorial-delay, 0ms);
  }
  [data-editorial-motion="media"].editorial-ready {
    transform: translate3d(0, 30px, 0) scale(.985);
  }
  [data-editorial-motion="path"].editorial-ready {
    transform: translate3d(0, 16px, 0);
  }
  [data-editorial-motion].editorial-ready.editorial-visible {
    opacity: 1;
    transform: none;
  }

  @media (hover: hover) and (pointer: fine) {
    .catalog-card {
      transition: border-color .35s ease, box-shadow .45s cubic-bezier(.18,.72,.22,1);
    }
    .catalog-card:hover,
    .catalog-card:focus-within {
      border-color: #aab7b3;
      box-shadow: 0 18px 38px rgba(24, 38, 35, .08);
    }
    .catalog-card:not(.catalog-card--fluid) .catalog-image img,
    .home-own-grid .home-own-image img {
      transition: transform .8s cubic-bezier(.18,.72,.22,1);
    }
    .catalog-card:not(.catalog-card--fluid):hover .catalog-image img,
    .catalog-card:not(.catalog-card--fluid):focus-within .catalog-image img,
    .home-own-grid article:hover .home-own-image img,
    .home-own-grid article:focus-within .home-own-image img {
      transform: scale(1.035);
    }
  }
}
