/* ============================================================
   Main Styles (Pulitzer Theme - Nathan Courtney)
   ============================================================ */

:root {
	--wp--preset--color--base: #FFFFFF;
	--wp--preset--color--base-2: #F9F9F9;
	--wp--preset--color--contrast: #191716;
	--wp--preset--color--contrast-2: #666666;
	--wp--preset--color--contrast-3: #767676;
	--wp--preset--color--contrast-4: #DADADA;
	--wp--preset--color--contrast-5: #EEEEEE;

	--wp--preset--spacing--10: 4px;
	--wp--preset--spacing--20: 8px;
	--wp--preset--spacing--30: 12px;
	--wp--preset--spacing--40: 16px;
	--wp--preset--spacing--50: 24px;
	--wp--preset--spacing--60: 32px;
	--wp--preset--spacing--70: clamp(32px, 4.8vw, 48px);
	--wp--preset--spacing--80: clamp(48px, 6.4vw, 64px);
	--wp--preset--spacing--90: clamp(64px, 9.6vw, 96px);
	--wp--preset--spacing--100: clamp(64px, 12.8vw, 128px);
	--wp--preset--spacing--body-margin: 24px;

	--wp--preset--font-size--xx-small: 12px;
	--wp--preset--font-size--x-small: 14px;
	--wp--preset--font-size--small: 16px;
	--wp--preset--font-size--medium: 18px;
	--wp--preset--font-size--large: 21px;
	--wp--preset--font-size--x-large: clamp(21px, 1.313rem + ((1vw - 3.2px) * 0.602), 24px);
	--wp--preset--font-size--xx-large: clamp(24px, 1.5rem + ((1vw - 3.2px) * 1.606), 32px);

	--wp--preset--font-family--body: "Bear Sans UI", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
	--wp--preset--font-family--system-sans-serif: "Bear Sans UI", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;

	--wp--style--global--content-size: 608px;
	--wp--style--global--wide-size: 818px;
	--wp--style--block-gap: 24px;
}

* {
	box-sizing: border-box;
}

body {
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 400;
	line-height: 1.5;
	margin: 0;
	padding-right: var(--wp--preset--spacing--body-margin);
	padding-left: var(--wp--preset--spacing--body-margin);
}

a {
	color: inherit;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--wp--preset--font-family--system-sans-serif);
	line-height: 1.5;
	margin-top: var(--wp--preset--spacing--70);
	margin-bottom: var(--wp--preset--spacing--50);
}

h1 {
	font-size: var(--wp--preset--font-size--large);
	font-weight: 500;
}

h2 {
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 500;
}

h3 {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

h4 {
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
}

/* ============================================================
   Layout Classes
   ============================================================ */

.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.wp-block-template-part {
	width: 100%;
}

.wp-block-template-main {
	flex: 1;
}

.wp-block-group {
	display: block;
	box-sizing: border-box;
}

.wp-block-group.has-global-padding {
	padding-right: var(--wp--preset--spacing--body-margin);
	padding-left: var(--wp--preset--spacing--body-margin);
}

.wp-block-group.is-layout-constrained {
	position: relative;
}

.wp-block-group.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: var(--wp--style--global--content-size);
	margin-left: auto !important;
	margin-right: auto !important;
}

.wp-block-group.is-layout-constrained > .alignwide {
	max-width: var(--wp--style--global--wide-size);
}

.wp-block-group.is-layout-flow > * {
	margin-block-start: var(--wp--style--block-gap);
	margin-block-end: 0;
}

.wp-block-group.is-layout-flow > :first-child {
	margin-block-start: 0;
}

.wp-block-group.is-layout-flow > :last-child {
	margin-block-end: 0;
}

.wp-block-group.is-layout-flex {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--style--block-gap);
	align-items: center;
}

/* WordPress container classes for specific layout control */
.wp-container-core-group-is-layout-ea0cb840 {
	gap: var(--wp--preset--spacing--10);
	flex-direction: column;
	align-items: flex-start;
}

.wp-container-core-group-is-layout-db647d9c {
	gap: var(--wp--preset--spacing--40);
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
}

.wp-container-core-column-is-layout-f1f2ed93 > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	margin-right: 0 !important;
}

.wp-container-core-columns-is-layout-cbe57604 {
	flex-wrap: nowrap;
	gap: 2em var(--wp--preset--spacing--50);
}

