/**
 * Place (CPT) — landing placu (/place/<slug>/) + strona zbiorcza (/place/).
 *
 * Wszystkie wartości pochodzą z istniejącego designu strony (bez nowych tokenów):
 *   kontener        .site-main → max-width 1240px, margin 0 auto; szerokość podniesiona
 *                   z 95% na 96% (jak .main-navigation), żeby lewa krawędź stała w linii z logo
 *   font            Roboto (wczytywany w header.php)
 *   treść           16px / line-height 1.5 / weight 300 / #3a3b3c   (style.css: body,textarea)
 *   H1              40px / weight 400 / #16bc34 — także na mobile   (style.css: h1 + override niżej)
 *   H2              35px / weight 500 / #000                        (style.css: h2)
 *   H3              19px / weight 500 / #000                        (style.css: h3)
 *   zieleń akcent   #16bc34, #48ae4d          pomarańcz: #f8b03c
 *   promień         20px                                            (style.css: video, .carrot_btn)
 *   przycisk CTA    .carrot_btn ze style.css (bez duplikowania stylów)
 *   breakpointy     939px (mobile) / 1024px (tablet) — jak w reszcie arkusza
 *
 * kronika: doc/history/2026-08-03-development.md#decyzja-5
 */

/* Odstęp nagłówka od przyklejonego headera — wzorcem jest /przeglad-samochodow/
   (assets/css/page-przeglad-samochodow.css, `.categories-header`), na życzenie klienta:
   „wszystkie odległości jak tutaj". Wzorzec daje górę tekstu H1 na 113px (desktop),
   109px (481–1023) i 116px (≤480), licząc od góry dokumentu.

   Arytmetyka jest wszędzie ta sama: 13px (`.kompensator-fix-small`) + padding-top tej sekcji
   + margin-top H1 (50px, na mobile przywracane niżej) + na ≤480 jeszcze `h1{padding-top:50px}`
   z `style.css:7645` (`!important`, dotyczy też wzorca — dlatego padding sekcji spada do 3px).
   Wartości padding-top przepisane 1:1 z `.categories-header`.

   Wyjątek: wzorzec ma dodatkowo `@media (min-width:916px) and (max-width:1024px){padding-top:115px}`
   (góra H1 leci wtedy na 178px). Nie kopiujemy tego — pomiar headera pokazuje stałe 73px na całym
   zakresie ≥940px, więc te 115px nie kompensują niczego i w tym oknie szerokości wzorzec wypada
   z własnego rytmu. Place trzyma 113px także w 916–1024. */
.place-single,
.place-archive {
	padding: 50px 0 90px;
}

@media screen and (max-width: 1023px) {
	.place-single,
	.place-archive {
		padding-top: 46px;
	}
}

@media screen and (max-width: 939px) {
	.place-single,
	.place-archive {
		padding-bottom: 60px;
	}
}

@media screen and (max-width: 480px) {
	.place-single,
	.place-archive {
		padding-top: 3px;
	}
}

/* --- Nagłówki -------------------------------------------------------------- */

/* H1 bez własnej typografii poza dwiema rzeczami, których wzorzec nie dziedziczy z globalnego h1:
   rozmiar i margines górny na mobile. `style.css` w @media 160–939px zbija każdy h1 do 35px (@6612)
   i `.site-main h1:first-of-type` do margin-top:5px (@6620); wzorzec tych nadpisań nie łapie
   (jego H1 leży poza `.site-main`, a własna reguła `.categories-header h1` trzyma 40px/50px),
   więc na `/place/` przywracamy jedno i drugie. Reszta — kolor #16bc34, weight 400,
   line-height 1em — nadal z globalnego `h1` (style.css:4640), bez duplikatu.

   Selektor z prefiksem `.place-archive`/`.place-single` (0,3,0) bije `.site-main h1:first-of-type`
   (0,2,1) na liczbie klas — bez `!important`.

   Klient prosił o 40px na mobile wprost, więc NIE kopiujemy wzorcowego
   `@media (max-width:360px){font-size:24px}` — na 360px nagłówek zostaje 40px. */
@media screen and (max-width: 939px) {
	.place-archive .site-main .place-archive__title,
	.place-single .site-main .place-single__title {
		font-size: 40px;
		margin-top: 50px;
	}
}

/* Odstęp pod H1 — również z `.categories-header` (padding-bottom wzorca, u nas margin-bottom
   nagłówka, bo H1 nie ma własnej sekcji): 46 / 35 / 30 / 25px. Bez tego zostaje 0.67em
   z normalize (26.8px przy 40px), czyli ~19px za mało względem wzorca. */
.place-archive__title,
.place-single__title {
	margin-bottom: 46px;
}

@media screen and (max-width: 1023px) {
	.place-archive__title,
	.place-single__title {
		margin-bottom: 35px;
	}
}

