/* Digital Design Styleguide – Ergänzungen für die WordPress-Version
   (styles.css bleibt unverändert aus input/ übernommen). */

body {
	position: relative;
}

html,
body {
	overflow-x: clip; /* Vollbreite per 100vw ohne horizontalen Scrollbalken */
}

/* Kopf und Navigation stehen im Editor-Inhalt, also innerhalb von .main-content
   (max. 1280px). Im Original lagen sie außerhalb – daher auf volle Breite ziehen. */
.main-content > .page-header,
.main-content > .nav-bar {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* Zurück zum Brand Guide – oben links im blauen Kopf */
.dd-topbar {
	left: 0;
	padding: 24px 32px 0;
	pointer-events: none;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
}

.dd-topbar .container {
	margin: 0 auto;
	max-width: 1280px;
}

.dd-back {
	align-items: center;
	border-radius: 6px;
	color: rgba(255, 255, 255, .75);
	display: inline-flex;
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 600;
	gap: 8px;
	line-height: 1;
	margin-left: -8px;
	padding: 8px;
	pointer-events: auto;
	text-decoration: none;
	transition: color .15s ease, background-color .15s ease;
}

.dd-back svg {
	flex: none;
	transition: transform .15s ease;
}

.dd-back:hover {
	background: rgba(255, 255, 255, .1);
	color: #fff;
}

.dd-back:hover svg {
	transform: translateX(-2px);
}

.dd-back:focus-visible {
	color: #fff;
	outline: 2px solid var(--colour-medical-cyan-light, #20b9d6);
	outline-offset: 2px;
}

@media (max-width: 768px) {
	.dd-topbar {
		padding: 12px 20px 0;
	}

	/* Platz für den Zurück-Link über dem Badge */
	.main-content > .page-header {
		padding-top: 68px;
	}
}

/* Sprachumschalter ist in WordPress ein Link statt eines Buttons */
a.lang-btn {
	display: inline-block;
	line-height: normal;
	text-decoration: none;
}