/* 全站轻量视觉与交互：与 Tailwind 并存 */

/* 细腻点阵背景（仅加在选用区块） */
.bg-site-dots {
  background-color: #f7f7f6;
  background-image: radial-gradient(#d5d3cf 0.8px, transparent 0.8px);
  background-size: 22px 22px;
}

/* Hero 光晕（不抢内容） */
.hero-glow {
  pointer-events: none;
  position: absolute;
  inset: 0;
  background: radial-gradient(
      ellipse 85% 55% at 85% -15%,
      rgba(13, 148, 136, 0.14),
      transparent 55%
    ),
    radial-gradient(ellipse 50% 45% at 0% 100%, rgba(13, 148, 136, 0.08), transparent 50%);
}

/* 悬浮装饰球 */
.blob {
  position: absolute;
  border-radius: 9999px;
  filter: blur(40px);
  opacity: 0.55;
  animation: blob-drift 18s ease-in-out infinite;
}
.blob-a {
  width: 180px;
  height: 180px;
  background: rgba(13, 148, 136, 0.25);
  right: -5%;
  top: 10%;
  animation-delay: 0s;
}
.blob-b {
  width: 140px;
  height: 140px;
  background: rgba(59, 130, 246, 0.12);
  right: 25%;
  bottom: 5%;
  animation-delay: -6s;
}

@keyframes blob-drift {
  0%,
  100% {
    transform: translate(0, 0) scale(1);
  }
  33% {
    transform: translate(-12px, 8px) scale(1.05);
  }
  66% {
    transform: translate(8px, -10px) scale(0.98);
  }
}

@keyframes float-photo {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}

.animate-float-photo {
  animation: float-photo 7s ease-in-out infinite;
}

/* 滚动进入视口 */
.reveal-on-scroll {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1), transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}
.reveal-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* 卡片悬停：略抬升 + 阴影 */
.card-lift {
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease,
    border-color 0.25s ease;
}
.card-lift:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 45px -18px rgba(28, 27, 25, 0.18);
}

/* 主导航按压反馈 */
nav[aria-label='主导航'] a {
  transition: transform 0.12s ease, background-color 0.2s ease, color 0.2s ease;
}
nav[aria-label='主导航'] a:active {
  transform: scale(0.97);
}

@media (prefers-reduced-motion: reduce) {
  .blob,
  .animate-float-photo {
    animation: none !important;
  }
  .reveal-on-scroll {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .card-lift:hover {
    transform: none;
  }
}