/*
 Theme Name:   Highend Child
 Theme URI:    http://preview.hb-themes.com/?theme=Highend
 Description:  B.R. Kreider Driveways — Green brand palette. Adapted from Pin Oak Service Center child theme.
 Author:       HB-Themes
 Author URI:   http://www.hb-themes.com
 Template:     HighendWP
 Version:      1.0.27
 Tags:		   Responsive, Page-Builder, Drag&Drop, Clean, Modern, Corporate, Multi-Purpose, Multi-Color
 Text Domain:  hbthemes
*/

/* =Theme customization starts here
-------------------------------------------------------------- */

/* =Typography — Roboto & Roboto Condensed
   Override all parent theme font-family declarations.
   Weights loaded: 300 (Light), 400 (Regular), 500 (Medium),
                   700 (Bold), 900 (Black)
   Roboto Condensed: 300, 400, 700
-------------------------------------------------------------- */

/* --- Base / Body --- */
body,
body.hb-fw-body,
.hb-page-content,
p,
.entry-content,
input,
textarea,
select,
button {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 400;
}

/* --- Headings --- */
h1, h2, h3, h4, h5, h6,
.hb-heading,
.hentry .entry-title,
.page-title h1,
.section-title,
.fw-heading,
.wpb_heading {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 700;
}

h1 {
	font-weight: 900;
	line-height: 1.15;
}

h2 {
	font-weight: 900;
	font-size: 42px;
	line-height: 1.15;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #006940;
}

h3 {
	font-weight: 900;
	font-size: 30px;
	line-height: 1.2;
}

h4 {
	line-height: 1.25;
}

h5, h6 {
	line-height: 1.3;
}

h4 {
	font-weight: 900;
	font-size: 24px;
}

h5 {
	font-weight: 900;
	font-size: 20px;
}

h6 {
	font-weight: 900;
	font-size: 18px;
}

/* --- Navigation --- */
.sf-menu > li > a,
.sf-menu > li > a span,
#main-nav > li > a,
#main-nav > li > a span,
.hb-top-bar-menu a,
#header-bar a {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 500;
}

/* Dropdown arrow for parent menu items */
#main-nav > li.menu-item-has-children > a > span::after {
	content: '';
	display: inline-block;
	width: 5px;
	height: 5px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg);
	margin-left: 5px;
	margin-bottom: 2px;
	opacity: 0.6;
	transition: opacity 0.2s ease, transform 0.2s ease;
}
#main-nav > li.menu-item-has-children:hover > a > span::after {
	opacity: 1;
	transform: rotate(225deg);
	margin-bottom: -1px;
}

/* Dropdown / submenu items */
.sf-menu ul li a,
.sf-menu ul li a span {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 400;
}

/* Mobile nav */
.mobile-menu-content a,
.hb-mobile-navigation a {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 500;
}

/* --- Buttons --- */
.hb-button,
.button,
a.button,
input[type="submit"],
input[type="button"],
.vc_btn3,
.wpb_button,
.hb-cta-button,
.woocommerce a.button,
.woocommerce button.button {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* --- Roboto Condensed — Stats / Counters / Accent Numbers --- */
.hb-counter .hb-counter-number,
.hb-counter-number,
.stat-number,
.fw-counter .fw-counter-number,
.counter-number,
.roboto-condensed {
	font-family: 'Roboto Condensed', 'Roboto', sans-serif !important;
	font-weight: 700;
}

/* --- Widget Titles & Sidebar --- */
.widget-title,
.widgettitle,
.hb-sidebar .widget-title {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

/* --- Footer --- */
.hb-footer,
.hb-footer p,
.hb-footer a,
.hb-footer .widget,
#footer,
#footer p,
#footer a,
.copyright-text,
.hb-copyright {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 400;
}

.hb-footer .widget-title,
#footer .widget-title {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 700;
}

/* Footer widget nav — hover & current: green bg, white text. */
#main-wrapper #footer.dark-style .widget_nav_menu ul.menu li a:hover,
#main-wrapper #footer.dark-style .widget_nav_menu ul.menu li.current-menu-item > a {
	color: #ffffff !important;
	background-color: #006940 !important;
	border-left-color: #ffee30 !important;
}

/* Footer link base color override */
#main-wrapper #footer.dark-style a {
	color: rgba(255, 255, 255, 0.7) !important;
}

#main-wrapper #footer.dark-style a:hover {
	color: #ffffff !important;
}

/* Footer logos column — side by side */
.kreider-footer-logos {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-bottom: 16px;
}

.kreider-footer-logos a {
	flex: 0 0 50%;
	text-align: center;
}

.kreider-footer-logo-main {
	max-width: 100%;
	height: auto;
}

.kreider-footer-logo-brk {
	max-width: 100%;
	height: auto;
	opacity: 0.85;
}

.kreider-footer-logo-brk:hover {
	opacity: 1;
}

.kreider-footer-desc {
	font-size: 13px !important;
	line-height: 1.6 !important;
	color: rgba(255, 255, 255, 0.6) !important;
	margin-top: 14px !important;
	margin-bottom: 18px !important;
	text-align: center;
}

.kreider-footer-desc a {
	color: rgba(255, 255, 255, 0.8) !important;
	text-decoration: underline !important;
}

.kreider-footer-desc a:hover {
	color: #ffffff !important;
}

/* Footer association logos — color logos in white rounded box */
.kreider-footer-associations {
	display: flex;
	align-items: stretch;
	background: #ffffff;
	border-radius: 8px;
	overflow: hidden;
	margin-top: 12px;
}

.kreider-footer-associations a {
	flex: 1 1 33.333%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px 8px;
	transition: background 0.25s ease;
}

.kreider-footer-associations a:hover {
	background: rgba(0, 0, 0, 0.04);
}

.kreider-footer-associations img {
	max-height: 36px;
	max-width: 100%;
	width: auto;
	height: auto;
}

/* Footer contact widget */
.kreider-footer-contact p {
	font-size: 14px !important;
	line-height: 1.3 !important;
	margin-bottom: 12px !important;
	color: rgba(255, 255, 255, 0.7) !important;
}

.kreider-footer-contact p strong {
	color: #ffffff !important;
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.kreider-footer-contact a {
	color: rgba(255, 255, 255, 0.7) !important;
	text-decoration: none !important;
}

.kreider-footer-contact a:hover {
	color: #ffffff !important;
}

/* Footer social widget — left-align, adjust icon color on dark bg */
#footer .hb-socials-widget ul.social-icons {
	justify-content: flex-start !important;
}

#footer .hb-social-icons a {
	color: rgba(255, 255, 255, 0.7) !important;
	font-size: 18px;
	transition: color 0.25s ease;
}

#footer .hb-social-icons a:hover {
	color: #ffffff !important;
}

/* Footer nav menu widget cleanup */
#footer .widget_nav_menu ul.menu {
	list-style: none;
	padding: 0;
	margin: 0;
}

#footer .widget_nav_menu ul.menu li {
	margin-bottom: 0;
}

#footer .widget_nav_menu ul.menu li a {
	display: flex;
	align-items: center;
	padding: 6px 0 6px 14px;
	font-size: 14px;
	color: rgba(255, 255, 255, 0.7) !important;
	border-left: 3px solid transparent;
	transition: all 0.2s ease;
}

/* Move chevron arrow from far-right float to inline after text */
#footer .widget_nav_menu ul.menu > li > a::before {
	float: none !important;
	order: 1;
	margin-left: 8px;
	font-size: 11px !important;
}

/* Copyright bar */
.hb-copyright {
	font-size: 13px !important;
	color: rgba(255, 255, 255, 0.5) !important;
}

/* Footer responsive */
@media (max-width: 767px) {
	.kreider-footer-associations img {
		max-height: 28px;
	}

	.kreider-footer-associations a {
		padding: 8px 6px;
	}

	#footer .col-3 {
		margin-bottom: 30px;
	}
}

/* --- Top Bar --- */
#header-bar,
#header-bar p,
#header-bar a,
#header-bar span,
.hb-top-bar {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 400;
}

/* --- Light / Descriptive Text Utility --- */
.text-light,
.roboto-light {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 300;
}

/* --- Page Title Section --- */
.page-title-section,
.page-title-section h1,
.page-title-section .page-subtitle {
	font-family: 'Roboto', sans-serif !important;
}

.page-title-section h1 {
	font-weight: 900;
}

.page-title-section .page-subtitle {
	font-weight: 300;
}

/* --- Visual Composer / WPBakery Elements --- */
.vc_custom_heading,
.wpb_text_column,
.wpb_content_element {
	font-family: 'Roboto', sans-serif !important;
}

/* --- Blockquote --- */
blockquote,
blockquote p {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 300;
	font-style: italic;
}

/* --- Forms --- */
.wpcf7 input,
.wpcf7 textarea,
.wpcf7 select,
.wpcf7-form label,
.hb-contact-form input,
.hb-contact-form textarea,
.hb-contact-form select {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 400;
}

/* =Buttons — Global Overrides
   Restyle WPBakery (vc_btn3) and HighendWP (hb-button) to match
   Kreider Driveways brand. Flat design, Roboto font, green palette.

   Generic button classes (apply via el_class or on any element):
     btn-green         → Green gradient (primary CTA)
     btn-green-outline → Green outline on light backgrounds
     btn-white         → White solid, green text (dark/green backgrounds)
     btn-white-outline → Transparent, white border (dark/green backgrounds)
     btn-yellow        → Yellow accent
     btn-inline        → Side-by-side layout helper
-------------------------------------------------------------- */

/* --- Base reset for all vc_btn3 buttons --- */
.vc_btn3 {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	border: 2px solid transparent !important;
	border-radius: 50px !important;
	box-shadow: none !important;
	transition: all 0.25s ease !important;
	line-height: 1 !important;
}

/* Preserve WPBakery icon padding + keep text centered */
.vc_btn3.vc_btn3-icon-right:not(.vc_btn3-o-empty) {
	padding-right: 60px !important;
	text-align: center !important;
}
.vc_btn3.vc_btn3-icon-left:not(.vc_btn3-o-empty) {
	padding-left: 60px !important;
	text-align: center !important;
}

/* Remove WPBakery 3D / modern style overrides */
.vc_btn3.vc_btn3-style-modern {
	box-shadow: none !important;
}

.vc_btn3:active {
	top: auto !important;
	box-shadow: none !important;
}

/* Size — medium (default) */
.vc_btn3.vc_btn3-size-md {
	padding: 14px 28px !important;
	font-size: 13px !important;
}

/* Size — large */
.vc_btn3.vc_btn3-size-lg {
	padding: 18px 36px !important;
	font-size: 14px !important;
	letter-spacing: 1.5px !important;
}

/* Size — small */
.vc_btn3.vc_btn3-size-sm {
	padding: 10px 20px !important;
	font-size: 12px !important;
}

