/**
 * Frontend PCR Events.
 *
 * Kafle wydarzeń i strona wydarzenia odwzorowują oryginalne strony warsztatów
 * zbudowane w Elementorze (widget „Call to Action", skórka klasyczna). Wszystkie
 * wartości pochodzą z wygenerowanego CSS oryginału i z pomiarów zrzutów — patrz
 * CHANGELOG, faza 14. Nie zmieniaj ich „na oko".
 *
 * Kolory globalne czytamy przez `--pcr-*` (mostek `PCR_Theme` do zestawu stylów).
 * Wartości wpisane wprost — #557256, #f9fafa, #3f444b — w oryginale też są wpisane
 * ręcznie i nie należą do palety motywu.
 */

/* ── Lista wydarzeń ────────────────────────────────────────────────────────
   Odwzorowanie widgetu call-to-action: blok zdjęcia nad blokiem treści,
   promień 20px pochodzi z „dodatkowego CSS" w Kustomizatorze serwisu. */

.pcr-events {
	display: grid;
	gap: 40px;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	/* 1080 px — tyle miał zagnieżdżony kontener z kaflami na oryginalnej stronie,
	   czyli o 60 px mniej niż kontener strony. */
	max-width: 1080px;
	margin: 2rem auto;
	/* Kafle w wierszu mają tę samą wysokość niezależnie od długości nazwy i liczby
	   wierszy opisu — inaczej przycisk „sprawdź" wypada na różnych poziomach. */
	align-items: stretch;
}

@media (min-width: 768px) {
	.pcr-events--cols-2,
	.pcr-events--cols-3,
	.pcr-events--cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1025px) {
	.pcr-events--cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.pcr-events--cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.pcr-event {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border-radius: 20px;
	background: #fff;
	color: #3f444b;
	text-decoration: none;
	transition: .5s;
}

.pcr-event:hover,
.pcr-event:focus {
	color: #3f444b;
	text-decoration: none;
}

.pcr-event__image {
	position: relative;
	min-height: 200px;
	width: 100%;
	overflow: hidden;
}

.pcr-event__bg {
	position: absolute;
	inset: 0;
	background-position: 50%;
	background-size: cover;
	z-index: 1;
	/* Powolne przybliżenie zdjęcia — dokładnie jak w oryginale (1500 ms, skala 1.2). */
	transition: transform 1500ms;
}

.pcr-event__overlay {
	position: absolute;
	inset: 0;
	z-index: 2;
	background-color: #0000005E;
	transition: background-color 1500ms;
}

.pcr-event:hover .pcr-event__bg,
.pcr-event:focus .pcr-event__bg {
	transform: scale(1.2);
}

.pcr-event:hover .pcr-event__overlay,
.pcr-event:focus .pcr-event__overlay {
	background-color: rgba(0, 0, 0, .3);
}

.pcr-event__body {
	display: flex;
	flex-direction: column;
	flex: 1 0 auto;
	justify-content: flex-start;
	align-items: center;
	min-height: 187px;
	padding: 35px;
	background-color: #f9fafa;
	text-align: center;
	transition: all .4s;
}

.pcr-event__title {
	margin: 0 0 31px;
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-size: 31px;
	font-weight: 600;
	line-height: 1.2;
	color: #3f444b;
}

.pcr-event__meta,
.pcr-event__price,
.pcr-event__availability {
	margin: 0 0 15px;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 16px;
	line-height: 1.5;
	color: #3f444b;
}

.pcr-event__price {
	font-weight: 600;
}

.pcr-event__availability--low {
	color: #b32d2e;
	font-weight: 600;
}

.pcr-event__action {
	/* Przycisk zjeżdża na sam dół kafla, więc w całym wierszu stoi na jednej wysokości. */
	margin: auto 0 0;
	padding-top: 20px;
}

.pcr-button {
	display: inline-block;
	padding: 12px 24px;
	border: 1px solid #3f444b;
	border-radius: 3px;
	background: transparent;
	color: #3f444b;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 15px;
	font-weight: 300;
	line-height: 14px;
	letter-spacing: 2.7px;
	text-transform: uppercase;
	text-decoration: none;
}

.pcr-button--disabled {
	opacity: .45;
	cursor: not-allowed;
}

.pcr-event--cancelled .pcr-event__title,
.pcr-event--completed .pcr-event__title {
	opacity: .65;
}

.pcr-events-empty {
	margin: 2rem 0;
	opacity: .75;
}

/* Strona produktu */

.pcr-product-details {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: .35rem 1rem;
	margin: 1rem 0;
	font-size: .95em;
}

.pcr-product-details dt {
	font-weight: 600;
	opacity: .7;
	margin: 0;
}

.pcr-product-details dd {
	margin: 0;
}

.pcr-product-notes {
	font-size: .95em;
	opacity: .85;
}

/* Moje konto */

.pcr-account-heading {
	margin: 2rem 0 .75rem;
	font-size: 1.2em;
}

.pcr-account-events {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 1rem;
}

.pcr-account-event {
	border: 1px solid rgba(0, 0, 0, .12);
	border-radius: 6px;
	padding: 1.1rem 1.25rem;
}

.pcr-account-event--cancelled {
	opacity: .7;
	border-style: dashed;
}

.pcr-account-event__title {
	margin: 0 0 .25rem;
	font-size: 1.1em;
}

.pcr-account-event__date,
.pcr-account-event__place {
	margin: 0;
	font-size: .92em;
	opacity: .75;
}

.pcr-account-event__status {
	margin: .6rem 0;
	font-size: .92em;
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1rem;
	align-items: baseline;
}

.pcr-account-event__seat {
	opacity: .6;
	font-size: .9em;
}

.pcr-account-event__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .6rem;
	align-items: center;
}

.pcr-account-event__hint {
	font-size: .88em;
	opacity: .7;
}

.pcr-account-event__details {
	margin-top: 1rem;
	padding-top: .85rem;
	border-top: 1px dashed rgba(0, 0, 0, .15);
}

.pcr-account-event__details summary {
	cursor: pointer;
	font-weight: 600;
}

.pcr-details-form {
	margin-top: .75rem;
	display: grid;
	gap: .6rem;
	max-width: 30rem;
}

.pcr-details-form .form-row {
	margin: 0;
	display: grid;
	gap: .2rem;
}

.pcr-details-form input {
	width: 100%;
}

/* Bilet */

.pcr-ticket__back {
	margin-bottom: 1rem;
}

.pcr-ticket__card {
	border: 1px solid rgba(0, 0, 0, .15);
	border-radius: 8px;
	padding: 1.5rem;
	max-width: 34rem;
}

.pcr-ticket__title {
	margin: 0 0 1rem;
	font-size: 1.3em;
}

.pcr-ticket__meta {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: .4rem 1.25rem;
	margin: 0 0 1.5rem;
	font-size: .95em;
}

.pcr-ticket__meta dt {
	font-weight: 600;
	opacity: .65;
	margin: 0;
}

.pcr-ticket__meta dd {
	margin: 0;
}

.pcr-ticket__code {
	text-align: center;
	padding: 1.1rem;
	border: 2px dashed rgba(0, 0, 0, .2);
	border-radius: 6px;
}

.pcr-ticket__code-label {
	display: block;
	font-size: .8em;
	text-transform: uppercase;
	letter-spacing: .08em;
	opacity: .6;
	margin-bottom: .35rem;
}

.pcr-ticket__code-value {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 1.35em;
	letter-spacing: .06em;
}

.pcr-ticket__notes,
.pcr-ticket__webinar {
	margin-top: 1.5rem;
}

.pcr-ticket__notes h3 {
	font-size: 1em;
	margin: 0 0 .35rem;
}

