/* ==================================================
   WEBBO CORE - ICON LIST EFFECTS
   Lightweight icon-only animation for Elementor Icon List
================================================== */

.webbo-icon-list-effect-pulse,
.webbo-icon-list-effect-ping,
.webbo-icon-list-effect-blink {
    --webbo-icon-list-duration: 1800ms;
    --webbo-icon-list-stagger: 0ms;
    --webbo-icon-list-min-opacity: .42;
    --webbo-icon-list-min-scale: .92;
    --webbo-icon-list-ping-opacity: .38;
    --webbo-icon-list-ping-scale: 2.15;
}

.webbo-icon-list-intensity-subtle {
    --webbo-icon-list-min-opacity: .68;
    --webbo-icon-list-min-scale: .97;
    --webbo-icon-list-ping-opacity: .24;
    --webbo-icon-list-ping-scale: 1.75;
}

.webbo-icon-list-intensity-medium {
    --webbo-icon-list-min-opacity: .42;
    --webbo-icon-list-min-scale: .92;
    --webbo-icon-list-ping-opacity: .38;
    --webbo-icon-list-ping-scale: 2.15;
}

.webbo-icon-list-intensity-strong {
    --webbo-icon-list-min-opacity: .18;
    --webbo-icon-list-min-scale: .86;
    --webbo-icon-list-ping-opacity: .52;
    --webbo-icon-list-ping-scale: 2.55;
}

.webbo-icon-list-effect-pulse .elementor-icon-list-icon,
.webbo-icon-list-effect-blink .elementor-icon-list-icon {
    transform-origin: center center;
    will-change: opacity, transform;
    animation-duration: var(--webbo-icon-list-duration, 1800ms);
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-fill-mode: both;
}

.webbo-icon-list-effect-pulse .elementor-icon-list-icon {
    animation-name: webbo-icon-list-pulse;
}

.webbo-icon-list-effect-blink .elementor-icon-list-icon {
    animation-name: webbo-icon-list-blink;
}

/* Ping keeps the real icon solid and anchors the fading halo to the rendered icon itself. */
.webbo-icon-list-effect-ping .elementor-icon-list-icon {
    position: relative;
    overflow: visible;
    isolation: isolate;
}

.webbo-icon-list-effect-ping .elementor-icon-list-icon::after {
    content: '';
    position: absolute;
    left: var(--webbo-icon-list-ping-x, 50%);
    top: var(--webbo-icon-list-ping-y, 50%);
    width: .72em;
    height: .72em;
    border-radius: 999px;
    background: var(--webbo-icon-list-ping-color, currentColor);
    opacity: 0;
    transform: translate(-50%, -50%) scale(.72);
    transform-origin: center center;
    pointer-events: none;
    z-index: 0;
    will-change: opacity, transform;
    animation: webbo-icon-list-ping var(--webbo-icon-list-duration, 1800ms) ease-out infinite;
}

/*
 * Elementor commonly applies icon colour directly to the inner <i>/<svg>.
 * These selectors make the halo follow the same CSS colour whenever the
 * wrapper inherits it, without overriding Elementor's own icon styling.
 */
.webbo-icon-list-effect-ping .elementor-icon-list-icon > i,
.webbo-icon-list-effect-ping .elementor-icon-list-icon > svg {
    position: relative;
    z-index: 1;
}

/* Optional per-item staggering. Default 0ms keeps a one-item eyebrow immediate. */
.webbo-icon-list-effect-pulse .elementor-icon-list-item:nth-child(2) .elementor-icon-list-icon,
.webbo-icon-list-effect-blink .elementor-icon-list-item:nth-child(2) .elementor-icon-list-icon,
.webbo-icon-list-effect-ping .elementor-icon-list-item:nth-child(2) .elementor-icon-list-icon::after {
    animation-delay: var(--webbo-icon-list-stagger, 0ms);
}

.webbo-icon-list-effect-pulse .elementor-icon-list-item:nth-child(3) .elementor-icon-list-icon,
.webbo-icon-list-effect-blink .elementor-icon-list-item:nth-child(3) .elementor-icon-list-icon,
.webbo-icon-list-effect-ping .elementor-icon-list-item:nth-child(3) .elementor-icon-list-icon::after {
    animation-delay: calc(var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms));
}