/* Shape — round (pill shape per mockup) */
.vc_btn3.vc_btn3-shape-round {
	border-radius: 50px !important;
}

/* Shape — rounded (pill) */
.vc_btn3.vc_btn3-shape-rounded {
	border-radius: 50px !important;
}

/* Shape — square */
.vc_btn3.vc_btn3-shape-square {
	border-radius: 0 !important;
}

/* --- btn-green: Green Gradient (Primary CTA) ---
     WPBakery puts el_class on .vc_btn3-container (wrapper div),
     so we target the inner .vc_btn3 (the <a> tag) via descendant selector.
     Double-class (.vc_btn3-container.btn-green) boosts specificity to beat
     WPBakery color fallbacks like .vc_btn3.vc_btn3-color-danger. */
.vc_btn3-container.btn-green .vc_btn3 {
	background: linear-gradient(to bottom, #008050 0%, #005535 100%) !important;
	color: #fff !important;
	border-color: #005535 !important;
}

.vc_btn3-container.btn-green .vc_btn3:hover {
	background: linear-gradient(to bottom, #009960 0%, #006940 100%) !important;
	border-color: #006940 !important;
	color: #fff !important;
}

.vc_btn3-container.btn-green .vc_btn3:focus {
	background: linear-gradient(to bottom, #008050 0%, #005535 100%) !important;
	border-color: #005535 !important;
}

/* --- btn-green-outline: Green outline on light backgrounds --- */
.vc_btn3-container.btn-green-outline .vc_btn3 {
	background-color: transparent !important;
	background-image: none !important;
	color: #006940 !important;
	border-color: #006940 !important;
}

.vc_btn3-container.btn-green-outline .vc_btn3:hover {
	background-color: #006940 !important;
	color: #fff !important;
	border-color: #006940 !important;
}

/* --- btn-white: White solid, green text (for dark/green backgrounds) --- */
.vc_btn3-container.btn-white .vc_btn3 {
	background-color: #ffffff !important;
	background-image: none !important;
	color: #006940 !important;
	border-color: #ffffff !important;
}

.vc_btn3-container.btn-white .vc_btn3:hover {
	background-color: #003c1d !important;
	color: #ffffff !important;
	border-color: #ffffff !important;
}

/* --- btn-white-outline: Transparent, white border (for dark/green backgrounds) --- */
.vc_btn3-container.btn-white-outline .vc_btn3 {
	background-color: transparent !important;
	background-image: none !important;
	color: #ffffff !important;
	border: 2px solid #ffffff !important;
}

.vc_btn3-container.btn-white-outline .vc_btn3:hover {
	background-color: #ffffff !important;
	background-image: none !important;
	color: #006940 !important;
	border-color: #ffffff !important;
}

/* --- btn-yellow: Yellow accent --- */
.vc_btn3-container.btn-yellow .vc_btn3 {
	background-color: #ffee30 !important;
	color: #000 !important;
	border-color: #ffee30 !important;
}

.vc_btn3-container.btn-yellow .vc_btn3:hover {
	background-color: #e6d62b !important;
	border-color: #e6d62b !important;
	color: #000 !important;
}

/* --- btn-inline: Side-by-side button layout --- */
.btn-inline.vc_btn3-container {
	display: inline-block !important;
	margin-right: 10px !important;
	margin-bottom: 8px !important;
}

/* --- WPBakery color fallbacks (for visual editor compatibility) --- */
.vc_btn3.vc_btn3-color-danger { background: linear-gradient(to bottom, #008050 0%, #005535 100%) !important; color: #fff !important; border-color: #005535 !important; }
.vc_btn3.vc_btn3-color-danger:hover { background: linear-gradient(to bottom, #009960 0%, #006940 100%) !important; border-color: #006940 !important; }
.vc_btn3.vc_btn3-color-default { background-color: #fff !important; color: #006940 !important; border-color: #999 !important; }
.vc_btn3.vc_btn3-color-default:hover { background-color: #f2f2f2 !important; border-color: #777 !important; }
.vc_btn3.vc_btn3-color-inverse { background-color: transparent !important; color: #fff !important; border-color: #fff !important; }
.vc_btn3.vc_btn3-color-inverse:hover { background-color: #fff !important; color: #006940 !important; }
.vc_btn3.vc_btn3-color-success { background-color: #fff !important; color: #006940 !important; border-color: #fff !important; }
.vc_btn3.vc_btn3-color-success:hover { background-color: transparent !important; color: #fff !important; border-color: #fff !important; }
.vc_btn3.vc_btn3-color-info { background-color: #ffee30 !important; color: #000 !important; border-color: #ffee30 !important; }
.vc_btn3.vc_btn3-color-info:hover { background-color: #e6d62b !important; border-color: #e6d62b !important; }
.vc_btn3.vc_btn3-color-grey { background-color: #fff !important; color: #006940 !important; border-color: #999 !important; }
.vc_btn3.vc_btn3-color-grey:hover { background-color: #f2f2f2 !important; border-color: #777 !important; }

/* =Buttons — HighendWP Native (hb-button)
   Override theme's built-in button shortcode to match brand.
-------------------------------------------------------------- */
.hb-button {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	box-shadow: none !important;
	border: 2px solid transparent !important;
	border-radius: 50px !important;
	transition: all 0.25s ease !important;
}

.hb-button:active {
	top: auto !important;
	box-shadow: none !important;
}

/* Theme default button → green gradient */
.hb-button.hb-default {
	background: linear-gradient(to bottom, #006940 0%, #003c1d 100%) !important;
	color: #fff !important;
	border-color: #003c1d !important;
}

.hb-button.hb-default:hover {
	background: linear-gradient(to bottom, #008050 0%, #006940 100%) !important;
	border-color: #006940 !important;
	color: #fff !important;
}

/* Alizarin / Pomegranate → green gradient */
.hb-button.hb-alizarin,
.hb-button.hb-pomegranate {
	background: linear-gradient(to bottom, #006940 0%, #003c1d 100%) !important;
	border-color: #003c1d !important;
}

.hb-button.hb-alizarin:hover,
.hb-button.hb-pomegranate:hover {
	background: linear-gradient(to bottom, #008050 0%, #006940 100%) !important;
	border-color: #006940 !important;
	color: #fff !important;
}

/* Dark variants → dark green */
.hb-button.hb-darkly,
.hb-button.hb-wet-asphalt,
.hb-button.hb-midnight-blue {
	background-color: #003c1d !important;
	border-color: #003c1d !important;
}

.hb-button.hb-darkly:hover,
.hb-button.hb-wet-asphalt:hover,
.hb-button.hb-midnight-blue:hover {
	background-color: #006940 !important;
	border-color: #006940 !important;
	color: #fff !important;
}

/* Light variants → green outline */
.hb-button.hb-second-light,
.hb-button.hb-third-light {
	background-color: transparent !important;
	color: #006940 !important;
	border-color: #006940 !important;
}

.hb-button.hb-second-light:hover,
.hb-button.hb-third-light:hover {
	background-color: #006940 !important;
	color: #fff !important;
}

/* Yellow accent */
.hb-button.hb-yellow,
.hb-button.hb-sunflower {
	background-color: #ffee30 !important;
	color: #000 !important;
	border-color: #ffee30 !important;
}

.hb-button.hb-yellow:hover,
.hb-button.hb-sunflower:hover {
	background-color: #e6d62b !important;
	border-color: #e6d62b !important;
}

/* =Buttons — Form Submits
-------------------------------------------------------------- */
input[type="submit"],
input[type="button"],
button[type="submit"],
.wpcf7 input[type="submit"] {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	background: linear-gradient(to bottom, #006940 0%, #003c1d 100%) !important;
	color: #fff !important;
	border: 2px solid #003c1d !important;
	border-radius: 50px !important;
	padding: 14px 28px !important;
	cursor: pointer !important;
	transition: all 0.25s ease !important;
	box-shadow: none !important;
}

input[type="submit"]:hover,
input[type="button"]:hover,
button[type="submit"]:hover,
.wpcf7 input[type="submit"]:hover {
	background: linear-gradient(to bottom, #008050 0%, #006940 100%) !important;
	border-color: #006940 !important;
}

/* --- WPForms Submit Button --- */
.wpforms-submit,
button.wpforms-submit,
div.wpforms-container-full .wpforms-form button[type="submit"] {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
	background: linear-gradient(to bottom, #006940 0%, #003c1d 100%) !important;
	color: #fff !important;
	border: 2px solid #003c1d !important;
	border-radius: 50px !important;
	padding: 14px 28px !important;
	height: auto !important;
	line-height: 1 !important;
	cursor: pointer !important;
	box-shadow: none !important;
	transition: all 0.25s ease !important;
}

.wpforms-submit:hover,
button.wpforms-submit:hover,
div.wpforms-container-full .wpforms-form button[type="submit"]:hover {
	background: linear-gradient(to bottom, #008050 0%, #006940 100%) !important;
	border-color: #006940 !important;
}

/* =WPForms — tighter layout, full-width inputs, green focus
-------------------------------------------------------------- */

/* Tighten vertical spacing between fields */
div.wpforms-container-full .wpforms-form .wpforms-field {
	padding: 6px 0 !important;
}

/* Make all inputs fill their container (override WPForms "medium" ~55% width) */
div.wpforms-container-full .wpforms-form input:not([type="checkbox"]):not([type="radio"]),
div.wpforms-container-full .wpforms-form select,
div.wpforms-container-full .wpforms-form textarea {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

/* Green focus ring on inputs */
div.wpforms-container-full .wpforms-form input:focus,
div.wpforms-container-full .wpforms-form select:focus,
div.wpforms-container-full .wpforms-form textarea:focus {
	border-color: #006940 !important;
	box-shadow: 0 0 0 1px #006940 !important;
	outline: none !important;
}

/* Label styling */
div.wpforms-container-full .wpforms-field-label {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 500 !important;
	font-size: 14px !important;
	margin-bottom: 4px !important;
}

div.wpforms-container-full .wpforms-field-sublabel {
	font-size: 12px !important;
	margin-top: 2px !important;
}

/* Textarea — shorter default height */
div.wpforms-container-full .wpforms-form textarea {
	min-height: 100px !important;
	max-height: 200px !important;
}

/* Interest checkboxes — multi-column grid */
#wpforms-87-field_10 {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
	gap: 4px 12px !important;
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
}
#wpforms-87-field_10 li {
	margin: 0 !important;
	padding: 4px 0 !important;
}

/* Submit button — full width on forms */
div.wpforms-container-full .wpforms-submit-container {
	padding-top: 8px !important;
}

/* =WPForms — two-column layout for full-width forms (Free Estimate page)
   Only applies when form is in a full-width WPBakery column (vc_col-sm-12),
   so the Contact page half-column form stays single-column.
-------------------------------------------------------------- */
@media (min-width: 768px) {
	.vc_col-sm-12 div.wpforms-container-full .wpforms-field-container {
		display: flex !important;
		flex-wrap: wrap !important;
		column-gap: 16px !important;
	}

	/* Half-width fields: Email, Phone, Contact Method, Preferred Time */
	.vc_col-sm-12 #wpforms-87-field_2-container,
	.vc_col-sm-12 #wpforms-87-field_3-container,
	.vc_col-sm-12 #wpforms-87-field_4-container,
	.vc_col-sm-12 #wpforms-87-field_9-container {
		width: calc(50% - 8px) !important;
		flex-shrink: 0 !important;
	}

	/* Third-width fields: City, State, Zip */
	.vc_col-sm-12 #wpforms-87-field_6-container,
	.vc_col-sm-12 #wpforms-87-field_7-container,
	.vc_col-sm-12 #wpforms-87-field_8-container {
		width: calc(33.333% - 11px) !important;
		flex-shrink: 0 !important;
	}

	/* Full-width fields: Name, Address, Interest, Comments */
	.vc_col-sm-12 #wpforms-87-field_1-container,
	.vc_col-sm-12 #wpforms-87-field_5-container,
	.vc_col-sm-12 #wpforms-87-field_10-container,
	.vc_col-sm-12 #wpforms-87-field_11-container {
		width: 100% !important;
	}
}

/* =Hidden Desktop Utility
-------------------------------------------------------------- */
@media screen and (min-width: 900px) {
	.sf-menu > li.hidden-desktop,
	#main-nav > li.hidden-desktop {
		display: none !important;
	}
}

/* =Free Estimate Button — Desktop
   Styled as a prominent green CTA button in the desktop header nav.
-------------------------------------------------------------- */
@media screen and (min-width: 900px) {
	#main-nav > li.menu-free-estimate {
		margin-left: 8px;
	}

	#main-nav > li.menu-free-estimate > a {
		background: transparent !important;
		border: none !important;
		border-radius: 0 !important;
		padding: 0 4px !important;
		display: block !important;
		position: relative !important;
		color: #fff !important;
		transition: none !important;
	}

	/* The <span> IS the pill button */
	#main-nav > li.menu-free-estimate > a > span {
		display: inline-block !important;
		background: linear-gradient(to bottom, #006940 0%, #003c1d 100%) !important;
		color: #fff !important;
		border-radius: 50px !important;
		padding: 8px 22px !important;
		font-weight: 700 !important;
		font-size: 13px !important;
		text-transform: uppercase !important;
		letter-spacing: 0.75px !important;
		border: 2px solid #003c1d !important;
		line-height: 1 !important;
		position: static !important;
		top: auto !important;
		vertical-align: middle !important;
		transition: all 0.25s ease !important;
	}

	#main-nav > li.menu-free-estimate > a:hover > span {
		background: linear-gradient(to bottom, #008050 0%, #006940 100%) !important;
		border-color: #006940 !important;
	}
}

/* =Responsive Nav — Taper between 900px and 1280px
-------------------------------------------------------------- */

/* Stage 1: 1161px – 1280px — reduce padding slightly */
@media screen and (min-width: 1025px) and (max-width: 1280px) {
	#main-nav > li > a {
		padding: 0 9px !important;
		font-size: 13px;
		letter-spacing: 0;
	}

	#main-nav > li.menu-free-estimate > a {
		padding: 0 3px !important;
	}

	#main-nav > li.menu-free-estimate > a > span {
		padding: 7px 16px !important;
		font-size: 12px !important;
	}
}

/* Stage 3: 900px – 1024px — tightest */
@media screen and (min-width: 900px) and (max-width: 1024px) {
	#main-nav > li > a {
		padding: 0 5px !important;
		font-size: 11px;
		letter-spacing: 0;
		font-family: 'Roboto Condensed', 'Roboto', sans-serif !important;
		font-weight: 700 !important;
	}

	#main-nav > li > a span {
		font-family: 'Roboto Condensed', 'Roboto', sans-serif !important;
	}

	#main-nav > li.menu-free-estimate {
		margin-left: 3px;
	}

	#main-nav > li.menu-free-estimate > a {
		padding: 0 2px !important;
	}

	#main-nav > li.menu-free-estimate > a > span {
		padding: 6px 11px !important;
		font-size: 10px !important;
		font-family: 'Roboto Condensed', 'Roboto', sans-serif !important;
		letter-spacing: 0.5px !important;
	}
}

/* Stage 2: 1025px – 1160px — Roboto Condensed */
@media screen and (min-width: 1025px) and (max-width: 1160px) {
	#main-nav > li > a {
		padding: 0 7px !important;
		font-size: 12px;
		letter-spacing: 0;
		font-family: 'Roboto Condensed', 'Roboto', sans-serif !important;
		font-weight: 700 !important;
	}

	#main-nav > li > a span {
		font-family: 'Roboto Condensed', 'Roboto', sans-serif !important;
	}

	#main-nav > li.menu-free-estimate {
		margin-left: 4px;
	}

	#main-nav > li.menu-free-estimate > a {
		padding: 0 2px !important;
	}

	#main-nav > li.menu-free-estimate > a > span {
		padding: 7px 13px !important;
		font-size: 11px !important;
		font-family: 'Roboto Condensed', 'Roboto', sans-serif !important;
		letter-spacing: 0.5px !important;
	}
}

/* =Free Estimate Button — Mobile Header Bar
   Visible only below 900px, sits next to the hamburger icon.
   Hidden on desktop where the nav pill button is used instead.
-------------------------------------------------------------- */
.kreider-mobile-cta {
	display: none !important;
}

@media screen and (max-width: 899px) {
	.kreider-mobile-cta {
		display: inline-block !important;
		background: linear-gradient(to bottom, #006940 0%, #003c1d 100%) !important;
		color: #fff !important;
		border-radius: 50px !important;
		padding: 8px 18px !important;
		font-family: 'Roboto', sans-serif !important;
		font-weight: 700 !important;
		font-size: 11px !important;
		text-transform: uppercase !important;
		letter-spacing: 0.5px !important;
		text-decoration: none !important;
		border: 2px solid #003c1d !important;
		line-height: 1 !important;
		vertical-align: middle !important;
		margin-right: 10px !important;
		transition: all 0.25s ease !important;
		white-space: nowrap !important;
	}

	.kreider-mobile-cta:hover {
		background: linear-gradient(to bottom, #008050 0%, #006940 100%) !important;
		border-color: #006940 !important;
		color: #fff !important;
	}
}

/* =Free Estimate Button — Mobile Slide-out Nav
-------------------------------------------------------------- */
#mobile-menu li.menu-free-estimate > a {
	display: inline-block !important;
	background: linear-gradient(to bottom, #006940 0%, #003c1d 100%) !important;
	color: #fff !important;
	border-radius: 50px !important;
	padding: 10px 28px !important;
	font-weight: 700 !important;
	font-size: 13px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.75px !important;
	border: 2px solid #003c1d !important;
	margin: 6px 0 6px 20px !important;
	transition: all 0.25s ease;
}

#mobile-menu li.menu-free-estimate > a:hover {
	background: linear-gradient(to bottom, #008050 0%, #006940 100%) !important;
	border-color: #006940 !important;
}

/* =Color Utility Classes
-------------------------------------------------------------- */
.color-green { color: #006940 !important; }
.color-dark-green { color: #003c1d !important; }
.color-black { color: #000000 !important; }
.color-white, .white { color: #ffffff !important; }
.color-yellow, .yellow { color: #ffee30 !important; }
.color-mid-gray { color: #dcddde !important; }

/* Text effect utilities */
.text-shadow { text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important; }

/* =Inline Link Styles
   Scoped to #main-content text blocks only — does not affect buttons,
   nav menus, or other UI elements.
-------------------------------------------------------------- */
#main-content .wpb_text_column a:not(.vc_btn3):not(.btn),
#main-content .wpb_wrapper p a:not(.vc_btn3):not(.btn) {
	color: #006940;
	text-decoration: underline;
	text-decoration-color: rgba(0, 105, 64, 0.3);
	text-underline-offset: 2px;
	transition: color 0.2s ease, text-decoration-color 0.2s ease;
}
#main-content .wpb_text_column a:not(.vc_btn3):not(.btn):hover,
#main-content .wpb_wrapper p a:not(.vc_btn3):not(.btn):hover {
	color: #008050;
	text-decoration-color: #008050;
}

/* List indentation for content areas */
#main-content .wpb_text_column ul,
#main-content .wpb_text_column ol {
	margin-left: 40px;
}

/* Links inside white-text containers → yellow so they stand out */
#main-content .white a:not(.vc_btn3):not(.btn),
#main-content .color-white a:not(.vc_btn3):not(.btn),
#main-content .bg-green-radial .wpb_text_column a:not(.vc_btn3):not(.btn),
#main-content .bg-green .wpb_text_column a:not(.vc_btn3):not(.btn),
#main-content .bg-dark-green .wpb_text_column a:not(.vc_btn3):not(.btn),
#main-content .bg-black .wpb_text_column a:not(.vc_btn3):not(.btn) {
	color: #ffee30;
	text-decoration-color: rgba(255, 238, 48, 0.4);
}
#main-content .white a:not(.vc_btn3):not(.btn):hover,
#main-content .color-white a:not(.vc_btn3):not(.btn):hover,
#main-content .bg-green-radial .wpb_text_column a:not(.vc_btn3):not(.btn):hover,
#main-content .bg-green .wpb_text_column a:not(.vc_btn3):not(.btn):hover,
#main-content .bg-dark-green .wpb_text_column a:not(.vc_btn3):not(.btn):hover,
#main-content .bg-black .wpb_text_column a:not(.vc_btn3):not(.btn):hover {
	color: #fff;
	text-decoration-color: #fff;
}

/* =Background Color Utility Classes
-------------------------------------------------------------- */
.bg-green,    .vc_row.element-row.bg-green    { background-color: #006940 !important; }
.bg-dark-green, .vc_row.element-row.bg-dark-green { background-color: #003c1d !important; }
.bg-black,    .vc_row.element-row.bg-black    { background-color: #000000 !important; }
.bg-white,    .vc_row.element-row.bg-white    { background-color: #ffffff !important; }
.bg-yellow,   .vc_row.element-row.bg-yellow   { background-color: #ffee30 !important; }
.bg-mid-gray, .vc_row.element-row.bg-mid-gray { background-color: #dcddde !important; }

/* =Gradient Utility Classes
-------------------------------------------------------------- */
.bg-green-radial {
	background: radial-gradient(circle, #006940 0%, #003c1d 100%) !important;
}

/* =Row Padding Utility Classes
   Apply via el_class on [vc_row] shortcodes.
-------------------------------------------------------------- */
.pad-v-sm.vc_row { padding-top: 25px !important; padding-bottom: 25px !important; }
.pad-v.vc_row { padding-top: 50px !important; padding-bottom: 50px !important; }
.pad-v-lg.vc_row { padding-top: 80px !important; padding-bottom: 80px !important; }
.pad-v-xl.vc_row { padding-top: 120px !important; padding-bottom: 120px !important; }
.pad-t.vc_row { padding-top: 50px !important; }
.pad-b.vc_row { padding-bottom: 50px !important; }
.pad-t-none.vc_row { padding-top: 0 !important; }
.pad-b-none.vc_row { padding-bottom: 0 !important; }

/* =Fullwidth Row Flex Fix
   HighendWP wraps fullwidth row content in .fw-content-wrap > .vc_row,
   breaking WPBakery's direct-child flex selectors for equal-height
   and content-middle. Pass the flex properties through the wrapper.
-------------------------------------------------------------- */
.vc_row-o-equal-height .fw-content-wrap > .vc_row {
	display: flex !important;
	flex-wrap: wrap !important;
}
.vc_row-o-equal-height .fw-content-wrap > .vc_row > .wpb_column {
	display: flex !important;
}
.vc_row-o-content-middle .fw-content-wrap > .vc_row > .wpb_column > .vc_column-inner {
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
}

/* =Header Bar (Top Bar) Override
-------------------------------------------------------------- */
#header-bar {
	background: radial-gradient(circle, #006940 0%, #003c1d 100%) !important;
}

/* =Top Bar Custom Widgets
-------------------------------------------------------------- */

/* Override separator border color */
#header-bar .top-widget {
	border-right-color: #4d8a6a !important;
}
#header-bar .top-widget:first-child {
	border-left-color: #4d8a6a !important;
}

/* Base text color for left-side info items */
#header-bar .top-widget p,
#header-bar .top-widget p a,
#header-bar .top-widget p i {
	color: #fff !important;
}

/* Phone link — no underline */
#top-phone-widget a {
	text-decoration: none !important;
}

/* Left widget icons — spacing */
#top-phone-widget i,
#top-address-widget i {
	margin-right: 5px;
	font-size: 13px;
}

/* Pay Online link in top bar — subtle border style matching top links */
#top-pay-widget {
	flex: 0 0 auto !important;
	display: flex !important;
	align-items: center !important;
	border: none !important;
	margin: 0 !important;
	padding: 0 4px !important;
}
.kreider-top-pay-btn {
	display: inline-block !important;
	color: #fff !important;
	background: transparent !important;
	text-decoration: none !important;
	font-family: 'Roboto', sans-serif !important;
	font-weight: 500 !important;
	font-size: 12px !important;
	letter-spacing: 0.5px !important;
	padding: 4px 12px !important;
	border: 1px solid #4d8a6a !important;
	border-radius: 3px !important;
	transition: border-color 0.2s ease, background-color 0.2s ease !important;
	white-space: nowrap !important;
}
.kreider-top-pay-btn:hover {
	border-color: #5da07a !important;
	background-color: rgba(255,255,255,0.08) !important;
	color: #fff !important;
}
.kreider-top-pay-btn i {
	margin-right: 5px;
	font-size: 12px;
}

/* --- Top bar flex layout fix --- */
#header-bar > .container,
#header-bar > .container-wide {
	flex-wrap: nowrap !important;
}

#header-bar > .container > .top-widgets-left,
#header-bar > .container-wide > .top-widgets-left {
	flex-grow: 0 !important;
	flex-shrink: 0 !important;
	align-items: center !important;
}

#header-bar > .container > .top-widgets-right,
#header-bar > .container-wide > .top-widgets-right {
	flex-grow: 1 !important;
	flex-shrink: 1 !important;
	flex-wrap: nowrap !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
}

/* Tagline widget — image fills left side, vertically centered */
#top-tagline-widget {
	flex: 1 1 0% !important;
	min-width: 0 !important;
	display: flex !important;
	align-items: center !important;
	border: none !important;
	padding: 0 8px !important;
	margin: 0 !important;
}

/* Tagline image — fixed height, auto width */
.kreider-tagline-img {
	display: block !important;
	height: 22px !important;
	width: auto !important;
	max-width: 100% !important;
	object-fit: contain !important;
}

/* Social icons widget — built-in HighendWP socials */
#top-socials-widget {
	border: none !important;
	padding: 0 8px !important;
}

#top-socials-widget .social-list {
	margin: 0 !important;
	padding: 0 !important;
}

#top-socials-widget .social-list li a {
	color: #fff !important;
}

#top-socials-widget .social-list li a:hover {
	opacity: 0.8;
}

/* Links widget */
#top-links-widget {
	flex: 0 0 auto !important;
	display: flex !important;
	align-items: center !important;
	border: none !important;
	margin-right: 0 !important;
	padding-right: 0 !important;
}

