/* ============================================
   Image Glitch Effect - WordPress Plugin
   Version: 1.0.0
   ============================================ */

/* ---- Base Wrapper ---- */
.ige-glitch-wrapper {
    position: relative;
    display: inline-block;
    overflow: hidden;
    cursor: default;
    -webkit-user-select: none;
    user-select: none;
    max-width: 100%;
}

.ige-glitch-wrapper img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
}

.ige-main-image {
    position: relative;
    z-index: 1;
    display: block;
}

/* ---- Glitch Layers (hidden by default) ---- */
.ige-glitch-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
}

.ige-glitch-layer img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ige-glitch-scanlines {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    pointer-events: none;
    opacity: 0;
    background: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 2px,
        rgba(0, 0, 0, 0.08) 2px,
        rgba(0, 0, 0, 0.08) 4px
    );
}

.ige-glitch-layer-noise {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 4;
    pointer-events: none;
    opacity: 0;
}

/* ============================================
   TYPE: RGB (Chromatic Aberration)
   ============================================ */
.ige-type-rgb .ige-layer-1 img {
    mix-blend-mode: screen;
    filter: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><filter id='r'><feColorMatrix type='matrix' values='1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0'/></filter></svg>#r") brightness(1.2);
}

.ige-type-rgb .ige-layer-2 img {
    mix-blend-mode: screen;
    filter: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><filter id='c'><feColorMatrix type='matrix' values='0 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0'/></filter></svg>#c") brightness(1.2);
}

/* Hover trigger - RGB */
.ige-type-rgb.ige-trigger-hover:hover .ige-layer-1,
.ige-type-rgb.ige-trigger-hover:hover .ige-layer-2 {
    opacity: 1;
}

/* Intensity: Low */
.ige-type-rgb.ige-intensity-low.ige-trigger-hover:hover .ige-layer-1 img {
    transform: translateX(-3px);
    animation: ige-rgb-r-low 0.6s steps(1) infinite;
}
.ige-type-rgb.ige-intensity-low.ige-trigger-hover:hover .ige-layer-2 img {
    transform: translateX(3px);
    animation: ige-rgb-c-low 0.6s steps(1) infinite;
}

/* Intensity: Medium */
.ige-type-rgb.ige-intensity-medium.ige-trigger-hover:hover .ige-layer-1 img {
    animation: ige-rgb-r-medium 0.4s steps(2) infinite;
}
.ige-type-rgb.ige-intensity-medium.ige-trigger-hover:hover .ige-layer-2 img {
    animation: ige-rgb-c-medium 0.4s steps(2) infinite;
}

/* Intensity: High */
.ige-type-rgb.ige-intensity-high.ige-trigger-hover:hover .ige-layer-1 img {
    animation: ige-rgb-r-high 0.2s steps(3) infinite;
}
.ige-type-rgb.ige-intensity-high.ige-trigger-hover:hover .ige-layer-2 img {
    animation: ige-rgb-c-high 0.2s steps(3) infinite;
}

/* RGB Auto-play (intensity medium default) */
.ige-type-rgb.ige-trigger-auto .ige-layer-1,
.ige-type-rgb.ige-trigger-auto .ige-layer-2 {
    opacity: 1;
}
.ige-type-rgb.ige-trigger-auto.ige-intensity-low .ige-layer-1 img {
    animation: ige-rgb-r-low 1.5s steps(1) infinite;
}
.ige-type-rgb.ige-trigger-auto.ige-intensity-low .ige-layer-2 img {
    animation: ige-rgb-c-low 1.5s steps(1) infinite;
}
.ige-type-rgb.ige-trigger-auto.ige-intensity-medium .ige-layer-1 img {
    animation: ige-rgb-r-medium 0.8s steps(2) infinite;
}
.ige-type-rgb.ige-trigger-auto.ige-intensity-medium .ige-layer-2 img {
    animation: ige-rgb-c-medium 0.8s steps(2) infinite;
}
.ige-type-rgb.ige-trigger-auto.ige-intensity-high .ige-layer-1 img {
    animation: ige-rgb-r-high 0.3s steps(3) infinite;
}
.ige-type-rgb.ige-trigger-auto.ige-intensity-high .ige-layer-2 img {
    animation: ige-rgb-c-high 0.3s steps(3) infinite;
}