.webbo-icon-list-effect-pulse .elementor-icon-list-item:nth-child(4) .elementor-icon-list-icon,
.webbo-icon-list-effect-blink .elementor-icon-list-item:nth-child(4) .elementor-icon-list-icon,
.webbo-icon-list-effect-ping .elementor-icon-list-item:nth-child(4) .elementor-icon-list-icon::after {
    animation-delay: calc(var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms));
}

.webbo-icon-list-effect-pulse .elementor-icon-list-item:nth-child(5) .elementor-icon-list-icon,
.webbo-icon-list-effect-blink .elementor-icon-list-item:nth-child(5) .elementor-icon-list-icon,
.webbo-icon-list-effect-ping .elementor-icon-list-item:nth-child(5) .elementor-icon-list-icon::after {
    animation-delay: calc(var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms));
}

.webbo-icon-list-effect-pulse .elementor-icon-list-item:nth-child(6) .elementor-icon-list-icon,
.webbo-icon-list-effect-blink .elementor-icon-list-item:nth-child(6) .elementor-icon-list-icon,
.webbo-icon-list-effect-ping .elementor-icon-list-item:nth-child(6) .elementor-icon-list-icon::after {
    animation-delay: calc(var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms));
}

.webbo-icon-list-effect-pulse .elementor-icon-list-item:nth-child(7) .elementor-icon-list-icon,
.webbo-icon-list-effect-blink .elementor-icon-list-item:nth-child(7) .elementor-icon-list-icon,
.webbo-icon-list-effect-ping .elementor-icon-list-item:nth-child(7) .elementor-icon-list-icon::after {
    animation-delay: calc(var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms));
}

.webbo-icon-list-effect-pulse .elementor-icon-list-item:nth-child(8) .elementor-icon-list-icon,
.webbo-icon-list-effect-blink .elementor-icon-list-item:nth-child(8) .elementor-icon-list-icon,
.webbo-icon-list-effect-ping .elementor-icon-list-item:nth-child(8) .elementor-icon-list-icon::after {
    animation-delay: calc(var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms));
}

.webbo-icon-list-effect-pulse .elementor-icon-list-item:nth-child(9) .elementor-icon-list-icon,
.webbo-icon-list-effect-blink .elementor-icon-list-item:nth-child(9) .elementor-icon-list-icon,
.webbo-icon-list-effect-ping .elementor-icon-list-item:nth-child(9) .elementor-icon-list-icon::after {
    animation-delay: calc(var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms));
}

.webbo-icon-list-effect-pulse .elementor-icon-list-item:nth-child(10) .elementor-icon-list-icon,
.webbo-icon-list-effect-blink .elementor-icon-list-item:nth-child(10) .elementor-icon-list-icon,
.webbo-icon-list-effect-ping .elementor-icon-list-item:nth-child(10) .elementor-icon-list-icon::after {
    animation-delay: calc(var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms) + var(--webbo-icon-list-stagger, 0ms));
}

@keyframes webbo-icon-list-pulse {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: var(--webbo-icon-list-min-opacity, .42);
        transform: scale(var(--webbo-icon-list-min-scale, .92));
    }
}

@keyframes webbo-icon-list-ping {
    0% {
        opacity: var(--webbo-icon-list-ping-opacity, .38);
        transform: translate(-50%, -50%) scale(.72);
    }
    72%, 100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(var(--webbo-icon-list-ping-scale, 2.15));
    }
}

@keyframes webbo-icon-list-blink {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: var(--webbo-icon-list-min-opacity, .42);
        transform: scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .webbo-icon-list-effect-pulse .elementor-icon-list-icon,
    .webbo-icon-list-effect-blink .elementor-icon-list-icon,
    .webbo-icon-list-effect-ping .elementor-icon-list-icon::after {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        will-change: auto;
    }

    .webbo-icon-list-effect-ping .elementor-icon-list-icon::after {
        display: none;
    }
}