/* ==========================================================================
   Gniazdo w Felicjanowie - podstrony.css
   Podstrony oferty, aktualnosci, wpis i strona 404. Laduje sie poza strona glowna.
   1. Naglowek podstrony  2. Tresc: wstep, rozdzialy, pas z liczbami  3. Kolaz i karty  4. CTA
   5. Aktualnosci i wpis  6. Strona 404
   Kolory, fonty i odstepy WYLACZNIE przez tokeny z :root w main.css.
   ========================================================================== */

/* 1. NAGLOWEK PODSTRONY ---------------------------------------------------- */
/* Telefon: zdjecie zajmuje gore naglowka i przechodzi w zielen, tekst stoi nizej. Dzieki temu widac
   temat zdjecia (a nie dach pod tekstem), a H1 i zajawka maja pod soba jednolite, ciemne tlo. */
.hero--podstrona {
	--hero-foto: 21rem;
	align-items: end;
	min-height: 0;
}

/* --hero-gora (z felicjanow_kadr_gora) podciaga zdjecie pod pasek i menu: przy domach widac wtedy
   sciany i okna, a nie sam dach. Zaslona konczy sie razem ze zdjeciem. */
.hero--podstrona .hero__slajd {
	inset: calc(var(--hero-gora, 0rem) * -1) 0 auto;
	height: var(--hero-foto);
}

.hero--podstrona .hero__slajd img {
	object-position: var(--hero-kadr-tel, var(--hero-kadr, center));
}

.hero--podstrona .hero__tlo::after {
	background: linear-gradient(180deg, var(--c-zaslona-45) 0, var(--c-zaslona-0) 6rem, var(--c-zaslona-0) 8rem, var(--c-zaslona-66) 10.75rem, var(--c-zaslona-88) 13rem, var(--c-zielen) calc(var(--hero-foto) - var(--hero-gora, 0rem) - 0.5rem));
}

.hero--podstrona .hero__tresc {
	justify-items: start;
	gap: var(--s-3);
	padding-block: 11.25rem calc(var(--fala-h) + var(--s-6));
	text-align: left;
}

.hero--podstrona .hero__tytul {
	max-width: 22ch;
	margin-top: 0;
	font-size: var(--fs-h2);
	line-height: 1.04;
}

.hero--podstrona .hero__lead {
	max-width: 54ch;
}

.hero--podstrona .hero__cta {
	justify-content: flex-start;
	margin-top: var(--s-4);
}

