/* FLOW */

.FLOW {
	position: relative;
}

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

.FLOW .outer-wrapper {
	border-radius: var(--s4);
	background: var(--purple-blue-gradient);
	box-sizing: border-box;
	overflow: hidden;
	position: relative;
	padding: var(--s5);
}

.FLOW .outer-wrapper::before {
	content: '';
	position: absolute;
	top: 1px;
	left: 1px;
	right: 1px;
	bottom: 1px;
	background: var(--white);
	border-radius: calc(var(--s4) - 1px);
}

.FLOW .inner-wrapper {
	position: relative;
}

.FLOW .image {
	width: var(--s6);
}

.FLOW .b-column:nth-child(4) .inner-wrapper {position: relative;}
.FLOW .b-column:nth-child(4) .inner-wrapper .content {position: relative;}
.FLOW .b-column:nth-child(4) .inner-wrapper .b-buttons {position: relative;}
.FLOW .b-column:nth-child(4) .inner-wrapper::before {
	content: '';
	position: absolute;
	top: -30rem;
	left: var(--ns5);
	right: -30rem;
	bottom: -30rem;
	border-radius: 0 23rem 23rem 0;
	background: var(--blue-50);
}

@media screen and (min-width: 961px) {
	.FLOW .b-columns {align-items: center;}
	.FLOW .b-column:nth-child(2),
	.FLOW .b-column:nth-child(3) {
		position: relative;
		transform: translate(var(--ns5), 0);
		background: url('../../assets/images/ui-arrow-blue.svg') no-repeat center right / 32rem;
	}
	.FLOW .b-column:nth-child(2) .inner-wrapper,
	.FLOW .b-column:nth-child(3) .inner-wrapper {
		padding-right: var(--s5);
		padding-left: var(--s1);
	}
}

@media screen and (min-width: 1441px) {
	.FLOW .b-column:nth-child(2),
	.FLOW .b-column:nth-child(3) {transform: translate(var(--ns7), 0);}
}

@media screen and (max-width: 960px) {
	.FLOW .b-column:nth-child(4) .inner-wrapper {margin-top: var(--s5);}
	.FLOW .b-column:nth-child(4) .inner-wrapper::before {
		content: '';
		position: absolute;
		top: -30rem;
		left: -30rem;
		right: -30rem;
		bottom: -30rem;
		border-radius: 0 0 23rem 23rem;
		background: var(--blue-50);
	}
}