/* RGB Keyframes */
@keyframes ige-rgb-r-low {
    0%   { transform: translateX(0); }
    20%  { transform: translateX(-4px) translateY(1px); }
    40%  { transform: translateX(0); }
    60%  { transform: translateX(-2px); }
    100% { transform: translateX(0); }
}
@keyframes ige-rgb-c-low {
    0%   { transform: translateX(0); }
    20%  { transform: translateX(4px) translateY(-1px); }
    40%  { transform: translateX(0); }
    60%  { transform: translateX(2px); }
    100% { transform: translateX(0); }
}
@keyframes ige-rgb-r-medium {
    0%   { transform: translateX(0) translateY(0); }
    15%  { transform: translateX(-8px) translateY(2px); }
    30%  { transform: translateX(4px) translateY(-1px); }
    45%  { transform: translateX(-6px) translateY(1px); }
    60%  { transform: translateX(0); }
    75%  { transform: translateX(8px) translateY(-2px); }
    100% { transform: translateX(0); }
}
@keyframes ige-rgb-c-medium {
    0%   { transform: translateX(0) translateY(0); }
    15%  { transform: translateX(8px) translateY(-2px); }
    30%  { transform: translateX(-4px) translateY(1px); }
    45%  { transform: translateX(6px) translateY(-1px); }
    60%  { transform: translateX(0); }
    75%  { transform: translateX(-8px) translateY(2px); }
    100% { transform: translateX(0); }
}
@keyframes ige-rgb-r-high {
    0%   { transform: translateX(0) translateY(0) skewX(0); }
    10%  { transform: translateX(-14px) translateY(3px) skewX(-2deg); }
    20%  { transform: translateX(8px) translateY(-2px) skewX(1deg); }
    30%  { transform: translateX(-10px) translateY(4px); }
    40%  { transform: translateX(12px) translateY(-3px) skewX(2deg); }
    50%  { transform: translateX(-6px) translateY(1px); }
    60%  { transform: translateX(0); }
    70%  { transform: translateX(14px) translateY(-4px) skewX(-1deg); }
    80%  { transform: translateX(-8px) translateY(2px); }
    90%  { transform: translateX(4px) translateY(-1px); }
    100% { transform: translateX(0); }
}
@keyframes ige-rgb-c-high {
    0%   { transform: translateX(0) translateY(0) skewX(0); }
    10%  { transform: translateX(14px) translateY(-3px) skewX(2deg); }
    20%  { transform: translateX(-8px) translateY(2px) skewX(-1deg); }
    30%  { transform: translateX(10px) translateY(-4px); }
    40%  { transform: translateX(-12px) translateY(3px) skewX(-2deg); }
    50%  { transform: translateX(6px) translateY(-1px); }
    60%  { transform: translateX(0); }
    70%  { transform: translateX(-14px) translateY(4px) skewX(1deg); }
    80%  { transform: translateX(8px) translateY(-2px); }
    90%  { transform: translateX(-4px) translateY(1px); }
    100% { transform: translateX(0); }
}

/* ============================================
   TYPE: SLICE (Horizontal Slice Distortion)
   ============================================ */
.ige-type-slice.ige-trigger-hover:hover .ige-layer-1,
.ige-type-slice.ige-trigger-hover:hover .ige-layer-2,
.ige-type-slice.ige-trigger-hover:hover .ige-glitch-scanlines {
    opacity: 1;
}

/* Low */
.ige-type-slice.ige-intensity-low.ige-trigger-hover:hover .ige-layer-1 img {
    animation: ige-slice-1-low 0.8s steps(2) infinite;
    clip-path: polygon(0 10%, 100% 10%, 100% 30%, 0 30%);
}
.ige-type-slice.ige-intensity-low.ige-trigger-hover:hover .ige-layer-2 img {
    animation: ige-slice-2-low 0.8s steps(2) infinite;
    clip-path: polygon(0 60%, 100% 60%, 100% 80%, 0 80%);
}

