:root {
	--oranje: #fea74f;
	--oranjergb: 254, 167, 79;
	--bruin_headers: #52330f;
	--bruin_tekst: #685a56;

	--header_height: 18rem;
	--default_font-size: 1.6rem;
	--row_padding-verticaal: 3.5rem;
	--row_padding-horizontaal: 5rem;
}

html {
    font-size: 62.5%;
	min-height: 100%;
}

body {
    font-size: var(--default_font-size);
	color: var(--bruin_tekst);
	background-color: hsl(297.3, 32.4%, 7.5%);
	font-family: Segoe UI, Frutiger, Frutiger Linotype, Dejavu Sans, Helvetica Neue, Arial, sans-serif;
	margin: 0;
	padding: 0;
}

.outer-container {
	display: grid;
	grid-template-columns: 1fr 95rem 1fr;
	margin: 1rem;
}

#cv_header {
	background: var(--oranje) url('https://hermans.org/cv/images/bjorn_header.png') no-repeat;
	margin: 0px;
	background-size: contain;
	background-position: right;
	aspect-ratio: 1;
}

.main {
	background: #ffffff;
	box-shadow: rgba(var(--oranjergb), 0.75) 0px 0px 3.5rem 0px;
}

.home-link {
	display: flex;
	margin: 2rem auto 1rem;
	background: white;
	padding: 0.75rem 2rem 0.7rem;
	line-height: 1;
	border-radius: 2rem;
	width: fit-content;
	align-items: center;
	column-gap: 0.5rem;
}
.home-link span {
	line-height: 1;
	transform: translateY(-0.3rem);
}

.row {
	display: grid;
	grid-template-columns: 1fr 3.5fr;
	padding: 0 var(--row_padding-horizontaal);
}
@media screen and (max-width: 990px) {
	html {
		font-size: min(62.5%, calc(7px + 0.390625vw));
	}
	.outer-container {
		grid-template-columns: 1fr 95vw 1fr;
	}
}

.row:nth-child(2) {
	padding-top: var(--row_padding-verticaal);

}
.row:last-child {
	padding-bottom: var(--row_padding-verticaal);

}

.header-row {
	background-color: var(--oranje);
}

.row .eerste-kolom {
	color: var(--bruin_headers);
	font-weight: bold;
	font-size: calc(1 * var(--default_font-size));
	text-transform: uppercase;
	letter-spacing: 0.125rem;
	min-width: 15rem;
}

.row .tweede-kolom {
	color: var(--bruin_tekst);
	font-size: calc(0.95 * var(--default_font-size));
	line-height: 2.2rem;
}

.row.scheiding {
	padding-top: calc(0.5 * var(--row_padding-verticaal));
	padding-bottom: calc(0.75 * var(--row_padding-verticaal));
}

.row.scheiding .tweede-kolom {
	line-height: 0.2rem;
}

.row.scheiding img {
	width: 100%;
	height: 0.175rem;
}

.naam {
	font-weight: bold;
	text-transform: uppercase;
	line-height: 3.75rem;
	letter-spacing: 0.35rem;
}
.voornaam {
	font-size: 4rem;
	color: var(--bruin_headers);
}
.achternaam-mail {
	display: flex;
	align-items: baseline;
	column-gap: 0.75rem;
}
.achternaam {
	font-size: 3.75rem;
	color: #fff;
}
.email-icon,
.home-icon {
	height: 2.25rem;
	aspect-ratio: 1;
}

.tldr {
	line-height: 1.45rem;
	color: var(--bruin_tekst);
	font-size: 1.25rem;
	padding-left: 0.25rem;
	padding-top: 1.5rem;
	letter-spacing: 0.02rem;
	max-width: 65ch;
}
.row.profiel br,
br + br {
    content: " ";
    display: block;
    margin-bottom: calc(0.35 * var(--default_font-size));
}

span.bullet {
	color: #fff;
	font-size: calc(1.15 * var(--default_font-size));
	display: inline-block;
	padding: 0 0.1rem;
}

.header-row .tweede-kolom {
	display: flex;
	align-items: center;
	padding-left: var(--row_padding-horizontaal);
}

.begrip:before {
	content: '\2018';
}
.begrip:after {
	content: '\2019';
}

.titel {
	font-style: italic;
}
span.titel:before {
	content: open-quote;
}
span.titel:after {
	content: close-quote;
}

.nadruk {
	font-weight: bold;
	color: var(--bruin_headers);
}

.werkplek:not(:last-child) {
	margin-bottom: var(--default_font-size);
}

.werkplek .werk-header {
	font-weight: bold;
	line-height: calc(1.25 * var(--default_font-size));
	padding-bottom: calc(0.15 * var(--default_font-size));
}

a {
	color: var(--oranje);
	text-decoration-thickness: .175rem;
	text-underline-offset: 0.225rem;
}
a:hover {
	color: var(--bruin_tekst);
}
