[data-component="technology-display"] {
	display: flex;
	flex-direction: column;
	gap: clamp(1rem, 4vw, 4rem);
}
[data-component="technology-item"] {
	background-color: var(--gw-color-green);
	border-radius: 10px;
	border: 1px solid var(--gw-color-blue);
	padding: clamp(1rem, 2vw, 2rem);

	h2 {
		font-size: clamp(28px, 4vw, 60px);
		text-transform: uppercase;
		margin: 0;
	}
	h3 {
		font-weight: 400;
		font-size: clamp(14px, 2vw, 24px);
		font-family: Tomorrow !important;
		letter-spacing: 0.3em;
		text-transform: uppercase;
	}
}

[data-component="technology-detail"] {
	display: flex;
	flex-direction: row;
	gap: 2rem;
	margin-top: 3rem;

	[data-component="technology-detail-item"] {
		display: flex;
		position: relative;
		flex: 1;
		flex-direction: column;
		gap: 0.5rem;

		strong {
			min-height: 2.5rem;
			font-weight: 400;
			font-family: Tomorrow !important;
			letter-spacing: 0.3em;
			text-transform: uppercase;
		}
		p {
			font-size: 14px;
			line-height: 1.1;
		}

		&:not(:last-child) {
			&::after {
				display: block;
				position: absolute;
				top: 0;
				right: -1rem;
				background-color: black;
				width: 1px;
				height: 100%;
				content: "";
			}
		}
	}
}

@media (max-width: 768px) {
	[data-component="technology-detail"] {
		flex-direction: column;

		[data-component="technology-detail-item"] {
			strong {
				min-height: unset;
			}
			p {
				margin: 0;
			}
			&:not(:last-child) {
				&::after {
					position: relative;
					top: unset;
					right: unset;
					margin-top: 1rem;
					width: 100%;
					height: 1px;
				}
			}
		}
	}
}