/**
 * Unified Blog & Content Styles
 * Single stylesheet for all content types: posts, pages, archives, blog index
 * Consistent spacing with 0.5rem increments
 * Fluid typography with clamp()
 */

@import url(globals/faqs.css);
@import url(globals/section-header.css);

/**
 * Base Layout
 */
body.page:not(.home) .site-main,
body.single:not(.home) .site-main,
body.blog .site-main,
body.archive .site-main,
body.search .site-main,
body.error404 .site-main,
body.post-type-archive-help .site-main {
	background-color: var(--base-4);
	padding-bottom: 7.5rem;
}

/* Hide featured on single posts; injected after first paragraph */
body.single .post-thumbnail {
	display: none;
}

/* Hide categories on archive/blog index */
body.blog .entry-categories,
body.archive .entry-categories,
body.post-type-archive-help .entry-categories {
	display: none;
}

/* Align meta on archive/blog index */
body.blog .entry-meta,
body.archive .entry-meta,
body.post-type-archive-help .entry-meta {
	justify-content: flex-start;
}

/**
 * Unified Content Container
 * Used for posts, pages, singles, archives - all content types
 */
.devry-blog-container {
	/* background-color: var(--base-3);
	border-radius: 1rem;
	box-shadow: var(--shadow-cards); */
	margin: 0 auto 2rem;
	max-width: 64rem;
	/* overflow: hidden; */
}

.posts-grid .devry-blog-container {
	background-color: var(--base-3);
	border-radius: 1rem;
	box-shadow: var(--shadow-cards);
}

/* Single post/page specific spacing */
body.single .devry-blog-container,
body.page .devry-blog-container {
	margin: 0 auto;
}

/**
 * Shape Decorations
 */
.blog-shape-top,
.blog-shape-bottom {
	height: 7.5rem;
	width: 100%;
}

.blog-shape-top {
	background-color: var(--base-3);
	background-repeat: no-repeat;
	background-size: cover;
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 194.3' preserveAspectRatio='none'><path d='M1200 133.3l-50 8.9c-50 8.6-150 26.9-250 31.1-100 4.2-200-4.2-300-26.7S400 89.2 300 62.2C200 35.8 100 17.5 50 8.9L0 0v194.3h1200v-61z'/></svg>");
	top: 0;
	transform: rotate(180deg);
}

.blog-shape-bottom {
	background-color: var(--base-3);
	background-repeat: no-repeat;
	background-size: cover;
	bottom: 0;
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 194.3' preserveAspectRatio='none'><path d='M1200 133.3l-50 8.9c-50 8.6-150 26.9-250 31.1-100 4.2-200-4.2-300-26.7S400 89.2 300 62.2C200 35.8 100 17.5 50 8.9L0 0v194.3h1200v-61z'/></svg>");
	position: absolute;
	z-index: 10;
}

/**
 * Entry Header - Universal
 */
.entry-header {
	/* border-bottom: 1px solid rgba(255, 255, 255, 0.05);
	padding: 2rem; */
	text-align: center;
}

.entry-title {
	color: var(--accent);
	font-family: var(--font-heading);
	font-size: clamp(2rem, 4vw, 3.5rem);
	font-weight: 700;
	line-height: 1.3;
	margin: 0;
	text-transform: capitalize;
}

/* Archive/index card titles */
.posts-grid .entry-title {
	font-size: clamp(1.25rem, 2vw, 1.5rem);
	margin-bottom: 0.75rem;
	text-align: left;
}

.posts-grid .entry-title a {
	color: var(--contrast);
	text-decoration: none;
	transition: color 0.3s ease;
}

.posts-grid .entry-title a:hover {
	color: var(--accent);
}

/* Entry Categories */
.entry-categories {
	font-family: var(--font-heading);
	margin-bottom: 1rem;
	text-transform: uppercase;
}

.entry-categories a {
	background-color: var(--base-5);
	border-radius: 0.25rem;
	color: var(--accent);
	display: inline-block;
	font-size: clamp(0.625rem, 1vw, 0.75rem);
	font-weight: 700;
	margin-right: 0.5rem;
	padding: 0.25rem 0.75rem;
	text-decoration: none;
	transition: all 0.3s ease;
}

