/**
 * Blog archive (hero + featured card + filter bar + grid) and single post
 * (header + featured image + body + related grid), rendered via the
 * `archive-blog` / `single-blog` canvas overrides.
 */

#yhdr-blog-archive .page-header h1,
#yhdr-single-blog .page-header h1 { text-transform: uppercase; }

.blog-featured-wrap { padding-top: var(--yhdr-space-lg); padding-bottom: 0; }

.blog-featured {
	display: flex;
	flex-wrap: wrap;
	text-decoration: none;
	background: var(--yhdr-card-blue-bg);
	border-radius: var(--yhdr-radius-lg);
	overflow: hidden;
	box-shadow: 0 4px 18px rgba(30, 58, 102, 0.08);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.blog-featured:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(30, 58, 102, 0.16); }

.blog-featured__media { flex: 1 1 440px; min-width: 300px; }
.blog-featured__media img,
.blog-featured__placeholder { width: 100%; height: 320px; object-fit: cover; display: block; }

.blog-featured__body {
	flex: 1 1 380px;
	min-width: 300px;
	padding: clamp(26px, 4vw, 44px);
	display: flex;
	flex-direction: column;
	gap: 14px;
	justify-content: center;
}

.blog-featured__badges { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.blog-featured__badge-latest { background: var(--yhdr-gold); color: var(--yhdr-near-black); text-transform: uppercase; letter-spacing: 0.05em; }
.blog-featured__badge-category { background: var(--yhdr-white); color: var(--yhdr-navy-mid); text-transform: uppercase; letter-spacing: 0.05em; }

.blog-featured__title { font-size: clamp(24px, 3.2vw, 34px); color: var(--yhdr-near-black); margin: 0; }
.blog-featured__excerpt { font-size: 0.95rem; color: var(--yhdr-body-text); margin: 0; }

.blog-featured__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 4px;
}
.blog-featured__date { font-size: 0.8rem; font-weight: 600; color: var(--yhdr-muted-text); }
.blog-featured__arrow {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--yhdr-blue-accent);
	color: var(--yhdr-white);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	flex-shrink: 0;
}

.blog__filters { display: flex; flex-wrap: wrap; gap: var(--yhdr-space-xs); justify-content: center; margin-bottom: var(--yhdr-space-lg); }

.blog__filter-btn {
	border: 2px solid var(--yhdr-border-2);
	background: var(--yhdr-white);
	color: var(--yhdr-body-text);
	border-radius: var(--yhdr-radius-pill);
	padding: 10px 20px;
	min-height: 44px;
	font-weight: 700;
	cursor: pointer;
	transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}
.blog__filter-btn:hover { border-color: var(--yhdr-blue-accent); }
.blog__filter-btn.is-active { background: var(--yhdr-blue-accent); border-color: var(--yhdr-blue-accent); color: var(--yhdr-white); }

.blog__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--yhdr-space-md); }
.blog-post-card.is-hidden { display: none; }

.blog-post-card {
	text-decoration: none;
	background: var(--yhdr-white);
	border: 1px solid var(--yhdr-border);
	border-radius: var(--yhdr-radius-lg);
	overflow: hidden;
	box-shadow: 0 2px 12px rgba(30, 58, 102, 0.07);
	display: flex;
	flex-direction: column;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.blog-post-card:hover { transform: translateY(-5px); box-shadow: 0 16px 34px rgba(30, 58, 102, 0.15); }

.blog-post-card__media img,
.blog-post-card__placeholder { width: 100%; height: 190px; object-fit: cover; display: block; }

.blog-post-card__body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.blog-post-card__meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.blog-post-card__read-time { font-size: 0.78rem; font-weight: 600; color: var(--yhdr-muted-text); }
.blog-post-card__title { font-size: 1.25rem; color: var(--yhdr-near-black); margin: 0; }
.blog-post-card__excerpt { font-size: 0.85rem; line-height: 1.65; color: var(--yhdr-body-text); margin: 0; }

.blog-post-card__footer {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 8px;
}
.blog-post-card__date { font-size: 0.78rem; font-weight: 600; color: var(--yhdr-muted-text); }
.blog-post-card__arrow {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--yhdr-gold);
	color: var(--yhdr-near-black);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 0.85rem;
}

.blog-cta { text-align: center; }
.blog-cta .container { background: var(--yhdr-gradient-cta); border-radius: var(--yhdr-radius-lg); padding: var(--yhdr-space-xl) var(--yhdr-space-lg); }
.blog-cta h2 { color: var(--yhdr-white); }
.blog-cta p { color: var(--yhdr-light-blue-text-2); max-width: 620px; margin: 0 auto var(--yhdr-space-md); }
.blog-cta__actions { display: flex; flex-wrap: wrap; gap: var(--yhdr-space-sm); justify-content: center; }

