:root {
    --color-primary: #005fcc;
    --color-text: #222;
    --color-bg: #ffffff;

    --container-width: 1200px;
    --spacing: 1rem;
}


/* inter-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/inter-v20-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/inter-v20-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-800italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 800;
  src: url('../fonts/inter-v20-latin-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* inter-200italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 200;
  src: url('../fonts/inter-v20-latin-200italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/inter-v20-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/inter-v20-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/inter-v20-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/inter-v20-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/inter-v20-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* inter-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/inter-v20-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}




html {
    scroll-behavior: smooth;
}

body {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400;

    color: var(--color-text);
    background: var(--color-bg);
}

/* Skip-Link */

.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    background: #000;
    color: #fff;
    padding: 1rem;
    z-index: 9999;
}

.skip-link:focus {
    left: 1rem;
}


/* Fokus sichtbar */

:focus-visible {
    outline: 3px solid var(--color-primary);
    outline-offset: 3px;
}

/* Container */

.container {
    width: min(
	calc(100% - 2rem),
	var(--container-width)
    );

    margin-inline: auto;
}

:root {
	--mw-page-gap: 40px;
}
/* Main */

main {

}

#main-slider {
    height: 100dvh;
    width: 100%;
    position: relative;
}

.marcel-wagner-main-slider-object {
	height: 100%;
	background: #000
}

.mw-slider-item-imagecontainer {
	height: 100%;
	width: 100%;
	overflow: hidden;
}

.mw-slider-item-imagecontainer figure {
	height: 100%;
	width: 100%;
	position: relative
}

.mw-slider-item-imagecontainer img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center
}

#main-slider {
	--swiper-navigation-size: 50px;
	--swiper-theme-color: #fff;
}

.swiper-button-prev-mw {
	position: absolute;
	left: var(--mw-page-gap) !important;
	bottom: var(--mw-page-gap) !important;
	top: auto !important;
	right: auto !important
}

.swiper-button-next-mw {
	position: absolute;
	left: calc( var(--mw-page-gap) + 60px) !important;
	bottom: var(--mw-page-gap) !important;
	top: auto !important;
	right: auto !important
}

#page-title {
	position: absolute;
	top: 0;
	left: var(--mw-page-gap);
	width: calc(100% - var(--mw-page-gap));
	height: 100dvh;
	z-index: 100;
	display: flex;
	justify-content: left; /* horizontal */
	align-items: center;     /* vertikal */
	color: #fff;
	pointer-events: none
}


#page-title h1 {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 800;
	font-size: 6rem;
	line-height: 1em;
	margin: 0;
	padding: 0;
	text-shadow:
	    0 2px 140px rgba(0,0,0,0.2),
	    0 8px 54px rgba(0,0,0,0.35);
}


.page-signature--container {
	padding: 30px 0 0 0
}


#page-title h2 {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400;
	font-size: 4rem;
	line-height: 1em;
	margin: 20px 0 0 0;
	text-shadow:
	    0 2px 140px rgba(0,0,0,0.2),
	    0 8px 54px rgba(0,0,0,0.35);
}

@media screen and (max-width: 1500px) {
	#page-title h1 { font-size: 5rem; }
	#page-title h2 { font-size: 4rem; }
}

@media screen and (max-width: 1400px) {
	#page-title {
		align-items: end;     /* vertikal */
	}
	
	.page-signature--container {
		padding: 30px 0 100px 0
	}
	
	.marcel-wagner-main-slider-object:before {
		content: '';
		position: absolute;
		left: 0;
		width: 100%;
		height: 50%;
		background: #000000;
		background: -webkit-linear-gradient(0deg, rgba(0, 0, 0, 0.43) 0%, rgba(0, 0, 0, 0) 100%);
		background: -moz-linear-gradient(0deg, rgba(0, 0, 0, 0.43) 0%, rgba(0, 0, 0, 0) 100%);
		background: linear-gradient(0deg, rgba(0, 0, 0, 0.43) 0%, rgba(0, 0, 0, 0) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#000000", GradientType=0);
		bottom: 0;
		z-index: 10
	}

}


@media screen and (max-width: 1000px) {
	#page-title h1 { font-size: 4rem; display: block; width: 90% }
	#page-title h2 { font-size: 2rem; }
}


/* Footer */

.site-footer {
	
}

.site-footer { 
	position: fixed; 
	right: var(--mw-page-gap); 
	bottom: var(--mw-page-gap);
	z-index: 100;color: #fff;
	text-align: right;
	font-size: .8rem;
	width: calc(100vh - 200px);
 }
 
 
 @media screen and (max-width: 700px) {
	 
	 #page-title h1 { font-size: 3rem; display: block; width: 90% }
	 #page-title h2 { font-size: 1.5rem; }
	 
	.site-footer { 
		position: relative;
		text-align: left;
		right: auto;
		bottom: auto;
		color: #000;
		width: 100%;
		padding: 30px 0
	}
	
	.page-signature--container {
		width: 60%;
	}
 }