/* Search Results Styles - Mobile First */

/* Search Results Page Container */
.search-results-container {
	background-color: var(--white-primary);
	min-height: 100vh;
	padding-top: 50px;
	padding-bottom: 80px;
}

.search-page-title {
	font-family: var(--font-family-primary);
	font-size: 24px;
	font-weight: 700;
	background: var(--dark-to-light-violet-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	margin: 0 0 var(--spacing-md) 0;
	line-height: 110.00000000000001%;
	letter-spacing: -1%;
	display: block;
}

.search-results-list {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-lg);
}

/* Search Result Item */
.search-results-list article {
	background-color: var(--white-primary);
	border: 1px solid var(--primary-violet-light);
	border-radius: var(--border-radius-sm);
	padding: var(--spacing-md);
	transition: all 0.3s ease;
}

.search-results-list article:hover {
	border-color: var(--primary-violet-dark);
	box-shadow: 0 4px 12px rgba(104, 12, 174, 0.1);
}

.search-results-list .entry-title {
	font-family: var(--font-family-primary);
	font-size: 18px;
	font-weight: 600;
	margin: 0 0 var(--spacing-sm) 0;
	line-height: 1.3;
}

.search-results-list .entry-title a {
	color: var(--primary-violet-dark);
	text-decoration: none;
	transition: color 0.3s ease;
}

.search-results-list .entry-title a:hover {
	color: var(--primary-violet-light);
}

.search-results-list .entry-meta {
	font-family: var(--font-family-primary);
	font-size: 14px;
	color: var(--grey-secondary);
	margin-bottom: var(--spacing-sm);
}

.search-results-list .entry-summary {
	font-family: var(--font-family-primary);
	font-size: 14px;
	line-height: 1.5;
	color: var(--grey-primary);
	margin-bottom: var(--spacing-sm);
}

.search-results-list .entry-footer {
	font-family: var(--font-family-primary);
	font-size: 12px;
	color: var(--grey-secondary);
}

#primary > div > div > section > header > h1 {
	font-family: var(--font-family-primary);
	font-size: 20px;
	font-weight: 700;
	background: var(--dark-to-light-violet-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	margin: 0 0 var(--spacing-md) 0;
	line-height: 110.00000000000001%;
	letter-spacing: -1%;
	display: block;
}

#primary > div > div > section > div > p {
	width: 100%;
	font-family: var(--font-family-primary);
	font-size: 16px;
	line-height: 1.5;
	font-weight: 500;
	letter-spacing: -2%;
	color: var(--primary-violet-dark);
	margin-bottom: var(--spacing-md);
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.search-results-list {
		gap: var(--spacing-xl);
	}

	.search-results-list article {
		padding: var(--spacing-lg);
	}

	.search-results-list .entry-title {
		font-size: 20px;
	}

	.search-results-list .entry-summary {
		font-size: 16px;
	}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.search-results-list .entry-title {
		font-size: 22px;
	}

	#primary > div > div > section > div > p {
		width: 30%;
	}
}

@media (min-width: 1200px) {
	.search-page-title {
		font-size: 24px;
		padding-left: 3rem;
	}
}

@media (min-width: 1400px) {
	.search-page-title {
		font-size: 51px;
	}

	.page-content p {
		font-size: 20px;
	}

	#primary > div > div > section > header > h1 {
		font-family: var(--font-family-primary);
		font-size: 28px;
		font-weight: 700;
		background: var(--dark-to-light-violet-gradient);
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
		color: transparent;
		margin: 0 0 var(--spacing-md) 0;
		line-height: 110.00000000000001%;
		letter-spacing: -1%;
		display: block;
	}

	/* #primary > div > div > section > div {
		margin-bottom: 7rem;
	} */

	#primary > div > div > section {
		margin-top: 3rem;
		padding-left: 4rem;
	}
}

@media (min-width: 1800px) {
	.search-page-title {
		font-size: 64px;
		padding-left: 3rem;
	}

	#primary > div > div > section {
		padding-left: 0;
	}
}