/* Pre-launch review fixes (2026-10-03). Loaded after bands.css on every page. * Every rule here is an addition; nothing in the ported cascade is edited. */ /* --------------------------------------------------------- drawer submenus -- * Live's tablet and phone drawers open with BOTH groups (Our Services, Service * Areas) fully expanded — 165px and 132px — and the carets do nothing. House * standard: every group starts CLOSED and the caret opens and closes it * (runtime.js drawer()). The open height is the group's measured scrollHeight, * written inline by the runtime, so the transition is real rather than a * max-height snap. Scoped to .layout-drawer: the desktop dropdowns are untouched. */ #dm .layout-drawer li[data-sub-nav-menu] > .unifiednav__container_sub-nav, #dm .layout-drawer .unifiednav__item-wrap > .unifiednav__container_sub-nav { overflow: hidden; transition: max-height 0.3s ease-in-out; } #dm .layout-drawer .unifiednav__item-wrap:not(.unifiednav__item-wrap_open) > .unifiednav__container_sub-nav { max-height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; border-width: 0 !important; opacity: 0; pointer-events: none; } /* The nav is data-show-vertical-sub-items="SHOW", so Duda turns every caret's * ::before over (pointing up, "open") at all times. Point it down while its * group is closed and up while open. */ #dm#dm .layout-drawer .unifiednav__item-wrap .gy-drawer-caret::before { transform: none; transition: transform 0.3s ease-in-out; } #dm#dm .layout-drawer .unifiednav__item-wrap.unifiednav__item-wrap_open .gy-drawer-caret::before { transform: rotate(180deg); } #dm .layout-drawer .gy-drawer-caret { position: relative; } /* A real touch target without changing the caret's inline footprint. */ #dm .layout-drawer .gy-drawer-caret::after { content: ""; position: absolute; left: 50%; top: 50%; width: 34px; height: 34px; transform: translate(-50%, -50%); } /* ------------------------------------------------- current section parent -- * The desktop nav's "effect-bottom2" underline, shown on the top-level parent of * the current page when that page sits in a dropdown (runtime.js * currentSectionParent). Same values Duda computes for the current top-level item. */ #dm nav.main-navigation .unav-top-item.gy-parent-current .nav-item-text::after { opacity: 1; transform: none; } /* ---------------------------------------------------- contact-form legal line -- * "Privacy Policy | Terms & Conditions" on ONE line under the /contact-us form * (src/generated/contact-us.json, after .dmformsubmit). The submit wrapper is * floated, so clear:both is what puts the line beneath it; the 15px is padding * because a margin collapses against the float's container. Alignment follows the * submit button per band (runtime.js legalLineAlign). Ink and face are the form * labels' own: black on the white form ground. */ #dm .gy-legal-links--form { clear: both; display: block; width: 100%; margin: 0; padding-top: 15px; font-size: 14px; line-height: 1.5; white-space: nowrap; color: rgb(0, 0, 0); } #dm .gy-legal-links--form a { color: inherit; text-decoration: underline; } /* ------------------------------------------------------------ /tos-pp headings -- * The page carried TWO

s, "Terms of Service" and "Privacy Policy" (live too). * "Privacy Policy" is now an

; these pin it to the size the

rendered at, * measured per band (1440: 50px, 768 and 390: 30px; Bitter 700, black, no margin). * Duda's own h2 sizes are #dmRoot #dm div.dmContent h2 (2,1,2), hence the doubled class. */ #dmRoot #dm h2.gy-h1-pin.gy-h1-pin { margin: 0; padding: 0; font-weight: 700; line-height: normal; color: rgb(0, 0, 0); font-size: 30px; } #dmRoot #dm h2.gy-h1-pin.gy-h1-pin > span { font-size: inherit; } #dmRoot #dm [data-mg-band="d"] h2.gy-h1-pin.gy-h1-pin { font-size: 50px; } /* --------------------------------------------------------- /blog-search heading -- * "Search Results" was an

on a page with no

(live too); it is now the *

. Desktop (32px) and phone (26px) come from the heading's own size classes; * tablet took Duda's h1 size (30px) instead of the h2's 25px, so that band is pinned. */ #dmRoot #dm [data-mg-band="t"] h1.gy-h2-pin.gy-h2-pin, #dmRoot #dm [data-mg-band="t"] h1.gy-h2-pin.gy-h2-pin > span { font-size: 25px; } /* ------------------------------------------- city pages: industries card row -- * On /columbia-sc, /greenville-sc, /hilton-head-sc and /lexington-sc the 2x2 * "Businesses We Protect" cards sit in 475px rows but would not shrink below their * longest word (cards 248-275px), so the page scrolled sideways by up to 52px * between 1025 and ~1120px wide — on live as well. In that band only, the cards * share the row equally and their padding and heading step down so the longest * word ("Manufacturing", "Professional") still fits. 1200px and up is untouched. */ @media (min-width: 1025px) and (max-width: 1199px) { #dm [id="0b19a7aa"], #dm [id="64f5e791"], #dm [id="5ecede02"], #dm [id="2ea34d93"] { flex: 1 1 0; min-width: 0; padding: 14px; } #dmRoot #dm [id="0b19a7aa"] h4, #dmRoot #dm [id="64f5e791"] h4, #dmRoot #dm [id="5ecede02"] h4, #dmRoot #dm [id="2ea34d93"] h4, #dmRoot #dm [id="0b19a7aa"] h4 span, #dmRoot #dm [id="64f5e791"] h4 span, #dmRoot #dm [id="5ecede02"] h4 span, #dmRoot #dm [id="2ea34d93"] h4 span { font-size: 16px; } } /* ------------------------------------------------------- hero breadcrumb pill -- * The white pill behind the breadcrumbs was a fixed share of the hero column * (754px at 1440, 474px at 768) however short the trail, leaving a long empty * white bar after the last crumb. It now hugs the trail (manual review * 2026-10-03). The group's id differs on every page, so it is matched by the * breadcrumb widget it wraps. */ #dm#dm .flex-element.group:has(> .flex-element.widget-wrapper[data-widget-type="ssrbreadcrumbs"]) { width: fit-content; min-width: 0; max-width: 100%; flex-grow: 0; } #dm#dm .flex-element.group > .flex-element.widget-wrapper[data-widget-type="ssrbreadcrumbs"] { width: auto; min-width: 0; flex: 0 1 auto; }