/* Nav menu list reset inside links widget */
#top-links-widget .kreider-top-links-list {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: flex !important;
	align-items: center !important;
	gap: 6px !important;
}
#top-links-widget .kreider-top-links-list li {
	margin: 0 !important;
	padding: 0 !important;
}

/* Link button style */
#top-links-widget .kreider-top-links-list li a,
.kreider-top-link {
	display: inline-block !important;
	color: #fff !important;
	text-decoration: none !important;
	font-family: 'Roboto', sans-serif !important;
	font-weight: 500 !important;
	font-size: 12px !important;
	letter-spacing: 0.5px !important;
	padding: 4px 12px !important;
	border: 1px solid #4d8a6a !important;
	border-radius: 3px !important;
	transition: border-color 0.2s ease, background-color 0.2s ease !important;
	white-space: nowrap !important;
}

#top-links-widget .kreider-top-links-list li a:hover,
.kreider-top-link:hover {
	border-color: #5da07a !important;
	background-color: rgba(255,255,255,0.08) !important;
	color: #fff !important;
}

/* =Top Bar Responsive Scaling
-------------------------------------------------------------- */

/* Stage 1: 1025px – 1280px */
@media screen and (min-width: 1025px) and (max-width: 1280px) {
	#header-bar .top-widget p,
	#header-bar .top-widget p a {
		font-size: 11px;
	}
	#top-phone-widget i {
		font-size: 12px;
	}
	.kreider-tagline-img {
		height: 18px !important;
	}
	#top-links-widget .kreider-top-links-list li a,
	.kreider-top-link {
		font-size: 11px !important;
		padding: 3px 10px !important;
	}
	.kreider-top-pay-btn {
		font-size: 10px !important;
		padding: 3px 10px !important;
	}
}

