/*
 * Freshwave 2026 – Single Post Styles
 * Typography, spacing, and layout to match the Figma single post (news/insight detail) design.
 *
 * Design reference: Figma node 13156-47266 "Insight detail / Desktop v1"
 *
 * Section order:
 *   1. .single-post__header  – white bg, 80 px padding, date eyebrow + H3 title
 *   2. .single-post__image   – featured image constrained to 768 px content width
 *   3. .single-post__content – pale-grey (#F4F4F4) bg, 80 px padding, 768 px max-width
 */

/* ═══════════════════════════════════════════════════════════════
   Outer wrapper
   ═══════════════════════════════════════════════════════════════ */
.single-post {
	width: 100%;
}

/* ═══════════════════════════════════════════════════════════════
   1 · Post header  (date eyebrow + title)
   ═══════════════════════════════════════════════════════════════ */

.single-post__header {
    margin: 60px auto;
}

/* Date — 18 px / line-height 1.5 / regular weight */
.single-post__header .wp-block-post-date,
.single-post__header .wp-block-post-date a {
	display: block;
	font-size: var(--wp--preset--font-size--medium); /* 18 px */
	font-weight: 400;
	line-height: 1.5;
	color: var(--wp--preset--color--dark-green);
	text-decoration: none;
	margin: 0;
    padding-bottom: 16px;
}

/* Title — 40 px / Geo Regular (weight 400) / line-height 1.2 */
.single-post__header .wp-block-post-title,
.single-post__header .single-post__title {
	font-size: var(--wp--preset--font-size--h-3) !important;  /* 40 px */
	font-weight: 400 !important;   /* Geo Regular — overrides global H1 demibold */
	line-height: 1.2 !important;
	color: var(--wp--preset--color--dark-green);
	margin: 0;
}

/* ═══════════════════════════════════════════════════════════════
   2 · Featured image  (768 px wide, sits between header and content)
   ═══════════════════════════════════════════════════════════════ */
.single-post__image {
	line-height: 0; /* collapse whitespace gap beneath the image */
    margin: 60px auto;
}

.single-post__image figure,
.single-post__image .wp-block-post-featured-image {
	margin: 0;
}

.single-post__image img {
	display: block;
	width: 100%;
	height: auto;
}

/* ═══════════════════════════════════════════════════════════════
   3 · Body content area  (pale-grey background, 16 px / lh 1.2)
   ═══════════════════════════════════════════════════════════════ */
.single-post__content {
	font-size: var(--wp--preset--font-size--regular); /* 16 px */
	line-height: 1.2;
    color: #323232;
    margin-block-end: 60px !important;
}

.single-post__content h1, .single-post__content h2, .single-post__content h3, .single-post__content h4 {
    margin-bottom: 1rem;
}

/* Paragraphs generated by the block editor */
.single-post__content p,
.single-post__content .wp-block-post-content p,
.single-post__content .entry-content p {
	font-size: var(--wp--preset--font-size--regular);
	line-height: 1.2;
	margin-top: 0;
	margin-bottom: 1.25em;
}

.single-post__content p:last-child,
.single-post__content .wp-block-post-content p:last-child,
.single-post__content .entry-content p:last-child {
	margin-bottom: 0;
}

/* Block gap for non-paragraph blocks inside the post content */
.single-post__content .wp-block-post-content > * + *,
.single-post__content .entry-content > * + * {
	margin-top: 1.25em;
}

@media (max-width: 767px) {
    .single-post .site-main {
        padding-left: 16px;
        padding-right: 16px;
    }
}