:root :where(.wp-block-columns-is-layout-flex) {
	gap: var(--wp--preset--spacing--50);
}

:root :where(.wp-block-columns-is-layout-flow) > :first-child {
	margin-block-start: 0;
}

:root :where(.wp-block-columns-is-layout-flow) > :last-child {
	margin-block-end: 0;
}

:root :where(.wp-block-columns-is-layout-flow) > * {
	margin-block-start: var(--wp--preset--spacing--50);
	margin-block-end: 0;
}

/* ============================================================
   Header
   ============================================================ */

header.wp-block-template-part {
	border-bottom: 1px solid var(--wp--preset--color--contrast-5);
	padding-top: var(--wp--preset--spacing--70);
	padding-bottom: var(--wp--preset--spacing--70);
}

.wp-block-site-title {
	box-sizing: border-box;
	margin: 0;
	font-family: var(--wp--preset--font-family--system-sans-serif);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	line-height: inherit;
}

.wp-block-site-title a {
	color: inherit;
	text-decoration: none;
}

.wp-block-site-title a:hover {
	text-decoration: underline;
}

.site-tagline {
	color: var(--wp--preset--color--contrast-2);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	margin: var(--wp--preset--spacing--20) 0 0;
	font-style: italic;
}

/* ============================================================
   Main Content
   ============================================================ */

main.wp-block-template-main {
	padding-top: var(--wp--preset--spacing--100);
	padding-bottom: var(--wp--preset--spacing--100);
}

/* ============================================================
   Post Grid / Template
   ============================================================ */

.wp-block-query {
	display: block;
}

.wp-block-post-template {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--100);
}

@media (min-width: 600px) {
	.wp-block-post-template {
		grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
		gap: var(--wp--preset--spacing--50);
	}
}

.wp-block-post {
	display: flex;
	flex-direction: column;
}

/* ============================================================
   Post Card
   ============================================================ */

.wp-block-post-title {
	box-sizing: border-box;
	word-break: break-word;
	margin: 0 0 var(--wp--preset--spacing--30) 0;
}

.wp-block-post-title a {
	display: inline-block;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	text-decoration: none;
}

.wp-block-post-title a:hover {
	text-decoration: underline;
}

.wp-block-post-date {
	box-sizing: border-box;
	color: var(--wp--preset--color--contrast-2);
	font-family: var(--wp--preset--font-family--system-sans-serif);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 400;
}

.wp-block-post-date a {
	color: var(--wp--preset--color--contrast-2);
	text-decoration: none;
}

.wp-block-post-date a:hover {
	text-decoration: underline;
}

.wp-block-group.has-contrast-2-color {
	color: var(--wp--preset--color--contrast-2);
}

.wp-block-group.has-text-color a:where(:not(.wp-element-button)) {
	color: inherit;
}

.wp-block-group.has-small-font-size {
	font-size: var(--wp--preset--font-size--small) !important;
}

.wp-block-group.is-nowrap {
	flex-wrap: nowrap;
	gap: var(--wp--preset--spacing--20);
}

.wp-block-group.is-nowrap > p {
	margin: 0;
}

/* ============================================================
   Post Excerpt
   ============================================================ */

.is-style-pulitzer-clamp-lines-3 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	/* Add both standard and WebKit properties for compatibility */
	line-clamp: 3;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

.wp-block-post-excerpt {
	box-sizing: border-box;
	margin: var(--wp--preset--spacing--50) 0;
	line-height: inherit;
}

.wp-block-post-excerpt p {
	margin: 0;
}

/* ============================================================
   Post Terms / Categories
   ============================================================ */

.wp-block-post-terms {
	box-sizing: border-box;
	font-family: var(--wp--preset--font-family--system-sans-serif);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 400;
}

.wp-block-post-terms a {
	text-decoration: none;
}

.wp-block-post-terms a:hover {
	text-decoration: underline;
}

.taxonomy-category {
	display: inline;
}

/* ============================================================
   Pagination
   ============================================================ */

