@import "variables";
@import "hero";
@import "featured";
@import "feature-sunset";
@import "feature-narrow";
@import "contact";
@import "faq";
@import "social-proof";
@import "footer";

#top-nav .ext-nav-toggle,
.state2 body.rwavw-custom .page-border.top {
	@media (max-width: 767px) {
		height: 40px !important;
	}
}

body.rwavw-custom {
	#top-nav {
		.nav,
		.logo {
			float: none;
		}

		.logo {
			margin-top: 0;

			.sitename {
				font-size: 16px;
				font-weight: 600;
				opacity: 0.9;
			}
		}
	}

	.top-nav-inner {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;

		&::before,
		&::after {
			content: none;
		}

		> .logo {
			order: 5;
		}

		> .nav {
			order: 10;
		}
	}

	.wrapper-site > .wrapper-content > .widget {
		margin-bottom: 44px;

		&.rwavw-feature-details {
			@media (max-width: 64em) {
				margin-top: -44px;
			}
		}

		@media (min-width: 64em) {
			margin-bottom: 88px;
		}
	}

	.widget.rwavw-boxed {
		width: calc(100% - 80px);
		max-width: 1160px;
		margin-left: auto;
		margin-right: auto;
	}

	.page-border {
		background-color: #fff;

		&::after {
			content: '';
			display: block;
			position: absolute;
			background-color: rgba(#000, 0.03);
		}

		&.top::after,
		&.bottom::after {
			width: 100%;
			height: 1px;
			left: 0;
		}

		&.bottom::after {
			bottom: 100%;
			background-color: rgba(#000, 0.05);
		}

		&.top::after {
			top: 100%;
		}

		&.left::after,
		&.right::after {
			width: 1px;
			top: 0;
			bottom: 0;
		}

		&.left::after {
			left: 100%;
		}

		&.right::after {
			right: 100%;
		}

		@at-root html.state2 .page-border.left::after {
			top: 60px;
		}

		@at-root html.state2 .page-border.right::after {
			top: 60px;
		}
	}

	.page-border.bottom::after {
		bottom: 100%;
	}

	.page-border.bottom::before {
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		top: 100%;
		left: 0;

		background: linear-gradient(
			to left,
			rgba(#000, 0),
			rgba(#000, 0.9) 32px,
			rgba(#000, 1) 50%,
			rgba(#000, 0) 50%
		), linear-gradient(
			to right,
			rgba(#000, 0),
			rgba(#000, 0.9) 32px,
			rgba(#000, 1) 50%,
			rgba(#000, 0) 50%
		);
	}

	.heading-page-title {
		font-weight: 400;
	}

	.heading-section-title {
		font-weight: 400;
		font-size: 32px;
		line-height: 1.2;
		margin-bottom: 44px;

		@media (max-width: 767px) {
		}

		@media (min-width: 766.98px) {
		}

		@media (max-width: 63.98em) {
			text-align: center !important;
		}

		@media (min-width: 64em) {
			font-size: 60px;
		}
	}

	.widget.rwavw-cta-box {
		box-shadow: $box-shadow-sk;
		border-radius: $border-radius;

		.section-cols > .pure-g {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			align-content: center;

			> div {
				margin: 22px 0;
			}
		}

		a {
			&:link,
			&:visited {
				color: $accent-500;
				font-weight: bold;
				font-size: 18px;
				transition: opacity 0.3s;
				opacity: 1;
			}

			&:hover,
			&:active {
				opacity: 0.7;
			}

			svg {
				position: relative;
				width: auto;
				height: 29px;
				top: 9px;
				margin-left: 5px;
			}
		}

		@media (min-width: 680px) {
			.section-cols > .pure-g {
				flex-direction: row;
				justify-content: space-around;
				align-items: flex-start;

				> div {
					flex: 0 0 auto;
				}
			}
		}
	}
}