/* ═══════════════════════════════════════════════════════════════
   POTEASE ARTISTIC LAYER · v2026.07.03
   艺术感增强：极光背景 / 渐变流光标题 / 滚动显现 / 3D 卡片 / 光标辉光
   仅做叠加，不改动原有 landing.css 规则
   ═══════════════════════════════════════════════════════════════ */

/* ── 极光画布 ── */
#aurora-canvas {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

/* ── 光标辉光 ── */
#cursor-glow {
  position: fixed;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  pointer-events: none;
  z-index: 1;
  background: radial-gradient(circle,
    rgba(56,189,248,.14) 0%,
    rgba(125,211,252,.08) 35%,
    transparent 70%);
  transform: translate(-50%, -50%);
  transition: opacity .4s;
  opacity: 0;
  mix-blend-mode: multiply;
}

/* ── HERO 渐变流光标题 ── */
.hero-word-accent,
.hero-word-one {
  background: linear-gradient(100deg,
    #0369a1 0%, #0ea5e9 25%, #22d3ee 50%, #6366f1 75%, #0369a1 100%);
  background-size: 300% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: art-gradient-flow 7s linear infinite;
}
@keyframes art-gradient-flow {
  to { background-position: 300% center; }
}

/* 标题入场 */
.hero-line { overflow: visible; }
.art-hero-in .hero-word {
  display: inline-block;
  animation: art-rise .9s cubic-bezier(.22,1,.36,1) both;
}
.art-hero-in .hero-word-accent { animation-delay: .15s; }
.art-hero-in .hero-word-dark   { animation-delay: .3s; }
@keyframes art-rise {
  from { opacity: 0; transform: translateY(42px) rotate(2deg); filter: blur(6px); }
  to   { opacity: 1; transform: translateY(0) rotate(0); filter: blur(0); }
}

/* ── 滚动显现 ── */
.art-reveal {
  opacity: 0;
  transform: translateY(36px) scale(.98);
  transition: opacity .9s cubic-bezier(.22,1,.36,1), transform .9s cubic-bezier(.22,1,.36,1);
  transition-delay: var(--art-delay, 0s);
  will-change: opacity, transform;
}
.art-reveal.art-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

/* ── 3D 倾斜卡片 ── */
.art-tilt {
  transform-style: preserve-3d;
  transition: transform .25s ease-out, box-shadow .35s;
}
.art-tilt:hover {
  box-shadow: 0 20px 50px rgba(0,0,0,.1) !important;
}
.art-tilt .art-tilt-shine {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(600px circle at var(--shine-x, 50%) var(--shine-y, 50%),
    rgba(255,255,255,.35), transparent 42%);
  opacity: 0;
  transition: opacity .3s;
}
.art-tilt:hover .art-tilt-shine { opacity: 1; }

/* ── 按钮涟漪 + 光泽 ── */
.btn-primary-quiet, .ag-cta {
  position: relative;
  overflow: hidden;
}
.art-ripple {
  position: absolute;
  border-radius: 50%;
  background: rgba(255,255,255,.45);
  transform: scale(0);
  animation: art-ripple .65s ease-out forwards;
  pointer-events: none;
}
@keyframes art-ripple {
  to { transform: scale(3.2); opacity: 0; }
}

/* ── 漂浮装饰符号（学术元素）── */
.art-float-icons {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 0;
}
.art-float-icons span {
  position: absolute;
  font-family: 'EB Garamond', serif;
  color: rgba(3,105,161,.13);
  animation: art-drift var(--dur, 16s) ease-in-out infinite alternate;
  user-select: none;
}
@keyframes art-drift {
  from { transform: translateY(0) rotate(-6deg); }
  to   { transform: translateY(-46px) rotate(8deg); }
}

/* ── Section 标题下划水笔 ── */
.art-underline {
  position: relative;
  display: block;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
.art-underline::after {
  content: '';
  position: absolute;
  left: 8%;
  right: 8%;
  bottom: -10px;
  height: 4px;
  border-radius: 6px;
  background: #0071e3;
  opacity: .55;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1s cubic-bezier(.22,1,.36,1) .2s;
}
.art-visible .art-underline::after,
.art-underline.art-visible::after { transform: scaleX(1); }

/* ── 数字滚动统计 ── */
.hero-stat strong { font-variant-numeric: tabular-nums; }

/* ── 导航滚动收紧 ── */
#nav { transition: box-shadow .4s, backdrop-filter .4s; }
#nav.art-nav-scrolled {
  box-shadow: 0 6px 24px rgba(0,0,0,.06);
}

/* ── 滚动进度条 ── */
#art-progress {
  position: fixed;
  top: 0; left: 0;
  height: 3px;
  width: 0;
  z-index: 60;
  background: #0071e3;
}

/* ── 减少动态偏好 ── */
@media (prefers-reduced-motion: reduce) {
  #aurora-canvas, #cursor-glow { display: none; }
  .art-reveal { opacity: 1; transform: none; transition: none; }
  .hero-word-accent, .hero-word-one { animation: none; }
  .art-hero-in .hero-word { animation: none; }
}