/* Stage 2: 900px – 1024px (tightest) */
@media screen and (min-width: 900px) and (max-width: 1024px) {
	#header-bar .top-widget p,
	#header-bar .top-widget p a {
		font-size: 10px;
	}
	#header-bar > .container > .top-widgets-left .top-widget,
	#header-bar > .container-wide > .top-widgets-left .top-widget {
		margin-right: 5px !important;
		padding-right: 5px !important;
	}
	#top-phone-widget i {
		font-size: 11px;
		margin-right: 3px;
	}
	.kreider-tagline-img {
		height: 15px !important;
	}
	#top-links-widget .kreider-top-links-list li a,
	.kreider-top-link {
		font-size: 10px !important;
		padding: 3px 7px !important;
		letter-spacing: 0.25px !important;
	}
	.kreider-top-pay-btn {
		font-size: 9px !important;
		padding: 3px 8px !important;
	}
}

/* ============================================================
   TRANSPARENT ROW BACKGROUNDS
   Let the body #f9f9f9 show through on all rows by default.
   Rows with explicit bg classes (bg-green-radial, etc.) override this.
   ============================================================ */

.vc_row.element-row {
	background-color: transparent !important;
}

/* HighendWP parent theme sets .element-row { margin-bottom: 20px }.
   This creates visible white gaps between fullwidth rows.
   We control all row spacing via kreider-row-* padding classes,
   so fullwidth rows need zero margin between them. */
.vc_row.element-row[data-vc-full-width="true"] {
	margin-bottom: 0 !important;
}

/* ============================================================
   HOMEPAGE: ROW PADDING UTILITIES
   ============================================================ */

