/* Gravity Plus Experts v4 - Best Animations System
   Elementor compatible + premium motion
*/

/* Base reveal */
[data-reveal],.gp-reveal{opacity:0;transform:translateY(28px) scale(.98);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1);will-change:opacity,transform}
[data-reveal].is-visible,.gp-reveal.is-visible{opacity:1;transform:translateY(0) scale(1)}

/* Reveal variants for Elementor + theme */
[data-reveal="fade-up"]{transform:translateY(32px)}
[data-reveal="fade-left"]{transform:translateX(-36px)}
[data-reveal="fade-right"]{transform:translateX(36px)}
[data-reveal="zoom-in"]{transform:scale(.92)}
[data-reveal="flip"]{transform:perspective(800px) rotateX(12deg) translateY(20px)}
[data-reveal="blur"]{filter:blur(12px);transform:translateY(20px)}
[data-reveal="blur"].is-visible{filter:blur(0)}

[data-reveal].is-visible{opacity:1;transform:none;filter:none}

/* Stagger children */
[data-stagger] > *{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
[data-stagger].is-visible > *{opacity:1;transform:none}
[data-stagger].is-visible > *:nth-child(1){transition-delay:.05s}
[data-stagger].is-visible > *:nth-child(2){transition-delay:.12s}
[data-stagger].is-visible > *:nth-child(3){transition-delay:.19s}
[data-stagger].is-visible > *:nth-child(4){transition-delay:.26s}
[data-stagger].is-visible > *:nth-child(5){transition-delay:.33s}
[data-stagger].is-visible > *:nth-child(6){transition-delay:.4s}
[data-stagger].is-visible > *:nth-child(7){transition-delay:.47s}
[data-stagger].is-visible > *:nth-child(8){transition-delay:.54s}

/* Headings */
.gp-heading-animate{opacity:0;letter-spacing:.18em;transform:translateY(18px);transition:opacity .9s cubic-bezier(.22,1,.36,1),letter-spacing .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1)}
.gp-heading-animate.is-visible{opacity:1;letter-spacing:0;transform:translateY(0)}

/* Gradient text animation */
.gp-gradient-text{background:linear-gradient(90deg,var(--gp-accent),#ff7aa8,var(--gp-accent));background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gp-gradient 4s linear infinite}
@keyframes gp-gradient{to{background-position:200% center}}

/* Typewriter */
.gp-typewriter:after{content:"";display:inline-block;width:3px;height:.9em;margin-left:6px;background:var(--gp-accent);vertical-align:-.08em;animation:gp-cursor 1s infinite;border-radius:2px}

/* Buttons - magnetic + shine */
.gp-button{position:relative;overflow:hidden;isolation:isolate;transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease,background .3s ease}
.gp-button::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s ease;z-index:1}
.gp-button:hover::before{transform:translateX(120%)}
.gp-button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 18px 40px rgba(232,53,109,.35)}
.gp-button:active{transform:translateY(-1px) scale(.98)}
.gp-magnetic{transition:transform .25s cubic-bezier(.22,1,.36,1)}

/* Cards - 3D tilt + glow border */
.gp-card,.gp-panel{position:relative;transform-style:preserve-3d;transition:transform .4s cubic-bezier(.22,1,.36,1),border-color .4s ease,box-shadow .4s ease,background .4s ease}
.gp-card:hover,.gp-panel:hover{transform:translateY(-10px) rotateX(2deg) rotateY(-2deg);border-color:rgba(232,53,109,.6);box-shadow:0 30px 80px rgba(0,0,0,.35),0 0 0 1px rgba(232,53,109,.15)}
.gp-card::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(232,53,109,.5),transparent 40%,transparent 60%,rgba(232,53,109,.3));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s ease;pointer-events:none}
.gp-card:hover::after{opacity:1}

/* Tilt JS hook */
[data-tilt]{perspective:1000px}
[data-tilt-inner]{transition:transform .2s ease-out;transform-style:preserve-3d}

/* Hero entrance timeline */
@keyframes gp-hero-in{from{opacity:0;transform:translateY(40px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.gp-hero [data-reveal].is-visible{animation:gp-hero-in .9s cubic-bezier(.22,1,.36,1) both}

/* Blobs & glow - smoother + parallax */
.gp-blob{will-change:transform}
.gp-parallax{will-change:transform;transition:transform .1s linear}

/* Marquee - buttery */
.gp-marquee-track{will-change:transform}
.gp-marquee:hover .gp-marquee-track{animation-play-state:paused}

/* Image zoom on hover */
.gp-zoom img{transition:transform .6s cubic-bezier(.22,1,.36,1)}
.gp-zoom:hover img{transform:scale(1.06)}

/* Link arrow */
.gp-hover-arrow{position:relative;display:inline-flex;align-items:center;gap:8px;font-weight:700}
.gp-hover-arrow svg{transition:transform .3s cubic-bezier(.22,1,.36,1)}
.gp-hover-arrow:hover svg{transform:translateX(6px)}

/* Nav underline animation */
.gp-nav a{position:relative}
.gp-nav a::after{content:"";position:absolute;left:0;bottom:-6px;width:100%;height:2px;background:var(--gp-accent);transform:scaleX(0);transform-origin:right;transition:transform .35s cubic-bezier(.22,1,.36,1)}
.gp-nav a:hover::after{transform:scaleX(1);transform-origin:left}

/* Counter pop */
[data-count]{display:inline-block}
[data-count].counting{animation:gp-pop .5s cubic-bezier(.22,1,.36,1)}
@keyframes gp-pop{0%{transform:scale(.9)}50%{transform:scale(1.08)}100%{transform:scale(1)}}

/* Scroll progress bar (JS adds) */
.gp-scroll-progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:9999;background:transparent;pointer-events:none}
.gp-scroll-progress i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--gp-accent),#ff7aa8);transform-origin:left;transform:scaleX(0)}

/* Elementor compatibility - make Elementor widgets animate too */
.elementor-widget[data-reveal]{opacity:0}
.elementor-widget[data-reveal].is-visible{opacity:1}
.elementor-element.gp-reveal{opacity:0}
.elementor-element.gp-reveal.is-visible{opacity:1}

/* Keyframes */
@keyframes gp-cursor{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes gp-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.45);opacity:.55}}
@keyframes gp-blink{0%,100%{opacity:.45}50%{opacity:1}}
@keyframes gp-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-10px) rotate(1deg)}}
@keyframes gp-blob{0%,100%{transform:scale(1) translate(0,0);opacity:.45}33%{transform:scale(1.12) translate(20px,-15px);opacity:.65}66%{transform:scale(.95) translate(-15px,10px);opacity:.55}}
@keyframes gp-glow{0%,100%{opacity:.35;transform:translate(-50%,45%) scale(.95)}50%{opacity:.7;transform:translate(-50%,45%) scale(1.06)}}
@keyframes gp-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes gp-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes gp-spin-slow{to{transform:rotate(360deg)}}
@keyframes gp-shimmer{from{background-position:-200% 0}to{background-position:200% 0}}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
  [data-reveal],.gp-reveal,.gp-heading-animate,[data-stagger]>*{opacity:1!important;transform:none!important;filter:none!important;letter-spacing:0!important}
  .gp-marquee-track{animation:none!important}
  .gp-scroll-progress{display:none}
}
