są bloki treści. Elementor owija je w .elementor > .e-con, dlatego poniżej „spłaszczamy” tę warstwę i zerujemy domyślne odstępy Elementora. */ body { margin: 0; } /* WordPress dodaje klasę .page do , a nasz wrapper układu nosi tę samą nazwę — bez tego stawał się siatką i zgniatał obszar treści. */ body.page { display: block; grid-template-columns: none; } /* Warstwa .elementor przezroczysta dla siatki flex w main.content */ main.content > .elementor { display: contents; } /* Kontenery Elementora bez własnych paddingów i limitów szerokości */ main.content .e-con, main.content .e-con > .e-con-inner { --padding-block-start: 0px; --padding-block-end: 0px; --padding-inline-start: 0px; --padding-inline-end: 0px; --width: 100%; --content-width: 100%; --gap: var(--space-4); max-width: none; } /* Odstępy między widgetami kontrolują kontenery (gap), nie marginesy widgetów */ main.content .elementor-widget:not(:last-child) { margin-block-end: 0; } main.content .elementor-element { --widgets-spacing: 0px 0px; } main.content .elementor-widget-container > *:first-child { margin-top: 0; } main.content .elementor-widget-container > *:last-child { margin-bottom: 0; } /* Typografia z naszego systemu designu zamiast domyślnej Elementora */ main.content .elementor-widget-heading .elementor-heading-title { font-family: var(--font-heading); color: inherit; } main.content .elementor-widget-text-editor, main.content .elementor-widget-html { font-size: inherit; line-height: inherit; color: inherit; } /* ── Strona główna ───────────────────────────────────────────────── */ /* Hero ma sięgać krawędzi ekranu, więc zdejmujemy limit szerokości treści */ main.content:has(.hero-photo) { max-width: none; } /* Zdjęcie hero jako widget obrazka Elementora. Jako element flex musi mieć wyłączone kurczenie, inaczej „wraca” do szerokości kontenera i traci pełne wykrwawienie poza padding treści. */ /* !important jest tu konieczne — Elementor narzuca widgetom max-width:100%, przez co hero nie mogłoby wyjść poza padding obszaru treści. */ main.content .e-con > .hero-photo, main.content .e-con-inner > .hero-photo { flex-shrink: 0; max-width: none !important; width: calc(100% + 2 * var(--space-8)) !important; } main.content .hero-photo .elementor-widget-container { line-height: 0; } main.content .hero-photo img { width: 100%; height: 380px; object-fit: cover; display: block; } @media (min-width: 861px) { main.content .hero-photo img { object-position: bottom; } } /* Sekcje strony głównej zachowują szerokość kolumny czytelnej */ main.content .home-section { max-width: 860px; padding: 0 var(--space-8); } main.content .home-h1 .elementor-heading-title { font-size: 58px; line-height: 1.02; max-width: 24ch; } /* ── Podstrony z dokumentami ─────────────────────────────────────── */ main.content .doc-body { --gap: 4px; font-size: 16px; line-height: 1.7; color: var(--color-neutral-800); max-width: 72ch; } main.content .doc-body.doc-body-wide { --gap: var(--space-6); } main.content .doc-body h2 { font-family: var(--font-heading); font-size: 22px; margin: var(--space-4) 0 2px; } main.content .doc-body .elementor-widget-heading:first-child .elementor-heading-title { margin-top: 0; } main.content .doc-body ul, main.content .doc-body ol { margin: 6px 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; } /* ── Strona pojedynczego wpisu (komunikat / wydarzenie) ──────────── */ /* Treść kleiła się do tytułu — potrzebuje wyraźnego odstępu i światła między wierszami, bo to zwykle kilka akapitów ciągłego tekstu. */ main.content .lede-body { margin-top: var(--space-4); line-height: 1.7; } main.content .lede-body > p { margin: 0 0 var(--space-4); } main.content .lede-body > p:last-child { margin-bottom: 0; } /* ── Drobne poprawki WordPressa ──────────────────────────────────── */ body.admin-bar .mobile-topbar { top: 32px; } @media (max-width: 782px) { body.admin-bar .mobile-topbar { top: 46px; } } main.content .elementor-widget-google_maps iframe { display: block; width: 100%; border: 0; }