.hero__data {
	color: var(--c-miod-jasny);
	font-size: var(--fs-maly);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.hero__data-podpis {
	color: var(--c-krem-90);
	font-weight: 600;
}

/* Szeroki ekran: zdjecie w tle calego naglowka. Zaslona jest ciemna po stronie tekstu (lewa)
   i znika po prawej, wiec zdjecie nie robi sie szara plama, a tekst ma kontrast. */
@media (min-width: 48em) {
	.hero--podstrona {
		min-height: clamp(27rem, 66svh, 40rem);
	}

	.hero--podstrona .hero__slajd {
		inset: 0;
		height: auto;
	}

	.hero--podstrona .hero__cta {
		width: auto;
	}

	.hero--podstrona .hero__slajd img {
		object-position: var(--hero-kadr, center 38%);
	}

	.hero--podstrona .hero__tlo::after {
		background:
			linear-gradient(90deg, var(--c-zaslona-88) 0, var(--c-zaslona-80) 70%, var(--c-zaslona-66) 100%),
			linear-gradient(180deg, var(--c-zaslona-45), var(--c-zaslona-0) 32%);
	}

	.hero--podstrona .hero__tresc {
		padding-top: 8.5rem;
	}
}

@media (min-width: 62em) {
	.hero--podstrona .hero__lead {
		max-width: 46ch;
	}

	.hero--podstrona .hero__tlo::after {
		background:
			linear-gradient(90deg, var(--c-zaslona-88) 0, var(--c-zaslona-88) 30%, var(--c-zaslona-80) 48%, var(--c-zaslona-45) 64%, var(--c-zaslona-0) 86%),
			linear-gradient(180deg, var(--c-zaslona-60), var(--c-zaslona-0) 30%, var(--c-zaslona-0) 70%, var(--c-zaslona-34));
	}
}

/* bez zdjecia (wpis, 404, strona dodana w panelu): zielone tlo i ornament z wycinanki */
.hero--podstrona.hero--bez-zdjecia {
	min-height: clamp(21rem, 46svh, 28rem);
}

.hero--podstrona.hero--bez-zdjecia .hero__tlo::after {
	background: linear-gradient(180deg, var(--c-zaslona), var(--c-zaslona-0));
}

.hero--podstrona.hero--bez-zdjecia .hero__tresc {
	padding-top: 8.5rem;
}

.hero__ornament {
	position: absolute;
	right: calc(var(--margines) * -1);
	bottom: calc(var(--fala-h) + var(--s-5));
	width: min(70vw, 46rem);
	color: var(--c-zielen-jasna);
}

/* okruszki (inc/seo.php; krotkie nazwy stron: felicjanow_okruszki_krotko) */
.hero__okruszki {
	max-width: 100%;
}

.okruszki__lista {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 var(--s-2);
	font-size: var(--fs-maly);
	font-weight: 600;
	line-height: 1.3;
}

.okruszki__element {
	display: inline-flex;
	align-items: center;
	gap: var(--s-2);
	min-height: 2.75rem;
	color: var(--c-krem);
	text-shadow: 0 1px 8px var(--c-zaslona-60);
}

/* kurzy slad zamiast ukosnika */
.okruszki__element + .okruszki__element::before {
	content: "";
	flex: none;
	width: 0.95em;
	height: 0.95em;
	background: var(--c-miod-jasny);
	-webkit-mask: url("../svg/lapka.svg") center / contain no-repeat;
	mask: url("../svg/lapka.svg") center / contain no-repeat;
	rotate: 90deg;
}

.okruszki__element a {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	color: var(--c-krem);
	text-decoration: underline;
	text-decoration-color: var(--c-krem-45);
	text-underline-offset: 0.3em;
	transition: text-decoration-color 0.2s ease, color 0.2s ease;
}

.okruszki__element a:active {
	color: var(--c-miod-jasny);
}

@media (hover: hover) and (pointer: fine) {
	.okruszki__element a:hover {
		color: var(--c-miod-jasny);
		text-decoration-color: currentColor;
	}
}

/* na telefonie biezaca strona jest juz w H1 tuz pod spodem */
@media (max-width: 39.99em) {
	.okruszki__element[aria-current] {
		display: none;
	}
}

/* 2. TRESC: WSTEP, ROZDZIALY I PAS Z LICZBAMI ------------------------------- */
.podstrona__artykul {
	padding-top: var(--s-7);
}

/* wstep: pierwszy akapit otwiera strone jak lead w gazecie */
.podstrona__wstep {
	display: grid;
	gap: var(--s-6);
	padding-bottom: var(--s-6);
}

.podstrona__wstep-tekst {
	max-width: 46rem;
}

.podstrona__wstep-tekst > :first-child {
	margin-top: 0;
}

.podstrona__wstep-tekst > p:first-child {
	color: var(--c-zielen);
	font-size: clamp(1.1875rem, 1.05rem + 0.7vw, 1.5rem);
	font-weight: 500;
	line-height: 1.5;
}

.podstrona__ornament {
	width: min(70%, 15rem);
	color: var(--c-lapka);
	opacity: 0.6;
}

/* strona bez naglowkow H2: zwykla kolumna tekstu */
.podstrona__wstep--calosc .podstrona__wstep-tekst {
	max-width: 40rem;
}

.podstrona__wstep--calosc .podstrona__wstep-tekst h2::after,
.rozdzial--pierwszy .rozdzial__tytul::after {
	content: "";
	display: block;
	width: 5.5rem;
	aspect-ratio: 745 / 225;
	margin-top: var(--s-3);
	background: var(--c-miod);
	-webkit-mask: url("../svg/galazka.svg") center / contain no-repeat;
	mask: url("../svg/galazka.svg") center / contain no-repeat;
}

/* rozdzial = jeden H2 z edytora. Galazka tylko pod pierwszym, pozostale bez znacznika. */
.rozdzial {
	padding-block: clamp(1.75rem, 4.5vw, 3.75rem);
}

.rozdzial__siatka {
	display: grid;
	gap: var(--s-5);
}

.rozdzial__tytul {
	max-width: 20ch;
	font-size: clamp(2rem, 1.7rem + 1.5vw, 3rem);
	scroll-margin-top: 6.5rem;
}

.rozdzial__tresc {
	min-width: 0;
	max-width: 36rem;
}

.rozdzial__tresc > :first-child {
	margin-top: 0;
}

/* listy w rozdzialach: kurzy slad zamiast kropki */
.rozdzial__tresc ul {
	padding-left: 0;
	list-style: none;
}

.rozdzial__tresc ul > li {
	position: relative;
	padding-left: 1.9em;
}

.rozdzial__tresc ul > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.28em;
	width: 1.1em;
	height: 1.1em;
	background: var(--c-bordo);
	-webkit-mask: url("../svg/lapka.svg") center / contain no-repeat;
	mask: url("../svg/lapka.svg") center / contain no-repeat;
	rotate: 90deg;
}

