/**
 * Divi Image Assist — Shared Image Reveal Effect styles.
 *
 * Module-agnostic: every rule keys off `.dia-reveal-enabled` (placed on the
 * module wrapper) plus the `.dia-reveal-*` state/type classes and the
 * `.dia-reveal` overlay element. No module-specific selectors, so a single
 * stylesheet powers the reveal effect across all Divi Image Assist modules.
 *
 * @author Divi Assist
 */

/* Ensure the wrapper is a positioning context for the absolute overlay. */
.dia-reveal-enabled {
	position: relative;
}

/* The reveal overlay covers the wrapper, above its content. It is covered by
   default so the content starts hidden on first paint (no flash of the image
   before the reveal). JavaScript then animates the overlay away; a <noscript>
   fallback (printed by the plugin) hides the overlay when JS is unavailable so
   content is never permanently hidden. */
.dia-reveal-enabled .dia-reveal {
	position: absolute;
	inset: 0;
	z-index: 10;
	overflow: hidden;
	pointer-events: none;
	border-radius: inherit;
	opacity: 1;
}

/* Cover parts: the colored panels that hide the image before revealing.
   A solid black default guarantees a visible cover on the front end; the
   native Divi overlay background field overrides it with a higher-specificity
   rule ({order_class} .dia-reveal__cover) when the user sets a color/gradient. */
.dia-reveal__cover,
.dia-reveal__half,
.dia-reveal__slat {
	position: absolute;
	background-color: #000000;
	will-change: transform, opacity, clip-path;
	backface-visibility: hidden;
}

.dia-reveal__cover {
	inset: 0;
}

/* Per-type covering geometry (state before the animation runs). */
.dia-reveal-type-circle .dia-reveal__cover {
	clip-path: circle( 150% at 50% 50% );
}

