/*
 * Sustainability - Strategy intro.
 *
 * Read from cp-all-designer css/sustain-sustainability-strategy.css (.susintro).
 * The leaves are the shared ones (sustainability-widget.css).
 *
 * Colour, type, padding and the measures arrive from the Style tab and are not
 * repeated here.
 */

/* the brand's green and blue at 10%, falling to white */
.custom-sustainability-strategy-intro.custom-sustainability-strategy-intro[data-custom-partner-band] {
	position: relative;
	overflow: hidden;
	background: linear-gradient(158deg,
		var(--custom-sustainability-strategy-intro-top, #EFF6EC) 0%,
		var(--custom-sustainability-strategy-intro-middle, #EEF6FB) 44%,
		var(--custom-sustainability-strategy-intro-foot, #FFFFFF) 100%);
}

.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__inner {
	position: relative;
	z-index: 2;
}

/* a soft blue glow at the right */
.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__sky {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 0;
	height: 62%;
	opacity: 0.3;
	pointer-events: none;
}

.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__glow {
	position: absolute;
	top: 40px;
	right: -220px;
	width: 620px;
	height: 620px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(80, 163, 213, 0.1) 0%, transparent 70%);
	filter: blur(6px);
}

/* the words beside the picture */
.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__pair {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
}

.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__copy {
	position: relative;
	z-index: 3;
	min-width: 0;
	text-align: left;
}

.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__copy .custom-sustainability-strategy-intro__intro {
	font-weight: 300;
	line-height: 1.85;
}

.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__media {
	position: relative;
	z-index: 1;
	min-width: 0;
}

/* the picture holds the track's right edge */
.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__picture {
	margin: 0 0 0 auto;
	overflow: hidden;
}

.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__picture img {
	display: block;
	width: 100%;
	height: auto;
	max-width: none;
	border-radius: 0;
}

@media (max-width: 1080px) {
	.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__pair {
		grid-template-columns: minmax(0, 1fr);
	}
	.custom-sustainability-strategy-intro .custom-sustainability-strategy-intro__picture {
		margin-right: auto;
		margin-left: auto;
	}
}