/* KOLORYT WŁASNY TEGO DZIAŁU — drewno modrzewiowe meczetu w Bohonikach, len, bursztyn — Podlasie jest ciepłe i drewniane.
   Grunt #120e09. Gradienty podłoża biorą barwę z palety tego działu,
   a nie z neutralnej szarości: 21 modułów miało wcześniej to samo
   `--tlo: #0e0c0b` i cały serwis świecił jedną szarością. */

/* Polska — co tu zostało żywe i co się tu wymieszało.  Prefiks `tpl-`.

   PALETA Z MATERIAŁU I ZE ŚWIATŁA, NIE Z NASTROJU. Backlog europejski zakłada,
   że dwanaście krajów jednego kontynentu nie da się rozróżnić samą barwą, bo
   europejskie barwy naturalne zlewają się ze sobą. Rozróżnienie ma iść
   materiałem i światłem. Dla Polski materiałem jest len, słoma i wapno,
   światłem — mgła i wczesny zmierzch.

   Stąd cztery barwy wzięte wprost z rzeczy, o których dział mówi: surowy len
   nieblichowany, słoma dachu i wycinanki, wapno bielonej ściany i jedna
   czerwień — ta sama nić i ta sama tkanina, którą kładzie się przy zamawianiu
   róży. Czerwień jest w tym dziale AKCENTEM PROCEDURY, nie ozdobą, więc
   pojawia się tam, gdzie mowa o zabiegu, i nigdzie indziej.

   ŚWIATŁO JEST NISKIE I ROZPROSZONE. Poświaty są szerokie i blade, bez ostrych
   ognisk, bo dział dzieje się we mgle i o zmierzchu, a nie w słońcu. To jest
   różnica wobec Grecji i Hiszpanii, które dostaną światło twarde.

   ŚWIADOMIE inna niż sąsiedzi w filarze: Procesy o czary są popielato-żelazne,
   Chrześcijaństwo pergaminowo-cynobrowe, Rok obrzędowy ziemisty. Tu rządzi
   len na mglistym.

   SZEROKOŚĆ 1520 px i blok wyłamania z układu motywu są od pierwszej wersji.
   Motyw narzuca `--wp--style--global--content-size: 645px` i bez tego dział
   wygląda na ściśnięty do połowy ekranu, a test tego NIE widzi, bo ściśnięta
   strona niczego nie przepełnia. */