.wp-block-query-pagination {
	color: var(--wp--preset--color--contrast-2);
	font-family: var(--wp--preset--font-family--system-sans-serif);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	margin-top: var(--wp--preset--spacing--100);
	display: flex;
	gap: var(--wp--preset--spacing--60);
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

.wp-block-query-pagination-numbers {
	display: flex;
	gap: var(--wp--preset--spacing--60);
	flex-wrap: wrap;
}

.page-numbers {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.page-numbers:hover {
	text-decoration: underline;
}

.page-numbers.current {
	color: var(--wp--preset--color--contrast-2);
	cursor: default;
	text-decoration: none;
}

.wp-block-query-pagination-next,
.wp-block-query-pagination-previous {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.wp-block-query-pagination-next:hover,
.wp-block-query-pagination-previous:hover {
	text-decoration: underline;
}

/* ============================================================
   Site Logo
   ============================================================ */

.wp-block-site-logo {
	box-sizing: border-box;
	line-height: 0;
}

.wp-block-site-logo a {
	display: inline-block;
	line-height: 0;
}

.wp-block-site-logo.is-default-size img {
	height: auto;
	width: 120px;
}

.wp-block-site-logo img {
	height: auto;
	max-width: 100%;
}

.wp-block-site-logo a,
.wp-block-site-logo img {
	border-radius: inherit;
}

.wp-block-site-logo.aligncenter {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

:root :where(.wp-block-site-logo.is-style-rounded),
:root :where(.wp-block-site-logo.is-style-rounded--1) {
	border-radius: 9999px;
}

/* ============================================================
   Columns
   ============================================================ */

.wp-block-columns {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--50);
	margin-bottom: var(--wp--preset--spacing--50);
	align-items: normal !important;
	box-sizing: border-box;
}

@media (min-width: 782px) {
	.wp-block-columns {
		flex-wrap: nowrap !important;
	}
}

.wp-block-columns.are-vertically-aligned-top {
	align-items: flex-start;
}

.wp-block-columns.are-vertically-aligned-center {
	align-items: center;
}

.wp-block-columns.are-vertically-aligned-bottom {
	align-items: flex-end;
}

@media (max-width: 781px) {
	.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
		flex-basis: 100% !important;
	}
}

@media (min-width: 782px) {
	.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
		flex-basis: 0;
		flex-grow: 1;
	}

	.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis"] {
		flex-grow: 0;
	}
}

.wp-block-columns.is-not-stacked-on-mobile {
	flex-wrap: nowrap !important;
}

.wp-block-columns.is-not-stacked-on-mobile > .wp-block-column {
	flex-basis: 0;
	flex-grow: 1;
}

.wp-block-columns.is-not-stacked-on-mobile > .wp-block-column[style*="flex-basis"] {
	flex-grow: 0;
}

:where(.wp-block-columns) {
	margin-bottom: 1.75em;
}

:where(.wp-block-columns.has-background) {
	padding: 1.25em 2.375em;
}

.wp-block-column {
	flex-grow: 1;
	min-width: 0;
	overflow-wrap: break-word;
	word-break: break-word;
}

.wp-block-column.is-vertically-aligned-top {
	align-self: flex-start;
}

.wp-block-column.is-vertically-aligned-center {
	align-self: center;
}

.wp-block-column.is-vertically-aligned-bottom {
	align-self: flex-end;
}

.wp-block-column.is-vertically-aligned-stretch {
	align-self: stretch;
}

.wp-block-column.is-vertically-aligned-bottom,
.wp-block-column.is-vertically-aligned-center,
.wp-block-column.is-vertically-aligned-top {
	width: 100%;
}

/* ============================================================
   Footer
   ============================================================ */

footer.wp-block-template-part {
	margin-top: auto;
	border-top: 1px solid var(--wp--preset--color--contrast-5);
	padding-top: var(--wp--preset--spacing--100);
	padding-bottom: var(--wp--preset--spacing--100);
}

.wp-block-heading {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	margin-top: 0;
	margin-bottom: var(--wp--preset--spacing--50);
}

.wp-block-heading.has-small-font-size {
	font-size: var(--wp--preset--font-size--small) !important;
}

/* ============================================================
   Social Links
   ============================================================ */

.wp-block-social-links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: var(--wp--preset--spacing--30);
	flex-wrap: wrap;
}

.wp-block-social-links-is-layout-flex {
	display: flex;
	gap: 0.333333em;
	flex-wrap: wrap;
}

.wp-social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 4px;
	transition: all 0.1s linear;
}

.wp-social-link a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	text-decoration: none;
}

