/* Ergaenzungen zum Theme Assemble.
   Alles hier ist im Pruefbericht entschieden; die Datei wird beim Bauen nach
   /wp-content/uploads/ubl/ubl.css kopiert und in jeder Seite eingebunden.
   Sie laedt als letzte, damit sie das Theme ueberschreiben kann. */

/* --- Barrierefreiheit: Kontraste ------------------------------------------
   Gemessen mit axe-core: #999 auf Weiss ergibt 2,85:1, gefordert sind 4,5:1.
   #767676 ist der hellste Ton, der die Schwelle haelt — die Farbwelt bleibt
   damit so nah am Entwurf wie moeglich. */
footer .edgtf-footer-top .widget.widget_nav_menu a,
footer .edgtf-footer-bottom .widget.widget_nav_menu a,
footer .menu-footer-menu-container a {
	color: #767676;
}
/* Weisse Schrift auf grauem Grund, 10 px fett — zaehlt nicht als grosse
   Schrift, also gilt ebenfalls 4,5:1. Dieselbe Selektor-Genauigkeit wie im
   Theme, damit die Regel greift; unsere Datei laedt danach. */
input.wpcf7-form-control.wpcf7-submit,
.edgtf-btn.edgtf-btn-solid {
	background-color: #6e6e6e;
}

/* --- Hauptueberschrift ----------------------------------------------------
   Der Beitragstitel ist jetzt ein h1 statt eines h2. Das Theme gibt h1 70 px,
   h2 40 px — hier steht die alte Groesse wieder her, damit sich sichtbar
   nichts aendert. */
h1.edgtf-post-title,
h1.entry-title.edgtf-post-title {
	font-size: 40px;
	line-height: 1.3em;
	font-weight: 400;
}

/* Fuer Seiten ohne sichtbaren Titel steht die Hauptueberschrift im Quelltext,
   ohne dass sie das Layout beruehrt. Nicht display:none — das nimmt sie auch
   der Vorlesesoftware. */
.ubl-nurvorlesen {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* Sprunglink: erscheint nur, wenn jemand mit der Tastatur navigiert. */
.ubl-sprunglink {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 10000;
	padding: 12px 20px;
	background: #fff;
	color: #231f20;
	border: 2px solid #231f20;
	font-size: 15px;
	text-decoration: none;
}
.ubl-sprunglink:focus {
	left: 0;
}

/* --- Videos erst auf Klick ------------------------------------------------
   An der Stelle des Players steht zunaechst eine Flaeche mit Titel und
   Hinweis. Erst ein Klick laedt den Player — vorher geht keine Anfrage an
   YouTube oder Vimeo. */
.ubl-video {
	position: relative;
	display: block;
	width: 100%;
	margin: 0 0 25px;
	background: #231f20;
	overflow: hidden;
}
.ubl-video > iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
.ubl-video-start {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 14px;
	width: 100%;
	height: 100%;
	padding: 24px;
	background: none;
	border: 0;
	color: #fff;
	font-family: inherit;
	text-align: center;
	cursor: pointer;
}
.ubl-video-titel {
	font-size: 19px;
	line-height: 1.4;
	font-weight: 400;
	max-width: 36em;
}
.ubl-video-hinweis {
	font-size: 14px;
	line-height: 1.5;
	color: #cfcfcf;
	max-width: 38em;
}
.ubl-video-abspielen {
	display: inline-block;
	padding: 9px 26px;
	border: 1px solid #fff;
	font-size: 12px;
	letter-spacing: .12em;
	text-transform: uppercase;
}
.ubl-video-start:hover .ubl-video-abspielen,
.ubl-video-start:focus .ubl-video-abspielen {
	background: #fff;
	color: #231f20;
}

/* Die Pfeile der Bildergalerien baut owl.carousel als <div>. ubl.js gibt
   ihnen role="button" und tabindex, damit sie auch mit der Tastatur zu
   bedienen sind — sichtbar bleibt der Umriss nur beim Tabben. */
.owl-prev:focus-visible,
.owl-next:focus-visible {
	outline: 2px solid #231f20;
	outline-offset: 2px;
}