.rozdzial__tresc h3 {
	color: var(--c-zielen);
}

.rozdzial__tresc img {
	border-radius: var(--r-m);
}

.rozdzial__tresc figcaption {
	margin-top: var(--s-2);
	color: var(--c-tekst-2);
	font-size: var(--fs-maly);
}

.rozdzial__tresc blockquote {
	margin-inline: 0;
	padding-left: var(--s-5);
	border-left: 3px solid var(--c-miod);
	color: var(--c-zielen);
	font-size: var(--fs-lead);
	font-weight: 500;
}

.rozdzial__tresc table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--fs-maly);
}

.rozdzial__tresc th,
.rozdzial__tresc td {
	padding: var(--s-3);
	border-bottom: 1px solid var(--c-linia);
	text-align: left;
}

.rozdzial__tresc .wp-block-table {
	overflow-x: auto;
}

/* zdjecie rozdzialu: ramka z wycinanki, na telefonie pod naglowkiem */
.rozdzial__zdjecie {
	position: relative;
	isolation: isolate;
}

.rozdzial__zdjecie--pion {
	width: min(100%, 22rem);
}

.rozdzial__foto {
	aspect-ratio: 4 / 3;
}

.rozdzial__zdjecie--pion .rozdzial__foto {
	aspect-ratio: 4 / 5;
}

.rozdzial__zdjecie > .slady {
	--x: calc(100% - 6.5rem);
	--y: 3.25rem;
}

