/* ===========================================================
   effects.css · 特效与封面（滚动揭示 / 光斑 / 渐变 / 大字）
   =========================================================== */

/* 滚动揭示 */
.reveal{ opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1); transition-delay: var(--d, 0ms); }
.reveal.in{ opacity: 1; transform: none; }

/* 鼠标光斑（跟随指针） */
.spotlight{ position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background: radial-gradient(420px 420px at var(--mx, 50%) var(--my, 30%), rgba(14,165,233,.10), transparent 70%);
  opacity: 0; transition: opacity .4s; }
.spotlight.on{ opacity: 1; }

/* 渐变文字 */
.grad-text{
  background: linear-gradient(100deg, var(--brand-700), var(--brand), var(--accent));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* 上浮 */
.lift{ transition: transform .2s, box-shadow .2s; }
.lift:hover{ transform: translateY(-4px); box-shadow: var(--sh-2); }

/* 渐变描边卡 */
.edge{ position: relative; }
.edge::after{
  content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px;
  background: linear-gradient(120deg, var(--brand), transparent 45%, var(--accent));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; opacity: .55;
}

/* 打字机光标 */
.caret::after{ content: ""; display: inline-block; width: 4px; height: 1em; background: var(--brand); margin-left: 4px; vertical-align: -2px; animation: blink 1s steps(1) infinite; }
@keyframes blink{ 50%{ opacity: 0; } }

@keyframes floaty{ 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(-8px); } }
@keyframes pulse{ 0%{ box-shadow: 0 0 0 0 rgba(14,165,233,.35); } 70%{ box-shadow: 0 0 0 18px rgba(14,165,233,0); } 100%{ box-shadow: 0 0 0 0 rgba(14,165,233,0); } }
.pulse{ animation: pulse 2.4s infinite; }

/* 路径描边动画（图示用） */
.draw{ stroke-dasharray: 1200; stroke-dashoffset: 1200; }
.in .draw{ animation: dash 1.6s ease forwards; }
@keyframes dash{ to{ stroke-dashoffset: 0; } }
