/**
 * Blog — archive list + single post + sidebar.
 *
 * Enqueued on is_home() || is_archive() || is_singular('post') || is_search().
 *
 * Archive markup ports HTML/blog.html + HTML/css/blog.css (.blog-post-card
 * list cards, .blog-section__sidebar-card). The single-post layout has no
 * dedicated mockup — .blog-single__* selectors are derived from the same
 * design tokens + card/typography patterns.
 *
 * Sidebar: the blog reuses `primary-widget-area` (registered in
 * inc/setup.php) whose widgets render as <li class="widget-container">
 * with <h3 class="widget-title">. The rules near the bottom normalise WP's
 * default widget markup to match the .blog-section__sidebar-card design.
 */

/* ----------------------------------------------------------------------- */
/* Section shell + 9/3 layout                                              */
/* ----------------------------------------------------------------------- */
.blog-section {
	padding: 100px 0;
	background-color: var(--page-bg);
}

.blog-section__listing {
	padding-right: 60px;
}

/* ----------------------------------------------------------------------- */
/* Post card (list item) — ported from HTML/css/blog.css                   */
/* ----------------------------------------------------------------------- */
.blog-post-card {
	border: 1px solid var(--border-color-2);
	padding: 0;
	background-color: var(--white);
	overflow: hidden;
	margin-bottom: 30px;
}

.blog-post-card:last-child {
	margin-bottom: 0;
}

.blog-post-card__image-wrapper {
	position: relative;
	overflow: hidden;
	padding: 40px 40px 0;
}

.blog-post-card__image-link {
	display: block;
}

.blog-post-card__image-link img {
	width: 100%;
	height: auto;
	display: block;
}

.blog-post-card__body .blog-post-card__content {
	padding: 55px 40px;
	margin: 0 auto;
	width: 536px;
	max-width: 100%;
	text-align: center;
}

.blog-post-card__category-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
	font-size: 12px;
	line-height: 20px;
	color: var(--text-secondary);
}

.blog-post-card__category {
	color: var(--text-secondary);
	text-decoration: none;
	position: relative;
}

.blog-post-card__category::after {
	content: "\2022";
	margin-left: 8px;
	vertical-align: middle;
	line-height: 1;
	font-size: 13px;
	color: var(--silver-color);
	position: relative;
	top: -2px;
}

.blog-post-card__category:hover {
	color: var(--gold-color);
}

.blog-post-card__title {
	font-size: 24px;
	line-height: 30px;
	margin-bottom: 18px;
	color: var(--text-primary);
}

.blog-post-card__title a {
	color: inherit;
	text-decoration: none;
}

.blog-post-card__title a:hover {
	color: var(--gold-color);
}

.blog-post-card__description {
	font-size: 13px;
	line-height: 23px;
	margin-bottom: 18px;
	color: var(--text-secondary);
}

.blog-post-card__meta-data {
	border-top: 1px solid var(--border-color-2);
	display: flex;
	align-items: center;
	text-align: center;
}

.blog-post-card__meta-data-item {
	font-size: 12px;
	border-right: 1px solid var(--border-color-2);
	margin: 0;
	padding: 14px 15px;
	flex-grow: 1;
	max-width: 100%;
	color: var(--text-secondary);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
}

.blog-post-card__meta-data-item:last-child {
	border-right: 0;
}

.blog-post-card__meta-data-item-link {
	color: var(--text-secondary);
	text-decoration: none;
}

.blog-post-card__meta-data-item-link:hover {
	color: var(--gold-color);
}

/* Tag links inside the meta row */
.blog-post-card__meta-data-tags a {
	color: var(--text-secondary);
	text-decoration: none;
}

.blog-post-card__meta-data-tags a:hover {
	color: var(--gold-color);
}

/* Text-only card (no featured image) — drop the image-wrapper padding gap. */
.blog-post-card--no-thumb .blog-post-card__content {
	padding-top: 45px;
}

/* ----------------------------------------------------------------------- */
/* Single post hero — long titles. The shared .hero-banner lays title +    */
/* breadcrumb side-by-side (justify-content: space-between), which squeezes */
/* a long post title + repeats it full-length in the breadcrumb. For posts */
/* we stack the title above the breadcrumb, cap the title width, and        */
/* truncate the breadcrumb's post-title item to one line.                  */
/* ----------------------------------------------------------------------- */
.hero-banner--blog > .container {
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}

.hero-banner--blog .hero-banner__title {
	max-width: 860px;
	line-height: 1.3;
}