@media (min-width: 48em) {
	.rozdzial__siatka {
		grid-template-columns: repeat(12, minmax(0, 1fr));
		column-gap: var(--s-6);
		row-gap: var(--s-5);
	}

	.rozdzial--tekst .rozdzial__tytul,
	.rozdzial--tekst .rozdzial__tresc {
		grid-column: 1 / -1;
	}

	/* ze zdjeciem: zdjecie na zmiane z prawej i z lewej, tekst obok */
	.rozdzial--foto .rozdzial__siatka {
		grid-template-rows: auto 1fr;
	}

	.rozdzial--foto .rozdzial__tytul {
		grid-row: 1;
		align-self: end;
		margin-top: var(--s-6);
	}

	.rozdzial--foto .rozdzial__tresc {
		grid-row: 2;
	}

	.rozdzial--foto .rozdzial__zdjecie {
		grid-row: 1 / span 2;
		align-self: start;
		width: auto;
	}

	.rozdzial--prawo .rozdzial__tytul,
	.rozdzial--prawo .rozdzial__tresc {
		grid-column: 1 / span 6;
	}

	.rozdzial--prawo .rozdzial__zdjecie {
		grid-column: 8 / span 5;
	}

	.rozdzial--prawo .rozdzial__zdjecie--pion {
		grid-column: 9 / span 4;
	}

	.rozdzial--lewo .rozdzial__tytul,
	.rozdzial--lewo .rozdzial__tresc {
		grid-column: 7 / span 6;
	}

	.rozdzial--lewo .rozdzial__zdjecie {
		grid-column: 1 / span 5;
	}

	.rozdzial--lewo .rozdzial__zdjecie--pion {
		grid-column: 2 / span 4;
	}
}

@media (min-width: 62em) {
	.podstrona__artykul {
		padding-top: var(--s-8);
	}

	.podstrona__wstep {
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
		gap: var(--s-8);
	}

	.podstrona__ornament {
		width: 17rem;
	}

	/* bez zdjecia: naglowek w lewej kolumnie, tekst w prawej */
	.rozdzial--tekst .rozdzial__tytul {
		grid-column: 1 / span 4;
	}

	.rozdzial--tekst .rozdzial__tresc {
		grid-column: 6 / span 7;
		padding-top: var(--s-2);
	}

	.rozdzial__zdjecie > .slady {
		--x: calc(100% - 9rem);
		--y: 4.5rem;
	}
}

/* Gniazdo w liczbach: piaskowy pas z fala w srodku tresci (na wpisie: karta obok tekstu) */
.wizytowka__znak {
	width: 3.25rem;
	color: var(--c-miod);
}

.wizytowka__wartosc {
	color: var(--c-zielen);
	font: 400 var(--fs-h3) / 1 var(--f-naglowki);
	white-space: nowrap;
}

.wizytowka__opis {
	color: var(--c-tekst-2);
	font-size: var(--fs-maly);
	font-weight: 500;
	line-height: 1.35;
}

.wizytowka .etykieta {
	margin-bottom: 0;
}

.wizytowka--pas {
	margin-block: clamp(1.75rem, 4.5vw, 3.75rem);
	padding-block: calc(var(--fala-h) + var(--s-7));
}

.wizytowka--pas .wizytowka__uklad {
	display: grid;
	gap: var(--s-6);
}

.wizytowka--pas .wizytowka__glowka {
	position: relative;
	isolation: isolate;
	display: grid;
	justify-items: center;
	gap: var(--s-3);
	text-align: center;
}

.wizytowka--pas .wizytowka__liczby {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--s-6) var(--s-4);
}

.wizytowka--pas .wizytowka__liczby li {
	display: grid;
	flex: 0 1 9.5rem;
	align-content: start;
	justify-items: center;
	gap: var(--s-2);
	text-align: center;
}

.wizytowka--pas .wizytowka__wartosc {
	font-size: var(--fs-h2);
}

.wizytowka--pas .wizytowka__opis {
	max-width: 16ch;
}

@media (min-width: 62em) {
	.wizytowka--pas .wizytowka__liczby {
		flex-wrap: nowrap;
		gap: 0;
	}

	.wizytowka--pas .wizytowka__liczby li {
		flex: 1 1 0;
		padding-inline: var(--s-4);
	}

	.wizytowka--pas .wizytowka__liczby li + li {
		border-left: 2px dotted var(--c-linia);
	}
}

/* wpis: tekst i karta z liczbami obok */
.podstrona__uklad {
	display: grid;
	gap: var(--s-7);
	padding-block: var(--s-7) var(--s-sekcja);
}

.podstrona__tresc {
	min-width: 0;
	max-width: 40rem;
}