@media (max-width: 960px) {
	.blog__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 600px) {
	.blog__grid { grid-template-columns: 1fr; }
	.blog-featured-wrap { margin-top: var(--yhdr-space-md); }
}

/* Single blog post */

.single-blog__header { background: var(--yhdr-navy-mid); text-align: center; }
.single-blog__header--has-image { padding-bottom: 90px; }
.single-blog__header .container { max-width: 820px; }

.single-blog__breadcrumb { font-size: 0.85rem; margin-bottom: 22px; }
.single-blog__breadcrumb a { color: #a9c2e6; text-decoration: none; font-weight: 600; }
.single-blog__breadcrumb a:hover { color: var(--yhdr-white); }
.single-blog__breadcrumb > span { color: #6f8cbd; padding: 0 8px; }
.single-blog__breadcrumb-current { color: var(--yhdr-light-blue-text); font-weight: 600; }

.single-blog__category { text-transform: uppercase; letter-spacing: 0.05em; padding: 6px 14px; margin-bottom: 18px; }
.single-blog__header h1 { color: var(--yhdr-white); line-height: 1.15; }
.single-blog__byline { margin: 0; font-size: 0.875rem; font-weight: 600; color: #a9c2e6; }

.single-blog__content { max-width: 780px; }

.single-blog__featured-image { margin-top: -100px; position: relative; }
.single-blog__featured-image img {
	width: 100%;
	height: clamp(240px, 40vw, 400px);
	object-fit: cover;
	display: block;
	border-radius: var(--yhdr-radius-lg);
	box-shadow: 0 18px 44px rgba(30, 58, 102, 0.22);
	border: 4px solid var(--yhdr-white);
}

.single-blog__excerpt { margin: var(--yhdr-space-md) 0 0; font-size: 1.125rem; line-height: 1.75; color: var(--yhdr-near-black); font-weight: 500; }

.single-blog__body { margin-top: var(--yhdr-space-md); }
.single-blog__body h2 { margin: var(--yhdr-space-lg) 0 12px; font-size: clamp(21px, 2.8vw, 26px); color: var(--yhdr-navy-dark); }
.single-blog__body p { font-size: 1rem; line-height: 1.8; color: var(--yhdr-body-text); }

.single-blog__cta {
	margin-top: var(--yhdr-space-xl);
	background: var(--yhdr-gradient-cta);
	border-radius: var(--yhdr-radius-lg);
	padding: var(--yhdr-space-xl) var(--yhdr-space-lg);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: var(--yhdr-space-md);
}
.single-blog__cta-copy h2 { margin: 0 0 6px; color: var(--yhdr-white); }
.single-blog__cta-copy p { margin: 0; font-size: 0.9rem; line-height: 1.65; color: var(--yhdr-light-blue-text-2); }
.single-blog__cta-actions { display: flex; flex-wrap: wrap; gap: var(--yhdr-space-sm); justify-content: center; }

.blog-related { background: var(--yhdr-offwhite); padding: 50px 0 60px; margin-top: var(--yhdr-space-md); }
.blog-related__heading { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: var(--yhdr-space-lg); }
.blog-related__heading h2 { margin: 0; text-transform: uppercase; color: var(--yhdr-near-black); }
.blog-related__all { text-decoration: none; color: var(--yhdr-blue-accent); font-weight: 700; font-size: 0.9rem; }
.blog-related__all:hover { color: var(--yhdr-navy-dark); }

.blog-related__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--yhdr-space-sm); }

.blog-related-card {
	text-decoration: none;
	background: var(--yhdr-white);
	border: 1px solid var(--yhdr-border);
	border-radius: var(--yhdr-radius-lg);
	overflow: hidden;
	box-shadow: 0 2px 12px rgba(30, 58, 102, 0.07);
	display: flex;
	flex-direction: column;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.blog-related-card:hover { transform: translateY(-5px); box-shadow: 0 16px 34px rgba(30, 58, 102, 0.15); }
.blog-related-card__media img,
.blog-related-card__placeholder { width: 100%; height: 160px; object-fit: cover; display: block; }
.blog-related-card__body { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.blog-related-card__category { align-self: flex-start; }
.blog-related-card__title { margin: 0; font-size: 1.125rem; color: var(--yhdr-near-black); line-height: 1.3; }
.blog-related-card__meta { margin-top: auto; padding-top: 6px; font-size: 0.78rem; font-weight: 600; color: var(--yhdr-muted-text); }

@media (max-width: 600px) {
	.single-blog__cta { padding: var(--yhdr-space-lg) var(--yhdr-space-md); }
}
