/* ═══════════════════════════════════════════
   Parsivakil Animations v1.0
   Auto-applies to any landing page.
   GPU-accelerated · RTL-aware · reduced-motion safe
═══════════════════════════════════════════ */

/* ── Scroll progress (#9) ── */
.pv-scroll-bar {
  position: fixed; top: 0; right: 0; left: 0; height: 2px;
  z-index: 9999; pointer-events: none;
}
.pv-scroll-fill {
  height: 100%; width: 0%;
  background: linear-gradient(90deg, #D4A84B 0%, #EFC976 50%, #D4A84B 100%);
  box-shadow: 0 0 10px rgba(212,168,75,0.45);
  transition: width 80ms linear;
}

/* ── Cursor glow (#10) ── */
.pv-cursor {
  position: fixed; top: 0; left: 0; width: 40px; height: 40px;
  border-radius: 50%; pointer-events: none; z-index: 9998;
  background: radial-gradient(circle, rgba(212,168,75,0.55) 0%, rgba(212,168,75,0.18) 35%, transparent 70%);
  transform: translate(-50%,-50%); mix-blend-mode: screen;
  opacity: 0; transition: width .25s, height .25s, opacity .25s;
  will-change: transform;
}
.pv-cursor.active { opacity: 1; }
.pv-cursor.hover  { width: 60px; height: 60px; background: radial-gradient(circle, rgba(239,201,118,0.7) 0%, rgba(212,168,75,0.25) 40%, transparent 75%); }
@media (hover:none),(pointer:coarse) { .pv-cursor { display: none !important; } }

/* ── Hero background layers ── */
.pv-aurora {
  position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0;
}
.pv-blob {
  position: absolute; border-radius: 50%; filter: blur(80px); will-change: transform;
}
.pv-blob-g { width: 380px; height: 380px; background: #D4A84B; opacity: .11; top: -80px; right: -80px; animation: pv-aurora-a 24s ease-in-out infinite; }
.pv-blob-s { width: 320px; height: 320px; background: #5B9DD9; opacity: .06; bottom: -60px; left: -60px; animation: pv-aurora-b 30s ease-in-out infinite; }
.pv-blob-n { width: 280px; height: 280px; background: #2a4a7a;  opacity: .14; top: 35%; left: 35%; animation: pv-aurora-c 26s ease-in-out infinite; }
@keyframes pv-aurora-a { 50% { transform: translate(-130px, 90px); } }
@keyframes pv-aurora-b { 50% { transform: translate(160px, -110px); } }
@keyframes pv-aurora-c { 50% { transform: translate(90px,  130px); } }

/* ── Grid shimmer ── */
.pv-grid-shim {
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    linear-gradient(rgba(240,232,216,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(240,232,216,0.04) 1px, transparent 1px);
  background-size: 40px 40px;
}
.pv-grid-shim::after {
  content: ""; position: absolute; inset: -20%;
  background: linear-gradient(135deg,
    transparent 40%,
    rgba(212,168,75,0.05) 49%,
    rgba(212,168,75,0.10) 50%,
    rgba(212,168,75,0.05) 51%,
    transparent 60%);
  background-size: 300% 300%;
  animation: pv-shim 5s linear infinite;
}
@keyframes pv-shim { 0% { background-position: 100% 100%; } 100% { background-position: 0% 0%; } }

/* ── Floating particles ── */
.pv-particle {
  position: absolute; border-radius: 50%;
  pointer-events: none; will-change: transform;
}
@keyframes pv-drift-a { 0%,100%{transform:translate(0,0)} 25%{transform:translate(20px,-30px)} 50%{transform:translate(-15px,-50px)} 75%{transform:translate(-25px,-20px)} }
@keyframes pv-drift-b { 0%,100%{transform:translate(0,0)} 33%{transform:translate(-30px,25px)} 66%{transform:translate(15px,40px)} }
@keyframes pv-drift-c { 0%,100%{transform:translate(0,0)} 50%{transform:translate(25px,-40px)} }

/* ── Card stagger reveal (#5) ── */
.pv-stagger {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .5s cubic-bezier(0.16,1,0.3,1), transform .5s cubic-bezier(0.16,1,0.3,1);
}
.pv-stagger.in { opacity: 1; transform: translateY(0); }

/* ── Button ripple (#6) ── */
.btn-primary { position: relative; overflow: hidden; }
.pv-ripple {
  position: absolute; border-radius: 50%; pointer-events: none;
  background: rgba(212,168,75,0.35);
  transform: translate(-50%,-50%) scale(0);
  animation: pv-ripple-go 600ms cubic-bezier(0.16,1,0.3,1) forwards;
}
@keyframes pv-ripple-go { to { transform: translate(-50%,-50%) scale(1); opacity: 0; } }

/* ── Card tilt (#8) ── */
.card {
  transform-style: preserve-3d;
  transition: transform .3s ease, border-color .25s, box-shadow .25s;
  will-change: transform;
}
.pv-shine {
  position: absolute; inset: 0; border-radius: inherit;
  pointer-events: none; z-index: 2;
  background: radial-gradient(350px circle at var(--mx,50%) var(--my,50%), rgba(212,168,75,0.14), transparent 50%);
  opacity: 0; transition: opacity .3s;
}
.card:hover .pv-shine { opacity: 1; }

/* ── Gold gradient border (#3) — opt-in via .pv-gborder ── */
.pv-gborder { position: relative; padding: 1.5px; border-radius: inherit; overflow: hidden; }
.pv-gborder::before {
  content: ""; position: absolute; inset: -150%;
  background: conic-gradient(from 0deg, #D4A84B, #EFC976, #5B9DD9, #D4A84B);
  animation: pv-gspin 4s linear infinite; animation-play-state: paused; z-index: 0;
}
.pv-gborder:hover::before { animation-play-state: running; }
@keyframes pv-gspin { to { transform: rotate(360deg); } }

/* ── AI thinking dots (#12) — opt-in ── */
.pv-ai-dots { display: inline-flex; gap: 5px; align-items: center; }
.pv-ai-dots span {
  width: 8px; height: 8px; border-radius: 50%; background: #5B9DD9;
  animation: pv-aidot 900ms ease-in-out infinite;
}
.pv-ai-dots span:nth-child(2) { animation-delay: 200ms; }
.pv-ai-dots span:nth-child(3) { animation-delay: 400ms; }
@keyframes pv-aidot { 0%,100%{transform:scale(.6);opacity:.3} 50%{transform:scale(1.2);opacity:1} }

/* ── Skeleton (#20) — opt-in ── */
.pv-skel {
  height: 14px; border-radius: 7px; background: #1d3354;
  position: relative; overflow: hidden;
}
.pv-skel::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(270deg, transparent 0%, rgba(212,168,75,0.08) 50%, transparent 100%);
  transform: translateX(-100%); animation: pv-skelshim 1.4s linear infinite;
}
@keyframes pv-skelshim { to { transform: translateX(100%); } }

/* ── Typewriter caret ── */
.pv-caret {
  display: inline-block; width: 2px; height: .9em; vertical-align: -1px;
  background: #D4A84B; margin-inline-start: 3px;
  animation: pv-blink 1s steps(1) infinite;
}
@keyframes pv-blink { 50% { opacity: 0; } }

/* ── Reduced motion: disable everything ── */
@media (prefers-reduced-motion: reduce) {
  .pv-particle, .pv-blob, .pv-grid-shim::after,
  .pv-skel::after, .pv-ai-dots span { animation: none !important; }
  .pv-stagger { opacity: 1 !important; transform: none !important; }
  .pv-scroll-bar, .pv-cursor { display: none !important; }
}