.kreider-row-flush.vc_row {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.kreider-row-sm.vc_row {
	padding-top: 30px !important;
	padding-bottom: 30px !important;
}

.kreider-row-md.vc_row {
	padding-top: 55px !important;
	padding-bottom: 55px !important;
}

.kreider-row-lg.vc_row {
	padding-top: 80px !important;
	padding-bottom: 80px !important;
}


/* ============================================================
   HOMEPAGE: DARK & GREEN SECTION BACKGROUNDS
   ============================================================ */

.section-dark.vc_row {
	background-color: #0a0a0a !important;
}

.section-green.vc_row {
	background-color: #006940 !important;
}

/* White text in dark/green section rows */
.section-dark .shortcode-title *,
.section-dark .vc_column_text,
.section-dark .vc_column_text p,
.section-dark .vc_column_text h1,
.section-dark .vc_column_text h2,
.section-dark .vc_column_text h3,
.section-dark .vc_column_text h4,
.section-dark .vc_column_text h5,
.section-dark .vc_column_text h6,
.section-green .shortcode-title *,
.section-green .vc_column_text,
.section-green .vc_column_text p {
	color: #ffffff !important;
}


/* ============================================================
   HOMEPAGE: SERVICE CARD BOXES (v3 — dual pseudo-element)
   6 cards in a 3-col grid, responsive to 2-col and 1-col.
   ============================================================ */

/* Row: transparent bg so page bg shows between cards */
.kreider-service-cards-section.vc_row {
	background: transparent !important;
}
/* Default zero padding — overridden when pad-v utilities are present */
.kreider-service-cards-section.vc_row:not([class*="pad-v"]):not([class*="pad-t"]):not([class*="pad-b"]) {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/* Column containers: uniform padding = gap between cards */
.kreider-service-cards-section .vc_column_container {
	padding-left: 10px !important;
	padding-right: 10px !important;
	margin-bottom: 20px !important;
}

/* Card column: rounded, clipped */
.kreider-service-card {
	position: relative;
	overflow: hidden;
	cursor: pointer;
	background: none !important;
	border-radius: 8px !important;
}

/* Layer 1 — background photo on ::before (inset by column padding) */
.kreider-service-card::before {
	content: '' !important;
	display: block !important;
	position: absolute !important;
	top: 0 !important;
	bottom: 0 !important;
	left: 10px !important;
	right: 10px !important;
	background-size: cover !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
	opacity: 1 !important;
	filter: brightness(0.75) !important;
	z-index: 1 !important;
	transition: opacity 0.4s ease, filter 0.4s ease !important;
	pointer-events: none !important;
	border-radius: 8px !important;
}

/* Per-card background images */
.kreider-card-driveways::before {
	background-image: url('https://new2026.kreiderdriveways.com/wp-content/uploads/2026/02/residential-driveways-image-frame-2010-Harsh-Edward-9-15-08-scaled.jpg') !important;
}
.kreider-card-concrete::before {
	background-image: url('https://new2026.kreiderdriveways.com/wp-content/uploads/2026/02/concrete-services-image-frame-Concrete-Sidewalk-at-Hershey-Concierge-scaled.jpg') !important;
}
.kreider-card-parking::before {
	background-image: url('https://new2026.kreiderdriveways.com/wp-content/uploads/2026/02/small-parking-lots-image-frame-231004-GP-GREENLAND-DRIVE-APTS.jpg') !important;
}
.kreider-card-markers::before {
	background-image: url('https://new2026.kreiderdriveways.com/wp-content/uploads/2026/02/address-markers-image-frame-018-scaled.jpg') !important;
}
.kreider-card-excavating::before {
	background-image: url('https://new2026.kreiderdriveways.com/wp-content/uploads/2026/02/home-excavating-image-frame-Dozer-and-ORT-210520-scaled.jpg') !important;
}
.kreider-card-specialty::before {
	background-image: url('https://new2026.kreiderdriveways.com/wp-content/uploads/2026/02/specialty-services-image-frame-Sports-Courts-27-scaled.jpg') !important;
}
.kreider-card-hardscaping::before {
	background-image: url('https://new2026.kreiderdriveways.com/wp-content/uploads/2026/03/stone-staircase.jpg') !important;
}

/* Layer 2 — green radial gradient overlay on ::after (inset to match) */
.kreider-service-card::after {
	content: '' !important;
	display: block !important;
	position: absolute !important;
	top: 0 !important;
	bottom: 0 !important;
	left: 10px !important;
	right: 10px !important;
	background: radial-gradient(circle, rgba(0, 105, 64, 0.45) 0%, rgba(0, 60, 29, 0.70) 100%) !important;
	z-index: 2 !important;
	pointer-events: none !important;
	border-radius: 8px !important;
	transition: background 0.4s ease !important;
}

/* Hover: darken photo, strengthen green overlay for readability */
.kreider-service-card:hover::before {
	filter: brightness(0.55) !important;
}
.kreider-service-card:hover::after {
	background: radial-gradient(circle, rgba(0, 105, 64, 0.60) 0%, rgba(0, 60, 29, 0.80) 100%) !important;
}

/* Remove old divider between cards */
.kreider-service-card:not(:last-child) > .vc_column-inner::after {
	display: none !important;
}

/* Inner content above both layers */
.kreider-service-card > .vc_column-inner {
	min-height: 280px;
	display: flex !important;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 30px 24px !important;
	position: relative !important;
	z-index: 3 !important;
	background: none !important;
	border-radius: 0 !important;
	overflow: visible !important;
}

/* White headings in cards — high specificity to override sitewide h2/h3 green */
.kreider-service-cards-section .kreider-service-card h2,
.kreider-service-cards-section .kreider-service-card h3,
.kreider-service-cards-section .kreider-service-card h4,
.kreider-service-cards-section .kreider-service-card .vc_custom_heading h3,
.kreider-service-cards-section .kreider-service-card .shortcode-title h2,
.kreider-service-cards-section .kreider-service-card .shortcode-title h3 {
	color: #ffffff !important;
	font-size: 28px !important;
	line-height: 1.2em !important;
	margin-bottom: 12px !important;
	text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6), 0 1px 2px rgba(0, 0, 0, 0.4) !important;
}

/* Tagline text in cards — target rendered class wpb_text_column */
.kreider-service-cards-section .kreider-service-card .wpb_text_column p,
.kreider-service-cards-section .kreider-service-card .wpb_text_column,
.kreider-service-cards-section .kreider-service-card .wpb_wrapper p,
.kreider-service-cards-section .kreider-service-card p {
	color: #ffffff !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
	margin-bottom: 18px !important;
	text-align: center !important;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5) !important;
}

/* Remove filter from card itself */
.kreider-service-card,
.kreider-service-card:hover {
	filter: none !important;
}

/* Services list links — grey text */
.kreider-services-list {
	color: #404040 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	font-weight: 400 !important;
}
.kreider-services-list a {
	color: #404040 !important;
	text-decoration: none !important;
}
.kreider-services-list a:hover {
	color: #006940 !important;
}

/* Tighten spacing between heading row and cards */
.kreider-services-heading-row.vc_row {
	padding-bottom: 6px !important;
	margin-bottom: 0 !important;
}

/* Featured cards (1/2 width) — taller with larger headings */
.kreider-service-cards-section .vc_col-sm-6.kreider-service-card > .vc_column-inner {
	min-height: 340px;
}
.kreider-service-cards-section .vc_col-sm-6.kreider-service-card h3,
.kreider-service-cards-section .vc_col-sm-6.kreider-service-card .vc_custom_heading h3 {
	font-size: 32px !important;
}
.kreider-service-cards-section .vc_col-sm-6.kreider-service-card .wpb_text_column p {
	font-size: 16px !important;
}

/* --- Responsive: 2-wide on tablet --- */
@media (max-width: 960px) and (min-width: 601px) {
	.kreider-service-cards-section .wpb_column,
	.kreider-service-cards-section > .wpb_column,
	.kreider-service-cards-section .vc_col-sm-4 {
		width: 50% !important;
		float: left !important;
	}
}

/* --- Responsive: 1-wide on mobile --- */
@media (max-width: 600px) {
	.kreider-service-cards-section .wpb_column,
	.kreider-service-cards-section > .wpb_column,
	.kreider-service-cards-section .vc_col-sm-4 {
		width: 100% !important;
		float: none !important;
	}
}


/* ============================================================
   HOMEPAGE: CTA BAR (Don't Be Fooled / Free Estimate)
   ============================================================ */

.kreider-cta-bar .kreider-cta-headline {
	color: #ffffff !important;
	font-size: 2.2em !important;
	line-height: 1.15 !important;
	font-weight: 900 !important;
	margin-top: 0 !important;
	margin-bottom: 0.3em !important;
}

.kreider-cta-bar .kreider-cta-sub {
	color: rgba(255, 255, 255, 0.80) !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	margin-bottom: 0 !important;
}

/* CTA column: center button vertically + horizontally */
.kreider-cta-bar .kreider-cta-btn-col .vc_column-inner {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	height: 100% !important;
}


/* ============================================================
   HOMEPAGE: CONTACT / FORM ROW
   ============================================================ */

.column-with-form-inside .vc_column-inner {
	background: #ffffff !important;
	border: 1px solid #e0e0e0 !important;
	border-radius: 4px !important;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.07) !important;
	padding: 28px !important;
}

.column-with-form-inside .wpforms-container {
	background: transparent !important;
	padding: 0 !important;
	border: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}

.column-with-form-inside .wpforms-field input,
.column-with-form-inside .wpforms-field select,
.column-with-form-inside .wpforms-field textarea {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

/* Contact info icon items */
.kreider-contact-item {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	margin-bottom: 22px;
}

.kreider-contact-icon {
	width: 50px;
	height: 50px;
	min-width: 50px;
	background: #006940;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #ffffff;
	font-size: 22px;
	line-height: 1;
}

.kreider-contact-text {
	display: flex;
	flex-direction: column;
	padding-top: 6px;
}

.kreider-contact-text strong {
	color: #006940 !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	display: block;
	margin-bottom: 3px;
}

.kreider-contact-text strong a {
	color: inherit !important;
	text-decoration: none !important;
}

.kreider-contact-text strong a:hover {
	color: #003c1d !important;
}

.kreider-contact-text span {
	color: #666 !important;
	font-size: 14px !important;
	line-height: 1.4 !important;
}

/* Contact items on dark backgrounds */
.bg-dark-green .kreider-contact-text strong,
.bg-green .kreider-contact-text strong {
	color: #ffffff !important;
}

.bg-dark-green .kreider-contact-text strong a,
.bg-green .kreider-contact-text strong a {
	color: #ffffff !important;
}

.bg-dark-green .kreider-contact-text strong a:hover,
.bg-green .kreider-contact-text strong a:hover {
	color: #ffee30 !important;
}

.bg-dark-green .kreider-contact-text span,
.bg-green .kreider-contact-text span {
	color: rgba(255,255,255,0.7) !important;
}

.bg-dark-green .kreider-contact-icon,
.bg-green .kreider-contact-icon {
	background: rgba(255,255,255,0.15) !important;
}


/* ============================================================
   CONTACT PAGE
   ============================================================ */

/* Contact detail items with inline icons */
.kreider-contact-detail {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin-bottom: 18px;
	font-size: 15px;
	line-height: 1.5;
}
.kreider-contact-detail > i {
	font-size: 20px;
	color: #006940;
	min-width: 24px;
	text-align: center;
	margin-top: 2px;
}
.kreider-contact-detail a {
	color: #006940 !important;
	font-weight: 500;
}
.kreider-contact-detail a:hover {
	color: #003c1d !important;
}

/* Careers callout box */
.kreider-careers-callout {
	background: #f0f7f3 !important;
	border: 1px solid #d0e4d8 !important;
	border-radius: 8px !important;
	padding: 24px !important;
}
.kreider-careers-callout h3 {
	color: #006940 !important;
	margin-top: 0 !important;
	margin-bottom: 12px !important;
	font-size: 22px !important;
}
.kreider-careers-callout h3 i {
	margin-right: 6px;
}
.kreider-careers-callout p {
	font-size: 14px !important;
	line-height: 1.6 !important;
	margin-bottom: 10px !important;
}
.kreider-careers-eoe {
	font-size: 12px !important;
	color: #888 !important;
	margin-bottom: 0 !important;
}

/* Google Map wrapper */
.kreider-map-wrap h3 {
	margin-top: 0 !important;
	margin-bottom: 12px !important;
}
.kreider-map-wrap iframe {
	display: block;
	width: 100% !important;
	border-radius: 8px !important;
}

/* Contact form row — constrain width for readability */
.kreider-contact-form-row .wpforms-container {
	max-width: 800px;
	margin: 0 auto;
}

/* Contact page top row — responsive stacking */
@media (max-width: 768px) {
	.kreider-contact-top .wpb_column {
		width: 100% !important;
		margin-bottom: 24px !important;
	}
}

/* ============================================================
   HOMEPAGE: HERO INTRO ROW
   ============================================================ */

.kreider-hero-intro .kreider-hero-headline {
	color: #ffffff !important;
	font-size: 38px;
	line-height: 1.15;
	font-weight: 400;
	margin-bottom: 16px;
}

.kreider-hero-intro .kreider-hero-headline strong {
	display: block;
	font-weight: 900;
}

/* Body copy */
.kreider-hero-body {
	color: rgba(255, 255, 255, 0.88) !important;
	font-size: 15px !important;
	line-height: 1.7 !important;
	margin-bottom: 28px !important;
}

/* Hero buttons — now use generic btn-inline, btn-white, btn-white-outline classes */

/* Stats box */
.kreider-stats-box {
	display: flex;
	align-items: stretch;
	background: #ffffff;
	border-radius: 4px;
	padding: 16px 20px;
	margin-bottom: 18px;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.28);
}

