/**
 * Weblooc Legal — typography for legal prose pages.
 *
 * Bazira na CGP brand tokens (ivory, char-900, sky 700 accent, Instrument Serif
 * + DM Sans + Geist Mono). Brez drop shadow, brez bright colors, brez pure white.
 *
 * Glavni razred: .wl-prose — reading layout za splošne pogoje, politiko
 * zasebnosti, piškotke. Tokens podedovani iz weblooc-home.css (preko deljenega
 * body class .weblooc-home-body).
 */

main.weblooc-legal {
	display: block;
	max-width: 880px;
	margin: 0 auto;
	padding: 64px 24px 96px;
	font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: var(--w-char, #1B1A16);
}

@media (max-width: 768px) {
	main.weblooc-legal { padding: 40px 20px 64px; }
}

/* ============================================================
   Header — eyebrow + title + meta
   ============================================================ */
.wl-header {
	margin-bottom: 64px;
	padding-bottom: 32px;
	border-bottom: 1px solid var(--w-border, rgba(27, 26, 22, 0.12));
}

.wl-header .wl-eyebrow {
	font-family: "Geist Mono", "SF Mono", Menlo, monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--w-char-muted, #4a4a44);
	display: block;
	margin-bottom: 24px;
}

.wl-header h1 {
	font-family: "Instrument Serif", Georgia, "Times New Roman", serif;
	font-size: 56px;
	font-weight: 400;
	line-height: 1.05;
	letter-spacing: -2px;
	color: var(--w-char, #1B1A16);
	margin: 0 0 16px;
}

.wl-header h1 em {
	font-style: italic;
	color: var(--w-sky-700, #4F7387);
}

.wl-header .wl-meta {
	font-family: "Geist Mono", monospace;
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--w-char-subtle, #85827a);
	margin: 0;
}

@media (max-width: 768px) {
	.wl-header { margin-bottom: 40px; padding-bottom: 24px; }
	.wl-header h1 { font-size: 36px; letter-spacing: -1px; }
}

/* ============================================================
   TOC (kazalo)
   ============================================================ */
.wl-toc {
	background: var(--w-ivory-deep, #E9E1D0);
	border: 1px solid var(--w-border, rgba(27, 26, 22, 0.12));
	border-radius: 8px;
	padding: 32px 32px;
	margin: 0 0 64px;
}

.wl-toc-label {
	font-family: "Geist Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--w-char-subtle, #85827a);
	display: block;
	margin-bottom: 16px;
}

.wl-toc ol {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: wl-toc-counter;
	columns: 2;
	column-gap: 32px;
}

@media (max-width: 640px) {
	.wl-toc { padding: 24px 20px; }
	.wl-toc ol { columns: 1; }
}

.wl-toc li {
	counter-increment: wl-toc-counter;
	break-inside: avoid;
	padding: 6px 0;
	font-size: 14.5px;
	line-height: 1.5;
}

.wl-toc li a {
	color: var(--w-char, #1B1A16);
	text-decoration: none;
	display: flex;
	align-items: baseline;
	gap: 12px;
}

.wl-toc li a::before {
	content: counter(wl-toc-counter, decimal-leading-zero);
	font-family: "Geist Mono", monospace;
	font-size: 11px;
	letter-spacing: 0.14em;
	color: var(--w-char-subtle, #85827a);
	flex-shrink: 0;
}

.wl-toc li a:hover {
	color: var(--w-sky-700, #4F7387);
}

/* ============================================================
   Prose body
   ============================================================ */
.wl-prose {
	font-family: "DM Sans", sans-serif;
	font-size: 16px;
	line-height: 1.7;
	color: var(--w-char, #1B1A16);
}

.wl-prose section {
	padding-top: 48px;
	margin-top: 48px;
	border-top: 1px solid var(--w-border-soft, rgba(27, 26, 22, 0.06));
}

.wl-prose section:first-of-type {
	padding-top: 0;
	margin-top: 0;
	border-top: 0;
}

.wl-prose h2 {
	font-family: "Instrument Serif", Georgia, serif;
	font-size: 32px;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: -0.5px;
	color: var(--w-char, #1B1A16);
	margin: 0 0 8px;
	display: flex;
	align-items: baseline;
	gap: 16px;
}

.wl-prose h2 .wl-section-num {
	font-family: "Geist Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	color: var(--w-char-subtle, #85827a);
	flex-shrink: 0;
	min-width: 32px;
}

.wl-prose h3 {
	font-family: "Instrument Serif", Georgia, serif;
	font-size: 22px;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: var(--w-char, #1B1A16);
	margin: 32px 0 8px;
}

.wl-prose p {
	margin: 0 0 16px;
	color: var(--w-char-muted, #4a4a44);
}

.wl-prose p strong,
.wl-prose li strong {
	color: var(--w-char, #1B1A16);
	font-weight: 600;
}

.wl-prose em {
	font-family: "Instrument Serif", Georgia, serif;
	font-style: italic;
	color: var(--w-sky-700, #4F7387);
}

.wl-prose a {
	color: var(--w-sky-700, #4F7387);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.wl-prose a:hover {
	color: var(--w-sky-900, #2F4D5C);
}

.wl-prose ul,
.wl-prose ol {
	margin: 0 0 16px;
	padding-left: 24px;
	color: var(--w-char-muted, #4a4a44);
}

.wl-prose li {
	margin-bottom: 6px;
}

.wl-prose ul li::marker {
	color: var(--w-sky-500, #7A9CB0);
}

.wl-prose table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	margin: 24px 0;
	font-size: 14.5px;
	background: var(--w-ivory, #F6F1E8);
	border: 1px solid var(--w-border, rgba(27, 26, 22, 0.12));
	border-radius: 8px;
	overflow: hidden;
}

.wl-prose th,
.wl-prose td {
	padding: 12px 16px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid var(--w-border-soft, rgba(27, 26, 22, 0.06));
}

.wl-prose tr:last-child th,
.wl-prose tr:last-child td {
	border-bottom: 0;
}

.wl-prose th {
	background: var(--w-ivory-deep, #E9E1D0);
	font-family: "Geist Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--w-char-muted, #4a4a44);
}

/* Side block (e.g., contact info, summary) */
.wl-prose .wl-callout {
	background: var(--w-sky-50, #EDF2F5);
	border: 1px solid var(--w-sky-100, #D7E2EA);
	border-radius: 8px;
	padding: 24px 28px;
	margin: 24px 0;
}

.wl-prose .wl-callout p:last-child { margin-bottom: 0; }

.wl-prose .wl-callout-label {
	font-family: "Geist Mono", monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--w-sky-700, #4F7387);
	display: block;
	margin-bottom: 8px;
}

/* ============================================================
   Footer — back to home + legal nav
   ============================================================ */
.wl-footer {
	margin-top: 96px;
	padding-top: 32px;
	border-top: 1px solid var(--w-border, rgba(27, 26, 22, 0.12));
	display: flex;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	font-family: "Geist Mono", monospace;
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--w-char-subtle, #85827a);
}

.wl-footer a {
	color: var(--w-char-muted, #4a4a44);
	text-decoration: none;
}

.wl-footer a:hover {
	color: var(--w-char, #1B1A16);
}

.wl-footer-links {
	display: flex;
	gap: 24px;
	flex-wrap: wrap;
}