/* ABOUT — harmonized with the precision-minimal design system */

.about-content{
	min-height: 72vh;
	min-height: 72dvh;
	width: 70%;
	max-width: 860px;
	margin: 0px auto 60px auto;
	padding: 40px 0;
	color: var(--ink-soft);
}
@media screen and (max-width: 900px){
	.about-content{
		width: 100%;
		padding: 20px 0;
		min-height: 72vh;
	}
}

.img-container{
	border-radius: 100%;
	overflow: hidden;
	width: 400px;
	height: 400px;
	margin: 50px auto 5px auto;
	border: 1px solid var(--periwinkle);
	outline: 1px solid var(--line);
	outline-offset: 6px;
	transition: .25s;
}
.img-container:hover{
	border-color: var(--deep);
	transform: scale(1.01);
}
.img-container img{
	width: 400px;
}
@media only screen and (max-width: 500px) {
	.img-container{
		width: 300px;
		height: 300px;
	}
	.img-container img{
		width: 300px;
	}
}

.about-content span{
	font-family: Handjet, monospace;
	font-size: 17px;
	letter-spacing: 0.12em;
	color: var(--periwinkle);
}
.about-content h1{
	font-family: Teko, sans-serif;
	font-size: clamp(36px, 5vw, 56px);
	font-weight: 500;
	line-height: 0.95;
	text-transform: uppercase;
	margin-top: 70px;
	margin-bottom: 14px;
	color: var(--ink);
	display: inline-block;
	background-image: linear-gradient(var(--accent), var(--accent));
	background-repeat: no-repeat;
	background-size: 100% 26%;
	background-position: 0% 90%;
}
.about-content h1:first-of-type{
	margin-top: 30px;
}
.about-content p{
	margin-bottom: 40px;
	font-size: 17px;
	line-height: 1.75;
}

.about-content .social-link{
	color: white;
	padding: 12px 28px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	margin: 10px;
	cursor: pointer;
	text-decoration: none;
	transition: .25s;
	display: inline-block;
}
.about-content .social-link:hover{
	filter: brightness(120%);
}
.about-content .linkedin-link{
	background-color: var(--deep);
}

.obvious-link{
	color: var(--periwinkle);
	font-weight: bold;
	text-decoration: none;
}
.obvious-link:hover{
	color: var(--deep);
}