body {
  font-family: system-ui, sans-serif;
  height: 100vh;
  margin: 0;
  display: grid;
  grid-template-columns: auto auto;
  grid-column-gap: 15px;
  place-content: center;
  align-items: end;
}
a {
	text-decoration:none;
	color:#000;
}
h3 {
	font-size: 4rem;
	margin:0 auto;
	cursor: pointer;
	padding: 0 .1em;
}

.style {
	position: relative; 
	text-align:center;
	line-height:150px;
}
.style:hover {
	position: relative;
	color: #FFF;
	transition: .5s, -webkit-mask-size .5s .5s;
}
.style::before {  
	transform: scaleX(0);
	transform-origin: bottom right;
}
.style:hover::before {
	transform: scaleX(1);
	transform-origin: bottom left;
}
.style::before {
	content: " ";
	display: block;
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	inset: 0 0 0 0;
	background: #FC1909;
	z-index: -1;
	transition: transform .3s ease;
}