@use "../global" as *;
.hero-2 {
	padding-top: 3.75rem;
	@include screen(lg) {
		padding-top: 4rem;
	}
	&__content {
		@media (min-width: 1600px) {
			&::before {
				content: "";
				position: absolute;
				top: 0;
				bottom: 0;
				left: -#{rem(140)};
				width: 1px;
				border-left: 1px solid rgba(var(--bs-light-rgb), 0.1);
			}
			&::after {
				content: "";
				position: absolute;
				top: 0;
				bottom: 0;
				right: -#{rem(140)};
				width: 1px;
				border-left: 1px solid rgba(var(--bs-light-rgb), 0.1);
			}
		}
	}
	&__circle-1 {
		display: none;
		@media (min-width: 1600px) {
			display: block;
			width: 2rem;
			height: 2rem;
			border-radius: 50%;
			background-color: var(--bs-primary);
			position: absolute;
			top: 0;
			left: -#{rem(140)};
			transform: translateX(-50%);
			z-index: 1;
			pointer-events: none;
		}
	}
	&__circle-2 {
		display: none;
		@media (min-width: 1600px) {
			display: block;
			width: 2rem;
			height: 2rem;
			border-radius: 50%;
			background-color: var(--bs-primary);
			position: absolute;
			bottom: 0;
			right: -#{rem(140)};
			transform: translateX(50%);
			z-index: 1;
			pointer-events: none;
		}
	}
	&__line-x {
		display: none;
		@media (min-width: 1600px) {
			display: block;
			width: 5rem;
			height: 0.25rem;
		}
		&--1 {
			background-image: linear-gradient(
				90deg,
				transparent,
				var(--bs-primary),
				transparent
			);
			position: absolute;
			top: 0;
			left: -#{rem(140)};
		}
		&--2 {
			background-image: linear-gradient(
				90deg,
				transparent,
				var(--bs-primary),
				transparent
			);
			position: absolute;
			bottom: 0;
			right: -#{rem(140)};
		}
	}
	&__line-y {
		display: none;
		@media (min-width: 1600px) {
			display: block;
			width: 0.25rem;
			height: 5rem;
		}
		&--1 {
			background-image: linear-gradient(
				transparent,
				var(--bs-primary),
				transparent
			);
			position: absolute;
			top: 0;
			left: -#{rem(140)};
		}
		&--2 {
			background-image: linear-gradient(
				transparent,
				var(--bs-primary),
				transparent
			);
			position: absolute;
			bottom: 0;
			right: -#{rem(140)};
		}
	}
}
