/* @group Plain text ------------------------------------ */

.plain-text {
	text-align: center;
}

.plain-text .has-h-2-font-size {
	margin-bottom: 3rem;
}

.plain-text .has-h-4-font-size {
	margin-bottom: 5rem;
}

@media only screen and (min-width: 961px) {
	.plain-text .has-h-4-font-size {
		margin-bottom: 3rem;
	}

	:where(#wrapper) .plain-text {
		position: relative;
		overflow: hidden;
	}

	:where(#wrapper) .plain-text::before,
	:where(#wrapper) .plain-text::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		width: 40rem;
		background-repeat: no-repeat;
		background-size: cover;
		pointer-events: none;
		z-index: 0;
	}

	:where(#wrapper) .plain-text::before {
		left: -1rem;
		background-image: url("../../img/global/home-flower-left-linen.png");
	}

	:where(#wrapper) .plain-text::after {
		right: -2rem;
		background-image: url("../../img/global/home-flower-right-linen.png");
	}
}

@media only screen and (max-width: 960px) {
	.plain-text .has-h-2-font-size {
		line-height: 110%;
		letter-spacing: 0.05em;
	}

	.plain-text .has-h-4-font-size {
		font-size: 2.6rem;
		line-height: 120%;
		letter-spacing: 0.115em;
	}
}

/* @end */

/* ANIMATIONS */

:where(#wrapper) .plain-text :is(.wp-block-heading, .wp-block-buttons) {
	opacity: 0;
	--duration: 1s;
}

:where(#wrapper) .plain-text.animateActive :is(.wp-block-heading, .wp-block-buttons) {
	animation: fade var(--duration) forwards;
	animation-delay: var(--delay, 0);
}
:where(#wrapper) .plain-text.animateActive .wp-block-heading:nth-child(1) {
	--delay: 0.3s;
}
:where(#wrapper) .plain-text.animateActive .wp-block-heading:nth-child(2) {
	--delay: 0.5s;
}
:where(#wrapper) .plain-text.animateActive .wp-block-buttons {
	--delay: 0.7s;
}
