/*
 * GOLFSTUN.DE Magazin -- Baustein "Weitere Beitraege".
 *
 * Die Kacheln selbst kommen aus golfstunde-mitgliedschaft
 * (assets/magazin-list.css, Klassen .gsm-mag*). Hier steht nur, was dort nicht
 * hingehoert, weil es allein diesen Block betrifft:
 *
 *   1. Die Tabletstufe. magazin-list.css kennt zwei Stufen -- ueber 600 px
 *      (--gsm-cols) und bis 600 px (--gsm-cols-m). Vier Kacheln nebeneinander
 *      sind auf einem 768-px-Tablet rund 170 px breit; fuer die Zielgruppe 50+
 *      zu schmal. Zwischen 601 und 1023 px deshalb zwei Spalten.
 *   2. Abstand und Ueberschrift des Blocks.
 *
 * Klickdummy: docs/klickdummies/magazin-weitere-beitraege-klickdummy.html
 * Angelegt 23.09.2026.
 */

.gsp-wb {
	margin: 40px 0 8px;
}

.gsp-wb__titel {
	font-family: Anton, var(--gs-font-display, inherit), sans-serif;
	font-weight: 400;
	font-size: 26px;
	line-height: 1.2;
	letter-spacing: .01em;
	color: #173753;
	margin: 0 0 18px;
}

/*
 * Kachel ohne Bild. Gemessen am 23.09.2026: Beitragsbild bei 789/789 Beitraegen,
 * 176/199 Glossareintraegen, aber 0/324 Forumsfragen. Die gemeinsame Kartendatei
 * gibt der Bildflaeche aspect-ratio 16/9 und eine dunkle Hintergrundfarbe -- ohne
 * Bild steht dort also ein dunkles Rechteck. Auf Forumsseiten waeren das vier
 * Stueck. Ist die Bildflaeche leer, faellt sie weg; der Titel rueckt nach oben.
 */
.gsp-wb .gsm-mag__thumb:empty {
	display: none;
}

.gsp-wb .gsm-mag__thumb:empty + .gsm-mag__title {
	padding-top: 14px;
	padding-bottom: 14px;
}

/*
 * Tippziel. Ohne Bild ist die Kachel nur noch eine Titelzeile -- gemessen am
 * 23.09.2026 auf /frage/schlaeger/ waren zwei der vier Links 38 px hoch. Die
 * Leitlinie der Uebersichten (Zielgruppe 50+) verlangt mindestens 44 px, und
 * der Link umfasst die ganze Kachel.
 */
.gsp-wb .gsm-mag__link {
	display: flex;
	flex-direction: column;
	min-height: 44px;
	height: 100%; /* das Raster streckt alle Kacheln einer Reihe gleich hoch */
}

/*
 * Gemischte Reihe (Glossar: 176 von 199 haben ein Bild). Das Raster streckt
 * alle Kacheln auf die Hoehe der hoechsten -- gemessen 174 px. Ohne diese Regel
 * klebte der Titel oben und darunter standen 125 px Weiss, die nicht einmal
 * anklickbar waren. Jetzt fuellt der Link die Kachel, und bei Kacheln ohne Bild
 * sitzt der Titel in der Mitte.
 * Kennt ein Browser :has() nicht, bleibt der Titel oben -- unschoen, aber heil.
 */
.gsp-wb .gsm-mag__item:has(.gsm-mag__thumb:empty) .gsm-mag__link {
	justify-content: center;
}

/* Tabletstufe: zwei Spalten statt vier. */
@media (min-width: 601px) and (max-width: 1023px) {
	.gsp-wb .gsm-mag {
		--gsm-cols: 2;
	}
}

@media (max-width: 600px) {
	.gsp-wb {
		margin-top: 32px;
	}
	.gsp-wb__titel {
		font-size: 24px;
	}
}