/******************************************************************
  Template Name: DJoz
  Description:  DJoz Music HTML Template
  Author: Colorlib
  Author URI: https://colorlib.com
  Version: 1.0
  Created: Colorlib
******************************************************************/

/*------------------------------------------------------------------
[Table of contents]

1.  Template default CSS
	1.1	Variables
	1.2	Mixins
	1.3	Flexbox
	1.4	Reset
2.  Helper Css
3.  Header Section
4.  Hero Section
5.  Services Section
6.  Track Section
7.  Team Section
8.  Contact
9.  Footer Style
-------------------------------------------------------------------*/

/*----------------------------------------*/

/* Template default CSS
/*----------------------------------------*/

html,
body {
	height: 100%;
	font-family: "Now Regular";
	-webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	color: #111111;
	font-weight: 400;
	font-family: "Rajdhani", sans-serif;
}

h1 {
	font-size: 70px;
}

h2 {
	font-size: 36px;
}

h3 {
	font-size: 30px;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

p {
	font-size: 15px;
	font-family: "Now Regular";
	color: #444444;
	font-weight: 400;
	line-height: 26px;
	margin: 0 0 15px 0;
}

img {
	max-width: 100%;
}

input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
button:focus:not(:focus-visible),
textarea:focus:not(:focus-visible) {
	outline: none;
}

a:hover,
a:focus {
	text-decoration: none;
	outline: none;
	color: #ffffff;
}

a:focus:not(:focus-visible) {
	outline: none;
}

/* Barrierefreiheit: sichtbarer Tastatur-Fokus (ohne Layout-Aenderung) */
:focus-visible {
	outline: 2px solid #006699;
	outline-offset: 2px;
}

ul,
ol {
	padding: 0;
	margin: 0;
}

/*---------------------
  Helper CSS
-----------------------*/

.section-title {
	margin-bottom: 40px;
	position: relative;
	z-index: 1;
}

.section-title.center-title {
	text-align: center;
}

.section-title h2 {
	font-size: 42px;
	color: #111111;
	font-weight: 700;
	text-transform: uppercase;
}

.section-title h1,
.section-title .section-title__bg {
	font-size: 100px;
	color: #e4e4e4;
	font-family: "Rockville Solid Regular";
}

/* Legacy: absolutes Wasserzeichen-h1 (ohne Grid-Overlay) */
.section-title h1:not(:has(+ .section-title__bg)) {
	position: absolute;
	left: 0;
	top: -45px;
	width: 100%;
	z-index: -1;
}

/* Overlay: Vordergrund-h2 an unterer Kante des Wasserzeichens (Index u. a.) */
.section-title:has(.section-title__bg) {
	--title-overlay-pad-bottom: 10px;
	display: grid;
	justify-items: center;
	align-items: end;
	min-height: 88px;
	padding: 4px 0 0;
}

.section-title:has(.section-title__bg) .section-title__bg {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 0;
	top: auto;
	left: auto;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: 100%;
	text-align: center;
	margin: 0;
	padding: 0;
	line-height: 0.92;
	pointer-events: none;
}

.section-title:has(.section-title__bg) > h1,
.section-title:has(.section-title__bg) > h2 {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 1;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: calc(100% - 32px);
	margin: 0;
	padding: 0 16px 0;
	text-align: center;
	line-height: 1;
	font-family: "Rajdhani", sans-serif;
}

/* Index About + Track: BG links, Vordergrund auf BG-Mitte zentriert */
.about__text .section-title:has(.section-title__bg),
.track .section-title:has(.section-title__bg) {
	display: inline-block;
	width: auto;
	max-width: 100%;
	min-height: 0;
	text-align: left;
}

.about__text .section-title:has(.section-title__bg) .section-title__bg,
.track .section-title:has(.section-title__bg) .section-title__bg {
	display: block;
	position: relative;
	grid-column: unset;
	grid-row: unset;
	justify-self: unset;
	align-self: unset;
	text-align: left;
}

.about__text .section-title:has(.section-title__bg) > h2 {
	position: absolute;
	left: 0;
	right: 0;
	grid-column: unset;
	grid-row: unset;
	justify-self: unset;
	align-self: unset;
	bottom: 0;
	width: 100%;
	max-width: none;
	margin: 0;
	box-sizing: border-box;
	text-align: center;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
}

/* „Latest tracks“ breiter als „Releases“: einzeilig, auf BG-Mitte zentriert */
.track .section-title:has(.section-title__bg) > h2 {
	position: absolute;
	left: 50%;
	right: auto;
	grid-column: unset;
	grid-row: unset;
	justify-self: unset;
	align-self: unset;
	bottom: 0;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: none;
	margin: 0;
	padding: 0 16px;
	box-sizing: border-box;
	text-align: center;
	white-space: nowrap;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}

.set-bg {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}

.spad {
	padding-top: 100px;
	padding-bottom: 100px;
}

.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white span,
.text-white li,
.text-white a {
	color: #fff;
}

/* buttons */

.primary-btn {
	display: inline-block;
	font-size: 15px;
	text-transform: uppercase;
	padding: 14px 25px 12px;
	color: #ffffff;
	background: #006699;
	letter-spacing: 2px;
}

.primary-btn.border-btn {
	background: transparent;
	border: 2px solid #006699;
	color: #111111;
}

.site-btn {
	font-size: 15px;
	color: #ffffff;
	background: #006699;
	font-weight: 700;
	letter-spacing: 2px;
	border: none;
	text-transform: uppercase;
	display: inline-block;
	padding: 14px 30px;
	width: 100%;
}

/* Preloder */

#preloder {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 999999;
	background: #000;
}

.loader {
	width: 40px;
	height: 40px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -13px;
	margin-left: -13px;
	border-radius: 60px;
	animation: loader 0.8s linear infinite;
	-webkit-animation: loader 0.8s linear infinite;
}

@keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
	50% {
		-webkit-transform: rotate(180deg);
		transform: rotate(180deg);
		border: 4px solid #006699;
		border-left-color: transparent;
	}
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
}

@-webkit-keyframes loader {
	0% {
		-webkit-transform: rotate(0deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
	50% {
		-webkit-transform: rotate(180deg);
		border: 4px solid #006699;
		border-left-color: transparent;
	}
	100% {
		-webkit-transform: rotate(360deg);
		border: 4px solid #f44336;
		border-left-color: transparent;
	}
}

/*---------------------
  Header
-----------------------*/

.header {
	background: transparent;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 9;
	-webkit-transition: background-color 0.35s ease, box-shadow 0.35s ease;
	-o-transition: background-color 0.35s ease, box-shadow 0.35s ease;
	transition: background-color 0.35s ease, box-shadow 0.35s ease;
}

.header.header--normal {
	position: relative;
	background: #002535;
}

.header.header--overlay {
	position: fixed;
	z-index: 999;
	background-color: transparent;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.header.header--overlay.header--past-hero {
	background-color: #006699;
	-webkit-box-shadow: 0 2px 14px rgba(0, 0, 0, 0.18);
	box-shadow: 0 2px 14px rgba(0, 0, 0, 0.18);
}

.header__logo {
	padding: 30px 0 15px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.header__logo a {
	display: inline-block;
	line-height: 0;
}

.header__logo img {
	display: block;
	height: auto;
	max-width: 100%;
	-webkit-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
	-webkit-transform-origin: left center;
	-ms-transform-origin: left center;
	transform-origin: left center;
}

.header__nav {
	text-align: right;
}

.header__menu {
	padding: 31px 0 27px;
	display: inline-block;
	margin-right: 0;
}

.header__menu ul li {
	list-style: none;
	display: inline-block;
	margin-right: 45px;
	position: relative;
}

.header__menu ul li.active a:after {
	opacity: 1;
}

.header__menu ul li:hover a:after {
	opacity: 1;
}

.header__menu ul li:hover .dropdown {
	top: 34px;
	opacity: 1;
	visibility: visible;
}

.header__menu ul li:last-child {
	margin-right: 0;
}

.header__menu ul li .dropdown {
	position: absolute;
	left: 0;
	top: 56px;
	width: 150px;
	background: #111111;
	text-align: left;
	padding: 2px 0;
	z-index: 9;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
}

.header__menu ul li .dropdown li {
	display: block;
	margin-right: 0;
}

.header__menu ul li .dropdown li a {
	font-size: 14px;
	color: #ffffff;
	font-weight: 400;
	padding: 8px 20px;
	text-transform: capitalize;
}

.header__menu ul li .dropdown li a:after {
	display: none;
}

.header__menu ul li a {
	font-size: 15px;
	text-transform: capitalize;
	color: #ffffff;
	display: block;
	padding: 6px 0;
	position: relative;
}

.header__menu ul li a:after {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background: #ffffff;
	content: "";
	-webkit-transition: all, 0.5s;
	-o-transition: all, 0.5s;
	transition: all, 0.5s;
	opacity: 0;
}

.header__right__social {
	display: inline-block;
}

.header__right__social a {
	display: inline-block;
	font-size: 16px;
	color: #ffffff;
	margin-right: 16px;
}

.header__right__social a:last-child {
	margin-right: 0;
}

.slicknav_menu {
	display: none;
}

.slicknav_btn:focus-visible {
	outline: 2px solid #006699;
	outline-offset: 2px;
}

.slicknav_btn {
	border: none;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	font: inherit;
	color: inherit;
}

/*---------------------
  Hero
-----------------------*/

.hero {
	padding-top: 400px;
	padding-bottom: 295px;
	position: relative;
	overflow: hidden;
	background-image: none !important;
}

.hero.hero--bg-active {
	background-image: none !important;
}

.hero.hero--intro-enabled {
}

.hero.hero--intro-enabled .container {
	position: relative;
	z-index: 1;
}

.hero.hero--intro-enabled .linear__icon {
	z-index: 1;
}

.hero.hero--intro-enabled .hero__text span,
.hero.hero--intro-enabled .hero__text h1,
.hero.hero--intro-enabled .hero__text .play-btn,
.hero.hero--intro-enabled .linear__icon {
	opacity: 0;
	-webkit-transform: translateY(18px);
	-ms-transform: translateY(18px);
	transform: translateY(18px);
	-webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
	transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
	-o-transition: opacity 0.5s ease, transform 0.5s ease;
	transition: opacity 0.5s ease, transform 0.5s ease;
	transition: opacity 0.5s ease, transform 0.5s ease, -webkit-transform 0.5s ease;
}

.hero.hero--intro-enabled.hero--intro-done {
}

.hero__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
}

.hero__bg-image {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: 50% 50%;
	object-position: 50% 50%;
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-webkit-transform-origin: center center;
	-ms-transform-origin: center center;
	transform-origin: center center;
	-webkit-transition: -webkit-transform 3.6s ease;
	transition: -webkit-transform 3.6s ease;
	-o-transition: transform 3.6s ease;
	transition: transform 3.6s ease;
	transition: transform 3.6s ease, -webkit-transform 3.6s ease;
	will-change: transform;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.hero.hero--intro-enabled .hero__bg-image {
	-webkit-animation: heroBgZoom 3.6s ease forwards;
	animation: heroBgZoom 3.6s ease forwards;
}

.hero.hero--intro-enabled.hero--intro-done .hero__bg-image {
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
}

@-webkit-keyframes heroBgZoom {
	from {
		-webkit-transform: scale(1.14);
		transform: scale(1.14);
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

@keyframes heroBgZoom {
	from {
		-webkit-transform: scale(1.14);
		transform: scale(1.14);
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

.hero.hero--intro-enabled.hero--show-span .hero__text span,
.hero.hero--intro-enabled.hero--show-title .hero__text h1,
.hero.hero--intro-enabled.hero--show-play .hero__text .play-btn,
.hero.hero--intro-enabled.hero--show-arrow .linear__icon {
	opacity: 1;
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
}

.hero__text {
	text-align: center;
}

.hero__text span {
	color: #ffffff;
	text-transform: uppercase;
	letter-spacing: 6px;
	display: inline-block;
	margin-left: 0;
}

.hero__text h1 {
	font-size: 110px;
	font-family: "Rockville Solid Regular";
	color: #ffffff;
	margin-bottom: 20px;
	margin-top: 22px;
	margin-left: 0;
	line-height: 1;
	min-height: 110px;
}

.hero__text p {
	color: #ffffff;
	margin-bottom: 20px;
}

.hero__text .play-btn {
	font-size: 26px;
	color: #006699;
	height: 90px;
	width: 90px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.3);
	display: inline-block;
	line-height: 90px;
	text-align: center;
	position: relative;
	z-index: 1;
}

.hero__text .play-btn i {
	position: relative;
	top: 2px;
	left: 2px;
}

.hero__text .play-btn:after {
	position: absolute;
	left: 15px;
	top: 15px;
	height: 60px;
	width: 60px;
	background: #ffffff;
	border-radius: 50%;
	content: "";
	z-index: -1;
}

.hero__play-btn--offset {
	margin-top: 60px;
}

.linear__icon {
	position: absolute;
	left: 50%;
	bottom: 35px;
	margin-left: -16px;
	-webkit-animation: mymove 0.5s infinite alternate;
	animation: mymove 0.5s infinite alternate;
}

.linear__icon i {
	font-size: 50px;
	color: #006699;
}

@-webkit-keyframes mymove {
	0% {
		bottom: 35px;
	}
	100% {
		bottom: 25px;
	}
}

@keyframes mymove {
	0% {
		bottom: 35px;
	}
	100% {
		bottom: 25px;
	}
}

/*---------------------
  Events
-----------------------*/

.event {
	--event-title-size: 42px;
	--event-title-gap: 10px;
	padding-bottom: 60px;
	position: relative;
	overflow: hidden;
}

.event.set-bg {
	background-position: top center;
	background-size: cover;
	background-repeat: no-repeat;
}

.event.set-bg:before {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	content: "";
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.8)), to(rgba(255, 255, 255, 1)));
	background: -o-linear-gradient(top, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 1) 100%);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 1) 100%);
	z-index: 0;
}

.event .container {
	position: relative;
	z-index: 1;
}

.event .section-title {
	margin-bottom: var(--event-title-gap);
	min-height: calc(var(--event-title-size) * 1.2);
	padding-right: 72px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	position: relative;
}

.event .section-title > h2 {
	font-size: var(--event-title-size);
	line-height: 1.2;
}

.event .section-title:after {
	position: absolute;
	right: 46px;
	top: 25px;
	height: 2px;
	width: 775px;
	background: rgba(225, 225, 225, 0.3);
	content: "";
	z-index: -1;
}

.event__slider .col-lg-4 {
	max-width: 100%;
}

.event__slider.owl-carousel .owl-stage-outer {
	padding-top: 30px;
	padding-bottom: 40px;
}

.event__slider.owl-carousel .owl-nav {
	position: absolute;
	right: 15px;
	top: calc(-1 * (var(--event-title-size) * 1.2 + var(--event-title-gap)));
	height: calc(var(--event-title-size) * 1.2);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.event__slider.owl-carousel .owl-nav button {
	font-size: 22px;
	color: #111111;
	opacity: 0.5;
	margin-right: 10px;
}

.event__slider.owl-carousel .owl-nav button:last-child {
	margin-right: 0;
}

.event__item {
	position: relative;
	z-index: 2;
	background: #ffffff;
	-webkit-box-shadow: 0px 3px 15px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 3px 15px rgba(22, 41, 124, 0.1);
}

.event__item__pic {
	height: auto;
	aspect-ratio: 912 / 1291;
	position: relative;
	overflow: visible;
	background-color: #f3f3f3;
}

/* Flyer vollständig im Hochformat anzeigen (kein Cover-Crop) */
.event__item__pic.set-bg {
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
}

/* Flyer-Breite wie Iseli Card (volle Kartenbreite, einheitlich) */
.event__item__pic--flyer.set-bg {
	background-size: 100% auto;
	background-position: center center;
}

/* Fotos / breitere Motive: Rahmen wie Flyer-Cards füllen (z. B. Anilibria) */
.event__item__pic--cover.set-bg {
	background-size: cover;
	background-position: center center;
}

.event__item__pic .tag-date {
	position: absolute;
	left: 0;
	bottom: -21px;
	width: 100%;
	text-align: center;
	z-index: 3;
}

.event__item__pic .tag-date span {
	font-size: 15px;
	color: #ffffff;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	background: #006699;
	padding: 12px 20px 9px;
	text-align: center;
	min-width: 7.5rem;
}

.event__item__text {
	text-align: center;
	padding: 45px 10px 25px;
}

.event__item__text h3,
.event__item__text h4 {
	font-size: 26px;
	font-weight: 700;
	color: #111111;
	margin-bottom: 10px;
}

.event__item__text p {
	color: #888888;
	margin-bottom: 0;
}

.event__item__text p i {
	color: #006699;
	margin-right: 8px;
	font-size: 17px;
}

/*---------------------
  Track
-----------------------*/

.track {
	/* Gleicher Sektionsabstand wie About → Services (.spad: 100px) */
	padding-top: 100px;
	padding-bottom: 0;
	overflow: hidden;
}

.track .section-title {
	margin-bottom: 40px;
}

.track__content {
	height: 502px;
	overflow-y: auto;
	padding-top: 0;
	position: relative;
	top: 0;
}

.track__all {
	text-align: right;
	margin-bottom: 40px;
}

/* Desktop: Player-Spalte und Cover an gemeinsamer Stack-Höhe ausrichten */
@media only screen and (min-width: 992px) {
	.track > .container {
		--track-player-h: 120px;
		--track-player-overlap: 30px;
		--track-player-count: 5;
		--track-stack-height: calc(
			var(--track-player-count) * var(--track-player-h) -
			(var(--track-player-count) - 1) * var(--track-player-overlap)
		);
	}

	/* Titelleiste: gleiches 7/5-Grid wie Player-Zeile darunter */
	.track > .container > .row:first-child {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 7fr 5fr;
		grid-template-columns: 7fr 5fr;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		-webkit-box-align: end;
		-ms-flex-align: end;
		align-items: end;
	}

	.track > .container > .row:first-child > [class*="col-"] {
		-webkit-box-flex: 0;
		-ms-flex: none;
		flex: none;
		width: auto;
		max-width: none;
	}

	.track > .container > .row:first-child > .col-lg-5 {
		padding-left: 0;
		padding-right: 0;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-pack: end;
		-ms-flex-pack: end;
		justify-content: flex-end;
		-webkit-box-align: end;
		-ms-flex-align: end;
		align-items: flex-end;
	}

	/* Button rechts bündig mit Cover-Kante (gleiche Breite wie Bild) */
	.track__all {
		width: min(calc(100% - 40px), var(--track-stack-height));
		max-width: calc(100% - 40px);
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 40px;
		text-align: right;
	}

	.track > .container > .row:first-child .section-title {
		margin-bottom: 40px;
	}

	.track > .container > .row:last-child {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 7fr 5fr;
		grid-template-columns: 7fr 5fr;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		margin-top: 15px;
	}

	.spotify-embed-list {
		min-height: var(--track-stack-height);
	}

	.track > .container > .row:last-child > [class*="col-"] {
		-webkit-box-flex: 0;
		-ms-flex: none;
		flex: none;
		width: auto;
		max-width: none;
		-ms-grid-row-align: center;
		align-self: center;
	}

	.track__content {
		height: auto;
		min-height: var(--track-stack-height);
		overflow: visible;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
	}

	.track__pic {
		top: 0;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		width: 100%;
		min-height: var(--track-stack-height);
	}

	.track__pic img {
		top: 0;
		display: block;
		width: min(calc(100% - 40px), var(--track-stack-height));
		height: min(calc(100% - 40px), var(--track-stack-height));
		max-width: calc(100% - 40px);
		max-height: var(--track-stack-height);
		aspect-ratio: 1 / 1;
		margin-left: auto;
		margin-right: auto;
	}
}

/* Ab 1200px: Cover und Player-Stack oben/unten bündig (kein Sprung bei 1439px) */
@media only screen and (min-width: 1200px) {
	.track > .container > .row:last-child {
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		align-items: stretch;
	}

	.track > .container > .row:last-child > [class*="col-"] {
		-ms-grid-row-align: stretch;
		align-self: stretch;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}

	.track__content {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
	}

	.track__pic {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}

	.track__pic img {
		width: var(--track-stack-height);
		height: var(--track-stack-height);
		max-width: calc(100% - 40px);
		max-height: var(--track-stack-height);
	}
}

/* Einspaltig: Spalten-Abstand + Overlay-Titel (BG/FG) per Grid auf einer Linie */
@media only screen and (max-width: 991px) {
	.track > .container > .row > [class*="col-"] {
		padding-left: 15px !important;
		padding-right: 15px !important;
	}

	.about.spad .about__text .section-title:has(.section-title__bg) {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		justify-items: center;
		align-items: end;
		width: 100%;
		max-width: 100%;
		min-height: 0;
		text-align: center;
	}

	.track .section-title:has(.section-title__bg) {
		display: inline-grid;
		grid-template-columns: -webkit-max-content;
		grid-template-columns: max-content;
		justify-items: start;
		align-items: end;
		width: auto;
		max-width: 100%;
		min-height: 0;
		text-align: left;
	}

	.about.spad .about__text .section-title:has(.section-title__bg) .section-title__bg {
		display: block;
		position: relative;
		grid-column: 1;
		grid-row: 1;
		justify-self: center;
		align-self: end;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		max-width: 100%;
		text-align: center;
	}

	.track .section-title:has(.section-title__bg) .section-title__bg {
		position: relative;
		grid-column: 1;
		grid-row: 1;
		justify-self: start;
		align-self: end;
		text-align: left;
	}

	.about.spad .about__text .section-title:has(.section-title__bg) > h2 {
		position: relative;
		grid-column: 1;
		grid-row: 1;
		justify-self: center;
		align-self: end;
		left: auto;
		right: auto;
		bottom: auto;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		max-width: 100%;
		margin: 0;
		padding: 0;
		text-align: center;
		white-space: nowrap;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}

	.track .section-title:has(.section-title__bg) > h2 {
		position: relative;
		grid-column: 1;
		grid-row: 1;
		justify-self: center;
		align-self: end;
		left: auto;
		right: auto;
		bottom: auto;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		max-width: 100%;
		margin: 0;
		padding: 0;
		text-align: center;
		white-space: nowrap;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}

	/* Index: Textblock näher ans Bild (einspaltig) */
	.about.spad .about__text {
		padding-top: 55px;
	}

	/* Index: Services näher am About-Button */
	.about.spad {
		padding-bottom: 60px;
	}

	.about.spad .about__text .primary-btn {
		display: block;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		margin-left: auto;
		margin-right: auto;
	}

	/* Index: Track näher an Services */
	.track.spad {
		padding-top: 60px;
	}

	.track.spad .section-title:has(.section-title__bg) {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		justify-items: center;
		align-items: end;
		width: 100%;
		max-width: 100%;
		text-align: center;
	}

	.track.spad .section-title:has(.section-title__bg) .section-title__bg {
		display: block;
		justify-self: center;
		text-align: center;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		max-width: 100%;
	}

	.track.spad .section-title:has(.section-title__bg) > h2 {
		position: relative;
		justify-self: center;
		left: auto;
		right: auto;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		text-align: center;
	}

	.track.spad .track__all {
		text-align: center;
	}

	.track.spad .track__all .primary-btn {
		display: block;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		margin-left: auto;
		margin-right: auto;
	}

	/* Index: Cover + Coming-Soon-Pille nach oben (margin gleicht Layout-Lücke aus) */
	.track.spad .track__pic {
		-webkit-transform: translateY(-35px);
		-ms-transform: translateY(-35px);
		transform: translateY(-35px);
		margin-bottom: -35px;
	}
}

.spotify-embed-list {
	width: 100%;
	margin-top: 0;
	font-size: 0;
	line-height: 0;
}

.spotify-embed-list iframe,
.spotify-embed-list__iframe {
	display: block;
	width: 100%;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: top;
}

.spotify-embed-list iframe + iframe {
	margin-top: -30px;
}

.track__pic {
	position: relative;
	z-index: 1;
	text-align: center;
}

/* Coming-Soon-Pille wie Index (Track); auch auf Discography-Cover */
.track__pic .track__badge,
.discography__item__pic .track__badge {
	position: absolute;
	top: 74%;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 2;
	background: rgba(0, 102, 153, 0.9);
	color: #ffffff;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: 8px 14px;
	border-radius: 999px;
}

.track__pic .track__badge {
	top: 68%;
}

/* Discography: Coming-Soon-Pille minimal nach oben (Cover-Proportionen) */
.discography__item__pic .track__badge {
	top: 72%;
}

/* Discography: 576–776px — kein Zeilenumbruch (Pille waechst nicht nach unten uebers Cover) */
@media only screen and (min-width: 576px) and (max-width: 776px) {
	.discography__item__pic .track__badge {
		white-space: nowrap;
		font-size: 11px;
		letter-spacing: 0.6px;
		padding: 7px 12px;
	}
}

.track__pic img {
	position: relative;
	z-index: 1;
	top: 0;
	width: calc(100% - 40px);
	margin: 0 auto;
	aspect-ratio: 1 / 1;
	height: auto;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
	border-radius: 16px;
}

/*---------------------
  Music Production (Index Studio-Services)
-----------------------*/

.music-production {
	/* Kompakterer Übergang von Latest Tracks; unten vor Footer */
	padding-bottom: 50px;
}

/* Mobile first: Übergang von Track-Cover; Desktop siehe min-width 992px */
.music-production.spad {
	padding-top: 75px;
	padding-bottom: 10px;
}

@media only screen and (min-width: 992px) {
	.music-production.spad {
		padding-top: 60px;
		padding-bottom: 50px;
	}
}

.music-production .section-title {
	text-align: center;
	margin-bottom: 40px;
	-webkit-transform: translateY(-15px);
	-ms-transform: translateY(-15px);
	transform: translateY(-15px);
}

.music-production .section-title .section-title__bg {
	font-size: 90px;
}

.music-production__item {
	position: relative;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	margin-bottom: 30px;
	-webkit-box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.12), inset 0 -8px 14px rgba(0, 0, 0, 0.16), 0 10px 22px rgba(0, 0, 0, 0.2);
	box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.12), inset 0 -8px 14px rgba(0, 0, 0, 0.16), 0 10px 22px rgba(0, 0, 0, 0.2);
	overflow: hidden;
}

