/* Care product cards — entrance, float, hover motion */
.jl-product__card {
  opacity: 0;
  transform: translateY(14px);
  animation: jl-card-in 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  transition:
    border-color 0.45s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.55s cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}
.jl-product__card:nth-child(1) { animation-delay: 0.05s; }
.jl-product__card:nth-child(2) { animation-delay: 0.16s; }
.jl-product__card:nth-child(3) { animation-delay: 0.28s; }
@keyframes jl-card-in {
  to { opacity: 1; transform: translateY(0); }
}
.jl-product__visual {
  transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}
.jl-product__visual img {
  transform: scale(1);
  transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}
.jl-product__title { transition: color 0.4s ease; }
.jl-product__chip { transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1); }
.jl-product__go i { transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1); }
.jl-product__card:hover {
  border-color: color-mix(in srgb, var(--jl-accent) 40%, var(--bp-line));
  transform: translateY(-6px);
  box-shadow: 0 14px 28px color-mix(in srgb, var(--jl-accent) 10%, transparent);
}
.jl-product__card:hover .jl-product__title { color: var(--jl-accent); }
.jl-product__card:hover .jl-product__visual { transform: translateY(-2px); }
.jl-product__card:hover .jl-product__visual img { transform: scale(1.06); }
.jl-product__card:hover .jl-product__chip:nth-child(1) { transform: translateY(-2px); }
.jl-product__card:hover .jl-product__chip:nth-child(2) {
  transform: translateY(-2px);
  transition-delay: 0.05s;
}
.jl-product__card:hover .jl-product__go i { transform: translateX(5px); }
@media (prefers-reduced-motion: reduce) {
  .jl-product__card,
  .jl-product__visual,
  .jl-product__visual img,
  .jl-product__chip,
  .jl-product__go i { animation: none; transition: none; }
  .jl-product__card { opacity: 1; transform: none; }
  .jl-product__card:hover,
  .jl-product__card:hover .jl-product__visual { transform: none; box-shadow: none; }
}
