/*
 * Offline Figma root 558:506 / signed-off node 40000015:3876.
 * All authored dimensions scale from the 1920px desktop frame.
 */

.raft-h2o-applications-figma {
	--raft-h2o-applications-scale: min(1, calc(100vw / 1920px));
	background: #000026;
	box-sizing: border-box;
	color: #fff;
	font-family: "Neue Einstellung", "NeueEinstellung", "Avenir Next", Avenir, Arial, sans-serif;
	height: calc(1140.39px * var(--raft-h2o-applications-scale));
	overflow: hidden;
	position: relative;
	width: 100%;
}

.raft-h2o-applications-figma *,
.raft-h2o-applications-figma *::before,
.raft-h2o-applications-figma *::after {
	box-sizing: border-box;
}

.raft-h2o-applications-figma__glow {
	background: radial-gradient(
		ellipse 87.1551% 82.5377% at 53.7887% 30.6131%,
		#f6d586 10%,
		#f3946c 25%,
		#f2735f 32.5%,
		#f05252 40%,
		#c83f53 43.954%,
		#a02c55 47.909%,
		#771956 51.863%,
		#4f0657 55.8176%,
		rgba(119, 25, 86, 0.75) 66.863%,
		rgba(160, 44, 85, 0.5) 77.909%,
		rgba(240, 82, 82, 0) 100%
	);
	filter: blur(calc(117.9px * var(--raft-h2o-applications-scale)));
	height: calc(8693px * var(--raft-h2o-applications-scale));
	left: calc(50% + (0.5px * var(--raft-h2o-applications-scale)));
	max-width: none;
	pointer-events: none;
	position: absolute;
	top: calc(-5914.825px * var(--raft-h2o-applications-scale));
	transform: translateX(-50%);
	width: calc(8053px * var(--raft-h2o-applications-scale));
}

.raft-h2o-applications-figma__inner {
	height: calc(870.39px * var(--raft-h2o-applications-scale));
	margin: 0 auto;
	position: relative;
	top: calc(120px * var(--raft-h2o-applications-scale));
	width: calc(1536px * var(--raft-h2o-applications-scale));
	z-index: 1;
}

.raft-h2o-applications-figma__header {
	height: calc(224.39px * var(--raft-h2o-applications-scale));
	left: 0;
	margin: 0;
	position: absolute;
	top: 0;
	width: calc(1084px * var(--raft-h2o-applications-scale));
}

.raft-h2o-applications-figma__heading {
	height: calc(118px * var(--raft-h2o-applications-scale));
	margin: 0;
	padding: calc(16px * var(--raft-h2o-applications-scale)) 0 calc(10px * var(--raft-h2o-applications-scale));
	width: 100%;
}

.raft-h2o-applications-figma__kicker,
.raft-h2o-applications-figma__heading h2,
.raft-h2o-applications-figma__intro,
.raft-h2o-applications-figma__card h3,
.raft-h2o-applications-figma__card p {
	margin: 0;
}

.raft-h2o-applications-figma__kicker {
	color: #f05252;
	font-size: calc(14px * var(--raft-h2o-applications-scale));
	font-weight: 700;
	letter-spacing: calc(0.98px * var(--raft-h2o-applications-scale));
	line-height: 1.6;
	text-transform: uppercase;
}

.raft-h2o-applications-figma__heading h2 {
	color: #fff;
	font-size: calc(56px * var(--raft-h2o-applications-scale));
	font-weight: 700;
	letter-spacing: calc(-2px * var(--raft-h2o-applications-scale));
	line-height: 1.25;
	white-space: nowrap;
}

.raft-h2o-applications-figma__intro {
	color: #fff;
	font-size: calc(20px * var(--raft-h2o-applications-scale));
	font-weight: 400;
	left: 0;
	line-height: 1.6;
	position: absolute;
	top: calc(138px * var(--raft-h2o-applications-scale));
	width: calc(776px * var(--raft-h2o-applications-scale));
}

.raft-h2o-applications-figma__grid {
	display: grid;
	gap: calc(16px * var(--raft-h2o-applications-scale));
	grid-template-columns: repeat(4, minmax(0, 1fr));
	height: calc(626px * var(--raft-h2o-applications-scale));
	left: 0;
	padding-top: calc(24px * var(--raft-h2o-applications-scale));
	position: absolute;
	top: calc(244.39px * var(--raft-h2o-applications-scale));
	width: 100%;
}