.kreider-stat {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.kreider-stat-number {
	display: block;
	font-family: 'Roboto Condensed', 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 34px;
	color: #006940;
	line-height: 1;
	margin-bottom: 5px;
}

.kreider-stat-label {
	display: block;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	font-weight: 500;
	color: #555;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	line-height: 1.3;
}

/* "Family Business" stat — both words at the large number size */
.kreider-stat-family .kreider-stat-number,
.kreider-stat-family .kreider-stat-label {
	font-family: 'Roboto Condensed', 'Roboto', sans-serif !important;
	font-weight: 700 !important;
	font-size: 34px !important;
	color: #006940 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	line-height: 1.2em !important;
	margin-bottom: 0 !important;
}

/* Hide wpautop-injected <br> inside all stat cells */
.kreider-stat br {
	display: none;
}

.kreider-stat-sep {
	width: 1px;
	background: #ddd;
	align-self: stretch;
	margin: 0 8px;
	flex-shrink: 0;
}

/* "OTHER SERVICES" label + BRK logo */
.kreider-other-services {
	text-align: center;
}

.kreider-other-label {
	color: rgba(255, 255, 255, 0.65) !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 2px !important;
	margin-bottom: 10px !important;
}

.kreider-brk-logo-wrap {
	display: inline-block;
	background: #ffffff;
	border-radius: 50px;
	padding: 10px 24px;
}

.kreider-brk-logo {
	display: block;
	max-width: 200px;
	max-height: 68px;
	width: auto;
	height: auto;
	object-fit: contain;
}

/* Right column — vertically center */
.kreider-hero-right > .vc_column-inner {
	display: flex !important;
	flex-direction: column;
	justify-content: center;
}

/* Hero stacks below 992px — CSS override so WPBakery can't break it */
@media (max-width: 991px) {
	.kreider-hero-intro .wpb_column {
		width: 100% !important;
	}
	.kreider-hero-right {
		margin-top: 30px;
	}
}


/* ============================================================
   HOMEPAGE: ICON STRIP ROW
   ============================================================ */

.kreider-icon-strip-row.vc_row {
	background-color: #ebebeb !important;
}

.kreider-icon-strip-row .vc_column_container {
	border-right: 1px solid #d8d8d8;
}

.kreider-icon-strip-row .vc_column_container:last-child {
	border-right: none;
}

.kreider-strip-item {
	display: flex;
	align-items: center;
	gap: 15px;
}

.kreider-strip-icon {
	width: 60px;
	height: 60px;
	object-fit: contain;
	flex-shrink: 0;
}

.kreider-strip-text strong {
	display: block;
	font-family: 'Roboto', sans-serif;
	font-size: 15px;
	font-weight: 700;
	color: #006940;
	line-height: 1.2;
	margin-bottom: 2px;
}

.kreider-strip-text span {
	display: block;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	font-weight: 400;
	color: #555;
}


/* ============================================================
   bg-green-radial ON vc_row
   ============================================================ */

.bg-green-radial.vc_row {
	background: radial-gradient(circle, #006940 0%, #003c1d 100%) !important;
}

/* White text inside green-radial rows — only direct vc_column_text blocks,
   NOT nested elements like tip boxes that have their own backgrounds.
   Use color-white class on individual elements when needed elsewhere. */
.bg-green-radial > .wpb_column > .vc_column-inner > .wpb_wrapper > .vc_column_text,
.bg-green-radial > .wpb_column > .vc_column-inner > .wpb_wrapper > .vc_column_text p,
.bg-green-radial > .wpb_column > .vc_column-inner > .wpb_wrapper > .vc_column_text h1,
.bg-green-radial > .wpb_column > .vc_column-inner > .wpb_wrapper > .vc_column_text h2,
.bg-green-radial > .wpb_column > .vc_column-inner > .wpb_wrapper > .vc_column_text h3,
.bg-green-radial > .wpb_column > .vc_column-inner > .wpb_wrapper > .vc_column_text h4,
.bg-green-radial > .wpb_column > .vc_column-inner > .wpb_wrapper > .vc_column_text h5,
.bg-green-radial > .wpb_column > .vc_column-inner > .wpb_wrapper > .vc_column_text h6,
.bg-green-radial > .wpb_column > .vc_column-inner > .wpb_wrapper > .vc_custom_heading,
.bg-green-radial .shortcode-title * {
	color: #ffffff !important;
}


/* ============================================================
   WHY CHOOSE SECTION — Green gradient bg, white text
   ============================================================ */

/* Kill bottom padding on heading row, flush-join with items row */
.kreider-why-section.kreider-row-lg.vc_row {
	padding-bottom: 0 !important;
}
.kreider-why-items.vc_row {
	padding-top: 0 !important;
	padding-bottom: 60px !important;
}

.kreider-why-number {
	display: inline-block;
	font-family: 'Roboto Condensed', 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 36px;
	color: #ffee30;
	line-height: 1;
	margin-right: 12px;
	vertical-align: top;
}

.kreider-why-title {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 700 !important;
	font-size: 16px !important;
	color: #ffffff !important;
	margin-bottom: 4px !important;
}

.kreider-why-desc {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 400 !important;
	font-size: 14px !important;
	color: rgba(255, 255, 255, 0.7) !important;
	line-height: 1.5 !important;
}


/* ============================================================
   DON'T BE FOOLED SECTION
   ============================================================ */

.kreider-fooled-section.vc_row {
	background: #000000 !important;
	text-align: center;
}

.kreider-fooled-headline {
	color: #ffee30 !important;
	font-size: 28px !important;
	font-weight: 900 !important;
	text-transform: uppercase !important;
	margin-bottom: 8px !important;
}

.kreider-fooled-text {
	color: #ffffff !important;
	font-size: 16px !important;
	line-height: 1.5 !important;
}


/* ============================================================
   TESTIMONIALS SECTION
   ============================================================ */

/* Testimonials heading row — transparent so body grey (#f9f9f9) shows through */
.kreider-testimonials-section.vc_row {
	background-color: transparent !important;
}

/* ---- Testimonial Carousel (paginated, 3 per page) ---- */
.kreider-testimonial-carousel {
	position: relative;
	overflow: hidden;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 50px;
}

.kreider-testimonial-track {
	display: flex;
	transition: transform 0.5s ease;
}

/* Slide widths set by JS via --slides-per-view custom property */
.kreider-testimonial-slide {
	flex: none;
	padding: 0 12px;
	box-sizing: border-box;
}

.kreider-testimonial-card {
	background: #ffffff !important;
	border: 1px solid #e8e8e8 !important;
	border-radius: 6px !important;
	padding: 28px 24px !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}

.kreider-testimonial-card p {
	color: #333 !important;
	font-size: 14px !important;
	line-height: 1.7 !important;
	font-style: italic !important;
}

.kreider-testimonial-card .kreider-testimonial-author {
	color: #006940 !important;
	font-weight: 700 !important;
	font-style: normal !important;
	margin-top: 12px !important;
	font-size: 13px !important;
}

/* Carousel arrows */
.kreider-carousel-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: #006940;
	color: #fff;
	border: none;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	font-size: 20px;
	cursor: pointer;
	z-index: 5;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s;
}
.kreider-carousel-arrow:hover {
	background: #008050;
}
.kreider-carousel-arrow.disabled {
	background: #ccc;
	cursor: default;
	pointer-events: none;
}
.kreider-carousel-arrow.prev { left: 0; }
.kreider-carousel-arrow.next { right: 0; }

/* Carousel dot indicators */
.kreider-carousel-dots {
	text-align: center;
	margin-top: 20px;
}
.kreider-carousel-dot {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #ccc;
	border: none;
	margin: 0 5px;
	cursor: pointer;
	padding: 0;
	transition: background 0.2s;
}
.kreider-carousel-dot.active {
	background: #006940;
}
.kreider-carousel-dot:hover {
	background: #008050;
}

/* ---- Testimonials Masonry Page ---- */
.kreider-testimonials-grid {
	column-count: 3;
	column-gap: 20px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 40px 20px;
}

@media (max-width: 960px) {
	.kreider-testimonials-grid { column-count: 2; }
}
@media (max-width: 600px) {
	.kreider-testimonials-grid { column-count: 1; }
}

.kreider-testimonials-grid .kreider-testimonial-card {
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
	page-break-inside: avoid;
	margin-bottom: 20px;
	display: block;
	overflow: hidden;
}

/* View All button wrap */
.kreider-testimonials-btn-wrap {
	text-align: center;
	margin-top: 30px;
}


/* ============================================================
   GOOGLE REVIEWS SECTION
   ============================================================ */

/* ---- Overall Rating Badge (inline with CTA) ---- */
.kreider-google-badge {
	text-align: center;
	margin-bottom: 24px;
}

.kreider-google-badge-inner {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 50px;
	padding: 10px 16px 10px 24px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.kreider-google-badge-logo {
	display: inline-flex;
	align-items: center;
}

.kreider-google-badge-rating {
	font-family: 'Roboto', sans-serif;
	font-weight: 900;
	font-size: 26px;
	color: #222;
	line-height: 1;
}

.kreider-google-badge-stars {
	display: inline-flex;
	align-items: center;
	gap: 2px;
}

.kreider-google-badge-count {
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #666;
	white-space: nowrap;
}

/* ---- Star SVG styling ---- */
.kreider-star {
	display: inline-block;
	vertical-align: middle;
}

/* ---- Leave a Review CTA (green gradient, matches site buttons) ---- */
.kreider-google-cta-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: linear-gradient(to bottom, #008050 0%, #005535 100%) !important;
	color: #ffffff !important;
	border: 2px solid #005535 !important;
	font-family: 'Roboto Condensed', 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.5px;
	padding: 8px 20px;
	border-radius: 50px;
	text-decoration: none !important;
	text-transform: uppercase;
	transition: background 0.2s;
	box-shadow: none;
	white-space: nowrap;
}
.kreider-google-cta-btn:hover {
	background: linear-gradient(to bottom, #009960 0%, #006940 100%) !important;
	border-color: #006940 !important;
	color: #ffffff !important;
}

/* ---- Google Reviews Carousel ---- */
.kreider-google-carousel {
	position: relative;
	overflow: hidden;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 50px;
}

.kreider-google-track {
	display: flex;
	transition: transform 0.5s ease;
}

/* ---- Review Card (shared between carousel and grid) ---- */
.kreider-google-review-card {
	text-align: left;
}

.kreider-review-stars {
	margin-bottom: 10px;
	display: flex;
	gap: 2px;
}

.kreider-review-text {
	color: #333 !important;
	font-size: 14px !important;
	line-height: 1.7 !important;
	font-style: italic !important;
	margin-bottom: 0 !important;
}

.kreider-review-text-wrap {
	margin-bottom: 12px;
}

/* Truncation for long reviews */
.kreider-review-text-wrap.is-truncated .kreider-review-text {
	display: -webkit-box;
	-webkit-line-clamp: 5;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.kreider-read-more {
	background: none;
	border: none;
	color: #006940;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	padding: 4px 0 0;
	text-decoration: underline;
}
.kreider-read-more:hover {
	color: #008050;
}

.kreider-review-meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.kreider-review-author {
	color: #006940;
	font-weight: 700;
	font-size: 13px;
}

.kreider-review-time {
	color: #999;
	font-size: 12px;
}

/* ---- Responsive ---- */
@media (max-width: 600px) {
	.kreider-google-badge-inner {
		flex-wrap: wrap;
		justify-content: center;
		padding: 12px 16px;
		gap: 6px;
	}
	.kreider-google-badge-rating {
		font-size: 22px;
	}
	.kreider-google-cta-btn {
		margin-top: 6px;
	}
}


/* ============================================================
   LOCATION PAGES — GREEN HERO BAR
   ============================================================ */

.kreider-location-hero.vc_row {
	padding: 50px 0 40px !important;
}

.kreider-location-h1 {
	color: #ffffff !important;
	font-size: 42px !important;
	font-weight: 900 !important;
	margin-bottom: 10px !important;
}

.kreider-location-sub {
	color: rgba(255, 255, 255, 0.8) !important;
	font-size: 16px !important;
	line-height: 1.5 !important;
	margin-bottom: 0 !important;
}

.kreider-location-hero .vc_btn3 {
	margin-top: 10px;
}

/* Location intro section */
.kreider-location-intro .kreider-location-intro-h2 {
	color: #006940 !important;
	font-size: 26px !important;
	font-weight: 900 !important;
	line-height: 1.3 !important;
	margin-bottom: 16px !important;
}

.kreider-location-body {
	color: #444 !important;
	font-size: 15px !important;
	line-height: 1.7 !important;
	max-width: 900px;
	margin-bottom: 16px !important;
}

.kreider-location-nearby {
	color: #666 !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
}

.kreider-location-nearby strong {
	color: #333;
}

/* Remove top padding on location pages (hero sits flush under header) */
.page-id-119 .hb-main-content,
.page-id-120 .hb-main-content,
.page-id-121 .hb-main-content,
.page-id-122 .hb-main-content,
.page-id-123 .hb-main-content,
.page-id-124 .hb-main-content,
.page-id-125 .hb-main-content,
.page-id-126 .hb-main-content,
.page-id-127 .hb-main-content {
	padding-top: 0 !important;
}

.page-id-119 #main-content,
.page-id-120 #main-content,
.page-id-121 #main-content,
.page-id-122 #main-content,
.page-id-123 #main-content,
.page-id-124 #main-content,
.page-id-125 #main-content,
.page-id-126 #main-content,
.page-id-127 #main-content {
	padding-top: 0 !important;
}

@media (max-width: 767px) {
	.kreider-location-h1 {
		font-size: 28px !important;
	}
	.kreider-location-sub {
		font-size: 14px !important;
	}
}

/* ============================================================
   LAST ROW — FLUSH TO FOOTER (no gap)
   ============================================================ */

.kreider-last-row.vc_row.element-row {
	margin-bottom: -60px !important;
}


/* ============================================================
   READY TO TRANSFORM / CTA SECTION
   ============================================================ */

.kreider-transform-section.vc_row {
	background: radial-gradient(circle, #006940 0%, #003c1d 100%) !important;
}

.kreider-transform-headline {
	color: #ffffff !important;
	font-size: 32px !important;
	font-weight: 900 !important;
	line-height: 1.15 !important;
}

.kreider-transform-sub {
	color: rgba(255, 255, 255, 0.8) !important;
	font-size: 15px !important;
}

.kreider-transform-phone {
	color: #ffffff !important;
	font-size: 28px !important;
	font-weight: 700 !important;
}

.kreider-transform-phone a {
	color: #ffffff !important;
	text-decoration: none !important;
}

.kreider-transform-phone a:hover {
	color: #ffee30 !important;
}

/* "OR CALL US" muted label — auto-style in green CTA bars */
.bg-green-radial .kreider-transform-phone ~ p,
.bg-green-radial p + .kreider-transform-phone,
.kreider-last-row .wpb_text_column p {
	color: rgba(255, 255, 255, 0.7) !important;
}

.kreider-last-row .kreider-transform-headline,
.kreider-last-row .wpb_text_column h2 {
	color: #ffffff !important;
}


/* ============================================================
   OUR WORK SECTION
   ============================================================ */

/* Row: parallax bg image, generous padding */
.kreider-work-section.vc_row {
	padding: 80px 0 !important;
}

/* White box — 90% opacity, white border, drop shadow */
.kreider-work-box {
	background: rgba(255, 255, 255, 0.90) !important;
	border: 2px solid #ffffff;
	border-radius: 6px;
	padding: 50px 40px !important;
	text-align: center;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(0, 0, 0, 0.10);
}

.kreider-work-box h2 {
	color: #006940 !important;
	margin-bottom: 16px !important;
}

.kreider-work-box p {
	color: #333 !important;
	font-size: 15px !important;
	line-height: 1.7 !important;
}

/* Gallery button — add spacing above */
.kreider-work-btn {
	margin-top: 24px;
}

/* Testimonials button spacing */
.kreider-testimonials-btn {
	margin-top: 10px;
	margin-bottom: 10px;
}

/* ============================================================
   SHOWCASE SECTION — Reusable "Our Work"-style image bg row.
   Apply el_class="kreider-showcase-section" on a fullwidth row
   with bg_type="bg_image". Content in one 1/2 column, leave
   the other 1/2 empty to show the background photo.
   ============================================================ */
.kreider-showcase-section.vc_row {
	padding: 80px 0 !important;
}

.kreider-showcase-section .kreider-work-box ul {
	margin-left: 40px;
	margin-bottom: 16px;
	text-align: left;
}

.kreider-showcase-section .kreider-work-box li {
	font-size: 16px;
	line-height: 1.8;
	color: #333;
	font-weight: 700;
}

/* BRK logo — centered variant for use below white boxes */
.kreider-brk-logo-centered {
	text-align: center;
	margin: 24px auto 0;
}

.kreider-brk-logo-centered .kreider-brk-logo-wrap {
	display: inline-block;
}

/* ============================================================
   TIP BOX DARK — Callout box for dark/green backgrounds.
   Apply el_class="kreider-tip-box-dark" on [vc_column_text].
   Yellow left border, translucent bg, white text.
   ============================================================ */
.kreider-tip-box-dark {
	background: rgba(255, 255, 255, 0.10);
	border-left: 4px solid #ffee30;
	padding: 20px 24px;
	border-radius: 0 8px 8px 0;
	margin: 0;
}

.kreider-tip-box-dark h4 {
	color: #ffee30 !important;
	margin-bottom: 6px !important;
	font-size: 18px !important;
}

.kreider-tip-box-dark,
.kreider-tip-box-dark p,
.kreider-tip-box-dark li {
	color: rgba(255, 255, 255, 0.9) !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
}

.kreider-tip-box-dark ol,
.kreider-tip-box-dark ul {
	margin-left: 24px;
}

.kreider-tip-box-dark li {
	margin-bottom: 6px;
}

/* ============================================================
   ACCENT BAR — Reusable black bar with yellow headline.
   Apply el_class="kreider-accent-bar" on a [vc_row].
   Use .kreider-accent-headline (h3) and .kreider-accent-text (p)
   inside a single [vc_column_text] block. Centered text.
   Pair with pad-v-sm for compact look.
   ============================================================ */
.kreider-accent-bar.vc_row,
.vc_row.element-row.kreider-accent-bar {
	background: #000000 !important;
	text-align: center;
}

.kreider-accent-headline {
	color: #ffee30 !important;
	font-size: 26px !important;
	font-weight: 900 !important;
	text-transform: uppercase !important;
	margin-bottom: 6px !important;
	letter-spacing: 0.5px;
}

.kreider-accent-text {
	color: #ffffff !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
}

.kreider-accent-text a {
	color: #ffee30 !important;
	text-decoration: underline !important;
	text-decoration-color: rgba(255, 238, 48, 0.4) !important;
}

.kreider-accent-text a:hover {
	color: #fff !important;
	text-decoration-color: #fff !important;
}

/* ============================================================
   HOMEPAGE: REMOVE #main-content TOP PADDING
   Lets the hero intro row sit flush against the slider.
   ============================================================ */

.home .hb-main-content,
.page-id-7 .hb-main-content {
	padding-top: 0 !important;
}

.home #main-content,
.page-id-7 #main-content {
	padding-top: 0 !important;
}


/* ============================================================
   INLINE IMAGE UTILITIES (for service/content pages)
   ============================================================ */

/* Rounded image with subtle drop shadow — target the img, not the wrapper */
.kreider-img-rounded img {
	border-radius: 8px !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.08) !important;
}
/* Remove WPBakery's default grey box border that adds extra space */
.kreider-img-rounded .vc_single_image-wrapper {
	border: none !important;
	padding: 0 !important;
	background: none !important;
	box-shadow: none !important;
}

/* Image with slight float + margin for text wrap */
.kreider-img-float-right {
	float: right;
	margin: 0 0 20px 30px;
	max-width: 45%;
}

.kreider-img-float-left {
	float: left;
	margin: 0 30px 20px 0;
	max-width: 45%;
}

/* Full-width image in content area */
.kreider-img-full {
	width: 100%;
	border-radius: 8px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.08);
	margin-bottom: 20px;
}

/* Clearfix after floated images */
.kreider-clearfix::after {
	content: "";
	display: table;
	clear: both;
}

/* Service page intro — slightly larger body text */
.kreider-service-intro p {
	font-size: 16px !important;
	line-height: 1.8 !important;
	color: #333 !important;
}

/* Service page process steps */
.kreider-process-step {
	margin-bottom: 30px;
}

.kreider-process-step h3 {
	color: #006940 !important;
	margin-bottom: 10px !important;
}

/* Green highlight box for tips/callouts */
.kreider-tip-box {
	background: #f0f8f4;
	border-left: 4px solid #006940;
	padding: 24px 28px;
	border-radius: 0 8px 8px 0;
	margin: 20px 0;
}

.kreider-tip-box h4 {
	color: #006940 !important;
	margin-bottom: 8px !important;
}

/* Image grid for DuraTherm / gallery-style inline grids */
.kreider-img-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
	margin: 20px 0;
}

