/*
 * RCI branding — colours + type lifted from the live Joomla site (raincity.com.au).
 * Applied over Kadence by remapping its --global-palette* custom properties, plus
 * a few element-level safety nets. Full theming still to be done in the Customizer;
 * this gets the dev build onto the brand palette.
 *
 *   Red      #ED1C24   primary accent (buttons, links, top bar)
 *   Red dk   #C1121A   hover
 *   Charcoal #252525   headings / dark UI
 *   Grey     #595959 / #959595   body text
 *   Bg       #F9F9F9   page   /   #1B1D26 footer   #20232E footer base
 */

:root,
body {
	--global-palette1: #ED1C24;
	--global-palette2: #C1121A;
	--global-palette3: #252525;
	--global-palette4: #595959;
	--global-palette5: #959595;
	--global-palette6: #E2E2E2;
	--global-palette7: #F9F9F9;
	--global-palette8: #F4F4F4;
	--global-palette9: #FFFFFF;

	--global-palette-highlight: #ED1C24;
	--global-palette-highlight-alt: #C1121A;

	--global-body-font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--global-heading-font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

body {
	background-color: #F9F9F9;
	color: #595959;
}

/* Headings: charcoal, bold, uppercase like the original */
h1, h2, h3,
.entry-title,
.wp-block-heading {
	color: #252525;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .01em;
}
/* Section (h2) headings in body content are red on the live site. */
.entry-content h2.wp-block-heading,
.rci-two-col h2 {
	color: #ED1C24;
}

/* Links + primary buttons */
a { color: #ED1C24; }
a:hover { color: #C1121A; }

.wp-block-button__link,
.button, button, input[type="submit"],
.wp-block-search__button {
	background-color: #ED1C24;
	border-color: #ED1C24;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: .03em;
	border-radius: 0;
}
.wp-block-button__link:hover,
.button:hover, button:hover, input[type="submit"]:hover {
	background-color: #C1121A;
	border-color: #C1121A;
	color: #fff;
}

/* Header + footer */
.site-header-row-container-inner { border-bottom: 3px solid #ED1C24; }
.site-footer,
.site-footer-row-container-inner {
	background-color: #1B1D26;
	color: #fff;
}
.site-footer a { color: #fff; }
.site-footer a:hover { color: #ED1C24; }
.site-footer-bottom-wrap .site-footer-row-container-inner { background-color: #20232E; }
/* Footer widget headings (Rain City Industries / Site / Hours): the global
   h1-h3/.wp-block-heading rule above is charcoal (#252525) and wins over the
   inherited white from .site-footer since it targets the element directly —
   near-invisible on the dark footer background. Force white here instead. */
.site-footer h1, .site-footer h2, .site-footer h3,
.site-footer h4, .site-footer h5, .site-footer h6,
.site-footer .wp-block-heading {
	color: #fff;
}

/* The interior hero is a custom core/cover (rci_inner_hero) — the theme's own
   page-title band is hidden per page. Keep h1 white if it ever renders. */
.entry-hero h1, .page-hero-section h1 { color: #fff; }
/* Project pages: belt-and-braces hide of Kadence's inline project title
   (they all lead with the custom hero, set by build-content.php). */
.single-project .entry-content-wrap > .entry-header.project-title { display: none; }

/* --- Interior hero (rci-inner-hero core/cover): eyebrow + heading + intro,
   centred white on a photo with a dark wash. Fixed height so every inner
   hero matches regardless of how much intro copy it carries; the content
   just centres in the band. --- */
.wp-block-cover.rci-inner-hero {
	min-height: 460px;
	padding-top: 3.25rem;
	padding-bottom: 3.25rem;
}
@media (max-width: 900px) {
	.wp-block-cover.rci-inner-hero { min-height: 400px; }
}
@media (max-width: 600px) {
	.wp-block-cover.rci-inner-hero {
		min-height: 320px;
		padding-top: 2.5rem;
		padding-bottom: 2.5rem;
	}
}
.rci-inner-hero .wp-block-cover__inner-container {
	max-width: 780px;
	display: flex;
	flex-direction: column;
	gap: .9rem;
}
.rci-inner-hero .rci-hero-eyebrow {
	margin: 0 0 .25rem;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	opacity: .9;
}
.rci-inner-hero h1 {
	margin: 0;
	font-weight: 800;
	text-shadow: 0 2px 14px rgba(0, 0, 0, .45);
}
.rci-inner-hero p:not(.rci-hero-eyebrow) {
	margin: 0;
	max-width: 62ch;
	margin-inline: auto;
	line-height: 1.55;
	opacity: .95;
}

/* Project archive cards */
.wp-block-post-title a { color: #252525; }
.wp-block-post-title a:hover { color: #ED1C24; }

/* --- Top utility bar (red) --- */
.site-top-header-wrap,
.site-header-row-container.site-header-focus-item-top {
	background-color: #ED1C24;
}
.site-top-header-wrap .header-html,
.site-top-header-wrap .header-html a,
.site-top-header-wrap .header-html span {
	color: #fff;
	font-size: 14px;
}
.site-top-header-wrap .header-html a:hover { color: #fff; text-decoration: underline; }

/* --- Transparent header over the home hero: white logo + nav --- */
.transparent-header #masthead .site-title,
.transparent-header #masthead .site-branding a,
.transparent-header #masthead .site-main-header-inner-wrap .site-title a {
	color: #fff !important;
	font-size: 1.6rem;
	text-shadow: 0 1px 3px rgba(0, 0, 0, .45);
}
.transparent-header #masthead .header-navigation .header-menu-container > ul > li > a {
	color: #fff !important;
	text-shadow: 0 1px 3px rgba(0, 0, 0, .45);
}
/* darken the top of the hero so the white header always has contrast */
.home .wp-block-cover.alignfull > .wp-block-cover__background {
	background-image: linear-gradient(to bottom, rgba(0, 0, 0, .45), rgba(0, 0, 0, 0) 40%);
}
.transparent-header #masthead .header-navigation .header-menu-container > ul > li > a:hover,
.transparent-header #masthead .header-navigation .header-menu-container > ul > li.current-menu-item > a {
	color: #ED1C24 !important;
}
/* keep the top bar readable in the transparent state too */
.transparent-header .site-top-header-wrap { background-color: #ED1C24; }

/* --- core/cover safety net --- this build's Kadence isn't enqueueing the full
   wp-block-cover stylesheet, which leaves the cover as flex-row at width 0 --- */
.wp-block-cover,
.wp-block-cover-image {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background-position: center center;
	min-height: 430px;
}
.wp-block-cover.alignfull { max-width: none; }
.wp-block-cover > .wp-block-cover__inner-container {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: var(--wp--style--global--content-size, 1140px);
	margin-left: auto;
	margin-right: auto;
	color: #fff;
}
.wp-block-cover .wp-block-cover__image-background {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}
.wp-block-cover > .wp-block-cover__background {
	position: absolute;
	inset: 0;
	z-index: 0;
}

/* Hero cover: tighten heading, square buttons already handled above */
.wp-block-cover h1 { font-weight: 800; letter-spacing: .005em; }
.wp-block-cover .wp-block-button.is-style-outline .wp-block-button__link {
	border-color: #fff; color: #fff; background: transparent;
}
.wp-block-cover .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: #fff; color: #252525;
}

/* --- About page: accreditation / membership logo strip ---
   Overrides the block-library gallery flex sizing (which stretches every tile to
   an equal width and distorts logos) so each logo sits at its natural aspect,
   height-capped, in a left-aligned row. !important is needed to beat the
   `figure:not(#id) img { width:100% }` rule core ships. */
.wp-block-gallery.rci-logos.has-nested-images {
	align-items: center;
	justify-content: center;
	gap: 2rem 3.5rem;
	margin-block: 2.5rem 3rem;
}
.wp-block-gallery.rci-logos.has-nested-images figure.wp-block-image {
	flex: 0 0 auto !important;
	width: auto !important;
	margin: 0 !important;
}
.wp-block-gallery.rci-logos.has-nested-images figure.wp-block-image img {
	width: auto !important;
	height: 66px !important;
	max-width: 240px;
	object-fit: contain;
}
@media (max-width: 600px) {
	.wp-block-gallery.rci-logos.has-nested-images { gap: 1.5rem 2.25rem; }
	.wp-block-gallery.rci-logos.has-nested-images figure.wp-block-image img { height: 48px !important; }
}

/* --- "About Our Company" two-column (photo + copy) --- */
.wp-block-columns.rci-two-col {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2.5rem 3rem;
	margin-block: 3rem;
}
.wp-block-columns.rci-two-col > .wp-block-column {
	flex: 1 1 300px;
	margin: 0;
	min-width: 0;
}
.wp-block-columns.rci-two-col .wp-block-image { margin: 0; }
.wp-block-columns.rci-two-col .wp-block-image img { width: 100%; height: auto; display: block; }
.wp-block-columns.rci-two-col h2 { margin-top: 0; }
@media (max-width: 781px) {
	.wp-block-columns.rci-two-col { gap: 1.5rem; }
	.wp-block-columns.rci-two-col > .wp-block-column { flex-basis: 100% !important; }
}

/* --- Feature card grid (Facilities plant/capabilities) --- */
.rci-feature-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5rem;
	margin-block: 2.5rem;
}
.rci-feature-card {
	padding: 1.75rem;
	background: #fff;
	border: 1px solid #E2E2E2;
	border-top: 3px solid #ED1C24;
}
.rci-feature-card h3 {
	margin: 0 0 .6rem;
	color: #252525;
	font-size: 1.15rem;
	text-transform: uppercase;
	letter-spacing: .01em;
}
.rci-feature-card p { margin: 0 0 .8rem; }
.rci-feature-card p:last-child { margin-bottom: 0; }
@media (max-width: 600px) {
	.rci-feature-grid { grid-template-columns: 1fr; }
}

/* --- Centred lead-in / closing statement --- */
.rci-statement {
	max-width: 60ch;
	margin: 2.5rem auto;
	font-size: 1.15rem;
	line-height: 1.6;
	color: #252525;
}

/* --- Site-wide pre-footer CTA band (rendered by rci-core on kadence_before_footer) --- */
.rci-cta {
	position: relative;
	background: #20232E center / cover no-repeat;
	color: #fff;
	text-align: center;
	padding: clamp(3rem, 7vw, 5.5rem) 1.25rem;
}
.rci-cta::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(20, 22, 30, .78);
}
.rci-cta__inner {
	position: relative;
	max-width: 760px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
}
.rci-cta__eyebrow {
	margin: 0;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	opacity: .85;
}
.rci-cta__title {
	margin: 0;
	font-weight: 800;
	text-transform: uppercase;
	line-height: 1.12;
	font-size: clamp(1.7rem, 4vw, 2.6rem);
	color: #fff;
}
.rci-cta__text { margin: 0; max-width: 60ch; line-height: 1.6; opacity: .95; }
.rci-cta__btn {
	display: inline-block;
	margin-top: .5rem;
	padding: .85em 2.2em;
	background: #ED1C24;
	color: #fff;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	text-decoration: none;
}
.rci-cta__btn:hover { background: #C1121A; color: #fff; }

/* ============================ HOME PAGE ============================ */

/* shared small-caps eyebrow */
.rci-eyebrow {
	margin: 0 0 .4rem;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #ED1C24;
}

/* --- Home hero: photo + wash, two buttons, no heading. Extra bottom room so
   the "About" card can overlap up into it. --- */
.wp-block-cover.rci-home-hero {
	min-height: clamp(420px, 60vh, 620px);
	padding-top: 5rem;
	padding-bottom: 8rem;
}
.rci-home-hero .wp-block-buttons { justify-content: center; gap: 1rem; }
@media (max-width: 600px) {
	.wp-block-cover.rci-home-hero { min-height: 380px; padding-bottom: 6rem; }
}

/* --- Home two-column feature cards (About Our Company / Our Facility) --- */
.wp-block-columns.rci-home-card {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2rem 3rem;
	margin-block: 3.5rem;
}
.wp-block-columns.rci-home-card > .wp-block-column { flex: 1 1 300px; margin: 0; min-width: 0; }
.rci-home-card .wp-block-image { margin: 0; }
.rci-home-card .wp-block-image img { width: 100%; height: auto; display: block; }
.rci-home-card h2 { margin-top: 0; color: #ED1C24; }
.rci-home-card .wp-block-buttons { margin-top: 1.25rem; }

/* the first card lifts up over the hero on a white panel */
.wp-block-columns.rci-home-card--overlap {
	position: relative;
	z-index: 2;
	margin-top: -6rem;
	background: #fff;
	box-shadow: 0 24px 60px rgba(0, 0, 0, .18);
	padding: 2.5rem;
	gap: 2.5rem;
}
@media (max-width: 900px) {
	.wp-block-columns.rci-home-card--overlap { margin-top: -4rem; padding: 1.75rem; }
}
@media (max-width: 781px) {
	.wp-block-columns.rci-home-card > .wp-block-column { flex-basis: 100% !important; }
}

/* --- Home "Our Services" icon grid --- */
.rci-icon-grid { margin: 4rem auto; max-width: 1000px; text-align: center; }
.rci-icon-grid > h2 { color: #ED1C24; margin: 0 0 1rem; }
.rci-icon-grid__intro {
	max-width: 62ch;
	margin: 0 auto .6rem;
	line-height: 1.6;
	color: #595959;
}
.rci-icon-grid__cells {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem 2.5rem;
	margin-top: 2.5rem;
	text-align: left;
}
.rci-icon-card__icon {
	display: inline-flex;
	width: 34px;
	height: 34px;
	color: #ED1C24;
}
.rci-icon-card__icon svg { width: 100%; height: 100%; }
.rci-icon-card h3 {
	margin: .6rem 0 .35rem;
	font-size: 1.05rem;
	color: #252525;
	text-transform: uppercase;
	letter-spacing: .02em;
}
.rci-icon-card p { margin: 0; color: #595959; line-height: 1.55; }
@media (max-width: 600px) { .rci-icon-grid__cells { grid-template-columns: 1fr; gap: 1.75rem; } }

/* --- Home "Our Past Projects" dark band --- */
.rci-home-projects {
	position: relative;
	background: #1B1D26 center / cover no-repeat;
	padding: clamp(3rem, 7vw, 5rem) 1.25rem;
	text-align: center;
	color: #fff;
}
.rci-home-projects::before { content: ""; position: absolute; inset: 0; background: rgba(20, 22, 30, .82); }
.rci-home-projects > * { position: relative; }
.rci-home-projects > h2 { color: #ED1C24; margin: 0 0 2rem; }
.rci-home-projects__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	max-width: 1040px;
	margin: 0 auto 2.25rem;
}
.rci-proj-card { background: #fff; color: #252525; text-align: left; display: flex; flex-direction: column; }
.rci-proj-card__img { display: block; aspect-ratio: 4 / 3; overflow: hidden; }
.rci-proj-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rci-proj-card__body { padding: 1.25rem 1.25rem 1.5rem; display: flex; flex-direction: column; gap: .6rem; flex: 1; }
.rci-proj-card__body h3 { margin: 0; font-size: 1.05rem; text-transform: uppercase; }
.rci-proj-card__body p { margin: 0; font-size: .92rem; color: #595959; line-height: 1.5; flex: 1; }
.rci-proj-card__body .rci-cta__btn { align-self: flex-start; margin-top: .25rem; padding: .7em 1.6em; font-size: .82rem; }
@media (max-width: 800px) { .rci-home-projects__grid { grid-template-columns: 1fr; max-width: 420px; } }

/* full-bleed for the in-content bands on the home page (they sit inside
   .entry-content, which Kadence constrains to the content width) */
.entry-content .rci-cta.alignfull,
.entry-content .rci-home-projects.alignfull {
	margin-inline: calc(50% - 50vw);
	max-width: 100vw;
}