/**
 * Bricksify: Fold Roll.
 *
 * Loads only with the companion plugin, together with fold-roll.js. Every rule
 * targets markup the script creates, so an element carrying `bxc-fold-roll`
 * without the plugin is simply normal text.
 */

.bxc-fold-roll .bxfr__sr {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* A word never breaks between letters. */
.bxc-fold-roll .bxfr__word {
	display: inline-block;
	white-space: nowrap;
}

.bxc-fold-roll .bxfr__char {
	position: relative;
	display: inline-block;
}

.bxc-fold-roll .bxfr__a {
	display: inline-block;
	transform-origin: bottom;
}

/* The copy sits exactly on its letter and starts folded away. */
.bxc-fold-roll .bxfr__b {
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
	transform: scaleY(0);
	transform-origin: top;
}