.kreider-img-grid img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	border-radius: 6px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
}

@media (max-width: 768px) {
	.kreider-img-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.kreider-img-float-right,
	.kreider-img-float-left {
		float: none;
		max-width: 100%;
		margin: 0 0 20px 0;
	}
}

@media (max-width: 480px) {
	.kreider-img-grid {
		grid-template-columns: 1fr;
	}
}

/* Page-specific: alternating row backgrounds */
.kreider-row-light {
	background: #ffffff;
}

.kreider-row-gray {
	background: #f7f7f7;
}

/* History timeline styling for About page */
.kreider-timeline-item {
	display: flex;
	align-items: flex-start;
	margin-bottom: 24px;
}

.kreider-timeline-year {
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	font-size: 22px;
	color: #006940;
	min-width: 80px;
	padding-right: 20px;
}

.kreider-timeline-text {
	flex: 1;
	font-size: 15px;
	line-height: 1.7;
	color: #333;
}

/* =Kreider Pay Online — verification + payment link UI
-------------------------------------------------------------- */
.kreider-pay-online {
	text-align: center;
	max-width: 520px;
	margin: 0 auto;
	padding: 40px 32px;
	background: #ffffff;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
}
.kreider-pay-icon {
	font-size: 48px;
	color: #006940;
	margin-bottom: 16px;
}
.kreider-pay-icon-success {
	color: #3d8b37;
}
.kreider-pay-online h3 {
	margin: 0 0 12px 0 !important;
	font-size: 1.3em;
}
.kreider-pay-online p {
	color: #666;
	font-size: 0.95em;
	margin-bottom: 20px;
}
.kreider-pay-verify-btn {
	display: inline-block;
	background: #006940;
	color: #ffffff;
	border: none;
	padding: 14px 36px;
	border-radius: 5px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 1.05em;
	cursor: pointer;
	transition: background 0.2s;
}
.kreider-pay-verify-btn:hover {
	background: #008050;
}
.kreider-pay-verify-btn:disabled {
	background: #999;
	cursor: wait;
}
.kreider-pay-verify-btn i {
	margin-right: 8px;
}
.kreider-pay-status {
	margin-top: 12px;
	font-size: 0.9em;
	min-height: 1.4em;
}
.kreider-pay-error {
	color: #c0392b !important;
	font-weight: 500;
}
.kreider-pay-link {
	display: inline-block;
	background: #006940;
	color: #ffffff !important;
	padding: 18px 48px;
	border-radius: 5px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 1.3em;
	text-decoration: none !important;
	transition: background 0.2s;
	margin-bottom: 16px;
}
.kreider-pay-link:hover {
	background: #008050;
	color: #ffffff !important;
}
.kreider-pay-link i {
	margin-right: 10px;
}
.kreider-pay-secure {
	color: #999 !important;
	font-size: 0.85em !important;
	margin-bottom: 0 !important;
}
/* Hide reCAPTCHA badge — disclosure added to page copy per Google TOS */
.grecaptcha-badge {
	visibility: hidden !important;
}