.hero-banner--blog .hero-banner__breadcrumb .breadcrumb {
	flex-wrap: nowrap;
	max-width: 100%;
}

.hero-banner--blog .breadcrumb-item.active {
	max-width: 360px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ----------------------------------------------------------------------- */
/* Single post (no mockup — derived from card + typography patterns)       */
/* ----------------------------------------------------------------------- */
.blog-single {
	padding: 100px 0;
	background-color: var(--white);
}

.blog-single__main {
	padding-right: 60px;
}

.blog-single__featured {
	margin-bottom: 30px;
}

.blog-single__featured img {
	width: 100%;
	height: auto;
	display: block;
}

.blog-single__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	margin-bottom: 18px;
	font-size: 12px;
	line-height: 20px;
	color: var(--text-secondary);
	text-transform: uppercase;
	letter-spacing: 0.4px;
}

.blog-single__meta a {
	color: var(--text-secondary);
	text-decoration: none;
}

.blog-single__meta a:hover {
	color: var(--gold-color);
}

.blog-single__meta-item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

/* Editor-content typography (the_content output) moved to assets/css/content.css
   as `.rich-content`, shared across posts + pages. The blog single wrapper now
   carries `rich-content blog-single__content`; blog-only chrome stays below. */

/* Tags */
.blog-single__tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 36px;
	padding-top: 26px;
	border-top: 1px solid var(--border-color-2);
}

.blog-single__tags-label {
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--text-primary);
	font-weight: 500;
	margin-right: 4px;
}

.blog-single__tags a {
	display: inline-block;
	padding: 6px 14px;
	border: 1px solid var(--border-color);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--text-secondary);
	text-decoration: none;
	transition: all 0.25s ease;
}

.blog-single__tags a:hover {
	background: var(--text-primary);
	border-color: var(--text-primary);
	color: var(--white);
}

/* Author bio card */
.blog-single__author {
	display: flex;
	gap: 22px;
	align-items: flex-start;
	margin-top: 36px;
	padding: 30px;
	border: 1px solid var(--border-color-2);
	background: var(--white);
}

.blog-single__author-avatar {
	flex-shrink: 0;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	overflow: hidden;
}

.blog-single__author-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.blog-single__author-name {
	font-size: 15px;
	color: var(--text-primary);
	margin-bottom: 8px;
}

.blog-single__author-bio {
	font-size: 13px;
	line-height: 1.7;
	color: var(--text-secondary);
	margin: 0;
}

/* Prev / next post nav */
.blog-single__nav {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	margin-top: 36px;
	padding-top: 26px;
	border-top: 1px solid var(--border-color-2);
}

/* Prev / Next links — arrow + label only (no post title). */
.blog-single__nav-link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	color: var(--text-primary);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	transition: color 0.25s ease;
}

.blog-single__nav-link--next {
	margin-left: auto;
}

.blog-single__nav-link:hover {
	color: var(--gold-color);
}

/* ----------------------------------------------------------------------- */
/* Comments — list + threaded replies + form                               */
/* ----------------------------------------------------------------------- */
.blog-comments {
	margin-top: 40px;
	padding-top: 36px;
	border-top: 1px solid var(--border-color-2);
}

.blog-comments__title {
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-align: center;
	color: var(--text-primary);
	margin-bottom: 40px;
}

.blog-comments__list {
	list-style: none;
	margin: 0 0 30px;
	padding: 0;
}

/* Nested replies (WP outputs <ol class="children"> with style=ol) */
.blog-comments__list .children {
	list-style: none;
	margin: 0;
	padding-left: 40px;
}

.blog-comment {
	margin-bottom: 28px;
}

.blog-comment:last-child {
	margin-bottom: 0;
}

.blog-comment__body {
	display: flex;
	gap: 20px;
	align-items: flex-start;
	padding-bottom: 28px;
	border-bottom: 1px solid var(--border-color-2);
}

.blog-comment__avatar {
	flex-shrink: 0;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	overflow: hidden;
}

.blog-comment__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.blog-comment__content {
	flex: 1;
	min-width: 0;
}

.blog-comment__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 16px;
	margin-bottom: 18px;
}

.blog-comment__head-meta {
	min-width: 0;
}

.blog-comment__author {
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	line-height: 1.3;
	color: var(--text-primary);
	margin: 0 0 7px;
}

.blog-comment__author a {
	color: inherit;
	text-decoration: none;
}

.blog-comment__author a:hover {
	color: var(--gold-color);
}

.blog-comment__date {
	display: block;
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	line-height: 1;
	color: var(--text-secondary);
}