.music-production__item:hover {
	-webkit-transform: scale(1.03);
	transform: scale(1.03);
	-webkit-box-shadow: inset 0 4px 10px rgba(0, 0, 0, 0.2), inset 0 -12px 20px rgba(0, 0, 0, 0.24), 0 16px 30px rgba(0, 0, 0, 0.28);
	box-shadow: inset 0 4px 10px rgba(0, 0, 0, 0.2), inset 0 -12px 20px rgba(0, 0, 0, 0.24), 0 16px 30px rgba(0, 0, 0, 0.28);
}

.music-production__item__pic {
	height: 240px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.music-production__item__pic .play-btn {
	font-size: 16px;
	color: #006699;
	height: 60px;
	width: 60px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.3);
	display: inline-block;
	line-height: 60px;
	text-align: center;
	position: relative;
	z-index: 1;
}

.music-production__item__pic .play-btn i {
	position: relative;
	top: 2px;
	left: 2px;
}

.music-production__item__pic .play-btn:after {
	position: absolute;
	left: 10px;
	top: 10px;
	height: 40px;
	width: 40px;
	background: #ffffff;
	border-radius: 50%;
	content: "";
	z-index: -1;
}

.music-production__item__text {
	padding: 25px 30px 20px 20px;
	background: #ffffff;
	text-align: center;
}

.music-production__item__text h3,
.music-production__item__text h4 {
	font-size: 22px;
	color: #111111;
	line-height: 30px;
	font-weight: 700;
}

.music-production__item__text .primary-btn.border-btn {
	margin-top: 14px;
}

/*---------------------
  Discography
-----------------------*/

.discography {
	padding-bottom: 40px;
	padding-top: 120px;
	overflow: hidden;
}

.discography .section-title {
	/* H2 (Vinyl, Compilations …) und H1-Wasserzeichen „Discography“ gemeinsam zentrieren */
	display: grid;
	justify-items: center;
	align-items: end;
	margin-bottom: 90px;
	min-height: 120px;
	padding: 8px 0 0;
	text-align: center;
}

.discography .section-title .section-title__bg,
.discography .section-title h2 + h1 {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 0;
	top: auto;
	left: auto;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: 100%;
	text-align: center;
	margin: 0;
	padding: 0;
	line-height: 0.92;
	pointer-events: none;
}

.discography .section-title h1:has(+ .section-title__bg),
.discography .section-title h2 {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 1;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: calc(100% - 32px);
	margin: 0;
	padding: 0 16px 0;
	text-align: center;
	line-height: 1;
	font-size: 42px;
	color: #111111;
	font-weight: 700;
	text-transform: uppercase;
	font-family: "Rajdhani", sans-serif;
}

/* Kurzer Titel „Vinyl“: gleiche Ausrichtung wie andere Discography-Titel */
.discography .section-title--vinyl h2,
.discography .section-title--vinyl h1:has(+ .section-title__bg) {
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
}

/* Nur Karten-Spalten strecken (nicht col-lg-12: Titel, Pagination) */
.discography .row > [class*="col-"]:not(.col-lg-12) {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.discography__item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	width: 100%;
	margin-bottom: 45px;
	-webkit-box-shadow: 0px 5px 10px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 5px 10px rgba(22, 41, 124, 0.1);
}

.discography__item__pic {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}

/* Einheitliche Cover-Hoehe trotz unterschiedlicher Bildformate */
.discography__item__pic img {
	display: block;
	width: 100%;
	height: 100%;
	min-width: 100%;
	object-fit: cover;
	object-position: center;
	position: relative;
	z-index: 1;
}

.discography__item__text {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	padding: 25px 30px 35px;
	text-align: center;
}

.discography__item__text span {
	font-size: 18px;
	color: #006699;
	font-weight: 700;
}

.discography__item__text h2,
.discography__item__text h4 {
	font-size: 22px;
	text-transform: uppercase;
	color: #111111;
	margin-top: 10px;
	margin-bottom: 25px;
}

.discography__item__text a {
	display: inline-block;
	margin-right: 10px;
}

.discography__item__text a:last-child {
	margin-right: 0;
}

/* Hinweis bei noch nicht veröffentlichten Releases (Hoehe wie Store-Icons) */
.discography__item__coming-soon {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	min-height: 33.6px;
	margin-top: 6px;
	font-size: 15px;
	color: #333333;
	font-weight: 400;
}

/* Hinweis bei nicht mehr erhältlichen Releases (Hoehe wie Store-Icons) */
.discography__item__vergriffen {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	min-height: 33.6px;
	margin-top: 6px;
	font-size: 15px;
	color: #333333;
	font-weight: 400;
}

/* Streaming-Icons (Discography-Karten) */
.discography__item__stores {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 12px;
	margin-top: auto;
}

.discography__item__text .discography__item__stores a {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-right: 0;
	margin-bottom: 0;
}

/* Spotify (erstes Icon): minimal nach unten, andere Store-Icons unveraendert */
.discography__item__stores a:first-child {
	margin-top: 6px;
}

/* Hover-Label (data-tooltip) unter dem Icon, damit .discography overflow nicht clippt */
.discography__item__stores a::before {
	content: attr(data-tooltip);
	position: absolute;
	left: 50%;
	top: 100%;
	z-index: 4;
	margin-top: 6px;
	padding: 6px 10px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
	color: #ffffff;
	background-color: #006699;
	border-radius: 4px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	-webkit-transform: translateX(-50%) translateY(-4px);
	-ms-transform: translateX(-50%) translateY(-4px);
	transform: translateX(-50%) translateY(-4px);
	-webkit-transition: opacity 0.2s ease, visibility 0.2s ease, -webkit-transform 0.2s ease;
	transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
}

.discography__item__stores a:hover::before,
.discography__item__stores a:focus-visible::before {
	opacity: 1;
	visibility: visible;
	-webkit-transform: translateX(-50%) translateY(0);
	-ms-transform: translateX(-50%) translateY(0);
	transform: translateX(-50%) translateY(0);
}

.discography__item__stores img {
	display: block;
	height: 33.6px; /* +20% ggue. 28px */
	width: auto;
	max-width: 144px; /* +20% ggue. 120px */
	object-fit: contain;
}

/* Direkt bestellen + Mail-Icon (neben Discogs) */
.discography__item__order {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 8px;
	margin-top: 6px;
}

.discography__item__order-label {
	font-size: 13px;
	color: #333333;
	font-weight: 400;
	white-space: nowrap;
}

.discography__item__order-mail {
	color: #000000;
}

.discography__item__order-mail .fa {
	display: block;
	font-size: 28px;
	line-height: 1;
	width: 28px;
	text-align: center;
}

.discography__item__order-mail:hover,
.discography__item__order-mail:focus-visible {
	color: #006699;
}

/* Smart-Link / externer Plattform-Link (Font Awesome) */
.discography__item__link-out {
	color: #000000;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	min-width: 28px;
	min-height: 33.6px;
}

.discography__item__link-out svg {
	display: block;
	width: 28px;
	height: 28px;
	stroke: currentColor;
}

.discography__item__link-out:hover,
.discography__item__link-out:focus-visible {
	color: #006699;
}

.pagination__links {
	text-align: center;
	padding-top: 10px;
}

.pagination__links.blog__pagination {
	text-align: left;
}

.pagination__links a {
	display: inline-block;
	font-size: 15px;
	color: #111111;
	text-transform: uppercase;
	letter-spacing: 2px;
	background: #f2f2f2;
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
	margin-right: 6px;
	margin-bottom: 5px;
	padding: 14px 22px 12px;
}

.pagination__links a:last-child {
	margin-right: 0;
}

.pagination__links a:hover {
	background: #006699;
	color: #ffffff;
}

/* Aktuelle Discography-/Blog-Seite (aria-current in HTML) */
.pagination__links a[aria-current="page"] {
	background: #006699;
	color: #ffffff;
	cursor: default;
}

.pagination__links a[aria-current="page"]:hover {
	background: #005580;
	color: #ffffff;
}

/*---------------------
  Footer
-----------------------*/

.footer {
	padding-top: 300px;
	padding-bottom: 50px;
	margin-top: -547px;
	min-height: 549px;
	height: auto;
}

.footer.footer--normal {
	margin-top: 0;
	padding-bottom: 36px;
}

.footer.footer--normal .footer__address,
.footer.footer--normal .footer__social,
.footer.footer--normal .footer__newslatter {
	margin-bottom: 28px;
}

/* Drei gleich breite Footer-Spalten mit Trennlinien an der Kontakt-Spalte */
.footer.footer--normal .footer__col--social,
.footer.footer--normal .footer__col--contact,
.footer.footer--normal .footer__col--newsletter {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
}

.footer.footer--normal .footer__col--contact {
	border-left: 1px solid rgba(255, 255, 255, 0.2);
	border-right: 1px solid rgba(255, 255, 255, 0.2);
}

.footer.footer--normal .footer__address::before,
.footer.footer--normal .footer__address::after {
	display: none;
}

.footer.footer--normal .footer__address {
	padding-top: 40px;
}

.footer.footer--normal .footer__newslatter {
	width: 100%;
	max-width: 300px;
	text-align: left;
}

.footer.footer--normal .footer__newslatter h3,
.footer.footer--normal .footer__newslatter h4 {
	text-align: left;
}

.footer.footer--normal .footer__row--legal {
	margin-top: 0;
}

@media only screen and (max-width: 991px) {
	.footer.footer--normal .footer__col--contact {
		border-left: none;
		border-right: none;
	}

	.footer.footer--normal .footer__row--legal > .col-lg-4[aria-hidden="true"] {
		display: none;
	}

	.footer.footer--normal .footer__row--legal > .col-lg-4:nth-child(2) {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}
}