/* Medium */
.ige-type-slice.ige-intensity-medium.ige-trigger-hover:hover .ige-layer-1 img {
    animation: ige-slice-1-medium 0.5s steps(3) infinite;
}
.ige-type-slice.ige-intensity-medium.ige-trigger-hover:hover .ige-layer-2 img {
    animation: ige-slice-2-medium 0.5s steps(3) infinite;
}

/* High */
.ige-type-slice.ige-intensity-high.ige-trigger-hover:hover .ige-layer-1 img {
    animation: ige-slice-1-high 0.25s steps(4) infinite;
}
.ige-type-slice.ige-intensity-high.ige-trigger-hover:hover .ige-layer-2 img {
    animation: ige-slice-2-high 0.25s steps(4) infinite;
}

/* Slice Auto-play */
.ige-type-slice.ige-trigger-auto .ige-layer-1,
.ige-type-slice.ige-trigger-auto .ige-layer-2,
.ige-type-slice.ige-trigger-auto .ige-glitch-scanlines {
    opacity: 1;
}
.ige-type-slice.ige-trigger-auto.ige-intensity-low .ige-layer-1 img { animation: ige-slice-1-low 2s steps(2) infinite; clip-path: polygon(0 10%, 100% 10%, 100% 30%, 0 30%); }
.ige-type-slice.ige-trigger-auto.ige-intensity-low .ige-layer-2 img { animation: ige-slice-2-low 2s steps(2) infinite; clip-path: polygon(0 60%, 100% 60%, 100% 80%, 0 80%); }
.ige-type-slice.ige-trigger-auto.ige-intensity-medium .ige-layer-1 img { animation: ige-slice-1-medium 1s steps(3) infinite; }
.ige-type-slice.ige-trigger-auto.ige-intensity-medium .ige-layer-2 img { animation: ige-slice-2-medium 1s steps(3) infinite; }
.ige-type-slice.ige-trigger-auto.ige-intensity-high .ige-layer-1 img { animation: ige-slice-1-high 0.4s steps(4) infinite; }
.ige-type-slice.ige-trigger-auto.ige-intensity-high .ige-layer-2 img { animation: ige-slice-2-high 0.4s steps(4) infinite; }

