.page-grid .block:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgb(42 36 65 / 90%) 60%);
    width: 100%;
    height: 80%;
	transition: opacity 0.3s ease; 
}
.page-grid .block:hover:before {
	opacity:0;
	
}

.page-grid .block:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    background:linear-gradient(135deg, #d61254 0%, #82378c 100%);
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.3s ease; 
  
}

.page-grid .block:hover:after {
    opacity: 0.75;
}

.page-grid .block-header {
    z-index: 50;
}

.page-grid .block-header h2 {margin-top:0;}

.page-grid .block-meta-cta {
    z-index: 50;
}

.page-grid .block {
    background-position: center center;
	background-size:cover;
}



.page-grid .block:hover .block-header,
.page-grid .block:hover .block-meta-cta {
    z-index: 100; 
}

.page-grid .block:hover .chevron-btn {
    width: 175px;
}

.page-grid .block:hover .chevron span {
    opacity: 1;
    transform: translate(28px, 0px);
}

.page-grid .block:hover .chevron-btn svg {
    opacity: 0;
}

.page-grid .block:hover .chevron-btn svg {
    opacity: 1;
}

.page-grid .block-header p {
    max-width: 475px;
}

.chevron-btn {
    padding: var(--wp--custom--layout--small-padding);
    color: black;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: flex-end;
}

.block:hover .chevron-btn {
    width: 175px;
}

.chevron {
    display: flex;
    align-items: center;
    overflow: hidden;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    justify-content: center;
}

.page-grid a {color:inherit; text-decoration:none;}
.page-grid .block{color:var(--wp--preset--color--white);overflow: hidden;}
.chevron span {
    text-wrap: nowrap;
    opacity: 0;
    position: absolute;
    left: 0;
    transform: translate(-40px, 0px);
    transition: .5s cubic-bezier(0.4, 0, 0.2, 1);
	font-size:var(--wp--preset--font-size--medium);
}

.block:hover .chevron-btn span {
    opacity: 1;
    transform: translate(20px, 0px);
}

.page-grid .chevron-btn svg {
    fill: black;
    transform: translate(0px, 0px);
    transition: .5s cubic-bezier(0.4, 0, 0.2, 1);
}

.page-grid .block:hover .chevron-btn svg {
    opacity: 0;
    transition: .25s cubic-bezier(0.4, 0, 0.2, 1);
}