body.blog .page_content_wrap {
	background: #FAFAFA;
	padding-top: 0 !important;
	padding-bottom: 86px !important;
	/* overflow-x: clip (not hidden) contains any stray horizontal overflow
	   WITHOUT establishing a scroll container, so it does not break the
	   sticky sidebar below. `hidden` here would silently kill position:sticky. */
	overflow-x: clip;
}

body.blog .content_wrap_fullscreen {
	box-sizing: border-box;
	width: 100%;
	max-width: 1240px;
	margin-right: auto;
	margin-left: auto;
	padding-right: 70px;
	padding-left: 70px;
}

body.blog .content {
	box-sizing: border-box;
	width: auto !important;
	max-width: 100% !important;
	float: none !important;
	padding-right: 0 !important;
	padding-left: 0 !important;
}

body.blog.body_style_fullscreen.sidebar_show [class*="content_wrap"] > .content,
body.blog.body_style_fullwide.sidebar_show [class*="content_wrap"] > .content {
	width: auto !important;
	max-width: 100% !important;
	float: none !important;
	padding-right: 0 !important;
	padding-left: 0 !important;
}

body.blog .mh-blog-hero {
	padding: 86px 0 54px;
}

body.blog.sidebar_show .content_wrap_fullscreen > .mh-blog-hero {
	grid-column: 1 / -1;
}

body.blog .mh-blog-hero__inner {
	max-width: 760px;
}

body.blog .mh-blog-hero__eyebrow {
	margin: 0 0 18px;
	color: #C8A96E;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
}

body.blog .mh-blog-hero h1 {
	margin: 0 0 22px;
	color: #0F1923;
	font-size: 64px;
	line-height: 1;
}

body.blog .mh-blog-hero p:not(.mh-blog-hero__eyebrow) {
	margin: 0;
	max-width: 660px;
	color: #4E565D;
	font-size: 19px;
	line-height: 1.6;
}

body.blog .posts_container.classic_wrap {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: 44px !important;
	width: 100% !important;
	max-width: none !important;
	margin-right: 0 !important;
	margin-bottom: 20px !important;
	margin-left: 0 !important;
}

body.blog .posts_container.classic_wrap > [class*="column-"] {
	box-sizing: border-box;
	width: auto !important;
	max-width: 100%;
	float: none !important;
	padding-right: 0 !important;
	padding-left: 0 !important;
}

body.blog .post_item.post_layout_classic {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin-bottom: 0;
	background: #FFFFFF;
	overflow: hidden;
}

body.blog .post_item.post_layout_classic .post_featured {
	aspect-ratio: 1.55 / 1;
	overflow: hidden;
}

body.blog .post_item.post_layout_classic .post_featured img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

body.blog .post_item.post_layout_classic .post_header,
body.blog .post_item.post_layout_classic .post_meta,
body.blog .post_item.post_layout_classic .post_content {
	padding-right: 28px;
	padding-left: 28px;
}

body.blog .post_item.post_layout_classic .post_header {
	padding-top: 28px;
}

body.blog .post_item.post_layout_classic .post_content {
	padding-bottom: 30px;
}

body.blog .post_item.post_layout_classic .post_title {
	font-size: 28px;
	line-height: 1.18;
	white-space: normal !important;
	word-break: normal;
	overflow-wrap: anywhere !important;
	hyphens: auto;
}

body.blog .post_item.post_layout_classic .post_title a,
body.blog .post_item.post_layout_classic .post_content,
body.blog .post_item.post_layout_classic .post_content_inner {
	display: block;
	max-width: 100%;
	min-width: 0;
	white-space: normal !important;
	overflow-wrap: anywhere !important;
	word-break: break-word !important;
}