/* Slice Keyframes */
@keyframes ige-slice-1-low {
    0%   { transform: translateX(0); clip-path: polygon(0 10%, 100% 10%, 100% 30%, 0 30%); }
    50%  { transform: translateX(-8px); clip-path: polygon(0 20%, 100% 20%, 100% 40%, 0 40%); }
    100% { transform: translateX(0); clip-path: polygon(0 10%, 100% 10%, 100% 30%, 0 30%); }
}
@keyframes ige-slice-2-low {
    0%   { transform: translateX(0); clip-path: polygon(0 60%, 100% 60%, 100% 80%, 0 80%); }
    50%  { transform: translateX(8px); clip-path: polygon(0 65%, 100% 65%, 100% 85%, 0 85%); }
    100% { transform: translateX(0); clip-path: polygon(0 60%, 100% 60%, 100% 80%, 0 80%); }
}
@keyframes ige-slice-1-medium {
    0%   { transform: translateX(0);    clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%); }
    25%  { transform: translateX(-12px); clip-path: polygon(0 25%, 100% 25%, 100% 40%, 0 40%); }
    50%  { transform: translateX(6px);  clip-path: polygon(0 50%, 100% 50%, 100% 65%, 0 65%); }
    75%  { transform: translateX(-8px); clip-path: polygon(0 70%, 100% 70%, 100% 85%, 0 85%); }
    100% { transform: translateX(0);    clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%); }
}
@keyframes ige-slice-2-medium {
    0%   { transform: translateX(0);   clip-path: polygon(0 80%, 100% 80%, 100% 95%, 0 95%); }
    25%  { transform: translateX(12px); clip-path: polygon(0 55%, 100% 55%, 100% 70%, 0 70%); }
    50%  { transform: translateX(-6px); clip-path: polygon(0 30%, 100% 30%, 100% 45%, 0 45%); }
    75%  { transform: translateX(8px);  clip-path: polygon(0 10%, 100% 10%, 100% 25%, 0 25%); }
    100% { transform: translateX(0);   clip-path: polygon(0 80%, 100% 80%, 100% 95%, 0 95%); }
}
@keyframes ige-slice-1-high {
    0%   { transform: translateX(0) skewY(0);      clip-path: polygon(0 2%, 100% 2%, 100% 15%, 0 15%); }
    20%  { transform: translateX(-20px) skewY(1deg); clip-path: polygon(0 20%, 100% 18%, 100% 35%, 0 37%); }
    40%  { transform: translateX(12px) skewY(-1deg); clip-path: polygon(0 45%, 100% 43%, 100% 58%, 0 60%); }
    60%  { transform: translateX(-16px) skewY(0.5deg); clip-path: polygon(0 62%, 100% 60%, 100% 75%, 0 77%); }
    80%  { transform: translateX(18px) skewY(-0.5deg); clip-path: polygon(0 80%, 100% 78%, 100% 93%, 0 95%); }
    100% { transform: translateX(0) skewY(0);      clip-path: polygon(0 2%, 100% 2%, 100% 15%, 0 15%); }
}
@keyframes ige-slice-2-high {
    0%   { transform: translateX(0) skewY(0);       clip-path: polygon(0 85%, 100% 87%, 100% 98%, 0 96%); }
    20%  { transform: translateX(20px) skewY(-1deg); clip-path: polygon(0 65%, 100% 63%, 100% 78%, 0 80%); }
    40%  { transform: translateX(-12px) skewY(1deg); clip-path: polygon(0 40%, 100% 42%, 100% 55%, 0 53%); }
    60%  { transform: translateX(16px) skewY(-0.5deg); clip-path: polygon(0 25%, 100% 27%, 100% 38%, 0 36%); }
    80%  { transform: translateX(-18px) skewY(0.5deg); clip-path: polygon(0 5%, 100% 7%, 100% 18%, 0 16%); }
    100% { transform: translateX(0) skewY(0);       clip-path: polygon(0 85%, 100% 87%, 100% 98%, 0 96%); }
}

/* ============================================
   TYPE: PIXEL (Pixel Corruption — RGB + Slice combo)
   ============================================ */
.ige-type-pixel.ige-trigger-hover:hover .ige-layer-1,
.ige-type-pixel.ige-trigger-hover:hover .ige-layer-2,
.ige-type-pixel.ige-trigger-hover:hover .ige-glitch-scanlines {
    opacity: 1;
}

.ige-type-pixel .ige-layer-1 img { mix-blend-mode: difference; }
.ige-type-pixel .ige-layer-2 img { mix-blend-mode: exclusion; }

/* Low */
.ige-type-pixel.ige-intensity-low.ige-trigger-hover:hover .ige-layer-1 img { animation: ige-pixel-1-low 0.7s steps(2) infinite; }
.ige-type-pixel.ige-intensity-low.ige-trigger-hover:hover .ige-layer-2 img { animation: ige-pixel-2-low 0.7s steps(2) infinite; }
/* Medium */
.ige-type-pixel.ige-intensity-medium.ige-trigger-hover:hover .ige-layer-1 img { animation: ige-pixel-1-medium 0.45s steps(3) infinite; }
.ige-type-pixel.ige-intensity-medium.ige-trigger-hover:hover .ige-layer-2 img { animation: ige-pixel-2-medium 0.45s steps(3) infinite; }
/* High */
.ige-type-pixel.ige-intensity-high.ige-trigger-hover:hover .ige-layer-1 img { animation: ige-pixel-1-high 0.2s steps(4) infinite; }
.ige-type-pixel.ige-intensity-high.ige-trigger-hover:hover .ige-layer-2 img { animation: ige-pixel-2-high 0.2s steps(4) infinite; }

