/**
 * Long-form Elementor case studies (body.contrive-elementor-longform).
 * Matches classic-blog readability without stripping Elementor:
 * 800px column, left gold headings, Open Sans body, gold list markers.
 * #footerSection stays full-width so the site footer is unchanged.
 */

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) > .elementor-container {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
	flex-wrap: wrap;
}

/* Stack the old 50/50 copy|screenshot columns into one reading column.
   Elementor 4 dropped .elementor-row — columns are direct children of
   .elementor-container. */
body.contrive-elementor-longform .elementor-top-section:not(#footerSection) > .elementor-container > .elementor-column {
	width: 100% !important;
}

/* Spacers existed only to vertically align the two-column screenshot.
   Hide the widgets and any section that is now empty (spacer-only). */
body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-spacer {
	display: none !important;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection):not(:has(.elementor-widget-heading, .elementor-widget-text-editor, .elementor-widget-image)) {
	display: none;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) h2.elementor-heading-title {
	font-family: "Roboto", sans-serif !important;
	font-size: 1.6em !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	text-align: left !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	color: #F4A840 !important;
	padding-bottom: 8px;
	border-bottom: 2px solid #F4A840;
	margin: 32px 0 16px !important;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) h3.elementor-heading-title {
	font-family: "Dosis", sans-serif !important;
	font-size: 1.385em !important;
	font-weight: 600 !important;
	text-align: left !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	color: #F4A840 !important;
	border-bottom: none;
	margin: 24px 0 12px !important;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor,
body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor p,
body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor li {
	font-family: "Open Sans", sans-serif !important;
	font-size: 16px !important;
	line-height: 1.8em !important;
	text-align: left !important;
	color: #ffffff !important;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor p {
	margin-bottom: 20px;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor ul,
body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor ol {
	padding-left: 1.5em;
	margin-bottom: 20px;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor li {
	margin-bottom: 8px;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor li::marker {
	color: #F4A840;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor a {
	color: #F4A840 !important;
	text-decoration: underline;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor a:hover {
	color: #ffcc00 !important;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor strong,
body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-text-editor b {
	color: #ffffff !important;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-image,
body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-image .elementor-widget-container,
body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-image {
	width: 100%;
	max-width: 100%;
}

body.contrive-elementor-longform .elementor-top-section:not(#footerSection) .elementor-widget-image img {
	max-width: 100% !important;
	width: 100% !important;
	height: auto !important;
	margin: 12px 0 24px;
}

@media (max-width: 768px) {
	body.contrive-elementor-longform .elementor-top-section:not(#footerSection) > .elementor-container {
		max-width: 100%;
		padding-left: 15px;
		padding-right: 15px;
	}
}