.podstrona__tresc .tresc-wpisu > :first-child {
	margin-top: 0;
}

.podstrona__tresc .tresc-wpisu h2 {
	margin-top: var(--s-8);
}

.podstrona__tresc .tresc-wpisu h2 + * {
	margin-top: var(--s-4);
}

/* galazka tylko pod pierwszym naglowkiem wpisu */
.podstrona__tresc .tresc-wpisu h2:first-of-type::after {
	content: "";
	display: block;
	width: 4.5rem;
	aspect-ratio: 745 / 225;
	margin-top: var(--s-3);
	background: var(--c-miod);
	-webkit-mask: url("../svg/galazka.svg") center / contain no-repeat;
	mask: url("../svg/galazka.svg") center / contain no-repeat;
}

.podstrona__tresc .tresc-wpisu img {
	border-radius: var(--r-m);
}

.podstrona__tresc .tresc-wpisu figcaption {
	margin-top: var(--s-2);
	color: var(--c-tekst-2);
	font-size: var(--fs-maly);
}

.podstrona__tresc .tresc-wpisu blockquote {
	margin-inline: 0;
	padding-left: var(--s-5);
	border-left: 3px solid var(--c-miod);
	color: var(--c-zielen);
	font-size: var(--fs-lead);
	font-weight: 500;
}

.podstrona__tresc .tresc-wpisu table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--fs-maly);
}

.podstrona__tresc .tresc-wpisu th,
.podstrona__tresc .tresc-wpisu td {
	padding: var(--s-3);
	border-bottom: 1px solid var(--c-linia);
	text-align: left;
}

.podstrona__tresc .tresc-wpisu .wp-block-table {
	overflow-x: auto;
}

.podstrona__zajawka {
	margin-bottom: var(--s-6);
	color: var(--c-zielen);
	font-weight: 500;
}

.wizytowka--karta {
	display: grid;
	gap: var(--s-4);
	padding: var(--s-6) var(--s-5);
	border-radius: var(--r-l);
	background: var(--c-piasek);
}

.wizytowka--karta .wizytowka__glowka {
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-4);
}

.wizytowka--karta .wizytowka__liczby {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 var(--s-5);
}

.wizytowka--karta .wizytowka__liczby li {
	display: grid;
	align-content: start;
	gap: var(--s-1);
	padding-block: var(--s-3);
	border-top: 2px dotted var(--c-linia);
}

/* wpis o wydarzeniu: sama tresc, bez karty z liczbami (zapisy prowadzi organizator) */
.podstrona__uklad--solo .podstrona__tresc {
	max-width: 44rem;
}

@media (min-width: 62em) {
	.podstrona__uklad {
		grid-template-columns: minmax(0, 1fr) 20rem;
		align-items: start;
		gap: var(--s-8);
		padding-top: var(--s-8);
	}

	.wizytowka--karta {
		position: sticky;
		top: 6.5rem;
		grid-column: 2;
	}

	.wizytowka--karta .wizytowka__liczby {
		grid-template-columns: 1fr;
	}

	.wizytowka--karta .wizytowka__liczby li {
		grid-template-columns: 6.5rem 1fr;
		align-items: center;
		gap: var(--s-3);
	}

	.podstrona__uklad--solo {
		grid-template-columns: minmax(0, 44rem);
		justify-content: center;
	}
}

@media (min-width: 75em) {
	.podstrona__uklad {
		grid-template-columns: minmax(0, 1fr) 22rem;
		gap: var(--s-9);
	}

	.podstrona__uklad--solo {
		grid-template-columns: minmax(0, 44rem);
	}
}

/* 3. KOLAZ I KARTY PODSTRON ------------------------------------------------- */
.pod-galeria,
.pod-karty,
.pod-cta,
.nie-ma {
	padding-top: 0;
}

