/* ------------------------------------------------------------------
   Site-wide micro-interactions (fx.js is the counterpart).
   Everything is gated behind prefers-reduced-motion.
------------------------------------------------------------------- */

/* 1. Scroll progress bar (element injected by fx.js) */
#aw-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 0;
  background: #ff6f61;
  z-index: 999999;
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  /* 2. Scroll reveal (fx.js adds .aw-reveal to safe targets, .aw-in when visible) */
  .aw-reveal {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.6s ease, transform 0.6s ease;
    transition-delay: var(--aw-delay, 0ms);
  }
  .aw-reveal.aw-in {
    opacity: 1;
    transform: none;
  }

  /* 3. Card lift + shadow (blog cards, custom cards, cloned toolkit cards) */
  .elementskit-post-image-card,
  .aw-wd-card,
  .aw-wd-cta {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
  }
  .elementskit-post-image-card:hover,
  .aw-wd-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.25);
  }

  /* 4. Image zoom inside blog card thumbs */
  .elementskit-entry-thumb {
    display: block;
    overflow: hidden;
  }
  .elementskit-entry-thumb img {
    transition: transform 0.5s ease;
  }
  .elementskit-post-image-card:hover .elementskit-entry-thumb img {
    transform: scale(1.05);
  }

  /* 5. Button shine sweep (kit + custom buttons) */
  .elementor-button,
  .aw-wd-btn,
  .awq-btn,
  .aw-s-btn,
  .awq-service-btn,
  .awq-hero-cue,
  .aw-tool-go {
    position: relative;
    overflow: hidden;
  }
  .elementor-button::before,
  .aw-wd-btn::before,
  .awq-btn::before,
  .aw-s-btn::before,
  .awq-service-btn::before,
  .aw-tool-go::before {
    content: "";
    position: absolute;
    top: 0;
    left: -85%;
    width: 55%;
    height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    transform: skewX(-20deg);
    pointer-events: none;
    transition: left 0.55s ease;
  }
  .elementor-button:hover::before,
  .aw-wd-btn:hover::before,
  .awq-btn:hover::before,
  .aw-s-btn:hover::before,
  .awq-service-btn:hover::before,
  .aw-tool-go:hover::before {
    left: 130%;
  }

  /* 6. Coral circles give a little nod on hover */
  .awq-opt:hover .awq-letter,
  .aw-wd-card:hover .aw-wd-num {
    transform: scale(1.1) rotate(-4deg);
  }
  .awq-letter,
  .aw-wd-num {
    transition: transform 0.2s ease;
  }
}