/**
 * Magazinansicht „Aktuelles".
 *
 * Alle Werte kommen aus tokens.css des Themes. Keine eigenen Farben,
 * Radien oder Schriftgrößen mehr.
 */

.mdbr-news-magazine {
	/* Steckt bereits in .mdbr-shell — den Satzspiegel nicht doppelt anlegen. */
	width: 100%;
	margin: 0 auto var(--s-5);
	padding: var(--s-4);
	border: 1px solid var(--c-line);
	border-radius: var(--r-lg);
	background: var(--c-paper);
	box-shadow: var(--e-rest);
	color: var(--c-ink);
}
.mdbr-news-magazine * { box-sizing: border-box; }

.mdbr-news-magazine-head h1 {
	margin: 0 0 var(--s-4);
	font-family: var(--f-display);
	font-size: var(--t-display-1);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -.04em;
}

/* --- Werkzeugleiste --------------------------------------------------- */
.mdbr-news-magazine-tools {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
	gap: var(--s-4);
	align-items: center;
	margin-bottom: var(--s-4);
	padding-bottom: var(--s-3);
	border-bottom: 1px solid var(--c-line);
}
.mdbr-news-magazine-categories { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.mdbr-news-magazine-categories a {
	min-height: 40px;
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 0 15px;
	border: 1px solid var(--c-line);
	border-radius: 999px;
	background: var(--c-paper);
	color: var(--c-ink);
	font-size: 14px; font-weight: 600;
	transition: border-color .18s ease, background .18s ease, color .18s ease;
}
.mdbr-news-magazine-categories a:hover { border-color: #adc0dd; }
.mdbr-news-magazine-categories a.is-active {
	background: var(--c-navy); border-color: var(--c-navy); color: #fff;
}
.mdbr-news-magazine-categories .dashicons { width: auto; height: auto; font-size: 17px; }

.mdbr-news-magazine-search {
	min-height: 48px;
	display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center; gap: var(--s-2);
	padding: 0 7px 0 14px;
	border: 1px solid var(--c-line);
	border-radius: var(--r-md);
	background: var(--c-paper);
	transition: border-color .18s ease, box-shadow .18s ease;
}
.mdbr-news-magazine-search:focus-within {
	border-color: var(--c-blue);
	box-shadow: 0 0 0 3px rgba(31, 95, 224, .14);
}
.mdbr-news-magazine-search > .dashicons { color: var(--c-muted); }
.mdbr-news-magazine-search input {
	width: 100%; min-width: 0; padding: 11px 0;
	border: 0 !important; outline: 0;
	background: transparent; box-shadow: none !important;
	color: var(--c-ink); font: inherit;
}
.mdbr-news-magazine-search button {
	width: 36px; height: 36px;
	display: grid; place-items: center; padding: 0;
	border: 0; border-radius: var(--r-sm);
	background: var(--c-blue); color: #fff;
	transition: background .18s ease;
}
.mdbr-news-magazine-search button:hover { background: var(--c-blue-hover); }
.mdbr-news-magazine-search button .dashicons { width: auto; height: auto; font-size: 18px; }

/* --- Aufmacher --------------------------------------------------------- */
.mdbr-news-featured {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
	/* Feste Höhe ist Absicht: Ohne sie diktiert ein Hochformat-Plakat die
	   Zeilenhöhe — der Aufmacher wurde damit über 1000 px hoch. */
	height: clamp(320px, 27vw, 400px);
	overflow: hidden;
	border: 1px solid var(--c-line);
	border-radius: var(--r-md);
	background: var(--c-paper);
	box-shadow: var(--e-rest);
	transition: border-color .18s ease, box-shadow .18s ease;
}
.mdbr-news-featured:hover { border-color: #adc0dd; box-shadow: var(--e-card); }
.mdbr-news-featured-image,
.mdbr-news-magazine-card-image { display: block; overflow: hidden; background: #e3ebf7; }
.mdbr-news-featured-image { height: 100%; min-height: 0; }
.mdbr-news-featured-image img,
.mdbr-news-magazine-card-image img {
	width: 100%; height: 100%; display: block;
	object-fit: cover; object-position: center top;
	transition: transform .5s ease;
}
.mdbr-news-featured:hover .mdbr-news-featured-image img,
.mdbr-news-magazine-card:hover .mdbr-news-magazine-card-image img { transform: scale(1.03); }

.mdbr-news-image-placeholder {
	width: 100%; height: 100%; min-height: 200px;
	display: grid; place-items: center;
	background: linear-gradient(145deg, var(--c-blue-soft), #d7e5ff);
	color: var(--c-blue);
}
.mdbr-news-image-placeholder .dashicons { width: auto; height: auto; font-size: 48px; }

.mdbr-news-featured-copy {
	display: flex; flex-direction: column;
	align-items: flex-start; justify-content: center;
	padding: var(--s-5) var(--s-4);
}

/* Pillen: Farbe nach Bedeutung, nicht nach Position im Raster.
   Der Aufmacher trägt das Signal, alle übrigen Karten sind gleichrangig. */
.mdbr-news-featured-label,
.mdbr-news-card-pill {
	display: inline-flex; align-items: center;
	padding: 4px 9px; border-radius: var(--r-sm);
	font-family: var(--f-display); font-size: var(--t-label); font-weight: 700;
	letter-spacing: .06em; text-transform: uppercase;
	background: var(--c-blue-soft); color: var(--c-blue);
}
.mdbr-news-featured-label { background: var(--c-signal-soft); color: var(--c-signal); }

.mdbr-news-featured-copy time,
.mdbr-news-magazine-card-copy time {
	display: block; margin-top: 12px;
	color: var(--c-muted); font-size: 13.5px; font-variant-numeric: tabular-nums;
}
.mdbr-news-featured-copy h2 {
	margin: 12px 0;
	display: -webkit-box; overflow: hidden;
	-webkit-box-orient: vertical; -webkit-line-clamp: 3;
	font-family: var(--f-display);
	font-size: var(--t-display-2);
	font-weight: 700; line-height: 1.12; letter-spacing: -.03em;
}
.mdbr-news-featured-copy h2 a,
.mdbr-news-magazine-card h3 a { color: var(--c-ink); }
.mdbr-news-featured:hover h2 a,
.mdbr-news-magazine-card:hover h3 a { color: var(--c-blue); }
.mdbr-news-featured-copy p,
.mdbr-news-magazine-card-copy p { margin: 0; color: var(--c-muted); line-height: 1.55; }
.mdbr-news-featured-copy > p {
	display: -webkit-box; overflow: hidden;
	-webkit-box-orient: vertical; -webkit-line-clamp: 3;
	font-size: var(--t-small);
}

.mdbr-news-readmore {
	display: inline-flex; align-items: center; gap: 6px;
	margin-top: var(--s-3);
	color: var(--c-blue); font-size: var(--t-small); font-weight: 600;
}
.mdbr-news-readmore span { font-size: 18px; transition: transform .18s ease; }
.mdbr-news-readmore:hover span { transform: translateX(3px); }

/* --- Kartenraster ------------------------------------------------------ */
.mdbr-news-magazine-grid {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--s-4); margin-top: var(--s-4);
}
.mdbr-news-magazine-card {
	min-width: 0; overflow: hidden;
	border: 1px solid var(--c-line);
	border-radius: var(--r-lg);
	background: var(--c-paper);
	box-shadow: var(--e-rest);
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.mdbr-news-magazine-card:hover {
	border-color: #adc0dd; box-shadow: var(--e-card); transform: translateY(-3px);
}
.mdbr-news-magazine-card-image { aspect-ratio: 16 / 10; height: auto; }
.mdbr-news-magazine-card-copy {
	min-height: 210px;
	display: flex; flex-direction: column; align-items: flex-start;
	padding: var(--s-3);
}
.mdbr-news-magazine-card h3 {
	margin: var(--s-2) 0;
	font-family: var(--f-display); font-size: var(--t-heading);
	font-weight: 700; line-height: 1.25; letter-spacing: -.02em;
}
.mdbr-news-magazine-card-copy p { font-size: 14.5px; }
.mdbr-news-magazine-card .mdbr-news-readmore { margin-top: auto; padding-top: var(--s-3); }

/* --- Blätterung -------------------------------------------------------- */
.mdbr-news-magazine .mdbr-pagination { margin-top: var(--s-4); }
.mdbr-news-magazine .mdbr-pagination ul {
	display: flex; flex-wrap: wrap; justify-content: center;
	gap: var(--s-2); margin: 0; padding: 0; list-style: none;
}
.mdbr-news-magazine .mdbr-pagination a,
.mdbr-news-magazine .mdbr-pagination span {
	min-width: 42px; height: 42px;
	display: grid; place-items: center; padding: 0 12px;
	border: 1px solid var(--c-line); border-radius: var(--r-sm);
	background: var(--c-paper); color: var(--c-ink); font-weight: 600;
}
.mdbr-news-magazine .mdbr-pagination .current {
	background: var(--c-blue); border-color: var(--c-blue); color: #fff;
}

.mdbr-news-magazine .mdbr-empty {
	padding: var(--s-5) var(--s-3); text-align: center;
	border: 1px dashed #c3d1e6; border-radius: var(--r-lg);
	background: #fafcff; color: var(--c-muted);
}

/* --- Umbrüche ---------------------------------------------------------- */
@media (max-width: 1050px) {
	.mdbr-news-magazine-tools { grid-template-columns: 1fr; }
	.mdbr-news-magazine-search { max-width: 520px; }
	.mdbr-news-featured { grid-template-columns: 1fr; height: auto; }
	.mdbr-news-featured-image { height: auto; aspect-ratio: 16 / 9; }
	.mdbr-news-magazine-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
	.mdbr-news-magazine { padding: var(--s-3); border-radius: var(--r-md); }
	.mdbr-news-magazine-categories {
		flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin;
	}
	.mdbr-news-magazine-categories a { flex: 0 0 auto; }
	.mdbr-news-featured-image { aspect-ratio: 3 / 2; }
	.mdbr-news-featured-copy { padding: var(--s-4) var(--s-3); }
	.mdbr-news-magazine-grid { grid-template-columns: 1fr; }
	.mdbr-news-magazine-card-copy { min-height: 0; }
}
