/* products.css — 产品栏目视觉增强（与 LYN 暗黑动态风格一致） */
.pk-hero { position: relative; overflow: hidden; background: #050505; }
.pk-hero-bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: .42; transform: scale(1.06);
  animation: pkKen 26s ease-in-out infinite alternate;
  will-change: transform;
}
@keyframes pkKen {
  from { transform: scale(1.06) translateY(0); }
  to   { transform: scale(1.16) translateY(-2.5%); }
}
.pk-hero-veil {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(5,5,5,.62) 0%, rgba(5,5,5,.38) 45%, #050505 100%);
}
.pk-hero-glow {
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(55% 45% at 14% 18%, rgba(34,211,238,.14), transparent 62%);
}
.pk-hero-inner { position: relative; z-index: 2; }

.pk-rise { opacity: 0; transform: translateY(30px); animation: pkRise .95s cubic-bezier(.22,.61,.36,1) forwards; }
.pk-d1 { animation-delay: .10s; }
.pk-d2 { animation-delay: .24s; }
.pk-d3 { animation-delay: .40s; }
@keyframes pkRise { to { opacity: 1; transform: none; } }

.pk-card { position: relative; overflow: hidden; isolation: isolate;
  transition: transform .45s cubic-bezier(.22,.61,.36,1), border-color .3s ease, box-shadow .45s ease;
  will-change: transform; }
.pk-card .pk-bg {
  position: absolute; inset: 0; z-index: -1;
  background-size: cover; background-position: center;
  opacity: .15; transform: scale(1.01);
  transition: opacity .5s ease, transform .9s cubic-bezier(.22,.61,.36,1);
}
.pk-card:hover { transform: translateY(-6px); box-shadow: 0 22px 55px -20px rgba(34,211,238,.28); }
.pk-card:hover .pk-bg { opacity: .36; transform: scale(1.08); }
.pk-num-bg {
  position: absolute; right: 1.1rem; top: -1.9rem; z-index: -1;
  font-size: 7rem; line-height: 1; font-weight: 800;
  color: rgba(255,255,255,.045); pointer-events: none; user-select: none;
}

.rv { opacity: 0; transform: translateY(26px);
  transition: opacity .8s cubic-bezier(.22,.61,.36,1), transform .8s cubic-bezier(.22,.61,.36,1); }
.rv.rv-in { opacity: 1; transform: none; }

.pk-strip { position: relative; overflow: hidden; }
.pk-strip-bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .16; }
.pk-strip-veil { position: absolute; inset: 0;
  background: linear-gradient(90deg, #050505 0%, rgba(5,5,5,.78) 55%, rgba(5,5,5,.5) 100%); }
.pk-strip-inner { position: relative; z-index: 2; }

@media (prefers-reduced-motion: reduce) {
  .pk-hero-bg, .pk-rise { animation: none; }
  .pk-rise, .rv { opacity: 1; transform: none; }
  .rv { transition: none; }
}