/* MT Home Remodeling — site styles (Hello Elementor child). Brand: navy #1A2640, yellow #F0E734. */
:root {
	--mth-navy: #1A2640;
	--mth-navy-2: #18253F;
	--mth-slate: #1E293B;
	--mth-yellow: #F0E734;
	--mth-text: #393939;
	--mth-link: #428bca;
}

/* ---------- Base (matches the old Beaver Builder theme defaults) ---------- */
body {
	font-family: Roboto, sans-serif;
	font-size: 16px;
	line-height: 1.45;
	color: var(--mth-text);
	background: #fff;
}
a { color: var(--mth-link); }
a:hover, a:active { color: var(--mth-link); }
h1, h2, h3, h4, h5, h6 { color: #333; }
/* Hello's reset paints buttons pink (#c36); keep theme-level buttons neutral. */
.mth-modal button, .hfe-nav-menu__toggle, .hfe-nav-menu button { color: inherit; border: 0; background: transparent; }
.elementor-widget-text-editor p:last-child { margin-bottom: 0; }

/* ---------- Header (HFE "MTH Header") ---------- */
.mth-header { position: sticky; top: 0; z-index: 999; background: #fff; box-shadow: 0 1px 0 rgba(26, 38, 64, .12); }
body.admin-bar .mth-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .mth-header { top: 0; } }
.mth-trust-bar .elementor-widget-container,
.mth-trust-bar { font-family: Roboto, sans-serif; }
.mth-trust {
	box-sizing: border-box; min-height: 36px; padding: 6px 16px; display: flex; align-items: center; justify-content: center;
	background: var(--mth-navy-2); color: #fff; font-size: 15px; font-weight: 500; line-height: 1.3; text-align: center;
}
.mth-trust__sep { color: var(--mth-yellow); margin: 0 6px; }
.mth-trust__rating { font-weight: 700; white-space: nowrap; }
.mth-mainbar { padding: 10px 30px !important; }
.mth-logo img { display: block; height: 66px; width: auto; max-width: none; }
.mth-mainbar > .mth-hdr-right, .mth-mainbar > .e-con-inner > .mth-hdr-right { flex: 1 1 auto; min-width: 0; width: auto; }
.mth-header .mth-hdr-btns.e-con { --width: auto; width: auto; flex: 0 0 auto; }
.mth-hdr-btns .elementor-button { white-space: nowrap; }
.mth-hdr-btns .elementor-button { box-shadow: 2px 3px 8px rgba(0, 0, 0, .35); }
.mth-hdr-quote .elementor-button, .mth-hdr-phone .elementor-button { transition: background-color .2s, color .2s; }
.mth-hdr-btns .elementor-button .elementor-button-icon svg, .mth-legal-btns .elementor-button-icon svg { width: 1.05em; height: 1.05em; fill: currentColor; }

/* Nav: thin dividers between top-level items like the old header. */
.mth-nav .hfe-nav-menu > li.menu-item + li.menu-item > a.hfe-menu-item,
.mth-nav .hfe-nav-menu > li.menu-item + li.menu-item > .hfe-has-submenu-container > a.hfe-menu-item { border-left: 1px solid #e3e3e3; }
.mth-nav .sub-menu { box-shadow: 0 10px 24px rgba(26, 38, 64, .16); border-top: 3px solid var(--mth-yellow) !important; }
.mth-nav .sub-menu a.hfe-sub-menu-item { white-space: nowrap; }
.mth-nav .hfe-nav-menu__toggle { cursor: pointer; }
@media (max-width: 1024px) {
	.mth-mainbar { padding: 8px 16px !important; }
	.mth-logo img { height: 56px; }
	.mth-hdr-right { justify-content: flex-end; }
	.mth-header .mth-hdr-right.e-con { --container-widget-width: auto; --container-widget-flex-grow: 0; }
	/* Only the toggle shows here; the dropdown is positioned full-width by HFE's script. */
	.mth-header .mth-hdr-right > .mth-nav { flex: 0 0 48px !important; width: 48px !important; max-width: none; margin-left: 0; }
	.mth-hdr-btns .elementor-button { font-size: 15px; padding: 8px 10px; }
	.mth-nav .hfe-nav-menu__toggle { margin-left: auto; margin-right: 0; }
	.mth-nav .hfe-nav-menu > li.menu-item + li.menu-item > a.hfe-menu-item,
	.mth-nav .hfe-nav-menu > li.menu-item + li.menu-item > .hfe-has-submenu-container > a.hfe-menu-item { border-left: 0; }
	.mth-nav nav.hfe-dropdown { box-shadow: 0 14px 24px rgba(26, 38, 64, .18); max-height: calc(100vh - 140px); overflow-y: auto; }
	.mth-nav .hfe-dropdown .sub-menu { box-shadow: none; border-top: 0 !important; }
	.mth-nav .hfe-dropdown a.hfe-menu-item, .mth-nav .hfe-dropdown a.hfe-sub-menu-item { border-bottom: 1px solid #eef0f3; }
}
@media (max-width: 767px) {
	.mth-trust { font-size: 13px; padding: 6px 12px; display: block; }
	.mth-trust__sep { margin: 0 4px; }
	.mth-logo img { height: 50px; }
}

/* ---------- Section headings (were ElementsKit headings) ---------- */
.mth-ekh .elementor-heading-title { margin: 0 0 20px; }
.mth-ekh.mth-ekh--nosep .elementor-heading-title { margin-bottom: 0; }
.mth-ekh:not(.mth-ekh--nosep) .elementor-widget-container::after,
.mth-ekh:not(.mth-ekh--nosep):not(:has(> .elementor-widget-container))::after {
	content: ""; display: block; width: 183px; max-width: 60%; height: 1px; margin: -18px auto 0; background: var(--e-global-color-secondary, #F0E734);
}
.mth-ekh--sep-mb .elementor-widget-container::after,
.mth-ekh--sep-mb:not(:has(> .elementor-widget-container))::after { margin-bottom: 20px !important; }

/* ---------- FAQ toggles (were ElementsKit accordions) ---------- */
.mth-acc .elementor-toggle { display: flex; flex-direction: column; gap: 10px; }
.mth-acc .elementor-toggle .elementor-toggle-item { border: 0 !important; border-radius: 10px; overflow: hidden; margin: 0 !important; }
.mth-acc .elementor-toggle .elementor-tab-title {
	display: flex; align-items: center; gap: 10px; margin: 0; padding: 14px 30px; border: 0 !important; background: var(--mth-slate);
	font-family: "Open Sans", sans-serif; font-size: 20px; font-weight: 400; line-height: 24px; letter-spacing: 0; text-transform: none; border-radius: 10px; cursor: pointer;
}
.mth-acc .elementor-toggle .elementor-tab-title .elementor-toggle-title {
	flex: 1 1 auto; order: 1; color: #fff; text-decoration: none;
	font-family: "Open Sans", sans-serif; font-size: 20px; font-weight: 400; line-height: 24px; letter-spacing: 0; text-transform: none;
}
.mth-acc .elementor-toggle .elementor-tab-title .elementor-toggle-icon { order: 2; float: none; width: auto; color: #fff; line-height: 1; }
.mth-acc .elementor-toggle .elementor-tab-title .elementor-toggle-icon svg { fill: currentColor; width: 1em; height: 1em; }
.mth-acc .elementor-toggle .elementor-tab-title.elementor-active { background: var(--e-global-color-secondary, #F0E734); border-radius: 10px 10px 0 0; }
.mth-acc .elementor-toggle .elementor-tab-title.elementor-active .elementor-toggle-title,
.mth-acc .elementor-toggle .elementor-tab-title.elementor-active .elementor-toggle-icon { color: var(--e-global-color-primary, #1A2640); }
.mth-acc .elementor-toggle .elementor-tab-content {
	border: 0 !important; padding: 20px 30px; background: #fff; color: var(--mth-text);
	font-family: "Open Sans", sans-serif; font-size: 17px; line-height: 30px; box-shadow: inset 0 0 0 1px #eceef2; border-radius: 0 0 10px 10px;
}
.mth-acc .elementor-toggle .elementor-tab-content p:last-child { margin-bottom: 0; }
@media (max-width: 767px) {
	.mth-acc .elementor-toggle .elementor-tab-title { padding: 10px; }
	.mth-acc .elementor-toggle .elementor-tab-title .elementor-toggle-title { font-size: 16px; line-height: 22px; }
	.mth-acc .elementor-toggle .elementor-tab-content { padding: 20px; }
}

/* ---------- Service / area cards (were Essential Addons info boxes) ---------- */
.mth-ibox { text-align: center; }
/* Additional CSS fixes load-more grid cards at 300px via ".grid-with-loadmore .e-flex"; the card body inside must not inherit it. */
.grid-with-loadmore .e-flex.mth-ibox { height: auto !important; }
.mth-ibox__img img { width: 130px; height: 130px; object-fit: cover; border-radius: 50%; border: 2px solid var(--mth-navy); transition: transform .3s; }
.mth-ibox--sm .mth-ibox__img img { width: 120px; height: 120px; }
.mth-ibox__img img:hover { transform: scale(1.1); }
.mth-ibox__title .elementor-heading-title { margin: 20px 0 10px; }
.mth-ibox__text p { margin: 0 0 10px; }
.mth-ibox__btn { margin-top: 5px; }
.mth-ibox__btn .elementor-button-icon svg { width: 20px; height: 20px; }

/* ---------- Load-more grids ---------- */
.grid-with-loadmore > [data-lm-hidden="1"] { display: none !important; }
.grid-with-loadmore { align-content: start !important; align-items: start !important; }

/* ---------- Quote popup (replaces Popup Maker #85) ---------- */
.mth-modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: flex-start; justify-content: center; padding: 40px 16px; overflow-y: auto; visibility: hidden; opacity: 0; transition: opacity .2s, visibility .2s; }
.mth-modal.is-open { visibility: visible; opacity: 1; }
.mth-modal__overlay { position: fixed; inset: 0; background: rgba(10, 16, 30, .72); }
.mth-modal__box { position: relative; width: 640px; max-width: 100%; background: #fff; border-radius: 6px; padding: 24px 24px 12px; box-shadow: 0 20px 60px rgba(0, 0, 0, .35); }
.mth-modal__title { margin: 0 0 12px; font-family: Montserrat, Roboto, sans-serif; font-size: 28px; font-weight: 600; color: var(--mth-navy); }
.mth-modal__close { position: absolute; top: 6px; right: 10px; width: 40px; height: 40px; font-size: 32px; line-height: 1; cursor: pointer; color: var(--mth-navy) !important; }
.mth-modal__form iframe { display: block; width: 100%; min-height: 600px; border: 0; }
body.mth-modal-open { overflow: hidden; }

/* ---------- Mobile sticky CTA bar (was Code Snippet #6) ---------- */
.mt-mobile-cta { display: none; }
@media (max-width: 767px) {
	.mt-mobile-cta { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990; box-shadow: 0 -2px 10px rgba(0, 0, 0, .2); padding-bottom: env(safe-area-inset-bottom); background: var(--mth-navy-2); }
	.mt-mobile-cta .mt-mobile-cta__btn { flex: 1 1 50%; display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 52px; padding: 0 8px; font-family: Roboto, sans-serif; font-size: 16px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none; text-transform: uppercase; }
	.mt-mobile-cta .mt-mobile-cta__quote, .mt-mobile-cta .mt-mobile-cta__quote:visited { background: #f0e632; color: var(--mth-navy-2); }
	.mt-mobile-cta .mt-mobile-cta__call, .mt-mobile-cta .mt-mobile-cta__call:visited { background: var(--mth-navy-2); color: #fff; }
	body { padding-bottom: 52px; }
	/* The canvas landing page renders its own sticky bar. */
	body.page-template-elementor_canvas .mt-mobile-cta { display: none; }
	body.page-template-elementor_canvas { padding-bottom: 0; }
	/* Gold offset frames on images overflow narrow screens (was Code Snippet #10). */
	.elementor-widget.offset-frame2, .elementor-widget.offset-frame3 { margin-left: 16px !important; margin-right: 16px !important; }
}