/*
 * [gs_beitrag] -- Beitragsseite des Magazins (Textbeitrag).
 * Konzept golfstunde-magazin-beitrag-wireframes-2026-09-20.txt (Fassung 10),
 * Masse aus 12.11: Textspalte 720 px (gemessen 73-74 Zeichen je Zeile),
 * Titel ueber die volle Breite, Foto nach dem Einstieg.
 * Farben aus docs/design/golfstun-design-fundament.txt.
 */

.gsb{
	--gsb-spalte:720px;
	--gsb-text:#232323;
	--gsb-grau:#595959;
	--gsb-linie:#e2e2e2;
	--gsb-kenn:#bb274b;
	--gsb-link:#2c7a86;
}

/* ---------------------------------------------------------- Kopf */
.gsb .gsb-krumen,
.gsb .gsb-krumen p{
	font-size:15px;
	line-height:1.5;
	color:var(--gsb-grau);
	margin:0 0 14px;
}
.gsb .gsb-krumen a{ color:var(--gsb-link); text-decoration:none; }

.gsb .gsb-kennzeile{
	font-size:15px;
	font-weight:600;
	line-height:1.2;
	letter-spacing:.07em;
	text-transform:uppercase;
	margin:0 0 8px;
}
.gsb .gsb-kennzeile a{ color:var(--gsb-kenn); text-decoration:none; }

/* Ueberschrift laeuft ueber die volle Inhaltsbreite: sonst bricht sie zu
   frueh um (Rueckmeldung 24.09.2026). Silbentrennung bleibt aus. */
.gsb .gsb-titel{
	font-family:Anton,Impact,"Arial Narrow",sans-serif;
	font-weight:400;
	font-size:44px;
	line-height:1.16;
	color:var(--gsb-text);
	margin:0 0 12px;
	max-width:none;
	hyphens:none;
	text-wrap:balance;
}

.gsb .gsb-meta{
	font-size:16px;
	line-height:1.5;
	color:var(--gsb-grau);
	margin:0 0 16px;
}
.gsb .gsb-meta a{ color:var(--gsb-link); text-decoration:none; }
.gsb .gsb-meta__d,
.gsb .gsb-meta__l,
.gsb .gsb-meta__k{ white-space:nowrap; }
.gsb .gsb-meta__p{ color:#9aa3a8; }

.gsb .gsb-autor{
	display:flex;
	align-items:center;
	gap:12px;
	margin:0 0 22px;
	padding:0 0 16px;
	border-bottom:1px solid var(--gsb-linie);
	font-size:16px;
	max-width:var(--gsb-spalte);
}
.gsb .gsb-autor__bild{
	width:40px;
	height:40px;
	border-radius:50%;
	flex:0 0 auto;
}
/* Seiten-Symbol statt Portraet, wenn die Redaktion als Autor steht */
.gsb .gsb-autor__bild--marke{
	border-radius:8px;
	background:#fff;
	object-fit:contain;
}
.gsb .gsb-autor__name{
	font-weight:600;
	color:var(--gsb-text);
	text-decoration:none;
}
.gsb a.gsb-autor__name{ color:var(--gsb-link); }

/* ------------------------------------------------------- Textspalte */
.gsb .gsb-inhalt{ max-width:var(--gsb-spalte); }
.gsb .gsb-inhalt img{ max-width:100%; height:auto; }
.gsb .gsb-inhalt h2{ margin-top:40px; }

/* Aufmacherfoto: eigenes Format, begrenzt auf 4:3 bis 2:1 (Inline-Stil
   liefert das Verhaeltnis je Bild). */
.gsb .gsb-foto{
	margin:0 0 8px;
	max-width:var(--gsb-spalte);
}
.gsb .gsb-foto__bild{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	border-radius:12px;
}
.gsb .gsb-foto__text{
	font-size:14px;
	line-height:1.5;
	color:var(--gsb-grau);
	margin:8px 0 22px;
}

/* Produktbloecke bleiben in der Textspalte (A-E12 bestaetigt): Bei 720 px
   stehen Bild, Name, Preis und Knopf in EINER Zeile -- gemessen 24.09.2026
   gegen das echte Markup. (Ein Zwischenstand sah sie umbrechen; das lag an
   der Pruefseite ohne Oxygens globales box-sizing:border-box, nicht am
   Plugin.) */

/* --------------------------------------------------- Inhaltsuebersicht */
.gsb .gsb-toc{
	border:1px solid var(--gsb-linie);
	border-radius:12px;
	background:#fcfcfc;
	padding:14px 18px;
	margin:0 0 28px;
	max-width:var(--gsb-spalte);
}
.gsb .gsb-toc__s{
	list-style:none;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:space-between;
	min-height:44px;
	font-weight:600;
	font-size:17px;
}
.gsb .gsb-toc__s::-webkit-details-marker{ display:none; }
.gsb .gsb-toc__s::after{ content:"▾"; color:var(--gsb-link); }
.gsb .gsb-toc__d[open] .gsb-toc__s::after{ content:"▴"; }
.gsb .gsb-toc__l{
	margin:6px 0 0;
	padding-left:22px;
	font-size:18px;
	line-height:32px;
}
.gsb .gsb-toc__l a{ color:var(--gsb-link); text-decoration:none; }
.gsb .gsb-toc__l a:hover,
.gsb .gsb-toc__l a:focus-visible{ text-decoration:underline; }

/* ------------------------------------------------------- Seitenende */
.gsb .gsb-textautor{
	font-size:15px;
	color:var(--gsb-grau);
	margin:0 0 24px;
	max-width:var(--gsb-spalte);
}
.gsb .gsb-ende .gsm-tl{ max-width:var(--gsb-spalte); }

/* ------------------------------------------------------------ Handy */
@media (max-width:760px){
	.gsb{ --gsb-spalte:100%; }
	.gsb .gsb-titel{ font-size:clamp(28px,7.4vw,34px); line-height:1.2; }
	.gsb .gsb-inhalt h2{ margin-top:32px; }
	.gsb .gsb-toc__l{ font-size:17px; line-height:30px; }
}