.wp-social-link a:hover {
	opacity: 0.85;
}

.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* ============================================================
   Post Content (Single Post)
   ============================================================ */

.entry-content {
	line-height: 1.8;
}

.entry-content p {
	margin-bottom: var(--wp--preset--spacing--50);
}

.entry-content blockquote {
	border-left: 1px solid var(--wp--preset--color--contrast);
	margin: 0;
	padding-left: var(--wp--preset--spacing--50);
	font-style: italic;
	color: var(--wp--preset--color--contrast-2);
}

/* ============================================================
   Forms
   ============================================================ */

input[type="text"],
input[type="email"],
input[type="search"],
textarea,
select {
	width: 100%;
	padding: var(--wp--preset--spacing--20);
	border: 1px solid var(--wp--preset--color--contrast-4);
	border-radius: 4px;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.5;
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus {
	outline: 2px solid var(--wp--preset--color--contrast);
	outline-offset: 2px;
	border-color: var(--wp--preset--color--contrast);
}

button,
.wp-element-button,
input[type="submit"] {
	background-color: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	border: none;
	border-radius: 4px;
	font-family: var(--wp--preset--font-family--system-sans-serif);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	padding: 0.75em 1.25em;
	cursor: pointer;
	text-decoration: none;
	transition: all 0.1s linear;
}

button:hover,
.wp-element-button:hover,
input[type="submit"]:hover {
	opacity: 0.9;
}

button:focus,
.wp-element-button:focus,
input[type="submit"]:focus {
	outline-color: var(--wp--preset--color--contrast);
	outline-offset: 2px;
}

/* ============================================================
   Utility Classes
   ============================================================ */

.has-link-color a {
	color: inherit;
}

.has-system-sans-serif-font-family {
	font-family: var(--wp--preset--font-family--system-sans-serif) !important;
}

.has-x-small-font-size {
	font-size: var(--wp--preset--font-size--x-small) !important;
}

.is-content-justification-space-between {
	justify-content: space-between;
}

/* Removed empty .is-style-default ruleset to satisfy linter */

.has-base-color {
	color: var(--wp--preset--color--base) !important;
}

.has-contrast-background-color {
	background-color: var(--wp--preset--color--contrast) !important;
}

/* ============================================================
   Responsive Design
   ============================================================ */

@media (max-width: 768px) {
	body {
		padding-right: var(--wp--preset--spacing--40);
		padding-left: var(--wp--preset--spacing--40);
	}

	h1 {
		font-size: var(--wp--preset--font-size--large);
	}

	header.wp-block-template-part {
		padding-top: var(--wp--preset--spacing--60);
		padding-bottom: var(--wp--preset--spacing--60);
	}

	.wp-block-columns {
		gap: var(--wp--preset--spacing--30);
	}

	.wp-block-post-template {
		grid-template-columns: 1fr;
		gap: var(--wp--preset--spacing--100);
	}
}

@media (max-width: 480px) {
	body {
		padding-right: var(--wp--preset--spacing--20);
		padding-left: var(--wp--preset--spacing--20);
		font-size: var(--wp--preset--font-size--small);
	}

	h1, h2, h3, h4, h5, h6 {
		margin-top: var(--wp--preset--spacing--60);
		margin-bottom: var(--wp--preset--spacing--40);
	}

	main.wp-block-template-main {
		padding-top: var(--wp--preset--spacing--60);
		padding-bottom: var(--wp--preset--spacing--60);
	}

	footer.wp-block-template-part {
		padding-top: var(--wp--preset--spacing--60);
		padding-bottom: var(--wp--preset--spacing--60);
	}

	.wp-block-query-pagination {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--wp--preset--spacing--30);
	}

	.wp-block-social-links {
		gap: var(--wp--preset--spacing--20);
	}
}

nav.main-navigation a {
  color: var(--color-contrast);
  font-size: var(--size-sm);
  text-decoration: none;
}

nav.main-navigation a:hover {
  text-decoration: underline;
}

.site-logo {
  flex-shrink: 0;
  margin-left: var(--space-50);
  width: 80px;
}

.site-logo img {
  border-radius: 50%;
  max-width: 100%;
}

/* ============================================================
   Main Content
   ============================================================ */

main {
  min-height: 60vh;
  padding: var(--space-100) 0;
}

