/*
 * Privacy / Terms — styl strony prawnej (mockup Privacy.html / Terms.html
 * .legal-page). BEZ dedykowanego bloku: redaktor dodaje zwykłe bloki
 * (Heading / Paragraph / List), a te reguły je stylują. Wspólne dla obu
 * szablonów (body.page-slug-privacy / body.page-slug-terms).
 *
 * Warstwa templates (jak assets/css/single-resource.css, styles/article.css).
 * Dekoracyjne pole kropek (.legal-dots) wstrzykuje inc/legal-pages.php,
 * animuje assets/js/legal-page.js.
 */

@layer templates {

.page-slug-privacy .entry-content,
.page-slug-terms .entry-content {
	position: relative;
	overflow: hidden;
	max-width: var(--content-max, 1488px);
	margin: 0 auto;
	padding: clamp(72px, 9vh, 132px) var(--sec-px, 80px) clamp(64px, 8vh, 112px);
	box-sizing: border-box;
}

/* Kolumna treści — wszystko poza dekoracyjnym canvasem, wąsko i nad kropkami. */
.page-slug-privacy .entry-content > :not(.legal-dots),
.page-slug-terms .entry-content > :not(.legal-dots) {
	position: relative;
	z-index: 1;
	max-width: 720px;
}

/* Dekoracyjne pole kropek po prawej (mockup .legal-dots). */
.page-slug-privacy .legal-dots,
.page-slug-terms .legal-dots {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: min(48%, 700px);
	max-width: none;
	z-index: 0;
	pointer-events: none;
	animation: legalDotsFade 1.2s ease both;
}

@keyframes legalDotsFade {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

/* Tytuł strony — pierwszy nagłówek (Heading H1). */
.page-slug-privacy .entry-content h1,
.page-slug-terms .entry-content h1 {
	font-family: var(--font-display, 'Poppins', Helvetica, Arial, sans-serif);
	font-weight: 400;
	font-size: clamp(34px, 5vw, 56px);
	line-height: 1.08;
	letter-spacing: -0.5px;
	color: var(--ink, #050505);
	margin: 0 0 38px;
}

/* Nagłówki sekcji (Heading H2). */
.page-slug-privacy .entry-content h2,
.page-slug-terms .entry-content h2 {
	font-family: var(--font-display, 'Poppins', Helvetica, Arial, sans-serif);
	font-weight: 500;
	font-size: 20px;
	line-height: 1.3;
	color: var(--ink, #050505);
	margin: 40px 0 12px;
}

.page-slug-privacy .entry-content p,
.page-slug-terms .entry-content p {
	font-family: var(--font-sans, 'Poppins', sans-serif);
	font-size: 16px;
	line-height: 1.75;
	color: rgb(5 5 5 / 0.78);
	margin: 0 0 18px;
}

.page-slug-privacy .entry-content ul,
.page-slug-terms .entry-content ul {
	margin: 0 0 18px;
	padding-left: 20px;
}

.page-slug-privacy .entry-content li,
.page-slug-terms .entry-content li {
	font-family: var(--font-sans, 'Poppins', sans-serif);
	font-size: 16px;
	line-height: 1.7;
	color: rgb(5 5 5 / 0.78);
	margin: 0 0 7px;
}

.page-slug-privacy .entry-content a,
.page-slug-terms .entry-content a {
	color: var(--accent, #ff5b22);
	text-decoration: none;
}

.page-slug-privacy .entry-content a:hover,
.page-slug-terms .entry-content a:hover {
	text-decoration: underline;
}

@media (prefers-reduced-motion: reduce) {
	.page-slug-privacy .legal-dots,
	.page-slug-terms .legal-dots {
		animation: none;
	}
}

@media (max-width: 900px) {
	.page-slug-privacy .legal-dots,
	.page-slug-terms .legal-dots {
		width: 36%;
		opacity: 0.55;
	}

	.page-slug-privacy .entry-content > :not(.legal-dots),
	.page-slug-terms .entry-content > :not(.legal-dots) {
		max-width: none;
	}
}

}