/* LIFECYCLE */

.LIFECYCLE::before,
.LIFECYCLE::after {
	content: "";
	display: block;
	overflow: hidden;
}

.LIFECYCLE .group > h4 {
	position: relative;
	margin-bottom: var(--s5);
}

.LIFECYCLE .group > h4 span {
	display: block;
	text-align: center;
	position: relative;
}


.LIFECYCLE .group-card {
	position: relative;
	background: var(--blue-50);
	border-radius: var(--s3);
	padding: var(--s4);
	min-height: 104rem;
	transition: background-color 0.25s;
	height: 100%;
	box-sizing: border-box;
}

.LIFECYCLE .group-card button {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	text-align: left;
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	cursor: pointer;
	transition: color 0.25s;
}

.LIFECYCLE .group-card button svg {
	position: absolute;
	bottom: 0;
	right: 0;
	transform: translate(var(--ns3), var(--ns3)) rotate(-45deg);
	fill: var(--blue-500);
}

.LIFECYCLE .group-card button::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.LIFECYCLE .group-card:hover {background: var(--blue-500);}
.LIFECYCLE .group-card:hover button {color: var(--white);}
.LIFECYCLE .group-card:hover button svg {fill: var(--white);}

.wp-block .LIFECYCLE .modal {display: none;}

@media screen and (max-width: 1440px) {
	.LIFECYCLE .b-columns {margin: var(--ns1);}
	.LIFECYCLE .b-column {padding: var(--s1);}

	.LIFECYCLE .group > h4 {margin-bottom: var(--s3);}
	.LIFECYCLE .group-card {font-size: 16rem; min-height: 93rem;}
}

@media screen and (max-width: 960px) {
	.LIFECYCLE .group .b-column[data-width="1/2"] {width: 50%;}
	.LIFECYCLE .group-card {padding: var(--s3); min-height: 77rem;}
	.LIFECYCLE .group-card button svg {transform: translate(-6rem, var(--ns1)) rotate(-45deg) scale(0.75);}

	.LIFECYCLE .b-column:not(:first-child) .group > h4 {margin-top: var(--s3) !important;}
}



/* LIFECYCLE-MODAL */

.LIFECYCLE-MODAL {
	position: relative;
	margin: 0 auto;
	width: var(--col-6);
	max-width: 100%;
}

.LIFECYCLE-MODAL .wrapper {
	border-radius: var(--s4);
	background: var(--white);
	padding: var(--s7);
}

.LIFECYCLE-MODAL .link {
	margin-top: var(--ps);
}

@media screen and (max-width: 960px) {
	.LIFECYCLE-MODAL .wrapper {padding: var(--s5); border-radius: var(--s1);}
}