.entry-categories a:hover {
	background-color: var(--accent);
	color: var(--contrast);
}

/* Entry Meta */
.entry-meta {
	align-items: center;
	color: var(--base);
	display: flex;
	font-size: clamp(0.625rem, 1vw, 0.725rem);
	gap: 0.5rem;
	justify-content: center;
	margin: 1rem 0;
	text-transform: uppercase;
}

.entry-meta a {
	color: var(--accent);
	text-decoration: none;
	transition: color 0.3s ease;
}

.entry-meta a:hover {
	color: var(--accent-alt);
}

.entry-meta span:not(:last-child)::after {
	content: "•";
	margin-left: 0.5rem;
}

/**
 * Featured Image - Universal
 */
.post-thumbnail {
	aspect-ratio: 16/9;
	background-color: var(--base-5);
	overflow: hidden;
	position: relative;
}

.post-featured-image,
.post-thumbnail img,
.related-post-thumbnail img {
	border-radius: 0;
	filter: grayscale(100%) blur(1px) contrast(150%);
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
	width: 100%;
}

.post-featured-image {
	align-items: center;
	display: flex;
	max-height: 360px;
	overflow: hidden;
}

/* Card hover effects for archives */
.posts-grid .devry-blog-container:hover .post-thumbnail img {
	transform: scale(1.1);
}

/**
 * Entry Content - Universal
 */
.entry-content {
	color: var(--base);
	font-size: clamp(1rem, 1.5vw, 1.125rem);
	line-height: 1.8;
	padding: 2rem;
}

/* Paragraphs */
.entry-content p {
	margin-bottom: 1.5rem;
}

.entry-content p:last-child {
	margin-bottom: 0;
}

/* Links */
.entry-content a {
	color: var(--accent);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.2rem;
	transition: all 0.3s ease;
}

.entry-content a:hover {
	color: var(--accent-alt);
	text-decoration-thickness: 3px;
}

/* Strong & Emphasis */
.entry-content strong,
.entry-content b {
	color: var(--contrast);
	font-weight: 700;
}

.entry-content em,
.entry-content i {
	font-style: italic;
}

/* Lists */
.entry-content ul,
.entry-content ol {
	margin-bottom: 1.5rem;
	padding-left: 2rem;
}

.entry-content ul li,
.entry-content ol li {
	line-height: 1.8;
	margin-bottom: 0.75rem;
}

.entry-content ul {
	list-style-type: disc;
}

.entry-content ol {
	list-style-type: decimal;
}

.entry-content ul ul,
.entry-content ol ol {
	margin-bottom: 0.75rem;
	margin-top: 0.75rem;
}

/* Blockquotes */
.entry-content blockquote {
	background-color: var(--base-5);
	border-left: 4px solid var(--accent);
	border-radius: 0.25rem;
	color: var(--contrast-2);
	font-size: clamp(1.125rem, 1.75vw, 1.25rem);
	font-style: italic;
	line-height: 1.6;
	margin: 2rem 0;
	padding: 1.5rem 2rem;
}

.entry-content blockquote p {
	margin-bottom: 0.75rem;
}

.entry-content blockquote p:last-child {
	margin-bottom: 0;
}

.entry-content blockquote cite {
	color: var(--accent);
	display: block;
	font-size: clamp(0.875rem, 1.25vw, 1rem);
	font-style: normal;
	margin-top: 0.75rem;
}

/* Tables */
.entry-content table {
	border-collapse: collapse;
	margin-bottom: 2rem;
	width: 100%;
}

.entry-content table th,
.entry-content table td {
	border: 1px solid var(--base-2);
	padding: 0.75rem 1rem;
	text-align: left;
}

.entry-content table th {
	background-color: var(--base-5);
	color: var(--contrast);
	font-weight: 700;
}

.entry-content table tr:nth-child(even) {
	background-color: rgba(255, 255, 255, 0.02);
}

/* Images */
.entry-content img {
	border-radius: 0.5rem;
	height: auto;
	margin: 2rem 0;
	max-width: 100%;
}

