/* =========================================================================
   MB Car Lift — Theme Stylesheet
   Mirrors the original header-footer.html 1:1, with a few scoped resets
   so the design stays intact inside Elementor without margin/padding
   conflicts.
   ========================================================================= */

/* --------------------- Base resets -------------------------------------- */
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }

body {
	margin: 0;
	font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Accessibility — not part of page body / Elementor content. */
.screen-reader-text {
	border: 0 !important;
	clip: rect(1px, 1px, 1px, 1px) !important;
	-webkit-clip-path: inset(50%) !important;
	clip-path: inset(50%) !important;
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important;
	word-wrap: normal !important;
}
.skip-link:focus {
	background: #fff !important;
	color: #0a0a0a !important;
	clip: auto !important;
	-webkit-clip-path: none !important;
	clip-path: none !important;
	display: block !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	height: auto !important;
	left: 8px !important;
	padding: 12px 18px !important;
	top: 8px !important;
	width: auto !important;
	z-index: 100000 !important;
	border-radius: 6px !important;
	box-shadow: 0 2px 18px rgba(0, 0, 0, .18) !important;
}

:root {
	--c: #e0030a;
	--c-dark: #b8020a;
	--d: #0a0a0a;
	--w: #fff;
	--container: 1280px;
	--r: 9999px;
	--r-panel: 12px;
	--h: 64px;
}

/* --------------------- Sticky Header ------------------------------------ */
.nav-wrap { position: sticky !important; top: 0 !important; z-index: 50 !important; }

.site-header {
	background: rgba(255, 255, 255, .95) !important;
	backdrop-filter: blur(10px) !important;
	-webkit-backdrop-filter: blur(10px) !important;
	border-bottom: 1px solid rgba(0, 0, 0, .08) !important;
}
.site-header__inner { max-width: var(--container) !important; margin: 0 auto !important; padding: 0 1rem !important; }

.nav {
	height: var(--h) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: .75rem !important;
}
.nav__logo { display: inline-flex !important; align-items: center !important; gap: .6rem !important; }
.nav__logo-img { height: 40px !important; width: auto !important; }
.nav__logo-text { display: none !important; flex-direction: column !important; line-height: 1.1 !important; }
.nav__logo-title { font: 700 .95rem "Space Grotesk", sans-serif !important; }
.nav__logo-sub { font-size: 10px !important; color: rgba(0, 0, 0, .6) !important; }

.nav__center { display: none !important; flex: 1 !important; justify-content: center !important; overflow: visible !important; }
.nav__pill {
	display: inline-flex !important;
	align-items: center !important;
	gap: .2rem !important;
	border-radius: var(--r) !important;
	padding: 6px !important;
	background: rgba(0, 0, 0, .04) !important;
	border: 1px solid rgba(0, 0, 0, .1) !important;
	overflow: visible !important;
}
.nav__link {
	padding: .45rem .9rem !important;
	border-radius: var(--r) !important;
	font-size: 13px !important;
	transition: background-color .2s ease, color .2s ease !important;
	white-space: nowrap !important;
}
.nav__link--active { background: var(--d) !important; color: var(--w) !important; font-weight: 600 !important; }
.nav__link:hover { background: rgba(0, 0, 0, .08) !important;  }
.nav__link--active:hover { background: #1f1f1f !important; color:white !important; }

.nav__dropdown { position: relative !important; display: inline-flex !important; }
.nav__link--has-submenu { display: inline-flex !important; align-items: center !important; gap: .2rem !important; }
.nav__chevron { display: inline-flex !important; width: 12px !important; height: 12px !important; opacity: .7 !important; }
.nav__chevron svg { width: 12px !important; height: 12px !important; }
.nav__submenu {
	position: absolute !important;
	top: 100% !important;
	left: 50% !important;
	min-width: 190px !important;
	margin: 0 !important;
	padding: 6px !important;
	padding-top: 10px !important;
	list-style: none !important;
	background: #fff !important;
	border: 1px solid rgba(0, 0, 0, .1) !important;
	border-radius: var(--r-panel) !important;
	box-shadow: 0 12px 32px rgba(0, 0, 0, .14) !important;
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
	transition: opacity .2s ease, visibility .2s ease, transform .2s ease !important;
	transition-delay: .22s !important;
	transform: translateX(-50%) translateY(0) !important;
	z-index: 80 !important;
	overflow: hidden !important;
}
.nav-wrap.mbcl-chrome .nav__dropdown::after {
	content: "" !important;
	position: absolute !important;
	top: 100% !important;
	left: 0 !important;
	width: 100% !important;
	height: 14px !important;
	background: transparent !important;
}
.nav-wrap.mbcl-chrome .nav__submenu::before {
	content: "" !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	height: 10px !important;
	background: transparent !important;
}
.nav__submenu > li { position: relative !important; margin: 0 !important; padding: 0 !important; list-style: none !important; }
.nav__sublink {
	display: block !important;
	padding: .45rem .75rem !important;
	border-radius: 8px !important;
	font-size: 13px !important;
	color: #1a1a1a !important;
	white-space: nowrap !important;
	transition: background-color .2s ease, color .2s ease !important;
}
.nav__sublink:hover { background: rgba(0, 0, 0, .06) !important; color: #0a0a0a !important; }
.nav__sublink--active { background: var(--d) !important; color: var(--w) !important; font-weight: 600 !important; }
.nav__sublink--active:hover { background: #1f1f1f !important; color: #fff !important; }
.nav__submenu--nested {
	top: 0 !important;
	left: 100% !important;
	transform: translateX(4px) !important;
	margin-left: 4px !important;
	border-radius: var(--r-panel) !important;
}
.nav__dropdown:hover > .nav__submenu,
.nav__dropdown:focus-within > .nav__submenu {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	transform: translateX(-50%) translateY(0) !important;
	transition-delay: 0s !important;
}
.nav__submenu li:hover > .nav__submenu--nested,
.nav__submenu li:focus-within > .nav__submenu--nested {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	transform: translateX(0) !important;
}
.nav__pill { position: relative !important; }

.nav__right { display: inline-flex !important; align-items: center !important; gap: .5rem !important; }

.icon-btn {
	width: 40px !important;
	height: 40px !important;
	border-radius: var(--r) !important;
	border: 1px solid rgba(0, 0, 0, .12) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: #fff !important;
	transition: all .2s ease !important;
	flex-shrink: 0 !important;
}
.icon-btn svg { width: 18px !important; height: 18px !important; }
.icon-btn--phone { display: none !important; }
.icon-btn:hover {
	background: #fff1f1 !important;
	border-color: rgba(224, 3, 10, .35) !important;
	color: #900108 !important;
	transform: translateY(-1px) !important;
}

.book-cta {
	height: 40px !important;
	border-radius: var(--r) !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: .5rem !important;
	color: #fff !important;
	background: var(--c) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	padding: 0 8px 0 14px !important;
	transition: all .2s ease !important;
	white-space: nowrap !important;
}
.book-cta__circle {
	width: 28px !important;
	height: 28px !important;
	border-radius: var(--r) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: rgba(0, 0, 0, .18) !important;
}
.book-cta__circle svg { width: 14px !important; height: 14px !important; }
.book-cta:hover { background: var(--c-dark) !important; transform: translateY(-1px) !important; color: #fff !important; }
.book-cta:hover .book-cta__circle { background: rgba(0, 0, 0, .3) !important; }
.book-cta--desktop { display: none !important; }
.book-cta--mobile { display: inline-flex !important; }

.icon-btn--menu .icon-close { display: none !important; }
.icon-btn--menu[aria-expanded="true"] .icon-menu { display: none !important; }
.icon-btn--menu[aria-expanded="true"] .icon-close { display: block !important; }

/* --------------------- Mobile menu panel -------------------------------- */
.mobile-menu {
	position: fixed !important;
	top: 72px !important;
	right: 1rem !important;
	width: 78% !important;
	max-width: 300px !important;
	background: #0a0a0a !important;
	border-radius: 14px !important;
	overflow: hidden !important;
	opacity: 0 !important;
	visibility: hidden !important;
	transform: translateY(-8px) scale(.95) !important;
	pointer-events: none !important;
	transition: .16s ease !important;
	z-index: 60 !important;
	box-shadow: 0 20px 60px rgba(0, 0, 0, .28) !important;
}
.mobile-menu.is-open {
	opacity: 1 !important;
	visibility: visible !important;
	transform: translateY(0) scale(1) !important;
	pointer-events: auto !important;
}
.mobile-menu__eyebrow {
	padding: 12px 16px 8px !important;
	font-size: 10px !important;
	color: rgba(255, 255, 255, .45) !important;
	letter-spacing: .2em !important;
	text-transform: uppercase !important;
}
.mobile-menu__list {
	padding: 0 8px 8px !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 2px !important;
}
.mobile-menu__item {
	color: rgba(255, 255, 255, .9) !important;
	border-radius: 10px !important;
	padding: 10px 12px !important;
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	transition: background-color .2s ease, color .2s ease !important;
}
.mobile-menu__item-arrow { width: 14px !important; height: 14px !important; opacity: .85 !important; }
.mobile-menu__item--active { background: var(--c) !important; color: #fff !important; }
.mobile-menu__item:hover { background: rgba(255, 255, 255, .12) !important; color: #fff !important; }
.mobile-menu__li--has-children > .mobile-menu__item--parent { width: 100% !important; text-align: left !important; }
.mobile-menu__chevron { display: inline-flex !important; width: 14px !important; height: 14px !important; opacity: .85 !important; transition: transform .2s ease !important; }
.mobile-menu__chevron svg { width: 14px !important; height: 14px !important; }
.mobile-menu__li--open > .mobile-menu__item--parent .mobile-menu__chevron { transform: rotate(180deg) !important; }
.mobile-menu__submenu {
	display: none !important;
	margin: 0 !important;
	padding: 0 0 4px 10px !important;
	list-style: none !important;
	flex-direction: column !important;
	gap: 2px !important;
}
.mobile-menu__submenu .mobile-menu__submenu { padding-left: 8px !important; }
.mobile-menu__li--open > .mobile-menu__submenu { display: flex !important; }
.mobile-menu__item--sub {
	padding: 8px 12px 8px 16px !important;
	font-size: 13px !important;
	color: rgba(255, 255, 255, .78) !important;
}
.mobile-menu__item--sub .mobile-menu__item-arrow { display: none !important; }
.mobile-menu__footer { padding: 12px 16px !important; border-top: 1px solid rgba(255, 255, 255, .12) !important; }
.mobile-menu__call {
	color: rgba(255, 255, 255, .9) !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	transition: color .2s ease !important;
}
.mobile-menu__call svg { width: 14px !important; height: 14px !important; }
.mobile-menu__call:hover { color: #fff !important; }

/* --------------------- Fallback page body ------------------------------- */
.site-content { min-height: 40vh; }
.page-gap { min-height: 44vh; display: grid; place-items: center; color: #8d8d8d; font-size: .95rem; }

/* Default content wrapper used for non-Elementor pages. Elementor pages
   using "Elementor Canvas / Full Width" are unaffected. */
.mbcl-default-content {
	max-width: var(--container);
	margin: 0 auto;
	padding: 3rem 1rem;
}
@media (min-width: 768px) {
	.mbcl-default-content { padding: 4rem 1.5rem; }
}

/* --------------------- Footer ------------------------------------------- */
.site-footer {
	background: #0a0a0a !important;
	color: rgba(255, 255, 255, .82) !important;
	padding: 4rem 0 2.5rem !important;
}
.site-footer__inner { max-width: var(--container) !important; margin: 0 auto !important; padding: 0 1rem !important; }
.site-footer__grid { display: grid !important; grid-template-columns: 1fr !important; gap: 2rem !important; }

.site-footer__logo { display: inline-flex !important; align-items: center !important; gap: .6rem !important; }
.site-footer__logo-img { height: 42px !important; width: auto !important; }
.site-footer__logo-text { display: flex !important; flex-direction: column !important; line-height: 1.1 !important; }
.site-footer__logo-title { color: #fff !important; font: 700 .95rem "Space Grotesk", sans-serif !important; }
.site-footer__logo-sub { font-size: 10px !important; color: rgba(255, 255, 255, .58) !important; }

.site-footer__blurb {
	margin-top: 1rem !important;
	max-width: 24rem !important;
	font-size: 14px !important;
	line-height: 1.65 !important;
	color: rgba(255, 255, 255, .66) !important;
}

.site-footer__socials { margin-top: 1rem !important; display: flex !important; gap: .55rem !important; }
.social {
	width: 34px !important;
	height: 34px !important;
	border-radius: 8px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: rgba(255, 255, 255, .08) !important;
	color: rgba(255, 255, 255, .85) !important;
	transition: all .2s ease !important;
}
.social:hover { background: var(--c) !important; color: #fff !important; transform: translateY(-1px) !important; }

.site-footer__h { margin: 0 !important; color: #fff !important; font: 600 1rem "Space Grotesk", sans-serif !important; }
.site-footer__list {
	margin-top: .85rem !important;
	display: flex !important;
	flex-direction: column !important;
	gap: .45rem !important;
	font-size: 14px !important;
}
.site-footer__list a {
	color: rgba(255, 255, 255, .85) !important;
	transition: color .2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: .45rem !important;
}
.site-footer__list a::before {
	content: "›" !important;
	font-size: 19px !important;
	line-height: 1 !important;
	color: rgba(255, 255, 255, .62) !important;
	font-weight: 700 !important;
	transform: translateY(-1px) !important;
	transition: transform .2s ease, color .2s ease !important;
}
.site-footer__list a:hover { color: #f43a40 !important; }
.site-footer__list a:hover::before { color: #f43a40 !important; transform: translate(2px, -1px) !important; }

.site-footer__address {
	margin: .85rem 0 0 !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
	color: rgba(255, 255, 255, .68) !important;
}
.site-footer__contact {
	margin-top: 1rem !important;
	display: flex !important;
	flex-direction: column !important;
	gap: .4rem !important;
	font-size: 14px !important;
}
.site-footer__contact-row {
	color: rgba(255, 255, 255, .85) !important;
	transition: color .2s ease !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: .5rem !important;
}
.site-footer__contact-row svg { width: 15px !important; height: 15px !important; color: #f43a40 !important; flex-shrink: 0 !important; }
.site-footer__contact-row:hover { color: #f43a40 !important; }

.site-footer__bottom {
	margin-top: 2.6rem !important;
	border-top: 1px solid rgba(255, 255, 255, .12) !important;
	padding-top: 1rem !important;
	font-size: 12px !important;
	color: rgba(255, 255, 255, .55) !important;
	display: flex !important;
	flex-direction: column !important;
	gap: .35rem !important;
}
.site-footer__bottom p { margin: 0 !important; }
.site-footer__credit {
	color: #f43a40 !important;
	font-weight: 600 !important;
	transition: color .2s ease !important;
	text-decoration: none !important;
	background: none !important;
}
.site-footer__credit:hover { color: #ff6b70 !important; }
.site-footer__credit::before,
.site-footer__credit::after { content: none !important; }

/* --------------------- Responsive breakpoints --------------------------- */
@media (min-width: 640px) {
	.site-header__inner,
	.site-footer__inner { padding: 0 1.5rem !important; }
	.nav__logo-text { display: flex !important; }
	.book-cta--desktop { display: inline-flex !important; }
	.book-cta--mobile { display: none !important; }
}
@media (min-width: 768px) {
	.icon-btn--phone { display: inline-flex !important; }
	.site-footer__bottom {
		flex-direction: row !important;
		justify-content: space-between !important;
		align-items: center !important;
	}
}
@media (min-width: 1024px) {
	.site-header__inner,
	.site-footer__inner { padding: 0 2rem !important; }
	.nav__center { display: flex !important; }
	.icon-btn--menu { display: none !important; }
	.site-footer__grid { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; }
	.site-footer__col--brand { grid-column: span 4 !important; }
	.site-footer__col--links { grid-column: span 2 !important; }
	.site-footer__col--services { grid-column: span 3 !important; }
	.site-footer__col--address { grid-column: span 3 !important; }
}

/* =========================================================================
   Basic WordPress post / comment defaults — only applied on non-Elementor
   pages to prevent visual conflicts inside the builder.
   ========================================================================= */
.mbcl-default-content h1,
.mbcl-default-content h2,
.mbcl-default-content h3,
.mbcl-default-content h4 { font-family: "Space Grotesk", Inter, sans-serif; color: #0a0a0a; }
.mbcl-default-content p  { line-height: 1.7; color: #1f1f1f; }
.mbcl-default-content a  { color: var(--c); }
.mbcl-default-content a:hover { color: var(--c-dark); }

.mbcl-default-content .wp-block-image img,
.mbcl-default-content img { border-radius: 12px; max-width: 100%; height: auto; }

/* =============================================================================
   Header & footer chrome isolation (beats Elementor global link/colour rules)
   ============================================================================= */
.nav-wrap.mbcl-chrome {
	isolation: isolate !important;
	z-index: 99999 !important;
}
.nav-wrap.mbcl-chrome a,
.nav-wrap.mbcl-chrome button {
	text-decoration: none !important;
}
.nav-wrap.mbcl-chrome img {
	max-width: 100% !important;
	display: block !important;
}
.nav-wrap.mbcl-chrome ul {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.nav-wrap.mbcl-chrome button {
	font: inherit !important;
	border: 0 !important;
	background: transparent !important;
	cursor: pointer !important;
}
.nav-wrap.mbcl-chrome .nav__center,
.nav-wrap.mbcl-chrome .nav__pill,
.nav-wrap.mbcl-chrome .nav__dropdown {
	overflow: visible !important;
}
.nav-wrap.mbcl-chrome .nav__dropdown > .nav__submenu {
	top: 100% !important;
	padding-top: 10px !important;
	transition: opacity .2s ease, visibility .2s ease, transform .2s ease !important;
	transition-delay: .22s !important;
}
.nav-wrap.mbcl-chrome .nav__dropdown:hover > .nav__submenu,
.nav-wrap.mbcl-chrome .nav__dropdown:focus-within > .nav__submenu {
	transition-delay: 0s !important;
}
.nav-wrap.mbcl-chrome .nav__submenu > li {
	position: relative !important;
}
.nav-wrap.mbcl-chrome .nav__submenu > li.menu-item-has-children::after {
	content: "" !important;
	position: absolute !important;
	top: 0 !important;
	right: -12px !important;
	width: 12px !important;
	height: 100% !important;
	background: transparent !important;
}
.nav-wrap.mbcl-chrome .nav__submenu--nested {
	transition-delay: .22s !important;
}
.nav-wrap.mbcl-chrome .nav__submenu li:hover > .nav__submenu--nested,
.nav-wrap.mbcl-chrome .nav__submenu li:focus-within > .nav__submenu--nested {
	transition-delay: 0s !important;
}
.nav-wrap.mbcl-chrome .nav__pill .nav__link,
.nav-wrap.mbcl-chrome .nav__pill .nav__link:visited,
.nav-wrap.mbcl-chrome .nav__pill .nav__dropdown > .nav__link,
.nav-wrap.mbcl-chrome .nav__pill .nav__dropdown > .nav__link:visited {
	color: #0a0a0a !important;
	background: transparent !important;
	text-decoration: none !important;
	box-shadow: none !important;
}
.nav-wrap.mbcl-chrome .nav__pill .nav__link--active,
.nav-wrap.mbcl-chrome .nav__pill .nav__link--active:visited {
	color: #fff !important;
	background: #0a0a0a !important;
}
.nav-wrap.mbcl-chrome .nav__submenu,
.nav-wrap.mbcl-chrome .nav__submenu.nav__submenu--nested {
	border-radius: 12px !important;
	overflow: hidden !important;
	min-width: 220px !important;
	width: max-content !important;
	max-width: min(280px, 90vw) !important;
	background: #fff !important;
	list-style: none !important;
}
.nav-wrap.mbcl-chrome .nav__submenu .nav__sublink,
.nav-wrap.mbcl-chrome .nav__submenu .nav__sublink:visited,
.nav-wrap.mbcl-chrome .nav__submenu a.nav__sublink {
	color: #1a1a1a !important;
	background: transparent !important;
	border-radius: 8px !important;
	display: block !important;
	width: 100% !important;
	text-decoration: none !important;
	box-shadow: none !important;
	font-weight: 400 !important;
}
.nav-wrap.mbcl-chrome .nav__submenu .nav__sublink:hover,
.nav-wrap.mbcl-chrome .nav__submenu .nav__sublink:focus {
	color: #0a0a0a !important;
	background: rgba(0, 0, 0, .06) !important;
}
.nav-wrap.mbcl-chrome .nav__submenu .nav__sublink--active,
.nav-wrap.mbcl-chrome .nav__submenu .nav__sublink--active:visited {
	color: #fff !important;
	background: #0a0a0a !important;
}
.site-footer.mbcl-chrome {
	isolation: isolate !important;
}
.site-footer.mbcl-chrome .site-footer__list a,
.site-footer.mbcl-chrome .site-footer__list a:visited {
	color: rgba(255, 255, 255, .85) !important;
	text-decoration: none !important;
}
.site-footer.mbcl-chrome .site-footer__contact-row,
.site-footer.mbcl-chrome .site-footer__contact-row:visited {
	color: rgba(255, 255, 255, .85) !important;
}
.site-footer.mbcl-chrome .site-footer__logo-title {
	color: #fff !important;
}
.site-footer.mbcl-chrome .social,
.site-footer.mbcl-chrome .social:visited {
	color: rgba(255, 255, 255, .85) !important;
	background: rgba(255, 255, 255, .08) !important;
}
.nav-wrap.mbcl-chrome .mobile-menu a,
.nav-wrap.mbcl-chrome .mobile-menu button,
.nav-wrap.mbcl-chrome .mobile-menu .mobile-menu__item {
	color: rgba(255, 255, 255, .9) !important;
	text-decoration: none !important;
	box-shadow: none !important;
}
.nav-wrap.mbcl-chrome .mobile-menu .mobile-menu__item--sub {
	color: rgba(255, 255, 255, .78) !important;
}