.raft-h2o-applications-figma__card {
	background: rgba(215, 176, 249, 0.18);
	border: calc(1px * var(--raft-h2o-applications-scale)) solid rgba(255, 255, 255, 0.25);
	border-radius: calc(24px * var(--raft-h2o-applications-scale));
	box-shadow: inset 0 0 calc(14.2px * var(--raft-h2o-applications-scale)) rgba(240, 82, 82, 0.5);
	height: calc(602px * var(--raft-h2o-applications-scale));
	margin: 0;
	min-width: 0;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.raft-h2o-applications-figma__media {
	height: calc(611px * var(--raft-h2o-applications-scale));
	left: 0;
	-webkit-mask-image: linear-gradient(
		to bottom,
		#000 0,
		#000 37.3977%,
		rgba(0, 0, 0, 0) 51.6367%,
		rgba(0, 0, 0, 0) 100%
	);
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-size: 100% 100%;
	mask-image: linear-gradient(
		to bottom,
		#000 0,
		#000 37.3977%,
		rgba(0, 0, 0, 0) 51.6367%,
		rgba(0, 0, 0, 0) 100%
	);
	mask-repeat: no-repeat;
	mask-size: 100% 100%;
	pointer-events: none;
	position: absolute;
	top: calc(0.348px * var(--raft-h2o-applications-scale));
	width: 100%;
}

.raft-h2o-applications-figma__media img {
	display: block;
	height: 100%;
	max-width: none;
	object-fit: cover;
	position: absolute;
	width: 100%;
}

.raft-h2o-applications-figma__card--anaerobic .raft-h2o-applications-figma__media img {
	object-position: 0% 50%;
}

.raft-h2o-applications-figma__card--wastewater .raft-h2o-applications-figma__media img {
	object-position: 50% 50%;
}

.raft-h2o-applications-figma__card--digestate .raft-h2o-applications-figma__media img {
	object-position: 40.38% 50%;
}

.raft-h2o-applications-figma__card--runoff .raft-h2o-applications-figma__media img {
	object-position: 50% 50%;
}

.raft-h2o-applications-figma__card-copy {
	bottom: calc(32px * var(--raft-h2o-applications-scale));
	left: calc(32px * var(--raft-h2o-applications-scale));
	position: absolute;
	right: calc(32px * var(--raft-h2o-applications-scale));
	z-index: 2;
}

.raft-h2o-applications-figma__card-heading {
	display: flex;
	flex-direction: column;
	gap: calc(8px * var(--raft-h2o-applications-scale));
	width: 100%;
}

.raft-h2o-applications-figma__icon {
	display: block;
	flex: 0 0 auto;
	height: calc(50px * var(--raft-h2o-applications-scale));
	max-width: none;
	object-fit: contain;
	object-position: left center;
	width: calc(51px * var(--raft-h2o-applications-scale));
}

.raft-h2o-applications-figma__card--wastewater .raft-h2o-applications-figma__icon {
	height: calc(51px * var(--raft-h2o-applications-scale));
	width: calc(50px * var(--raft-h2o-applications-scale));
}

.raft-h2o-applications-figma__card h3 {
	border-bottom: calc(1px * var(--raft-h2o-applications-scale)) solid rgba(255, 255, 255, 0.25);
	color: #fff;
	font-size: calc(24px * var(--raft-h2o-applications-scale));
	font-weight: 900;
	height: calc(53px * var(--raft-h2o-applications-scale));
	line-height: 1.2;
	padding-bottom: calc(24px * var(--raft-h2o-applications-scale));
	white-space: nowrap;
	width: 100%;
}

.raft-h2o-applications-figma__card-body {
	height: calc(132px * var(--raft-h2o-applications-scale));
	padding: calc(24px * var(--raft-h2o-applications-scale)) 0 calc(12px * var(--raft-h2o-applications-scale));
	width: 100%;
}

.raft-h2o-applications-figma__card p {
	color: #fff;
	font-size: calc(18px * var(--raft-h2o-applications-scale));
	font-weight: 400;
	line-height: calc(32px * var(--raft-h2o-applications-scale));
	width: 100%;
}