:root {

	--text-color: whitesmoke;

	transition: all 2s ease-in-out;
}

feature-splash {
	max-width: 50ch;

	margin-bottom: 1rem;

	font-weight: 600;

	.calm-voice {
		color: dimgray;
		margin-top: .5rem;
	}
}

feature-grid {
	display: grid;
	gap: 2rem;

	@media (width >= 800px){
		grid-template-columns: 50% 1fr;
	}
	
	picture {
		width: 100%;
		max-width: fit-content;
	}

	.feat-container {
		display: grid;
		gap: 1rem;
	}

	featured-project{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		gap: 1rem;

		span:first-child {
			font-weight: 900;}

		a:nth-child(2) {
			text-decoration: underline;
			text-underline-offset: 4px;
		}

		@media (width >= 800px){
			flex-direction: column;
			justify-content: normal;
		}
	}

	logo-list {
	 	display: block;

		ul {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: .5rem;

			@media (width >= 800px){
				grid-template-columns: repeat(4, 1fr);
			}

			li {

			}
		}

		picture {
			aspect-ratio: 1 / 1;
			width: 100%;
			height: auto;
		}
	}

	hr {
		border: 1px solid whitesmoke;
	}


	p {
		line-height: 1.2;
	}
}