Not sure why you are using a before
pseudonym element to set the overlay. It’s much more efficient to do it this way (for example)
body {
position: relative;
background-image: linear-gradient(to bottom, rgba(245, 246, 252, 0.52), rgba(117, 19, 93, 0.73)), url(https://loremflickr.com/500/500/flame);
min-height: 90%;
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
background-size: cover;
}
The below CSS block should be removed
body::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 240, 220, 0.85);
z-index: -100;
}
z-index: -100;
is also overkill - -1
is usually always enough as this places the target element behind everything else.