/* =====================================================================
   Latitude Key — single blog post (single.php).
   Design-system faithful: Playfair Display titles, Work Sans body, official
   palette, pill controls. Shares the card styles with blog-archive.css (loaded
   first) for the "Keep reading" grid. Site header (header.js) + footer wrap this.
   ===================================================================== */
.lk-single {
	--lk-ink:#16303C; --lk-blue:#5581A2; --lk-blue-deep:#3C617D;
	--lk-muted:#5B6B73; --lk-line:#E3E8EA; --lk-green:#90CAA0; --lk-panel:#fff;
	max-width:1000px; margin:0 auto; padding:48px 20px var(--lk-cta-gap, 124px); box-sizing:border-box;
	font-family:"Work Sans", system-ui, sans-serif; color:var(--lk-ink);
}
.lk-post { margin:0; }
.lk-single > :last-child { margin-bottom:0; } /* the wrapper's padding alone sets the gap before the CTA */

/* ---- Header band (centered, like the archive head) ---- */
.lk-post__head { max-width:760px; margin:0 auto 32px; text-align:center; }
.lk-post__crumbs { margin:0 0 18px; }
.lk-post__crumbs a { color:var(--lk-blue); text-decoration:none; font-weight:600; font-size:.9rem; }
.lk-post__crumbs a:hover { color:var(--lk-blue-deep); }
.lk-post__meta { display:flex; justify-content:center; align-items:center; gap:10px; font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; color:var(--lk-blue); font-weight:600; }
.lk-post__meta a { color:var(--lk-blue); text-decoration:none; }
.lk-post__meta a:hover { color:var(--lk-blue-deep); }
.lk-post__sep { color:var(--lk-line); }
.lk-post__title {
	font-family:"Playfair Display", Georgia, serif; font-weight:700; color:var(--lk-ink);
	font-size:clamp(30px, 4.6vw, 48px); line-height:1.1; margin:14px 0 0; text-wrap:balance;
}

/* ---- Hero image ---- */
.lk-post__hero { margin:0 0 44px; border-radius:16px; overflow:hidden; background:#eef2f4; }
.lk-post__hero-img { display:block; width:100%; height:auto; object-fit:cover; }

/* ---- Reading column ---- */
.lk-post__content { max-width:720px; margin:0 auto; font-size:1.075rem; line-height:1.8; color:#2b3d45; }
.lk-post__content > * { margin:0 0 1.35em; }
.lk-post__content > :last-child { margin-bottom:0; }
.lk-post__content a { color:var(--lk-blue); text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1px; transition:color .15s ease; }
.lk-post__content a:hover { color:var(--lk-blue-deep); }
.lk-post__content h2 { font-family:"Playfair Display", Georgia, serif; font-weight:700; color:var(--lk-ink); font-size:1.7rem; line-height:1.2; margin:1.8em 0 .5em; }
.lk-post__content h3 { font-family:"Playfair Display", Georgia, serif; font-weight:700; color:var(--lk-ink); font-size:1.35rem; line-height:1.25; margin:1.6em 0 .4em; }
.lk-post__content h4 { font-family:"Work Sans", sans-serif; font-weight:700; color:var(--lk-ink); font-size:1.1rem; margin:1.5em 0 .3em; }
.lk-post__content ul, .lk-post__content ol { padding-left:1.4em; }
.lk-post__content li { margin:0 0 .5em; }
.lk-post__content ul li::marker { color:var(--lk-blue); }
.lk-post__content img { max-width:100%; height:auto; border-radius:12px; display:block; }
.lk-post__content figure { margin:1.6em 0; }
.lk-post__content figcaption { font-size:.85rem; color:var(--lk-muted); text-align:center; margin-top:8px; }
.lk-post__content blockquote {
	margin:1.8em 0; padding:4px 0 4px 24px; border-left:3px solid var(--lk-blue);
	font-family:"Playfair Display", Georgia, serif; font-style:italic; font-size:1.25rem;
	line-height:1.5; color:var(--lk-ink);
}
.lk-post__content blockquote :last-child { margin-bottom:0; }
.lk-post__content hr { border:0; border-top:1px solid var(--lk-line); margin:2.2em 0; }
.lk-post__content code { background:#f2f5f6; padding:2px 6px; border-radius:5px; font-size:.9em; }
.lk-post__content table { width:100%; border-collapse:collapse; font-size:.98rem; }
.lk-post__content th, .lk-post__content td { border:1px solid var(--lk-line); padding:9px 12px; text-align:left; }
.lk-post__content th { background:#f6f8f9; }

/* ---- Footer meta ---- */
.lk-post__foot {
	max-width:720px; margin:44px auto 0; padding-top:26px; border-top:1px solid var(--lk-line);
	display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px;
}
.lk-post__tags { display:flex; flex-wrap:wrap; gap:8px; }
.lk-chip {
	font-family:"Work Sans", sans-serif; font-size:.82rem; font-weight:600; color:var(--lk-ink);
	background:#fff; border:1px solid var(--lk-line); border-radius:999px; padding:5px 14px;
	text-decoration:none; transition:border-color .15s ease, color .15s ease;
}
.lk-chip:hover { border-color:var(--lk-blue); color:var(--lk-blue-deep); }
.lk-post__back { font-family:"Work Sans", sans-serif; font-weight:600; color:var(--lk-blue); text-decoration:none; white-space:nowrap; }
.lk-post__back:hover { color:var(--lk-blue-deep); }

/* ---- Related ("Keep reading") — reuses .lk-blog__grid + .lk-card ---- */
.lk-related { margin-top:76px; }
.lk-related__title { font-family:"Playfair Display", Georgia, serif; font-weight:700; color:var(--lk-ink); font-size:1.6rem; text-align:center; margin:0 0 32px; }

@media (max-width:640px) {
	.lk-single { padding:32px 18px var(--lk-cta-gap, 64px); }
	.lk-post__content { font-size:1.02rem; line-height:1.75; }
	.lk-post__hero { border-radius:12px; margin-bottom:32px; }
}

@media (prefers-reduced-motion: reduce) {
	.lk-post__content a, .lk-chip, .lk-post__back { transition:none; }
}