/* Changes asked for after the move (October 2026), on top of the old site's styles. */

/* Projects page: the category cards show a project photo (the old site had a pale "coming soon" picture), so their
   title and "Show All" link are white over a dark shade rising from the bottom left. */
.elementor-4670 .qodef-qi-banner .qodef-m-image:after {
	background: linear-gradient(20deg, rgba(0, 0, 0, .72) 0%, rgba(0, 0, 0, .45) 40%, rgba(0, 0, 0, .08) 75%, rgba(0, 0, 0, 0) 100%);
}
.elementor-4670 .qodef-qi-banner:hover .qodef-m-image:after {
	background: linear-gradient(20deg, rgba(0, 0, 0, .8) 0%, rgba(0, 0, 0, .55) 45%, rgba(0, 0, 0, .15) 80%, rgba(0, 0, 0, .05) 100%);
}
.elementor-4670 .qodef-qi-banner .qodef-m-title,
.elementor-4670 .qodef-qi-banner .qodef-m-title a,
.elementor-4670 .qodef-qi-banner .qodef-m-button .qodef-qi-button,
.elementor-4670 .qodef-qi-banner .qodef-m-button .qodef-qi-button:hover,
.elementor-4670 .qodef-qi-banner .qodef-m-button .qodef-m-text {
	color: #fff !important;
	text-shadow: 0 1px 3px rgba(0, 0, 0, .35);
}
.elementor-4670 .qodef-qi-banner .qodef-m-button .qodef-qi-button .qodef-m-text:after,
.elementor-4670 .qodef-qi-banner .qodef-m-button .qodef-qi-button:after {
	background-color: #fff !important;
	color: #fff !important;
}

/* Phones: a bar at the bottom of the screen with "Call Us" and "Get a Quote" (src/lib/frame.ts). The page
   gets room for it at the bottom; the "back to top" arrow sits above it; the cookie banner stays above everything. */
.nd-mobile-cta { display: none; }
@media only screen and (max-width: 768px) {
	.nd-mobile-cta {
		display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 98; gap: 8px;
		padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #e3e3e3;
		box-shadow: 0 -4px 14px rgba(0, 0, 0, .06);
	}
	.nd-mobile-cta a {
		flex: 1 1 0; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px;
		border-radius: 25px; font-family: "DM Sans", sans-serif; font-size: 15px; font-weight: 500; line-height: 1.2;
		text-align: center; text-decoration: none; transition: background-color .2s, color .2s;
	}
	.nd-mobile-cta__call { color: #000; border: 1px solid #000; background: #fff; }
	.nd-mobile-cta__call:hover, .nd-mobile-cta__call:focus-visible { color: #fff; background: #000; }
	.nd-mobile-cta__quote { color: #fff; border: 1px solid #587d7e; background: #587d7e; }
	.nd-mobile-cta__quote:hover, .nd-mobile-cta__quote:focus-visible { color: #fff; background: #3f5f60; border-color: #3f5f60; }
	body { padding-bottom: calc(62px + env(safe-area-inset-bottom)); }
	#qodef-back-to-top { bottom: calc(80px + env(safe-area-inset-bottom)) !important; }
	body.nd-on-contact .nd-mobile-cta { display: none; }
	body.nd-on-contact { padding-bottom: 0; }
}