body.blog .sidebar {
	box-sizing: border-box;
	display: block !important;
	width: auto !important;
	max-width: 100% !important;
	float: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.blog.body_style_fullscreen.sidebar_show [class*="content_wrap"] > .sidebar_custom,
body.blog.body_style_fullwide.sidebar_show [class*="content_wrap"] > .sidebar_custom {
	width: auto !important;
	max-width: 320px !important;
	float: none !important;
}

body.blog .sidebar_inner {
	display: block;
	padding-top: 0;
	border-top: 0;
}

body.blog .sidebar_inner > .elementor {
	display: block;
}

body.blog .sidebar_inner > .elementor > .elementor-element {
	display: block;
}

body.blog .sidebar_inner > .elementor > .elementor-element > .elementor-element {
	min-width: 0;
}

/* Sidebar section spacing. Each section is a heading + its content (Suche /
   Kategorien / Aktuelle Beiträge). Headings already keep 30px above their own
   content, but there was zero gap between one section's content and the next
   heading, so the groups collided (search box touched "Kategorien",
   "Modulares Bauen" touched "Aktuelle Beiträge"). Add a clear gap after each
   content block; the last one (recent posts) needs none. */
body.blog .sidebar_inner .elementor-widget-trx_sc_layouts_search,
body.blog .sidebar_inner .elementor-widget-trx_elm_icon_list {
	margin-bottom: 44px !important;
}

body.blog .widget_recent_posts .post_item {
	display: grid;
	grid-template-columns: 82px minmax(0, 1fr);
	gap: 18px;
	align-items: start;
}

/* Constrain the recent-posts thumbnail to its grid column so the title text
   no longer overlaps the image. Elementor's per-widget CSS forces
   .post_thumb to a fixed 100px + 22px right margin (specificity 0,6,0), which
   overflows the 68/82px grid track — hence the overlap. Force the thumb to
   fill its own track and drop the extra margin (the grid gap handles spacing). */
body.blog .widget_recent_posts .post_thumb {
	box-sizing: border-box;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	overflow: hidden;
}

body.blog .widget_recent_posts .post_thumb img {
	display: block;
	width: 100% !important;
	height: auto !important;
	max-width: 100% !important;
}

body.blog .widget_recent_posts .post_title {
	overflow-wrap: break-word;
	hyphens: auto;
}

/* ---------------------------------------------------------------------------
   Nagłówek na blogu — reguł kolorystycznych już tu nie ma.

   Wcześniej blog używał przezroczystego nagłówka 7050, zaprojektowanego pod
   ciemne hero strony głównej: na jasnym tle bloga logo, menu i hamburger były
   niewidoczne, więc ten plik przemalowywał je na granat (#0F1923), a po
   przewinięciu — gdy pasek robi się ciemny — z powrotem na biel.

   Blog dostał potem nagłówek „Solid" 7741, który ma własne, poprawne kolory.
   Stare reguły zostały i malowały granatowe napisy na granatowym pasku:
   z całego menu widać było wyłącznie pozycję bieżącą (złotą). Kasujemy je —
   nagłówek nie potrzebuje tu żadnych wyjątków.
--------------------------------------------------------------------------- */

/* Two-column grid for the full desktop/tablet-landscape range. Starts at 1025px
   (one past the stack breakpoint) so there is no gap where the sidebar floats
   loose over the content. The theme's margin-left: -150px is reset here too —
   without it a grid item would shift left and overlap the content column. */
@media (min-width: 1025px) {
	body.blog.sidebar_show .content_wrap_fullscreen {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) 320px;
		gap: 56px;
		align-items: start;
	}

	body.blog.sidebar_show .content_wrap_fullscreen > .content {
		width: auto !important;
		max-width: 100% !important;
		min-width: 0;
	}

	body.blog.sidebar_show .content_wrap_fullscreen > .sidebar {
		width: 320px !important;
		max-width: 320px !important;
		min-width: 0;
		margin-top: 0 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		float: none !important;
	}

	/* Stick the (short) sidebar so it stays in view while the long post list
	   scrolls, instead of leaving a tall empty column. The top offset clears
	   the fixed header (~65px) plus breathing room; align-self:start keeps the
	   grid item at content height so it can move within its track. Selector is
	   0,6,2 to beat responsive.css's `position:static !important` (0,5,2). */
	html body.blog.sidebar_show .page_content_wrap > .content_wrap_fullscreen > .sidebar.sidebar_custom {
		position: sticky !important;
		top: 130px !important;
		align-self: start !important;
	}

	/* Elementor sizes its sidebar containers via a per-breakpoint --width
	   variable that resolves too narrow in the 1025-1279 range (Elementor's own
	   breakpoint gap), collapsing the recent-posts content column. The sidebar
	   is a single vertical stack, so force every container to fill the column. */
	body.blog .sidebar_inner .elementor-120 .e-con {
		width: 100% !important;
		max-width: 100% !important;
	}

	body.blog .top_panel_custom .sc_layouts_row_fixed,
	body.blog .top_panel_custom .sc_layouts_row_fixed_always {
		position: sticky;
		top: 0;
		z-index: 1000;
	}

	body.blog .widget_recent_posts .post_item {
		grid-template-columns: 68px minmax(0, 1fr);
		gap: 14px;
	}

	body.blog .widget_recent_posts .post_thumb {
		width: 68px;
	}

	body.blog .widget_recent_posts .post_title {
		font-size: 17px;
		line-height: 1.2;
	}
}

