/*
 * Meridian — Blog CSS
 *
 * Styles for the blog archive, single post, pull-quote block style,
 * and related editorial templates (page-about, page-contact).
 *
 * Enqueued conditionally in functions.php:
 *   - is_singular( 'post' )       → single post
 *   - is_home() / is_archive()    → blog archive
 *   - is_page_template(...)       → about + contact pages
 */

/* =========================================================================
 * PULL-QUOTE BLOCK STYLE — is-style-meridian-pullquote
 * Registered via register_block_style() for the core/quote block.
 * Authors apply it in the block editor: Quote → Styles → "Meridian Pull-Quote"
 * ======================================================================== */

.wp-block-quote.is-style-meridian-pullquote {
	margin-inline: 0;
	padding-block: var(--wp--preset--spacing--32);
	padding-inline: 0;
	padding-inline-start: var(--wp--preset--spacing--48);
	border: none;
	border-inline-start: 3px solid var(--wp--preset--color--ink);
	background: none;
}

.wp-block-quote.is-style-meridian-pullquote p {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--2xl);
	font-style: italic;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--ink);
	margin-block-end: 0;
}

.wp-block-quote.is-style-meridian-pullquote cite {
	display: block;
	margin-block-start: var(--wp--preset--spacing--24);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	font-style: normal;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--neutral-600);
}

/* Editor preview — keeps the style visible in the block editor sidebar */
.editor-styles-wrapper .wp-block-quote.is-style-meridian-pullquote {
	border-inline-start: 3px solid currentColor;
}

/* =========================================================================
 * ARCHIVE — lead card (first / featured post)
 * ======================================================================== */

.archive-lead-card {
	position: relative;
}

.archive-lead-card__image {
	display: block;
}

/* Ensure the featured image fills its container edge-to-edge */
.archive-lead-card .wp-block-post-featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.archive-lead-card__body {
	max-width: var(--wp--style--global--content-size, 1200px);
	margin-inline: auto;
}

.archive-lead-card__category {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* =========================================================================
 * ARCHIVE — post grid (remaining posts)
 * ======================================================================== */

.archive-grid-query .wp-block-post-template.archive-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--wp--preset--spacing--64) var(--wp--preset--spacing--48);
}

@media (max-width: 599px) {
	.archive-grid-query .wp-block-post-template.archive-grid {
		grid-template-columns: 1fr;
		gap: var(--wp--preset--spacing--64);
	}
}

/* Individual grid card */
.archive-card {
	display: flex;
	flex-direction: column;
}

.archive-card .wp-block-post-featured-image img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	display: block;
}

.archive-card__image {
	flex-shrink: 0;
}

.archive-card__body {
	flex: 1;
}

.archive-card__category {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--neutral-600);
}

/* Pagination */
.archive-pagination {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--wp--preset--spacing--16);
	font-size: var(--wp--preset--font-size--sm);
}

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

.archive-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2rem;
	height: 2rem;
	padding-inline: 0.25rem;
	color: var(--wp--preset--color--neutral-800);
	text-decoration: none;
	transition: color 0.15s ease;
}

.archive-pagination .page-numbers.current,
.archive-pagination .page-numbers:hover {
	color: var(--wp--preset--color--ink);
	font-weight: 500;
}

/* =========================================================================
 * SINGLE POST — body typography
 * ======================================================================== */

.single-post__body {
	/* Constrained width is set inline via block attributes (680px);
	 * this rule adds the readable-column typography defaults. */
}

/* Body copy — generous line-height for long-form reading */
.single-post__body .wp-block-post-content {
	font-size: 1.0625rem;
	line-height: 1.8;
	color: var(--wp--preset--color--neutral-800);
}

.single-post__body .wp-block-post-content p {
	margin-block-end: var(--wp--preset--spacing--24);
}

.single-post__body .wp-block-post-content p:last-child {
	margin-block-end: 0;
}

/* Headings within post body */
.single-post__body .wp-block-post-content h2,
.single-post__body .wp-block-post-content h3,
.single-post__body .wp-block-post-content h4 {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 400;
	letter-spacing: -0.01em;
	margin-block-start: var(--wp--preset--spacing--64);
	margin-block-end: var(--wp--preset--spacing--24);
	color: var(--wp--preset--color--ink);
}

.single-post__body .wp-block-post-content h2 {
	font-size: var(--wp--preset--font-size--2xl);
	line-height: 1.15;
}

.single-post__body .wp-block-post-content h3 {
	font-size: var(--wp--preset--font-size--xl);
	line-height: 1.2;
}

.single-post__body .wp-block-post-content h4 {
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.25;
}