/* ============================================================
   Blog Post List
   ============================================================ */

.post-grid {
  display: grid;
  gap: var(--space-80);
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  margin: var(--space-80) 0;
}

@media (max-width: 768px) {
  .post-grid {
    grid-template-columns: 1fr;
  }
}

.post-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-30);
  padding-bottom: var(--space-50);
}

.post-card h3 {
  margin: 0 0 var(--space-20);
}

.post-card h3 a {
  color: var(--color-contrast);
  text-decoration: none;
}

.post-card h3 a:hover {
  text-decoration: underline;
}

.post-meta {
  color: var(--color-contrast-2);
  display: flex;
  flex-wrap: wrap;
  font-size: var(--size-xs);
  gap: var(--space-20);
}

.post-meta-item {
  display: flex;
  align-items: center;
  gap: var(--space-10);
}

.post-meta-item::before {
  content: '';
}

.post-meta-item:first-child::before {
  content: none;
}

.post-excerpt {
  color: var(--color-contrast-2);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.post-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.post-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-10);
}

.post-tag {
  background-color: var(--color-base-2);
  border-radius: var(--radius-full);
  color: var(--color-contrast-2);
  font-size: var(--size-xs);
  padding: var(--space-10) var(--space-20);
  text-decoration: none;
  transition: background-color var(--transition-base);
}

.post-tag:hover {
  background-color: var(--color-contrast-4);
  text-decoration: none;
}

/* ============================================================
   Single Post View
   ============================================================ */

article {
  max-width: var(--layout-content);
  margin: 0 auto;
  padding: 0 var(--space-40);
}

article header {
  border: none;
  padding: var(--space-50) 0 var(--space-40);
  margin-bottom: var(--space-50);
}

article header h1 {
  margin: 0;
}

.post-header-meta {
  color: var(--color-contrast-2);
  display: flex;
  flex-wrap: wrap;
  font-size: var(--size-sm);
  gap: var(--space-20);
  margin-top: var(--space-30);
}

.featured-image {
  border-radius: var(--radius-lg);
  margin: var(--space-60) 0;
  max-width: 100%;
}

article > *:first-of-type {
  margin-top: 0;
}

/* ============================================================
   Footer
   ============================================================ */

footer {
  border-top: 1px solid var(--color-contrast-5);
  border-bottom: 1px solid var(--color-contrast-5);
  padding: var(--space-80) 0;
  margin-top: var(--space-100);
}

.footer-content {
  display: grid;
  gap: var(--space-80);
  grid-template-columns: 1fr 2fr;
  margin-bottom: var(--space-80);
}

@media (max-width: 768px) {
  .footer-content {
    grid-template-columns: 1fr;
  }
}

.footer-section h3 {
  font-size: var(--size-sm);
  margin: 0 0 var(--space-30);
}

.footer-section p {
  font-size: var(--size-sm);
  margin: 0 0 var(--space-20);
}

.footer-section a {
  color: var(--color-contrast);
}

.footer-section a:hover {
  text-decoration: underline;
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-40);
}

.social-links {
  display: flex;
  gap: var(--space-30);
}

.social-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: var(--color-base-2);
  text-decoration: none;
  transition: background-color var(--transition-base);
}

.social-links a:hover {
  background-color: var(--color-contrast-4);
}

.footer-bottom {
  border-top: 1px solid var(--color-contrast-5);
  padding-top: var(--space-40);
  text-align: center;
  font-size: var(--size-xs);
  color: var(--color-contrast-2);
}

/* ============================================================
   Search / Pagination
   ============================================================ */

.pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: var(--space-80) 0;
  padding: var(--space-40) 0;
  gap: var(--space-40);
}

.pagination-nav {
  display: flex;
  gap: var(--space-20);
  align-items: center;
}

.pagination-nav a,
.pagination-nav span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  text-decoration: none;
  border-radius: var(--radius-md);
}

.pagination-nav a {
  background-color: var(--color-base-2);
  color: var(--color-contrast);
  transition: background-color var(--transition-base);
}

.pagination-nav a:hover {
  background-color: var(--color-contrast-4);
}

.pagination-nav span.current {
  background-color: var(--color-contrast);
  color: var(--color-base);
  font-weight: 600;
}

.search-box {
  display: flex;
  margin: var(--space-40) 0;
}