/* Reply — bordered rectangle pinned top-right (matches reference). */
.blog-comment__reply {
	flex-shrink: 0;
}

.blog-comment__reply .comment-reply-link {
	display: inline-block;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	line-height: 1;
	color: var(--text-primary);
	text-decoration: none;
	border: 1px solid var(--border-color);
	padding: 7px 14px;
	transition: all 0.25s ease;
}

.blog-comment__reply .comment-reply-link:hover {
	background: var(--text-primary);
	border-color: var(--text-primary);
	color: var(--white);
}

.blog-comment__text {
	font-size: 14px;
	line-height: 1.7;
	color: var(--text-secondary);
}

.blog-comment__text p {
	margin: 0 0 12px;
}

.blog-comment__text p:last-child {
	margin-bottom: 0;
}

.blog-comment__moderation {
	font-size: 12px;
	color: var(--gold-color);
	margin: 8px 0 0;
}

/* Deeper threads get a touch less left padding to keep things readable */
@media (max-width: 575.98px) {
	.blog-comments__list .children {
		padding-left: 18px;
	}
	.blog-comment__body {
		gap: 14px;
	}
	.blog-comment__avatar {
		width: 52px;
		height: 52px;
	}
}

/* ----------------------------------------------------------------------- */
/* Comment form                                                            */
/* ----------------------------------------------------------------------- */
.blog-comment-form {
	margin-top: 36px;
}

/* Inline reply form (comment-reply.js moves #respond into the comment) —
   give it breathing room so it doesn't crowd the comment above/below. */
.blog-comment #respond,
.blog-comment .comment-respond {
	margin-top: 24px;
	margin-bottom: 8px;
}

.blog-comment-form__title,
.blog-comment-form .comment-reply-title {
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-align: center;
	color: var(--text-primary);
	margin-bottom: 30px;
}

.blog-comment-form .blog-comment-form__field {
	margin-bottom: 18px;
}

.blog-comment-form .form-control {
	width: 100%;
	font-size: 13px;
}

.blog-comment-form textarea.form-control {
	resize: vertical;
	min-height: 130px;
}

/* Name / Email / Website in a row on desktop — flexbox on the form so the
   row is contained naturally (floats collapsed the form height and made
   the Submit Now button overlap the next comment when the reply form was
   injected inline). Each field <p> defaults full-width; the --third fields
   share one row. */
@media (min-width: 768px) {
	.blog-comment-form .comment-form {
		display: flex;
		flex-wrap: wrap;
		gap: 0 20px;
	}
	.blog-comment-form .comment-form > p {
		flex: 1 1 100%;
		margin-bottom: 18px;
	}
	.blog-comment-form .comment-form > p.blog-comment-form__field--third {
		flex: 1 1 0;
		min-width: 0;
	}
}

.blog-comment-form .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 13px;
	color: var(--text-secondary);
	margin-bottom: 18px;
}

.blog-comment-form .comment-form-cookies-consent input {
	margin-top: 3px;
}

.blog-comment-form .form-submit {
	margin: 0;
	text-align: center;
}

.blog-comment-form__submit {
	cursor: pointer;
}

/* "Logged in as …" / reply-cancel notice rows */
.blog-comment-form .logged-in-as,
.blog-comment-form .comment-notes {
	font-size: 13px;
	color: var(--text-secondary);
	margin-bottom: 18px;
}

/* "Cancel reply" — WP nests it inside the centered .comment-reply-title
   (wrapped in <small>). Float it right, smaller + red. */
#cancel-comment-reply-link {
	float: right;
	font-size: 11px;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0;
	color: var(--danger-red-border);
	text-decoration: none;
}

#cancel-comment-reply-link:hover {
	text-decoration: underline;
}

.blog-comment-form .comment-reply-title small {
	font-weight: 400;
}

/* ----------------------------------------------------------------------- */
/* Pagination (archive)                                                    */
/* ----------------------------------------------------------------------- */
.blog-pagination {
	margin-top: 40px;
}

.blog-pagination ul.page-numbers {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
}

.blog-pagination li {
	margin: 0;
}

.blog-pagination a.page-numbers,
.blog-pagination span.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border: 1px solid var(--border-color);
	color: var(--text-primary);
	font-size: 13px;
	text-decoration: none;
	background: var(--white);
	transition: all 0.2s ease;
}

.blog-pagination a.page-numbers:hover,
.blog-pagination span.page-numbers.current {
	background: var(--text-primary);
	border-color: var(--text-primary);
	color: var(--white);
}

