@import url('/assets/css/typography.css');
@import url('/assets/css/layout.css');
@import url('/assets/css/buttons.css');
@import url('/assets/css/interaction.css');
:root {
	--colour-black: #2a2323;
	--colour-grey-100: hsl(0, 0%, 20%);
	--colour-grey-80: hsl(0, 0%, 30%);
	--colour-grey-70: hsl(0, 0%, 45%);
	--colour-grey-60: hsl(0, 0%, 60%);
	--colour-grey-40: hsl(0, 0%, 85%);
	--colour-grey-30: hsl(0, 0%, 92%);
	--colour-grey-25: hsl(0, 0%, 93%);
	--colour-grey-23: hsl(0, 0%, 93.5%);
	--colour-grey-20: hsl(0, 0%, 95%);
	--colour-grey-00: #fff;
	--colour-white: var(--colour-grey-00);
	--colour-red: #ca0000;

	--text-font: 'Signifier', serif;
	--display-font: 'Signifier', serif;
}
:root {
	--font-size-xxl: 1.6rem/1.5;
	--font-size-xl: 1.4rem/1.5;
	--font-size-l: 1.1rem/1.5;
	--font-size-m: 1em/1.5;
	--font-size-s: 0.85rem/1.1;
	--font-size-xs: 0.7rem/1.1;
	--font-size-xxs: 0.65rem/1.1;
}
@media screen and (min-width: 480px) {
	:root {
		--font-size-xxl: 1.75rem/1.5;
		--font-size-xl: 1.5rem/1.5;
		--font-size-l: 1.125rem/1.5;
		--font-size-m: 1em/1.5;
		--font-size-s: 0.85rem/1.1;
		--font-size-xs: 0.7rem/1.1;
		--font-size-xxs: 0.65rem/1.1;
	}
}
@media screen and (min-width: 720px) {
	:root {
		--font-size-xxl: 2em/1.5;
		--font-size-xl: 1.5rem/1.5;
		--font-size-l: 1.25rem/1.5;
		--font-size-m: 1em/1.5;
		--font-size-s: 0.85rem/1.1;
		--font-size-xs: 0.75rem/1.1;
		--font-size-xxs: 0.65rem/1.1;
	}
}
/* Base */
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
body {
	background-color: var(--colour-grey-20);
}
main::after {
	content: '•';
	text-align: center;
	display: block;
}
img {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	object-fit: cover;
}
a {
	text-decoration: none;
	text-underline-offset: 5px;
}

/* Header  */
/* #meilenstein  */
/* Special #milestone */
/* #highlights {
	li {
		list-style: none;
	}

	#auszeichnungen {
		border: 1px solid var(--colour-grey-100);

		@media screen and (max-width: 40rem) {
			.title {
				font: 300 var(--font-size-xxl) var(--display-font);
				line-height: 2rem;
			}
		}
		@media screen and (min-width: 40rem) {
			& * {
				font: 300 var(--font-size-xl) var(--display-font);
				letter-spacing: 0.5rem;
				text-transform: uppercase;
				text-align: justify;
				-webkit-hyphens: auto;
				-moz-hyphens: auto;
				hyphens: auto;
			}

			.title,
			.description {
				display: inline;
			}
			.title {
				color: var(--colour-red);
			}
		}

		span {
			&.separator {
				margin: 0 1rem;
			}
			@media screen and (max-width: 40rem) {
				&.separator {
					display: none;
				}
				&.auszeichnung {
					display: list-item;
					margin-left: 1rem;
					text-transform: initial;
					letter-spacing: initial;
				}
			}
		}
		& > * {
			transition: color 0.25s ease-out;
		}
	}
	#publikationen-herausgeberschaften {
		max-width: 55rem;
		margin: 5vh auto;
		h2 {
			font: 300 var(--font-size-xl) var(--display-font);
			line-height: 1.5em;
			text-transform: uppercase;
			letter-spacing: 0.5rem;
			margin: 5vh 0 2.5vh;
			hyphens: auto;
		}
		@media screen and (min-width: 40rem) {
			.description {
				font: 300 var(--font-size-l) var(--display-font);
				text-transform: uppercase;
				line-height: 2em;
				letter-spacing: 0.25rem;
			}
		}
		.separator {
			margin: 0 0.5rem;
		}
		.publikation {
			font: 400 var(--font-size-s) var(--display-font);

			text-transform: uppercase;
			line-height: 2em;
			letter-spacing: 0.05rem;

			padding: 0.5rem 1em;
			border: 1px solid var(--colour-grey-100);
			border-radius: 1px;
			margin: -1px;

			@media screen and (min-width: 40rem) {
				letter-spacing: 0.25rem;
				padding: 0.5rem 1.5rem;
			}
		}
	}
} */
/* Temp */