/* Zweispaltig (Tablet): Logo links, Kontakt rechts – ohne horizontale Trennlinien */
@media only screen and (min-width: 768px) and (max-width: 991px) {
	.footer.footer--normal .container > .row:not(.footer__row--legal) {
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
	}

	.footer.footer--normal .footer__col--social,
	.footer.footer--normal .footer__col--contact {
		margin-top: 9px;
		-webkit-align-self: flex-start;
		-ms-flex-item-align: start;
		align-self: flex-start;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
	}

	.footer.footer--normal .footer__col--social {
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
	}

	.footer.footer--normal .footer__col--contact {
		border-top: none;
		border-bottom: none;
		margin-top: 14px;
		margin-bottom: 0;
		padding-top: 0;
		padding-bottom: 0;
		-webkit-box-pack: end;
		-ms-flex-pack: end;
		justify-content: flex-end;
	}

	.footer.footer--normal .footer__social,
	.footer.footer--normal .footer__address {
		margin-bottom: 0;
	}

	/* Zwei Zeilen: Logo ∥ Telefon (48px), darunter Icons ∥ E-Mail (26px) */
	/* Verschiebung skaliert 768→850px, damit nichts am Rand abgeschnitten wird */
	.footer.footer--normal .footer__social {
		display: -ms-inline-grid;
		display: inline-grid;
		grid-template-rows: 48px minmax(26px, auto);
		row-gap: 25px;
		justify-items: center;
		text-align: center;
		vertical-align: top;
		-webkit-transform: translateX(clamp(-40px, calc(-40px * (100vw - 768px) / 82), 0px));
		-ms-transform: translateX(clamp(-40px, calc(-40px * (100vw - 768px) / 82), 0px));
		transform: translateX(clamp(-40px, calc(-40px * (100vw - 768px) / 82), 0px));
	}

	.footer.footer--normal .footer__social__brand {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		margin-bottom: 0;
		height: 100%;
	}

	.footer.footer--normal .footer__social .footer__social__links {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		min-height: 26px;
		height: 100%;
	}

	.footer.footer--normal .footer__social .footer__social__links a.footer__social__discogs {
		top: 0;
	}

	.footer.footer--normal .footer__address {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: end;
		-ms-flex-pack: end;
		justify-content: flex-end;
		text-align: right;
		padding-top: 0;
		width: 100%;
		margin-left: 0;
		-webkit-transform: translateX(clamp(0px, calc(45px * (100vw - 768px) / 82), 45px));
		-ms-transform: translateX(clamp(0px, calc(45px * (100vw - 768px) / 82), 45px));
		transform: translateX(clamp(0px, calc(45px * (100vw - 768px) / 82), 45px));
	}

	.footer.footer--normal .footer__address ul {
		display: -ms-grid;
		display: grid;
		grid-template-rows: 48px minmax(26px, auto);
		row-gap: 25px;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		text-align: left;
	}

	.footer.footer--normal .footer__address ul li {
		margin-bottom: 0;
		width: 100%;
	}

	.footer.footer--normal .footer__address ul li:first-child {
		-webkit-align-self: center;
		-ms-flex-item-align: center;
		align-self: center;
	}

	.footer.footer--normal .footer__address ul li:last-child {
		-webkit-align-self: center;
		-ms-flex-item-align: center;
		align-self: center;
		min-height: 26px;
	}

	.footer.footer--normal .footer__col--newsletter {
		margin-top: 20px;
		-webkit-box-flex: 0;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}

	.footer.footer--normal .footer__newslatter {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
	}

	.footer.footer--normal .footer__newslatter h3,
	.footer.footer--normal .footer__newslatter h4 {
		text-align: center;
	}

	/* Index: weniger Abstand letzte Music-Production-Card → Footer */
	section.music-production.spad {
		padding-bottom: 10px;
	}

	section.music-production.spad + footer.footer.footer--normal.spad {
		margin-top: -40px;
	}
}

@media only screen and (max-width: 767px) {
	/* Index: Upcoming Events näher am Hero (ohne negative Margin) */
	.event.spad {
		padding-top: 50px;
	}

	/* Index: About 15px näher an Events */
	.about.spad {
		-webkit-transform: translateY(-15px);
		-ms-transform: translateY(-15px);
		transform: translateY(-15px);
	}

	.footer.footer--normal .footer__col--social {
		-webkit-transform: translateY(34px);
		-ms-transform: translateY(34px);
		transform: translateY(34px);
	}

	.footer.footer--normal .footer__col--contact {
		border-top: none;
		border-bottom: none;
		-webkit-transform: translateY(40px);
		-ms-transform: translateY(40px);
		transform: translateY(40px);
	}

	.footer.footer--normal .footer__address {
		padding-top: 0;
	}

	/* Gesamter Newsletter-Block visuell nach unten (margin allein reicht wegen transform der Nachbar-Spalten nicht) */
	.footer.footer--normal .footer__col--newsletter {
		margin-top: 0;
	}

	.footer.footer--normal .footer__newslatter {
		-webkit-transform: translateY(25px);
		-ms-transform: translateY(25px);
		transform: translateY(25px);
	}

	.footer.footer--normal .footer__newslatter h3,
	.footer.footer--normal .footer__newslatter h4 {
		text-align: center;
		-webkit-transform: translateY(18px);
		-ms-transform: translateY(18px);
		transform: translateY(18px);
	}
}

.footer__address {
	margin-bottom: 50px;
	text-align: center;
	position: relative;
}

.footer__address ul {
	display: inline-block;
	text-align: left;
}

.footer__address::before {
	position: absolute;
	left: -46px;
	top: 3px;
	width: 1px;
	height: 130px;
	background: rgba(255, 255, 255, 0.2);
	content: "";
}

.footer__address::after {
	position: absolute;
	right: -50px;
	top: 3px;
	width: 1px;
	height: 130px;
	background: rgba(255, 255, 255, 0.2);
	content: "";
}

.footer__address ul li {
	list-style: none;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 12px;
	padding-left: 0;
	position: relative;
	margin-bottom: 30px;
}

.footer__address ul li:last-child {
	margin-bottom: 0;
}

.footer__address ul li i {
	font-size: 18px;
	color: #ffffff;
	position: static;
	-webkit-box-flex: 0;
	-ms-flex: 0 0 18px;
	flex: 0 0 18px;
	width: 18px;
	text-align: center;
	line-height: 1;
}

.footer__address ul li h6,
.footer__address ul li .footer__address-value {
	font-size: 15px;
	font-weight: 700;
	color: #ffffff;
	margin-bottom: 0;
	line-height: 1.4;
}

.footer__address ul li h6 a,
.footer__address ul li .footer__address-value a {
	color: inherit;
	text-decoration: none;
}

.footer__address ul li h6 a:hover,
.footer__address ul li h6 a:focus,
.footer__address ul li .footer__address-value a:hover,
.footer__address ul li .footer__address-value a:focus {
	color: #ffffff;
	text-decoration: underline;
}

.footer__social {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	text-align: center;
	position: relative;
	margin-bottom: 50px;
}

.footer__social__brand {
	margin-bottom: 25px;
	line-height: 0;
}

.footer__social__links {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 20px;
}

.footer__social__brand a {
	display: inline-block;
	line-height: 0;
}

.footer__social__brand img {
	max-height: 48px;
	width: auto;
	height: auto;
}

.footer__social .footer__social__links a {
	font-size: 24px;
	color: #ffffff;
	display: inline-block;
	margin-right: 0;
	vertical-align: middle;
}

.footer__social .footer__social__links a.footer__social__discogs {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	line-height: 0;
	position: relative;
	top: -2px;
}

.footer__social .footer__social__links a.footer__social__discogs img {
	height: 26px;
	width: auto;
	display: block;
}

.footer__social .footer__social__links a:last-child {
	margin-right: 0;
}

.footer__social .footer__social__links a:focus-visible {
	outline: 2px solid rgba(255, 255, 255, 0.85);
	outline-offset: 2px;
}

.footer__newslatter {
	margin-bottom: 50px;
}

.footer__newslatter h3,
.footer__newslatter h4 {
	font-size: 26px;
	color: #ffffff;
	font-weight: 700;
	margin-bottom: 30px;
}

.footer__newslatter form {
	position: relative;
}

.footer__newslatter form .footer-newsletter-form__row input {
	height: 50px;
	font-size: 15px;
	color: #ffffff;
	width: 100%;
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.2);
	padding-left: 20px;
}

.footer__newslatter form .footer-newsletter-form__row input::-webkit-input-placeholder {
	color: #ffffff;
}

.footer__newslatter form .footer-newsletter-form__row input::-moz-placeholder {
	color: #ffffff;
}

.footer__newslatter form .footer-newsletter-form__row input:-ms-input-placeholder {
	color: #ffffff;
}

.footer__newslatter form .footer-newsletter-form__row input::-ms-input-placeholder {
	color: #ffffff;
}

.footer__newslatter form .footer-newsletter-form__row input::placeholder {
	color: #ffffff;
}

.footer__newslatter form button {
	font-size: 18px;
	color: #006699;
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
	padding: 0 16px;
	background: #ffffff;
	border: none;
}

.footer-newsletter-form__row {
	position: relative;
}

.footer-newsletter-form__honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

.footer-newsletter-form__consent {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	gap: 10px;
	margin: 12px 0 0;
	font-size: 12px;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.85);
	cursor: pointer;
}

.footer__newslatter .footer-newsletter-form__consent input[type="checkbox"] {
	width: 18px;
	height: 18px;
	margin: 2px 0 0;
	-ms-flex-negative: 0;
	flex-shrink: 0;
	cursor: pointer;
	padding: 0;
	border: 1px solid #ffffff;
	border-radius: 2px;
	background-color: #ffffff;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.footer__newslatter .footer-newsletter-form__consent input[type="checkbox"]:checked {
	background-color: #ffffff;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 12px 12px;
}

.footer__newslatter .footer-newsletter-form__consent input[type="checkbox"]:focus-visible {
	outline: 2px solid rgba(255, 255, 255, 0.85);
	outline-offset: 2px;
}

.footer-newsletter-form__consent a {
	color: #ffffff;
	text-decoration: underline;
}

.footer-newsletter-form__status {
	margin: 10px 0 0;
	font-size: 13px;
	line-height: 1.45;
}

.footer-newsletter-form__status.is-error {
	color: #ffb3b3;
}

.footer-newsletter-form__status:not(.is-error) {
	color: #b9dfc3;
}

.footer__copyright__text {
	text-align: center;
	margin-top: 0;
	padding-top: 0;
	padding-bottom: 0;
}

.footer.footer--normal .footer__row--legal .footer__copyright__text {
	padding-top: 32px;
}

.footer__copyright__text p {
	color: #ffffff;
	margin: 0 0 6px;
}

.footer__copyright__links {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 10px;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	line-height: 1.4;
}

.footer__copyright__links a,
.footer__copyright__text a {
	color: #ffffff;
	text-decoration: underline;
	font-weight: 400;
}

.footer__copyright__links a:hover,
.footer__copyright__text a:hover,
.footer__copyright__links a:focus-visible,
.footer__copyright__text a:focus-visible {
	color: #ffffff;
	font-weight: 700;
}

.footer__copyright__links span {
	color: #ffffff;
	opacity: 0.85;
}

/* Desktop/Laptop: zwei Zeilen (Copyright / Links), jeweils ohne Umbruch */
@media only screen and (min-width: 1024px) {
	.footer.footer--normal .footer__row--legal > .col-lg-4[aria-hidden="true"] {
		display: none;
	}

	.footer.footer--normal .footer__row--legal > .col-lg-4:nth-child(2) {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}

	.footer.footer--normal .footer__copyright__text p {
		white-space: nowrap;
	}

	.footer.footer--normal .footer__copyright__links {
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
		white-space: nowrap;
	}
}

.footer__copyright__text i {
	color: #c11;
}

/* Lokales MP4-Video im Magnific-Popup */
.mfp-local-video-wrap {
	position: relative;
	max-width: 960px;
	margin: 0 auto;
	background: #000000;
}

.mfp-local-video {
	display: block;
	width: 100%;
	max-height: 80vh;
	background: #000000;
}

.mfp-local-video-popup.mfp-close-btn-in .mfp-close {
	color: #ffffff;
	opacity: 0.9;
	top: 0;
	right: 0;
	width: 44px;
	height: 44px;
	line-height: 44px;
	font-size: 32px;
	z-index: 1047;
}

.mfp-local-video-popup.mfp-close-btn-in .mfp-close:hover,
.mfp-local-video-popup.mfp-close-btn-in .mfp-close:focus {
	opacity: 1;
}

/*---------------------
  Legal / Datenschutz (Card-Layout)
-----------------------*/

.legal-page {
	background: #ffffff;
}

.legal-page__wrap {
	max-width: 860px;
	margin: 0 auto;
}

/* Intro */
.legal-page__intro {
	text-align: center;
	margin-bottom: 36px;
}

.legal-page__intro-icon {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin-bottom: 16px;
	border-radius: 50%;
	background: rgba(0, 102, 153, 0.1);
	color: #006699;
	font-size: 26px;
}

.legal-page__intro h1 {
	font-size: clamp(30px, 4.5vw, 40px);
	font-weight: 700;
	color: #111111;
	text-transform: uppercase;
	margin-bottom: 12px;
}

.legal-page__lead {
	max-width: 640px;
	margin: 0 auto;
	color: #333333;
	font-size: 16px;
	line-height: 1.65;
}

/* Cards */
.legal-page__cards {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 20px;
}

.legal-page__card {
	background: #ffffff;
	border-radius: 10px;
	-webkit-box-shadow: 0 4px 18px rgba(0, 0, 0, 0.07);
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.07);
	padding: 28px 28px 26px;
}

.legal-page__card-head {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	gap: 14px;
	margin-bottom: 18px;
	padding-bottom: 14px;
	border-bottom: 1px solid #e8eef2;
}

.legal-page__card-num {
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	font-size: 28px;
	font-weight: 700;
	line-height: 1;
	color: #006699;
	min-width: 1.25em;
}

.legal-page__card-head h2 {
	margin: 0;
	font-size: 20px;
	font-weight: 700;
	color: #111111;
	line-height: 1.3;
}

.legal-page__card-head--plain {
	border-bottom: none;
	margin-bottom: 8px;
	padding-bottom: 0;
}

.legal-page__section-label {
	font-size: 15px;
	font-weight: 700;
	color: #006699;
	margin-bottom: 14px !important;
}

/* Kontaktzeilen mit Icon (Impressum) */
.legal-page__contact-lines {
	list-style: none;
	margin: 0;
	padding: 0;
}

.legal-page__contact-lines li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 14px;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-bottom: 14px;
}

.legal-page__contact-lines li:last-child {
	margin-bottom: 0;
}

.legal-page__contact-lines i {
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	width: 20px;
	margin-top: 3px;
	text-align: center;
	color: #006699;
	font-size: 18px;
}

.legal-page__contact-lines span {
	color: #333333;
	font-size: 15px;
	line-height: 1.55;
}

.legal-page__contact-lines a {
	color: #006699;
	text-decoration: underline;
}

.legal-page__contact-lines a:hover,
.legal-page__contact-lines a:focus-visible {
	color: #004d73;
}

.legal-page__card-body p,
.legal-page__card-body li {
	color: #333333;
	font-size: 15px;
	line-height: 1.65;
}

.legal-page__card-body p {
	margin-bottom: 12px;
}

.legal-page__card-body p:last-child {
	margin-bottom: 0;
}

.legal-page__card-body a {
	color: #006699;
	text-decoration: underline;
}

.legal-page__card-body a:hover,
.legal-page__card-body a:focus-visible {
	color: #004d73;
}

.legal-page__card-body h3 {
	font-size: 16px;
	font-weight: 700;
	color: #111111;
	margin: 0 0 8px;
}

/* Verantwortlicher-Box */
.legal-page__contact-box {
	margin-top: 8px;
	padding: 16px 18px;
	border-radius: 8px;
	background: #f3f8fb;
	border: 1px solid #d7e4ee;
}

.legal-page__contact-label {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #006699;
	margin-bottom: 6px !important;
}

.legal-page__contact-name {
	font-size: 17px !important;
	font-weight: 700;
	color: #111111 !important;
	margin-bottom: 6px !important;
}

/* Akzent-Bloecke innerhalb Cards */
.legal-page__block {
	margin-top: 18px;
	padding: 14px 14px 14px 16px;
	border-left: 4px solid #006699;
	border-radius: 0 6px 6px 0;
	background: #fafcfd;
}

.legal-page__block:first-child {
	margin-top: 0;
}

.legal-page__block--accent-1 {
	border-left-color: #006699;
}

.legal-page__block--accent-2 {
	border-left-color: #3388aa;
}

.legal-page__block--accent-3 {
	border-left-color: #005580;
}

/* Listen */
.legal-page__list {
	margin: 8px 0 12px;
	padding-left: 1.15em;
	list-style: square;
}

.legal-page__list li {
	margin-bottom: 5px;
}

.legal-page__list li::marker {
	color: #006699;
}

.legal-page__list--cols {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4px 20px;
	padding-left: 1.15em;
}

/* Cookie-Hinweis */
.legal-page__notice {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 12px;
	margin-top: 12px;
	padding: 12px 14px;
	border-radius: 6px;
	background: #fff8e8;
	border: 1px solid #f0d9a0;
}

.legal-page__notice i {
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	color: #c98a00;
	font-size: 18px;
	margin-top: 2px;
}

.legal-page__notice p {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
}

/* Drittdienste-Icons */
.legal-page__services {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin: 16px 0 18px;
}

.legal-page__service {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 8px;
	padding: 16px 10px;
	border-radius: 8px;
	background: #f3f8fb;
	border: 1px solid #d7e4ee;
	text-align: center;
}

.legal-page__service i {
	font-size: 26px;
	color: #006699;
}

.legal-page__service span {
	font-size: 13px;
	font-weight: 700;
	color: #333333;
}

/* Rechte-Grid */
.legal-page__rights {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
	margin: 14px 0 16px;
}

.legal-page__rights-item {
	padding: 12px 12px 12px 14px;
	border-left: 3px solid #006699;
	background: #fafcfd;
	border-radius: 0 6px 6px 0;
}

.legal-page__rights-item h3 {
	font-size: 15px;
	margin-bottom: 4px;
}

.legal-page__rights-item p {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
}

/* CTA unten */
.legal-page__cta {
	margin-top: 36px;
	padding: 32px 24px;
	text-align: center;
	background: #ffffff;
	border-radius: 10px;
	-webkit-box-shadow: 0 4px 18px rgba(0, 0, 0, 0.07);
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.07);
}

.legal-page__cta h2 {
	font-size: 22px;
	font-weight: 700;
	color: #111111;
	margin-bottom: 8px;
}

.legal-page__cta > p {
	color: #333333;
	font-size: 15px;
	line-height: 1.6;
	margin-bottom: 22px;
}

