/*
 * WordPress adapters for site.css (the stylesheet carried over unchanged from
 * the Next.js site). Next.js drew "fill" images with inline styles; here they
 * get the .fill class. Plus a few WordPress-only pieces.
 */

/* images that cover their (positioned) box */
.site img.fill {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	max-width: none;
}
.site .heroC-media img.main,
.site .split-img img,
.site .phero-img img,
.site .cover-img img {
	width: 100%;
}

/* admin bar above a sticky header */
.admin-bar .site-header.is-sticky {
	top: 32px;
}
@media (max-width: 782px) {
	.admin-bar .site-header.is-sticky {
		top: 46px;
	}
	#wpadminbar {
		position: fixed;
	}
}

/* header menu button: one icon for open, one for close */
.menu-btn .i-close,
.menu-btn[aria-expanded='true'] .i-open {
	display: none;
}
.menu-btn[aria-expanded='true'] .i-close {
	display: inline;
}

/* project filters: choices are links, popovers use [hidden] */
.pf-pop[hidden] {
	display: none !important;
}
.site a.pf-opt {
	text-decoration: none;
	color: inherit;
}
.pf-opt.is-disabled,
.linkbtn.is-disabled,
.btn.is-disabled {
	opacity: 0.45;
	pointer-events: none;
}
.site a.linkbtn {
	text-decoration: none;
	display: inline-flex;
	align-items: center;
}
.pf-pills a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	text-decoration: none;
	color: inherit;
}
.pf-search input {
	height: 42px;
	padding: 0 14px;
	border: 1px solid var(--c-line);
	border-radius: var(--r-btn);
	background: var(--c-surface);
	color: var(--c-text);
	font: inherit;
	min-width: 180px;
}
.pf.is-loading .proj-grid {
	opacity: 0.55;
	transition: opacity 0.2s;
}

/* slider: card track is scrolled by site.js */
.cslider-ctrl[hidden] {
	display: none !important;
}

/* rich text columns section */
.mb-cols {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 32px 48px;
}
.mb-col {
	grid-column: span 12;
}
@media (min-width: 900px) {
	.mb-col-half {
		grid-column: span 6;
	}
	.mb-col-oneThird {
		grid-column: span 4;
	}
	.mb-col-twoThirds {
		grid-column: span 8;
	}
}

/* single image / video section */
.mb-media {
	margin: 0 auto;
}
.mb-media img,
.mb-media video {
	width: 100%;
	height: auto;
	border-radius: var(--r-lg);
	display: block;
}
.mb-media figcaption {
	margin-top: 10px;
	color: var(--c-muted);
	font-size: 0.9rem;
}
.mb-embed {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: var(--r-lg);
	overflow: hidden;
}
.mb-embed iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

/* cards */
.pexcerpt {
	margin: 0;
	color: var(--c-muted);
	font-size: 0.92rem;
}

/* text written in the WordPress editor */
.prose-site img {
	max-width: 100%;
	height: auto;
	border-radius: var(--r);
}
.prose-site .alignleft {
	float: left;
	margin: 0.4em 1.4em 1em 0;
}
.prose-site .alignright {
	float: right;
	margin: 0.4em 0 1em 1.4em;
}
.prose-site .aligncenter {
	display: block;
	margin-inline: auto;
}
.prose-site figure {
	margin: 1.6em 0;
}
.prose-site figcaption,
.prose-site .wp-caption-text {
	color: var(--c-muted);
	font-size: 0.9rem;
	margin-top: 8px;
}
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

/* form sent */
.mb-form[hidden] {
	display: none;
}
.site .hdr-cta,
.site .hdr-call {
	white-space: nowrap;
}
