/**
 * Divi 5 Scroll Reveal — Front-end styles
 * @package D5ScrollReveal
 */

.d5sr_scroll_reveal__wrapper {
	position: relative;
	overflow: hidden;
	width: 100%;
	box-sizing: border-box;
}

.d5sr_scroll_reveal__content {
	position: relative;
	width: 100%;
	-webkit-mask-image: none;
	mask-image: none;
	will-change: mask-image, -webkit-mask-image, filter, color, letter-spacing;
}

.d5sr_scroll_reveal__wrapper[data-d5sr-direction="bottom-to-top"] .d5sr_scroll_reveal__content,
.d5sr_scroll_reveal__wrapper[data-d5sr-direction="top-to-bottom"] .d5sr_scroll_reveal__content {
	-webkit-mask-size: 100% 300%;
	mask-size: 100% 300%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}

.d5sr_scroll_reveal__wrapper[data-d5sr-direction="left-to-right"] .d5sr_scroll_reveal__content,
.d5sr_scroll_reveal__wrapper[data-d5sr-direction="right-to-left"] .d5sr_scroll_reveal__content {
	-webkit-mask-size: 300% 100%;
	mask-size: 300% 100%;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}

.d5sr-typewriter-caret {
	display: inline-block;
	width: 2px;
	height: 1em;
	vertical-align: text-bottom;
	margin-left: 2px;
	animation: d5sr-blink-caret 0.75s step-end infinite;
}

@keyframes d5sr-blink-caret {
	0%, 100% { opacity: 1; }
	50%      { opacity: 0; }
}

.d5sr-chromatic-layer {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	mix-blend-mode: screen;
	will-change: transform, opacity;
}

.d5sr-chromatic-wrapper {
	position: relative;
}

@media (prefers-reduced-motion: reduce) {
	.d5sr_scroll_reveal__content {
		-webkit-mask-image: none !important;
		mask-image: none !important;
		filter: none !important;
		opacity: 1 !important;
	}
	.d5sr-typewriter-caret { animation: none; }
	.d5sr-chromatic-layer { display: none; }
}

@media (max-width: 981px) {
	.d5sr_scroll_reveal__wrapper { font-size: 0.85em; }
}

@media (max-width: 768px) {
	.d5sr_scroll_reveal__wrapper { font-size: 0.75em; }
}