.legal-page__cta-actions {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 12px;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

.legal-page__cta-actions .primary-btn {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 8px;
	width: auto;
}

.legal-page__cta-actions .primary-btn i {
	font-size: 16px;
}

@media only screen and (max-width: 767px) {
	.legal-page__card {
		padding: 22px 18px 20px;
	}

	.legal-page__list--cols,
	.legal-page__rights,
	.legal-page__services {
		grid-template-columns: 1fr;
	}

	.legal-page__cta-actions {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}

	.legal-page__cta-actions .primary-btn {
		width: 100%;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}
}

/*---------------------
  Breadcrumb
-----------------------*/

.breadcrumb-option {
	padding-top: 35px;
}

/* Fixierter Overlay-Header: Inhalt nicht unter der Leiste beginnen lassen */
.header.header--overlay + .breadcrumb-option {
	padding-top: 118px;
}

/* About-Seite: In-flow-Abstand unter fixer Nav, damit Sektions-Hintergrund sichtbar startet */
.header-layout-spacer {
	height: 96px;
}

.breadcrumb__links a {
	font-size: 15px;
	color: #111111;
	margin-right: 18px;
	display: inline-block;
	position: relative;
}

.breadcrumb__links a:after {
	position: absolute;
	right: -14px;
	top: 0;
	content: "|";
	color: #888888;
}

.breadcrumb__links a i {
	margin-right: 5px;
}

.breadcrumb__links span {
	font-size: 15px;
	color: #888888;
	display: inline-block;
}

/*---------------------
  About
-----------------------*/

.about {
	padding-top: 0;
}

.about.about--page {
	padding-top: 80px;
	padding-bottom: 80px;
}

.about.about--page .section-title {
	margin-bottom: 28px;
}

.about.about--page .section-title h2 {
	line-height: 55px;
}

.about.about--page .about__text {
	padding-top: 15px;
}

.about.about--page .about__text p {
	color: #111111;
}

.about__text {
	padding-top: 110px;
}

.about__text p {
	margin-bottom: 35px;
}

.about__text p:first-of-type {
	margin-bottom: 12px;
}

.about__pic {
	position: relative;
	border-radius: 16px;
	overflow: hidden;
}

.about__pic:after {
	position: absolute;
	inset: 0;
	content: "";
	pointer-events: none;
	-webkit-box-shadow: inset 0 0 70px 28px rgba(255, 255, 255, 0.9);
	box-shadow: inset 0 0 70px 28px rgba(255, 255, 255, 0.9);
}

.about__pic img {
	width: 82%;
	height: auto;
	display: block;
	margin: 0 auto;
	border-radius: 16px;
}

/*---------------------
  About Pic
-----------------------*/

.about-pic {
	overflow: hidden;
	margin-top: -25px;
}

.about-pic .container-fluid {
	padding-right: 0;
}

/* Galerie: zwei Haelften gleich hoch, je 2 Zeilen à 1fr -> gemeinsame Ober- und Unterkante */
.about-pic-mosaic {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	gap: 10px;
	padding-right: 10px;
	min-height: clamp(280px, 36vw, 520px);
}

.about-pic-half {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 50%;
	flex: 1 1 50%;
	min-width: 0;
	min-height: 0;
	-webkit-align-self: stretch;
	-ms-flex-item-align: stretch;
	align-self: stretch;
	display: grid;
	gap: 10px;
}

/* Links: schmal | breit (wie Bootstrap 4+8 innerhalb der Haelfte) */
.about-pic-half--left {
	grid-template-columns: 1fr 2fr;
	grid-template-rows: 1fr 1fr;
}

.about-pic-half--left .about-pic__cell--1 {
	grid-column: 1;
	grid-row: 1;
}

.about-pic-half--left .about-pic__cell--2 {
	grid-column: 1;
	grid-row: 2;
}

.about-pic-half--left .about-pic__cell--3 {
	grid-column: 2;
	grid-row: 1 / -1;
}

/* Rechts: oben 8+4, unten 4+8 — gleiche Zeilenhoehe wie links */
.about-pic-half--right {
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	grid-template-areas:
		"ap4 ap4 ap5"
		"ap6 ap7 ap7";
}

.about-pic-half--right .about-pic__cell--4 {
	grid-area: ap4;
}

.about-pic-half--right .about-pic__cell--5 {
	grid-area: ap5;
}

.about-pic-half--right .about-pic__cell--6 {
	grid-area: ap6;
}

.about-pic-half--right .about-pic__cell--7 {
	grid-area: ap7;
}

.about-pic__cell {
	overflow: hidden;
	min-height: 0;
	position: relative;
}

.about-pic__cell img {
	width: 100%;
	height: 100%;
	min-width: 0;
	display: block;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center center;
	object-position: center center;
}

/* Konsole / Konzert / Lichtshow: unten verankert, sichtbarer Bereich von unten nach oben (oben crop) */
.about-pic__cell--1 img,
.about-pic__cell--2 img,
.about-pic__cell--5 img {
	-o-object-position: center bottom;
	object-position: center bottom;
}

@media only screen and (max-width: 991px) {
	.about-pic {
		margin-top: -50px;
	}

	.about-pic-mosaic {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		min-height: 0;
	}

	.about-pic-half--left,
	.about-pic-half--right {
		grid-template-columns: 1fr;
		grid-template-rows: none;
		grid-auto-rows: minmax(200px, 55vw);
		grid-template-areas: none;
	}

	.about-pic-half--left .about-pic__cell--1,
	.about-pic-half--left .about-pic__cell--2,
	.about-pic-half--left .about-pic__cell--3,
	.about-pic-half--right .about-pic__cell--4,
	.about-pic-half--right .about-pic__cell--5,
	.about-pic-half--right .about-pic__cell--6,
	.about-pic-half--right .about-pic__cell--7 {
		grid-column: 1;
		grid-row: auto;
	}

	/* Konsole: in Einspalt-Ansicht etwas weiter nach unten */
	.about-pic__cell--1 img {
		-o-object-position: center 84%;
		object-position: center 84%;
	}

	/* Sänger/Band: in Einspalt-Ansicht etwas weiter nach unten */
	.about-pic__cell--3 img {
		-o-object-position: center 20%;
		object-position: center 20%;
	}

	/* Lichtshow: in Einspalt-Ansicht etwas weiter nach unten */
	.about-pic__cell--5 img {
		-o-object-position: center 80%;
		object-position: center 80%;
	}
}

/*---------------------
  About Services
-----------------------*/

.about-services {
	padding-bottom: 50px;
	--about-services-pic-height: 240px;
	--about-services-badge-size: 50px;
	--about-services-badge-overlap: calc(var(--about-services-badge-size) / 2);
	--about-services-bg-zoom: 1;
}

/* Abstand zur About-Pic-Galerie (Mixing-Konsole) um 25px verringern */
.about-services.spad {
	margin-top: -25px;
	padding-bottom: 20px;
}

/* CTA-Bereich naeher an die Service-Cards */
.about-services .studio__cta {
	margin-top: 27px;
}

/* Mobil einspaltig: Services-Sektion naeher an About-Pic (Mixing-Konsole) */
@media only screen and (max-width: 991px) {
	.about-services.spad {
		margin-top: -50px;
	}
}

.about-services .section-title {
	margin-bottom: 60px;
}

.about__services__item {
	-webkit-transition: all, 0.3s;
	-o-transition: all, 0.3s;
	transition: all, 0.3s;
}

.about__services__item:hover {
	-webkit-box-shadow: 0px 3px 30px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 3px 30px rgba(22, 41, 124, 0.1);
}

.about__services__item__pic {
	height: var(--about-services-pic-height);
	position: relative;
	overflow: visible;
}

/* Hintergrund separat: Zoom skaliert nur das Bild, Badge bleibt am sichtbaren unteren Rand */
.about__services__item__pic-bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	-webkit-transform: scale(var(--about-services-bg-zoom));
	-ms-transform: scale(var(--about-services-bg-zoom));
	transform: scale(var(--about-services-bg-zoom));
	-webkit-transform-origin: center center;
	-ms-transform-origin: center center;
	transform-origin: center center;
}

.about__services__item__pic .icon {
	height: var(--about-services-badge-size);
	width: var(--about-services-badge-size);
	background: #006699;
	border-radius: 50%;
	line-height: var(--about-services-badge-size);
	text-align: center;
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	z-index: 1;
	/* Haelfte im Bild, Haelfte ueber Titel — bei Zoom Randabstand beruecksichtigen */
	bottom: calc((1 - var(--about-services-bg-zoom)) * 50% - var(--about-services-badge-overlap));
}

/* Erste Service-Card: kleineres Icon im runden Patch (Champagne-Grafik) */
.about__services__item__pic .icon.icon--compact {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	line-height: 0;
}

.about__services__item__pic .icon.icon--compact img {
	width: 60%;
	max-width: 30px;
	max-height: 30px;
	height: auto;
	-o-object-fit: contain;
	object-fit: contain;
}

/* Festivals-Card: Disco-Kugel um 20% verkleinern, zentriert im Patch */
.about__services__item__pic .icon.icon--disco-patch {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	line-height: 0;
}

.about__services__item__pic .icon.icon--disco-patch img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	-o-object-fit: contain;
	object-fit: contain;
	/* zuerst -20%, zusaetzlich -10% => 0.8 * 0.9 = 0.72; leicht nach oben (~5% der Patch-Hoehe) */
	-webkit-transform: translateY(-2.5px) scale(0.72);
	-ms-transform: translateY(-2.5px) scale(0.72);
	transform: translateY(-2.5px) scale(0.72);
}

/* Private Anlaesse: grosse SVG sauber im runden Patch (skaliert per max-Groesse + contain) */
.about__services__item__pic .icon.icon--party-patch {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	line-height: 0;
	overflow: hidden;
}

.about__services__item__pic .icon.icon--party-patch img {
	width: 65%;
	max-width: 32px;
	max-height: 32px;
	height: auto;
	-o-object-fit: contain;
	object-fit: contain;
	-o-object-position: center;
	object-position: center;
}

.about__services__item__text {
	text-align: center;
	padding: 50px 10px 30px;
}

.about__services__item__text h3,
.about__services__item__text h4 {
	font-size: 26px;
	color: #111111;
	font-weight: 700;
	margin-bottom: 12px;
}

.about__services__item__text p {
	margin-bottom: 0;
}

/* WHERE DO I PLAY: Einspalte 426–575px — +20% Hoehe, leicht rauszoomen (nicht rein) */
@media only screen and (min-width: 426px) and (max-width: 575px) {
	.about-services {
		--about-services-pic-height: calc(240px * 1.2);
		--about-services-bg-zoom: 0.9;
	}

	.about-services .about__services__item__pic-bg {
		background-position: center center;
	}
}

/*---------------------
  About Tabs
-----------------------*/

.about-tabs {
	background: #ffffff;
	padding-top: 110px;
}

/* Techno-Hintergrund: eigene Schicht mit begrenzter Hoehe -> cover-Skalierung wie Event-Sektion auf index (nicht ganze lange Sektion) */
.about-tabs.about-tabs--techno,
.discography.discography--techno,
.mediahub.mediahub--techno,
.studio.studio--techno,
.contact-hero.contact-hero--techno {
	background-color: #ffffff;
	position: relative;
	overflow: hidden;
	padding-top: 41px;
}

.about-tabs.about-tabs--techno .about-tabs__techno-bg,
.discography.discography--techno .discography__techno-bg,
.mediahub.mediahub--techno .mediahub__techno-bg,
.studio.studio--techno .studio__techno-bg,
.contact-hero.contact-hero--techno .contact-hero__techno-bg {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: min(920px, 92vh);
	min-height: 560px;
	z-index: 0;
	/* Deckkraft um 10% reduziert (Foto + Verlauf als eine Ebene) */
	opacity: 0.9;
}

.about-tabs.about-tabs--techno .about-tabs__techno-bg.set-bg,
.discography.discography--techno .discography__techno-bg.set-bg,
.mediahub.mediahub--techno .mediahub__techno-bg.set-bg,
.studio.studio--techno .studio__techno-bg.set-bg,
.contact-hero.contact-hero--techno .contact-hero__techno-bg.set-bg {
	background-position: top center;
	background-size: cover;
	background-repeat: no-repeat;
}

.about-tabs.about-tabs--techno .about-tabs__techno-bg.set-bg:before,
.discography.discography--techno .discography__techno-bg.set-bg:before,
.mediahub.mediahub--techno .mediahub__techno-bg.set-bg:before,
.studio.studio--techno .studio__techno-bg.set-bg:before,
.contact-hero.contact-hero--techno .contact-hero__techno-bg.set-bg:before {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	content: "";
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.8)), to(rgba(255, 255, 255, 1)));
	background: -o-linear-gradient(top, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 1) 100%);
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 1) 100%);
	z-index: 1;
	pointer-events: none;
}

.about-tabs.about-tabs--techno .container,
.discography.discography--techno .container,
.mediahub.mediahub--techno .container,
.studio.studio--techno .container,
.contact-hero.contact-hero--techno .container {
	position: relative;
	z-index: 2;
}

.about-tabs .section-title {
	/* Grid: H1-Vordergrund und Wasserzeichen in derselben Zelle, beide zentriert */
	display: grid;
	justify-items: center;
	align-items: end;
	margin-bottom: 44px;
	min-height: 130px;
	padding: 8px 0 0;
	text-align: center;
}

.about-tabs .section-title .section-title__bg {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 0;
	top: auto;
	left: auto;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: 100%;
	text-align: center;
	margin: 0;
	padding: 0;
	line-height: 0.92;
	font-size: clamp(3.25rem, 11vw, 100px);
	pointer-events: none;
}

.about-tabs .section-title h1 {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 1;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: calc(100% - 32px);
	margin: 0;
	padding: 0 16px 0;
	text-align: center;
	line-height: 1;
	font-size: 42px;
	color: #111111;
	font-weight: 700;
	text-transform: uppercase;
	font-family: "Rajdhani", sans-serif;
}

.about-tabs__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 18px;
	padding: 6px 2px;
	margin-top: 8px;
}

.about-tabs__item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	min-height: 0;
	width: 100%;
	background: #f8fbff;
	border: 1px solid #dfe8ef;
	border-radius: 12px;
	padding: 0;
	text-align: left;
	cursor: pointer;
	position: relative;
	z-index: 1;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease, background 0.25s ease, border-color 0.25s ease;
	transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.25s ease, border-color 0.25s ease;
	overflow: hidden;
}

.about-tabs__item:hover {
	background: #ffffff;
	-webkit-transform: scale(1.03);
	transform: scale(1.03);
	z-index: 2;
	-webkit-box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12), 0 4px 10px rgba(0, 0, 0, 0.08);
	box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12), 0 4px 10px rgba(0, 0, 0, 0.08);
}

.about-tabs__item:focus-visible {
	outline: 2px solid #006699;
	outline-offset: 2px;
}

.about-tabs__item.is-active {
	border-color: #006699;
	-webkit-box-shadow: 0 0 0 1px #006699, 0 0 16px rgba(0, 102, 153, 0.35);
	box-shadow: 0 0 0 1px #006699, 0 0 16px rgba(0, 102, 153, 0.35);
}

.about-tabs__item.is-active:hover {
	-webkit-box-shadow: 0 0 0 1px #006699, 0 0 18px rgba(0, 102, 153, 0.4), 0 12px 26px rgba(0, 0, 0, 0.14);
	box-shadow: 0 0 0 1px #006699, 0 0 18px rgba(0, 102, 153, 0.4), 0 12px 26px rgba(0, 0, 0, 0.14);
}

.about-tabs__title {
	display: block;
	padding: 12px 16px;
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: #1b2a33;
	text-transform: uppercase;
	background: #ffffff;
	text-align: center;
}

.about-tabs__media {
	display: block;
	overflow: hidden;
	-ms-flex-negative: 0;
	flex-shrink: 0;
	/* Basis 260px, +20%, dreimal +10% (alle drei Tab-Cards) */
	--about-tab-media-height: calc(260px * 1.2 * 1.1 * 1.1 * 1.1);
	height: var(--about-tab-media-height);
}

.about-tabs__media img {
	width: 100%;
	height: 100%;
	max-width: none;
	display: block;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center center;
	object-position: center center;
}

/* Erste Card: vertikaler Ausschnitt (cover fuellt immer) */
.about-tabs__item--one .about-tabs__media img {
	-o-object-position: center 13%;
	object-position: center 13%;
}

/* Card 2: obere Motivkante priorisieren (Turntables-Foto unter cover sonst oben beschnitten) */
.about-tabs__item--two .about-tabs__media img {
	-o-object-position: center top;
	object-position: center top;
}

/* Card 3: ab Tablet obere Motivkante priorisieren (Kopf bleibt sichtbar) */
@media only screen and (min-width: 768px) {
	.about-tabs__item--three .about-tabs__media img {
		-o-object-position: center 14%;
		object-position: center 14%;
	}
}

.about-tabs__panel {
	/* Offset für sanftes Scrollen unter fixer Navigation */
	scroll-margin-top: 108px;
	background: #ffffff;
	border: 1px solid #dfe8ef;
	border-radius: 12px;
	/* Leichter 3D-Look fuer den Textbereich unter den Cards */
	-webkit-box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.05);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.05);
	padding: 24px 24px 28px;
	color: #333333;
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	-webkit-transition: max-height 0.45s ease-in-out, opacity 0.35s ease-in-out, padding 0.35s ease-in-out, margin 0.35s ease-in-out;
	transition: max-height 0.45s ease-in-out, opacity 0.35s ease-in-out, padding 0.35s ease-in-out, margin 0.35s ease-in-out;
}

.about-tabs__panel h2 {
	font-size: 32px;
	line-height: 1.2;
	color: #111111;
	margin-bottom: 14px;
	scroll-margin-top: 108px;
}

.about-tabs__panel p {
	line-height: 1.75;
	margin-bottom: 14px;
	color: #333333;
}

.about-tabs__panel ul {
	margin-bottom: 12px;
	padding-left: 18px;
}

.about-tabs__panel ul li {
	line-height: 1.7;
	margin-bottom: 10px;
	color: #333333;
}

.about-tabs__signoff {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	margin: 28px 0 0;
	max-width: 100%;
}

.about-tabs__brandname {
	font-family: "Rockville Solid Regular", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: clamp(2.25rem, 5.5vw, 3.75rem);
	line-height: 1.05;
	color: #e4e4e4;
	text-align: left;
	margin: 0 0 6px;
	letter-spacing: 0.02em;
}

.about-tabs__motto {
	margin-top: 0;
	margin-bottom: 0;
	-ms-flex-item-align: stretch;
	align-self: stretch;
	text-align: center;
	font-style: italic;
	font-weight: 700;
	color: #006699;
}

.about-tabs__panel.is-active {
	max-height: 2200px;
	opacity: 1;
	padding: 24px 24px 28px;
}

html.about-tabs-is-switching {
	overflow-anchor: none;
}