.pcr-ticket__hint {
	font-size: .9em;
	opacity: .7;
}



/* ── Strona wydarzenia ─────────────────────────────────────────────────────
   Układ oryginalnych stron warsztatów. Kontener 1140 px, tło białe,
   nagłówek 378 px ze zdjęciem i ukośnym ścięciem, zielone pasy zapisów. */

.pcr-event-page {
	--pcr-ev-container: 1140px;
	--pcr-ev-green: var(--pcr-color-primary, #547454);
	color: var(--pcr-color-text, #000);
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
}

.pcr-ev-body {
	max-width: var(--pcr-ev-container);
	margin: 0 auto;
	padding: 0 20px;
}

/* ── Nagłówek ─────────────────────────────────────────────────────────── */

.pcr-ev-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	min-height: 378px;
	overflow: hidden;
}

.pcr-ev-hero__bg {
	position: absolute;
	inset: 0;
	background-position: center left;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: 0;
}

.pcr-ev-hero__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background-color: #000000AD;
}

/* Bez zdjęcia nakładka nie ma czego przyciemniać — wtedy sama daje tło. */
.pcr-ev-hero--plain .pcr-ev-hero__overlay {
	background-color: var(--pcr-ev-green);
}

.pcr-ev-hero__inner {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--pcr-ev-container);
	margin: 0 auto;
	/* Odstępy dobrane tak, by nagłówek miał dokładnie 378 px jak w oryginale,
	   a tytuł zaczynał się 54 px pod paskiem nawigacji.
	   Dolne 111 px to wysokość ukośnego ścięcia — treść nie może tam wejść, bo biały
	   klin przykryłby biały tekst. Przy węższych ekranach nagłówek po prostu rośnie. */
	padding: 30px 20px 111px;
	color: #fff;
}

.pcr-ev-hero__title {
	margin: 0;
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-size: 56px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	color: #fff;
}

.pcr-ev-hero__meta {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 45px;
	margin-top: 45px;
}

.pcr-ev-hero__item {
	display: flex;
	align-items: center;
	gap: 15px;
}

.pcr-ev-hero__item--place {
	text-align: right;
}

.pcr-ev-hero__item--date {
	text-align: left;
}

.pcr-ev-hero__label {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.4;
}

.pcr-ev-hero__value {
	font-size: 22px;
	font-weight: 400;
	line-height: 1.4;
}

.pcr-ev-hero__item .pcr-ev-icon {
	font-size: 41px;
	color: #fff;
	line-height: 1;
}

.pcr-ev-hero__item--seats {
	text-align: left;
}

.pcr-ev-hero__value--low {
	font-weight: 600;
}

.pcr-ev-hero__notice {
	margin: 20px 0 0;
	text-align: center;
	font-size: 16px;
	font-weight: 600;
}

/* Ukośne ścięcie u dołu nagłówka — kształt „triangle-asymmetrical", odbity.
   Złożenie przekształceń jest takie samo jak w Elementorze: kontener obraca się
   o 180 stopni (kształt nie jest „negatywem"), a odbicie w poziomie siedzi na SVG.
   Pominięcie obrotu kontenera daje klin wystający w środek nagłówka. */
.pcr-ev-hero__shape {
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	overflow: hidden;
	line-height: 0;
	direction: ltr;
	transform: rotate(180deg);
	z-index: 3;
}

.pcr-ev-hero__shape svg {
	display: block;
	position: relative;
	left: 50%;
	width: calc(100% + 1.3px);
	height: 111px;
	transform: translateX(-50%) rotateY(180deg);
}

.pcr-ev-hero__shape path {
	fill: #fff;
	transform-origin: center;
}

/* Ikony przychodzą z Elementora jako wstawiony SVG — bez własnego wypełnienia
   i bez rozmiaru, więc jedno i drugie ustawiamy tutaj. */
.pcr-ev-icon {
	display: inline-flex;
	flex: none;
	line-height: 1;
}