.blog-pagination span.page-numbers.dots {
	border: 0;
	background: transparent;
}

/* ----------------------------------------------------------------------- */
/* Empty state (search / no results)                                       */
/* ----------------------------------------------------------------------- */
.blog-empty {
	padding: 40px;
	text-align: center;
	border: 1px solid var(--border-color-2);
	background: var(--white);
}

.blog-empty__title {
	font-size: 20px;
	color: var(--text-primary);
	margin-bottom: 12px;
}

.blog-empty__text {
	font-size: 14px;
	color: var(--text-secondary);
	margin-bottom: 22px;
}

/* Blog search form — plain general search (no product autosuggest). */
.blog-search-form {
	display: flex;
	gap: 10px;
	max-width: 480px;
	margin: 0 auto;
}

.blog-search-form__input {
	flex: 1;
	font-size: 13px;
}

.blog-search-form__btn {
	flex-shrink: 0;
	cursor: pointer;
}

/* ----------------------------------------------------------------------- */
/* Sidebar — primary-widget-area widgets styled as design cards            */
/* WP renders each widget as <li class="widget-container widget_X"> with    */
/* <h3 class="widget-title">. We wrap the dynamic_sidebar() output in a     */
/* <ul class="blog-section__sidebar"> in the templates.                    */
/* ----------------------------------------------------------------------- */
.blog-section__sidebar {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 30px;
}

/* Each widget = a sidebar card. Targets both the WP widget-container and
   the design's own card class so manual markup + widgets both fit. */
.blog-section__sidebar .widget-container,
.blog-section__sidebar-card {
	border: 1px solid var(--border-color-2);
	padding: 30px;
	background-color: var(--white);
	margin: 0;
}

.blog-section__sidebar .widget-title,
.blog-section__sidebar .wp-block-heading,
.blog-section__sidebar-card-title {
	text-align: center;
	font-size: 13px;
	line-height: 24px;
	margin-bottom: 25px;
	text-transform: uppercase;
	color: var(--text-primary);
}

/* Search widget */
.blog-section__sidebar .widget_search .search-form,
.blog-section__sidebar .wp-block-search__inside-wrapper {
	position: relative;
	display: flex;
}

.blog-section__sidebar .search-form .search-field,
.blog-section__sidebar .wp-block-search__input {
	flex: 1;
	font-size: 12px;
	padding: 10px 40px 10px 15px;
	border: 1px solid var(--border-color);
	width: 100%;
}

.blog-section__sidebar .search-form .search-submit,
.blog-section__sidebar .wp-block-search__button {
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
	margin: 0;
	border: 0;
	background: transparent;
	color: var(--text-primary);
	padding: 0 14px;
	cursor: pointer;
	font-size: 12px;
}

/* Match the HTML's bare search bar (.blog-section__search): the WP block search
   sits in a card with a "Search" label + text button — strip the card chrome,
   hide the label, and swap the button text for the magnifying-glass icon. */
.blog-section__sidebar .widget_search {
	border: 0;
	padding: 0;
	background: transparent;
}

.blog-section__sidebar .wp-block-search__label {
	display: none;
}

.blog-section__sidebar .wp-block-search__button {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0;
}

/* The button still has `font-size: 0` above (hides the visible "Search" text
   the block ships), which would also collapse a sprite icon sized in `em`.
   Give the injected magnifying-glass SVG an explicit pixel size. */
.blog-section__sidebar .wp-block-search__button .icon {
	width: 13px;
	height: 13px;
}

/* List widgets — Categories, Recent Posts, Archives, Pages, Meta */
.blog-section__sidebar .widget-container ul,
.blog-section__sidebar .widget-container ol {
	list-style: none;
	padding: 0;
	margin: 0;
}

.blog-section__sidebar .widget-container li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 11px;
	font-size: 14px;
	line-height: 18px;
}

.blog-section__sidebar .widget-container li:last-child {
	margin-bottom: 0;
}

.blog-section__sidebar .widget-container li a {
	color: var(--text-secondary);
	text-decoration: none;
}

.blog-section__sidebar .widget-container li a:hover {
	color: var(--gold-color);
}

/* Recent Posts (core Latest Posts block) — render as the design's "Popular
   Posts" list: a small square thumb (col 1, spans both rows) with the title
   (clamped to 2 lines) + date stacked beside it (col 2). Uniform rows, no
   full-width highlight. inc/blog.php forces the block to output image + date. */
.blog-section__sidebar .wp-block-latest-posts__list li {
	display: grid;
	grid-template-columns: 70px 1fr;
	column-gap: 18px;
	row-gap: 0;
	align-content: center;
	margin-bottom: 21px;
}