/* Mobile: Accordion – Text direkt unter der jeweiligen Card */
@media only screen and (max-width: 991px) {
	.about-tabs__grid {
		overflow-anchor: none;
	}

	.about-tabs__panel {
		-webkit-transition: max-height 0.45s ease-in-out, opacity 0.35s ease-in-out;
		transition: max-height 0.45s ease-in-out, opacity 0.35s ease-in-out;
	}

	.about-tabs__panel.about-tabs__panel--no-transition {
		-webkit-transition: none !important;
		transition: none !important;
	}

	.about-tabs__panel:not(.is-active) {
		padding-top: 0;
		padding-bottom: 0;
		margin-top: 0;
		margin-bottom: 0;
		border-color: transparent;
		-webkit-box-shadow: none;
		box-shadow: none;
		pointer-events: none;
	}
}

@media only screen and (min-width: 992px) {
	.about-tabs__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		column-gap: 18px;
		row-gap: 18px;
	}
	.about-tabs__item--one {
		grid-column: 1;
		grid-row: 1;
	}
	.about-tabs__item--two {
		grid-column: 2;
		grid-row: 1;
	}
	.about-tabs__item--three {
		grid-column: 3;
		grid-row: 1;
	}
	.about-tabs__panel {
		grid-column: 1 / -1;
		grid-row: 2;
		max-height: none;
		opacity: 1;
		padding: 28px 30px 32px;
		display: none;
	}
	.about-tabs__panel.is-active {
		display: block;
		padding: 28px 30px 32px;
	}
}

/* Bildbereich +56% (basis +30%, zusaetzlich +20%): Tablet hochkant einspaltig (768–991px) */
@media only screen and (min-width: 768px) and (max-width: 991px) {
	.about-tabs__media {
		height: calc(var(--about-tab-media-height) * 1.3 * 1.2);
	}
}

/* Bildbereich +30%: drei Cards nebeneinander schmal (992–1023px) */
@media only screen and (min-width: 992px) and (max-width: 1023px) {
	.about-tabs__media {
		height: calc(var(--about-tab-media-height) * 1.3);
	}

	/* Schmaler Viewport: Motiv horizontal feinjustieren */
	.about-tabs__item--one .about-tabs__media img {
		-o-object-position: 32% 13%;
		object-position: 32% 13%;
	}

	.about-tabs__item--two .about-tabs__media img {
		-o-object-position: 68% top;
		object-position: 68% top;
	}
}

/*---------------------
  Feature
-----------------------*/

.feature {
	padding-bottom: 70px;
}

.feature.feature--about .section-title span {
	color: #0071e4;
}

.feature.feature--about .feature__item {
	background: #f5f5f5;
}

.feature.feature--about .feature__item h5 {
	color: #111111;
}

.feature__text {
	padding-top: 80px;
}

.feature__text .section-title {
	margin-bottom: 20px;
}

.feature__text p {
	margin-bottom: 26px;
}

.feature__item {
	background: #0c2b4b;
	text-align: center;
	padding: 40px 10px 35px;
	margin-bottom: 30px;
}

.feature__item.right-column {
	margin-top: 120px;
}

.feature__item h5 {
	font-weight: 700;
	text-transform: uppercase;
	color: #ffffff;
	margin-top: 25px;
}

/*---------------------
  Services
-----------------------*/

.services {
	overflow: hidden;
}

.services__left {
	height: 640px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.services__left .play-btn {
	font-size: 26px;
	color: #ffffff;
	height: 90px;
	width: 90px;
	border-radius: 50%;
	background: -webkit-gradient(linear, left top, right top, from(rgba(0, 85, 128, 0.3)), to(rgba(0, 102, 153, 0.3)));
	background: -o-linear-gradient(left, rgba(0, 85, 128, 0.3), rgba(0, 102, 153, 0.3));
	background: linear-gradient(to right, rgba(0, 85, 128, 0.3), rgba(0, 102, 153, 0.3));
	display: inline-block;
	line-height: 90px;
	text-align: center;
	position: relative;
	z-index: 1;
}

.services__left .play-btn i {
	position: relative;
	top: 2px;
	left: 2px;
}

.services__left .play-btn:after {
	position: absolute;
	left: 15px;
	top: 15px;
	height: 60px;
	width: 60px;
	background: -webkit-gradient(linear, left top, right top, from(#005580), to(#006699));
	background: -o-linear-gradient(left, #005580, #006699);
	background: linear-gradient(to right, #005580, #006699);
	border-radius: 50%;
	content: "";
	z-index: -1;
}

.services__list {
	margin: 0;
}

/* Desktop: 2×2-Grid bündig, Cards füllen Zellen (keine weissen Lücken) */
@media only screen and (min-width: 992px) {
	.services > .container-fluid > .row {
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		align-items: stretch;
	}

	.services > .container-fluid > .row > .col-lg-6:first-child,
	.services > .container-fluid > .row > .col-lg-6:last-child {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	}

	.services > .container-fluid > .row > .col-lg-6:last-child {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}

	.services__list {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		min-height: 640px;
	}

	.services__list > [class*="col-"] {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		padding-left: 0;
		padding-right: 0;
		overflow: hidden;
	}

	.services__list .service__item {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		width: 100%;
		min-height: 320px;
		height: 100%;
	}

	.services__left {
		-webkit-box-flex: 1;
		-ms-flex: 1;
		flex: 1;
		width: 100%;
		min-height: 640px;
		height: auto;
	}
}

.service__item {
	background: #006699;
	min-height: 320px;
	height: auto;
	padding: 52px 40px 40px 70px;
	position: relative;
	z-index: 1;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease, background 0.3s ease;
	transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
	-webkit-box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.18), inset 0 -10px 16px rgba(0, 0, 0, 0.24), 0 12px 24px rgba(0, 0, 0, 0.22);
	box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.18), inset 0 -10px 16px rgba(0, 0, 0, 0.24), 0 12px 24px rgba(0, 0, 0, 0.22);
	overflow: hidden;
}

.service__item:before {
	content: none;
	pointer-events: none;
}

.service__item:hover {
	-webkit-transform: scale(1.02);
	transform: scale(1.02);
	-webkit-box-shadow: inset 0 4px 10px rgba(0, 0, 0, 0.24), inset 0 -12px 20px rgba(0, 0, 0, 0.3), 0 18px 32px rgba(0, 0, 0, 0.28);
	box-shadow: inset 0 4px 10px rgba(0, 0, 0, 0.24), inset 0 -12px 20px rgba(0, 0, 0, 0.3), 0 18px 32px rgba(0, 0, 0, 0.28);
}

@media only screen and (min-width: 992px) {
	/* Zoom im Grid: in der Zelle halten, kein Weiss durchscheinen */
	.services__list .service__item:hover {
		position: relative;
		z-index: 2;
	}
}

.service__item img {
	width: 56px;
	height: 56px;
	display: block;
	-o-object-fit: contain;
	object-fit: contain;
}

.service__item.deep-bg {
	background: #005580;
}

.service__item h3,
.service__item h4 {
	font-size: 26px;
	color: #ffffff;
	font-weight: 700;
	margin-top: 16px;
	margin-bottom: 10px;
}

.service__item p {
	color: #ffffff;
	margin-bottom: 0;
	line-height: 1.45;
	hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	overflow-wrap: break-word;
}

/*---------------------
  Videos
-----------------------*/

.videos {
	padding-bottom: 90px;
}

.videos .section-title {
	margin-bottom: 70px;
}

.videos__large__item {
	height: 585px;
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin-bottom: 30px;
}

.videos__large__item .play-btn {
	height: 50px;
	width: 50px;
	background: #006699;
	border-radius: 50%;
	font-size: 18px;
	line-height: 50px;
	text-align: center;
	display: inline-block;
	color: #ffffff;
}

.videos__large__item__text {
	background: rgba(7, 14, 38, 0.7);
	padding: 25px 30px 25px;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
}

.videos__large__item__text h4 {
	color: #ffffff;
	font-weight: 700;
}

.videos__large__item__text ul li {
	font-size: 13px;
	list-style: none;
	display: inline-block;
	margin-right: 18px;
	color: #ffffff;
	position: relative;
}

.videos__large__item__text ul li:after {
	position: absolute;
	right: -12px;
	top: 2px;
	height: 17px;
	width: 1px;
	background: #ffffff;
	content: "";
}

.videos__large__item__text ul li:last-child {
	margin-right: 0;
}

.videos__large__item__text ul li:last-child:after {
	display: none;
}

.videos__item__pic {
	height: 180px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.videos__item__pic .play-btn {
	height: 40px;
	width: 40px;
	background: #006699;
	border-radius: 50%;
	font-size: 16px;
	line-height: 40px;
	text-align: center;
	display: inline-block;
	color: #ffffff;
}

.videos__item__text {
	padding-top: 20px;
}

.videos__item__text h5 {
	color: #111111;
	font-weight: 700;
	line-height: 26px;
	margin-bottom: 5px;
}

.videos__item__text ul li {
	font-size: 13px;
	list-style: none;
	display: inline-block;
	margin-right: 18px;
	color: #006699;
	position: relative;
}

.videos__item__text ul li:after {
	position: absolute;
	right: -12px;
	top: 2px;
	height: 17px;
	width: 1px;
	background: #888888;
	content: "";
}

.videos__item__text ul li:last-child {
	margin-right: 0;
	color: #888888;
}

.videos__item__text ul li:last-child:after {
	display: none;
}

.videos__slider .col-lg-3 {
	max-width: 100%;
}

.videos__slider.owl-carousel .owl-nav button {
	font-size: 18px;
	color: #888888;
	height: 50px;
	width: 25px;
	background: #ffffff;
	line-height: 50px;
	position: absolute;
	left: 15px;
	top: 22%;
}

.videos__slider.owl-carousel .owl-nav button.owl-next {
	left: auto;
	right: 15px;
}

/*---------------------
  Media Hub
-----------------------*/

.mediahub {
	padding-top: 120px;
	padding-bottom: 35px;
	background: #ffffff;
	--mediahub-tile-min-height: 220px;
}

/*---------------------
  Studio
-----------------------*/

.studio {
	padding-bottom: 25px;
}

.studio .section-title {
	display: grid;
	justify-items: center;
	align-items: end;
	text-align: center;
	margin-bottom: 60px;
	margin-top: 0;
	min-height: 120px;
	padding: 8px 0 0;
}

.studio .section-title > .section-title__bg {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 0;
	top: auto;
	left: auto;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: 100%;
	text-align: center;
	margin: 0;
	padding: 0;
	line-height: 0.92;
	font-family: "Rockville Solid Regular";
	font-size: 90px;
	color: #e4e4e4;
	pointer-events: none;
}

.studio .section-title > h1 {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 1;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: calc(100% - 32px);
	margin: 0;
	padding: 0 16px 0;
	text-align: center;
	line-height: 1;
	font-size: 42px;
	color: #111111;
	font-weight: 700;
	text-transform: uppercase;
	font-family: "Rajdhani", sans-serif;
}

.studio__intro {
	max-width: 860px;
	margin: 0 auto 64px;
	padding: 8px 16px;
	background: transparent;
	border: none;
	-webkit-box-shadow: none;
	box-shadow: none;
	text-align: center;
}

.studio__intro p {
	margin: 0;
	font-size: 17px;
	line-height: 1.65;
	color: #333333;
}

.studio__hero {
	margin: 0 auto 32px;
	border-radius: 12px;
	overflow: hidden;
	border: 1px solid #dce7ef;
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
}

.studio__hero img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 520px;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: center;
	object-position: center;
}

/* Studio: Zickzack (freistehender Text + abgerundete Bilder) */
.studio__zigzag {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 96px;
	margin-top: 0;
}

.studio__zigzag-row {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
	gap: 40px;
	min-height: 280px;
}

.studio__zigzag__text {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 50%;
	flex: 1 1 50%;
	padding: 8px 12px;
	background: transparent;
	border: none;
	-webkit-box-shadow: none;
	box-shadow: none;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.studio__zigzag__text h2,
.studio__zigzag__text h4 {
	margin: 0 0 14px;
	font-size: 26px;
	line-height: 1.25;
	font-weight: 700;
	color: #111111;
	text-transform: none;
}

.studio__zigzag__text p {
	margin: 0 0 16px;
	font-size: 16px;
	line-height: 1.6;
	color: #333333;
}

.studio__zigzag__subhead {
	margin: 0 0 12px;
	font-size: 18px;
	line-height: 1.4;
	font-weight: 700;
	color: #006699;
	text-transform: none;
	font-family: "Rajdhani", sans-serif;
}

.studio__zigzag__subhead + p {
	margin-top: 0;
}

.studio__zigzag__text ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.studio__zigzag__text li {
	position: relative;
	padding-left: 18px;
	margin-bottom: 10px;
	font-size: 15px;
	line-height: 1.55;
	color: #333333;
}

.studio__zigzag__text li:last-child {
	margin-bottom: 0;
}

.studio__zigzag__text li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #006699;
}

.studio__zigzag__pic {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 50%;
	flex: 1 1 50%;
	border-radius: 12px;
	overflow: visible;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	-webkit-box-shadow: 0 10px 26px rgba(0, 0, 0, 0.14), 0 4px 10px rgba(0, 0, 0, 0.08);
	box-shadow: 0 10px 26px rgba(0, 0, 0, 0.14), 0 4px 10px rgba(0, 0, 0, 0.08);
}

.studio__cta {
	max-width: 720px;
	margin: 72px auto 0;
	padding: 0 16px;
	text-align: center;
}

.studio__cta h3 {
	margin: 0 0 16px;
	font-size: 32px;
	line-height: 1.25;
	font-weight: 700;
	color: #111111;
	text-transform: none;
}

.studio__cta p {
	margin: 0 0 28px;
	font-size: 17px;
	line-height: 1.65;
	color: #333333;
}

.studio__cta .primary-btn.border-btn {
	text-decoration: none;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-transition: -webkit-transform 0.3s ease;
	transition: transform 0.3s ease;
}

.studio__cta .primary-btn.border-btn:hover {
	-webkit-transform: scale(1.03);
	transform: scale(1.03);
	color: #111111;
	background: transparent;
}

@media only screen and (max-width: 991px) {
	.studio__zigzag-row,
	.studio__zigzag-row.studio__zigzag-row--reverse {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 24px;
		min-height: 0;
		margin-top: -20px;
	}

	/* Mobil: immer zuerst Bild, dann Text (unabhängig vom Desktop-Zickzack) */
	.studio__zigzag-row .studio__zigzag__pic {
		-webkit-box-ordinal-group: 1;
		-ms-flex-order: 0;
		order: 0;
	}

	.studio__zigzag-row .studio__zigzag__text {
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 1;
		order: 1;
	}

	.studio__zigzag__pic {
		min-height: 220px;
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
	}

	.studio__zigzag__text {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
		padding: 4px 0;
	}

	.studio__cta {
		margin-top: 36px;
	}

	.studio__cta h3 {
		font-size: 26px;
	}
}

.mediahub .section-title {
	margin-bottom: 55px;
}

/* Vordergrund „Media“ und Hintergrund „Media Hub“ stabil uebereinander */
.mediahub .section-title--mediahub {
	display: grid;
	justify-items: center;
	align-items: end;
	min-height: 120px;
	padding: 8px 0 0;
	text-align: center;
}

.mediahub .section-title--mediahub > .section-title__bg {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 0;
	top: auto;
	left: auto;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: 100%;
	text-align: center;
	margin: 0;
	padding: 0;
	line-height: 0.92;
	font-family: "Rockville Solid Regular";
	font-size: 100px;
	color: #e4e4e4;
	pointer-events: none;
}

.mediahub .section-title--mediahub > h1 {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 1;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: calc(100% - 32px);
	margin: 0;
	padding: 0 16px 0;
	text-align: center;
	line-height: 1;
	font-size: 42px;
	color: #111111;
	font-weight: 700;
	text-transform: uppercase;
	font-family: "Rajdhani", sans-serif;
}

.mediahub__layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 18px;
	min-width: 0;
}

.mediahub__tile {
	position: relative;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	min-height: var(--mediahub-tile-min-height);
	padding: 22px 20px;
	border-radius: 12px;
	overflow: hidden;
	background-size: cover;
	background-position: center;
	border: 1px solid rgba(0, 102, 153, 0.22);
	-webkit-box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.14), inset 0 -8px 14px rgba(0, 0, 0, 0.18), 0 10px 22px rgba(0, 0, 0, 0.2);
	box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.14), inset 0 -8px 14px rgba(0, 0, 0, 0.18), 0 10px 22px rgba(0, 0, 0, 0.2);
	color: #ffffff;
	text-decoration: none;
	text-align: center;
	-webkit-transition: -webkit-transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
	transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.mediahub__tile::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0.24);
	-webkit-transition: background 0.35s ease;
	transition: background 0.35s ease;
}

.mediahub__tile::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.34)), color-stop(45%, rgba(0, 0, 0, 0.16)), to(rgba(0, 0, 0, 0.04)));
	background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.34) 0%, rgba(0, 0, 0, 0.16) 45%, rgba(0, 0, 0, 0.04) 100%);
	background: linear-gradient(to top, rgba(0, 0, 0, 0.34) 0%, rgba(0, 0, 0, 0.16) 45%, rgba(0, 0, 0, 0.04) 100%);
}

.mediahub__tile__collage {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
}

.mediahub__tile__collage-item {
	display: block;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 3px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}

