/*
 * Living Site Style — site-wide layout polish for livingrichmondhillga.com
 */

/* ---------- Header ----------
 * The header layout (Avada Layout Section 11 "Custom Header") ends with two
 * desktop-only rows that only hold the Share a Story / Submit an Event popups.
 * Avada moves the popups to <body>, so the rows are empty but each still keeps a
 * 20px column margin. Collapse that dead space.
 */
.fusion-tb-header .fusion-fullwidth.fusion-no-small-visibility.fusion-no-medium-visibility .fusion-layout-column {
	margin-bottom: 0 !important;
}

/* Second menu row (Legacy & Lore … Recipes) is a 64px-tall bar for 12px text */
.fusion-tb-header .fusion-separator ~ nav.awb-menu {
	--awb-min-height: 46px;
}
.fusion-tb-header .fusion-separator ~ nav.awb-menu .awb-menu__main-ul {
	min-height: 46px;
}

/* ---------- Partner slot at the top of section pages ----------
 * Pages like Events, News, Things To Do get the partner slider injected as the
 * first thing in the content. Avada's 60px page padding plus the slider made a big
 * empty band under the menu; give the slot even breathing room instead.
 */
#main:has(> .fusion-row > #content > * > .post-content > .rhp-slider:first-child) {
	padding-top: 28px;
}
#content > * > .post-content > .rhp-slider:first-child {
	margin-bottom: 28px;
}

/* ---------- "Submit Your Event" panel (HubSpot form in page content) ----------
 * The form itself lives in an iframe and is skinned by hubspot-form.css; this
 * styles the column around it as a card.
 */
.post-content .fusion-layout-column:has(.hbspt-form) > .fusion-column-wrapper {
	background: #fbf7f5;
	border: 1px solid #e6e2de;
	border-radius: 8px;
	padding: 40px 44px 28px !important;
}
.post-content .fusion-layout-column:has(.hbspt-form) .fusion-text {
	margin-bottom: 20px;
}
.post-content .fusion-layout-column:has(.hbspt-form) .fusion-text > div:first-child,
.post-content .fusion-layout-column:has(.hbspt-form) .fusion-text > div:first-child * {
	font-family: Domine, Georgia, serif !important;
	font-size: 28px !important;
	line-height: 1.25 !important;
	font-weight: 700 !important;
	color: #212934 !important;
}
.post-content .fusion-layout-column:has(.hbspt-form) .fusion-text > div:first-child {
	margin-bottom: 8px;
}
.post-content .fusion-layout-column:has(.hbspt-form) .fusion-text > div:nth-child(2),
.post-content .fusion-layout-column:has(.hbspt-form) .fusion-text > div:nth-child(2) * {
	font-family: Inter, Arial, Helvetica, sans-serif !important;
	font-size: 15px !important;
	font-style: normal !important;
	color: #5f6570 !important;
}
@media (max-width: 640px) {
	.post-content .fusion-layout-column:has(.hbspt-form) > .fusion-column-wrapper {
		padding: 28px 20px 16px !important;
	}
	.post-content .fusion-layout-column:has(.hbspt-form) .fusion-text > div:first-child,
	.post-content .fusion-layout-column:has(.hbspt-form) .fusion-text > div:first-child * {
		font-size: 23px !important;
	}
}

/* ---------- Section title bands on phones / small tablets ----------
 * Section pages (Events, Press + News, Things To Do, In the Crowd, …) set the band
 * title as an inline 36pt span inside a 54px text block, which wraps into two huge
 * lines on a phone. Scale it with the screen instead.
 */
@media (max-width: 800px) {
	.post-content .fusion-text p:has(> span[style*="36pt"]) {
		line-height: 1.15 !important;
		margin: 0 !important;
	}
	.post-content .fusion-text p > span[style*="36pt"] {
		font-size: clamp(24px, 7vw, 40px) !important;
		letter-spacing: .02em;
	}
	.post-content .fusion-text:has(p > span[style*="36pt"]) {
		font-size: inherit !important;
		line-height: 1.15 !important;
	}
}