.pcr-ev-icon svg {
	display: block;
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.pcr-ev-icon i {
	font-style: normal;
}

/* ── Komunikaty WooCommerce ───────────────────────────────────────────── */

.pcr-ev-notices {
	max-width: var(--pcr-ev-container);
	margin: 0 auto;
	padding: 30px 20px 0;
}

/* WooCommerce daje komunikatom szarą belkę z obcą ramką — na tej stronie ma to być
   zieleń serwisu. Lewy margines wewnętrzny musi zostawić miejsce na ikonę, którą
   WooCommerce ustawia bezwzględnie; bez tego napis wchodzi na nią. */
.pcr-ev-notices .woocommerce-message,
.pcr-ev-notices .woocommerce-info {
	position: relative;
	margin: 0 0 16px;
	padding: 18px 24px 18px 56px;
	border: 0;
	border-left: 4px solid var(--pcr-color-primary, #547454);
	border-radius: 3px;
	background-color: var(--pcr-color-soft, #FFEFD8);
	color: var(--pcr-color-text, #000);
	font-size: 16px;
	line-height: 1.5;
	list-style: none;
}

.pcr-ev-notices .woocommerce-message::before,
.pcr-ev-notices .woocommerce-info::before {
	left: 22px;
	top: 18px;
	color: var(--pcr-color-primary, #547454);
}

/* WooCommerce celowo ustawia fokus na komunikacie, żeby czytnik ekranu go odczytał
   (woocommerce.js). Obrysu nie usuwamy — to realna pomoc dla klawiatury i czytników —
   tylko dopasowujemy jego kolor do palety zamiast domyślnego niebieskiego. */
.pcr-ev-notices .woocommerce-message:focus,
.pcr-ev-notices .woocommerce-info:focus {
	outline: 2px solid var(--pcr-color-primary, #547454);
	outline-offset: 2px;
}

/* Błąd — ten sam układ, ostrzegawcza czerwień zamiast zieleni. Trafia tu m.in.
   odmowa przy wyprzedanym wydarzeniu, więc musi być czytelny. */
.pcr-ev-notices .woocommerce-error {
	position: relative;
	margin: 0 0 16px;
	padding: 18px 24px 18px 56px;
	border: 0;
	border-left: 4px solid #b32d2e;
	border-radius: 3px;
	background-color: rgba(179, 45, 46, .07);
	color: var(--pcr-color-text, #000);
	font-size: 16px;
	line-height: 1.5;
	list-style: none;
}

.pcr-ev-notices .woocommerce-error::before {
	left: 22px;
	top: 18px;
	color: #b32d2e;
}

.pcr-ev-notices .woocommerce-error:focus {
	outline: 2px solid #b32d2e;
	outline-offset: 2px;
}

/* Przycisk „Zobacz koszyk" w komunikacie — ten sam wygląd co przycisk zakupu. */
.pcr-ev-notices .button {
	padding: 10px 20px;
	border: 0;
	border-radius: 3px;
	background-color: var(--pcr-color-primary, #547454);
	color: #fff;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	text-decoration: none;
}

.pcr-ev-notices .button:hover,
.pcr-ev-notices .button:focus {
	background-color: var(--pcr-color-primary, #547454);
	color: #fff;
	opacity: .9;
}

/* ── Nagłówki sekcji ──────────────────────────────────────────────────── */

.pcr-ev-head {
	display: flex;
	align-items: center;
	gap: 15px;
	margin: 0;
}

.pcr-ev-head__title {
	margin: 0;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.4;
	color: var(--pcr-color-text, #000);
}

.pcr-ev-head .pcr-ev-icon {
	font-size: 26px;
	line-height: 1;
	color: var(--pcr-color-accent, #547454);
}

/* ── Treść ────────────────────────────────────────────────────────────── */

.pcr-ev-prose {
	font-size: 16px;
	line-height: 1.5;
}

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

.pcr-ev-prose ul,
.pcr-ev-prose ol {
	margin: 0 0 14px;
	padding-left: 24px;
}

.pcr-ev-prose li {
	margin-bottom: 0;
}

/* Redaktor ma w edytorze pełny zestaw narzędzi, więc w treści mogą pojawić się
   nagłówki, cytaty, obrazy i tabele. Każde z nich musi trzymać rytm strony. */
.pcr-ev-prose h2,
.pcr-ev-prose h3,
.pcr-ev-prose h4,
.pcr-ev-prose h5,
.pcr-ev-prose h6 {
	margin: 24px 0 8px;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-weight: 600;
	line-height: 1.35;
	color: var(--pcr-color-text, #000);
}

.pcr-ev-prose h2 { font-size: 24px; }
.pcr-ev-prose h3 { font-size: 20px; }
.pcr-ev-prose h4 { font-size: 18px; }
.pcr-ev-prose h5,
.pcr-ev-prose h6 { font-size: 16px; }

.pcr-ev-prose > :first-child {
	margin-top: 0;
}

.pcr-ev-prose a {
	color: var(--pcr-color-primary, #547454);
	text-decoration: underline;
}

.pcr-ev-prose blockquote {
	margin: 16px 0;
	padding: 4px 0 4px 20px;
	border-left: 3px solid var(--pcr-color-primary, #547454);
	font-style: italic;
}

.pcr-ev-prose blockquote > :last-child {
	margin-bottom: 0;
}

.pcr-ev-prose img {
	max-width: 100%;
	height: auto;
}

.pcr-ev-prose img.alignleft {
	float: left;
	margin: 0 20px 12px 0;
}

.pcr-ev-prose img.alignright {
	float: right;
	margin: 0 0 12px 20px;
}

.pcr-ev-prose img.aligncenter {
	display: block;
	margin: 12px auto;
}

.pcr-ev-prose .wp-caption {
	max-width: 100%;
}

.pcr-ev-prose .wp-caption-text {
	margin: 6px 0 0;
	font-size: 14px;
	opacity: .75;
}

.pcr-ev-prose hr {
	margin: 24px 0;
	border: 0;
	border-top: 1px solid rgba(0, 0, 0, .12);
}

.pcr-ev-prose table {
	width: 100%;
	margin: 0 0 16px;
	border-collapse: collapse;
}

.pcr-ev-prose th,
.pcr-ev-prose td {
	padding: 8px 10px;
	border: 1px solid rgba(0, 0, 0, .12);
	text-align: left;
}

/* Sekcja kończy się „pływającym" obrazem — bez tego następny nagłówek wskoczyłby obok. */
.pcr-ev-prose::after {
	content: "";
	display: table;
	clear: both;
}

/* Odstęp przed nagłówkiem sekcji daje `padding`, nie `margin`: marginesy sąsiadów
   skleiłyby się do większego z dwóch i sekcje stanęłyby o 40 px za blisko.
   65 px to margines widgetu z oryginału (45) plus przerwa kontenera Elementora (20). */
.pcr-ev-section {
	padding-top: 65px;
	margin-bottom: 0;
}

.pcr-ev-section .pcr-ev-prose {
	margin-top: 20px;
}

/* Wstęp obok zdjęcia prowadzącej — w oryginale dwie równe kolumny. */
.pcr-ev-intro {
	display: grid;
	gap: 30px;
	margin: 20px 0 0;
}

@media (min-width: 768px) {
	.pcr-ev-intro {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
	}
}

.pcr-ev-intro__photo img {
	display: block;
	width: 100%;
	height: auto;
}

/* ── Zapisy ───────────────────────────────────────────────────────────── */

.pcr-ev-signup {
	max-width: var(--pcr-ev-container);
	margin: 30px auto;
	padding: 40px 20px;
	background-color: var(--pcr-ev-green);
	color: #fff;
	text-align: center;
}

.pcr-ev-signup__lead {
	margin: 0;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 35px;
	font-weight: 400;
	line-height: 1.3;
	color: #fff;
}

.pcr-ev-signup__form {
	margin-top: 30px;
}

.pcr-ev-signup__form form.cart {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 15px;
	margin: 0;
}

.pcr-ev-signup__form .quantity input {
	min-height: 48px;
	padding: 10px;
	border: 0;
	border-radius: 3px;
	text-align: center;
}

/* Przycisk zakupu: kremowy, 267 px — jak przycisk wysyłki w oryginalnym formularzu. */
.pcr-ev-signup__form .button {
	width: 267px;
	max-width: 100%;
	padding: 14px 20px;
	border: 0;
	border-radius: 3px;
	background-color: var(--pcr-color-soft, #FFEFD8);
	color: var(--pcr-color-accent, #547454);
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 16px;
	font-weight: 500;
	text-transform: uppercase;
	cursor: pointer;
}

.pcr-ev-signup__form .button:hover,
.pcr-ev-signup__form .button:focus {
	background-color: var(--pcr-color-soft, #FFEFD8);
	color: var(--pcr-color-accent, #547454);
	opacity: .9;
}

.pcr-ev-signup__closed {
	margin: 20px 0 0;
	font-size: 16px;
}

/* ── Prowadzący ───────────────────────────────────────────────────────── */

/* Warsztat może prowadzić więcej niż jedna osoba. Każda dostaje własny blok
   `__person`, a druga i kolejne — odstęp i kreskę u góry, żeby biogramy nie zlewały
   się w jeden ciąg tekstu. */
.pcr-ev-presenter__person + .pcr-ev-presenter__person {
	margin-top: 40px;
	padding-top: 40px;
	border-top: 1px solid rgba(0, 0, 0, .12);
}

.pcr-ev-presenter__inner {
	display: grid;
	gap: 30px;
	align-items: start;
	margin-top: 14px;
}

@media (min-width: 768px) {
	.pcr-ev-presenter__inner {
		grid-template-columns: 190px minmax(0, 1fr);
	}

	/* Bez zdjęcia siatka MUSI zejść do jednej kolumny. Inaczej pierwsza kolumna
	   zostaje pusta, a biogram startuje wcięty o 220 px bez żadnego powodu —
	   tak wyglądał warsztat bez wgranej fotografii. */
	.pcr-ev-presenter__inner--no-photo {
		grid-template-columns: minmax(0, 1fr);
	}
}

.pcr-ev-presenter__photo img {
	display: block;
	width: 100%;
	height: auto;
}

/* Poniżej 768 px siatka jest jednokolumnowa, więc `width: 100%` rozciągało zdjęcie
   na całą szerokość ekranu — portret wielkości pół telefonu. */
@media (max-width: 767px) {
	.pcr-ev-presenter__photo img {
		max-width: 220px;
	}
}

/* Wiersz tekstu miał tu do ~920 px, grubo ponad długość, którą da się czytać bez
   gubienia miejsca. */
.pcr-ev-presenter__body {
	max-width: 70ch;
}

.pcr-ev-presenter__name {
	margin: 0 0 14px;
}

/* ── Opinie ───────────────────────────────────────────────────────────── */

.pcr-ev-quotes {
	position: relative;
	box-sizing: border-box;
	max-width: var(--pcr-ev-container);
	/* 408 px to wysokość slajdu z oryginału; dłuższa opinia może pas rozciągnąć. */
	min-height: 408px;
	margin: 30px auto;
	padding: 40px 60px;
	background-color: #557256;
	color: #fff;
	overflow: hidden;
}

/* Nagłówek i treść mieszczą się w 66 % szerokości — tyle miał `swiper-slide-contents`
   w oryginalnym widgecie. Bez tego ograniczenia tytuł nie łamie się w tym samym miejscu. */
.pcr-ev-quotes__title {
	max-width: 66%;
	margin: 0 auto 15px;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 35px;
	font-weight: 600;
	line-height: 1;
	text-align: center;
	color: #fff;
}

.pcr-ev-quotes__track {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* Dopiero skrypt zamienia listę w karuzelę — bez niego widać wszystkie opinie. */
.pcr-ev-quotes--ready .pcr-ev-quotes__track {
	flex-direction: row;
	gap: 0;
	transition: transform 500ms;
}

.pcr-ev-quote {
	margin: 0;
	font-size: 17px;
	line-height: 1.4;
	text-align: center;
}

.pcr-ev-quotes--ready .pcr-ev-quote {
	flex: 0 0 100%;
	min-width: 100%;
	max-width: 66%;
	margin: 0 auto;
	padding: 0 17%;
	box-sizing: border-box;
}

.pcr-ev-quote cite {
	display: block;
	margin-top: 15px;
	font-style: normal;
	font-weight: 600;
}

.pcr-ev-quotes__nav,
.pcr-ev-quotes__dots {
	display: none;
}

.pcr-ev-quotes--ready .pcr-ev-quotes__nav {
	display: block;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	padding: 0 10px;
	border: 0;
	background: transparent;
	color: #fff;
	font-size: 34px;
	line-height: 1;
	cursor: pointer;
	z-index: 2;
}

.pcr-ev-quotes__nav--prev { left: 10px; }
.pcr-ev-quotes__nav--next { right: 10px; }

.pcr-ev-quotes--ready .pcr-ev-quotes__dots {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin-top: 30px;
}

/* `appearance: none` i zerowanie obramowania są konieczne: motyw nadaje przyciskom
   własne tło i ramkę, przez co kropki wyglądały jak małe prostokąty. */
.pcr-ev-quotes .pcr-ev-quotes__dot {
	appearance: none;
	-webkit-appearance: none;
	width: 7px;
	height: 7px;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	box-shadow: none;
	background: rgba(255, 255, 255, .45);
	cursor: pointer;
}

.pcr-ev-quotes .pcr-ev-quotes__dot.is-active {
	background: #fff;
}

.pcr-ev-quotes .pcr-ev-quotes__nav {
	appearance: none;
	-webkit-appearance: none;
	box-shadow: none;
}

/* ── FAQ, polecenie, powrót ───────────────────────────────────────────── */

.pcr-ev-faq__q {
	margin: 14px 0 0;
}

.pcr-ev-faq__a {
	margin: 4px 0 0;
}

.pcr-ev-share {
	margin: 45px 0;
}

.pcr-ev-share p {
	margin: 0;
	font-size: 24px;
	line-height: 1.4;
	text-align: center;
	color: #557256;
}

.pcr-ev-back {
	margin: 0 0 45px;
}

.pcr-ev-back a {
	color: var(--pcr-color-primary, #547454);
	font-weight: 600;
	text-decoration: none;
}

/* ── Telefon ──────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
	.pcr-ev-hero__title { font-size: 34px; }
	.pcr-ev-hero__inner { padding-bottom: 50px; }
	.pcr-ev-hero__shape svg { height: 25px; }

	/* Trzy elementy w rzędzie nie mieszczą się na telefonie — układamy je w kolumnę. */
	.pcr-ev-hero__meta {
		flex-direction: column;
		gap: 25px;
	}

	.pcr-ev-hero__item,
	.pcr-ev-hero__item--place,
	.pcr-ev-hero__item--date {
		flex-direction: column;
		text-align: center;
	}

	.pcr-ev-signup__lead { font-size: 24px; }
	.pcr-ev-quotes { padding: 30px 20px; }
	.pcr-ev-quotes__title { font-size: 22px; }
	.pcr-ev-quotes--ready .pcr-ev-quote { padding: 0; }
	.pcr-ev-quotes--ready .pcr-ev-quotes__nav { display: none; }
	.pcr-ev-share p { font-size: 19px; }
}

/* ── Strony sklepu WooCommerce ─────────────────────────────────────────────
   Sklep, produkt, koszyk i zamówienie korzystają z domyślnych szablonów
   WooCommerce, których paleta (fiolet, żółć) nie ma nic wspólnego z serwisem.
   Nie przebudowujemy tu szablonów — sprowadzamy tylko kolory przycisków i cen
   do palety motywu (pkt 61). Arkusz i tak ładuje się na tych stronach. */

.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
	background-color: var(--pcr-color-primary, #547454);
	color: #fff;
	border-radius: 3px;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-weight: 500;
}

.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
	background-color: var(--pcr-color-primary, #547454);
	color: #fff;
	opacity: .9;
}

.woocommerce .button.disabled,
.woocommerce a.button.disabled,
.woocommerce button.button.disabled {
	background-color: rgba(0, 0, 0, .12);
	color: rgba(0, 0, 0, .55);
}

.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price {
	color: var(--pcr-color-primary, #547454);
	font-weight: 600;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-weight: 600;
	color: var(--pcr-color-text, #000);
}

.woocommerce div.product .product_title {
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-weight: 600;
}

/* Zakładki opisu produktu — aktywna w zieleni zamiast domyślnej szarości. */
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
	border-bottom-color: #fff;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--pcr-color-primary, #547454);
	font-weight: 600;
}

/* Bloki koszyka i zamówienia mają własne zmienne — podmieniamy kolor akcentu. */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	--wc-primary: var(--pcr-color-primary, #547454);
	--wp--preset--color--primary: var(--pcr-color-primary, #547454);
}

.wc-block-components-button:not(.is-link) {
	background-color: var(--pcr-color-primary, #547454);
	border-radius: 3px;
}

.wc-block-components-button:not(.is-link):hover {
	background-color: var(--pcr-color-primary, #547454);
	opacity: .9;
}

/* ── Moje konto ────────────────────────────────────────────────────────────
   WooCommerce daje tu gołą listę odnośników w kolumnie pływającej. Zamieniamy
   ją na czytelną nawigację i dwukolumnowy układ w palecie serwisu, bez ruszania
   szablonów WooCommerce (pkt 9) — wszystko robi arkusz, który i tak się tu ładuje. */

.woocommerce-account .woocommerce {
	max-width: var(--pcr-ev-container, 1140px);
	/* Motyw wciska kontener o 80 px od lewej, przez co kolumna z nawigacją nie
	   trzymała linii z tytułem strony. */
	margin: 0 auto;
	padding: 0;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
}

/* Tytuł strony i nagłówki zakładek — krój akcentowy, jak nagłówki serwisu. */
.woocommerce-account .entry-title,
.woocommerce-account .page-title,
.woocommerce-account h1.entry-title {
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-weight: 600;
	color: var(--pcr-color-primary, #547454);
}

/* `:not()` chroni nasze komponenty: bez tego ta reguła — bardziej szczegółowa —
   nadpisywała krój i kolor tytułów wydarzeń oraz biletów. */
.woocommerce-account .woocommerce-MyAccount-content h2:not([class*="pcr-"]),
.woocommerce-account .woocommerce-MyAccount-content h3:not([class*="pcr-"]) {
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 18px;
	font-weight: 600;
	color: var(--pcr-color-text, #000);
}

/* Dwie kolumny zamiast domyślnych pływających — układ nie rozjeżdża się przy
   długiej treści i sam składa się w jedną kolumnę na telefonie. */
@media (min-width: 768px) {
	/* Flex, nie grid: kolejność wynika wprost z kolejności w dokumencie, więc żaden
	   dodatkowy element wstawiony przez WooCommerce nie przesunie nawigacji. */
	.woocommerce-account .woocommerce {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		gap: 40px;
	}

	/* WooCommerce trzyma na kontenerze pseudoelementy czyszczące pływanie
	   (`::before`/`::after` z `display: table`). W układzie flex stają się one
	   pełnoprawnymi elementami i spychają nawigację o własną szerokość w prawo —
	   dlatego trzeba je wyłączyć, a nie tylko wyzerować marginesy nawigacji. */
	.woocommerce-account .woocommerce::before,
	.woocommerce-account .woocommerce::after {
		display: none;
	}

	.woocommerce-account .woocommerce > .woocommerce-notices-wrapper {
		flex: 0 0 100%;
	}

	/* Selektor z nazwą znacznika — motyw wcina nawigację regułą o wyższej
	   szczegółowości niż sama klasa. */
	.woocommerce-account div.woocommerce > nav.woocommerce-MyAccount-navigation {
		flex: 0 0 260px;
		float: none;
		width: auto;
		margin: 0;
		padding: 0;
		order: 1;
	}

	.woocommerce-account .woocommerce-MyAccount-content {
		/* min-width: 0 — bez tego długa tabela rozpycha kolumnę poza kontener. */
		flex: 1 1 0;
		min-width: 0;
		float: none;
		width: auto;
		margin: 0;
		order: 2;
	}
}

/* ── Nawigacja konta ──────────────────────────────────────────────────── */

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 6px;
	overflow: hidden;
	background: #fff;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
	margin: 0;
	border-bottom: 1px solid rgba(0, 0, 0, .08);
}

.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
	border-bottom: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 14px 18px;
	/* Lewa krawędź rezerwuje miejsce na wskaźnik aktywnej zakładki, żeby tekst
	   nie przeskakiwał po kliknięciu. */
	border-left: 4px solid transparent;
	color: var(--pcr-color-text, #000);
	font-size: 15px;
	line-height: 1.4;
	text-decoration: none;
	transition: background-color .15s ease, color .15s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation li a:focus {
	background-color: var(--pcr-color-soft, #FFEFD8);
	color: var(--pcr-color-primary, #547454);
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	border-left-color: var(--pcr-color-primary, #547454);
	background-color: var(--pcr-color-soft, #FFEFD8);
	color: var(--pcr-color-primary, #547454);
	font-weight: 600;
}

/* Wylogowanie odsuwamy wizualnie — to nie jest zakładka jak pozostałe. */
.woocommerce-account .woocommerce-MyAccount-navigation-link--customer-logout a {
	color: rgba(0, 0, 0, .55);
}

/* ── Treść zakładek ───────────────────────────────────────────────────── */

.woocommerce-account .woocommerce-MyAccount-content {
	font-size: 16px;
	line-height: 1.6;
}

.woocommerce-account .woocommerce-MyAccount-content a:not(.button) {
	color: var(--pcr-color-primary, #547454);
	text-decoration: underline;
}

.woocommerce-account .woocommerce-MyAccount-content p {
	margin: 0 0 16px;
}

/* Tabele zamówień i pobrań — lekka siatka zamiast domyślnych grubych ramek. */
.woocommerce-account .woocommerce-MyAccount-content table.shop_table {
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 6px;
	border-collapse: separate;
	border-spacing: 0;
	font-size: 15px;
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table thead th {
	padding: 14px 16px;
	border: 0;
	border-bottom: 1px solid rgba(0, 0, 0, .1);
	background-color: var(--pcr-color-soft, #FFEFD8);
	color: var(--pcr-color-primary, #547454);
	font-weight: 600;
	text-align: left;
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table tbody td {
	padding: 14px 16px;
	border: 0;
	border-bottom: 1px solid rgba(0, 0, 0, .07);
	/* WooCommerce podświetla komórkę z numerem zamówienia szarym tłem i ramką —
	   w tej tabeli wygląda to jak przypadkowy błąd. */
	background: transparent;
	vertical-align: middle;
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table tbody tr:last-child td {
	border-bottom: 0;
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table .button {
	margin: 0;
	padding: 8px 16px;
	font-size: 14px;
}

/* Formularze: adres, dane konta, zmiana hasła. */
.woocommerce-account .woocommerce-MyAccount-content form .form-row {
	padding: 0;
	margin: 0 0 16px;
}

.woocommerce-account .woocommerce-MyAccount-content input[type="text"],
.woocommerce-account .woocommerce-MyAccount-content input[type="email"],
.woocommerce-account .woocommerce-MyAccount-content input[type="tel"],
.woocommerce-account .woocommerce-MyAccount-content input[type="password"],
.woocommerce-account .woocommerce-MyAccount-content select {
	padding: 10px 12px;
	border: 1px solid rgba(0, 0, 0, .2);
	border-radius: 3px;
	font-family: inherit;
	font-size: 15px;
}

.woocommerce-account .woocommerce-MyAccount-content fieldset {
	margin: 24px 0 0;
	padding: 20px;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 6px;
}

.woocommerce-account .woocommerce-MyAccount-content fieldset legend {
	padding: 0 8px;
	font-weight: 600;
	color: var(--pcr-color-primary, #547454);
}

/* Komunikaty w koncie — ten sam wygląd co na stronie wydarzenia. */
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-info {
	border: 0;
	border-left: 4px solid var(--pcr-color-primary, #547454);
	border-radius: 3px;
	background-color: var(--pcr-color-soft, #FFEFD8);
	color: var(--pcr-color-text, #000);
}

.woocommerce-account .woocommerce-message::before,
.woocommerce-account .woocommerce-info::before {
	color: var(--pcr-color-primary, #547454);
}

.woocommerce-account .woocommerce-error {
	border: 0;
	border-left: 4px solid #b32d2e;
	border-radius: 3px;
	background-color: rgba(179, 45, 46, .07);
	color: var(--pcr-color-text, #000);
}

/* ── Nasze zakładki: wydarzenia i bilety ──────────────────────────────── */

.pcr-account-heading {
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 18px;
	font-weight: 600;
	color: var(--pcr-color-text, #000);
}

.pcr-account-event {
	border-color: rgba(0, 0, 0, .1);
}

.pcr-account-event__title {
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-size: 20px;
	font-weight: 600;
	color: var(--pcr-color-primary, #547454);
}

.pcr-ticket__card {
	border-color: rgba(0, 0, 0, .1);
}

.pcr-ticket__title {
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-weight: 600;
	color: var(--pcr-color-primary, #547454);
}

.pcr-ticket__code-value {
	color: var(--pcr-color-primary, #547454);
}

/* ── Logowanie i rejestracja ──────────────────────────────────────────── */

.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register {
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 6px;
	padding: 24px;
}

.woocommerce-account .woocommerce-form-login label,
.woocommerce-account .woocommerce-form-register label {
	font-size: 15px;
	font-weight: 500;
}

.woocommerce-account .woocommerce-form-login input[type="text"],
.woocommerce-account .woocommerce-form-login input[type="password"],
.woocommerce-account .woocommerce-form-register input[type="email"],
.woocommerce-account .woocommerce-form-register input[type="text"] {
	padding: 10px 12px;
	border: 1px solid rgba(0, 0, 0, .2);
	border-radius: 3px;
	font-family: inherit;
}

.woocommerce-account .lost_password a {
	color: var(--pcr-color-primary, #547454);
}

@media (max-width: 767px) {
	.woocommerce-account .woocommerce-MyAccount-navigation {
		margin-bottom: 24px;
	}
}

/* Kafle skrótów w kokpicie konta. */

.pcr-account-cards {
	display: grid;
	gap: 20px;
	margin: 0 0 24px;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.pcr-account-card {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 20px;
	border: 1px solid rgba(0, 0, 0, .1);
	border-left: 4px solid var(--pcr-color-primary, #547454);
	border-radius: 6px;
	background: var(--pcr-color-soft, #FFEFD8);
	color: var(--pcr-color-text, #000);
	text-decoration: none;
	transition: opacity .15s ease;
}

.pcr-account-card:hover,
.pcr-account-card:focus {
	opacity: .85;
	color: var(--pcr-color-text, #000);
	text-decoration: none;
}

.pcr-account-card__count {
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-size: 34px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--pcr-color-primary, #547454);
}

.pcr-account-card__label {
	font-size: 15px;
	font-weight: 600;
}

.pcr-account-card__cta {
	font-size: 13px;
	text-decoration: underline;
	opacity: .75;
}

.pcr-account-hint {
	margin: 0 0 24px;
	font-size: 14px;
	opacity: .75;
}

/* ── Sklep: kafel poradnika ────────────────────────────────────────────────
   W katalogu zostają wyłącznie poradniki, więc kafel jest zbudowany wokół okładki.
   Okładki nie przyciemniamy ani nie przycinamy — to ona jest treścią kafla. */

.woocommerce ul.products.columns-1,
.woocommerce ul.products.columns-2,
.woocommerce ul.products.columns-3,
.woocommerce ul.products.columns-4,
.woocommerce ul.products.columns-5,
.woocommerce ul.products.columns-6 {
	display: grid;
	gap: 40px;
	/* Górna granica szerokości kolumny: okładka rozciągnięta na pół ekranu przy dwóch
	   produktach wyglądałaby jak błąd. `start` trzyma kafle przy lewej krawędzi,
	   w jednej linii z tytułem strony. */
	grid-template-columns: repeat(auto-fill, minmax(220px, 260px));
	justify-content: start;
	max-width: 1080px;
	margin: 2rem 0;
	padding: 0;
	list-style: none;
}

.woocommerce ul.products li.product.pcr-shop-card {
	display: flex;
	flex-direction: column;
	width: auto;
	margin: 0;
	padding: 0;
	float: none;
	text-align: left;
}

.woocommerce ul.products li.product.pcr-shop-card::before,
.woocommerce ul.products li.product.pcr-shop-card::after {
	content: none;
}

/* WooCommerce trzyma na liście produktów pseudoelementy czyszczące pływanie. W układzie
   grid stają się one pełnoprawnymi elementami i zajmują pierwsze komórki, spychając
   kafle w prawo — ta sama pułapka co przy nawigacji „Mojego konta". */
.woocommerce ul.products::before,
.woocommerce ul.products::after {
	display: none;
}

.pcr-shop-card__cover {
	display: block;
	overflow: hidden;
	border-radius: 6px;
	/* Cień daje okładce fizyczność książki bez dodatkowej grafiki. */
	box-shadow: 0 6px 18px rgba(0, 0, 0, .16);
	transition: transform .3s ease, box-shadow .3s ease;
}

.pcr-shop-card__cover:hover,
.pcr-shop-card__cover:focus {
	transform: translateY(-4px);
	box-shadow: 0 12px 26px rgba(0, 0, 0, .22);
}

.woocommerce ul.products li.product .pcr-shop-card__image {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	margin: 0;
}

.pcr-shop-card__body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 18px 2px 0;
}

.woocommerce ul.products li.product .pcr-shop-card__title {
	margin: 0;
	padding: 0;
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-size: 22px;
	font-weight: 600;
	line-height: 1.25;
}

.pcr-shop-card__title a {
	color: var(--pcr-color-primary, #547454);
	text-decoration: none;
}

.pcr-shop-card__meta {
	margin: 0;
	font-size: 14px;
	letter-spacing: .04em;
	text-transform: uppercase;
	opacity: .7;
}

.woocommerce ul.products li.product .pcr-shop-card__price {
	margin: 4px 0 0;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 20px;
	font-weight: 600;
	color: var(--pcr-color-primary, #547454);
}

.pcr-shop-card__action {
	margin-top: 12px;
}

.woocommerce ul.products li.product .pcr-shop-card__action .button {
	display: block;
	width: 100%;
	margin: 0;
	padding: 12px 20px;
	text-align: center;
	font-size: 15px;
}

/* ── Strona poradnika ─────────────────────────────────────────────────────
   Ten sam język wizualny co strona wydarzenia: zielone pasmo, ukośne ścięcie,
   typografia treści i zielony pas zakupu. */

.pcr-guide {
	--pcr-ev-container: 1140px;
	--pcr-ev-green: var(--pcr-color-primary, #547454);
	color: var(--pcr-color-text, #000);
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
}

/* Strona produktu siedzi w kontenerze motywu, a pasmo ma sięgać krawędzi okna.
   Rozciągamy więc TŁO, nie sam nagłówek: dzięki temu treść dziedziczy szerokość
   kontenera motywu i trzyma linię z tekstem poniżej na każdej szerokości ekranu.
   Rozciągnięcie całego nagłówka rozjeżdżało układ tam, gdzie motyw zwęża kontener. */
.pcr-guide-hero {
	position: relative;
	/* Nagłówek wydarzenia przycina zawartość (`overflow: hidden`), żeby powiększane tło
	   nie wychodziło poza pasmo. Tutaj tła nie ma, a przycinanie uniemożliwiłoby
	   rozciągnięcie warstwy koloru na całą szerokość okna. */
	overflow: visible;
}

.pcr-guide-hero .pcr-ev-hero__overlay,
.pcr-guide-hero .pcr-ev-hero__shape {
	width: 100vw;
	left: 50%;
	/* `inset: 0` z reguły bazowej trzyma prawą krawędź — bez wyzerowania szerokość
	   100vw nie ma jak zadziałać. */
	right: auto;
	transform: translateX(-50%);
}

.pcr-guide-hero .pcr-ev-hero__shape {
	transform: translateX(-50%) rotate(180deg);
}

.pcr-guide-hero .pcr-ev-hero__overlay {
	background-color: var(--pcr-ev-green);
}

.pcr-guide-hero .pcr-ev-hero__inner {
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}

/* Przycisk na ciemnym paśmie: odwrócony kontrast. Selektor z dwiema klasami, żeby przebić
   obramowany wariant `.pcr-button` używany na kaflach. */
.pcr-guide .pcr-button.pcr-button--invert {
	display: inline-block;
	padding: 14px 32px;
	border: 0;
	border-radius: 3px;
	background: #fff;
	color: var(--pcr-color-primary, #547454);
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: normal;
	line-height: 1.3;
	text-transform: none;
	text-decoration: none;
}

.pcr-guide .pcr-button.pcr-button--invert:hover,
.pcr-guide .pcr-button.pcr-button--invert:focus {
	background: #fff;
	color: var(--pcr-color-primary, #547454);
	opacity: .9;
}

.pcr-guide-hero__inner {
	display: grid;
	gap: 40px;
	align-items: center;
}

@media (min-width: 860px) {
	.pcr-guide-hero__inner {
		grid-template-columns: 280px minmax(0, 1fr);
	}
}

.pcr-guide-hero__cover img {
	display: block;
	width: 100%;
	max-width: 280px;
	height: auto;
	border-radius: 6px;
	box-shadow: 0 14px 30px rgba(0, 0, 0, .3);
}

.pcr-guide-hero .pcr-ev-hero__title {
	text-align: left;
}

.pcr-guide-hero__lead {
	margin: 20px 0 0;
	font-size: 18px;
	line-height: 1.6;
}

.pcr-guide-hero__lead p {
	margin: 0;
}

.pcr-guide-hero__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 30px;
	margin: 24px 0 0;
	padding: 0;
	list-style: none;
}

.pcr-guide-hero__facts li {
	display: flex;
	flex-direction: column;
	font-size: 17px;
	line-height: 1.4;
}

.pcr-guide-hero__facts span {
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .09em;
	text-transform: uppercase;
	opacity: .78;
}

.pcr-guide-hero__price {
	margin: 24px 0 0;
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-size: 34px;
	font-weight: 600;
}

.pcr-guide-hero__price del {
	opacity: .6;
	font-size: .7em;
}

.pcr-guide .pcr-ev-hero__action {
	margin-top: 24px;
}

/* Domyślne elementy WooCommerce, których nasz układ nie używa. */
.pcr-guide .woocommerce-product-gallery,
.pcr-guide .product_meta,
.pcr-guide .woocommerce-tabs,
.pcr-guide .related.products,
.pcr-guide .up-sells {
	display: none;
}

@media (max-width: 767px) {
	.pcr-guide-hero__cover img {
		max-width: 200px;
		margin: 0 auto;
	}

	.pcr-guide-hero .pcr-ev-hero__title {
		text-align: center;
	}

	.pcr-guide-hero__facts {
		justify-content: center;
	}

	.pcr-guide-hero__lead,
	.pcr-guide-hero__price,
	.pcr-guide .pcr-ev-hero__action {
		text-align: center;
	}
}

/* ── Przypinka formy udziału ───────────────────────────────────────────────
   Lista obejmuje wydarzenia stacjonarne i online, więc forma musi być widoczna
   na pierwszy rzut oka — na kaflu i w nagłówku wydarzenia. */

.pcr-event__badge {
	display: inline-block;
	padding: 6px 14px;
	border-radius: 999px;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .09em;
	line-height: 1;
	text-transform: uppercase;
	white-space: nowrap;
}

.pcr-event__badge--online {
	background: var(--pcr-color-primary, #547454);
	color: #fff;
}

.pcr-event__badge--onsite {
	background: var(--pcr-color-soft, #FFEFD8);
	color: #3f444b;
}

/* Na okładce przypinka leży nad nakładką, żeby nie ciemniała razem ze zdjęciem. */
/* Wydarzenie bez zdjęcia — okładka zostaje, wypełniona kolorem marki. */
.pcr-event__image--empty {
	background-color: var(--pcr-color-soft, #FFEFD8);
}

/* Przypinka otwiera blok treści — pod zdjęciem, nad nazwą wydarzenia. */
.pcr-event__badge-row {
	margin: 0 0 18px;
	text-align: center;
}

/* Domyślnie przypinka stoi nad tytułem. Nagłówek na wąskich ekranach i tak rośnie
   z treścią, więc te 30 px nic nie psuje, a tytuł ma pełną szerokość dla siebie. */
.pcr-ev-hero__badge-row {
	margin: 0 0 6px;
	text-align: center;
}

/* Od szerokości, przy której nagłówek trzyma dokładnie 378 px z oryginału, przypinka
   przenosi się do rogu — jak na kaflu listy. W przepływie podniosłaby wysokość
   nagłówka i rozjechała układ. Tytuł jest tam wyśrodkowany i znacznie węższy od
   kontenera, więc nie wchodzi w narożnik. */
@media (min-width: 1200px) {
	.pcr-ev-hero__badge-row {
		position: absolute;
		top: 16px;
		left: 20px;
		z-index: 3;
		margin: 0;
	}
}

/* W nagłówku tło jest ciemne, więc wariant „stacjonarne” musi zachować kontrast,
   a „online” nie może zlać się z zielenią pasma. */
.pcr-ev-hero__badge-row .pcr-event__badge--online {
	background: rgba(255, 255, 255, .18);
	border: 1px solid rgba(255, 255, 255, .55);
	color: #fff;
}

/* ── Dane dostępu do spotkania online ──────────────────────────────────────
   Widoczne wyłącznie w oknie dostępu, w bilecie i w „Moim koncie". */

.pcr-meeting-access {
	margin: 14px 0 6px;
	padding: 14px 16px;
	border: 1px solid var(--pcr-color-soft, #FFEFD8);
	border-radius: 10px;
	background: #fbfaf7;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 14px;
	line-height: 1.6;
}

.pcr-meeting-access dt {
	margin: 0;
	font-weight: 600;
	color: #6b7178;
	font-size: 12px;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.pcr-meeting-access dd {
	margin: 2px 0 10px;
	/* Adresy spotkań bywają bardzo długie — muszą łamać się w kaflu, a nie go rozpychać. */
	word-break: break-all;
}

.pcr-meeting-access dd:last-child {
	margin-bottom: 0;
}

.pcr-meeting-access__password {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 6px;
	background: var(--pcr-color-soft, #FFEFD8);
	color: #3f444b;
	font-size: 15px;
	letter-spacing: .04em;
	word-break: break-all;
}

.pcr-meeting-access__note {
	margin: 0 0 6px;
	color: #6b7178;
	font-size: 12px;
}

/* ── Karta wydarzenia w „Moim koncie" ──────────────────────────────────────
   Miniatura z lewej, treść z prawej. Każdy element karty znika, gdy nie ma
   danych, więc wydarzenie bez zdjęcia i opisu musi wyglądać dobrze samo z siebie. */

.pcr-account-event {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0 18px;
	padding: 0;
	overflow: hidden;
}

@media (min-width: 600px) {
	/* Miniatura tylko tam, gdzie jest na nią miejsce — niżej rozpychałaby treść. */
	.pcr-account-event:has(.pcr-account-event__media) {
		grid-template-columns: 150px minmax(0, 1fr);
	}
}

/* Flex, nie zwykły blok: rozciągnięcie komórki siatki daje wysokość UŻYTKOWĄ, a procent
   na obrazku potrzebuje wysokości JAWNEJ. Bez tego miniatura kończyła się w połowie karty. */
.pcr-account-event__media {
	display: flex;
	margin: 0;
	line-height: 0;
}

.pcr-account-event__image {
	align-self: stretch;
	width: 100%;
	min-height: 120px;
	object-fit: cover;
}

/* Poniżej progu miniatura przechodzi nad treść i zajmuje pełną szerokość — bez limitu
   urosłaby do wysokości wynikającej z proporcji zdjęcia i zepchnęła treść poniżej ekranu. */
@media (max-width: 599px) {
	.pcr-account-event__image {
		max-height: 170px;
	}
}

.pcr-account-event__body {
	padding: 1.1rem 1.25rem;
	min-width: 0;
}

.pcr-account-event__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	margin: 0 0 10px;
}

.pcr-account-event__countdown {
	display: inline-block;
	padding: 5px 12px;
	border-radius: 999px;
	background: var(--pcr-color-soft, #FFEFD8);
	color: #3f444b;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
}

.pcr-account-event__excerpt {
	margin: .7rem 0 0;
	font-size: .95em;
	line-height: 1.6;
}

.pcr-account-event__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 10px;
	margin: .7rem 0 0;
	font-size: .88em;
	opacity: .75;
}

/* Kropka rozdzielająca kolejne fakty — bez pustego znaku na początku wiersza. */
.pcr-account-event__facts span + span::before {
	content: "·";
	margin-right: 10px;
}

/* Siatka, nie flex: motyw nadaje przyciskom własną wyściółkę, więc przy zwykłym zawijaniu
   dwa przyciski rozjeżdżały się na dwie linie mimo wolnego miejsca. Kolumny o równej
   szerokości ustawiają je obok siebie niezależnie od tego, co narzuci motyw. */
.pcr-account-event__actions {
	display: grid;
	/* Kolumny szerokości treści, nie równe — inaczej dłuższa etykieta łamała się w środku
	   przycisku, mimo że w rzędzie było jeszcze miejsce. */
	grid-template-columns: repeat(auto-fit, minmax(0, max-content));
	justify-content: start;
	gap: .6rem;
	margin-top: .9rem;
}

.pcr-account-event__actions a {
	white-space: nowrap;
	text-align: center;
}

.pcr-account-event > .pcr-account-event__body > .pcr-account-event__hint,
.pcr-account-event__body > .pcr-account-event__hint {
	margin: .6rem 0 0;
}

.pcr-account-event__calendar {
	margin: .6rem 0 0;
	font-size: .9em;
}

/* Przycisk drugorzędny: obrys zamiast wypełnienia, żeby „Dołącz" i „Pokaż bilet"
   pozostały głównym działaniem na karcie.

   Selektor jest celowo mocny: motyw nadaje `.button` zielone tło i szerokość bloku,
   przez co przyciski układały się jeden pod drugim zamiast w rzędzie. */
.pcr-account-event__actions a.woocommerce-Button,
.pcr-account-event__actions a.button {
	display: inline-block;
	width: auto;
	/* Kolumna konta ma ~290 px; przy domyślnej wyściółce motywu dwa przyciski nie mieszczą
	   się w rzędzie i łamią się na dwie linie. Skracamy wyściółkę, nie etykiety. */
	padding-left: 16px;
	padding-right: 16px;
}

.pcr-account-event__actions a.pcr-button--ghost,
.pcr-account-event__actions a.pcr-button--ghost:hover,
.pcr-account-event__actions a.pcr-button--ghost:focus {
	background: transparent;
	border: 1px solid var(--pcr-color-primary, #547454);
	color: var(--pcr-color-primary, #547454);
}

/* --------------------------------------------------------------------------
   Zapis na listę mailingową

   Pierwsza wersja była pudłem w bladej zieleni, szerokim na 1140 px, z własnym
   krojem przycisku — obok kafli warsztatów wyglądała jak wklejona z innej strony.
   Teraz trzyma się języka, który już tu jest: wyśrodkowany nagłówek w kroju
   nagłówkowym i zieleni marki (jak `.pcr-ev-share`), wąska kolumna i przycisk
   `.pcr-button`, czyli dokładnie ten sam co „sprawdź" na kaflach.
   -------------------------------------------------------------------------- */

.pcr-newsletter {
	/* Wyraźnie węższy niż siatka kafli (1080 px): to jedno pole i przycisk,
	   a nie trzy kolumny treści. Szeroki formularz wygląda na rozciągnięty. */
	max-width: 620px;
	margin: 70px auto;
	padding: 0 20px;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	color: var(--pcr-color-text, #3f444b);
	text-align: center;
}

.pcr-newsletter__heading {
	margin: 0 0 12px;
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-size: 30px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--pcr-color-primary, #547454);
}

.pcr-newsletter__intro {
	margin: 0 0 26px;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.6;
}

.pcr-newsletter__fields {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 18px;
}

.pcr-newsletter__field {
	margin: 0;
	flex: 1 1 150px;
}

.pcr-newsletter__field--email {
	flex: 2 1 200px;
}

.pcr-newsletter__field--submit {
	flex: 0 0 auto;
}

.pcr-newsletter__fields input {
	width: 100%;
	box-sizing: border-box;
	/* Ta sama wysokość i ten sam promień co `.pcr-button`, żeby pole i przycisk
	   stały w jednej linii bez przesunięcia. */
	padding: 12px 14px;
	border: 1px solid #c9cdc7;
	border-radius: 3px;
	background: #fff;
	font-family: inherit;
	font-size: 15px;
	font-weight: 300;
	line-height: 14px;
	color: inherit;
}

.pcr-newsletter__fields input::placeholder {
	color: #8b908a;
	opacity: 1;
}

.pcr-newsletter__fields input:focus {
	outline: 0;
	border-color: var(--pcr-color-primary, #547454);
}

.pcr-newsletter__field--submit .pcr-button {
	cursor: pointer;
	/* `.pcr-button` jest zaprojektowany dla <a>; dla <button> trzeba zdjąć
	   domyślne tło i wyrównać wysokość. */
	background: transparent;
	white-space: nowrap;
}

.pcr-newsletter__field--submit .pcr-button:hover,
.pcr-newsletter__field--submit .pcr-button:focus {
	background: var(--pcr-color-primary, #547454);
	border-color: var(--pcr-color-primary, #547454);
	color: #fff;
}

.pcr-newsletter__consent {
	margin: 0 0 10px;
	text-align: left;
}

.pcr-newsletter__consent label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 13px;
	font-weight: 300;
	line-height: 1.5;
	cursor: pointer;
}

.pcr-newsletter__consent input {
	margin: 2px 0 0;
	flex: 0 0 auto;
}

.pcr-newsletter__legal {
	margin: 0;
	font-size: 12px;
	font-weight: 300;
	line-height: 1.5;
	text-align: left;
	color: #6b706a;
}

.pcr-newsletter__legal a {
	color: inherit;
	text-decoration: underline;
}

.pcr-newsletter__done,
.pcr-newsletter__error {
	margin: 0;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.6;
}

.pcr-newsletter__error {
	color: #a4262c;
}

/* Pod opisem warsztatu sekcja siedzi już w kontenerze treści, więc nie potrzebuje
   własnego marginesu bocznego ani tak dużego odstępu u góry. */
.pcr-newsletter--pod-wydarzeniem {
	margin-top: 20px;
}

.pcr-newsletter--po-zakupie {
	margin: 45px auto;
	text-align: left;
}

.pcr-newsletter--po-zakupie .pcr-newsletter__heading,
.pcr-newsletter--po-zakupie .pcr-newsletter__intro {
	text-align: left;
}

@media (max-width: 600px) {
	.pcr-newsletter {
		margin: 45px auto;
	}

	.pcr-newsletter__heading {
		font-size: 24px;
	}

	.pcr-newsletter__field,
	.pcr-newsletter__field--email,
	.pcr-newsletter__field--submit {
		flex: 1 1 100%;
	}

	.pcr-newsletter__field--submit .pcr-button {
		width: 100%;
	}
}

/* --------------------------------------------------------------------------
   Dokumenty prawne (polityka, regulamin, odstąpienie)

   Długi tekst prawny czyta się źle w szerokiej kolumnie — stąd wąska miara
   i wyraźne odstępy między paragrafami.
   -------------------------------------------------------------------------- */

.pcr-legal {
	max-width: 760px;
	margin: 0 auto;
	font-family: var(--pcr-font-body, "Poppins"), sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.7;
	color: var(--pcr-color-text, #3f444b);
}

.pcr-legal__lead {
	margin: 0 0 40px;
	font-size: 14px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #6b706a;
}

.pcr-legal h2 {
	margin: 44px 0 14px;
	font-family: var(--pcr-font-heading, "Noto Serif Khojki"), serif;
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--pcr-color-primary, #547454);
}

.pcr-legal h2:first-child {
	margin-top: 0;
}

.pcr-legal p {
	margin: 0 0 14px;
}

.pcr-legal ul,
.pcr-legal ol {
	margin: 0 0 18px;
	padding-left: 24px;
}

.pcr-legal li {
	margin-bottom: 7px;
}

.pcr-legal a {
	color: var(--pcr-color-primary, #547454);
}

@media (max-width: 600px) {
	.pcr-legal {
		font-size: 15px;
	}

	.pcr-legal h2 {
		margin-top: 34px;
		font-size: 19px;
	}
}