/* Links within post body */
.single-post__body .wp-block-post-content a {
	color: var(--wp--preset--color--ink);
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: opacity 0.15s ease;
}

.single-post__body .wp-block-post-content a:hover {
	opacity: 0.7;
}

/* Blockquote inside post body — default (non-pull-quote) */
.single-post__body .wp-block-post-content blockquote:not(.is-style-meridian-pullquote) {
	border-inline-start: 2px solid var(--wp--preset--color--neutral-200);
	padding-inline-start: var(--wp--preset--spacing--32);
	margin-inline: 0;
	color: var(--wp--preset--color--neutral-600);
	font-style: italic;
}

/* Images within post body */
.single-post__body .wp-block-post-content figure.wp-block-image {
	margin-block: var(--wp--preset--spacing--48);
}

.single-post__body .wp-block-post-content figure.wp-block-image figcaption {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--neutral-400);
	margin-block-start: var(--wp--preset--spacing--12);
	text-align: center;
}

/* Code / pre inside post body */
.single-post__body .wp-block-post-content pre,
.single-post__body .wp-block-post-content code {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.9em;
}

/* Tags row */
.single-post__tags {
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--8);
}

.single-post__tags a {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--wp--preset--color--neutral-600);
	text-decoration: none;
	transition: color 0.15s ease;
}

.single-post__tags a:hover {
	color: var(--wp--preset--color--ink);
}

/* =========================================================================
 * SINGLE POST — related posts footer
 * ======================================================================== */

.single-post__related {
	/* Background and spacing set via block attributes */
}

/* 3-up grid of related cards — enforced regardless of block-level grid setting */
.related-posts-query .wp-block-post-template {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--wp--preset--spacing--48);
}

@media (max-width: 767px) {
	.related-posts-query .wp-block-post-template {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--wp--preset--spacing--32);
	}
}

@media (max-width: 479px) {
	.related-posts-query .wp-block-post-template {
		grid-template-columns: 1fr;
	}
}

.related-card {
	display: flex;
	flex-direction: column;
}

.related-card .wp-block-post-featured-image img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	display: block;
}

.related-card__image {
	flex-shrink: 0;
}

.related-card__body {
	flex: 1;
}

/* =========================================================================
 * PAGE — ABOUT: value pillar icons
 * ======================================================================== */

.about-value-pillar__icon {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 48px;
	height: 48px;
	color: var(--wp--preset--color--ink);
}

.about-value-pillar__icon svg {
	width: 32px;
	height: 32px;
	display: block;
	flex-shrink: 0;
}

/* =========================================================================
 * PAGE — CONTACT: form + map embed
 * ======================================================================== */

/* Map embed wrapper */
.contact-map-embed {
	overflow: hidden;
	border-radius: 0;
	line-height: 0; /* collapse whitespace around iframe */
}

.contact-map-embed iframe {
	display: block;
	width: 100%;
	height: 280px;
	border: none;
}

/* Contact form */
.meridian-contact-form {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--32);
}

.meridian-contact-form__row {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--8);
}

.meridian-contact-form label {
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	color: var(--wp--preset--color--neutral-800);
}

.meridian-contact-form label span[aria-hidden] {
	color: var(--wp--preset--color--ink);
	margin-inline-start: 2px;
}

.meridian-contact-form input[type="text"],
.meridian-contact-form input[type="email"],
.meridian-contact-form textarea {
	width: 100%;
	padding: 0.75rem 1rem;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 0;
	outline: none;
	transition: border-color 0.15s ease;
	-webkit-appearance: none;
	appearance: none;
}

.meridian-contact-form input[type="text"]:focus,
.meridian-contact-form input[type="email"]:focus,
.meridian-contact-form textarea:focus {
	border-color: var(--wp--preset--color--ink);
}

.meridian-contact-form textarea {
	resize: vertical;
	min-height: 9rem;
}

.meridian-contact-form__submit {
	align-self: flex-start;
	padding: 0.875rem 2rem;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--xs);
	font-weight: 400;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--surface);
	background: var(--wp--preset--color--ink);
	border: none;
	cursor: pointer;
	transition: opacity 0.15s ease;
}

.meridian-contact-form__submit:hover {
	opacity: 0.8;
}

.meridian-contact-form__note {
	margin-block: 0;
	font-size: var(--wp--preset--font-size--xs);
	color: var(--wp--preset--color--neutral-400);
}

/* Contact hours table */
.contact-hours-table table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.875rem;
}

.contact-hours-table td {
	padding-block: 0.375rem;
	padding-inline-end: 1.5rem;
	color: var(--wp--preset--color--neutral-800);
	vertical-align: top;
}

.contact-hours-table td:first-child {
	color: var(--wp--preset--color--neutral-600);
	white-space: nowrap;
}
