/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 27 2026 | 00:46:56 */
/* Hover Card Effect — v2.4 */

.elementor-element.hover-card {
  --card-radius: 16px;
  --card-lift: -10px;

  --card-border: rgba(255, 255, 255, 0.28);
  --card-border-hover: rgba(255, 255, 255, 0.65);

  --card-brightness: 1;
  --card-saturation: 1;

  --card-brightness-hover: 1.16;
  --card-saturation-hover: 1.45;

  position: relative;
  isolation: isolate;
  overflow: hidden;

  border: 1px solid var(--card-border);
  border-radius: var(--card-radius);

  transform: translateY(0) scale(1);

  box-shadow:
    0 0 15px -5px rgba(0, 0, 0, 0.35) !important;

  transition:
    transform 400ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 400ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 300ms ease;
}

/*
 * Preserve Elementor positioning.
 */
.elementor-element.hover-card > * {
  z-index: 2;
}

/*
 * Keep the circular SVG icon above
 * the main content container.
 */
.elementor-element.hover-card > .elementor-absolute {
  z-index: 4;
}

/*
 * Background image enhancement layer.
 */
.elementor-element.hover-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;

  pointer-events: none;
  border-radius: inherit;

  background:
    radial-gradient(
      circle at 20% 0%,
      rgba(255, 255, 255, 0.14),
      transparent 48%
    ),
    rgba(255, 255, 255, 0.01);

  -webkit-backdrop-filter:
    brightness(var(--card-brightness))
    saturate(var(--card-saturation));

  backdrop-filter:
    brightness(var(--card-brightness))
    saturate(var(--card-saturation));

  opacity: 0.7;
  transform: scale(1);

  transition:
    opacity 350ms ease,
    transform 600ms cubic-bezier(0.16, 1, 0.3, 1),
    backdrop-filter 350ms ease,
    -webkit-backdrop-filter 350ms ease;
}

/*
 * Inner light border.
 */
.elementor-element.hover-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 5;

  pointer-events: none;
  border-radius: inherit;

  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.08),
    inset 0 0 24px transparent;

  transition: box-shadow 350ms ease;
}

.elementor-element.hover-card:hover,
.elementor-element.hover-card:focus-visible,
.elementor-element.hover-card:focus-within {
  --card-brightness: var(--card-brightness-hover);
  --card-saturation: var(--card-saturation-hover);

  border-color: var(--card-border-hover);

  transform:
    translateY(var(--card-lift))
    scale(1.018);

  box-shadow:
    0 3px 16px -8px rgba(0, 0, 0, 0.22),
    0 6px 30px -14px rgba(0, 0, 0, 0.28),
    0 10px 40px -24px rgba(0, 0, 0, 0.24) !important;
}

.elementor-element.hover-card:hover::before,
.elementor-element.hover-card:focus-visible::before,
.elementor-element.hover-card:focus-within::before {
  opacity: 1;
  transform: scale(1.05);
}

.elementor-element.hover-card:hover::after,
.elementor-element.hover-card:focus-visible::after,
.elementor-element.hover-card:focus-within::after {
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.22),
    inset 0 0 32px rgba(255, 255, 255, 0.08);
}

/*
 * Optional images inside the card.
 */
.elementor-element.hover-card img {
  transition:
    transform 600ms cubic-bezier(0.16, 1, 0.3, 1);
}

.elementor-element.hover-card:hover img,
.elementor-element.hover-card:focus-visible img,
.elementor-element.hover-card:focus-within img {
  transform: scale(1.05);
}

/*
 * Keyboard accessibility.
 */
.elementor-element.hover-card:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

/*
 * Reduced-motion accessibility.
 */
@media (prefers-reduced-motion: reduce) {
  .elementor-element.hover-card,
  .elementor-element.hover-card::before,
  .elementor-element.hover-card::after,
  .elementor-element.hover-card img {
    transition: none;
  }

  .elementor-element.hover-card:hover,
  .elementor-element.hover-card:focus-visible,
  .elementor-element.hover-card:focus-within {
    transform: none;
  }

  .elementor-element.hover-card:hover::before,
  .elementor-element.hover-card:focus-visible::before,
  .elementor-element.hover-card:focus-within::before,
  .elementor-element.hover-card:hover img,
  .elementor-element.hover-card:focus-visible img,
  .elementor-element.hover-card:focus-within img {
    transform: none;
  }
}