.entry-content figure {
	margin: 2rem 0;
}

.entry-content figcaption {
	color: var(--base);
	font-size: clamp(0.75rem, 1vw, 0.875rem);
	font-style: italic;
	margin-top: 0.75rem;
	text-align: center;
}

/* WordPress Alignment */
.entry-content .alignleft {
	float: left;
	margin: 0 2rem 1.5rem 0;
}

.entry-content .alignright {
	float: right;
	margin: 0 0 1.5rem 2rem;
}

.entry-content .aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Code */
.entry-content pre,
.entry-content code {
	background-color: #000;
	border-radius: 0.25rem;
	color: #bfff00;
	font-family: monospace;
	font-size: clamp(0.75rem, 1vw, 0.8125rem);
}

.entry-content code {
	display: inline-block;
	padding: 0.2rem 0.5rem;
}

.entry-content pre {
	line-height: 1.6;
	margin-bottom: 2rem;
	overflow-x: auto;
	padding: 0.625rem;
	width: 100%;
}

.entry-content pre code {
	background-color: transparent;
	padding: 0;
}

/* Horizontal Rule */
.entry-content hr {
	border: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
	margin: 2.5rem 0;
}

/**
 * Headings - Universal
 */
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	color: var(--contrast);
	font-family: var(--font-heading);
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: 1.5rem;
	margin-top: 2.5rem;
	text-transform: capitalize;
}

.entry-content h2:first-child,
.entry-content h3:first-child,
.entry-content h4:first-child {
	margin-top: 0;
}

.entry-content h2,
.entry-content h3 {
	font-size: clamp(1.75rem, 2.5vw, 2.25rem);
}

.entry-content h4 {
	font-size: clamp(1.375rem, 2vw, 1.75rem);
}

.entry-content h5 {
	font-size: clamp(1.125rem, 1.5vw, 1.375rem);
}

.entry-content h6 {
	font-size: clamp(1rem, 1.25vw, 1.125rem);
}

/**
 * Entry Footer - Universal
 */
.entry-footer {
	border-top: 1px solid rgba(255, 255, 255, 0.05);
	padding: 1.5rem 2rem;
}

/* Post Tags */
.post-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.post-tags a {
	background-color: var(--base-5);
	border-radius: 0.25rem;
	color: var(--base);
	display: inline-block;
	font-size: clamp(0.75rem, 1vw, 0.875rem);
	padding: 0.5rem 1rem;
	text-decoration: none;
	transition: all 0.3s ease;
}

.post-tags a:hover {
	background-color: var(--accent);
	color: var(--contrast);
}

/**
 * Archive & Blog Index Grid
 */
.page-header {
	margin-bottom: 4rem;
	padding: 4rem 0 2rem;
	text-align: center;
}

.page-header .page-title {
	color: var(--accent);
	font-size: clamp(2rem, 4vw, 3.5rem);
	margin-bottom: 1rem;
}

.page-header .archive-description {
	color: var(--base);
	font-size: clamp(1rem, 1.5vw, 1.125rem);
	line-height: 1.6;
	margin: 0 auto;
	max-width: 37.5rem;
}

.posts-grid {
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
	margin-bottom: 4rem;
}

