/* =============================================================================

   responsive.css – Smartphone-Anpassungen (Desktop unverändert via Media Query)

   ============================================================================= */



@media screen and (max-width: 768px) {



	html,

	body {

		overflow-x: hidden;

	}



	#wrap,

	#margin,

	#middle,

	#middle_start,

	#content-wrap,

	#content,

	.site-page {

		width: 100% !important;

		max-width: 100% !important;

		float: none !important;

		box-sizing: border-box;

	}



	#banner {

		display: none;

	}



	/* Layout: oben Navigation, darunter Inhalt (keine Sidebar) */

	.site-page {

		display: block;

	}



	.site-chrome {

		position: sticky;

		top: 0;

		z-index: 900;

		width: 100%;

		background: #fff;

		border-bottom: 2px solid #FF9900;

	}



	.site-mobile-header {

		display: flex;

		flex-wrap: wrap;

		align-items: center;

		gap: 8px 10px;

		padding: 10px 12px;

		box-sizing: border-box;

		background: #fff;

	}



	.site-mobile-brand {

		display: flex;

		flex: 1 1 auto;

		align-items: flex-end;

		justify-content: space-between;

		gap: 10px 14px;

		min-width: 0;

		padding-bottom: 5px;

		border-bottom: 2px solid #FF9900;

	}



	.site-mobile-logo {

		flex: 0 1 auto;

		min-width: 0;

		text-decoration: none;

	}



	.site-mobile-logo-text {

		display: block;

		font-family: 'Open Sans', Arial, Helvetica, sans-serif;

		font-weight: 300;

		font-size: 11pt;

		line-height: 1.05;

		letter-spacing: 0.04em;

		color: #FF9900;

		text-transform: uppercase;

	}



	.site-mobile-title {

		flex: 1 1 auto;

		min-width: 0;

		margin-left: auto;

		font-family: 'Open Sans', Arial, Helvetica, sans-serif;

		font-weight: 300;

		font-size: 10pt;

		line-height: 1.15;

		letter-spacing: 0.03em;

		color: #FF9900;

		text-transform: uppercase;

		text-align: right;

	}



	.site-mobile-quick {

		display: flex;

		flex: 1 1 100%;

		align-items: center;

		gap: 6px 12px;

		order: 3;

		font-family: 'Open Sans', Arial, Helvetica, sans-serif;

		font-size: 10pt;

	}



	.site-mobile-quick a {

		color: #000;

		text-decoration: none;

		white-space: nowrap;

	}



	.site-mobile-quick a:hover,

	.site-mobile-quick a:active {

		color: #FF9900;

		text-decoration: underline;

	}



	.site-nav-open {

		flex-shrink: 0;

		order: 2;

		border: 1px solid #FF9900;

		background: #fff;

		color: #FF9900;

		font-family: 'Open Sans', Arial, Helvetica, sans-serif;

		font-size: 10pt;

		font-weight: 600;

		padding: 7px 12px;

		cursor: pointer;

	}



	body.site-nav-open .site-nav-open {

		background: #FF9900;

		color: #fff;

	}



	/* Hauptmenü klappt unter dem Header auf */

	.site-nav-desktop {

		display: none !important;

	}



	.site-nav-mobile {

		display: block;

	}



	.site-nav-panel {

		display: block;

		max-height: 0;

		overflow: hidden;

		background: #fff;

		transition: max-height 0.28s ease;

	}



	body.site-nav-open .site-nav-panel {

		max-height: min(85vh, calc(100dvh - 100px));

		overflow-y: auto;

		-webkit-overflow-scrolling: touch;

		border-top: 1px solid #e8e8e8;

		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);

	}



	.site-nav-mobile-list {

		padding: 10px 12px 12px;

	}



	.site-nav-mobile-primary,

	.site-nav-mobile-secondary,

	.site-nav-mobile-sub {

		list-style: none;

		margin: 0;

		padding: 0;

	}



	.site-nav-mobile-primary {

		display: grid;

		grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));

		gap: 8px 10px;

	}



	.site-nav-mobile-primary > li {

		min-width: 0;

	}



	.site-nav-mobile-link,

	.site-nav-mobile-sublink,

	.site-nav-mobile-meta {

		display: flex;

		align-items: center;

		box-sizing: border-box;

		min-height: 44px;

		font-family: 'Open Sans', Arial, Helvetica, sans-serif;

		font-weight: 400;

		font-size: 10.25pt;

		line-height: 1.25;

		color: #000;

		text-decoration: none;
		overflow-wrap: anywhere;

	}



	.site-nav-mobile-primary > li:not(.site-nav-mobile-group) .site-nav-mobile-link {

		height: 100%;

		padding: 9px 10px;

		border: 1px solid #e6e6e6;

		background: #fff;

	}



	.site-nav-mobile-group {

		grid-column: 1 / -1;

		border: 1px solid #e0e0e0;

		overflow: hidden;

	}



	.site-nav-mobile-group .site-nav-mobile-link {

		padding: 10px 12px;

		border-bottom: 1px solid #e6e6e6;

		background: #fafafa;

		font-weight: 600;

	}



	.site-nav-mobile-link.is-active,

	.site-nav-mobile-sublink.is-active,

	.site-nav-mobile-meta.is-active {

		color: #FF9900;

		font-weight: 600;

		border-color: #FF9900;

	}



	.site-nav-mobile-sub {

		display: grid;

		grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));

		gap: 6px 8px;

		margin: 0;

		padding: 8px;

		background: #f5f5f5;
		visibility: visible;

	}



	.site-nav-mobile-sub .site-nav-mobile-sublink {

		padding: 8px 10px;

		border: 1px solid #e8e8e8;

		background: #fff;

		font-size: 9.5pt;

		min-height: 40px;

	}



	.site-nav-mobile-secondary {

		display: grid;

		grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));

		gap: 6px 10px;

		margin-top: 10px;

		padding-top: 10px;

		border-top: 1px solid #e8e8e8;

	}



	.site-nav-mobile-meta {

		padding: 8px 10px;

		border: 1px solid #e8e8e8;

		background: #fafafa;

		font-size: 9.5pt;

		color: #444;

		min-height: 40px;

	}



	.site-nav-mobile-lang {

		grid-column: 1 / -1;

		justify-content: center;

		font-weight: 600;

		color: #000;

	}

	@media screen and (max-width: 420px) {

		.site-nav-mobile-list {

			padding-left: 10px;

			padding-right: 10px;

		}



		.site-nav-mobile-primary,

		.site-nav-mobile-secondary {

			gap: 6px 8px;

		}



		.site-nav-mobile-sub {

			grid-template-columns: repeat(2, minmax(0, 1fr));

		}



		.site-nav-mobile-link,

		.site-nav-mobile-sublink,

		.site-nav-mobile-meta {

			font-size: 10pt;

		}

	}



	#middle_start .site-main {

		background-image: none !important;

	}



	#content {

		overflow: visible;

	}



	.site-main {

		width: 100% !important;

		padding: 12px !important;

		box-sizing: border-box;

	}



	.site-nav-footer,

	.site-nav-footer table {

		width: 100% !important;

		max-width: 100%;

	}



	#content table[width="510"],

	#content table[width="100%"] {

		width: 100% !important;

		max-width: 100%;

	}



	#content img {

		max-width: 100%;

		height: auto;

	}



	#content img[width="510"] {

		width: 100% !important;

	}



	/* Startseite: Foto oben, Aktuelles-Box darunter */

	.site-main > table,

	.site-main > table tbody,

	.site-main > table tr {

		display: block;

		width: 100% !important;

	}



	.site-main > table td {

		display: block;

		width: 100% !important;

		box-sizing: border-box;

	}



	.home-hero-cell {

		height: auto !important;

		padding: 0 0 12px 0 !important;

		overflow: visible;

	}



	.home-portrait {

		display: block;

		float: none;

		width: 100%;

		max-width: 320px;

		height: auto;

		margin: 0 auto 12px;

	}



	.home-spacer {

		display: none !important;

	}



	.home-content-cell {

		padding: 0 !important;

	}



	.home-content-cell > div {

		width: 100% !important;

		max-width: 100%;

		box-sizing: border-box;

	}



	.aktuellbox {

		width: 100% !important;

		max-width: 100%;

		box-sizing: border-box;

		clear: both;

	}



	.oktext {

		width: 100% !important;

		max-width: 100%;

		box-sizing: border-box;

	}



	td {

		font-size: 11pt;

		line-height: 1.45;

	}



	h1,

	span.ueber {

		font-size: 12pt;

	}



	#bottom {

		background-size: contain;

		background-position: center bottom;

	}

}