.podstrona__artykul + .pod-galeria,
.podstrona__artykul + .pod-karty,
.podstrona__artykul + .pod-cta,
.podstrona > .trop + .pod-karty {
	padding-top: clamp(2.5rem, 6vw, 5rem);
}

.podstrona__artykul + .trop {
	margin-top: clamp(1.75rem, 4.5vw, 3.75rem);
}

.pod-galeria__kolaz--1 {
	columns: 1;
	max-width: 44rem;
}

.pod-galeria__kolaz--2 {
	columns: 2;
}

/* trzy i piec zdjec w dwoch kolumnach: pierwsze na cala szerokosc, zeby nie zostawala dziura */
@media (max-width: 47.99em) {
	.pod-galeria__kolaz--3 .galeria__foto:first-child,
	.pod-galeria__kolaz--5 .galeria__foto:first-child {
		column-span: all;
	}
}

/* karty rodzenstwa: mniejsze, bez przesuniec z kolazu */
.pod-karty--male .karta-grupy__foto {
	aspect-ratio: 3 / 2;
}

.pod-karty--male .naglowek-sekcji {
	margin-bottom: var(--s-6);
}

.pod-karty__powrot {
	margin-top: var(--s-7);
}

.pod-karty:not(.pod-karty--male) .pod-karty__powrot {
	text-align: center;
}

.karta-grupy:active .karta-grupy__tytul {
	color: var(--c-bordo-ciemne);
}

@media (hover: hover) and (pointer: fine) {
	.karta-grupy:hover .karta-grupy__tytul {
		color: var(--c-bordo);
	}
}

.karta-grupy__tytul {
	transition: color 0.2s ease;
}

/* siatka dopasowana do liczby kart, zeby nie zostawalo puste pole */
.pod-karty__lista--1 {
	grid-template-columns: minmax(0, 28rem);
}

@media (min-width: 40em) and (max-width: 47.99em) {
	.pod-karty__lista--3 {
		grid-template-columns: 1fr;
	}

	.pod-karty__lista--3 .karta-grupy {
		display: grid;
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
		align-items: center;
		gap: var(--s-5);
	}
}

@media (min-width: 48em) {
	.pod-karty__lista--3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--s-5);
	}
}

@media (min-width: 62em) {
	.pod-karty--male .grupy__element:nth-child(n) {
		margin-top: 0;
	}

	.pod-karty__lista--3 {
		gap: var(--s-7) var(--s-6);
	}

	.pod-karty__lista--2,
	.pod-karty__lista--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pod-karty:not(.pod-karty--male) .pod-karty__lista--2 {
		max-width: 56rem;
		margin-inline: auto;
	}

	/* dwie karty rodzenstwa: naglowek i powrot w lewej kolumnie, karty obok */
	.pod-karty--male.pod-karty--2 > .kontener {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr);
		grid-template-rows: auto 1fr;
		column-gap: var(--s-8);
	}

	.pod-karty--male.pod-karty--2 .naglowek-sekcji {
		grid-column: 1;
		grid-row: 1;
	}

	.pod-karty--male.pod-karty--2 .pod-karty__lista {
		grid-column: 2;
		grid-row: 1 / span 2;
	}

	.pod-karty--male.pod-karty--2 .pod-karty__powrot {
		grid-column: 1;
		grid-row: 2;
		margin-top: 0;
	}
}

/* 4. CTA NA KONCU PODSTRONY ------------------------------------------------ */
.pod-cta {
	padding-bottom: var(--s-sekcja);
}

.sekcja--piasek + .pod-cta,
.sekcja--zielona + .pod-cta {
	padding-top: var(--s-sekcja);
}

.pod-cta__karta {
	display: grid;
	gap: var(--s-6);
	padding: clamp(1.5rem, 5vw, 4.5rem);
	border-radius: var(--r-xl);
	background: var(--c-piasek);
}

.pod-cta__tekst {
	position: relative;
	isolation: isolate;
}

.pod-cta__tekst .tytul {
	max-width: 16ch;
}