/* Auto */
.ige-type-pixel.ige-trigger-auto .ige-layer-1,
.ige-type-pixel.ige-trigger-auto .ige-layer-2,
.ige-type-pixel.ige-trigger-auto .ige-glitch-scanlines {
    opacity: 1;
}
.ige-type-pixel.ige-trigger-auto.ige-intensity-low .ige-layer-1 img { animation: ige-pixel-1-low 1.8s steps(2) infinite; }
.ige-type-pixel.ige-trigger-auto.ige-intensity-low .ige-layer-2 img { animation: ige-pixel-2-low 1.8s steps(2) infinite; }
.ige-type-pixel.ige-trigger-auto.ige-intensity-medium .ige-layer-1 img { animation: ige-pixel-1-medium 0.9s steps(3) infinite; }
.ige-type-pixel.ige-trigger-auto.ige-intensity-medium .ige-layer-2 img { animation: ige-pixel-2-medium 0.9s steps(3) infinite; }
.ige-type-pixel.ige-trigger-auto.ige-intensity-high .ige-layer-1 img { animation: ige-pixel-1-high 0.3s steps(4) infinite; }
.ige-type-pixel.ige-trigger-auto.ige-intensity-high .ige-layer-2 img { animation: ige-pixel-2-high 0.3s steps(4) infinite; }

