/**
 * Marktplatz Journal — Informations-Blog auf Marketing-Shell.
 */

body.solumondo-app.solumondo-page-journal .solumondo-mkt-shell--journal .solumondo-section__header {
	max-width: min(100%, 40rem);
}

body.solumondo-app .solumondo-journal-entries {
	display: flex;
	flex-direction: column;
	gap: clamp(0.85rem, 0.75rem + 0.5vw, 1.15rem);
	width: 100%;
	max-width: min(100%, 44rem);
	margin-inline: auto;
}

body.solumondo-app .solumondo-journal-entry {
	display: grid;
	gap: 0.55rem;
	padding: clamp(1rem, 0.85rem + 0.45vw, 1.3rem) clamp(1.05rem, 0.9rem + 0.5vw, 1.4rem);
	border-radius: 1.05rem;
	background: linear-gradient(165deg, #f5f9ff 0%, #ffffff 100%);
	border: 1px solid color-mix(in srgb, var(--solumondo-navy, #0c1726) 18%, white);
	box-shadow: 0 10px 26px color-mix(in srgb, var(--solumondo-navy, #0c1726) 8%, transparent);
	text-align: center;
}

body.solumondo-app .solumondo-journal-entry--accent {
	background: linear-gradient(155deg, color-mix(in srgb, var(--solumondo-orange, #ff6a00) 12%, white) 0%, #fff8f1 100%);
	border-color: color-mix(in srgb, var(--solumondo-orange, #ff6a00) 42%, white);
}

body.solumondo-app .solumondo-journal-entry .solumondo-kicker {
	margin: 0;
}

body.solumondo-app .solumondo-journal-entry h3 {
	margin: 0;
	color: var(--solumondo-navy, #0c1726) !important;
	-webkit-text-fill-color: var(--solumondo-navy, #0c1726) !important;
	font-size: clamp(1.02rem, 0.96rem + 0.35vw, 1.28rem);
	font-weight: 800;
	line-height: 1.28;
}

body.solumondo-app .solumondo-journal-entry p {
	margin: 0 auto;
	max-width: 58ch;
	color: var(--solumondo-text-muted, #4a5d75) !important;
	-webkit-text-fill-color: var(--solumondo-text-muted, #4a5d75) !important;
	line-height: 1.58;
	font-size: clamp(0.9rem, 0.86rem + 0.2vw, 0.98rem);
}

body.solumondo-app.solumondo-page-journal .solumondo-mkt-highlight {
	max-width: min(100%, 44rem);
	margin-inline: auto;
}

body.solumondo-app.solumondo-page-journal .solumondo-mkt-steps {
	max-width: min(100%, 46rem);
	margin-inline: auto;
}

/* Feature-Grid: letzte Zeile (z. B. 2 Karten) auf Desktop mittig */
@media (min-width: 900px) {
	body.solumondo-app.solumondo-page-journal .solumondo-mkt-features {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: stretch;
		gap: clamp(0.85rem, 1.5vw, 1rem);
		width: 100%;
		max-width: min(100%, 72rem);
		margin-inline: auto;
	}

	body.solumondo-app.solumondo-page-journal .solumondo-mkt-features .solumondo-mkt-feature {
		flex: 0 1 calc(25% - 0.75rem);
		width: calc(25% - 0.75rem);
		min-width: min(14.5rem, 100%);
		max-width: calc(25% - 0.75rem);
		box-sizing: border-box;
	}
}

@media (min-width: 900px) and (max-width: 1099px) {
	body.solumondo-app.solumondo-page-journal .solumondo-mkt-features .solumondo-mkt-feature {
		flex: 0 1 calc(33.333% - 0.67rem);
		width: calc(33.333% - 0.67rem);
		max-width: calc(33.333% - 0.67rem);
	}
}

/* CTA + Aktionszeilen: zwei Buttons auf Desktop mittig */
body.solumondo-app.solumondo-page-journal .solumondo-mkt-shell .solumondo-mkt-cta {
	width: 100%;
	max-width: min(100%, 52rem);
	margin-inline: auto;
	text-align: center;
}

body.solumondo-app.solumondo-page-journal .solumondo-mkt-shell .solumondo-mkt-cta .solumondo-actions,
body.solumondo-app.solumondo-page-journal .solumondo-mkt-shell .solumondo-section .solumondo-actions {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: center !important;
	align-items: center !important;
	align-content: center;
	gap: 0.9rem !important;
	width: 100%;
	max-width: 100%;
	margin-inline: auto !important;
	text-align: center;
}

body.solumondo-app.solumondo-page-journal .solumondo-mkt-shell .solumondo-mkt-cta .solumondo-actions .solumondo-btn {
	flex: 0 1 auto;
	margin-inline: 0;
}

@media (min-width: 768px) {
	body.solumondo-app.solumondo-page-journal .solumondo-mkt-shell .solumondo-mkt-cta .solumondo-actions {
		flex-direction: row !important;
		justify-content: center !important;
	}
}

@media (max-width: 767px) {
	body.solumondo-app .solumondo-journal-entry {
		text-align: left;
	}

	body.solumondo-app .solumondo-journal-entry p {
		margin-inline: 0;
		max-width: none;
	}
}