:root {
		--black: #000000;
		--white: #ffffff;
		--base-dark: #014745;
		--brand: #014745;
		--base-light: #3F8D45;
		--accent-it: #6EB74C;
		--accent-net: #00A9F9;
		--gradient-1: linear-gradient(90deg, rgba(53,127,66,1) 0%, rgba(1,54,62,1) 100%);
		--gradient-2: linear-gradient(66deg, rgba(37,133,181,1) 0%, rgba(39,85,109,1) 100%);
		--xxsmall: 15px;
		--xsmall: 17px;
		--small: 20px;
		--regular: 24px;
		--medium: 28px;
		--large: 32px;
		--xlarge: 55px;
		--xxlarge: 100px;
	}

	@media only screen and (max-width: 768px) {
		:root {
			--xxsmall: 12px;
			--xsmall: 14px;
			--small: 15px;
			--regular: 18px;
			--medium: 22px;
			--large: 24px;
			--xlarge: 30px;
			--xxlarge: 44px;
		}
	}

	@media only screen and (max-width: 480px) {
		:root {
			--xxsmall: 12px;
			--xsmall: 14px;
			--small: 15px;
			--regular: 17px;
			--medium: 20px;
			--large: 24px;
			--xlarge: 27px;
			--xxlarge: 34px;
		}
	}

	@media only screen and (max-width: 400px) {
		:root {
			--xxsmall: 12px;
			--xsmall: 14px;
			--small: 15px;
			--regular: 17px;
			--medium: 20px;
			--large: 23px;
			--xlarge: 26px;
			--xxlarge: 31px;
		}
	}
	  
	  
	* {
		margin: 0;
		padding: 0;
		box-sizing: border-box;
    }

    html, body {
		height: 100%;
		width: 100%;
		font-family: 'Roboto', sans-serif;
		font-size: var(--small);
		overflow: hidden;
		background: #000;
    }

    /* WRAPPER */
    .split-wrapper {
		display: flex;
		width: 100%;
		height: 100vh;
    }

    .split {
		flex-basis: 50%; /* Normalzustand */
		transition: flex-basis 0.5s ease;
		display: flex;
		align-items: end;
		justify-content: center;
		background-size: cover;
		background-position: center;
		position: relative;
		color: #fff;
		user-select: none;
    }

    /* Hover-Effekt */
    .split:hover {
      	flex-basis: 60%; /* vergrößert */
    }

    .split-wrapper:hover .split:not(:hover) {
      	flex-basis: 40%; /* verkleinert */
    }

    /* Backgrounds */
    .left {
    	background-image: url('img/Landingpage_NET_2026.jpg');
    }

    .right {
		background-image: url('img/Landingpage_IT_2026.jpg');
    }

    /* Overlay */
    .split.left::before {
      	content: "";
      	position: absolute;
      	inset: 0;
      	background: rgba(0,0,0,0.5);
		z-index: 10;
    }
	  
    .split.left::after {
      	content: "";
      	position: absolute;
      	inset: 0;
		background: linear-gradient(180deg,rgba(0, 55, 82, 0) 0%, rgba(0, 55, 82, 1) 100%);
		z-index: 10;
    }
	  
    .split.right::before {
      	content: "";
      	position: absolute;
      	inset: 0;
      	background: rgba(0,0,0,0.5);
		z-index: 10;
    }
	  
    .split.right::after {
     	content: "";
      	position: absolute;
      	inset: 0;
		background: linear-gradient(180deg,rgba(1, 71, 69, 0) 0%, rgba(1, 71, 69, 1) 100%);
		z-index: 10;
    }

    /* CONTENT */
    .content {
      	position: relative;
      	text-align: left;
      	padding: 15vh 3rem;
      	width: 40vw;
		max-width:720px;
      	pointer-events: none; /* Hover nicht blockieren */
		z-index: 20;
    }

    .logo {
		max-width: 15rem;
		margin-bottom: 1rem;
		pointer-events: none;
    }

    h1 {
      	font-size: 2rem;
      	margin-bottom: 0.4rem;
		font-family: 'PT Sans Narrow', sans-serif;
		color: var(--accent-it);
		text-transform: uppercase;
    }
	
	.split.left h1{
		color: var(--accent-net);
	}
	  
    p {
      	font-size: 1rem;
      	margin-bottom: 1.2rem;
      	line-height: 1.4;
		font-weight: 200;
    }

    .btn {
		font-family: 'PT Sans Narrow', sans-serif;
		text-transform: uppercase;
		color:var(--white);
		font-weight: 600;
		text-decoration: none;
      	display: inline-block;
     	pointer-events: auto;
		position: relative;
		padding:5px 40px;
    }
	  
	.btn:after {
		content: "";
		width: 25px !important;
		height: 25px;
		border: 5px solid var(--accent-it);
		border-radius: 100px;
		position: absolute;
		bottom: 0px;
		left: 0;
	}
	  
	.split.left .btn:after {
		border: 5px solid var(--accent-net);
	}

	.btn:before {
		font-family: "Font Awesome 6 Free"; 
		font-weight: 900;
		content: "\f061";
		z-index: 2;
		position: relative;
		color: var(--white);
		top: 5px;
		left: -15px;
		font-size: var(--large);
	}

    /* MOBILE VIEW */
    @media (max-width: 768px) {
		html, body {
			overflow: auto;
		}

		.split-wrapper {
			flex-direction: column;
			height: auto;
		}

		.split {
			height: 50vh;
			flex-basis: 100% !important; /* Hover deaktiviert */
		}
		
		.content{
			width:100vw;
			padding:10vh 2rem;
		}
    }
	  
/* ############### Fonts ############### */

/* pt-sans-narrow-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: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/pt-sans-narrow-v18-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('/fonts/pt-sans-narrow-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/pt-sans-narrow-v18-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/pt-sans-narrow-v18-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/pt-sans-narrow-v18-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/pt-sans-narrow-v18-latin-regular.svg#PTSansNarrow') format('svg'); /* Legacy iOS */
}

/* pt-sans-narrow-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: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/pt-sans-narrow-v18-latin-700.eot'); /* IE9 Compat Modes */
  src: url('/fonts/pt-sans-narrow-v18-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/pt-sans-narrow-v18-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/pt-sans-narrow-v18-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/pt-sans-narrow-v18-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/pt-sans-narrow-v18-latin-700.svg#PTSansNarrow') format('svg'); /* Legacy iOS */
}

/* roboto-300 - 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: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/roboto-v30-latin-300.eot'); /* IE9 Compat Modes */
  src: url('/fonts/roboto-v30-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/roboto-v30-latin-300.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/roboto-v30-latin-300.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/roboto-v30-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-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: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/roboto-v30-latin-500.eot'); /* IE9 Compat Modes */
  src: url('/fonts/roboto-v30-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v30-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/roboto-v30-latin-500.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/roboto-v30-latin-500.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/roboto-v30-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-100italic - 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: 'Roboto';
  font-style: italic;
  font-weight: 100;
  src: url('/fonts/roboto-v30-latin-100italic.eot'); /* IE9 Compat Modes */
  src: url('/fonts/roboto-v30-latin-100italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v30-latin-100italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/roboto-v30-latin-100italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/roboto-v30-latin-100italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/roboto-v30-latin-100italic.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-300italic - 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: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('/fonts/roboto-v30-latin-300italic.eot'); /* IE9 Compat Modes */
  src: url('/fonts/roboto-v30-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v30-latin-300italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/fonts/roboto-v30-latin-300italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('/fonts/roboto-v30-latin-300italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('/fonts/roboto-v30-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */
}