.page-hero {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.52), rgba(244, 243, 237, 0.82)),
        var(--page-hero-image, url('../images/page-hero-bracelets.jpg'));
    background-position: center 43%;
    background-size: cover;
    background-repeat: no-repeat;
}

.page-hero .shine-copy {
    font-size: clamp(21px, 2.5vw, 29px);
    font-weight: 500;
}

.shine-copy-footer {
    font-size: 19px !important;
    font-weight: 500;
}

@media (max-width: 560px) {
    .page-hero {
        background-position: center 38%;
    }
}