/*
Theme Name: Architecture 2xB
Description: Child-Theme für 2xb.org auf Basis von Architecture (Goodlayers). Aussehen unverändert; technische Verbesserungen: Seitentitel, responsive Bilder mit Lazy Loading, lokal eingebundene Schriften; Startseiten-Abschnitte.
Template: architecture
Version: 1.3.1
Author: Stefan Paulus
Text Domain: architecture-2xb
*/

/* Das übrige Aussehen kommt aus dem Eltern-Theme, aus style-custom.css und
   den bestehenden Plugin-Einstellungen. Hier nur die neuen Startseiten-Elemente,
   in den Farben und der Schrift der bestehenden Seite. */

:root {
	--twoxb-mono: 'Azeret Mono', ui-monospace, Menlo, Consolas, monospace;
	--twoxb-grey: #878787;
	--twoxb-white: #ffffff;
	--twoxb-line: #1e1e1e;
}

/* Logo-Container (vorher h1, gleiche Abstände) */
div.logo-wrapper .twoxb-logo { margin: 0; }

/* «stefan paulus» über dem Slider – im Stil der Abschnittsüberschriften */
h1.twoxb-name {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 700;
	font-size: 31px;
	line-height: 1.25;
	letter-spacing: 0;
	text-transform: uppercase;
	color: #0f0f0f;
	background-color: #f9f9f9;
	text-align: center;
	margin: 0 20px 20px;
	padding: 0;
}

/* Abschnitte: Aufbau und Stil kommen vom Theme wie auf /sound/ */
.twoxb-home .twoxb-block { float: none; width: auto; margin-left: 0; margin-right: 0; }

/* VIDEO (Zwei-Klick) im Format der Bildkacheln */
.twoxb-video { position: relative; width: 100%; aspect-ratio: 380 / 250; background: #000; border: 1px solid var(--twoxb-line); box-sizing: border-box; }
.twoxb-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.twoxb-play {
	all: unset; box-sizing: border-box; cursor: pointer; position: absolute; inset: 0;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
	font-family: var(--twoxb-mono); color: var(--twoxb-grey); text-align: center; padding: 16px;
}
.twoxb-play:hover .twoxb-play-t, .twoxb-play:focus-visible .twoxb-play-t { color: var(--twoxb-white); }
.twoxb-play:focus-visible { outline: 1px solid var(--twoxb-grey); outline-offset: -4px; }
.twoxb-play-t { font-size: 28px; line-height: 1; }
.twoxb-play-n { font-size: 10px; letter-spacing: 0.04em; opacity: 0.7; }

/* Abschnittsüberschrift exakt wie auf /sound/ (im Seiteninhalt sonst von den Inhalts-Schriften überschrieben) */
.twoxb-home .gdl-header-wrapper h3.gdl-header-title {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 31px;
	font-weight: 700;
	line-height: 1.25;
	color: #0f0f0f;
	background-color: #f9f9f9;
}
.twoxb-home .gdl-header-gimmick-wrapper { display: none; }
.twoxb-home .twoxb-block { margin-bottom: 20px; }

/* Kacheltitel klein (Grössen mit den Abschnittsüberschriften getauscht) */
.twoxb-home h2.blog-title, .twoxb-home h2.blog-title a { font-size: 21px; line-height: 1.3; }

/* Video zentriert, volle Breite, 16:9 */
.twoxb-video-full { position: relative; width: 100%; max-width: 960px; margin: 0 auto; aspect-ratio: 16 / 9; background: #000; }
.twoxb-video-full iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.twoxb-video-block h2.twoxb-video-title { text-align: center; margin-top: 14px; }

/* TXT-Titel: 2px grösser, in Grossbuchstaben */
.twoxb-home .twoxb-txt h2.blog-title, .twoxb-home .twoxb-txt h2.blog-title a { font-size: 23px; text-transform: uppercase; }