/* ============================================================
   WCT front-end UI tweaks
   Loaded by mu-plugins/wct-ui.php (auto cache-busted on save).
   Edit this file freely — it's plain CSS, no PHP.

   Brand: maroon #4f163c | header band #ececfb | site #fff
   ============================================================ */

/* --- 1. Header: let the logo overhang below the header band --- */
#masthead,
#main-header .site-header-inner-wrap,
#main-header .site-header-upper-wrap,
#main-header .site-header-upper-inner-wrap,
#main-header .site-main-header-wrap,
#main-header .site-header-row-container-inner,
#main-header .site-main-header-inner-wrap,
#main-header .site-header-main-section-left,
#main-header .site-branding {
	overflow: visible;
}

#main-header .site-header-main-section-left {
	position: relative;
}

.site-branding.site-brand-logo-only .brand.has-logo-image img.custom-logo {
	/* height: 92px;
	max-height: none;
	width: auto;
	margin-bottom: -24px;
	position: relative;
	z-index: 6; */
}

.site-branding {
	position: absolute;
	top: 0;
}

.site-header-section-right {
	padding-block: 3rem;
}

/* Define the header's bottom edge so page content reads as separate from it. */
#main-header .site-main-header-wrap {
	border-bottom: 1px solid rgba(79, 22, 60, 0.16);
}

/* --- 2a. Home: match the archive template's responsive grid ---
   Kadence archive grid = 1 col (mobile) / 2 cols (>=576px) / 3 cols (>=1025px)
   with 2.5rem gaps (classes grid-cols grid-sm-col-2 grid-lg-col-3). The Home
   grid is a core query *flex* container; convert it to the same CSS grid so it
   collapses identically. Replaces the old hardcoded 33.333% flex-basis that
   pinned it to 3-up at every width and broke responsiveness. --- */
.home .wp-block-query .wp-block-post-template.is-flex-container.columns-3 {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	column-gap: 2.5rem;
	row-gap: 2.5rem;
}

@media screen and (min-width: 576px) {
	.home .wp-block-query .wp-block-post-template.is-flex-container.columns-3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media screen and (min-width: 1025px) {
	.home .wp-block-query .wp-block-post-template.is-flex-container.columns-3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Undo the old flex sizing and make each card fill its grid track
   (grid's default stretch isn't applying here, so set width explicitly). */
.home .wp-block-query .wp-block-post-template.is-flex-container.columns-3>.wp-block-post {
	flex: initial;
	width: 100%;
	max-width: none;
	min-width: 0;
	margin: 0;
}

/* --- 2b. Home: give each project <li> the archive card treatment
   (white bg + shadow + flush image + padded title). The box-shadow matches
   the archive .loop-entry cards. --- */
.home .wp-block-query .wp-block-post {
	background: #fff;
	box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.09);
	border-radius: 4px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.home .wp-block-query .wp-block-post .wp-block-post-featured-image {
	margin: 0;
}

.home .wp-block-query .wp-block-post .wp-block-post-featured-image,
.home .wp-block-query .wp-block-post .wp-block-post-featured-image a {
	display: block;
}

/* Crop every image to 3:2 landscape so all cards are uniform height.
   Matches the archive, whose kadence-thumbnail-ratio-2-3 wrapper uses a
   padding-bottom:66.67% (2/3) hack — i.e. a LANDSCAPE 3:2 box, not portrait. */
.home .wp-block-query .wp-block-post .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.home .wp-block-query .wp-block-post .wp-block-post-title {
	margin: 0;
	padding: 0.9rem 1.25rem 1.1rem;
	line-height: 1.25;
}

.home .content-container.site-container,
.page-id-186 .content-container.site-container {
	padding-top: 3.5rem;
	padding-bottom: 3.5rem;
}

.wp-block-query .wp-block-heading {
	margin-top: 1rem;
}

/* --- 3. Archive title band: separate it from the site header --- */
.post-type-archive .entry-hero .entry-hero-container-inner,
.tax-room-type .entry-hero .entry-hero-container-inner,
.tax-material .entry-hero .entry-hero-container-inner,
.entry-hero-container-inner {
	/* padding-top: 3.25rem; */
	/* padding-bottom: 2rem; */
	padding-top: 2rem;
	background: transparent;
}

.post-type-archive .entry-hero,
.tax-room-type .entry-hero,
.tax-material .entry-hero {
	display: block;
	/* border-bottom: 1px solid rgba(79, 22, 60, 0.14); */
	/* margin-bottom: 2.75rem; */
}

.home .entry-hero.page-hero-section {
	display: none;
}


/* --- 4. Archive cards: custom styling --- */
.entry.loop-entry {
	box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.09);
}

/* --- 4. Archive cards: trim excess vertical whitespace --- */
.loop-entry .entry-content-wrap {
	padding-top: 0.9rem;
	padding-bottom: 0.9rem;
}

.loop-entry .entry-header {
	margin-bottom: 0.35rem;
}

.loop-entry .entry-title {
	margin: 0 0 0.35rem;
	line-height: 1.2;
}

.loop-entry .entry-footer {
	margin-top: 0.6rem;
	padding-top: 0;
	border-top: 0;
}

.loop-entry .entry-actions .more-link-wrap {
	margin: 0.25rem 0 0;
}

.entry.single-entry {
	box-shadow: none;
}