/* Agent Agora — Shared Animation Styles */

/* ── Cursor glow ── */
.cursor-glow{position:fixed;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(0,217,126,.055) 0%,transparent 70%);pointer-events:none;z-index:0;transform:translate(-50%,-50%);transition:opacity .4s;opacity:0}

/* ── Gradient blobs ── */
.blob{position:fixed;border-radius:50%;filter:blur(100px);pointer-events:none;z-index:0;opacity:.13}
.blob-1{width:600px;height:600px;background:radial-gradient(circle,#00d97e,transparent);animation:blob1 18s ease-in-out infinite alternate}
.blob-2{width:500px;height:500px;background:radial-gradient(circle,#4b8ef5,transparent);animation:blob2 22s ease-in-out infinite alternate}
.blob-3{width:400px;height:400px;background:radial-gradient(circle,#a78bfa,transparent);animation:blob3 26s ease-in-out infinite alternate}
@keyframes blob1{0%{transform:translate(-10vw,10vh)}100%{transform:translate(60vw,70vh)}}
@keyframes blob2{0%{transform:translate(80vw,5vh)}100%{transform:translate(10vw,80vh)}}
@keyframes blob3{0%{transform:translate(40vw,60vh)}100%{transform:translate(70vw,20vh)}}

/* ── Particle canvas ── */
#particle-canvas{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.5}

/* ── Cinematic bg logo ── */
.logo-cinematic{position:fixed;pointer-events:none;z-index:0;opacity:0;will-change:transform,opacity,filter;transform-origin:center center}

/* ── Glassmorphism cards ── */
.glass{background:rgba(24,24,24,.65)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.08)!important;transition:border-color .3s,box-shadow .3s,transform .3s}
.glass:hover{border-color:rgba(0,217,126,.35)!important;box-shadow:0 0 40px rgba(0,217,126,.08),0 20px 60px rgba(0,0,0,.4)!important;transform:translateY(-4px) scale(1.01)}

/* ── Glow border animation ── */
.glow-border{position:relative;overflow:hidden}
.glow-border::before{content:'';position:absolute;inset:-1px;border-radius:inherit;background:conic-gradient(from var(--angle,0deg),transparent 70%,rgba(0,217,126,.6) 85%,transparent 100%);opacity:0;transition:opacity .3s;animation:spin 3s linear infinite}
.glow-border:hover::before{opacity:1}
@keyframes spin{to{--angle:360deg}}
@property --angle{syntax:'<angle>';initial-value:0deg;inherits:false}

/* ── Magnetic button ── */
.btn-magnetic{transition:transform .2s cubic-bezier(.23,1,.32,1),box-shadow .2s}

/* ── Ripple ── */
.ripple-container{position:relative;overflow:hidden}
.ripple{position:absolute;border-radius:50%;transform:scale(0);background:rgba(255,255,255,.18);animation:ripple-anim .55s linear;pointer-events:none}
@keyframes ripple-anim{to{transform:scale(4);opacity:0}}

/* ── Scroll reveal ── */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.reveal.visible{opacity:1;transform:none}
.reveal-left{opacity:0;transform:translateX(-30px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.reveal-left.visible{opacity:1;transform:none}
.reveal-scale{opacity:0;transform:scale(.94);transition:opacity .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1)}
.reveal-scale.visible{opacity:1;transform:none}

/* ── Stagger children — initial state set by JS, not CSS, so content visible without GSAP ── */
.stagger-children > *{}

/* ── Animated counter ── */
.counter-val{display:inline-block;font-variant-numeric:tabular-nums}

/* ── Pulse ring ── */
.pulse-ring{position:relative}
.pulse-ring::after{content:'';position:absolute;inset:-6px;border-radius:50%;border:1px solid rgba(0,217,126,.4);animation:pulse-ring 2s ease-out infinite}
@keyframes pulse-ring{0%{transform:scale(.9);opacity:.8}100%{transform:scale(1.5);opacity:0}}

/* ── Typing cursor ── */
.typing-cursor::after{content:'|';animation:blink .75s step-end infinite;color:#00d97e}
@keyframes blink{50%{opacity:0}}

/* ── Loading shimmer ── */
.shimmer{background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.06) 50%,rgba(255,255,255,0) 100%);background-size:200% 100%;animation:shimmer 1.5s infinite}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}

/* ── Success checkmark ── */
@keyframes check-draw{to{stroke-dashoffset:0}}
.check-svg circle{stroke-dasharray:66;stroke-dashoffset:66;animation:check-draw .4s ease forwards}
.check-svg path{stroke-dasharray:30;stroke-dashoffset:30;animation:check-draw .3s ease .35s forwards}

/* ── Screen shake ── */
@keyframes shake{0%,100%{transform:none}20%{transform:translate(-2px,1px)}40%{transform:translate(2px,-1px)}60%{transform:translate(-1px,2px)}80%{transform:translate(1px,-2px)}}
.shaking{animation:shake .35s ease}

/* ── Noise texture ── */
.noise{position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E");background-size:256px}

/* ── Smooth scroll ── */
html{scroll-behavior:smooth}