/* Events: organisches Mosaik (unregelmaessige Groessen + leichte Ueberlappung) */
.mediahub__tile__collage--mosaic {
	display: block;
	-webkit-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
	-webkit-transform-origin: 28% 48%;
	-ms-transform-origin: 28% 48%;
	transform-origin: 28% 48%;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item {
	position: absolute;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(1) {
	width: 48%;
	height: 32%;
	top: 0;
	left: -2%;
	z-index: 2;
	-webkit-transform: rotate(-2.5deg);
	transform: rotate(-2.5deg);
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(2) {
	width: 38%;
	height: 22%;
	top: 4%;
	right: 0;
	z-index: 4;
	-webkit-transform: rotate(1.5deg);
	transform: rotate(1.5deg);
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(3) {
	width: 32%;
	height: 20%;
	top: 18%;
	left: 28%;
	z-index: 5;
	-webkit-transform: rotate(-1deg);
	transform: rotate(-1deg);
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(4) {
	width: 28%;
	height: 18%;
	top: 22%;
	right: 8%;
	z-index: 3;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(5) {
	width: 54%;
	height: 34%;
	top: 28%;
	left: -8%;
	z-index: 6;
	-webkit-transform: rotate(2deg);
	transform: rotate(2deg);
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(6) {
	width: 30%;
	height: 22%;
	top: 38%;
	left: 36%;
	z-index: 4;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(7) {
	width: 36%;
	height: 28%;
	top: 34%;
	right: -2%;
	z-index: 7;
	-webkit-transform: rotate(-1.5deg);
	transform: rotate(-1.5deg);
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(8) {
	width: 44%;
	height: 30%;
	top: 46%;
	left: -7%;
	z-index: 5;
	-webkit-transform: rotate(-1.5deg);
	transform: rotate(-1.5deg);
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(9) {
	width: 28%;
	height: 20%;
	top: 52%;
	left: 48%;
	z-index: 5;
	-webkit-transform: rotate(2.5deg);
	transform: rotate(2.5deg);
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(10) {
	width: 34%;
	height: 24%;
	top: 50%;
	right: 4%;
	z-index: 3;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(11) {
	width: 46%;
	height: 34%;
	bottom: 12%;
	top: auto;
	left: -8%;
	z-index: 4;
	-webkit-transform: rotate(-2deg);
	transform: rotate(-2deg);
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(12) {
	width: 26%;
	height: 20%;
	bottom: 14%;
	top: auto;
	left: 24%;
	z-index: 1;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(13) {
	width: 34%;
	height: 26%;
	bottom: 4%;
	top: auto;
	left: 36%;
	z-index: 6;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(14) {
	width: 30%;
	height: 22%;
	bottom: 10%;
	top: auto;
	right: 6%;
	z-index: 2;
	-webkit-transform: rotate(1deg);
	transform: rotate(1deg);
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(15) {
	width: 58%;
	height: 38%;
	bottom: 0;
	top: auto;
	left: -10%;
	z-index: 7;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(16) {
	width: 28%;
	height: 18%;
	bottom: 0;
	top: auto;
	left: 30%;
	z-index: 3;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(17) {
	width: 42%;
	height: 28%;
	bottom: 0;
	top: auto;
	right: -4%;
	z-index: 7;
	-webkit-transform: rotate(-2deg);
	transform: rotate(-2deg);
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(18) {
	width: 26%;
	height: 16%;
	top: 8%;
	left: 52%;
	z-index: 2;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(19) {
	width: 24%;
	height: 15%;
	top: 42%;
	left: 58%;
	z-index: 4;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(20) {
	width: 26%;
	height: 20%;
	bottom: 2%;
	top: auto;
	left: 48%;
	z-index: 4;
}

.mediahub__tile__collage--mosaic .mediahub__tile__collage-item:nth-child(21) {
	width: 34%;
	height: 24%;
	bottom: 0;
	top: auto;
	right: 2%;
	z-index: 3;
	-webkit-transform: rotate(1.5deg);
	transform: rotate(1.5deg);
}

.mediahub__tile--events:hover .mediahub__tile__collage-item,
.mediahub__tile--events:focus-visible .mediahub__tile__collage-item {
	box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
}

.mediahub__tile > :not(.mediahub__tile__collage) {
	position: relative;
	z-index: 3;
}

.mediahub__tile:hover,
.mediahub__tile:focus-visible {
	color: #ffffff;
	-webkit-transform: translateY(-4px) scale(1.02);
	transform: translateY(-4px) scale(1.02);
	border-color: rgba(0, 102, 153, 0.7);
	-webkit-box-shadow: inset 0 4px 10px rgba(0, 0, 0, 0.2), inset 0 -12px 20px rgba(0, 0, 0, 0.24), 0 16px 30px rgba(0, 0, 0, 0.28);
	box-shadow: inset 0 4px 10px rgba(0, 0, 0, 0.2), inset 0 -12px 20px rgba(0, 0, 0, 0.24), 0 16px 30px rgba(0, 0, 0, 0.28);
}

.mediahub__tile:hover::before,
.mediahub__tile:focus-visible::before {
	background: rgba(0, 0, 0, 0.03);
}

.mediahub__tile__kicker {
	display: block;
	width: 100%;
	margin-bottom: 10px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #7edcff;
	text-align: center;
}

a.mediahub__tile > h2,
a.mediahub__tile > h3,
.mediahub__tile h2,
.mediahub__tile h3 {
	width: 100%;
	font-size: 30px;
	line-height: 1.15;
	font-weight: 700;
	text-transform: uppercase;
	margin: 0 0 8px;
	color: #ffffff;
	font-family: "Rajdhani", sans-serif;
	text-align: center;
}

.mediahub__tile p {
	width: 100%;
	max-width: 28em;
	font-size: 14px;
	line-height: 1.5;
	margin: 0;
	color: #f3f6f8;
	text-align: center;
}

/* Platzhalter-Hintergruende bis echte Assets eingefuegt werden */
.mediahub__tile--radio {
	background-image: url(../img/media/radio/dj-sequence-radio-web.jpg);
}

.mediahub__tile--radio h2,
.mediahub__tile--radio h3 {
	font-size: 26px;
}

.mediahub__tile--charts {
	background-image: url(../img/media/charts/charts-web.jpg);
	/* Oberer Bildbereich ist relevant: daher oben ausrichten */
	background-position: center top;
}

.mediahub__tile--charts h2,
.mediahub__tile--charts h3 {
	font-size: 26px;
}

.mediahub__tile--events {
	background-color: #0f2430;
}

.mediahub__tile--events h2,
.mediahub__tile--events h3 {
	font-size: 26px;
	margin-bottom: 0;
}

.mediahub__tile--press {
	background-image: url(../img/media/contest/dj-sequence-contest-web.jpg);
	background-position: center 90%;
	background-size: cover;
}

.mediahub__tile--masonry {
	background-image: linear-gradient(135deg, #102431, #153f56);
}

.mediahub__tile--story {
	background-color: #000000;
	background-image: url(../img/media/presse/dj-sequence-press.jpg);
	background-position: center top;
	background-size: 88% auto;
	background-repeat: no-repeat;
}

.mediahub__flow-notes {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
	margin-top: 2px;
}

.mediahub__flow-notes p {
	margin: 0;
	padding: 10px 12px;
	border-left: 3px solid #006699;
	background: #f3f8fb;
	color: #333333;
	font-size: 14px;
	line-height: 1.45;
}

.mediahub__detail {
	margin-top: 28px;
	padding: 22px;
	border: 1px solid #d7e4ee;
	border-radius: 12px;
	background: #f9fcff;
	min-width: 0;
	overflow: hidden;
}

.mediahub__detail__head {
	margin-bottom: 14px;
	scroll-margin-top: 108px;
}

.mediahub__detail__head span {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #006699;
	margin-bottom: 4px;
}

.mediahub__detail__head h2,
.mediahub__detail__head h3 {
	margin: 0;
	font-size: 30px;
	font-weight: 700;
	text-transform: uppercase;
	scroll-margin-top: 108px;
}

.mediahub__detail__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
}

.mediahub__detail__card {
	padding: 16px;
	background: #ffffff;
	border: 1px solid #dce7ef;
	border-radius: 10px;
	min-width: 0;
	-webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06), inset 0 -4px 8px rgba(0, 0, 0, 0.08), 0 8px 18px rgba(0, 0, 0, 0.1);
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06), inset 0 -4px 8px rgba(0, 0, 0, 0.08), 0 8px 18px rgba(0, 0, 0, 0.1);
}

.mediahub__detail__card:hover {
	-webkit-transform: translateY(-2px);
	transform: translateY(-2px);
	-webkit-box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.08), inset 0 -6px 10px rgba(0, 0, 0, 0.1), 0 12px 24px rgba(0, 0, 0, 0.14);
	box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.08), inset 0 -6px 10px rgba(0, 0, 0, 0.1), 0 12px 24px rgba(0, 0, 0, 0.14);
}

.mediahub__detail__card h3,
.mediahub__detail__card h4 {
	font-size: 22px;
	margin-bottom: 10px;
}

.mediahub__gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
}

.mediahub__gallery img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid #d6e3ec;
	background: #edf4f9;
	cursor: zoom-in;
}

.mediahub__audio {
	width: 100%;
	border-radius: 8px;
	background-color: #006699;
}

.mediahub__detail__card--audio {
	margin-bottom: 14px;
	background: #f3f8fb;
	border-color: #c9dfea;
}

.mediahub__audio::-webkit-media-controls-panel {
	background-color: #006699;
}

/* Events: endloser Flyer-Slider (links nach rechts) */
.mediahub__detail--events {
	padding-bottom: 18px;
}

.mediahub__events-marquee {
	min-width: 0;
}

.mediahub__events-marquee__viewport {
	overflow: hidden;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	border-radius: 10px;
	border: 1px solid #dce7ef;
	background: #ffffff;
}

.mediahub__events-marquee__track {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	will-change: transform;
}

.mediahub__events-marquee__group {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-ms-flex-negative: 0;
	flex-shrink: 0;
	gap: 14px;
	padding: 14px;
}

.mediahub__events-marquee__item {
	margin: 0;
	-ms-flex-negative: 0;
	flex-shrink: 0;
}

.mediahub__events-marquee__item img {
	display: block;
	height: 220px;
	width: auto;
	max-width: none;
	border-radius: 8px;
	border: 1px solid #d6e3ec;
	background: #edf4f9;
	-o-object-fit: contain;
	object-fit: contain;
	cursor: zoom-in;
}

@media only screen and (max-width: 991px) {
	/* Mobil: Mosaik dezenter skalieren, damit nichts "aufzieht". */
	.mediahub__tile__collage--mosaic {
		-webkit-transform: scale(1.02);
		-ms-transform: scale(1.02);
		transform: scale(1.02);
		-webkit-transform-origin: center 50%;
		-ms-transform-origin: center 50%;
		transform-origin: center 50%;
	}

	#mediahub-detail-host .mediahub__detail {
		margin-top: 12px;
	}

	.mediahub__events-marquee__item img {
		height: 170px;
	}
}

/* Media Hub Cards: 426–991px — +20% Basis, ab Tablet extra Hoehe (breitere Cards = mehr Cover-Crop) */
@media only screen and (min-width: 426px) and (max-width: 991px) {
	.mediahub {
		--mediahub-tile-min-height: clamp(
			calc(220px * 1.2),
			calc(220px * 1.2 + (100vw - 426px) * 0.14),
			calc(220px * 1.44)
		);
	}
}

/* Media Hub Cards: 768–991px — zusaetzlich +20% Hoehe nach unten (explizit, kein var-Self-Reference) */
@media only screen and (min-width: 768px) and (max-width: 991px) {
	.mediahub {
		--mediahub-tile-min-height: clamp(
			calc(220px * 1.2 * 1.2),
			calc((220px * 1.2 + (100vw - 426px) * 0.14) * 1.2),
			calc(220px * 1.44 * 1.2)
		);
	}

	/* Events & Contest: Ausschnitt etwas nach unten */
	.mediahub__tile--press {
		background-position: center 76%;
	}

	/* Press & Highlights: Ausschnitt etwas nach oben */
	.mediahub__tile--story {
		background-position: center 18%;
	}
}

/* Media Hub: Events & Contest — 375–425px Ausschnitt etwas nach unten */
@media only screen and (min-width: 375px) and (max-width: 425px) {
	.mediahub__tile--press {
		background-position: center 74%;
	}
}

@media only screen and (min-width: 992px) {
	.mediahub__layout {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		grid-template-areas:
			"radio charts events"
			"press story events";
	}

	.mediahub__tile--radio {
		grid-area: radio;
		min-height: 270px;
	}

	.mediahub__tile--charts {
		grid-area: charts;
		min-height: 270px;
	}

	.mediahub__tile--events {
		grid-area: events;
		min-height: 560px;
	}

	.mediahub__tile--press {
		grid-area: press;
		min-height: 270px;
	}

	.mediahub__tile--story {
		grid-area: story;
		min-height: 270px;
	}
}

/* Radio/Charts: Galerien untereinander, je 4 Spalten (Desktop) */
@media only screen and (min-width: 1024px) {
	.mediahub__detail__grid {
		grid-template-columns: 1fr;
	}

	.mediahub__gallery {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/*---------------------
    Blog
-----------------------*/

.blog {
	padding-bottom: 60px;
}

.blog .section-title {
	margin-bottom: 80px;
}

.blog__large {
	margin-bottom: 45px;
	-webkit-box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
	margin-bottom: 50px;
}

.blog__large__pic {
	height: 370px;
	position: relative;
}

.blog__large__pic a {
	font-size: 16px;
	height: 40px;
	width: 40px;
	background: rgba(245, 245, 245, 0.3);
	border-radius: 50%;
	color: #ffffff;
	line-height: 40px;
	text-align: center;
	display: inline-block;
	position: absolute;
	right: 12px;
	bottom: 12px;
}

.blog__large__text {
	background: #ffffff;
	text-align: center;
	padding: 30px 40px 0;
}

.blog__large__text span {
	font-size: 13px;
	text-transform: uppercase;
	color: #006699;
}

.blog__large__text h4 {
	color: #111111;
	font-weight: 700;
	line-height: 31px;
	margin-top: 5px;
	margin-bottom: 15px;
}

.blog__large__text p {
	margin-bottom: 40px;
}

.blog__large__widget {
	border-top: 1px solid #f2f2f2;
	padding: 15px 0 20px;
	text-align: left;
	margin: 0 30px;
}

.blog__large__widget .right__widget {
	text-align: right;
}

.blog__large__widget ul li {
	font-size: 13px;
	color: #888888;
	display: inline-block;
	list-style: none;
	margin-right: 20px;
	position: relative;
}

.blog__large__widget ul li span {
	color: #111111;
}

.blog__large__widget ul li:after {
	position: absolute;
	right: -14px;
	top: -2px;
	content: "|";
}

.blog__large__widget ul li:last-child {
	margin-right: 0;
}

.blog__large__widget ul li:last-child:after {
	display: none;
}

.blog__item {
	-webkit-box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
	box-shadow: 0px 3px 10px rgba(22, 41, 124, 0.1);
	margin-bottom: 50px;
}

.blog__item__pic img {
	min-width: 100%;
}

.blog__item__text {
	text-align: center;
	background: #ffffff;
	padding: 20px 20px 25px;
}

.blog__item__text span {
	font-size: 13px;
	text-transform: uppercase;
	color: #006699;
}

.blog__item__text h5 {
	color: #111111;
	font-weight: 700;
	line-height: 26px;
	font-size: 20px;
	margin-top: 10px;
	margin-bottom: 12px;
}

.blog__item__text ul li {
	font-size: 13px;
	color: #888888;
	display: inline-block;
	list-style: none;
	margin-right: 20px;
	position: relative;
}

.blog__item__text ul li span {
	color: #111111;
}

.blog__item__text ul li:after {
	position: absolute;
	right: -14px;
	top: -2px;
	content: "|";
}

.blog__item__text ul li:last-child {
	margin-right: 0;
}

.blog__item__text ul li:last-child:after {
	display: none;
}

/*---------------------
  Blog Sidebar
-----------------------*/

.blog__sidebar__item {
	text-align: center;
	margin-bottom: 65px;
}

.blog__sidebar__item:last-child {
	margin-bottom: 0;
}

.blog__sidebar__item form input {
	height: 50px;
	font-size: 15px;
	color: #444444;
	padding-left: 20px;
	border: 1px solid #e1e1e1;
	width: 100%;
	margin-bottom: 20px;
}

.blog__sidebar__item form input::-webkit-input-placeholder {
	color: #444444;
}

.blog__sidebar__item form input::-moz-placeholder {
	color: #444444;
}

.blog__sidebar__item form input:-ms-input-placeholder {
	color: #444444;
}

.blog__sidebar__item form input::-ms-input-placeholder {
	color: #444444;
}

.blog__sidebar__item form input::placeholder {
	color: #444444;
}

.blog__sidebar__title {
	text-align: center;
	margin-bottom: 35px;
}

.blog__sidebar__title h4 {
	color: #111111;
	font-weight: 700;
	position: relative;
	padding-bottom: 20px;
}

.blog__sidebar__title h4::before {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 5px;
	width: 70px;
	background: #e1e1e1;
	content: "";
	margin: 0 auto;
}

.blog__sidebar__social a {
	display: inline-block;
	font-size: 18px;
	color: #111111;
	width: 50px;
	height: 50px;
	background: #f2f2f2;
	border-radius: 50%;
	line-height: 50px;
	text-align: center;
	margin-right: 6px;
	margin-bottom: 5px;
}

.blog__sidebar__social a:last-child {
	margin-right: 6px;
}

.recent__item {
	display: block;
	overflow: hidden;
	margin-bottom: 25px;
	text-align: left;
}

.recent__item__pic {
	float: left;
	margin-right: 25px;
}

.recent__item__text {
	overflow: hidden;
}

.recent__item__text h6 {
	color: #111111;
	line-height: 21px;
	font-weight: 700;
}

.recent__item__text span {
	font-size: 13px;
	color: #888888;
}

/*---------------------
  Blog Details
-----------------------*/

.blog-details {
	padding-bottom: 60px;
	padding-top: 70px;
}

.blog__details__item {
	margin-bottom: 32px;
}

.blog__details__item__pic {
	height: 385px;
	position: relative;
}

.blog__details__item__pic a {
	font-size: 16px;
	height: 40px;
	width: 40px;
	background: rgba(245, 245, 245, 0.3);
	border-radius: 50%;
	color: #ffffff;
	line-height: 40px;
	text-align: center;
	display: inline-block;
	position: absolute;
	right: 12px;
	bottom: 12px;
}

.blog__details__item__text {
	background: #ffffff;
	padding-top: 30px;
}

.blog__details__item__text span {
	font-size: 13px;
	text-transform: uppercase;
	color: #006699;
}

.blog__details__item__text h3 {
	color: #111111;
	font-weight: 700;
	line-height: 31px;
	margin-top: 5px;
	margin-bottom: 15px;
}

.blog__details__item__text p {
	margin-bottom: 40px;
}

.blog__details__item__widget {
	border-top: 1px solid #f2f2f2;
	padding-top: 15px;
	text-align: left;
}

.blog__details__item__widget ul li {
	font-size: 13px;
	color: #888888;
	display: inline-block;
	list-style: none;
	margin-right: 20px;
	position: relative;
}

.blog__details__item__widget ul li span {
	color: #111111;
}

.blog__details__item__widget ul li:after {
	position: absolute;
	right: -14px;
	top: -2px;
	content: "|";
}

.blog__details__item__widget ul li:last-child {
	margin-right: 0;
}

.blog__details__item__widget ul li:last-child:after {
	display: none;
}

.blog__details__desc {
	margin-bottom: 54px;
}

.blog__details__desc p {
	margin-bottom: 20px;
}

.blog__details__desc p:last-child {
	margin-bottom: 0;
}

.blog__details__quote {
	border: 1px solid #e1e1e1;
	padding: 35px 40px 35px 40px;
	position: relative;
	margin-bottom: 35px;
}

.blog__details__quote p {
	font-size: 18px;
	color: #111111;
	line-height: 31px;
}

.blog__details__quote h6 {
	font-size: 15px;
	color: #888888;
	text-transform: uppercase;
}

.blog__details__quote i {
	font-size: 36px;
	color: #006699;
	position: absolute;
	right: 40px;
	bottom: 35px;
}

.blog__details__tags {
	padding-top: 20px;
	margin-bottom: 60px;
}

.blog__details__tags a {
	display: inline-block;
	font-size: 15px;
	color: #444444;
	padding: 12px 20px 10px;
	background: #f5f5f5;
	margin-right: 10px;
}

.blog__details__tags a:last-child {
	margin-right: 0;
}

.blog__details__option {
	margin-bottom: 60px;
}

.blog__option__btn {
	display: block;
	overflow: hidden;
}

.blog__option__btn.blog__option__btn--next {
	text-align: right;
}

.blog__option__btn.blog__option__btn--next .option__btn__name i {
	margin-right: 0;
	margin-left: 6px;
}

.blog__option__btn.blog__option__btn--next .blog__option__btn__item {
	overflow: hidden;
}

.blog__option__btn.blog__option__btn--next .blog__option__btn__item .blog__option__btn__pic {
	float: right;
	margin-right: 0;
	margin-left: 30px;
}

.blog__option__btn .option__btn__name {
	font-size: 15px;
	color: #444444;
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 25px;
}

.blog__option__btn .option__btn__name i {
	font-size: 18px;
	font-weight: 700;
	margin-right: 6px;
}

.blog__option__btn__pic {
	float: left;
	margin-right: 26px;
}

.blog__option__btn__text {
	overflow: hidden;
}

.blog__option__btn__text h6 {
	color: #111111;
	font-weight: 700;
	line-height: 21px;
}

.blog__option__btn__text span {
	color: #888888;
	font-size: 13px;
}

.blog__details__services {
	margin-bottom: 30px;
}

.blog__details__services__title,
.blog__details__form__title {
	text-align: center;
	margin-bottom: 30px;
}

.blog__details__services__title h4,
.blog__details__form__title h4 {
	color: #111111;
	font-weight: 700;
	position: relative;
	padding-bottom: 20px;
	font-size: 26px;
}

.blog__details__services__title h4::before,
.blog__details__form__title h4::before {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 5px;
	width: 70px;
	background: #e1e1e1;
	content: "";
	margin: 0 auto;
}

.blog__details__services__item {
	-webkit-box-shadow: 0px 5px 15px rgba(0, 61, 85, 0.07);
	box-shadow: 0px 5px 15px rgba(0, 61, 85, 0.07);
	margin-bottom: 30px;
}

.blog__details__services__item__pic img {
	min-width: 100%;
}

.blog__details__services__item__text {
	padding: 15px 20px 10px;
}

.blog__details__services__item__text h6 a {
	font-size: 17px;
	color: #111111;
	font-weight: 700;
	line-height: 22px;
}

.blog__details__services__item__text span {
	color: #888888;
	font-size: 13px;
}

.blog__details__form form .input__list,
.contact__form form .input__list {
	margin-right: -20px;
	overflow: hidden;
}

.blog__details__form form .input__list input,
.contact__form form .input__list input {
	height: 50px;
	font-size: 13px;
	color: #666666;
	padding-left: 20px;
	border: 1px solid #e1e1e1;
	width: calc(33.33% - 20px);
	margin-bottom: 20px;
	margin-right: 16px;
}

.blog__details__form form .input__list input::-webkit-input-placeholder,
.contact__form form .input__list input::-webkit-input-placeholder {
	color: #666666;
}

.blog__details__form form .input__list input::-moz-placeholder,
.contact__form form .input__list input::-moz-placeholder {
	color: #666666;
}

.blog__details__form form .input__list input:-ms-input-placeholder,
.contact__form form .input__list input:-ms-input-placeholder {
	color: #666666;
}

.blog__details__form form .input__list input::-ms-input-placeholder,
.contact__form form .input__list input::-ms-input-placeholder {
	color: #666666;
}

.blog__details__form form .input__list input::placeholder,
.contact__form form .input__list input::placeholder {
	color: #666666;
}

.blog__details__form form textarea,
.contact__form form textarea {
	height: 120px;
	font-size: 13px;
	color: #666666;
	padding-left: 20px;
	padding-top: 12px;
	border: 1px solid #e1e1e1;
	width: 100%;
	margin-bottom: 14px;
	resize: none;
}

.blog__details__form form textarea::-webkit-input-placeholder,
.contact__form form textarea::-webkit-input-placeholder {
	color: #666666;
}

.blog__details__form form textarea::-moz-placeholder,
.contact__form form textarea::-moz-placeholder {
	color: #666666;
}

.blog__details__form form textarea:-ms-input-placeholder,
.contact__form form textarea:-ms-input-placeholder {
	color: #666666;
}

.blog__details__form form textarea::-ms-input-placeholder,
.contact__form form textarea::-ms-input-placeholder {
	color: #666666;
}

.blog__details__form form textarea::placeholder,
.contact__form form textarea::placeholder {
	color: #666666;
}

/*---------------------
  Map
-----------------------*/

.contact-hero.contact-hero--techno {
	padding-bottom: 48px;
}

.contact-hero .section-title {
	display: grid;
	justify-items: center;
	align-items: end;
	margin-bottom: 0;
	min-height: 120px;
	padding: 8px 0 0;
	text-align: center;
}

.contact-hero .section-title > .section-title__bg {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 0;
	top: auto;
	left: auto;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: 100%;
	text-align: center;
	margin: 0;
	padding: 0;
	line-height: 0.92;
	font-family: "Rockville Solid Regular";
	font-size: 100px;
	color: #e4e4e4;
	pointer-events: none;
}

.contact-hero .section-title > h1 {
	position: relative;
	grid-column: 1;
	grid-row: 1;
	justify-self: center;
	align-self: end;
	z-index: 1;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: calc(100% - 32px);
	margin: 0;
	padding: 0 16px 0;
	text-align: center;
	line-height: 1;
	font-size: 42px;
	color: #111111;
	font-weight: 700;
	text-transform: uppercase;
	font-family: "Rajdhani", sans-serif;
}

.map {
	height: 585px;
	margin-top: 0;
}

.map iframe {
	width: 100%;
}

/*---------------------
  Contact
-----------------------*/

.contact {
	padding-top: 70px;
	padding-bottom: 50px;
}

.contact__address .section-title {
	margin-bottom: 10px;
}

.contact__address .section-title h2 {
	text-transform: none;
}

.contact__address p {
	margin-bottom: 34px;
}

.contact__address ul li {
	list-style: none;
	padding-left: 100px;
	position: relative;
	margin-bottom: 30px;
}

.contact__address ul li:last-child {
	margin-bottom: 0;
}

.contact__address ul li i {
	font-size: 30px;
	height: 70px;
	width: 70px;
	background: #f5f5f5;
	border-radius: 50%;
	line-height: 70px;
	text-align: center;
	color: #006699;
	position: absolute;
	left: 0;
	top: -4px;
}

.contact__address ul li h5 {
	font-size: 20px;
	color: #111111;
	font-weight: 700;
	margin-bottom: 10px;
}

.contact__address ul li p {
	margin-bottom: 0;
}

.contact__address ul li span {
	font-size: 15px;
	color: #111111;
	display: inline-block;
	margin-right: 25px;
	position: relative;
}

.contact__address ul li span:after {
	position: absolute;
	right: -20px;
	top: -1px;
	content: ".";
	font-size: 39px;
	line-height: 0;
	border-radius: 50%;
}

.contact__address ul li span:last-child {
	margin-right: 0;
}

.contact__address ul li span:last-child:after {
	display: none;
}

.contact__form .section-title {
	margin-bottom: 10px;
}

.contact__form .section-title h2 {
	text-transform: none;
}

.contact__form p {
	margin-bottom: 34px;
}

/* Contact Page: Formular links, Karte + Infos rechts */
.contact-page {
	padding-top: 0;
	padding-bottom: 80px;
}

.contact-page__grid {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 24px;
}

.contact-page__form-col,
.contact-page__aside-col {
	width: 100%;
}

.contact-page__aside-col {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	gap: 24px;
}

.contact-page__card {
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 12px;
	padding: 28px;
	-webkit-box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
}

.contact-page__form-title,
.contact-page__info-title {
	margin: 0 0 24px;
	font-size: 24px;
	font-weight: 700;
	color: #111111;
}

.contact-page__info-block + .contact-page__info-block .contact-page__info-title {
	margin-top: 0;
}

.contact-page__info-divider {
	height: 1px;
	margin: 28px 0;
	background: #e8e8e8;
}

.contact-page__field {
	margin-bottom: 18px;
}

.contact-page__field label {
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 600;
	color: #333333;
}

.contact-page__field input,
.contact-page__field select,
.contact-page__field textarea {
	width: 100%;
	height: 48px;
	padding: 0 16px;
	border: 1px solid #d9d9d9;
	border-radius: 8px;
	font-size: 15px;
	color: #333333;
	background: #ffffff;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.contact-page__field textarea {
	height: auto;
	min-height: 140px;
	padding-top: 12px;
	padding-bottom: 12px;
	resize: vertical;
}

.contact-page__field select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23333' d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
	padding-right: 40px;
}

.contact-page__field select:disabled {
	background-color: #f5f5f5;
	color: #999999;
	cursor: not-allowed;
}

.contact-page__field input:focus:not(:focus-visible),
.contact-page__field select:focus:not(:focus-visible),
.contact-page__field textarea:focus:not(:focus-visible) {
	outline: none;
	border-color: #006699;
}

.contact-page__field input:focus-visible,
.contact-page__field select:focus-visible,
.contact-page__field textarea:focus-visible {
	outline: 2px solid #006699;
	outline-offset: 2px;
	border-color: #006699;
}

.contact-page__row--half {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 16px;
}

.contact-page__row--half .contact-page__field {
	-webkit-box-flex: 1;
	-ms-flex: 1;
	flex: 1;
	min-width: 0;
}

.contact-page__field--checkbox {
	margin-bottom: 22px;
}

.contact-page__checkbox {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	font-size: 14px;
	font-weight: 400;
	color: #333333;
	cursor: pointer;
}

.contact-page__checkbox input {
	width: 18px;
	height: 18px;
	margin-top: 2px;
	-ms-flex-negative: 0;
	flex-shrink: 0;
}

.contact-page__checkbox a {
	color: #006699;
	text-decoration: underline;
}

.contact-page__submit {
	border-radius: 8px;
	cursor: pointer;
}

.contact-page__form-status {
	margin: 0 0 18px;
	padding: 12px 14px;
	border-radius: 8px;
	font-size: 14px;
	line-height: 1.5;
}

.contact-page__form-status.is-success {
	background: #eef7f0;
	border: 1px solid #b9dfc3;
	color: #1f5d2e;
}

.contact-page__form-status.is-error {
	background: #fff4f4;
	border: 1px solid #f0c2c2;
	color: #8a1f1f;
}

/* Honeypot: visuell versteckt, fuer Screenreader ausgeblendet */
.contact-page__honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

.contact-page__form-fields {
	position: relative;
}

.contact-page__map {
	padding: 0;
	overflow: hidden;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

.contact-page__map iframe {
	display: block;
	width: 100%;
	height: 320px;
	border-radius: 12px;
}

.contact-page__info {
	-ms-flex-negative: 0;
	flex-shrink: 0;
}

.contact-page__info-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.contact-page__info-list li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 16px;
	margin-bottom: 22px;
}

.contact-page__info-list li:last-child {
	margin-bottom: 0;
}

.contact-page__info-list i {
	font-size: 22px;
	color: #006699;
	width: 28px;
	-ms-flex-negative: 0;
	flex-shrink: 0;
	margin-top: 2px;
}

.contact-page__info-list strong {
	display: block;
	margin-bottom: 4px;
	font-size: 15px;
	font-weight: 700;
	color: #111111;
}

.contact-page__info-list p {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: #333333;
}

.contact-page__info-list a {
	color: #333333;
	text-decoration: none;
}

.contact-page__info-list a:hover {
	color: #006699;
	text-decoration: underline;
}

@media only screen and (max-width: 991px) {
	.contact-hero.contact-hero--techno {
		padding-bottom: 13px;
	}

	.contact-page {
		padding-bottom: 55px;
	}
}

@media only screen and (min-width: 992px) {
	.contact-page__grid {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		align-items: stretch;
		gap: 28px;
	}

	.contact-page__form-col {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-flex: 1;
		-ms-flex: 1 1 52%;
		flex: 1 1 52%;
		max-width: 52%;
	}

	.contact-page__form-col .contact-page__card {
		width: 100%;
	}

	.contact-page__aside-col {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-flex: 1;
		-ms-flex: 1 1 48%;
		flex: 1 1 48%;
		max-width: 48%;
		min-height: 100%;
	}

	.contact-page__map {
		-webkit-box-flex: 1;
		-ms-flex: 1 1 auto;
		flex: 1 1 auto;
		min-height: 0;
	}

	.contact-page__map iframe {
		height: 100%;
		min-height: 280px;
	}
}

@media only screen and (max-width: 575px) {
	.contact-page__card {
		padding: 20px;
	}

	.contact-page__row--half {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		gap: 0;
	}
}

/*--------------------------------- Responsive Media Quaries -----------------------------*/

@media only screen and (min-width: 1200px) {
	.container {
		max-width: 1170px;
	}
}

/* Medium Device = 1200px */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
	.header__menu ul li {
		margin-right: 18px;
	}
	.header__menu {
		margin-right: 30px;
	}
	.service__item {
		padding: 40px 30px 30px 40px;
	}
	.discography__item__text a {
		margin-right: 0;
		text-align: center;
		margin-bottom: 10px;
	}
}

/* Tablet Device = 768px */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	.hero__bg-image {
		-o-object-position: 50% 50% !important;
		object-position: 50% 50% !important;
	}
	/* Logo groesser und auf einer Linie mit der Navigation */
	.header .container > .row:first-child {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
	}
	.header__logo {
		padding: 26px 0;
		overflow: visible;
	}
	.header__logo img {
		width: clamp(165px, 20vw, 200px);
		max-width: none;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
		-webkit-transform-origin: left center;
		-ms-transform-origin: left center;
		transform-origin: left center;
	}
	.header__menu {
		margin-right: 0;
		padding: 26px 0;
	}
	.header__menu ul li {
		margin-right: 15px;
	}
	.header__right__social {
		display: none;
	}
	.event .section-title:after {
		width: 560px;
	}
	.track__all {
		text-align: left;
		margin-bottom: 40px;
	}
	.track__content {
		margin-bottom: 40px;
	}
	.track__pic img {
		width: 100%;
		max-width: 460px;
		height: auto;
		margin: 0 auto;
	}
	.footer {
		height: auto;
	}
	.about.about--page .about__text {
		padding-top: 30px;
	}
	.discography__item__text a {
		margin-right: 0;
		text-align: center;
		margin-bottom: 10px;
	}
	.blog__sidebar {
		padding-top: 50px;
	}
	.contact__address {
		margin-bottom: 40px;
	}
	.footer__address::before {
		display: none;
	}
	.footer__address::after {
		display: none;
	}
	.about__text .section-title:has(.section-title__bg),
	.track .section-title:has(.section-title__bg) {
		min-height: 0;
	}
	.track .section-title:has(.section-title__bg) > h2 {
		white-space: nowrap;
	}
}

/* Wide Mobile = 480px */

@media only screen and (max-width: 767px) {
	.hero__bg-image {
		-o-object-position: 50% 50% !important;
		object-position: 50% 50% !important;
	}
	.hero {
		padding-top: 190px;
		padding-bottom: 200px;
	}
	.event .section-title:after {
		display: none;
	}
	.track__all {
		text-align: left;
		margin-bottom: 40px;
	}
	.track__content {
		margin-bottom: 40px;
	}
	.track > .container > .row > .p-0 {
		padding-left: 15px !important;
		padding-right: 15px !important;
	}
	.track__pic img {
		height: auto;
	}
	.discography__item__text a {
		margin-right: 0;
		text-align: center;
		margin-bottom: 10px;
	}
	.discography .section-title {
		min-height: 100px;
		margin-bottom: 70px;
		padding: 8px 0 8px;
	}
	.discography .section-title .section-title__bg,
	.discography .section-title h2 + h1 {
		top: auto;
		line-height: 0.92;
	}
	.discography .section-title h1:has(+ .section-title__bg),
	.discography .section-title h2 {
		padding: 0 12px 0;
	}
	.discography .section-title--vinyl h2,
	.discography .section-title--vinyl h1:has(+ .section-title__bg) {
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}
	.mediahub .section-title--mediahub {
		min-height: 100px;
		margin-bottom: 55px;
		padding: 8px 0 8px;
	}
	.mediahub .section-title--mediahub > .section-title__bg {
		top: auto;
		line-height: 0.92;
	}
	.mediahub .section-title--mediahub > h1 {
		top: auto;
		font-family: "Rajdhani", sans-serif;
		color: #111111;
		line-height: 1.2;
		padding: 0 12px 0;
	}
	.about__text .section-title:has(.section-title__bg),
	.track .section-title:has(.section-title__bg) {
		min-height: 0;
	}
	.about__text .section-title:has(.section-title__bg) .section-title__bg,
	.track .section-title:has(.section-title__bg) .section-title__bg {
		white-space: nowrap;
	}
	.about__text .section-title:has(.section-title__bg) > h2,
	.track .section-title:has(.section-title__bg) > h2 {
		box-sizing: border-box;
	}
	.about__text .section-title:has(.section-title__bg) {
		margin-bottom: 28px;
	}
	.blog__sidebar {
		padding-top: 50px;
	}
	.contact__address {
		margin-bottom: 40px;
	}
	.footer {
		height: auto;
	}
	.footer__address::before {
		display: none;
	}
	.footer__address::after {
		display: none;
	}
	.footer__social {
		text-align: left;
	}
	.about.about--page .about__text {
		padding-top: 30px;
	}
	.blog__large__widget ul {
		text-align: center;
	}
	.blog__large__widget .right__widget {
		text-align: center;
	}
	.blog__option__btn {
		margin-bottom: 30px;
	}
	.blog__details__form form .input__list,
	.contact__form form .input__list {
		margin-right: 0;
		overflow: visible;
	}
	.blog__details__form form .input__list input,
	.contact__form form .input__list input {
		width: 100%;
		margin-right: 0;
	}
	.header__nav {
		display: none;
	}
	body.mobile-nav-open .header {
		z-index: 10002;
	}
	.header .container {
		position: relative;
	}
	.header .row > [class*="col-"]:first-child {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}
	.header .row > [class*="col-"]:last-child {
		display: none;
	}
	.header__logo {
		padding: 14px 52px 10px 15px;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: flex-start;
	}
	.header__logo a {
		margin: 0;
	}
	.header__logo img {
		width: clamp(148px, 44vw, 230px);
		max-width: none;
		margin: 0;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
		-webkit-transform-origin: left center;
		-ms-transform-origin: left center;
		transform-origin: left center;
	}
	.slicknav_btn {
		position: fixed;
		right: 15px;
		top: 16px;
		margin: 0;
		border-radius: 0;
		padding: 8px;
		float: none;
		background: transparent !important;
		-webkit-box-shadow: none;
		box-shadow: none;
		text-shadow: none;
		z-index: 10001;
	}
	.slicknav_menu .slicknav_menutxt {
		display: none !important;
	}
	.slicknav_menu .slicknav_icon {
		float: none;
		margin: 0;
		width: 26px;
		height: 18px;
	}
	.slicknav_menu .slicknav_icon-bar {
		width: 26px;
		height: 2px;
		background-color: #ffffff;
		-webkit-box-shadow: none;
		box-shadow: none;
		-webkit-border-radius: 0;
		border-radius: 0;
		-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
		transition: transform 0.3s ease, opacity 0.3s ease;
	}
	.slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar {
		margin-top: 6px;
	}
	.slicknav_btn.slicknav_open .slicknav_icon-bar:nth-child(1) {
		-webkit-transform: translateY(8px) rotate(45deg);
		-ms-transform: translateY(8px) rotate(45deg);
		transform: translateY(8px) rotate(45deg);
	}
	.slicknav_btn.slicknav_open .slicknav_icon-bar:nth-child(2) {
		opacity: 0;
	}
	.slicknav_btn.slicknav_open .slicknav_icon-bar:nth-child(3) {
		-webkit-transform: translateY(-8px) rotate(-45deg);
		-ms-transform: translateY(-8px) rotate(-45deg);
		transform: translateY(-8px) rotate(-45deg);
	}
	#mobile-menu-wrap {
		height: 0;
		overflow: visible;
	}
	.slicknav_nav {
		position: fixed;
		top: 58px;
		right: 0;
		left: auto;
		width: auto;
		min-width: 220px;
		max-width: min(280px, 85vw);
		height: auto !important;
		min-height: 0 !important;
		max-height: none;
		margin: 0;
		padding: 6px 0;
		background: #006699;
		overflow: visible !important;
		z-index: 10000;
		-webkit-box-shadow: -4px 8px 24px rgba(0, 0, 0, 0.18);
		box-shadow: -4px 8px 24px rgba(0, 0, 0, 0.18);
		-webkit-transform: translateX(100%);
		-ms-transform: translateX(100%);
		transform: translateX(100%);
		-webkit-transition: -webkit-transform 0.35s ease;
		-o-transition: transform 0.35s ease;
		transition: transform 0.35s ease;
	}
	body.mobile-nav-open .slicknav_nav {
		height: auto !important;
		min-height: 0 !important;
		overflow: visible !important;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
	}
	.slicknav_menu {
		background: transparent;
		padding: 0;
		display: block;
	}
	.slicknav_nav ul {
		margin: 0;
		padding: 0;
	}
	.slicknav_nav .slicknav_arrow {
		display: none;
	}
	.slicknav_nav ul ul {
		display: none !important;
	}
	.slicknav_nav li {
		margin: 0;
	}
	.slicknav_nav .slicknav_row,
	.slicknav_nav a {
		padding: 14px 28px;
		margin: 0;
		font-size: 16px;
		font-weight: 700;
		text-transform: uppercase;
		color: #ffffff;
		background: transparent;
	}
	.slicknav_nav a:hover,
	.slicknav_nav .slicknav_row:hover {
		border-radius: 0;
		background: rgba(0, 0, 0, 0.12);
		color: #ffffff;
	}
	.slicknav_nav li.active > a,
	.slicknav_nav li.active > .slicknav_row {
		background: rgba(0, 0, 0, 0.12);
		color: #ffffff;
	}
	.service__item {
		height: auto;
	}
}

/* Small Device = 320px */

@media only screen and (max-width: 479px) {
	.hero__bg-image {
		-o-object-position: 50% 50% !important;
		object-position: 50% 50% !important;
	}

	/* Legal-Seiten: langer Titel (z. B. Datenschutzerklärung) auf schmalen Displays */
	.legal-page__intro h1 {
		font-size: clamp(18px, 6.2vw, 24px);
		line-height: 1.3;
		overflow-wrap: break-word;
		-webkit-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
		padding: 0 8px;
	}

	.section-title h1:not(:has(+ .section-title__bg)) {
		top: -40px;
		font-size: 79px;
		line-height: 0.8;
	}

	.about__text .section-title:has(.section-title__bg),
	.track .section-title:has(.section-title__bg) {
		min-height: 0;
	}

	.track .section-title:has(.section-title__bg) > h2 {
		white-space: nowrap;
	}

	.about-tabs .section-title h1 {
		top: auto;
		font-size: 42px;
		line-height: 1.2;
	}

	.studio .section-title > .section-title__bg {
		top: auto;
		line-height: 0.92;
	}

	.studio .section-title > h1 {
		top: auto;
		font-family: "Rajdhani", sans-serif;
		color: #111111;
		line-height: 1.2;
		padding: 0 10px 0;
	}

	.contact-hero .section-title > .section-title__bg {
		top: auto;
		line-height: 0.92;
	}

	.contact-hero .section-title > h1 {
		top: auto;
		font-family: "Rajdhani", sans-serif;
		color: #111111;
		line-height: 1.2;
		padding: 0 10px 0;
	}

	.discography .section-title {
		min-height: 88px;
		margin-bottom: 55px;
		padding: 8px 0 6px;
	}
	.discography .section-title .section-title__bg,
	.discography .section-title h2 + h1 {
		top: auto;
		line-height: 0.92;
	}
	.discography .section-title h1:has(+ .section-title__bg),
	.discography .section-title h2 {
		padding: 0 10px 0;
	}
	.discography .section-title--vinyl h2,
	.discography .section-title--vinyl h1:has(+ .section-title__bg) {
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
	}
	.mediahub .section-title--mediahub {
		min-height: 88px;
		margin-bottom: 50px;
		padding: 8px 0 6px;
	}
	.mediahub .section-title--mediahub > .section-title__bg {
		top: auto;
		line-height: 0.92;
	}
	.mediahub .section-title--mediahub > h1 {
		top: auto;
		font-family: "Rajdhani", sans-serif;
		color: #111111;
		line-height: 1.2;
		padding: 0 10px 0;
	}
	.hero__text h1 {
		font-size: 70px;
	}
	.track__pic {
		text-align: center;
	}
	.track__pic img {
		max-width: 340px;
		margin: 0 auto;
	}
	.videos {
		padding-bottom: 0;
	}
	.service__item {
		height: auto;
		padding: 40px 40px 40px 40px;
	}
	.blog__large__text {
		padding: 30px 20px 0;
	}
	.blog__large__widget {
		margin: 0;
	}
	.blog__details__tags a {
		margin-bottom: 10px;
	}
}

/* Overlay-Titel + Events: eine fluide Skalierung bis 991px (keine Sprünge bei 426px) */
@media only screen and (max-width: 991px) {
	:root {
		--title-overlay-bg-size: clamp(3.25rem, 0.75rem + 12.5vw, 5.625rem);
		--title-overlay-fg-size: clamp(1.375rem, 0.65rem + 6.2vw, 2.25rem);
		--title-overlay-bg-music-production: clamp(3rem, 0.65rem + 11.5vw, 5.125rem);
		--title-overlay-pad-bottom: clamp(6px, 0.35rem + 0.6vw, 8px);
	}

	.event {
		--event-title-size: clamp(1.375rem, 0.5rem + 5vw, 2.625rem);
	}

	.section-title:has(.section-title__bg) {
		justify-items: center;
		align-items: end;
		min-height: auto;
		padding: clamp(3px, 0.5vw, 4px) 0 0;
		margin-bottom: calc(40px + var(--title-overlay-pad-bottom));
	}

	.section-title:has(.section-title__bg) .section-title__bg {
		align-self: end;
		font-size: var(--title-overlay-bg-size);
		line-height: 0.92;
	}

	.section-title:has(.section-title__bg) > h1,
	.section-title:has(.section-title__bg) > h2 {
		align-self: end;
		font-size: var(--title-overlay-fg-size);
		line-height: 1;
		padding: 0 clamp(8px, 2.5vw, 12px);
	}

	.discography .section-title,
	.studio .section-title,
	.mediahub .section-title--mediahub,
	.contact-hero .section-title,
	.about-tabs .section-title {
		justify-items: center;
		align-items: end;
		min-height: auto;
		padding-top: 8px;
		padding-bottom: 0;
	}

	.discography .section-title .section-title__bg,
	.discography .section-title h2 + h1,
	.studio .section-title > .section-title__bg,
	.contact-hero .section-title > .section-title__bg,
	.mediahub .section-title--mediahub > .section-title__bg,
	.about-tabs .section-title .section-title__bg {
		align-self: end;
	}

	.discography .section-title h1:has(+ .section-title__bg),
	.discography .section-title h2,
	.studio .section-title > h1,
	.contact-hero .section-title > h1,
	.mediahub .section-title--mediahub > h1,
	.about-tabs .section-title h1 {
		align-self: end;
		line-height: 1;
	}

	.track .section-title:has(.section-title__bg) {
		justify-items: start;
		align-items: end;
	}

	.track.spad .section-title:has(.section-title__bg) {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		justify-items: center;
		align-items: end;
		width: 100%;
		text-align: center;
	}

	.track.spad .section-title:has(.section-title__bg) .section-title__bg {
		justify-self: center;
		text-align: center;
	}

	.track.spad .section-title:has(.section-title__bg) > h2 {
		position: relative;
		justify-self: center;
		left: auto;
		right: auto;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		text-align: center;
	}

	.track.spad .track__all {
		text-align: center;
	}

	.about.spad .about__text .section-title:has(.section-title__bg) {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		justify-items: center;
		align-items: end;
		width: 100%;
		text-align: center;
	}

	.about.spad .about__text .section-title:has(.section-title__bg) .section-title__bg {
		grid-column: 1;
		grid-row: 1;
		justify-self: center;
		text-align: center;
	}

	.about.spad .about__text .section-title:has(.section-title__bg) > h2 {
		position: relative;
		grid-column: 1;
		grid-row: 1;
		justify-self: center;
		left: auto;
		right: auto;
		width: -webkit-max-content;
		width: -moz-max-content;
		width: max-content;
		text-align: center;
	}

	.music-production .section-title .section-title__bg {
		font-size: var(--title-overlay-bg-music-production);
	}

	.about-tabs .section-title .section-title__bg {
		font-size: var(--title-overlay-bg-size);
	}

	.studio .section-title > .section-title__bg,
	.contact-hero .section-title > .section-title__bg {
		font-size: var(--title-overlay-bg-size);
		line-height: 0.92;
	}

	.studio .section-title > h1,
	.contact-hero .section-title > h1 {
		font-size: var(--title-overlay-fg-size);
	}

	.discography .section-title .section-title__bg,
	.discography .section-title h2 + h1 {
		font-size: var(--title-overlay-bg-size);
		line-height: 0.92;
	}

	.discography .section-title h1:has(+ .section-title__bg),
	.discography .section-title h2 {
		font-size: var(--title-overlay-fg-size);
	}

	.mediahub .section-title--mediahub > .section-title__bg {
		font-size: var(--title-overlay-bg-size);
		line-height: 0.92;
	}

	.mediahub .section-title--mediahub > h1 {
		font-size: var(--title-overlay-fg-size);
	}

	.about__text .section-title:has(.section-title__bg),
	.track .section-title:has(.section-title__bg) {
		min-height: 0;
	}
}

@media only screen and (max-width: 425px) {
	/* Coming-Soon-Pille: bei 320px weiter unten (~77%), sanft Richtung 61% bei 425px */
	.track__pic .track__badge {
		top: clamp(61%, 66% + 3.5vw, 77%);
	}

	.event__slider.owl-carousel .owl-nav button {
		font-size: 20px;
	}

	.header__logo {
		padding: 12px 48px 8px 15px;
	}

	.header__logo img {
		width: clamp(136px, 46vw, 200px);
	}

	.slicknav_btn {
		top: 14px;
	}
}

/* Index einspaltig: Abstand Music Production → Footer (spät, hohe Spezifität) */
@media only screen and (max-width: 991px) {
	section.music-production.spad {
		padding-bottom: 10px;
	}

	section.music-production.spad + footer.footer.footer--normal.spad {
		margin-top: -40px;
	}
}

/*---------------------
  Cookie Consent (DSG / Opt-in Drittdienste)
-----------------------*/

.cookie-consent {
	position: fixed;
	inset: 0;
	z-index: 10050;
	pointer-events: none;
}

.cookie-consent:not([hidden]) {
	pointer-events: auto;
}

.cookie-consent__banner[hidden],
.cookie-consent__settings[hidden] {
	display: none !important;
}

.cookie-consent__banner {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10051;
	padding: 16px;
	background: rgba(255, 255, 255, 0.98);
	border-top: 1px solid #e8e8e8;
	-webkit-box-shadow: 0 -8px 28px rgba(0, 0, 0, 0.12);
	box-shadow: 0 -8px 28px rgba(0, 0, 0, 0.12);
}

.cookie-consent__banner-inner {
	max-width: 1170px;
	margin: 0 auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	gap: 20px;
}

.cookie-consent__banner-text {
	-webkit-box-flex: 1;
	-ms-flex: 1 1 auto;
	flex: 1 1 auto;
	min-width: 0;
}

.cookie-consent__title {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: 700;
	color: #111111;
}

.cookie-consent__banner-text p:last-child {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
	color: #333333;
}

.cookie-consent__banner-text a {
	color: #006699;
	text-decoration: underline;
}

.cookie-consent__banner-actions {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-flex: 0;
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	gap: 10px;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
}

.cookie-consent__btn {
	display: inline-block;
	border: none;
	border-radius: 8px;
	padding: 12px 18px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	cursor: pointer;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	-webkit-transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	-o-transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.cookie-consent__btn--primary {
	background: #006699;
	color: #ffffff;
}

.cookie-consent__btn--primary:hover {
	background: #005580;
}

.cookie-consent__btn--ghost {
	background: #ffffff;
	color: #111111;
	border: 2px solid #006699;
}

.cookie-consent__btn--ghost:hover {
	background: #f5f9fb;
}

.cookie-consent__btn--text {
	background: transparent;
	color: #006699;
	padding-left: 8px;
	padding-right: 8px;
	text-decoration: underline;
}

.cookie-consent__settings {
	position: fixed;
	inset: 0;
	z-index: 10052;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding: 20px;
	background: rgba(0, 0, 0, 0.45);
}

.cookie-consent__settings-panel {
	width: 100%;
	max-width: 560px;
	max-height: min(90vh, 720px);
	overflow: auto;
	padding: 28px;
	border-radius: 12px;
	background: #ffffff;
	border: 1px solid #e8e8e8;
	-webkit-box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18);
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18);
}

.cookie-consent__settings-lead {
	margin: 0 0 20px;
	font-size: 14px;
	line-height: 1.55;
	color: #333333;
}

.cookie-consent__category-list {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
}

.cookie-consent__category {
	padding: 16px 0;
	border-top: 1px solid #e8e8e8;
}

.cookie-consent__category:first-child {
	border-top: none;
	padding-top: 0;
}

.cookie-consent__category-head {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 8px;
}

.cookie-consent__category p {
	margin: 0;
	font-size: 13px;
	line-height: 1.55;
	color: #333333;
}

.cookie-consent__badge {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	background: #eef4f7;
	color: #006699;
}

.cookie-consent__toggle-wrap {
	position: relative;
	display: inline-block;
	width: 48px;
	height: 26px;
	-ms-flex-negative: 0;
	flex-shrink: 0;
}

.cookie-consent__toggle {
	position: absolute;
	opacity: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	cursor: pointer;
	z-index: 1;
}

.cookie-consent__toggle-ui {
	position: absolute;
	inset: 0;
	border-radius: 999px;
	background: #cccccc;
	-webkit-transition: background-color 0.2s ease;
	-o-transition: background-color 0.2s ease;
	transition: background-color 0.2s ease;
}

.cookie-consent__toggle-ui::after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #ffffff;
	-webkit-transition: -webkit-transform 0.2s ease;
	transition: transform 0.2s ease;
}

.cookie-consent__toggle:checked + .cookie-consent__toggle-ui {
	background: #006699;
}

.cookie-consent__toggle:checked + .cookie-consent__toggle-ui::after {
	-webkit-transform: translateX(22px);
	-ms-transform: translateX(22px);
	transform: translateX(22px);
}

.cookie-consent__settings-actions {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	gap: 10px;
}

.cookie-consent__map-fallback {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	gap: 16px;
	min-height: 320px;
	padding: 28px 24px;
	text-align: center;
	background: #f7f9fa;
}

.cookie-consent__map-fallback-text {
	margin: 0;
	max-width: 420px;
	font-size: 14px;
	line-height: 1.6;
	color: #333333;
}

.cookie-consent__map-fallback-actions {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 12px;
}

.cookie-consent__map-link {
	font-size: 14px;
	color: #006699;
	text-decoration: underline;
}

.cookie-consent__map-accept {
	border: none;
	border-radius: 8px;
	cursor: pointer;
}

@media only screen and (max-width: 767px) {
	.cookie-consent__banner-inner {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		align-items: stretch;
	}

	.cookie-consent__banner-actions {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}

	.cookie-consent__btn {
		width: 100%;
		text-align: center;
	}
}