/* ===================================================================
   Barrierefreiheit — eigene Ergaenzungen (m-art medien, 11.09.2026)
   Eingebunden im Root-Template ueber page.includeCSS.martA11y.
   Bewusst eine eigene Datei: custom.scss wird parallel bearbeitet.

   Inhalt:
   1. Sprunglink "Zum Inhalt springen" (WCAG 2.4.1)
   2. Optik-Ausgleich nach Korrektur der Ueberschriftenebenen (WCAG 1.3.1)
   =================================================================== */

/* --- 1. Sprunglink -------------------------------------------------
   Unsichtbar, aber fokussierbar: kein display:none, kein aria-hidden,
   kein visibility:hidden — der Link bleibt in der Tabreihenfolge.
   Sichtbarer Zustand: weiss auf #4c565c = 7,52:1 (WCAG AA verlangt 4,5:1,
   nachgerechnet mit scripts/a11y-kontrast.py).
   Der weisse Ring plus dunkler Aussenring haelt den Kasten auch auf
   weissem und auf #ecf0f1 sichtbar abgegrenzt.                      */
.mart-skiplink {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.mart-skiplink:focus {
	position: fixed;
	top: 1rem;
	left: 1rem;
	z-index: 2000;
	width: auto;
	height: auto;
	overflow: visible;
	clip: auto;
	clip-path: none;
	white-space: normal;
	max-width: calc(100vw - 2rem);
	padding: .75rem 1.5rem;
	border-radius: .25rem;
	background-color: #4c565c;
	color: #ffffff;
	font-weight: 700;
	font-size: 1rem;
	line-height: 1.3;
	text-decoration: underline;
	outline: none;
	box-shadow: 0 0 0 3px #ffffff, 0 0 0 6px #4c565c;
}

/* Sprungziel selbst soll beim Anspringen keinen Rahmen zeigen —
   <main> ist kein Bedienelement, tabindex="-1" dient nur der Fokusuebergabe. */
#main-content:focus {
	outline: none;
}

/* --- 2. Optik-Ausgleich Ueberschriftenebenen ------------------------
   Die folgenden Elemente haben aus Hierarchiegruenden eine hoehere
   Ebene bekommen (siehe db/backups/a11y-header-layout-*.sql).
   Die Schriftgroesse bleibt die alte, damit sich am Layout nichts aendert.
   Getroffen wird ueber die von t3sbootstrap vergebene Klasse
   header-<uid> am umschliessenden <header>; die gilt in DE und EN
   gleichermassen, weil dort die uid des Ursprungsdatensatzes steht. */

/* 2a. Footer-Spaltentitel (c1684, c1686, c4865, c5946): h4 -> h2.
   Hier ist NICHTS auszugleichen — custom.scss setzt fuer den Footer bereits
   #page-footer .mainheader{font-size:1rem}, unabhaengig von der Ebene.
   Die Aenderung ist im Footer also nicht zu sehen. */

/* 2b/2c. Alles Uebrige, was vorher als h4 gerendert wurde, behaelt die
   h4-Groesse. Bootstrap staffelt h4 responsiv — beide Stufen uebernommen.
   2b Karten auf /medizin (h4 -> h2 bzw. h3)
   2c Download-Block auf der JMA-Seite (h4 -> h3)                    */
.header-4788 .mainheader,
.header-2003 .mainheader,
.header-2004 .mainheader,
.header-2005 .mainheader,
.header-5935 .mainheader,
.header-5938 .mainheader,
.header-5612 .mainheader,
.header-5981 .mainheader,
.header-5614 .mainheader,
.header-5616 .mainheader,
.header-934 .mainheader {
	font-size: calc(1.275rem + 0.3vw);
}

@media (min-width: 1200px) {
	.header-4788 .mainheader,
	.header-2003 .mainheader,
	.header-2004 .mainheader,
	.header-2005 .mainheader,
	.header-5935 .mainheader,
	.header-5938 .mainheader,
	.header-5612 .mainheader,
	.header-5981 .mainheader,
	.header-5614 .mainheader,
	.header-5616 .mainheader,
	.header-934 .mainheader {
		font-size: 1.5rem;
	}
}

/* 2d. Aufmacher JMA-Seite: zweite h1 -> h2, Optik bleibt h1.
       Die Unterzeile rutscht dabei von .h2 auf .h3 — hier zurueckgeholt. */
.header-6153 .mainheader {
	font-size: calc(1.375rem + 1.5vw);
}

@media (min-width: 1200px) {
	.header-6153 .mainheader {
		font-size: 2.5rem;
	}
}

.header-6153 .subheader {
	font-size: calc(1.325rem + 0.9vw);
}

@media (min-width: 1200px) {
	.header-6153 .subheader {
		font-size: 2rem;
	}
}

/* 2e. Messe-Karten auf /medizin: h4 -> h3.
   Damit rutscht die Unterzeile von .subheader.h5 auf .subheader.h4 — und die
   Gestaltung in custom.scss greift dort nicht mehr, weil sie an .h5 haengt.
   Die folgenden Regeln holen genau diesen Zustand zurueck.
   ACHTUNG: Werte sind aus custom.scss gespiegelt (.messecard h5.subheader und
   .medizinbody ... .subheader.h5). Wird die Messe-Karten-Gestaltung dort
   geaendert, muss das hier nachgezogen werden. */
.messecard .subheader.h4 {
	margin-top: 10px;
	margin-bottom: 10px;
	padding: 5px;
	background-color: #4c565c;
	color: #fff !important;
	font-size: 1.25rem;
}

.medizinbody .messecard .subheader.h4 {
	background-color: #8ccee3 !important;
}