.core-hero-image {
	color: var(--white);
	overflow: hidden;
}

.core-hero-image .slide {
	position: relative;
}

.core-hero-image .slide .img-cont {
	position: relative;
	z-index: 1;
}

.core-hero-image .slide .img-cont::before,
.core-hero-image .slide .img-cont::after {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: block;
    content: "";
    pointer-events: none;
}

.core-hero-image .slide .img-cont::before {
    top: auto;
    right: auto;
    width: 76vw;
    height: 76vw;
    background: radial-gradient(circle farthest-side at bottom left, rgba(0,0,0,.2), rgba(0,0,0,0));
}

.core-hero-image .slide .img-cont::after {
    background: linear-gradient(to top, rgba(0,0,0,0.4), rgba(0,0,0,0) 60%);
}

.core-hero-image .slide-img {
	width: 100%;
}

.core-hero-image .slide .content-section {
	z-index: 2;
	display: block;
	padding: 20px 20px 5px;
    max-width: 300px;
    text-shadow: 0 0 20px rgba(0,0,0,.6);
}

.core-hero-image .slide-title {
	max-width: none;
	margin-bottom: 8px;
	font-family: var(--font-display);
	font-weight: var(--font-weight-black);
	font-size: 25px;
	line-height: 1;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.core-hero-image .shared-play-button {
    top: 20px;
    right: 20px;
    left: auto;
    transform: none;
}

@media (min-width: 40em) {
    .core-hero-image {
        width: calc(100% - 80px);
        margin:0 auto;
    }

    .core-hero-image .slide .content-section {
        padding: 20px 20px 42px 100px;
        max-width: 420px;
    }

    .core-hero-image .slide-title {
        margin-bottom: 4px;
        font-size: 40px;
    }

    .core-hero-image .shared-play-button {
        top: 40px;
        right: 40px;
    }
}

@media (min-width: 64em) {
    .core-hero-image .shared-play-button {
        top: 50%;
        right: auto;
        left: 50%;
        transform: translate(-50%, -50%);
    }
}