/* =Divider row — thin green bar between sections
-------------------------------------------------------------- */
.kreider-divider-row.vc_row {
	padding: 20px 0 !important;
	margin: 0 !important;
}
.kreider-divider-row .vc_column-inner {
	padding: 0 !important;
}
.kreider-green-divider.vc_separator {
	margin: 0 !important;
	padding: 0 !important;
}
.kreider-green-divider .vc_sep_line {
	border-color: #006940 !important;
}

/* =DearFlip Flipbook integration
-------------------------------------------------------------- */
.kreider-row-gray ._df_book-wrapper,
.kreider-row-gray .dflip-wrapper {
	max-width: 900px;
	margin: 0 auto;
}

/* =Page Title — background image overlay for readability
-------------------------------------------------------------- */
#hb-page-title.hb-image-background .hb-image-bg-wrap {
	background-size: cover !important;
	background-position: center center !important;
}
#hb-page-title.hb-image-background .hb-image-bg-wrap::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,60,29,0.55);
	pointer-events: none;
}
/* Green radial gradient for color-only page titles */
#hb-page-title.hb-color-background .hb-image-bg-wrap {
	background: radial-gradient(ellipse at center, #006940 0%, #003c1d 100%) !important;
}
/* Override green h1/h2 in light-text page titles */
#hb-page-title.light-text h1,
#hb-page-title.light-text h2 {
	color: #ffffff !important;
	text-transform: uppercase;
}

/* ============================================================
   GALLERY PAGE
   ============================================================ */

/* Gallery grid: thumbnail layout with hover effects */
.kreider-gallery-grid .wpb_image_grid .wpb_image_grid_ul {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px !important;
	list-style: none;
	padding: 0;
	margin: 0;
}

@media (max-width: 768px) {
	.kreider-gallery-grid .wpb_image_grid .wpb_image_grid_ul {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (max-width: 480px) {
	.kreider-gallery-grid .wpb_image_grid .wpb_image_grid_ul {
		grid-template-columns: repeat(2, 1fr);
	}
}

.kreider-gallery-grid .wpb_image_grid .wpb_image_grid_ul li {
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
	position: relative !important;
	left: auto !important;
	top: auto !important;
}

.kreider-gallery-grid .wpb_image_grid .wpb_image_grid_ul li a {
	display: block;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0,0,0,0.12);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	aspect-ratio: 4/3;
}

.kreider-gallery-grid .wpb_image_grid .wpb_image_grid_ul li a:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 24px rgba(0,0,0,0.2);
}

.kreider-gallery-grid .wpb_image_grid .wpb_image_grid_ul li img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.kreider-gallery-grid .wpb_image_grid .wpb_image_grid_ul li a:hover img {
	transform: scale(1.05);
}

/* Gallery section headings */
.kreider-gallery-heading {
	margin-bottom: 8px !important;
}

.kreider-gallery-heading h3 {
	font-size: 30px;
	font-weight: 900;
	color: #006940;
	text-transform: uppercase;
	margin-bottom: 6px;
}

.kreider-gallery-heading p {
	font-size: 16px;
	color: #666;
	margin-bottom: 0;
}

/* About page: 90 Years badge overflows tight green bar */
.kreider-serving-bar {
	overflow: visible !important;
	position: relative;
	z-index: 2;
	padding-top: 20px !important;
	padding-bottom: 20px !important;
}

.kreider-90-badge {
	position: static;
	overflow: visible !important;
}

.kreider-90-badge .vc_column-inner {
	position: static;
	overflow: visible !important;
}

.kreider-90-badge .wpb_single_image,
.kreider-90-badge .wpb_single_image .vc_single_image-wrapper {
	overflow: visible !important;
	position: static;
}

.kreider-90-badge .wpb_single_image img {
	position: absolute;
	top: 50%;
	right: 8%;
	transform: translateY(-50%);
	width: auto !important;
	max-width: none !important;
	height: 250px !important;
	display: block;
	filter: drop-shadow(0 6px 16px rgba(0,0,0,0.3));
}

@media (max-width: 768px) {
	.kreider-serving-bar {
		padding-top: 30px !important;
		padding-bottom: 20px !important;
	}
	.kreider-90-badge .wpb_single_image img {
		position: relative;
		top: auto;
		right: auto;
		transform: none;
		height: auto !important;
		width: 50% !important;
		max-width: 50% !important;
		margin: 10px auto;
	}
}

/* ============================================================
   INTERACTIVE TIMELINE
   ============================================================ */

.kreider-timeline {
	max-width: 900px;
	margin: 0 auto;
	outline: none;
}

/* --- Date navigation bar --- */
.kreider-timeline-nav {
	display: flex;
	align-items: center;
	margin-bottom: 40px;
	position: relative;
	overflow: visible;
}

.kreider-timeline-dates {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex: 1;
	position: relative;
	padding: 10px 10px;
	overflow: visible;
}

.kreider-timeline-dates::-webkit-scrollbar {
	display: none;
}

/* Horizontal line behind dots */
.kreider-timeline-line {
	position: absolute;
	top: calc(50% - 8px);
	left: 10px;
	right: 10px;
	height: 3px;
	background: #dcddde;
	z-index: 0;
}

/* Arrow buttons */
.kreider-timeline-arrow {
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	border: 2px solid #006940;
	border-radius: 50%;
	background: #fff;
	color: #006940;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	justify-content: center;
}

.kreider-timeline-arrow:hover:not(:disabled) {
	background: #006940;
	color: #fff;
}

.kreider-timeline-arrow:disabled {
	opacity: 0.3;
	cursor: default;
}

/* Dot buttons */
.kreider-timeline-dot {
	display: flex;
	flex-direction: column;
	align-items: center;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0 12px;
	position: relative;
	z-index: 1;
	flex-shrink: 0;
}

.kreider-timeline-dot-circle {
	display: block;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	border: 3px solid #dcddde;
	background: #fff;
	transition: all 0.3s ease;
	margin-bottom: 8px;
}

.kreider-timeline-dot.active .kreider-timeline-dot-circle {
	border-color: #006940;
	background: #006940;
	box-shadow: 0 0 0 4px rgba(0,105,64,0.2);
	transform: scale(1.2);
}

.kreider-timeline-dot:hover .kreider-timeline-dot-circle {
	border-color: #006940;
}

.kreider-timeline-dot-year {
	font-size: 13px;
	font-weight: 700;
	color: #999;
	transition: color 0.3s ease;
	white-space: nowrap;
}

.kreider-timeline-dot.active .kreider-timeline-dot-year {
	color: #006940;
	font-size: 15px;
}

/* --- Slide content --- */
.kreider-timeline-slides {
	position: relative;
	min-height: 280px;
}

.kreider-timeline-slide {
	display: none;
	gap: 30px;
	align-items: center;
	animation: kreiderTimelineFadeIn 0.4s ease;
}

.kreider-timeline-slide.active {
	display: flex;
}

@keyframes kreiderTimelineFadeIn {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: translateY(0); }
}

.kreider-timeline-slide-image {
	flex-shrink: 0;
	width: 320px;
}

.kreider-timeline-slide-image img {
	width: 100%;
	height: auto;
	border-radius: 8px;
	box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

.kreider-timeline-slide-content {
	flex: 1;
}

.kreider-timeline-slide-content h3 {
	font-size: 26px;
	font-weight: 900;
	color: #006940;
	margin-bottom: 12px;
}

.kreider-timeline-slide-content p {
	font-size: 16px;
	line-height: 1.65;
	color: #444;
}

/* Slide without image — full width text */
.kreider-timeline-slide:not(:has(.kreider-timeline-slide-image)) .kreider-timeline-slide-content {
	max-width: 700px;
}

@media (max-width: 768px) {
	.kreider-timeline-slide {
		flex-direction: column;
		gap: 20px;
	}
	.kreider-timeline-slide-image {
		width: 100%;
		max-width: 300px;
	}
	.kreider-timeline-slides {
		min-height: auto;
	}
	.kreider-timeline-dot {
		padding: 0 8px;
	}
	.kreider-timeline-dot-year {
		font-size: 11px;
	}
	.kreider-timeline-dot.active .kreider-timeline-dot-year {
		font-size: 13px;
	}
}