/* Below the desktop grid breakpoint the sidebar stacks under the content.
   The parent theme pulls it left with margin-left: calc(-1 * var(--theme-var-sidebar))
   (-150px), and a non-media rule (`.sidebar_custom { max-width:320px }`, specificity
   0,5,1) outranks the mobile `width:100vw` reset — together they cap the sidebar at
   320px and drag it off the left edge. Reset both with 0,5,2 specificity so it wins
   regardless of stylesheet load order. Only below 1025px, where the sidebar
   actually stacks full-width under the content (at 1025px+ the grid owns it). */
@media (max-width: 1024px) {
	html body.blog.sidebar_show .page_content_wrap > .content_wrap_fullscreen > .sidebar,
	html body.blog.sidebar_show .page_content_wrap > .content_wrap_fullscreen > .sidebar_custom {
		box-sizing: border-box !important;
		float: none !important;
		clear: both !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
}

@media (max-width: 1024px) {
	body.blog .page_content_wrap {
		padding-bottom: 72px !important;
	}

	body.blog .content_wrap_fullscreen,
	body.blog .sidebar {
		padding-right: 30px;
		padding-left: 30px;
	}

	body.blog.sidebar_show .content_wrap_fullscreen {
		display: block;
	}

	body.blog.sidebar_show .content_wrap_fullscreen > .sidebar {
		margin-top: 44px;
	}

	body.blog .sidebar_inner {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	body.blog .mh-blog-hero {
		padding: 70px 0 40px;
	}

	body.blog .mh-blog-hero h1 {
		font-size: 52px;
	}
}

@media (max-width: 767px) {
	body.blog .page_content_wrap {
		padding-bottom: 58px !important;
	}

	body.blog .content_wrap_fullscreen,
	body.blog .sidebar {
		box-sizing: border-box;
		width: 100vw !important;
		max-width: 100vw !important;
		padding-right: 20px;
		padding-left: 20px;
		overflow: hidden;
	}

	body.blog .content,
	body.blog .mh-blog-hero,
	body.blog .mh-blog-hero__inner,
	body.blog .posts_container.classic_wrap,
	body.blog .post_item.post_layout_classic {
		box-sizing: border-box;
		width: calc(100vw - 40px) !important;
		max-width: calc(100vw - 40px) !important;
		min-width: 0 !important;
	}

	body.blog .mh-blog-hero p,
	body.blog .mh-blog-hero h1 {
		max-width: 100% !important;
		overflow-wrap: break-word !important;
	}

	body.blog .mh-blog-hero {
		padding: 54px 0 32px;
	}

	body.blog .mh-blog-hero h1 {
		font-size: 42px;
	}

	body.blog .mh-blog-hero p:not(.mh-blog-hero__eyebrow) {
		font-size: 17px;
	}

	body.blog .posts_container.classic_wrap {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 28px !important;
		margin-right: 0 !important;
		margin-bottom: 12px;
		margin-left: 0 !important;
	}

	body.blog .posts_container.classic_wrap > [class*="column-"] {
		width: 100% !important;
		max-width: 100%;
		float: none;
		padding-right: 0;
		padding-left: 0;
	}

	body.blog .post_item.post_layout_classic .post_header,
	body.blog .post_item.post_layout_classic .post_meta,
	body.blog .post_item.post_layout_classic .post_content {
		padding-right: 20px;
		padding-left: 20px;
	}

	body.blog .post_item.post_layout_classic .post_title {
		font-size: 24px;
		line-height: 1.2;
	}

	body.blog .post_item.post_layout_classic,
	body.blog .post_item.post_layout_classic .post_featured,
	body.blog .post_item.post_layout_classic .post_featured img,
	body.blog .post_item.post_layout_classic .post_header,
	body.blog .post_item.post_layout_classic .post_meta,
	body.blog .post_item.post_layout_classic .post_content,
	body.blog .post_item.post_layout_classic .post_content_inner {
		box-sizing: border-box;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}

	body.blog .sidebar_inner {
		padding-top: 34px;
	}

	body.blog .widget_recent_posts .post_item {
		grid-template-columns: 72px minmax(0, 1fr);
		gap: 14px;
	}
}