.posts-grid .devry-blog-container {
	animation: fadeInUp 0.6s ease-out forwards;
	border: 2px solid transparent;
	margin: 0;
	opacity: 0;
	transform: translateY(1.875rem);
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.posts-grid .devry-blog-container:nth-child(1) {
	animation-delay: 0.1s;
}

.posts-grid .devry-blog-container:nth-child(2) {
	animation-delay: 0.2s;
}

.posts-grid .devry-blog-container:nth-child(3) {
	animation-delay: 0.3s;
}

.posts-grid .devry-blog-container:nth-child(4) {
	animation-delay: 0.4s;
}

.posts-grid .devry-blog-container:hover {
	border-color: var(--accent);
	box-shadow: 0 0.5rem 1.875rem rgba(0, 0, 0, 0.3);
	transform: translateY(-0.5rem);
}

.posts-grid .entry-header {
	border: none;
	padding: 1.5rem 1.5rem 0;
	text-align: left;
}

.posts-grid .entry-content {
	padding: 0 1.5rem 1.5rem;
}

.posts-grid .entry-content p {
	color: var(--base);
	font-size: clamp(0.875rem, 1.25vw, 1rem);
	margin-bottom: 1rem;
}

/**
 * Post Navigation
 */
.post-navigation {
	align-items: center;
	display: flex;
	gap: 1.5rem;
	justify-content: space-between;
	margin: 2rem 0;
	text-transform: capitalize;
}

.post-navigation div+div {
	text-align: right;
}

.post-navigation a {
	color: var(--accent);
	text-decoration: none;
	transition: color 0.3s ease;
}

.post-navigation a:hover {
	color: var(--accent-alt);
}

/**
 * Related Posts & Related Help Articles
 */
.related-posts-title,
.related-help h3 {
	color: var(--accent);
	margin: 3rem 0 2rem;
	text-align: center;
}

.related-posts-grid,
.related-help-grid {
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
	margin-bottom: 3rem;
}

.related-post,
.related-help-item {
	animation: fadeInUp 0.6s ease-out forwards;
	background-color: var(--base-3);
	border: 2px solid transparent;
	border-radius: 1rem;
	box-shadow: var(--shadow-cards);
	opacity: 0;
	overflow: hidden;
	transform: translateY(1.875rem);
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.related-post:nth-child(1),
.related-help-item:nth-child(1) {
	animation-delay: 0.2s;
}

.related-post:nth-child(2),
.related-help-item:nth-child(2) {
	animation-delay: 0.4s;
}

.related-post:nth-child(3),
.related-help-item:nth-child(3) {
	animation-delay: 0.6s;
}

.related-post:hover,
.related-help-item:hover {
	border-color: var(--accent);
	transform: translateY(-0.5rem);
}

.related-post-thumbnail {
	aspect-ratio: 16/9;
	background-color: var(--base-5);
	overflow: hidden;
}

.related-post-thumbnail img {
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
	width: 100%;
}

.related-post:hover .related-post-thumbnail img {
	transform: scale(1.1);
}

.related-post .post-content,
.related-help-item {
	padding: 1.5rem;
}

.related-post-title,
.related-help-item h4 {
	font-size: clamp(1.125rem, 1.5vw, 1.25rem);
	line-height: 1.4;
	margin-bottom: 0.75rem;
	text-transform: uppercase;
}

.related-post-title a,
.related-help-item h4 a {
	color: var(--contrast);
	text-decoration: none;
	transition: color 0.3s ease;
}

.related-post-title a:hover,
.related-help-item h4 a:hover {
	color: var(--accent);
}

.related-post-meta,
.related-help-excerpt {
	color: var(--base);
	font-size: clamp(0.75rem, 1vw, 0.875rem);
	line-height: 1.6;
	margin-bottom: 1rem;
}

.related-help-excerpt {
	margin-bottom: 0;
}

/**
 * Help Article Specific Styles
 */

/* Help Archive Grid - Same as Posts Grid */
body.post-type-archive-help .posts-grid .devry-blog-container {
	display: flex;
	flex-direction: column;
}

/* Help Icon */
.help-icon {
	color: var(--accent);
	font-size: clamp(2rem, 3vw, 3rem);
	margin-bottom: 1rem;
}

.help-icon .dashicons {
	font-size: inherit;
	height: auto;
	width: auto;
}

/* Help Icon in Archive Cards */
.posts-grid .help-icon {
	font-size: clamp(1.5rem, 2vw, 2rem);
	margin-bottom: 0.75rem;
	text-align: left;
}

/* Help Meta */
.help-meta {
	align-items: center;
	color: var(--base);
	display: flex;
	flex-wrap: wrap;
	font-size: clamp(0.75rem, 1vw, 0.875rem);
	gap: 1rem;
	justify-content: center;
	margin-top: 1rem;
}

/* Help Meta in Archive Cards */
.posts-grid .help-meta {
	gap: 0.5rem;
	justify-content: flex-start;
	margin-top: 0.75rem;
}

.help-category,
.help-difficulty,
.help-updated {
	background-color: var(--base-5);
	border-radius: 0.25rem;
	font-size: clamp(0.625rem, 0.9vw, 0.75rem);
	font-weight: 700;
	padding: 0.25rem 0.75rem;
	text-transform: uppercase;
}

.help-difficulty-easy,
.help-difficulty-beginner {
	background-color: var(--color-success);
	color: var(--contrast);
}

.help-difficulty-medium,
.help-difficulty-intermediate {
	background-color: var(--color-warning);
	color: var(--contrast);
}

.help-difficulty-hard,
.help-difficulty-advanced {
	background-color: var(--color-error);
	color: var(--contrast);
}

.help-footer-actions {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
	justify-content: space-between;
}

.help-feedback {
	text-align: center;
}

.help-feedback p {
	color: var(--base);
	font-size: clamp(0.875rem, 1.25vw, 1rem);
	margin-bottom: 0.75rem;
}

.help-feedback-buttons {
	display: flex;
	gap: 0.75rem;
	justify-content: center;
}

/**
 * Back to Blog Link
 */
.back-to-blog {
	font-size: clamp(1rem, 1.5vw, 1.125rem);
	margin-bottom: 2rem;
	text-align: center;
	text-transform: uppercase;
}

.back-to-blog a {
	color: var(--contrast);
	font-family: var(--font-heading);
	text-decoration: none;
	transition: color 0.3s ease;
}

.back-to-blog a:hover {
	color: var(--accent);
}

.back-to-blog span {
	position: relative;
	top: -0.2rem;
}

/**
 * Responsive Design
 */

/* Tablet (1024px and below) */
@media (max-width: 1024px) {

	.posts-grid,
	.related-posts-grid {
		gap: 1.5rem;
		grid-template-columns: repeat(2, 1fr);
	}

	.page-header {
		margin-bottom: 3rem;
		padding: 3rem 0 1.5rem;
	}
}

/* Mobile (768px and below) */
@media (max-width: 768px) {

	.posts-grid,
	.related-posts-grid,
	.related-help-grid {
		gap: 1.5rem;
		grid-template-columns: 1fr;
	}

	.help-footer-actions {
		flex-direction: column;
		gap: 1.5rem;
		text-align: center;
	}

	.help-meta {
		gap: 0.75rem;
	}

	.posts-grid .help-icon {
		font-size: clamp(1.25rem, 2vw, 1.5rem);
	}

	.posts-grid .help-meta {
		gap: 0.5rem;
	}

	.page-header {
		margin-bottom: 2rem;
		padding: 2rem 0 1rem;
	}

	.page-header .page-title {
		font-size: clamp(1.75rem, 6vw, 2.5rem);
	}

	.page-header .archive-description {
		font-size: clamp(0.875rem, 1.5vw, 1rem);
		padding: 0 1rem;
	}

	.entry-header {
		padding: 1.5rem 1rem;
	}

	.entry-content {
		font-size: clamp(0.875rem, 1.5vw, 1rem);
		padding: 1.5rem 1rem;
	}

	.entry-content p {
		margin-bottom: 1.5rem;
	}

	.entry-content blockquote {
		font-size: clamp(1rem, 1.75vw, 1.125rem);
		padding: 1.5rem 1rem;
	}

	.entry-content ul,
	.entry-content ol {
		padding-left: 1.5rem;
	}

	.entry-content table {
		display: block;
		-webkit-overflow-scrolling: touch;
		overflow-x: auto;
	}

	.entry-content table th,
	.entry-content table td {
		font-size: clamp(0.75rem, 1.25vw, 0.875rem);
		padding: 0.5rem 0.75rem;
	}

	.entry-content .alignleft,
	.entry-content .alignright {
		display: block;
		float: none;
		margin: 1.5rem auto;
	}

	.entry-footer {
		padding: 1.5rem 1rem;
	}

	.post-navigation {
		display: block;
		text-align: center;
	}

	.post-navigation div+div {
		margin-top: 1rem;
		text-align: center;
	}

	.posts-grid .devry-blog-container {
		border-radius: 0.75rem;
	}

	.posts-grid .entry-header {
		padding: 1.5rem 1rem 0;
	}

	.posts-grid .entry-content {
		padding: 0 1rem 1.5rem;
	}

	.devry-blog-container {
		border-radius: 0.75rem;
	}
}

/* Small Mobile (480px and below) */
@media (max-width: 480px) {
	.entry-content {
		font-size: clamp(0.8125rem, 1.5vw, 0.9375rem);
		line-height: 1.7;
	}

	.entry-content blockquote {
		font-size: clamp(0.875rem, 1.75vw, 1rem);
		padding: 1rem 0.75rem;
	}

	.posts-grid,
	.related-posts-grid,
	.related-help-grid {
		gap: 1rem;
	}

	.help-feedback-buttons {
		flex-direction: column;
	}

	.help-feedback-buttons .button {
		width: 100%;
	}
}

/**
 * Search Results Page
 */

/* Search Page Header */
body.search .page-header {
	margin-bottom: 4rem;
	padding: 4rem 0 2rem;
	text-align: center;
}

body.search .page-header .page-title {
	color: var(--accent);
	font-size: clamp(2rem, 4vw, 3.5rem);
	margin-bottom: 1rem;
	text-transform: uppercase;
}

body.search .page-header .page-title span {
	color: var(--contrast);
	font-style: italic;
}

body.search .page-header .archive-description {
	color: var(--base);
	font-size: clamp(1rem, 1.5vw, 1.125rem);
	line-height: 1.6;
	margin: 0 auto;
	max-width: 37.5rem;
}

body.search .page-header .archive-description strong {
	color: var(--accent);
}

/* Search No Results Section */
.search-no-results {
	display: grid;
	gap: 3rem;
	grid-template-columns: 1fr 1fr;
	margin-top: 3rem;
}

.search-again,
.search-suggestions {
	background-color: var(--base-3);
	border: 1px solid rgba(255, 255, 255, 0.05);
	border-radius: 1rem;
	box-shadow: var(--shadow-cards);
	padding: 2rem;
}

.search-again h3,
.search-suggestions h3 {
	color: var(--accent);
	font-family: var(--font-heading);
	font-size: clamp(1.25rem, 1.75vw, 1.5rem);
	margin-bottom: 1.5rem;
	margin-top: 0;
	text-transform: uppercase;
}

/* Search Form in No Results */
.search-again .search-form {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.search-again .search-field {
	background-color: var(--base-5);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 0.5rem;
	color: var(--contrast);
	font-size: clamp(0.875rem, 1.25vw, 1rem);
	padding: 0.75rem 1rem;
	transition: border-color 0.3s ease;
	width: 100%;
}

.search-again .search-field:focus {
	border-color: var(--accent);
	outline: none;
}

.search-again .search-submit {
	background-color: var(--accent);
	border: none;
	border-radius: 0.5rem;
	color: var(--contrast);
	cursor: pointer;
	font-size: clamp(0.875rem, 1.25vw, 1rem);
	font-weight: 700;
	padding: 0.75rem 1.5rem;
	text-transform: uppercase;
	transition: all 0.3s ease;
	width: 100%;
}

.search-again .search-submit:hover {
	background-color: var(--accent-alt);
	box-shadow: var(--shadow-md);
	transform: translateY(-2px);
}

/* Recent Posts in No Results */
.recent-posts-list {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.recent-post-item {
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
	padding-bottom: 1.5rem;
}

.recent-post-item:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.recent-post-item h4 {
	font-size: clamp(1rem, 1.5vw, 1.125rem);
	margin-bottom: 0.5rem;
	margin-top: 0;
}

.recent-post-item h4 a {
	color: var(--contrast);
	text-decoration: none;
	transition: color 0.3s ease;
}

.recent-post-item h4 a:hover {
	color: var(--accent);
}

.recent-post-item .post-meta {
	color: var(--base-2);
	font-size: clamp(0.75rem, 1vw, 0.875rem);
}

/* Search Results Grid - Same as Archive */
body.search .posts-grid {
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
	margin-bottom: 4rem;
	margin-top: 3rem;
}

/* Search Result Cards */
body.search .posts-grid .devry-blog-container {
	animation: fadeInUp 0.6s ease-out forwards;
	background-color: var(--base-3);
	border: 2px solid transparent;
	border-radius: 1rem;
	box-shadow: var(--shadow-cards);
	margin: 0;
	opacity: 0;
	overflow: hidden;
	transform: translateY(1.875rem);
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

body.search .posts-grid .devry-blog-container:hover {
	border-color: var(--accent);
	box-shadow: 0 0.5rem 1.875rem rgba(0, 0, 0, 0.3);
	transform: translateY(-0.5rem);
}

/* Search Result Meta */
body.search .entry-categories {
	display: block;
}

body.search .entry-meta {
	justify-content: flex-start;
}

/* Search Responsive */
@media (max-width: 1024px) {
	body.search .page-header {
		margin-bottom: 3rem;
		padding: 3rem 0 1.5rem;
	}

	body.search .posts-grid {
		gap: 1.5rem;
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px) {
	body.search .page-header {
		margin-bottom: 2rem;
		padding: 2rem 0 1rem;
	}

	body.search .page-header .page-title {
		font-size: clamp(1.75rem, 6vw, 2.5rem);
	}

	body.search .page-header .archive-description {
		font-size: clamp(0.875rem, 1.5vw, 1rem);
		padding: 0 1rem;
	}

	.search-no-results {
		gap: 2rem;
		grid-template-columns: 1fr;
	}

	.search-again,
	.search-suggestions {
		padding: 1.5rem 1rem;
	}

	body.search .posts-grid {
		gap: 1.5rem;
		grid-template-columns: 1fr;
		margin-top: 2rem;
	}
}

@media (max-width: 480px) {
	.search-no-results {
		gap: 1.5rem;
	}

	.search-again,
	.search-suggestions {
		padding: 1rem;
	}

	body.search .posts-grid {
		gap: 1rem;
	}
}

/**
 * 404 Error Page
 */

/* 404 Page Container */
.error-404-page .container {
	max-width: 64rem;
}

.error-404 {
	padding: 0;
}

/* 404 Header */
.error-404 .page-header {
	margin-bottom: 4rem;
	padding: 4rem 0 2rem;
	text-align: center;
}

.error-404-number {
	animation: fadeInScale 0.6s ease-out;
	color: var(--accent);
	font-family: var(--font-heading);
	font-size: clamp(6rem, 15vw, 12rem);
	font-weight: 900;
	line-height: 1;
	margin-bottom: 1rem;
	opacity: 0.3;
	text-shadow: 0 0 2rem rgba(74, 181, 172, 0.2);
}

.error-404 .page-header .page-title {
	color: var(--accent);
	font-size: clamp(2rem, 4vw, 3rem);
	margin-bottom: 1rem;
	text-transform: uppercase;
}

.error-subtitle {
	color: var(--base);
	font-size: clamp(1rem, 1.5vw, 1.125rem);
	line-height: 1.8;
	margin: 0 auto;
	max-width: 40rem;
}

/* 404 Page Content */
.error-404 .page-content {
	display: flex;
	flex-direction: column;
	gap: 3rem;
}

/* 404 Search Section */
.error-404-search {
	background-color: var(--base-3);
	border: 1px solid rgba(255, 255, 255, 0.05);
	border-radius: 1rem;
	box-shadow: var(--shadow-cards);
	margin: 0 auto;
	max-width: 40rem;
	padding: 2.5rem 2rem;
	text-align: center;
	width: 100%;
}

.error-404-search h3 {
	color: var(--contrast);
	font-family: var(--font-heading);
	font-size: clamp(1.25rem, 1.75vw, 1.5rem);
	margin-bottom: 1.5rem;
	margin-top: 0;
	text-transform: uppercase;
}

.error-404-search .search-form {
	display: flex;
	gap: 0.75rem;
}

.error-404-search .search-field {
	background-color: var(--base-5);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 0.5rem;
	color: var(--contrast);
	flex: 1;
	font-size: clamp(0.875rem, 1.25vw, 1rem);
	padding: 0.875rem 1.25rem;
	transition: border-color 0.3s ease;
}

.error-404-search .search-field:focus {
	border-color: var(--accent);
	outline: none;
}

.error-404-search .search-submit {
	background-color: var(--accent);
	border: none;
	border-radius: 0.5rem;
	color: var(--contrast);
	cursor: pointer;
	font-size: clamp(0.875rem, 1.25vw, 1rem);
	font-weight: 700;
	padding: 0.875rem 2rem;
	text-transform: uppercase;
	transition: all 0.3s ease;
}

.error-404-search .search-submit:hover {
	background-color: var(--accent-alt);
	box-shadow: var(--shadow-md);
	transform: translateY(-2px);
}

/* 404 Grid Section */
.error-404-grid {
	display: grid;
	gap: 2rem;
	grid-template-columns: repeat(2, 1fr);
}

.error-404-links,
.error-404-recent {
	background-color: var(--base-3);
	border: 1px solid rgba(255, 255, 255, 0.05);
	border-radius: 1rem;
	box-shadow: var(--shadow-cards);
	padding: 2rem;
}

.error-404-links h3,
.error-404-recent h3 {
	color: var(--accent);
	font-family: var(--font-heading);
	font-size: clamp(1.125rem, 1.5vw, 1.25rem);
	margin-bottom: 1.5rem;
	margin-top: 0;
	text-transform: uppercase;
}

.error-404-links ul,
.error-404-recent ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.error-404-links ul li,
.error-404-recent ul li {
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
	padding: 0.75rem 0;
}

.error-404-links ul li:last-child,
.error-404-recent ul li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.error-404-links ul li:first-child,
.error-404-recent ul li:first-child {
	padding-top: 0;
}

.error-404-links ul li a,
.error-404-recent ul li a {
	color: var(--base);
	display: block;
	font-size: clamp(0.875rem, 1.25vw, 1rem);
	text-decoration: none;
	transition: all 0.3s ease;
}

.error-404-links ul li a:hover,
.error-404-recent ul li a:hover {
	color: var(--accent);
	padding-left: 0.5rem;
}

.error-404-recent ul li {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.error-404-recent ul li time {
	color: var(--base-2);
	font-size: clamp(0.75rem, 1vw, 0.875rem);
}

/* Back to Home Button */
.error-404 .back-to-home {
	text-align: center;
}

.error-404 .back-to-home .button {
	font-size: clamp(1rem, 1.25vw, 1.125rem);
	min-width: 15rem;
	padding: 1rem 2.5rem;
}

/* 404 Responsive */
@media (max-width: 768px) {
	.error-404 .page-header {
		margin-bottom: 3rem;
		padding: 3rem 0 1.5rem;
	}

	.error-404-number {
		font-size: clamp(4rem, 20vw, 8rem);
	}

	.error-404 .page-header .page-title {
		font-size: clamp(1.75rem, 6vw, 2.5rem);
	}

	.error-subtitle {
		font-size: clamp(0.875rem, 1.5vw, 1rem);
		padding: 0 1rem;
	}

	.error-404 .page-content {
		gap: 2rem;
	}

	.error-404-search {
		padding: 2rem 1.5rem;
	}

	.error-404-search .search-form {
		flex-direction: column;
	}

	.error-404-search .search-submit {
		width: 100%;
	}

	.error-404-grid {
		gap: 1.5rem;
		grid-template-columns: 1fr;
	}

	.error-404-links,
	.error-404-recent {
		padding: 1.5rem 1rem;
	}

	.error-404 .back-to-home .button {
		width: 100%;
	}
}

@media (max-width: 480px) {
	.error-404 .page-header {
		margin-bottom: 2rem;
		padding: 2rem 0 1rem;
	}

	.error-404-number {
		font-size: clamp(3rem, 25vw, 6rem);
	}

	.error-404 .page-content {
		gap: 1.5rem;
	}

	.error-404-search {
		padding: 1.5rem 1rem;
	}

	.error-404-links,
	.error-404-recent {
		border-radius: 0.75rem;
		padding: 1rem;
	}
}

/**
 * Keyframe Animations
 */
@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(1.875rem);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes fadeInScale {
	from {
		opacity: 0;
		transform: scale(0.8);
	}

	to {
		opacity: 0.3;
		transform: scale(1);
	}
}
