/* TheSerif Font Family */
/* @font-face {
  font-family: 'TheSerif';
  src: url('../fonts/TheSerif-Plain.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
} */

@font-face {
	font-family: "TheSerif";
	src: url("../fonts/TheSerif-Plain.otf") format("opentype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "TheSerif";
	src: url("../fonts/TheSerif-Italic.otf") format("opentype");
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: "TheSerif";
	src: url("../fonts/TheSerifExtraBold-Plain.otf") format("opentype");
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "TheSerif";
	src: url("../fonts/TheSerifExtraBold-ExtBdIta4.otf") format("opentype");
	font-weight: bold;
	font-style: italic;
	font-display: swap;
}

/* add the new InclusiveSans Variable Fonts */
@font-face {
	font-family: "Inclusive Sans";
	src: url("../fonts/InclusiveSans-VariableFont_wght.ttf") format("truetype");
	font-weight: 100 900;
	font-display: swap;
}

@font-face {
	font-family: "Inclusive Sans";
	src: url("../fonts/InclusiveSans-Italic-VariableFont_wght.ttf")
		format("truetype");
	font-weight: 100 900;
	font-style: italic;
	font-display: swap;
}

body {
	font-family: "Inclusive Sans";
	color: #312783;
}

.col:has(.logo) {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.logo {
	max-width: 150px;
	display: flex;
}

.header-link {
	font-family: "TheSerif";
	font-weight: bold;
	color: #312783;
	text-decoration: none;
	padding: 0.5rem 2rem;
	transition: all 0.3s ease;
	position: fixed;
	top: 0px;
	z-index: 9999;
	border-right: 1px solid white;
	border-bottom: 1px solid white;
	left: 0px;
	display: block;
	background-color: #312783;
	color: white;
	border-bottom-right-radius: 11px;
}

.header-link.personal {
	background-color: #e94f35;
}
.header-link.nebenjob {
	background-color: #312783;
	color: white;
}

.header-link.personal:hover {
	background-color: #312783;
	color: white;
}
.header-link.nebenjob:hover {
	background-color: #e94f35;
}
.logo svg,
.hearthand svg {
	height: auto;
	width: auto;
}

header {
	margin-top: 1rem;
	margin-bottom: 3rem;
}

/* Section spacing moved to layout.css */

section a {
	color: currentColor;
}
/* Content wrapper styling moved to layout.css */

footer {
	background-color: #e94f35;
	font-family: "TheSerif";
}

footer .img-wrapper.is-svg {
	text-align: left;
}

footer .block-image:has(svg) {
	width: fit-content;
	margin-right: 20px;
	margin-top: 0px !important;
}

footer .block-image svg {
	width: 64px;
	height: 64px;
}

footer .block-text p + p {
	margin-top: 1rem;
}

@media screen and (max-width: 768px) {
	footer .row {
		flex-direction: column;
	}
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "TheSerif";
	margin: 0;
	padding: 0;
}

h1 em,
h2 em,
h3 em,
h4 em,
h5 em,
h6 em {
	font-size: var(--step-0);
	font-style: unset;
	font-weight: normal;
}

p {
	margin: 0;
	padding: 0;
	line-height: 1.3;
}

ul,
ol {
	font-size: var(--step-0);
}

a,
a:visited {
	color: #312783;
}