.search-box input {
  flex: 1;
  border-radius: var(--radius-md) 0 0 var(--radius-md);
  margin: 0;
}

.search-box button {
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  border-left: 1px solid var(--color-contrast);
}

/* ============================================================
   Archive / Categories
   ============================================================ */

.archive-header {
  padding: var(--space-100) 0 var(--space-60);
  text-align: center;
}

.archive-header h1 {
  font-size: var(--size-3xl);
  margin-bottom: var(--space-40);
}

.category-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-30);
  justify-content: center;
  margin: var(--space-60) 0;
}

.category-item {
  background-color: var(--color-base-2);
  border-radius: var(--radius-full);
  display: inline-flex;
  align-items: center;
  gap: var(--space-10);
  padding: var(--space-20) var(--space-40);
  text-decoration: none;
  transition: background-color var(--transition-base);
}

.category-item:hover {
  background-color: var(--color-contrast-4);
  text-decoration: none;
}

.category-item span {
  background-color: var(--color-contrast-2);
  border-radius: 50%;
  color: var(--color-base);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--size-xs);
  font-weight: 600;
  width: 24px;
  height: 24px;
}

/* ============================================================
   Contact Form
   ============================================================ */

.contact-form-container {
  max-width: var(--layout-content);
  margin: var(--space-100) auto;
  padding: 0 var(--space-40);
}

.form-group {
  margin-bottom: var(--space-50);
}

.form-group.checkbox,
.form-group.radio {
  display: flex;
  gap: var(--space-20);
}

.form-group.checkbox input,
.form-group.radio input {
  width: auto;
  margin-top: 0.25em;
}

.form-row {
  display: grid;
  gap: var(--space-40);
  grid-template-columns: 1fr 1fr;
}

@media (max-width: 768px) {
  .form-row {
    grid-template-columns: 1fr;
  }
}

.form-message {
  border-radius: var(--radius-md);
  padding: var(--space-40);
  margin-bottom: var(--space-40);
}

.form-message.success {
  background-color: rgba(52, 211, 153, 0.1);
  border: 1px solid rgb(16, 185, 129);
  color: rgb(5, 150, 105);
}

.form-message.error {
  background-color: rgba(239, 68, 68, 0.1);
  border: 1px solid rgb(220, 38, 38);
  color: rgb(153, 27, 27);
}

/* ============================================================
   Newsletter Subscribe
   ============================================================ */

.newsletter-section {
  background-color: var(--color-base-2);
  border-radius: var(--radius-lg);
  padding: var(--space-80);
  margin: var(--space-100) 0;
  text-align: center;
}

.newsletter-section h2 {
  margin-top: 0;
}

.newsletter-form {
  display: flex;
  gap: var(--space-20);
  max-width: 500px;
  margin: var(--space-40) auto 0;
  flex-direction: column;
}

@media (min-width: 480px) {
  .newsletter-form {
    flex-direction: row;
  }

  .newsletter-form input {
    flex: 1;
    margin: 0;
  }

  .newsletter-form button {
    flex-shrink: 0;
  }
}

/* ============================================================
   Loading States
   ============================================================ */

.loading {
  position: relative;
  pointer-events: none;
  opacity: 0.6;
}

.spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid var(--color-contrast-4);
  border-radius: 50%;
  border-top-color: var(--color-contrast);
  animation: spin 0.6s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ============================================================
   Utilities
   ============================================================ */

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

.text-muted {
  color: var(--color-contrast-2);
  font-size: var(--size-sm);
}

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: var(--space-20); }
.mt-2 { margin-top: var(--space-40); }
.mt-3 { margin-top: var(--space-60); }
.mt-4 { margin-top: var(--space-80); }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: var(--space-20); }
.mb-2 { margin-bottom: var(--space-40); }
.mb-3 { margin-bottom: var(--space-60); }
.mb-4 { margin-bottom: var(--space-80); }

.gap-1 { gap: var(--space-20); }
.gap-2 { gap: var(--space-40); }
.gap-3 { gap: var(--space-60); }
.gap-4 { gap: var(--space-80); }

.hidden {
  display: none;
}

@media (max-width: 768px) {
  .hidden-mobile {
    display: none;
  }
}

@media (min-width: 769px) {
  .hidden-desktop {
    display: none;
  }
}
