/*RESET THE SHIT*/
frame-type-textmediahtml, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video,
caption,command,datalist,dfn,font, sub,sup,tt,var{    border: 0 none;  font: inherit;  margin: 0;  padding: 0;  vertical-align: baseline;background:transparent;outline:0;}
article, aside, details, figcaption, figure, footer, header, nav, section {display: block;}

body {line-height: 1;margin: 0}
ol, ul { list-style: none outside none;}
blockquote, q {    quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {    content: none;}
table, table td {    border-collapse: collapse;    border-spacing: 0;border:none;padding:0}
img {vertical-align:top;border:0}
embed {vertical-align:top;}
input[type=text], textarea{ outline:none;}
* {margin: 0;    padding: 0;-webkit-text-size-adjust: none;-webkit-padding-start: 0px;}
html{box-sizing:border-box}*,:after,:before{box-sizing:inherit}

/***** ALLGEMEINER KRAMs *****/
*, *:before, *:after{box-sizing: border-box;font: 300 1rem/1.5 'Montserrat', serif; padding: 0; margin: 0;}
.ie9 img[src$=".svg"] {  width: 100%; }
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { img[src$=".svg"] { width: 100%;}}


@font-face {
  font-family: 'Roboto';
  font-style: normal;  font-weight: 300; font-display: swap;
  src: url("../fonts/roboto-v50-latin-300.woff2") format("woff2");
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;  font-weight: 400; font-display: swap;
  src: url("../fonts/roboto-v50-latin-regular.woff2") format("woff2");
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;  font-weight: 700; font-display: swap;
  src: url("../fonts/roboto-v50-latin-600.woff2") format("woff2");
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;  font-weight: 300; font-display: swap;
  src: url("../fonts/montserrat-v31-latin-300.woff2") format("woff2");
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;  font-weight: 400; font-display: swap;
  src: url("../fonts/montserrat-v31-latin-regular.woff2") format("woff2");
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;  font-weight: 700; font-display: swap;
  src: url("../fonts/montserrat-v31-latin-700.woff2") format("woff2");
}

:root{
	--blau:#25378d; 		/*10.4:1 bei HG White*/
	--oranien: #fcbe00;	/*1.67:1 auf White --> zu gering*/

	--oraOnBlue: #FFD042;  /* 7.14:1 auf blau */

	--grau:  #555355;
	--focus: #1d1d1b;

	--font:"Montserrat";
	--p-size: 1rem;
	--lh-normal: 1.6;
	--font-nav:"Roboto";
}

html {-moz-text-size-adjust: none;  -ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;font-size: 100%; scroll-behavior: smooth;line-height: var(--lh-normal);}
body {font-family: var(--font);font-size: var(--p-size);line-height: var(--lh-normal);color: var(--blau);margin: 0 auto; padding: 0;}

html, body{height:100%;overflow-y: auto;color: var(--blau, #24378d)}
h1, h2, h3, p, ul, li, a,figcaption,
details, summary,i, strong {font-family: var(--font); color: var(--blau, #24378d); font-weight: 400}
strong {font-weight: 700; }

header nav ul,
header nav ul li,
header nav ul li a {font-family: var(--font-nav);font-size: var(--p-size); font-weight: 400}


/* Globale Link-Styles (barrierefrei)
   ============================== */
a {background-color: transparent; -webkit-text-decoration-skip: objects;color: var(--blau);text-decoration: none;
  min-width: 44px;min-height: 44px;display: inline-flex;align-items: center;
  transition: color 0.2s ease, border-color 0.2s ease;}
a:hover,
a:focus {color: var(--blau);text-decoration: underline;}

/* Screenreader-only */
.sr-only {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0 0 0 0);white-space: nowrap;border: 0;}

/* Globale Fokus-Stile */
:focus-visible {  outline: 3px dotted var(--grau);  outline-offset: 3px;  border-radius: 4px;}
:focus:not(:focus-visible) {outline: none;}

.oranien {color: var(--oranien) }
.blue {color:var(--blau)}

/*Skip*/
.skip-link {position:absolute;left:-9999px;	top:auto;width:1px;	height:1px;	overflow:hidden;background: #000; color: #fff}
.skip-link:focus {left: 10px;top:10px;width:auto;height:auto;padding:10px;background:#000;border:2px solid var(--blau);z-index:9999;color: #fff}

h1 {font-size: clamp(1.4rem, 3vw, 2rem);  	margin: 0.67em 0;line-height: 1.2;}
h2 {font-size: clamp(1.2rem, 2.5vw, 1.6rem);margin: 0.75em 0;line-height: 1.25;}
h3 {font-size: clamp(1.1rem, 2vw, 1.4rem);  margin: 1em 0 .5em;line-height: 1.3;}
h4 {font-size: clamp(1rem, 1.5vw, 1.2rem);	margin: 0.75em 0;line-height: 1.35;}
p {font-size: var(--p-size);  margin-bottom: 1em;line-height: var(--lh-normal);}

.small-space-before {margin-top: 1.5em}
.space-before		{margin-top: 2rem}
.space-after		{margin-bottom:2rem}

/* Header, Logo, Navigation */
header {
	background: rgba(255, 255, 255, 0.95);
	display: flex;
	width: 250px;
	flex-direction: column;
	justify-content: space-between;justify-content: flex-start;
	box-sizing: border-box;
	position: fixed;
	top: 0;
	z-index: 1;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	height: 730px;
}
header .logo{padding: 2em 2em 0 2em; display: block; height: auto;min-height: 100px;}
header .logo img{max-width: 175px;height: auto}

.menu-toggle {display: none;background: none;border: none;cursor: pointer;width: 50px;height: 50px;position: relative;z-index: 9999;align-items: center;justify-content: center;}
.menu-toggle .burger-lines,
.menu-toggle .burger-lines::before,
.menu-toggle .burger-lines::after {	content: "";display: block;	width: 30px;height: 3px;background: var(--blau);border-radius: 2px;	transition: 0.3s ease;	position: absolute;}
.menu-toggle .burger-lines {background:var(--blau)}
.menu-toggle .burger-lines::before {transform: translateY(-8px);}
.menu-toggle .burger-lines::after {	transform: translateY(8px);}
.menu-toggle[aria-expanded="true"] .burger-lines {background: transparent;}
.menu-toggle[aria-expanded="true"] .burger-lines::before {transform: rotate(45deg);}
.menu-toggle[aria-expanded="true"] .burger-lines::after {transform: rotate(-45deg);}
.menu-toggle:focus-visible {outline: 3px solid var(--blau);outline-offset: 3px;border-radius: 4px;}

header nav		 	{padding: 0;}
header nav ul 	 	{padding:1em 0}
header nav ul li 	{list-style: outside none none;}
header nav ul li a 	{text-decoration:none; padding:0 2.25em; display: flex}
header nav ul li a:hover,
header nav ul .active{color: white; background:var(--blau);}
header nav a:focus-visible {outline: 2px solid var(--blau);outline-offset: 2px;border-radius: 3px;}
header nav ul li:nth-last-child(4) {margin-top: 1.5em;}

header nav ul .active {cursor: default; min-height: 44px; padding:0 2.25em; display: flex;align-items: center; }
header nav ul .active::after  {content: " (aktuelle Seite)";position: absolute;left: -9999px;}

main.container {display: flex;flex-wrap: wrap;max-width: 70em;margin: 0 auto;padding: 1em;box-sizing: border-box;}
/* Artikelbereich */
article {
	margin-left: 17em;	margin-top: 7em;padding: 2em;
	flex: 1 1 60%;
	min-width: 22em;
	font-family: var(--font);font-size: var(--p-size);line-height: 1.6;	color: #333;
	background: rgba(255, 255, 255, 0.95);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
article a		{text-decoration: underline}
article a:hover	{color: black}

/* Listen */
article ul {margin: 0.5em 0 1em 1.5em;	padding: 0;}
article ul li {	margin-bottom: 0.5em;}

/* Entferne Standard-Listenpunkte */
ul.pointless {list-style: none;padding-left: 0;margin: 0;margin-left: 1.5em}
ul.pointless li{}

ul.disclist {list-style-type: disc;  padding-left: 1.25rem;margin: 0 1em .5em 1em;}
ul.disclist li{margin-bottom: .25em}

ul.teamlist {list-style: none;padding-left: 0;margin: 0 1.5em;}
ul.teamlist li{position: relative;	padding-bottom: .5rem;	margin-bottom: 1.5rem;}
ul.teamlist li::after {	content: "";position: absolute;	left: 50%;bottom: 0;transform: translateX(-50%);width: 5em;height: 2px;background-color: var(--oranien);}
ul.teamlist li:last-child::after {	display: none;}

li dfn {
  display: block;
  margin-top: 0.4rem;
  font-style: normal;          /* kein Kursiv-Zwang */
  font-size: 0.95rem;
  color: #333;
  background-color: #f5f7f9;
  border-left: 4px solid var(--oranien);
  padding: 0.4rem 0.6rem;
  border-radius: 0.2rem;
}
/* Runder Kreis mit Pfeil*/
.icon-circle-arrow {
	display: inline-flex;align-items: center;justify-content: center;
	width: 1rem;height: 1rem;position: relative;margin-left: .25em;
	background-color: var(--blau);border-radius: 50%;color: white;
}
.icon-circle-arrow::after {
	content: '→';
	position: absolute;top: 50%;left: 50%;
	font-size: 1rem;line-height: 1;
	transform: translate(-50%, -50%) scale(.8);
}

/* Slider
-----------------*/
.slider {position: relative;margin: 2rem auto;	}
.slider-track {display: flex;overflow: hidden;}
.slide {min-width: 100%;display: none;}
.slide.is-active {display: block;}
.slide img {max-width: 100%;height: auto;display: block;}
.slider-controls {display: flex;justify-content: space-between;margin-top: 0.5rem;position: absolute;top: 45%;width: 100%;}
.slider-controls button {background: rgba(255, 255, 255, 0.65);border: 2px solid var(--blau);color: var(--blau);font-size: 1.5rem;padding: 0.25em 0.75em;cursor: pointer;}
.slider-controls button:focus-visible {outline: 3px dotted var(--focus);outline-offset: 3px;}
.slider-status {font-size: 0.9rem;margin-top: 0.5rem;	}

@media (prefers-reduced-motion: reduce) {* {transition: none !important;}}

/*Einzelnes HG Bild als Cover ohne Slide*/
.coverbild 		{position: absolute;inset: 0;z-index: -1;height: 100dvh;overflow: hidden;}
.coverbild img 	{width: 100%;height: 100%;object-fit: cover;object-position: center;opacity: .5;}

/*SLIDER Startseite*/
article.intro{background: none; box-shadow: none}
.starter {	opacity: 0;	transform: translateY(0.5rem);
	animation: fadeIn 0.6s ease forwards;
	animation-delay: 3s; /* Verzögerung von 2 Sekunden */
}

@keyframes fadeIn {
	from {opacity: 0;transform: translateY(0.5rem);	}
	to   {opacity: 1;transform: translateY(0);}
}

/* Bewegungsreduktion */
@media (prefers-reduced-motion: reduce) {
	.starter {animation: none;opacity: 1;transform: none;}
}

div.coverslider { position: fixed;top:0; left:0;margin: 0; padding: 0; width: 100%;height: 100svh;box-sizing: border-box; z-index: -1;  overflow: hidden;  background: none;  pointer-events: none;  box-shadow: none;}
.bg-slider {position: absolute;	inset: 0;	z-index: -1;}
.bg-track {	position: relative;	width: 100%;height: 100%;}
.bg-slide {	position: absolute;	inset: 0;
	background-size: cover;	background-position: center;background-repeat: no-repeat;
	opacity: 0;	transform: translateX(100%);
	animation: slideFade 36s infinite;
	animation-fill-mode: both;
	animation-timing-function: ease-in-out;
}

.bg-slide:first-child 		{opacity: 1;transform: translateX(0);animation: none;}
.bg-slide:nth-child(n+2) 	{animation: slideFade 36s infinite;animation-fill-mode: both;animation-timing-function: ease-in-out;}

.slider-toggle {position: absolute;	right: 1rem;bottom: 1rem;
	background: var(--oraOnBlue);border: 2px solid var(--blau);color: var(--blau);
	padding: 0.4em 0.8em;cursor: pointer;z-index: 100000;min-height: 44px; min-width: 44px;
}
.slider-toggle:focus-visible,
.slider-toggle:hover {	outline: 3px dotted var(--focus);	outline-offset: 3px;}



.coverslider.is-paused .bg-slide {	animation: none !important;}

/* 6 Bilder → 36s = 6 × 6s */
/*.bg-slide:nth-child(1) { animation-delay: 0s; }*/
.bg-slide:nth-child(2) { animation-delay: 2s; }
.bg-slide:nth-child(3) { animation-delay: 8s; }
.bg-slide:nth-child(4) { animation-delay: 14s; }
.bg-slide:nth-child(5) { animation-delay: 20s; }
.bg-slide:nth-child(6) { animation-delay: 26s; }

@keyframes slideFade {
	0% {opacity: 0;transform: translateX(100%);}
	5% {opacity: 1;transform: translateX(0);}
	30% {opacity: 1;transform: translateX(0);}
	35% {opacity: 0;transform: translateX(0);}
	100% {opacity: 0;transform: translateX(0);}
}

@media (prefers-reduced-motion: reduce) {
	.bg-slide {animation: none !important;opacity: 1;transform: none;}
	.bg-slide:first-child {opacity: 1;	}
}


/* Mobile Styles */
@media (min-width: 661px) {	#nav {display: block !important;position: static;}}
@media (max-width: 660px) {
	article {margin-left: 0;margin-top: 1em;flex: 1 1 100%;padding: .5em 1em;min-width: auto;	}
	main.container {flex-direction: column;padding: 0}
	header {position: relative;width: 100%;max-width: none;min-height: auto;flex-direction: row;align-items: center;padding: 0 1rem;height: auto;justify-content: space-between; height: auto;}
	header .logo {padding: .5em 0;flex-grow: 1;min-height: 60px;}
	.menu-toggle {display: flex; cursor: pointer;padding: 1em;}
	#target__nav {display: none;position: absolute;top: 100%;left: 0;background: white;width: 100%;padding: 1em 0;box-shadow: 0 4px 16px rgba(0,0,0,0.1);}
	#target__nav.open {display: block;}

	.bg-slide {animation: none !important;opacity: 1;transform: none;}
	.bg-slide:first-child {opacity: 1;	}
	.slider-toggle {display: none}

}

@media (max-height: 730px) {
	article {margin-left: 0;margin-top: 1em;flex: 1 1 100%;padding: .5em 1em;min-width: auto;	}
	main.container {flex-direction: column;padding: 0}
	header {position: relative;width: 100%;max-width: none;min-height: auto;flex-direction: row;align-items: center;padding: 0 1rem;height: auto;justify-content: space-between;height: auto;}
	header .logo {padding: .5em 0;flex-grow: 1;min-height: 60px;}
	.menu-toggle {display: flex; cursor: pointer;padding: 1em;}
	#target__nav {display: none;position: absolute;top: 100%;left: 0;background: white;width: 100%;padding: 1em 0;box-shadow: 0 4px 16px rgba(0,0,0,0.1);}
	#target__nav.open {display: block;}
}