/* Abbasi Builder Smooth Animations — lightweight, transform/opacity based. */

html.abbasi-motion-ready .abbasi-reveal {
  opacity: 0;
  transform: translate3d(0, var(--abbasi-motion-distance, 28px), 0);
  transition-property: opacity, transform;
  transition-duration: var(--abbasi-motion-duration, 700ms);
  transition-timing-function: cubic-bezier(.2,.75,.25,1);
  transition-delay: var(--abbasi-motion-delay, 0ms);
  will-change: opacity, transform;
}

html.abbasi-motion-ready .abbasi-reveal.abbasi-motion-fade {
  transform: none;
}

html.abbasi-motion-ready .abbasi-reveal.abbasi-motion-zoom {
  transform: scale(.965);
}

html.abbasi-motion-ready .abbasi-reveal.abbasi-motion-left,
html.abbasi-motion-ready .abbasi-reveal.abbasi-from-left {
  transform: translate3d(calc(var(--abbasi-motion-distance, 28px) * -1), 0, 0);
}

html.abbasi-motion-ready .abbasi-reveal.abbasi-motion-right,
html.abbasi-motion-ready .abbasi-reveal.abbasi-from-right {
  transform: translate3d(var(--abbasi-motion-distance, 28px), 0, 0);
}

html.abbasi-motion-ready .abbasi-reveal.abbasi-zoom {
  transform: scale(.965);
}

html.abbasi-motion-ready .abbasi-reveal.is-visible {
  opacity: 1;
  transform: none;
  will-change: auto;
}

/* Hero: elegant, slightly faster first impression. */
html.abbasi-motion-ready .abbasi-hero-content > .abbasi-reveal,
html.abbasi-motion-ready .inner-hero-content > .abbasi-reveal,
html.abbasi-motion-ready .project-hero-content > .abbasi-reveal {
  transition-duration: 780ms;
}

/* Header polish when scrolling. */
.site-header {
  transition: box-shadow .3s ease, background-color .3s ease, border-color .3s ease;
}
.site-header.abbasi-header-scrolled {
  box-shadow: 0 12px 34px rgba(4, 31, 71, .11);
}

/* Premium hover motion: restrained and consistent. */
.abbasi-motion-hover {
  transition: transform .32s cubic-bezier(.2,.75,.25,1), box-shadow .32s ease, border-color .32s ease;
}
.abbasi-motion-hover:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 44px rgba(5, 38, 86, .12);
}

.abbasi-project-card .project-card-image,
.abbasi-blog-card .blog-image,
.post-card > a:first-child,
.team-card,
.service-detail-image,
.featured-spotlight .spotlight-image {
  overflow: hidden;
}

.abbasi-project-card img,
.abbasi-blog-card img,
.post-card img,
.team-card > img,
.service-detail-image img,
.featured-spotlight img {
  transition: transform .65s cubic-bezier(.2,.75,.25,1), filter .45s ease;
}

.abbasi-project-card:hover img,
.abbasi-blog-card:hover img,
.post-card:hover img,
.team-card:hover > img,
.service-detail:hover .service-detail-image img,
.featured-spotlight:hover img {
  transform: scale(1.045);
}

.abbasi-service-card .service-icon,
.abbasi-benefit-card .abbasi-icon,
.abbasi-process-step .step-number,
.abbasi-stat .stat-icon {
  transition: transform .35s cubic-bezier(.2,.75,.25,1), box-shadow .35s ease;
}

.abbasi-service-card:hover .service-icon,
.abbasi-benefit-card:hover .abbasi-icon,
.abbasi-process-step:hover .step-number {
  transform: translateY(-3px) scale(1.05);
}

/* Buttons: small light sweep, no layout shift. */
.wp-block-button__link,
.abbasi-button,
.outline-button,
.header-cta {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.wp-block-button__link::before,
.abbasi-button::before,
.header-cta::before {
  content: "";
  position: absolute;
  top: -70%;
  left: -45%;
  width: 28%;
  height: 240%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.34), transparent);
  transform: translateX(-240%) rotate(18deg);
  transition: transform .65s ease;
  pointer-events: none;
  z-index: -1;
}
.wp-block-button__link:hover::before,
.abbasi-button:hover::before,
.header-cta:hover::before {
  transform: translateX(560%) rotate(18deg);
}

/* FAQ opens softly. */
.abbasi-faq[open] .faq-answer {
  animation: abbasiFaqOpen .34s ease both;
}
@keyframes abbasiFaqOpen {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: none; }
}

/* Progress bars are animated from JS by changing width. */
.progress-track > span {
  transition: width 1.25s cubic-bezier(.2,.75,.25,1);
}

/* Very subtle float on WhatsApp/call — only on hover, never continuous. */
.floating-actions a {
  transition: transform .25s ease, box-shadow .25s ease;
}
.floating-actions a:hover {
  transform: translateY(-4px) scale(1.04);
}

@media (max-width: 640px) {
  html.abbasi-motion-ready .abbasi-reveal {
    --abbasi-motion-distance: 18px;
  }
  .abbasi-motion-hover:hover {
    transform: translateY(-3px);
  }
}

/* Accessibility: users asking for reduced motion get an immediate, static site. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  html.abbasi-motion-ready .abbasi-reveal,
  .abbasi-motion-hover,
  .abbasi-motion-hover img,
  .site-header,
  .progress-track > span,
  .floating-actions a,
  .wp-block-button__link::before,
  .abbasi-button::before,
  .header-cta::before {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
}
