/*
Theme Name: Faith Baptist Church
Theme URI: https://faithbaptist-va.com/
Author: Artifex LLC
Author URI: https://artifex-web.com/
Description: Custom WordPress theme for Faith Baptist Church (Colonial Heights, VA). Independent, fundamental, KJV-preaching Baptist church. Built with classic PHP, CMB2 custom fields, and vanilla JS. Mobile-first responsive design.
Version: 3.17.1
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fbc-theme
Tags: church, baptist, christian, custom-colors, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, full-width-template
*/

/* ==========================================================================
   Unified inner-page heroes (non-homepage only)
   Three legacy patterns exist (.page-hero, .page-header-section .header-container,
   .page-header on Media). All three normalized to identical full-bleed width
   and identical min-height. Inner content styling per pattern is preserved.
   Loaded via style.css = last layer in the cascade (override).
   ========================================================================== */
.page-hero,
.header-container,
.intro-section .intro-container,
main.content-wrapper > .page-header {
	width: 100vw;
	max-width: 100vw;
	margin-inline: calc(50% - 50vw);
	min-height: clamp(220px, 32vw, 360px);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: clamp(2rem, 5vw, 3.5rem) clamp(1rem, 4vw, 2rem);
	margin-block-end: 0;
	border-radius: 0;
	box-shadow: none;
	border-left: 0;
	box-sizing: border-box;
	text-align: center;
}

/* Kill the gap between the WP site header and the hero on pages where the hero
   lives INSIDE .content-wrapper. Covers .header-container wrappers,
   .intro-container hero variant (archive-fbc_event), and .page-header direct child. */
main.content-wrapper > :first-child:has(> .header-container),
main.content-wrapper > .intro-section:first-child:has(> .intro-container),
main.content-wrapper > .page-header:first-child {
	margin-block-start: calc(-1 * var(--fbc-space-5));
}

/* Pattern A: hero sits BEFORE .content-wrapper. Kill the wrapper's top margin
   so the body content touches the bottom of the hero (no double gap). */
.page-hero + main.content-wrapper,
.page-hero + .content-wrapper {
	margin-block-start: 0;
	padding-block-start: var(--fbc-space-5);
}

.header-container::after,
.intro-section .intro-container::after,
main.content-wrapper > .page-header::after {
	border-radius: 0;
}

.page-hero-inner,
.header-container > *,
.intro-section .intro-container > *,
main.content-wrapper > .page-header > * {
	max-width: 1100px;
	margin-inline: auto;
}

@media (min-width: 481px) {
	.header-container { min-height: clamp(220px, 32vw, 360px); padding: clamp(2rem, 5vw, 3.5rem) clamp(1rem, 4vw, 2rem); }
}
@media (min-width: 769px) {
	.header-container { min-height: clamp(220px, 32vw, 360px); padding: clamp(2rem, 5vw, 3.5rem) clamp(1rem, 4vw, 2rem); }
}