.pod-cta__tekst .lead {
	margin-top: var(--s-4);
}

.pod-cta__akcje {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-3);
}

@media (min-width: 62em) {
	.pod-cta__karta {
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
		gap: var(--s-8);
	}

	.pod-cta__akcje {
		flex-direction: column;
		align-items: stretch;
	}
}

/* 5. AKTUALNOSCI I WPIS ---------------------------------------------------- */
.wpisy {
	padding-top: var(--s-7);
}

.wpisy__lista {
	display: grid;
	gap: var(--s-7) var(--s-6);
}

.wpis-karta {
	position: relative;
	display: grid;
	gap: var(--s-5);
	align-content: start;
}

.wpis-karta__foto {
	display: block;
	aspect-ratio: 3 / 2;
}

.wpis-karta__foto img {
	transition: transform 0.6s var(--ease-out);
}

.wpis-karta__tresc {
	display: grid;
	gap: var(--s-2);
	justify-items: start;
}

/* wpis bez zdjecia: karta na papierze, zeby siatka trzymala rytm */
.wpis-karta:not(:has(.wpis-karta__foto)) {
	padding: var(--s-6) var(--s-5);
	border: 1.5px dashed var(--c-linia);
	border-radius: var(--r-l);
	background: var(--c-papier);
}

.wpis-karta__data {
	color: var(--c-miod-tekst);
	font-size: var(--fs-drobny);
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.wpis-karta__tytul {
	font-size: var(--fs-h3);
}

/* jeden albo dwa wpisy: szeroka, pozioma karta zamiast malej karty w rogu */
.wpisy__lista.wpisy__lista--malo {
	grid-template-columns: 1fr;
}

.wpis-karta__ornament {
	display: none;
	color: var(--c-miod);
	opacity: 0.55;
}

.wpis-karta--poziomo .wpis-karta__opis {
	max-width: 58ch;
}

@media (min-width: 48em) {
	.wpis-karta--poziomo {
		grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
		align-items: center;
		gap: var(--s-7);
	}

	.wpis-karta--poziomo .wpis-karta__tytul {
		font-size: var(--fs-h2);
	}

	.wpis-karta--poziomo:not(:has(.wpis-karta__foto)) {
		grid-template-columns: minmax(0, 1fr) auto;
		padding: clamp(2rem, 5vw, 4rem);
		border-radius: var(--r-xl);
	}

	.wpis-karta--poziomo .wpis-karta__ornament {
		display: block;
		width: clamp(8rem, 16vw, 13rem);
	}
}

.wpis-karta__tytul a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}

/* cala karta jest klikalna, ale w drzewie dostepnosci zostaje jeden link (tytul) */
.wpis-karta__tytul a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: var(--r-l);
}

.wpis-karta__tytul a:focus-visible {
	outline: none;
}

.wpis-karta__tytul a:focus-visible::after {
	outline: 3px solid var(--c-fokus);
	outline-offset: 3px;
}

.wpis-karta__tytul a:active {
	color: var(--c-bordo-ciemne);
}

.wpis-karta__opis {
	color: var(--c-tekst-2);
}

@media (hover: hover) and (pointer: fine) {
	.wpis-karta:hover .wpis-karta__tytul a {
		color: var(--c-bordo);
	}

	.wpis-karta:hover .wpis-karta__foto img {
		transform: scale(1.05);
	}

	.wpis-karta:hover .link-strzalka .ikona {
		transform: translateX(5px);
	}
}

.wpisy__pusto {
	display: grid;
	gap: var(--s-3);
	justify-items: center;
	max-width: 44rem;
	margin-inline: auto;
	padding: var(--s-7) var(--s-5);
}

.wpisy__pusto-tytul {
	color: var(--c-zielen);
	font: 400 var(--fs-h3) / 1.1 var(--f-naglowki);
}

.wpisy__pusto-akcje {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--s-3);
	margin-top: var(--s-4);
}