@media screen and (max-width: 767px) {
	.place-archive__title,
	.place-single__title {
		margin-bottom: 30px;
	}
}

@media screen and (max-width: 480px) {
	.place-archive__title,
	.place-single__title {
		margin-bottom: 25px;
	}
}

/* Lewa krawędź treści równo z logo („marginesy idealnie jak logo").
   `.site-main` ma width:95%, a kontener logo `.main-navigation` — 96% (style.css:4838).
   Różnica 0,5% na stronę jest niewidoczna dopiero od 1280px w górę (tam wiąże max-width:1240px
   i oba wychodzą na 100px), ale np. przy 1200px dawała 30px vs 24px. */
.place-archive .site-main,
.place-single .site-main {
	width: 96%;
}

/* Mobile: logo siedzi w pasku `.slicknav_menu` na sztywnych 15px od krawędzi (nie na procentach),
   więc procentowy kontener trzeba zamienić na stały margines — inaczej treść wędruje
   z 23px (939px) na 9px (360px). */
@media screen and (max-width: 939px) {
	.place-archive .site-main,
	.place-single .site-main {
		width: auto;
		margin: 0 15px;
	}
}

.place-info__title,
.place-section__title {
	margin: 0 0 22px;
	padding: 0;
	font-family: "Roboto", sans-serif;
	font-size: 35px;
	font-weight: 500;
	line-height: 1.1;
	color: #000;
}

@media screen and (max-width: 939px) {
	.place-info__title,
	.place-section__title {
		font-size: 26px;
		margin-bottom: 16px;
	}
}

/* --- Dwie kolumny: dane po lewej, mapa po prawej --------------------------- */

.place-top {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 40px;
	align-items: start;
}

@media screen and (max-width: 939px) {
	.place-top {
		grid-template-columns: minmax(0, 1fr);
		gap: 26px;
	}
}

.place-info__block {
	margin: 0 0 22px;
}

.place-label {
	margin: 0 0 6px;
	font-family: "Roboto", sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.5;
	color: #000;
}

.place-address,
.place-hours,
.place-phone {
	margin: 0;
	font-family: "Roboto", sans-serif;
	font-size: 16px;
	font-weight: 300;
	font-style: normal; /* <address> jest domyślnie kursywą */
	line-height: 1.5;
	color: #3a3b3c;
}

.place-phone a,
.place-phone a:visited {
	font-weight: 500;
	color: #000;
	text-decoration: none;
}

.place-phone a:hover,
.place-phone a:focus {
	color: #48ae4d;
}

.place-maps-link,
.place-maps-link:visited {
	display: inline-block;
	margin-top: 8px;
	font-family: "Roboto", sans-serif;
	font-size: 16px;
	font-weight: 500;
	color: #16bc34;
	text-decoration: underline;
}

.place-maps-link:hover,
.place-maps-link:focus {
	color: #48ae4d;
}

.place-cta {
	display: inline-block;
	text-decoration: none;
}

/* --- Mapa (iframe Google Maps) --------------------------------------------- */

.place-map {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: 20px;
	overflow: hidden;
	background: #f2f2f2;
}

.place-map iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

@media screen and (max-width: 939px) {
	.place-map {
		aspect-ratio: 3 / 2;
	}
}

/* --- Sekcje treści / zdjęć / FAQ ------------------------------------------- */

.place-section {
	margin-top: 60px;
}

@media screen and (max-width: 939px) {
	.place-section {
		margin-top: 40px;
	}
}

/* Treść z edytora (dojazd, zasady wizyty, czynności) oraz FAQ. */
.place-prose {
	font-family: "Roboto", sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.5;
	color: #3a3b3c;
	max-width: 900px;
}

.place-prose > *:first-child {
	margin-top: 0;
}

.place-prose > *:last-child {
	margin-bottom: 0;
}

.place-prose p {
	margin: 0 0 16px;
}

.place-prose h2 {
	margin: 34px 0 16px;
	font-size: 28px;
	font-weight: 500;
	line-height: 1.2;
	color: #000;
}

.place-prose h3 {
	margin: 26px 0 10px;
	font-size: 19px;
	font-weight: 500;
	line-height: 1.3;
	color: #000;
}

.place-prose h4 {
	margin: 22px 0 8px;
	font-size: 17px;
	font-weight: 500;
	color: #000;
}

.place-prose ul,
.place-prose ol {
	margin: 0 0 16px;
	padding-left: 22px;
}

.place-prose li {
	margin: 0 0 8px;
}

.place-prose a,
.place-prose a:visited {
	color: #16bc34;
	font-weight: 500;
	text-decoration: underline;
}

.place-prose a:hover,
.place-prose a:focus {
	color: #48ae4d;
}