@keyframes ige-pixel-1-low {
    0%   { transform: translate(0, 0); clip-path: none; filter: hue-rotate(0deg); }
    50%  { transform: translate(-5px, 3px); clip-path: polygon(0 15%, 100% 15%, 100% 35%, 0 35%); filter: hue-rotate(30deg); }
    100% { transform: translate(0, 0); clip-path: none; filter: hue-rotate(0deg); }
}
@keyframes ige-pixel-2-low {
    0%   { transform: translate(0, 0); clip-path: none; filter: hue-rotate(0deg); }
    50%  { transform: translate(5px, -3px); clip-path: polygon(0 65%, 100% 65%, 100% 85%, 0 85%); filter: hue-rotate(-30deg); }
    100% { transform: translate(0, 0); clip-path: none; filter: hue-rotate(0deg); }
}
@keyframes ige-pixel-1-medium {
    0%   { transform: translate(0, 0);      filter: hue-rotate(0deg); clip-path: polygon(0 0%, 100% 0%, 100% 100%, 0 100%); }
    20%  { transform: translate(-10px, 4px); filter: hue-rotate(60deg); clip-path: polygon(0 10%, 100% 8%, 100% 28%, 0 30%); }
    40%  { transform: translate(6px, -3px); filter: hue-rotate(-40deg); clip-path: polygon(0 45%, 100% 43%, 100% 63%, 0 65%); }
    60%  { transform: translate(-8px, 5px); filter: hue-rotate(90deg); clip-path: polygon(0 70%, 100% 68%, 100% 88%, 0 90%); }
    80%  { transform: translate(4px, -2px); filter: hue-rotate(-20deg); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
    100% { transform: translate(0, 0);      filter: hue-rotate(0deg); clip-path: polygon(0 0%, 100% 0%, 100% 100%, 0 100%); }
}
@keyframes ige-pixel-2-medium {
    0%   { transform: translate(0, 0);      filter: hue-rotate(0deg); clip-path: polygon(0 0%, 100% 0%, 100% 100%, 0 100%); }
    20%  { transform: translate(10px, -4px); filter: hue-rotate(-60deg); clip-path: polygon(0 72%, 100% 70%, 100% 90%, 0 92%); }
    40%  { transform: translate(-6px, 3px); filter: hue-rotate(40deg); clip-path: polygon(0 37%, 100% 35%, 100% 55%, 0 57%); }
    60%  { transform: translate(8px, -5px); filter: hue-rotate(-90deg); clip-path: polygon(0 12%, 100% 10%, 100% 30%, 0 32%); }
    80%  { transform: translate(-4px, 2px); filter: hue-rotate(20deg); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
    100% { transform: translate(0, 0);      filter: hue-rotate(0deg); clip-path: polygon(0 0%, 100% 0%, 100% 100%, 0 100%); }
}
@keyframes ige-pixel-1-high {
    0%   { transform: translate(0, 0) skewX(0);        filter: hue-rotate(0deg) saturate(1); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
    12%  { transform: translate(-15px, 5px) skewX(-3deg); filter: hue-rotate(120deg) saturate(3); clip-path: polygon(0 5%, 100% 3%, 100% 22%, 0 24%); }
    24%  { transform: translate(9px, -4px) skewX(2deg);  filter: hue-rotate(-80deg) saturate(2); clip-path: polygon(0 30%, 100% 28%, 100% 47%, 0 49%); }
    36%  { transform: translate(-12px, 7px) skewX(-1deg); filter: hue-rotate(180deg) saturate(4); clip-path: polygon(0 52%, 100% 50%, 100% 69%, 0 71%); }
    48%  { transform: translate(14px, -6px) skewX(3deg);  filter: hue-rotate(-150deg) saturate(3); clip-path: polygon(0 74%, 100% 72%, 100% 91%, 0 93%); }
    60%  { transform: translate(-7px, 3px) skewX(0);   filter: hue-rotate(60deg) saturate(2); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
    72%  { transform: translate(11px, -5px) skewX(-2deg); filter: hue-rotate(-200deg) saturate(3); clip-path: polygon(0 18%, 100% 16%, 100% 35%, 0 37%); }
    84%  { transform: translate(-9px, 4px) skewX(1deg);  filter: hue-rotate(90deg) saturate(2); clip-path: polygon(0 60%, 100% 58%, 100% 77%, 0 79%); }
    100% { transform: translate(0, 0) skewX(0);        filter: hue-rotate(0deg) saturate(1); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
}
@keyframes ige-pixel-2-high {
    0%   { transform: translate(0, 0) skewX(0);        filter: hue-rotate(0deg) saturate(1) invert(0); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
    12%  { transform: translate(15px, -5px) skewX(3deg); filter: hue-rotate(-120deg) saturate(3) invert(0.1); clip-path: polygon(0 78%, 100% 76%, 100% 95%, 0 97%); }
    24%  { transform: translate(-9px, 4px) skewX(-2deg); filter: hue-rotate(80deg) saturate(2) invert(0); clip-path: polygon(0 53%, 100% 51%, 100% 70%, 0 72%); }
    36%  { transform: translate(12px, -7px) skewX(1deg); filter: hue-rotate(-180deg) saturate(4) invert(0.05); clip-path: polygon(0 28%, 100% 26%, 100% 45%, 0 47%); }
    48%  { transform: translate(-14px, 6px) skewX(-3deg); filter: hue-rotate(150deg) saturate(3) invert(0); clip-path: polygon(0 6%, 100% 4%, 100% 23%, 0 25%); }
    60%  { transform: translate(7px, -3px) skewX(0);   filter: hue-rotate(-60deg) saturate(2) invert(0); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
    72%  { transform: translate(-11px, 5px) skewX(2deg); filter: hue-rotate(200deg) saturate(3) invert(0.08); clip-path: polygon(0 42%, 100% 40%, 100% 59%, 0 61%); }
    84%  { transform: translate(9px, -4px) skewX(-1deg); filter: hue-rotate(-90deg) saturate(2) invert(0); clip-path: polygon(0 20%, 100% 18%, 100% 37%, 0 39%); }
    100% { transform: translate(0, 0) skewX(0);        filter: hue-rotate(0deg) saturate(1) invert(0); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
}

/* ============================================
   TYPE: NOISE (Scanlines + Noise Overlay)
   ============================================ */
.ige-type-noise.ige-trigger-hover:hover .ige-glitch-scanlines,
.ige-type-noise.ige-trigger-hover:hover .ige-layer-1 {
    opacity: 1;
}

.ige-type-noise .ige-glitch-scanlines {
    background: repeating-linear-gradient(
        0deg,
        transparent,
        transparent 2px,
        rgba(0, 0, 0, 0.12) 2px,
        rgba(0, 0, 0, 0.12) 4px
    );
}

/* Low */
.ige-type-noise.ige-intensity-low.ige-trigger-hover:hover .ige-layer-1 { opacity: 0.15; }
.ige-type-noise.ige-intensity-low.ige-trigger-hover:hover .ige-layer-1 img { animation: ige-noise-low 0.8s steps(2) infinite; filter: grayscale(0.3) contrast(1.2); }
/* Medium */
.ige-type-noise.ige-intensity-medium.ige-trigger-hover:hover .ige-layer-1 { opacity: 0.25; }
.ige-type-noise.ige-intensity-medium.ige-trigger-hover:hover .ige-layer-1 img { animation: ige-noise-medium 0.5s steps(3) infinite; filter: grayscale(0.5) contrast(1.4) brightness(1.2); }
/* High */
.ige-type-noise.ige-intensity-high.ige-trigger-hover:hover .ige-layer-1 { opacity: 0.4; }
.ige-type-noise.ige-intensity-high.ige-trigger-hover:hover .ige-layer-1 img { animation: ige-noise-high 0.25s steps(4) infinite; filter: grayscale(1) contrast(2) brightness(1.5); }

/* Auto */
.ige-type-noise.ige-trigger-auto .ige-glitch-scanlines { opacity: 1; }
.ige-type-noise.ige-trigger-auto .ige-layer-1 { opacity: 1; }
.ige-type-noise.ige-trigger-auto.ige-intensity-low .ige-layer-1 { opacity: 0.1; }
.ige-type-noise.ige-trigger-auto.ige-intensity-low .ige-layer-1 img { animation: ige-noise-low 2s steps(2) infinite; filter: grayscale(0.2) contrast(1.1); }
.ige-type-noise.ige-trigger-auto.ige-intensity-medium .ige-layer-1 { opacity: 0.2; }
.ige-type-noise.ige-trigger-auto.ige-intensity-medium .ige-layer-1 img { animation: ige-noise-medium 1s steps(3) infinite; filter: grayscale(0.4) contrast(1.3); }
.ige-type-noise.ige-trigger-auto.ige-intensity-high .ige-layer-1 { opacity: 0.3; }
.ige-type-noise.ige-trigger-auto.ige-intensity-high .ige-layer-1 img { animation: ige-noise-high 0.4s steps(4) infinite; filter: grayscale(0.8) contrast(1.8) brightness(1.3); }

.ige-type-noise .ige-layer-2 { display: none; }

@keyframes ige-noise-low {
    0%   { transform: translate(0, 0); }
    33%  { transform: translate(-2px, 1px); }
    66%  { transform: translate(2px, -1px); }
    100% { transform: translate(0, 0); }
}
@keyframes ige-noise-medium {
    0%   { transform: translate(0, 0) scale(1); }
    25%  { transform: translate(-4px, 2px) scale(1.005); }
    50%  { transform: translate(3px, -2px) scale(0.998); }
    75%  { transform: translate(-2px, 3px) scale(1.003); }
    100% { transform: translate(0, 0) scale(1); }
}
@keyframes ige-noise-high {
    0%   { transform: translate(0, 0) scale(1) rotate(0deg); }
    20%  { transform: translate(-6px, 3px) scale(1.01) rotate(0.3deg); }
    40%  { transform: translate(5px, -4px) scale(0.995) rotate(-0.2deg); }
    60%  { transform: translate(-4px, 5px) scale(1.008) rotate(0.1deg); }
    80%  { transform: translate(7px, -3px) scale(0.992) rotate(-0.3deg); }
    100% { transform: translate(0, 0) scale(1) rotate(0deg); }
}

/* ============================================
   SCANLINES (shared)
   ============================================ */
.ige-type-slice.ige-trigger-hover:hover .ige-glitch-scanlines,
.ige-type-pixel.ige-trigger-hover:hover .ige-glitch-scanlines,
.ige-type-slice.ige-trigger-auto .ige-glitch-scanlines,
.ige-type-pixel.ige-trigger-auto .ige-glitch-scanlines {
    opacity: 1;
    animation: ige-scanlines 8s linear infinite;
}

@keyframes ige-scanlines {
    0%   { background-position: 0 0; }
    100% { background-position: 0 100%; }
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 768px) {
    .ige-glitch-wrapper {
        display: block;
        width: 100% !important;
    }
}

/* ============================================
   ACCESSIBILITY: Respect prefers-reduced-motion
   ============================================ */
@media (prefers-reduced-motion: reduce) {
    .ige-glitch-layer img,
    .ige-glitch-scanlines {
        animation: none !important;
        transform: none !important;
    }
    .ige-glitch-layer {
        display: none !important;
    }
}