/* paginacja (the_posts_pagination) */
.paginacja {
	margin-top: var(--s-8);
}

.paginacja .nav-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--s-2);
}

.paginacja .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--s-2);
	min-width: 2.75rem;
	min-height: 2.75rem;
	padding-inline: var(--s-3);
	border: 1.5px solid var(--c-linia);
	border-radius: var(--r-pelny);
	color: var(--c-zielen);
	font-weight: 700;
	text-decoration: none;
	transition: transform 0.16s var(--ease-out), background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.paginacja .page-numbers.current {
	border-color: var(--c-zielen);
	background: var(--c-zielen);
	color: var(--c-krem);
}

.paginacja .page-numbers.dots {
	border-color: transparent;
}

.paginacja a.page-numbers:active {
	transform: scale(0.97);
}

@media (hover: hover) and (pointer: fine) {
	.paginacja a.page-numbers:hover {
		border-color: var(--c-bordo);
		background: var(--c-bordo);
		color: var(--c-krem);
	}
}

/* wpis: powrot do listy i sasiednie wpisy */
.wpis__nawigacja {
	display: grid;
	gap: var(--s-5);
	justify-items: start;
	margin-top: var(--s-8);
	padding-top: var(--s-6);
	border-top: 2px dotted var(--c-linia);
}

.wpis__sasiedzi {
	display: grid;
	gap: var(--s-4);
	width: 100%;
}

.wpis__sasiedzi li {
	display: grid;
	gap: var(--s-1);
}

.wpis__kierunek {
	color: var(--c-miod-tekst);
	font-size: var(--fs-drobny);
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.wpis__sasiedzi a,
.wpis__strony a {
	color: var(--c-zielen);
	font-weight: 700;
	text-underline-offset: 0.25em;
	transition: color 0.2s ease;
}

.wpis__sasiedzi a {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
}

.wpis__sasiedzi a:active,
.wpis__strony a:active {
	color: var(--c-bordo-ciemne);
}

.wpis__strony {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-3);
	margin-top: var(--s-6);
	font-weight: 700;
}

@media (hover: hover) and (pointer: fine) {
	.wpis__sasiedzi a:hover,
	.wpis__strony a:hover {
		color: var(--c-bordo);
	}
}

@media (min-width: 40em) {
	.wpisy__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.wpis__sasiedzi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 62em) {
	.wpisy__lista { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* 6. STRONA 404 ------------------------------------------------------------ */
.nie-ma {
	padding-top: var(--s-7);
}

.nie-ma__linki {
	display: grid;
	border-top: 1px solid var(--c-linia);
}

.nie-ma__linki a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-4);
	padding: var(--s-4) var(--s-2);
	border-bottom: 1px solid var(--c-linia);
	color: var(--c-zielen);
	font: 400 var(--fs-h3) / 1.1 var(--f-naglowki);
	text-decoration: none;
	transition: color 0.2s ease, padding 0.3s var(--ease-out);
}

.nie-ma__linki .ikona {
	color: var(--c-bordo);
	font-size: 1.25rem;
	transition: transform 0.3s var(--ease-out);
}

.nie-ma__linki a:active {
	color: var(--c-bordo-ciemne);
}

@media (hover: hover) and (pointer: fine) {
	.nie-ma__linki a:hover {
		color: var(--c-bordo);
	}

	.nie-ma__linki a:hover .ikona {
		transform: translateX(5px);
	}
}

@media (min-width: 48em) {
	.nie-ma__linki {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: var(--s-7);
		border-top: 0;
	}

	.nie-ma__linki li:nth-child(-n+2) a {
		border-top: 1px solid var(--c-linia);
	}
}

/* MNIEJ RUCHU -------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.wpis-karta:hover .wpis-karta__foto img,
	.wpis-karta:hover .link-strzalka .ikona,
	.nie-ma__linki a:hover .ikona {
		transform: none;
	}
}