.place-prose img {
	max-width: 100%;
	height: auto;
	border-radius: 20px;
}

.place-prose table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 16px;
	display: block;
	overflow-x: auto;
}

.place-prose th,
.place-prose td {
	text-align: left;
	padding: 12px 16px;
	border-bottom: 1px solid #eee;
}

.place-prose thead th {
	background: #f8b03c;
	color: #fff;
	font-weight: 500;
}

@media screen and (max-width: 939px) {
	.place-prose h2 {
		font-size: 24px;
	}
}

/* --- Galeria zdjęć -------------------------------------------------------- */

.place-gallery__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 20px;
}

@media screen and (max-width: 480px) {
	.place-gallery__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

.place-gallery__item {
	margin: 0;
}

.place-gallery__img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 20px;
}

.place-gallery__caption {
	margin: 8px 0 0;
	font-family: "Roboto", sans-serif;
	font-size: 14px;
	font-weight: 300;
	line-height: 1.4;
	color: #666;
}

/* --- Powrót do listy ------------------------------------------------------ */

.place-back {
	margin: 50px 0 0;
	font-family: "Roboto", sans-serif;
	font-size: 16px;
}

.place-back a,
.place-back a:visited {
	color: #16bc34;
	font-weight: 500;
	text-decoration: none;
}

.place-back a:hover,
.place-back a:focus {
	color: #48ae4d;
	text-decoration: underline;
}

/* --- Strona zbiorcza /place/ ---------------------------------------------- */

.place-archive__intro {
	margin-bottom: 40px;
}

.place-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 30px;
}

@media screen and (max-width: 480px) {
	.place-cards {
		grid-template-columns: minmax(0, 1fr);
	}
}

.place-card {
	display: flex;
	flex-direction: column;
	border: 1px solid #f2f2f2;
	border-radius: 20px;
	overflow: hidden;
	background: #fff;
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.place-card:hover {
	border-color: #48ae4d;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.07);
}

.place-card__media {
	display: block;
	line-height: 0;
	background: #f2f2f2;
}

.place-card__img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.place-card__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	padding: 24px 26px 26px;
}

.place-card__title {
	margin: 0 0 12px;
	padding: 0;
	font-family: "Roboto", sans-serif;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
	color: #000;
}

.place-card__title a,
.place-card__title a:visited {
	color: #000;
	text-decoration: none;
}

.place-card__title a:hover,
.place-card__title a:focus {
	color: #48ae4d;
}

.place-card__desc {
	margin: 0 0 16px;
	font-family: "Roboto", sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.5;
	color: #3a3b3c;
}

.place-card .place-label {
	margin-top: 12px;
}

.place-card .place-label:first-of-type {
	margin-top: 0;
}

/* Kafle w jednym rzędzie mają równą wysokość (grid), więc przycisk dociągamy do dołu, żeby
   przy różnej długości adresów/godzin wszystkie były w jednej linii.
   :nth-last-child(2) = element bezpośrednio nad przyciskiem (przycisk jest zawsze ostatni)
   — gwarantuje 20px odstępu także w najwyższym kaflu, gdzie margin-top:auto zwija się do zera. */
.place-card__body > :nth-last-child(2) {
	margin-bottom: 20px;
}

/* Identyczny z „Czytaj więcej" na listingu Porad (.post-card-button): geometria + kolory
   z Customizera, obwódka/hover ze style.css. Duplikat wartości, bo place.css musi stać sam
   (tamten przycisk jest rozbity między Additional CSS i style.css). */
.place-card__link,
.place-card__link:visited {
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	align-self: flex-start;
	margin-top: auto;
	box-sizing: border-box;
	padding: 12px 24px;
	border: 2px solid #28bd3f;
	border-radius: 100px;
	background: #28bd3f;
	font-family: "Roboto", sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

/* inwersja jak na Poradach: białe tło + zielony napis i strzałka, ramka bez skoku */
.place-card__link:hover,
.place-card__link:focus {
	background: #fff;
	border-color: #28bd3f;
	color: #28bd3f;
}

/* strzałka dziedziczy kolor tekstu → biała na zielonym, zielona po hoverze */
.place-card__link svg path {
	fill: currentColor;
}

/* --- Paginacja archiwum --------------------------------------------------- */

.place-archive .navigation.pagination {
	margin-top: 40px;
	font-family: "Roboto", sans-serif;
	font-size: 16px;
}

.place-archive .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.place-archive .page-numbers {
	display: inline-block;
	min-width: 40px;
	padding: 8px 12px;
	border: 1px solid #f2f2f2;
	border-radius: 20px;
	text-align: center;
	color: #000;
	text-decoration: none;
}

.place-archive .page-numbers.current,
.place-archive .page-numbers:hover {
	border-color: #48ae4d;
	color: #48ae4d;
}