/* Hero diagonal entrance */
.ng-hero__diagonal { transform: scaleY(0); transform-origin: bottom; animation: diagReveal 1.2s cubic-bezier(.16,1,.3,1) .8s forwards; }
@keyframes diagReveal { from{transform:scaleY(0)}to{transform:scaleY(1)} }

/* Hero CTA pill pop */
.ng-hero__cta-pill { opacity: 0; transform: scale(.85); }
.ng-hero-anim--visible.ng-hero__cta-pill, .ng-hero-anim--visible .ng-hero__cta-pill { opacity: 1; transform: scale(1); }

/* Service card slide */
.ng-svc-card--active { animation: svcSlide .4s ease forwards; }
@keyframes svcSlide { from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)} }

/* Blog card image zoom */
.ng-blog-card__img img { transition: transform .8s cubic-bezier(.16,1,.3,1); }
.ng-blog-card:hover .ng-blog-card__img img { transform: scale(1.05); }

/* Bento card hover */
.ng-bento-card { transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s; }

/* Marquee pause on hover */
.ng-marquee__track:hover .ng-marquee__inner { animation-play-state: paused; }

/* Button ripple */
.ng-btn::after { content:''; position:absolute; top:50%; left:50%; width:0; height:0; border-radius:50%; background:rgba(255,255,255,.1); transform:translate(-50%,-50%); transition:width .6s, height .6s; }
.ng-btn:hover::after { width:300px; height:300px; }

/* Reduced motion */
@media (prefers-reduced-motion:reduce) {
    .ng-hero__diagonal { animation:none; transform:scaleY(1); }
    .ng-hero__cta-pill { opacity:1; transform:scale(1); }
    .ng-marquee__inner { animation:none; }
}