/* ==========================================================================
   Height Utilities
   ========================================================================== */
.mh-300 {
	min-height: 300px !important;
}

.mh-500 {
	min-height: 500px !important;
}

/* ==========================================================================
   Typography - Alternative Fonts
   ========================================================================== */
.alt-font1 {
	font-family: "Roboto", sans-serif;
}

.alt-font2 {
	font-family: "Raleway", sans-serif;
}

.alt-font3 {
	font-family: "Cousine", sans-serif;
}

.alt-font4 {
	font-family: "Quicksand", sans-serif;
}

/* ==========================================================================
   Content Lead Styling
   ========================================================================== */
.content-lead {
	font-family: "Quicksand", sans-serif;
	font-size: 24px;
	font-weight: bold;
	color: #7d1a1a;
	display: inline-block;
	position: relative;
	padding-left: 1.5em;
}

.content-lead::before {
	color: var(--fa-primary-color, #c92927);
	opacity: 1;
	opacity: var(--fa-primary-opacity, 1);
}

.content-lead::after {
	color: var(--fa-secondary-color, #030303);
	opacity: var(--fa-secondary-opacity, 1);
}

.content-lead::before {
	content: "\f552";
}

.content-lead::after {
	content: "\f552\f552";
}

.content-lead::before {
	display: inline-block;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
}

.content-lead::before,
.content-lead::after {
	font: var(--fa-font-duotone);
	display: inline-block;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1.25em;
	text-align: center;
}

/* ==========================================================================
   FAQ Lead Styling
   ========================================================================== */
.faq-lead {
	font-family: "Poppins", sans-serif;
	font-size: 20px;
	font-weight: 600;
	color: #030303;
	text-transform: capitalize;
}

.faq-lead:before {
	font-family: "Font Awesome 7 Pro";
	content: "\f059" !important;
	font-weight: 900 !important;
	-webkit-font-smoothing: antialiased;
	display: inline-block;
	padding-right: 5px;
	color: #030303;
}

/* ==========================================================================
   Video Container (16:9 Responsive)
   ========================================================================== */
.video-container {
	overflow: hidden;
	position: relative;
	width: 100%;
}

.video-container::after {
	padding-top: 56.25%;
	display: block;
	content: "";
}

.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* ==========================================================================
   Map Styling
   ========================================================================== */
.map {
	-webkit-filter: grayscale(100%) saturate(1) brightness(90%) contrast(100%);
	-moz-filter: grayscale(100%) saturate(1) brightness(90%) contrast(100%);
	-ms-filter: grayscale(100%) saturate(1) brightness(90%) contrast(100%);
	-o-filter: grayscale(100%) saturate(1) brightness(90%) contrast(100%);
	filter: grayscale(100%) saturate(1) brightness(90%) contrast(100%);
}

/* ==========================================================================
   Social Icons
   ========================================================================== */
.social-icons li:hover.social-icons-tiktok a {
	background: #030303 !important;
}

/* ==========================================================================
   Icon Theme (Duotone Colors)
   ========================================================================== */
.icon-theme {
	--fa-secondary-opacity: 1;
	--fa-primary-color: #030303;
	--fa-secondary-color: #c92927;
}

.icon-theme-reverse {
	--fa-secondary-opacity: 1;
	--fa-primary-color: #c92927;
	--fa-secondary-color: #030303;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.footer-text,
.footer-text a {
	font-family: "Poppins", sans-serif;
	color: #cbcbcb !important;
	text-decoration: none;
}

.footer-text a:hover {
	color: #e1e1e1;
	text-decoration: none;
}

/* ==========================================================================
   CMS Forms (includes/forms/_form-engine.php)
   ========================================================================== */

/* Breathing room wherever a form is embedded (contact page, form pages).
   The bottom gap matters most on mobile, where the form stacks directly on
   top of the next block of content. */
.cms-form-wrap {
	padding-top: 0.5rem;
	padding-bottom: 2.5rem;
}

@media (min-width: 992px) {
	.cms-form-wrap {
		padding-bottom: 1rem;
	}
}

/* Honeypot - kept out of sight of people, still visible to bots */
.cms-form-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.cms-form .form-label {
	color: #030303;
}

.cms-form .form-text {
	color: #6c757d;
}

/* Porto resets some Bootstrap form sizing - keep controls consistent */
.cms-form .form-control,
.cms-form .form-select {
	padding: 0.5rem 0.75rem;
}

/* Agreement / consent text above a form's submit button (_formAgreement) */
.cms-form-agreement {
	padding: 1rem 1.15rem;
	border-left: 3px solid #c92927;
	background: #f7f7f7;
	font-size: 0.9rem;
	line-height: 1.6;
	max-height: 260px;
	overflow-y: auto;
}

/* Section heading inside a long form (_formHeadings). Deliberately theme-neutral:
   it inherits the site's heading font and color rather than naming a brand color,
   because this block is copied verbatim onto every site. */
.cms-form-heading {
	margin: 1.75rem 0 0.75rem;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid #dee2e6;
	font-size: 1.05rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

/* No gap above the first heading - it already sits at the top of the form */
.cms-form .row > .col-12:first-child .cms-form-heading {
	margin-top: 0;
}

/* Privacy / do-not-send warning above a form's fields (_formIntro). Deliberately
   louder than .cms-form-agreement: that one is consent text people are expected to
   skim, this one has to be read BEFORE they start typing. Same red as the agreement
   rule so the two read as one family.
   Added 2026-08-28 after real submissions arrived carrying dates of birth and medical
   detail on a clinic's contact form. */
.cms-form-notice {
	/* A top margin as well as a bottom one: this block is used BOTH above a form
	   (_formIntro) and below an input as a field description, where without it the
	   card butts straight against the radio buttons it explains. Reported on
	   lsbbqcatering's Catering Package field, 2026-09-01. */
	margin-top: 0.85rem;
	margin-bottom: 1.25rem;
	padding: 0.9rem 1.1rem;
	border: 1px solid #c92927;
	border-left-width: 4px;
	border-radius: 3px;
	background: #fdf3f3;
	color: #8c1d1c;
	font-size: 0.9rem;
	line-height: 1.6;
}
.cms-form-notice p:last-child { margin-bottom: 0; }
.cms-form-notice strong { color: #a51f1e; }