.blog-section__sidebar .wp-block-latest-posts__list li:last-child {
	margin-bottom: 0;
}

.blog-section__sidebar .wp-block-latest-posts__featured-image {
	grid-column: 1;
	grid-row: 1 / span 2;
	align-self: center;
	width: 70px;
	margin: 0;
	line-height: 0;
}

.blog-section__sidebar .wp-block-latest-posts__featured-image img {
	width: 70px;
	height: 70px;
	object-fit: cover;
	display: block;
}

.blog-section__sidebar .wp-block-latest-posts__list .wp-block-latest-posts__post-title {
	grid-column: 2;
	align-self: end;
	font-size: 13px;
	font-weight: 400;
	line-height: 16px;
	color: var(--text-primary);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	overflow: hidden;
}

.blog-section__sidebar .wp-block-latest-posts__list .wp-block-latest-posts__post-title:hover {
	color: var(--gold-color);
}

.blog-section__sidebar .wp-block-latest-posts__post-date {
	grid-column: 2;
	align-self: start;
	margin-top: 4px;
	font-size: 12px;
	line-height: 16px;
	color: var(--text-secondary);
}

/* Recent Comments rows are multi-part (author + post link), so stack them as
   blocks instead of the single-link flex row above. */
.blog-section__sidebar .wp-block-latest-comments li {
	display: block;
	margin-bottom: 14px;
	font-size: 13px;
	line-height: 1.6;
}

/* WP appends "(N)" count as plain text on category/archive list items
   when "show counts" is on — push it to the right as a muted figure. */
.blog-section__sidebar .widget_categories li,
.blog-section__sidebar .widget_archive li {
	color: var(--text-secondary);
	font-size: 13px;
}

/* Nested children (sub-categories / page children) */
.blog-section__sidebar .widget-container li .children,
.blog-section__sidebar .widget-container li .sub-menu {
	flex-basis: 100%;
	padding-left: 14px;
	margin-top: 11px;
}

/* Tag cloud */
.blog-section__sidebar .tagcloud,
.blog-section__sidebar .wp-block-tag-cloud {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.blog-section__sidebar .tag-cloud-link {
	display: inline-block;
	padding: 6px 14px;
	border: 1px solid var(--border-color);
	font-size: 11px !important;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--text-secondary);
	text-decoration: none;
	transition: all 0.25s ease;
}

.blog-section__sidebar .tag-cloud-link:hover {
	background: var(--text-primary);
	border-color: var(--text-primary);
	color: var(--white);
}

/* Image / banner widgets fill the card width */
.blog-section__sidebar .widget-container img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* ----------------------------------------------------------------------- */
/* Responsive                                                              */
/* ----------------------------------------------------------------------- */
@media (max-width: 1199.98px) {
	.blog-section,
	.blog-single {
		padding: 80px 0;
	}
	.blog-section__listing,
	.blog-single__main {
		padding-right: 12px;
	}
}

@media (max-width: 991.98px) {
	.blog-section,
	.blog-single {
		padding: 70px 0;
	}
	.blog-post-card__title {
		font-size: 21px;
		line-height: 28px;
	}
	.blog-post-card__image-wrapper {
		padding: 30px 30px 0;
	}
	.blog-post-card__body .blog-post-card__content {
		padding: 35px 30px 40px;
	}
	/* Sidebar drops below the listing — add top gap. */
	.blog-section__sidebar,
	.blog-single__sidebar {
		margin-top: 40px;
	}
}

@media (max-width: 767.98px) {
	.blog-section,
	.blog-single {
		padding: 50px 0;
	}
	.blog-post-card__title {
		font-size: 18px;
		line-height: 26px;
		margin-bottom: 10px;
	}
	.blog-post-card__image-wrapper {
		padding: 15px 15px 0;
	}
	.blog-post-card__body .blog-post-card__content {
		padding: 25px 15px 35px;
	}
	.blog-post-card__meta-data {
		flex-direction: column;
	}
	.blog-post-card__meta-data-item {
		width: 100%;
		border-right: 0;
		border-bottom: 1px solid var(--border-color-2);
	}
	.blog-post-card__meta-data-item:last-child {
		border-bottom: 0;
	}
	.blog-single__author {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
	.blog-single__nav {
		flex-direction: column;
	}
	.blog-single__nav-link,
	.blog-single__nav-link--next {
		max-width: 100%;
		text-align: left;
		margin-left: 0;
	}
}