.tpl-strona {
	--tlo: #120e09; --panel: rgba( 30, 25, 18, .84 );
	--obrys: rgba( 207, 199, 178, .30 ); --wlos: rgba( 207, 199, 178, .14 );
	--len: #cfc7b2; --len-j: #e8e1cf;
	--sloma: #c9a961; --sloma-j: #e3c485;
	--wapno: #d8dbd8; --wapno-j: #f0f2ef;
	--czerwien: #9d4438; --czerwien-j: #c4614f;
	--mgla: #6d7a7c; --mgla-j: #93a2a4;
	--etyk: #a89a7c;
	--tekst: #b3ab97; --tekst-slaby: #8b8472; --tekst-mocny: #ece6d6;
	--serif: 'Cormorant Garamond', Georgia, serif; --sans: Jost, system-ui, sans-serif;

	position: relative; max-width: 1520px; margin: 0 auto; padding: 0 40px 90px;
	color: var( --tekst ); font: 300 17px var( --serif );
	background:
		radial-gradient( 1200px 640px at 50% -10%, rgba( 207, 199, 178, .16 ), transparent 72% ),
		radial-gradient( 900px 520px at 86% 40%, rgba( 201, 169, 97, .10 ), transparent 74% ),
		radial-gradient( 760px 440px at 8% 78%, rgba( 157, 68, 56, .08 ), transparent 74% ),
		linear-gradient( 180deg, #15161a, var( --tlo ) 48% );
	overflow-x: clip;
}
.tpl-strona *, .tpl-strona *::before, .tpl-strona *::after { box-sizing: border-box; }

/* WYŁAMANIE Z UKŁADU MOTYWU. Bez tego dział stoi w kolumnie 645 px. */
body:has( .tpl-strona ) .wp-site-blocks > header, body:has( .tpl-strona ) header.wp-block-template-part,
body:has( .tpl-strona ) .wp-site-blocks > footer, body:has( .tpl-strona ) footer.wp-block-template-part,
body:has( .tpl-strona ) .wp-block-post-title { display: none !important; }
body:has( .tpl-strona ) .wp-site-blocks, body:has( .tpl-strona ) .wp-block-group,
body:has( .tpl-strona ) .wp-block-post-content { padding: 0 !important; margin: 0 !important; max-width: none !important; }
body:has( .tpl-strona ) .wp-block-post-content > *, body:has( .tpl-strona ) .entry-content > * { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
body:has( .tpl-strona ) { background: #0e0f10; }
body:has( .tpl-strona ) .wp-block-post-content > .tpl-strona, body:has( .tpl-strona ) .entry-content > .tpl-strona,
.tpl-strona { box-sizing: border-box; max-width: 1600px !important; margin-left: auto !important; margin-right: auto !important; }
.tpl-strona button { font-family: inherit; }

/* ══════════════  UWERTURA  ══════════════ */

.tpl-hero {
	position: relative; margin: 26px 0 0; padding: 62px 44px 54px; border-radius: 28px;
	border: 1px solid var( --wlos ); overflow: hidden;
	background:
		radial-gradient( 900px 420px at 22% 0%, rgba( 216, 219, 216, .1 ), transparent 70% ),
		linear-gradient( 180deg, rgba( 24, 25, 28, .9 ), rgba( 14, 15, 16, .96 ) );
}
/* Uwertura z grafika nosi `tpl-sekcja--tlo tpl-hero`, a NIE `tpl-hero--tlo`
   — nazwa modyfikatora pochodzi z `tlo()` i jest wspolna dla obu. */
.tpl-sekcja--tlo::before {
	content: ''; position: absolute; inset: 0; z-index: -1;
	background: var( --tlo ) 50% 50% / cover no-repeat; opacity: .92;
}
.tpl-sekcja--tlo::after {
	content: ''; position: absolute; inset: 0; z-index: -1;
	background:
		radial-gradient( 900px 520px at 16% 16%, rgba( 10, 11, 12, .68 ), transparent 76% ),
		linear-gradient( 180deg, rgba( 10, 11, 12, .14 ), rgba( 10, 11, 12, .5 ) );
}
.tpl-hero__nad {
	margin: 0 0 16px; font: 400 11px var( --sans ); letter-spacing: .3em; text-transform: uppercase;
	color: var( --etyk );
}
.tpl-hero__tytul {
	margin: 0 0 26px; max-width: 20ch;
	font: 300 clamp( 40px, 5.2vw, 72px ) / 1.07 var( --serif ); color: var( --tekst-mocny );
	text-shadow: 0 0 60px rgba( 216, 219, 216, .16 );
}

/* ══════════════  SEKCJE  ══════════════ */

.tpl-sekcja { position: relative; margin: 84px 0 0; padding: 0; }
.tpl-sekcja--tlo { padding: 54px 40px 48px; border-radius: 26px; border: 1px solid var( --wlos ); overflow: hidden; }
.tpl-sekcja__nad {
	margin: 0 0 12px; font: 400 11px var( --sans ); letter-spacing: .28em; text-transform: uppercase;
	color: var( --etyk );
}
.tpl-sekcja__tytul {
	margin: 0 0 16px; max-width: 26ch;
	font: 300 clamp( 30px, 3.4vw, 46px ) / 1.12 var( --serif ); color: var( --tekst-mocny );
	text-shadow: 0 0 40px rgba( 216, 219, 216, .13 );
}
.tpl-sekcja__lead { margin: 0 0 32px; max-width: 78ch; font-size: 19px; line-height: 1.66; color: var( --tekst ); }

.tpl-przerywnik { display: block; width: 100%; height: 44px; margin: 66px 0 0; color: var( --sloma ); opacity: .5; }

/* ══════════════  RÓŻA ODLEGŁOŚCI  ══════════════
   Rysunek dostaje JAWNĄ szerokość, bo SVG w siatce kurczy się do 300 px,
   a wtedy podpisy punktów nachodzą na siebie i cały sens przestaje działać. */

.tpl-roza {
	width: 100%; max-width: 760px; margin: 0 auto; position: relative;
	/* Światło pod rysunkiem — niskie i rozproszone, zgodnie ze światłem działu.
	   Bez niego koło wisi na płaskim tle i nie ma żadnej głębi. */
	background: radial-gradient( 60% 55% at 50% 46%, rgba( 201, 169, 97, .07 ), transparent 72% );
}

/* KOMPOZYCJA NA SZEROKIM EKRANIE.
   Rysunek zajmuje 760 px, a sekcja ma 1520 — opis pod spodem zostawiał po obu
   stronach koła ponad trzysta pikseli pustki, przez co podpis strony wyglądał
   na zagubiony we własnej sekcji. Na szerokim ekranie rysunek i opis stoją
   obok siebie i czyta się je jako jedną rzecz: klikam punkt, tekst zmienia się
   TUŻ OBOK, bez przewijania. Poniżej 1200 px wracają jeden pod drugim. */
@media ( min-width: 1200px ) {
	#tpl-roza {
		display: grid; align-items: start; column-gap: 44px;
		grid-template-columns: minmax( 0, 1.02fr ) minmax( 0, .98fr );
		grid-template-areas: 'nad nad' 'tytul tytul' 'lead lead' 'rys opis';
	}
	#tpl-roza > .tpl-sekcja__nad   { grid-area: nad; }
	#tpl-roza > .tpl-sekcja__tytul { grid-area: tytul; }
	#tpl-roza > .tpl-sekcja__lead  { grid-area: lead; }
	#tpl-roza > .tpl-roza          { grid-area: rys; margin: 0; }
	#tpl-roza > .tpl-roza__opis    { grid-area: opis; margin: 0; position: sticky; top: 28px; }
}
.tpl-roza__svg { display: block; width: 100%; height: auto; overflow: visible; }

.tpl-roza__pierscien { fill: none; stroke: var( --wlos ); stroke-width: 1; }
.tpl-roza__os { stroke: var( --wlos ); stroke-width: 1; stroke-dasharray: 3 7; }
.tpl-roza__skala { fill: var( --tekst-slaby ); font: 400 11px var( --sans ); letter-spacing: .14em; }
.tpl-roza__strona { fill: var( --etyk ); font: 400 12px var( --sans ); letter-spacing: .2em; text-anchor: middle; dominant-baseline: middle; }
.tpl-roza__nota { fill: var( --tekst-slaby ); font: 300 13px var( --serif ); text-anchor: middle; }

.tpl-punkt { cursor: pointer; outline: none; }
.tpl-punkt__nic { stroke: var( --wlos ); stroke-width: 1; }
.tpl-punkt__pole { fill: transparent; }
.tpl-punkt__etyk { fill: var( --tekst ); font: 300 15px var( --serif ); }

.tpl-znak__ksztalt { fill: none; stroke: var( --mgla-j ); stroke-width: 1.5; }
.tpl-znak__kreska { fill: none; stroke: var( --mgla-j ); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.tpl-znak--islam .tpl-znak__ksztalt { stroke: var( --sloma-j ); }
.tpl-znak--zydzi .tpl-znak__kreska { stroke: var( --wapno ); }
.tpl-znak--prawoslawie .tpl-znak__kreska { stroke: var( --len-j ); }
.tpl-znak--katolicyzm .tpl-znak__kreska { stroke: var( --mgla-j ); }
.tpl-znak--zywe .tpl-znak__kreska { stroke: var( --czerwien-j ); stroke-width: 1.8; }
.tpl-znak--srodek .tpl-znak__ksztalt { stroke: var( --etyk ); fill: var( --etyk ); }
.tpl-znak--srodek .tpl-znak__kreska { stroke: var( --etyk ); }

.tpl-punkt:hover .tpl-punkt__etyk,
.tpl-punkt:focus-visible .tpl-punkt__etyk { fill: var( --tekst-mocny ); }
.tpl-punkt.jest-wybrany .tpl-punkt__etyk { fill: var( --tekst-mocny ); font-weight: 500; }
.tpl-punkt.jest-wybrany .tpl-punkt__nic { stroke: var( --sloma ); stroke-width: 1.5; }
.tpl-punkt.jest-wybrany .tpl-znak { filter: drop-shadow( 0 0 12px rgba( 227, 196, 133, .5 ) ); }
.tpl-punkt:focus-visible .tpl-punkt__pole { fill: rgba( 227, 196, 133, .1 ); }

.tpl-roza__opis {
	max-width: 78ch; margin: 26px auto 0; padding: 30px 34px;
	border: 1px solid var( --wlos ); border-radius: 22px; background: var( --panel );
}
.tpl-roza__opis h3 { margin: 0 0 6px; font: 300 30px var( --serif ); color: var( --tekst-mocny ); }
.tpl-roza__opis p { margin: 0 0 14px; font-size: 18px; line-height: 1.74; }
.tpl-roza__opis p:last-child { margin-bottom: 0; }
.tpl-roza__km { font: 400 11px var( --sans ) !important; letter-spacing: .24em; text-transform: uppercase; color: var( --sloma ); margin-bottom: 8px !important; }
.tpl-roza__kto { font: 400 12px var( --sans ) !important; letter-spacing: .1em; text-transform: uppercase; color: var( --etyk ); }
.tpl-roza__krotko { color: var( --tekst-mocny ); font-style: italic; }
.tpl-roza__zrodlo { font-size: 15px !important; color: var( --tekst-slaby ); border-top: 1px solid var( --wlos ); padding-top: 12px; }
.tpl-roza__zrodlo b { display: block; font: 400 10.5px var( --sans ); letter-spacing: .22em; text-transform: uppercase; color: var( --etyk ); margin-bottom: 4px; }

/* ══════════════  SIATKI KAFLI  ══════════════ */

.tpl-siatka { display: grid; gap: 22px; grid-template-columns: repeat( auto-fill, minmax( 300px, 1fr ) ); align-items: start; }
.tpl-siatka--zabiegi { grid-template-columns: repeat( auto-fill, minmax( 360px, 1fr ) ); }
.tpl-siatka--slowa { grid-template-columns: repeat( auto-fill, minmax( 260px, 1fr ) ); }

.tpl-kafel {
	position: relative; padding: 26px 26px 24px; border-radius: 20px;
	border: 1px solid var( --wlos ); background: var( --panel ); cursor: pointer;
	transition: border-color .2s, transform .2s;
}
.tpl-kafel:hover, .tpl-kafel:focus-visible { border-color: var( --obrys ); transform: translateY( -2px ); }
.tpl-kafel h3 { margin: 0 0 8px; font: 300 25px / 1.18 var( --serif ); color: var( --tekst-mocny ); }
.tpl-kafel p { margin: 0; font-size: 17px; line-height: 1.66; }
.tpl-kafel__nad {
	display: block; margin: 0 0 10px; font: 400 10.5px var( --sans ); letter-spacing: .22em;
	text-transform: uppercase; color: var( --etyk );
}
.tpl-kafel__nad i { font-style: normal; margin-right: 8px; color: var( --sloma ); }

.tpl-foto { margin: 0 0 18px; border-radius: 14px; overflow: hidden; }
.tpl-foto img { display: block; width: 100%; height: auto; }

.tpl-pole { margin: 0 0 14px !important; padding: 12px 16px; border-radius: 12px; font-size: 16px !important; }
.tpl-pole b { display: block; font: 400 10.5px var( --sans ); letter-spacing: .22em; text-transform: uppercase; margin-bottom: 5px; }
.tpl-pole--zrodlo { background: rgba( 109, 122, 124, .12 ); color: var( --tekst-slaby ); }
.tpl-pole--zrodlo b { color: var( --mgla-j ); }
.tpl-pole--zamiast { background: rgba( 157, 68, 56, .13 ); color: var( --tekst-mocny ); }
.tpl-pole--zamiast b { color: var( --czerwien-j ); }

/* ── siedem składników zabiegu ──
   Etykieta i treść w dwóch kolumnach, żeby dało się czytać PIONOWO po
   etykietach i porównywać zabiegi między sobą. To jest cel tego rozkładu:
   nie ozdoba, tylko możliwość zestawienia. */
.tpl-rozklad {
	margin: 0 0 18px; padding: 16px 18px; border-radius: 14px;
	border: 1px solid var( --wlos ); background: rgba( 201, 169, 97, .06 );
}
.tpl-rozklad__pole { display: grid; grid-template-columns: 116px 1fr; gap: 14px; padding: 7px 0; border-bottom: 1px solid var( --wlos ); }
.tpl-rozklad__pole:last-child { border-bottom: 0; }
.tpl-rozklad__pole b { font: 400 10.5px var( --sans ); letter-spacing: .18em; text-transform: uppercase; color: var( --sloma ); padding-top: 3px; }
.tpl-rozklad__pole span { font-size: 16.5px; line-height: 1.6; color: var( --tekst ); }

/* ══════════════  LICZNIK  ══════════════ */

.tpl-liczby { display: grid; gap: 20px; grid-template-columns: repeat( auto-fit, minmax( 250px, 1fr ) ); align-items: start; }
.tpl-karta { padding: 28px 24px; border-radius: 20px; border: 1px solid var( --wlos ); background: var( --panel ); }
.tpl-karta__ile {
	margin: 0 0 10px; font: 300 clamp( 38px, 4vw, 56px ) / 1 var( --serif ); color: var( --sloma-j );
	text-shadow: 0 0 34px rgba( 227, 196, 133, .22 );
}
.tpl-karta__co { margin: 0 0 10px; font: 400 12px var( --sans ); letter-spacing: .14em; text-transform: uppercase; color: var( --etyk ); line-height: 1.5; }
.tpl-karta__krotko { margin: 0; font-size: 16.5px; line-height: 1.64; }

/* ══════════════  OKNO  ══════════════ */

.tpl-okno {
	max-width: 82ch; padding: 30px 34px; border-radius: 20px;
	border: 1px solid var( --wlos ); background: rgba( 20, 21, 23, .7 );
}
.tpl-okno p { margin: 0; font-size: 19px; line-height: 1.74; color: var( --tekst ); }

/* ══════════════  WĄSKIE EKRANY  ══════════════ */

@media ( max-width: 900px ) {
	.tpl-strona { padding: 0 20px 60px; }
	.tpl-hero { padding: 44px 24px 38px; }
	.tpl-sekcja { margin-top: 60px; }
	.tpl-sekcja--tlo { padding: 36px 22px 32px; }
	.tpl-roza__opis { padding: 22px 20px; }
	.tpl-rozklad__pole { grid-template-columns: 1fr; gap: 3px; }
	/* Siatka zabiegów ma `minmax( 360px )`, co przy 390 px ekranu i marginesach
	   wychodziło 10 px poza stronę — zmierzone, nie założone. Jedna kolumna. */
	.tpl-siatka, .tpl-siatka--zabiegi, .tpl-siatka--slowa { grid-template-columns: 1fr; }
	.tpl-punkt__etyk { font-size: 13px; }
}

/* GRUNT CAŁEJ STRONY. Motyw daje `body` czerń, a kolumna działu ma 1520 px — na
   ekranie 2560 px zostawało po ~470 px czarnego pasa z każdej strony.
   `body:has()` ma swoistość 0,2,1 wobec `body` 0,0,1, więc wygrywa
   z motywem bez `!important`.
   NIE robimy tego pseudoelementem: `background: inherit` na `::after`
   dziedziczy też ZDJĘCIE sekcji, a `cover` przelicza się na szerokości
   pseudoelementu — wychodzą dwa te same zdjęcia w różnych skalach.
   Sprawdzone i cofnięte 2026-09-12. */
body:has( .tpl-strona ) {
	background-color: #120e09;
	background-image: radial-gradient( 1600px 900px at 50% 0%, rgba( 207, 199, 178, .07 ), transparent 68% );
	background-attachment: fixed;
}

/* Polska: scoped landscape, linen and warm timber. */
body:has(.tpl-strona){background:#101715;background-image:linear-gradient(#111b19bb,#17130fe8),url('gfx/tla/tlo-hero-v2.webp');background-size:cover;background-attachment:fixed}
.tpl-strona.tpl-polska-v2{max-width:1680px!important;padding:24px 48px 100px;background:transparent;font-family:var(--sans);font-weight:400;--tekst:#c7c6b8;--tekst-slaby:#a8afa4;--tekst-mocny:#f4ebd7;--sloma:#d3b57c;--etyk:#d3b57c}
.tpl-polska-v2 .tpl-hero{display:block!important;position:relative;isolation:isolate;min-height:740px;padding:110px 7% 80px;border:1px solid #d1bb803f;border-radius:4px 110px 4px 4px;overflow:hidden;background:linear-gradient(90deg,#0a1714ef 0%,#0a1714b8 45%,#0a17142a 80%),url('gfx/tla/tlo-hero-v2.webp') center/cover!important;box-shadow:0 32px 100px #0006}
.tpl-polska-v2 .tpl-hero::before{content:'';position:absolute;inset:24px;border:1px solid #e1c79830;z-index:-1;pointer-events:none;border-radius:2px 85px 2px 2px}
.tpl-polska-v2 .tpl-hero__tytul{font-size:clamp(54px,6vw,94px);line-height:.98;max-width:690px!important;width:auto!important;font-weight:400;letter-spacing:-.025em;margin-bottom:28px}
.tpl-polska-v2 .tpl-hero__tytul em{display:block;color:#d8bb81;font-weight:300}
.tpl-polska-v2 .tpl-hero .tpl-okno{max-width:560px!important;background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important;font:400 18px/1.8 var(--sans);color:#e2ded0}
.tpl-polska-v2 .tpl-hero .tpl-okno p{font:inherit!important}.tpl-hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}
.tpl-polska-v2 .tpl-hero-actions a{display:inline-flex;align-items:center;gap:22px;min-height:52px;padding:14px 25px;border:1px solid #d4bb8570;color:#f3e7cf;text-decoration:none;background:#17221bb8;border-radius:2px 20px 2px 2px;font-size:14px}.tpl-polska-v2 .tpl-hero-actions a:first-child{color:#19241f;background:linear-gradient(120deg,#eddbad,#c6a667)}
.tpl-polska-v2 .tpl-sekcja{margin-top:80px;padding:48px;border:1px solid #d4bb8529;background:linear-gradient(130deg,#24352ee6,#101c18e8);border-radius:3px 60px 3px 3px;box-shadow:0 24px 65px #0003}
.tpl-polska-v2 .tpl-sekcja:nth-of-type(even){background:radial-gradient(ellipse at 95% 0,#ab83451d,transparent 55%),linear-gradient(135deg,#30291fe8,#171e18ec)}
.tpl-polska-v2 .tpl-sekcja__tytul{font-size:clamp(34px,3.6vw,56px);font-weight:400;max-width:850px}.tpl-polska-v2 .tpl-sekcja__lead{font:400 17px/1.85 var(--sans);max-width:820px}
.tpl-polska-v2 .tpl-przerywnik{height:28px;margin-top:50px;opacity:.5}
.tpl-polska-v2 #tpl-roza{display:block}.tpl-atlas-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:32px;align-items:start}
.tpl-polska-v2 .tpl-roza{border:1px solid #d4b57d40;background:radial-gradient(ellipse at center,#6e8b6933,transparent 66%),linear-gradient(#10221deb,#10221deb),url('gfx/tla/tlo-hero-v2.webp') center/cover;border-radius:50% 50% 5px 5px;padding:12px;box-shadow:inset 0 0 90px #0006}
.tpl-polska-v2 .tpl-roza__opis{position:static!important;margin:0!important;padding:28px;background:linear-gradient(120deg,#c7a56613,#0a151280);border:1px solid #c7a56638;border-radius:3px 35px 3px 3px;max-height:610px;overflow:auto}
.tpl-polska-v2 .tpl-roza__opis h3{font:400 42px/1.1 var(--serif);margin:12px 0;color:var(--tekst-mocny)}.tpl-polska-v2 .tpl-roza__opis p{font:400 15px/1.8 var(--sans)}
.tpl-polska-v2 .tpl-roza__km{color:#dfbf81;font-size:12px!important;letter-spacing:.12em;text-transform:uppercase}.tpl-polska-v2 .tpl-punkt__etyk{font-size:18px;fill:#eee5cf;font-weight:500;paint-order:stroke;stroke:#17241e;stroke-width:4px;stroke-linejoin:round}.tpl-polska-v2 .tpl-punkt.jest-wybrany{filter:drop-shadow(0 0 6px #e7c26a99)}
.tpl-place-list{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px}.tpl-place-list button{font:400 13px var(--sans);padding:11px 16px;min-height:44px;background:#14221c;color:#ddd9c8;border:1px solid #cdb37d50;border-radius:4px;cursor:pointer}.tpl-place-list button[aria-pressed=true]{background:#d9bd86;color:#17211b;border-color:#ead7b0}
.tpl-polska-v2 .tpl-kafel{background:linear-gradient(135deg,#dfc5910d,#0c161ac9)!important;border:1px solid #d4bb8535!important;border-radius:3px 30px 3px 3px!important;box-shadow:0 10px 35px #0003;transition:transform .2s,border-color .2s}.tpl-polska-v2 .tpl-kafel:hover{transform:translateY(-4px);border-color:#d4bb8599!important}.tpl-polska-v2 .tpl-kafel h3{font:400 29px/1.2 var(--serif)!important;color:#efe6d1}.tpl-polska-v2 .tpl-kafel p{font:400 15px/1.8 var(--sans)!important}.tpl-polska-v2 .tpl-kafel__nad{font-size:10px;letter-spacing:.14em}.tpl-polska-v2 .zd-wiecej{color:#ddbd7d!important}
.tpl-polska-v2 .tpl-rozklad__pole{padding:16px;background:#15261f;border-bottom:1px solid #cbb08022}.tpl-polska-v2 :focus-visible{outline:2px solid #f0ce82!important;outline-offset:5px!important}
body:has(.tpl-polska-v2) .zd-zaslona{backdrop-filter:blur(16px);background:#07120cbb}body:has(.tpl-polska-v2) .zd-okno[role=dialog]{background:linear-gradient(140deg,#25382c,#101e18)!important;border:1px solid #dbc18b66!important;color:#d7d7c9;border-radius:4px 60px 4px 4px!important}body:has(.tpl-polska-v2) .zd-okno__pelne{font:400 17px/1.9 Jost, sans-serif}body:has(.tpl-polska-v2) .zd-okno__tytul{font:400 48px/1.1 'Cormorant Garamond',serif}
.tpl-image-caption{font:400 11px/1.6 var(--sans);opacity:.72;margin-top:24px;max-width:580px}.tpl-material-photo{width:100%;aspect-ratio:2.2;object-fit:cover;display:block;border-radius:3px 45px 3px 3px;margin:24px 0 32px}
@media(max-width:850px){.tpl-strona.tpl-polska-v2{padding:14px 18px 60px}.tpl-polska-v2 .tpl-hero{min-height:690px;padding:80px 30px 50px;background-position:60% center!important;border-radius:3px 65px 3px 3px}.tpl-polska-v2 .tpl-hero__tytul{font-size:62px}.tpl-polska-v2 .tpl-sekcja{padding:28px 22px;margin-top:48px}.tpl-atlas-layout{grid-template-columns:1fr}.tpl-polska-v2 .tpl-roza__opis{max-height:none}.tpl-polska-v2 .tpl-sekcja__lead{font-size:16px}}
@media(max-width:480px){.tpl-polska-v2 .tpl-hero__tytul{font-size:49px}.tpl-polska-v2 .tpl-hero{padding:62px 24px 40px}.tpl-polska-v2 .tpl-hero .tpl-okno{font-size:16px}.tpl-polska-v2 .tpl-hero::before{inset:12px}.tpl-polska-v2 .tpl-sekcja{padding:26px 16px}.tpl-polska-v2 .tpl-roza{padding:0}.tpl-polska-v2 .tpl-roza__opis{padding:20px}.tpl-place-list button{flex:1 0 42%;padding:10px}.tpl-polska-v2 .tpl-roza__opis h3{font-size:36px}}
@media(prefers-reduced-motion:reduce){.tpl-polska-v2 *{transition:none!important;scroll-behavior:auto!important}}

/* Keep the module hero out of shared editorial grid positioning. */
.tpl-strona.tpl-polska-v2 .tpl-hero .tpl-okno{display:block!important;position:relative!important;inset:auto!important;transform:none!important;margin:0 auto 0 0!important;align-self:auto!important;justify-self:start!important;max-width:560px!important}
.tpl-strona.tpl-polska-v2 .tpl-hero-actions{display:flex!important;grid-template-columns:none!important;width:fit-content!important;max-width:100%;align-items:center;gap:14px!important}
.tpl-strona.tpl-polska-v2 .tpl-hero-actions a{width:auto!important;flex:0 1 auto!important;grid-column:auto!important}
.tpl-strona.tpl-polska-v2 .tpl-hero .tpl-okno::before,.tpl-strona.tpl-polska-v2 .tpl-hero .tpl-okno::after{display:none!important}

body:has(.tpl-polska-v2) .zd-tlo{backdrop-filter:blur(16px);background:rgba(7,18,12,.78)}


/* ===== POPRAWKA WARSTW 2026-09-12 =====
   `z-index: -1` na obu pseudoelementach wrzucal ZDJECIE POD wlasne,
   nieprzezroczyste tlo sekcji (.tpl-hero ma pelny linear-gradient),
   wiec grafika nie byla widoczna w ogole. Sprawdzone na zywo.
   Pseudoelementy ida nad tlo elementu, tresc nad nie. */
.tpl-sekcja--tlo::before,
.tpl-sekcja--tlo::after { z-index: 0; }
.tpl-sekcja--tlo > * { position: relative; z-index: 1; }


/* ===== MIT W KAFLU 2026-09-12 =====
   Naglowek kafla w sekcji „Czego nie bylo” to CUDZE falszywe zdanie.
   Ma wygladac na cytat, nie na teze strony. */
.tpl-kafel__nad--mit { color: #c4826e; letter-spacing: .16em; }
.tpl-kafel__mit { color: var( --tekst-slaby ); font-style: italic; }
.tpl-kafel__nie { color: #c4826e; font-style: normal; letter-spacing: .04em; }

/* OKNO TEZY — przejscie tonalne.
   Wspolna warstwa daje oknu tezy plaska pobialke rgba(255,255,255,.028)
   regulami o swoistosci 0,2,0 i 0,3,0 — jedna wartosc dla wszystkich dzialow
   naraz. Dublowana klasa daje 0,4,0 i zamyka sprawe bez !important.
   Barwy sa z palety TEGO dzialu. Dopisane po stronie SERWERA, bo lokalna
   kopia modulu bywa starsza niz wgrana. */
.tpl-strona .tpl-hero .tpl-okno.zd-okno,
.tpl-strona .tpl-hero .zd-okno.zd-okno,
.tpl-strona .tpl-hero .tpl-okno.tpl-okno {
	background:
		radial-gradient( 720px 240px at 42% 0%, rgba( 30, 25, 18, .10 ), transparent 70% ),
		linear-gradient( 168deg, #1d1914, #120e09 );
}