.dia-reveal-type-wave .dia-reveal__cover {
	--dia-wave-h: var( --dia-reveal-wave-intensity, 40px );
	-webkit-mask:
		linear-gradient( #000, #000 ) top / 100% calc( 100% - var( --dia-wave-h ) + 1px ) no-repeat,
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 40' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M0,20 C90,18 150,27 250,26 C360,25 400,15 520,16 C620,17 660,25 780,24 C880,23 930,16 1040,17 C1120,18 1160,21 1200,21 L1200,0 L0,0 Z'/%3E%3C/svg%3E") bottom / 100% var( --dia-wave-h ) no-repeat;
	mask:
		linear-gradient( #000, #000 ) top / 100% calc( 100% - var( --dia-wave-h ) + 1px ) no-repeat,
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 40' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M0,20 C90,18 150,27 250,26 C360,25 400,15 520,16 C620,17 660,25 780,24 C880,23 930,16 1040,17 C1120,18 1160,21 1200,21 L1200,0 L0,0 Z'/%3E%3C/svg%3E") bottom / 100% var( --dia-wave-h ) no-repeat;
}

/* Split / curtain halves. */
.dia-reveal-type-split_vertical .dia-reveal__half--1,
.dia-reveal-type-curtain .dia-reveal__half--1 {
	top: 0;
	left: 0;
	width: 50%;
	height: 100%;
}

.dia-reveal-type-split_vertical .dia-reveal__half--2,
.dia-reveal-type-curtain .dia-reveal__half--2 {
	top: 0;
	right: 0;
	width: 50%;
	height: 100%;
}

.dia-reveal-type-curtain .dia-reveal__half--1 {
	transform-origin: left center;
}

.dia-reveal-type-curtain .dia-reveal__half--2 {
	transform-origin: right center;
}

.dia-reveal-type-split_horizontal .dia-reveal__half--1 {
	top: 0;
	left: 0;
	width: 100%;
	height: 50%;
}

.dia-reveal-type-split_horizontal .dia-reveal__half--2 {
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50%;
}

/* Blinds slats span the full opposite axis; position/size are set inline. */
.dia-reveal-type-blinds_horizontal .dia-reveal__slat {
	left: 0;
	width: 100%;
	transform-origin: center;
}

.dia-reveal-type-blinds_vertical .dia-reveal__slat {
	top: 0;
	height: 100%;
	transform-origin: center;
}

/* Shared animation properties applied once the reveal is triggered. */
.dia-reveal-active .dia-reveal__cover,
.dia-reveal-active .dia-reveal__half,
.dia-reveal-active .dia-reveal__slat {
	animation-duration: var( --dia-reveal-duration, 800ms );
	animation-delay: var( --dia-reveal-delay, 0ms );
	animation-timing-function: var( --dia-reveal-easing, ease );
	animation-iteration-count: var( --dia-reveal-iterations, 1 );
	animation-fill-mode: forwards;
}

/* Per-type animation names. */
.dia-reveal-active.dia-reveal-type-left_to_right .dia-reveal__cover { animation-name: dia-rv-ltr; }
.dia-reveal-active.dia-reveal-type-right_to_left .dia-reveal__cover { animation-name: dia-rv-rtl; }
.dia-reveal-active.dia-reveal-type-top_to_bottom .dia-reveal__cover { animation-name: dia-rv-ttb; }
.dia-reveal-active.dia-reveal-type-bottom_to_top .dia-reveal__cover { animation-name: dia-rv-btt; }
.dia-reveal-active.dia-reveal-type-center_out .dia-reveal__cover { animation-name: dia-rv-center; }
.dia-reveal-active.dia-reveal-type-edge_in .dia-reveal__cover { animation-name: dia-rv-edge; }
.dia-reveal-active.dia-reveal-type-circle .dia-reveal__cover { animation-name: dia-rv-circle; }
.dia-reveal-active.dia-reveal-type-zoom .dia-reveal__cover { animation-name: dia-rv-zoom; }
.dia-reveal-active.dia-reveal-type-fade .dia-reveal__cover { animation-name: dia-rv-fade; }
.dia-reveal-active.dia-reveal-type-wave .dia-reveal__cover { animation-name: dia-rv-wave; }
.dia-reveal-active.dia-reveal-type-diagonal_top_left .dia-reveal__cover { animation-name: dia-rv-diag-tl; }
.dia-reveal-active.dia-reveal-type-diagonal_top_right .dia-reveal__cover { animation-name: dia-rv-diag-tr; }
.dia-reveal-active.dia-reveal-type-diagonal_bottom_left .dia-reveal__cover { animation-name: dia-rv-diag-bl; }
.dia-reveal-active.dia-reveal-type-diagonal_bottom_right .dia-reveal__cover { animation-name: dia-rv-diag-br; }

.dia-reveal-active.dia-reveal-type-split_vertical .dia-reveal__half--1 { animation-name: dia-rv-split-left; }
.dia-reveal-active.dia-reveal-type-split_vertical .dia-reveal__half--2 { animation-name: dia-rv-split-right; }
.dia-reveal-active.dia-reveal-type-split_horizontal .dia-reveal__half--1 { animation-name: dia-rv-split-up; }
.dia-reveal-active.dia-reveal-type-split_horizontal .dia-reveal__half--2 { animation-name: dia-rv-split-down; }
.dia-reveal-active.dia-reveal-type-curtain .dia-reveal__half--1 { animation-name: dia-rv-curtain-left; }
.dia-reveal-active.dia-reveal-type-curtain .dia-reveal__half--2 { animation-name: dia-rv-curtain-right; }

.dia-reveal-active.dia-reveal-type-blinds_horizontal .dia-reveal__slat { animation-name: dia-rv-blinds-h; }
.dia-reveal-active.dia-reveal-type-blinds_vertical .dia-reveal__slat { animation-name: dia-rv-blinds-v; }

/* Keyframes — overlay parts move from covering to cleared. */
@keyframes dia-rv-ltr { from { transform: translateX( 0 ); } to { transform: translateX( 100% ); } }
@keyframes dia-rv-rtl { from { transform: translateX( 0 ); } to { transform: translateX( -100% ); } }
@keyframes dia-rv-ttb { from { transform: translateY( 0 ); } to { transform: translateY( 100% ); } }
@keyframes dia-rv-btt { from { transform: translateY( 0 ); } to { transform: translateY( -100% ); } }
@keyframes dia-rv-center { from { transform: scale( 1 ); } to { transform: scale( 0 ); } }
@keyframes dia-rv-edge { from { clip-path: inset( 0 0 0 0 ); } to { clip-path: inset( 50% 50% 50% 50% ); } }
@keyframes dia-rv-circle { from { clip-path: circle( 150% at 50% 50% ); } to { clip-path: circle( 0% at 50% 50% ); } }
@keyframes dia-rv-zoom { from { transform: scale( 1 ); opacity: 1; } to { transform: scale( 1.4 ); opacity: 0; } }
@keyframes dia-rv-fade { from { opacity: 1; } to { opacity: 0; } }
@keyframes dia-rv-wave { from { transform: translateY( 0 ); } to { transform: translateY( -100% ); } }
@keyframes dia-rv-diag-tl { from { transform: translate( 0, 0 ); } to { transform: translate( -100%, -100% ); } }
@keyframes dia-rv-diag-tr { from { transform: translate( 0, 0 ); } to { transform: translate( 100%, -100% ); } }
@keyframes dia-rv-diag-bl { from { transform: translate( 0, 0 ); } to { transform: translate( -100%, 100% ); } }
@keyframes dia-rv-diag-br { from { transform: translate( 0, 0 ); } to { transform: translate( 100%, 100% ); } }
@keyframes dia-rv-split-left { from { transform: translateX( 0 ); } to { transform: translateX( -100% ); } }
@keyframes dia-rv-split-right { from { transform: translateX( 0 ); } to { transform: translateX( 100% ); } }
@keyframes dia-rv-split-up { from { transform: translateY( 0 ); } to { transform: translateY( -100% ); } }
@keyframes dia-rv-split-down { from { transform: translateY( 0 ); } to { transform: translateY( 100% ); } }
@keyframes dia-rv-curtain-left { from { transform: scaleX( 1 ); } to { transform: scaleX( 0 ); } }
@keyframes dia-rv-curtain-right { from { transform: scaleX( 1 ); } to { transform: scaleX( 0 ); } }
@keyframes dia-rv-blinds-h { from { transform: scaleY( 1 ); } to { transform: scaleY( 0 ); } }
@keyframes dia-rv-blinds-v { from { transform: scaleX( 1 ); } to { transform: scaleX( 0 ); } }

/* Phase 2 — Modern / premium reveal effects */
@property --dia-spot-r { syntax: '<percentage>'; inherits: false; initial-value: 0%; }
@property --dia-ink-r { syntax: '<percentage>'; inherits: false; initial-value: 0%; }

/* Image-affecting effects: Soft Blur & Zoom Blur (target any image in wrapper). */
.dia-reveal-enabled.dia-reveal-type-soft_blur.dia-reveal-ready img,
.dia-reveal-enabled.dia-reveal-type-zoom_blur.dia-reveal-ready img {
	transition:
		filter var( --dia-reveal-duration, 800ms ) var( --dia-reveal-easing, ease ) var( --dia-reveal-delay, 0ms ),
		transform var( --dia-reveal-duration, 800ms ) var( --dia-reveal-easing, ease ) var( --dia-reveal-delay, 0ms );
}

.dia-reveal-enabled.dia-reveal-type-soft_blur.dia-reveal-ready:not( .dia-reveal-active ) img {
	filter: blur( var( --dia-reveal-blur, 12px ) );
	transition: none;
}

.dia-reveal-enabled.dia-reveal-type-zoom_blur.dia-reveal-ready:not( .dia-reveal-active ) img {
	filter: blur( var( --dia-reveal-blur, 12px ) );
	transform: scale( 1.15 );
	transition: none;
}

.dia-reveal-active.dia-reveal-type-soft_blur .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-zoom_blur .dia-reveal__cover {
	animation-name: dia-rv-fade;
}

/* Glass Reveal (frosted) — translucent, not a solid fill. */
.dia-reveal-type-glass_reveal .dia-reveal__cover {
	background-color: transparent;
	-webkit-backdrop-filter: blur( var( --dia-reveal-blur, 12px ) );
	backdrop-filter: blur( var( --dia-reveal-blur, 12px ) );
	box-shadow: inset 0 1px 0 rgba( 255, 255, 255, 0.25 ), inset 0 0 50px rgba( 255, 255, 255, 0.06 );
}

.dia-reveal-type-glass_reveal .dia-reveal__cover::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient( 135deg, var( --dia-reveal-secondary-color, #fff ) 0%, transparent 60% );
	opacity: 0.22;
	pointer-events: none;
}

.dia-reveal-type-glass_reveal.dia-reveal-ready:not( .dia-reveal-active ) .dia-reveal__cover {
	opacity: 0.6;
}

.dia-reveal-active.dia-reveal-type-glass_reveal .dia-reveal__cover { animation-name: dia-rv-glass; }

/* Pixel Reveal (checkerboard texture that fades out). */
.dia-reveal-type-pixel_reveal .dia-reveal__cover {
	background-image:
		linear-gradient( 45deg, rgba( 0, 0, 0, 0.22 ) 25%, transparent 25%, transparent 75%, rgba( 0, 0, 0, 0.22 ) 75% ),
		linear-gradient( 45deg, rgba( 0, 0, 0, 0.22 ) 25%, transparent 25%, transparent 75%, rgba( 0, 0, 0, 0.22 ) 75% );
	background-size: var( --dia-reveal-pixel-size, 20px ) var( --dia-reveal-pixel-size, 20px );
	background-position: 0 0, calc( var( --dia-reveal-pixel-size, 20px ) / 2 ) calc( var( --dia-reveal-pixel-size, 20px ) / 2 );
}

.dia-reveal-active.dia-reveal-type-pixel_reveal .dia-reveal__cover { animation-name: dia-rv-fade; }

/* Shimmer Reveal. */
.dia-reveal-type-shimmer_reveal .dia-reveal__cover::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient( 60deg, transparent 35%, var( --dia-reveal-secondary-color, #fff ) 50%, transparent 65% );
	opacity: 0.7;
	transform: translateX( -100% );
	pointer-events: none;
}

.dia-reveal-active.dia-reveal-type-shimmer_reveal .dia-reveal__cover::before {
	animation: dia-rv-shimmer var( --dia-reveal-duration, 800ms ) var( --dia-reveal-easing, ease ) var( --dia-reveal-delay, 0ms ) var( --dia-reveal-iterations, 1 ) forwards;
}

.dia-reveal-active.dia-reveal-type-shimmer_reveal .dia-reveal__cover { animation-name: dia-rv-fade; }

/* Glow Reveal. */
.dia-reveal-type-glow_reveal .dia-reveal__cover::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient( circle, var( --dia-reveal-secondary-color, #fff ) 0%, transparent 70% );
	background-repeat: no-repeat;
	background-size: calc( var( --dia-reveal-glow-size, 40px ) * 3 ) 100%;
	background-position: -25% 50%;
	opacity: 0.85;
	mix-blend-mode: screen;
	pointer-events: none;
}

.dia-reveal-active.dia-reveal-type-glow_reveal .dia-reveal__cover::before {
	animation: dia-rv-glow var( --dia-reveal-duration, 800ms ) var( --dia-reveal-easing, ease ) var( --dia-reveal-delay, 0ms ) var( --dia-reveal-iterations, 1 ) forwards;
}

.dia-reveal-active.dia-reveal-type-glow_reveal .dia-reveal__cover { animation-name: dia-rv-fade; }

/* Secondary-color tint for organic effects. */
.dia-reveal-type-gradient_sweep .dia-reveal__cover::after,
.dia-reveal-type-liquid_reveal .dia-reveal__cover::after,
.dia-reveal-type-ink_spread .dia-reveal__cover::after,
.dia-reveal-type-morph_reveal .dia-reveal__cover::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var( --dia-reveal-secondary-color, #fff );
	opacity: 0.16;
	pointer-events: none;
}

/* Liquid Reveal. */
.dia-reveal-type-liquid_reveal .dia-reveal__cover { transform-origin: center; }
.dia-reveal-active.dia-reveal-type-liquid_reveal .dia-reveal__cover { animation-name: dia-rv-liquid; }

/* Paper Peel. */
.dia-reveal-type-paper_peel .dia-reveal__cover { transform-origin: top left; }
.dia-reveal-active.dia-reveal-type-paper_peel .dia-reveal__cover { animation-name: dia-rv-peel; }

/* Magnetic Reveal (directional translate with overshoot). */
.dia-reveal-active.dia-reveal-type-magnetic_reveal .dia-reveal__cover {
	animation-timing-function: cubic-bezier( 0.68, -0.55, 0.27, 1.55 );
}

/* Mask Slide (sharp clip wipe). */
.dia-reveal-active.dia-reveal-type-mask_slide .dia-reveal__cover {
	animation-timing-function: cubic-bezier( 0.85, 0, 0.15, 1 );
}

/* Modern Clip (slanted clip wipe). */
.dia-reveal-type-modern_clip .dia-reveal__cover { transform: skewX( -6deg ) scale( 1.15 ); }

/* Spotlight Reveal (soft growing circular mask). */
.dia-reveal-type-spotlight_reveal .dia-reveal__cover {
	--dia-spot-r: 0%;
	-webkit-mask: radial-gradient( circle at 50% 50%, transparent var( --dia-spot-r ), #000 calc( var( --dia-spot-r ) + var( --dia-reveal-glow-size, 40px ) ) );
	mask: radial-gradient( circle at 50% 50%, transparent var( --dia-spot-r ), #000 calc( var( --dia-spot-r ) + var( --dia-reveal-glow-size, 40px ) ) );
}

.dia-reveal-active.dia-reveal-type-spotlight_reveal .dia-reveal__cover { animation-name: dia-rv-spotlight; }

/* Ink Spread (organic growing mask). */
.dia-reveal-type-ink_spread .dia-reveal__cover {
	--dia-ink-r: 0%;
	-webkit-mask: radial-gradient( circle at 50% 50%, transparent var( --dia-ink-r ), #000 calc( var( --dia-ink-r ) + 4% ) );
	mask: radial-gradient( circle at 50% 50%, transparent var( --dia-ink-r ), #000 calc( var( --dia-ink-r ) + 4% ) );
}

.dia-reveal-active.dia-reveal-type-ink_spread .dia-reveal__cover { animation-name: dia-rv-ink; }

/* Morph Reveal. */
.dia-reveal-active.dia-reveal-type-morph_reveal .dia-reveal__cover { animation-name: dia-rv-morph; }

/* Slice Reveal (alternating slats). */
.dia-reveal-type-slice_reveal .dia-reveal__slat { transform-origin: center; }
.dia-reveal-active.dia-reveal-type-slice_reveal .dia-reveal__slat { animation-name: dia-rv-slice-up; }
.dia-reveal-active.dia-reveal-type-slice_reveal .dia-reveal__slat:nth-child( even ) { animation-name: dia-rv-slice-down; }
.dia-reveal-active.dia-reveal-type-slice_reveal.dia-reveal-modern-direction-top .dia-reveal__slat,
.dia-reveal-active.dia-reveal-type-slice_reveal.dia-reveal-modern-direction-bottom .dia-reveal__slat { animation-name: dia-rv-slice-left; }
.dia-reveal-active.dia-reveal-type-slice_reveal.dia-reveal-modern-direction-top .dia-reveal__slat:nth-child( even ),
.dia-reveal-active.dia-reveal-type-slice_reveal.dia-reveal-modern-direction-bottom .dia-reveal__slat:nth-child( even ) { animation-name: dia-rv-slice-right; }

/* Directional animation-name assignments — translate sweep. */
.dia-reveal-active.dia-reveal-type-gradient_sweep.dia-reveal-modern-direction-left .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-magnetic_reveal.dia-reveal-modern-direction-left .dia-reveal__cover { animation-name: dia-rv-sweep-left; }
.dia-reveal-active.dia-reveal-type-gradient_sweep.dia-reveal-modern-direction-right .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-magnetic_reveal.dia-reveal-modern-direction-right .dia-reveal__cover { animation-name: dia-rv-sweep-right; }
.dia-reveal-active.dia-reveal-type-gradient_sweep.dia-reveal-modern-direction-top .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-magnetic_reveal.dia-reveal-modern-direction-top .dia-reveal__cover { animation-name: dia-rv-sweep-top; }
.dia-reveal-active.dia-reveal-type-gradient_sweep.dia-reveal-modern-direction-bottom .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-magnetic_reveal.dia-reveal-modern-direction-bottom .dia-reveal__cover { animation-name: dia-rv-sweep-bottom; }
.dia-reveal-active.dia-reveal-type-gradient_sweep.dia-reveal-modern-direction-center .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-magnetic_reveal.dia-reveal-modern-direction-center .dia-reveal__cover { animation-name: dia-rv-sweep-center; }
.dia-reveal-active.dia-reveal-type-gradient_sweep.dia-reveal-modern-direction-diagonal .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-magnetic_reveal.dia-reveal-modern-direction-diagonal .dia-reveal__cover { animation-name: dia-rv-sweep-diagonal; }

/* Directional animation-name assignments — clip wipe. */
.dia-reveal-active.dia-reveal-type-mask_slide.dia-reveal-modern-direction-left .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-modern_clip.dia-reveal-modern-direction-left .dia-reveal__cover { animation-name: dia-rv-clip-left; }
.dia-reveal-active.dia-reveal-type-mask_slide.dia-reveal-modern-direction-right .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-modern_clip.dia-reveal-modern-direction-right .dia-reveal__cover { animation-name: dia-rv-clip-right; }
.dia-reveal-active.dia-reveal-type-mask_slide.dia-reveal-modern-direction-top .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-modern_clip.dia-reveal-modern-direction-top .dia-reveal__cover { animation-name: dia-rv-clip-top; }
.dia-reveal-active.dia-reveal-type-mask_slide.dia-reveal-modern-direction-bottom .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-modern_clip.dia-reveal-modern-direction-bottom .dia-reveal__cover { animation-name: dia-rv-clip-bottom; }
.dia-reveal-active.dia-reveal-type-mask_slide.dia-reveal-modern-direction-center .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-modern_clip.dia-reveal-modern-direction-center .dia-reveal__cover { animation-name: dia-rv-clip-center; }
.dia-reveal-active.dia-reveal-type-mask_slide.dia-reveal-modern-direction-diagonal .dia-reveal__cover,
.dia-reveal-active.dia-reveal-type-modern_clip.dia-reveal-modern-direction-diagonal .dia-reveal__cover { animation-name: dia-rv-clip-diagonal; }

/* Phase 2 keyframes. */
@keyframes dia-rv-glass { from { opacity: 0.6; } to { opacity: 0; } }
@keyframes dia-rv-shimmer { from { transform: translateX( -100% ); } to { transform: translateX( 100% ); } }
@keyframes dia-rv-glow { from { background-position: -25% 50%; } to { background-position: 125% 50%; } }
@keyframes dia-rv-spotlight { from { --dia-spot-r: 0%; } to { --dia-spot-r: 150%; } }
@keyframes dia-rv-ink { from { --dia-ink-r: 0%; } to { --dia-ink-r: 150%; } }

@keyframes dia-rv-liquid {
	0% { transform: scale( 1 ); border-radius: 0; }
	50% { transform: scale( 0.6 ); border-radius: calc( 30% + var( --dia-reveal-intensity, 50 ) * 0.3% ) 58% 70% 30% / 45% 45% 55% 55%; }
	100% { transform: scale( 0 ); border-radius: 50%; }
}

@keyframes dia-rv-peel {
	from { transform: rotate( 0 ) translate( 0, 0 ); box-shadow: 0 0 0 rgba( 0, 0, 0, 0 ); }
	to {
		transform: rotate( calc( -0.5deg * var( --dia-reveal-intensity, 50 ) ) ) translate( -120%, -120% );
		box-shadow: 12px 12px 35px rgba( 0, 0, 0, 0.35 );
	}
}

@keyframes dia-rv-morph {
	0% { clip-path: inset( 0 0 0 0 round 0 ); transform: scale( 1 ) rotate( 0 ); }
	50% { clip-path: inset( 10% 10% 10% 10% round 30% ); transform: scale( 0.7 ) rotate( 8deg ); }
	100% { clip-path: inset( 50% 50% 50% 50% round 50% ); transform: scale( 0.2 ) rotate( -8deg ); opacity: 0; }
}

@keyframes dia-rv-sweep-left { from { transform: translateX( 0 ); } to { transform: translateX( 100% ); } }
@keyframes dia-rv-sweep-right { from { transform: translateX( 0 ); } to { transform: translateX( -100% ); } }
@keyframes dia-rv-sweep-top { from { transform: translateY( 0 ); } to { transform: translateY( 100% ); } }
@keyframes dia-rv-sweep-bottom { from { transform: translateY( 0 ); } to { transform: translateY( -100% ); } }
@keyframes dia-rv-sweep-center { from { transform: scale( 1 ); } to { transform: scale( 0 ); } }
@keyframes dia-rv-sweep-diagonal { from { transform: translate( 0, 0 ); } to { transform: translate( 100%, 100% ); } }

@keyframes dia-rv-clip-left { from { clip-path: inset( 0 0 0 0 ); } to { clip-path: inset( 0 0 0 100% ); } }
@keyframes dia-rv-clip-right { from { clip-path: inset( 0 0 0 0 ); } to { clip-path: inset( 0 100% 0 0 ); } }
@keyframes dia-rv-clip-top { from { clip-path: inset( 0 0 0 0 ); } to { clip-path: inset( 100% 0 0 0 ); } }
@keyframes dia-rv-clip-bottom { from { clip-path: inset( 0 0 0 0 ); } to { clip-path: inset( 0 0 100% 0 ); } }
@keyframes dia-rv-clip-center { from { clip-path: inset( 0 0 0 0 ); } to { clip-path: inset( 50% 50% 50% 50% ); } }
@keyframes dia-rv-clip-diagonal { from { clip-path: inset( 0 0 0 0 ); } to { clip-path: inset( 0 0 100% 100% ); } }

@keyframes dia-rv-slice-up { from { transform: translateY( 0 ); } to { transform: translateY( -110% ); } }
@keyframes dia-rv-slice-down { from { transform: translateY( 0 ); } to { transform: translateY( 110% ); } }
@keyframes dia-rv-slice-left { from { transform: translateX( 0 ); } to { transform: translateX( -110% ); } }
@keyframes dia-rv-slice-right { from { transform: translateX( 0 ); } to { transform: translateX( 110% ); } }

/* Fallback: if clip-path is unsupported, clip-based effects fall back to fade. */
@supports not ( clip-path: inset( 0 ) ) {
	.dia-reveal-active.dia-reveal-type-mask_slide .dia-reveal__cover,
	.dia-reveal-active.dia-reveal-type-modern_clip .dia-reveal__cover,
	.dia-reveal-active.dia-reveal-type-morph_reveal .dia-reveal__cover,
	.dia-reveal-active.dia-reveal-type-edge_in .dia-reveal__cover,
	.dia-reveal-active.dia-reveal-type-circle .dia-reveal__cover {
		animation-name: dia-rv-fade;
	}
}

/* Respect reduced-motion preferences: reveal instantly, no image filtering. */
@media ( prefers-reduced-motion: reduce ) {
	.dia-reveal-enabled .dia-reveal {
		display: none;
	}

	.dia-reveal-enabled.dia-reveal-ready:not( .dia-reveal-active ) img {
		filter: none !important;
		transform: none !important;
	}
}