/* Rebuild additions: accessibility and fixes. Each change is listed in DEVIATIONS.md. */
.skip-link{position:absolute;left:1rem;top:-100px;z-index:10000;padding:.75rem 1rem;background:#fff;color:#141719;font-weight:600;border-radius:4px;text-decoration:none}
.skip-link:focus{top:1rem}
:where(a,button,input,select,textarea,[role="button"],[tabindex="0"],.w-dropdown-toggle,.w-nav-button,.w-tab-link):focus-visible{outline:2px solid #e03131;outline-offset:3px}
.w-slider-dot{cursor:pointer}
.navbar1_menu-button{cursor:pointer}
.navbar1_dropdown-toggle{cursor:pointer}
.faq5_question,.faq6_question{cursor:pointer}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{scroll-behavior:auto!important}}
@media (min-width:992px) and (max-width:1199px){.navbar1_menu-links{white-space:nowrap}.navbar1_menu-links>.text-link-wrapper,.navbar1_menu-links>.w-dropdown{margin-left:.5rem;margin-right:.5rem}.navbar1_menu-links .navbar10_link,.navbar1_dropdown-toggle{font-size:clamp(.875rem,1.4vw,1rem)}.navbar1_menu-buttons .animated-button{padding-left:1rem;padding-right:1rem;white-space:nowrap}} .navbar1_logo-link{flex-shrink:0}@media (min-width:992px) and (max-width:1060px){.navbar1_menu-links>.text-link-wrapper,.navbar1_menu-links>.w-dropdown{margin-left:.375rem;margin-right:.375rem}}
/* Fix: outline buttons were 42px vs 40px solid buttons (1px border added to height) */
.animated-button.light-outline,.button-animated.light-outline{box-sizing:border-box}
.animated-button.light-outline,.animated-button.w-variant-4401739a-8951-0fcb-8bfe-a4e1618a9399{padding-top:7px;padding-bottom:7px}
/* Fix: long CTA labels wrapped to two lines on phones, breaking the stacked text-swap hover */
@media (max-width:479px){.animated-button .animated-button-text{white-space:nowrap}.animated-button{padding-left:1rem;padding-right:1rem;max-width:100%}}
/* Responsive images: <picture> wrappers must not change layout; width/height attrs reserve space (CLS 0) */
picture{display:contents}
:where(img[width][height]){width:auto;height:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.footer3_link-list h2.heading-style-h6{margin-top:0;margin-bottom:0}
/* 404 and thank-you: centered eyebrow above the hero heading */
.utility-pill-center{display:flex;justify-content:center}
.thank-you .button-group.is-center{flex-wrap:wrap;gap:1rem}
/* Nav underline hover (see ix.ts): live hid the bar; show it under the label, parked off to the left */
.text-link-wrapper{position:relative;overflow:hidden}
.text-link-underline{display:block;position:absolute;left:0;right:0;bottom:0;height:2px;transform:translate3d(-101%,0,0);pointer-events:none}
@media (prefers-reduced-motion: reduce){.text-link-underline{transition:none!important}}
.lenis [data-lenis-prevent][data-nav-menu-open]{overflow-y:auto;max-height:calc(100dvh - 5rem);overscroll-behavior:contain}
/* Footer and banner links had no hover or focus feedback on live; add one quiet, consistent state */
.footer3_link,.footer3_legal-link,.footer3_social-link,.footer3_component a.text-size-small,.banner a{transition:opacity 200ms ease-out}
@media (hover:hover){.footer3_link:hover,.footer3_legal-link:hover,.footer3_social-link:hover,.footer3_component a.text-size-small:hover,.banner a:hover{opacity:.7}}
/* Nav alignment: every link, the dropdown toggle and the CTA share one vertical center line */
@media (min-width:992px){
.navbar1_menu,.navbar1_menu-links,.navbar1_menu-buttons{display:flex;align-items:center}
.navbar1_menu-links>.text-link-wrapper,.navbar1_menu-links>.w-dropdown{display:flex;align-items:center;margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0;vertical-align:middle}
.navbar1_menu-links>.text-link-wrapper>.navbar10_link,.navbar1_menu-links .navbar1_dropdown-toggle{display:flex;align-items:center;padding-top:.5rem;padding-bottom:.5rem;line-height:1.5}
.navbar1_menu-links .navbar1_dropdown-toggle{padding-left:0;padding-right:0;gap:.25rem}
.navbar1_menu-links .navbar1_dropdown-toggle .text-block{line-height:1.5}
.navbar1_menu-links .dropdown-chevron{display:flex;align-items:center;margin:0}
/* The dropdown is now a flex box with align-items center, which would center its absolute list over the toggle; pin it below like live (flush, no animation) */
.navbar1_menu-links>.w-dropdown{position:relative}
.navbar1_menu-links>.w-dropdown>.w-dropdown-list{top:100%;left:0;transform:none;margin-top:0}
/* Hover bridge: an invisible strip above the open list so the pointer never leaves the dropdown on the way down */
.navbar1_menu-links>.w-dropdown>.w-dropdown-list.w--open::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:.75rem}
}
@media (max-width:991px){
.navbar1_menu-links .navbar1_dropdown-toggle{display:flex;align-items:center;gap:.25rem;padding-top:.5rem;padding-bottom:.5rem;line-height:1.5}
.navbar1_menu-links .navbar1_dropdown-toggle .text-block{line-height:1.5}
.dropdown-chevron{display:flex;align-items:center}
}

/* Oct 26 mobile QA: section spacing tokens (dominant existing values) applied through the shared section class.
   Hero (.hero/.service-hero) and the paired service sections (.service-1/.service/.service-last, which split 112px between
   adjacent same-colour sections) keep their own values on purpose. */
:root{--section-pad-top:7rem;--section-pad-bottom:7rem;--section-head-gap:5rem;--section-cta-gap:5rem}
@media screen and (max-width:991px){:root{--section-pad-top:6rem;--section-pad-bottom:6rem;--section-head-gap:4.5rem;--section-cta-gap:4.5rem}}
@media screen and (max-width:767px){:root{--section-pad-top:4rem;--section-pad-bottom:4rem;--section-head-gap:3rem;--section-cta-gap:3rem}}
.padding-section-large:not(.hero):not(.service-hero):not(.service-1):not(.service):not(.service-last){padding-top:var(--section-pad-top);padding-bottom:var(--section-pad-bottom)}
.padding-section-large>:last-child,.padding-section-large>:last-child>:last-child,.padding-section-large>:last-child>:last-child>:last-child{margin-bottom:0}
.margin-top:empty,.margin-bottom:empty{display:none}
/* Buttons and short labels never wrap. */
.animated-button,.service-label,.layout423_card-content.label,.text-style-tagline.label{white-space:nowrap}
@media (min-width:768px) and (max-width:1199px){.layout423_card-content.label,.service-label{font-size:.75rem;letter-spacing:0}}
/* Hero badges overflowed 320-360px screens: two even columns that shrink. */
@media screen and (max-width:479px){
  .hero-icon-wrappers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:.75rem;row-gap:.75rem;max-width:100%}
  .hero-icon-box{min-width:0}
  .hero-icon-box .text-size-small{font-size:.8125rem;white-space:nowrap}
  .text-style-tagline{font-size:.875rem;white-space:nowrap}
}
@media (max-width:359px){.cf-turnstile.ts-box{transform:scale(.9);transform-origin:0 0}}
/* Tap targets >= 44px. Text links grow their hit area with padding offset by negative margin, so nothing moves. */
.animated-button{min-height:44px}
.navbar1_menu-button{min-width:48px;min-height:48px}
.footer3_link{padding-top:12px;padding-bottom:12px;margin-top:-4px;margin-bottom:-4px}
.footer3_legal-link,a.text-size-small{display:inline-block;padding-top:14px;padding-bottom:14px;margin-top:-14px;margin-bottom:-14px}
.footer3_social-link{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;margin:-10px}
.footer3_logo-link{min-height:44px;display:flex;align-items:center}
/* Contact list: icon and first text line share the top edge; links get a 44px tap area via padding that negative margin cancels, so row spacing is unchanged. */
.contact6_item{align-items:flex-start}
.contact6_contact-list>a{padding:10px 0;margin:-10px 0}
@media (min-width:992px){.navbar10_link.w-nav-link,.navbar1_dropdown-toggle{min-height:44px;display:flex;align-items:center}}
.pricing22_bottom-row-content .animated-button,.animated-button{overflow:hidden}
.w-slider-dot{padding:18px;margin:-18px -15px calc(.5em - 18px);background-clip:content-box;box-sizing:content-box}
@media (min-width:768px) and (max-width:1199px){
  .pricing22_bottom-row{grid-template-columns:minmax(0,.5fr) repeat(3,minmax(0,1fr))}
  .pricing22_bottom-row-content .animated-button{width:100%;padding-left:.5rem;padding-right:.5rem;font-size:.75rem}
}
@media (min-width:992px){.navbar10_link.w-nav-link{min-width:44px;justify-content:center}}
@media screen and (max-width:479px){.hero-icon-box>*:not(.text-size-small){flex-shrink:0}.hero-icon-box{gap:.375rem}}

/* Oct 26 mobile QA pass 2. Section tokens: 112px desktop, 96px at 991 and below, 64px at 767 and below (--section-pad-top/bottom). */
/* Stacked service sections share one background: each keeps the bottom token and the following ones drop their top, so every seam is one token. */
.section_layout16 .padding-section-large.service-1{padding-top:var(--section-pad-top);padding-bottom:var(--section-pad-bottom)}
.section_layout16 .padding-section-large.service,.section_layout16 .padding-section-large.service-last{padding-top:0;padding-bottom:var(--section-pad-bottom)}
/* CTA on the same light background as the section above: no doubled padding. */
.section_faq6.color-scheme-5 + .section_cta53 .padding-section-large:not(.hero):not(.service-hero):not(.service-1):not(.service):not(.service-last),.section_layout249.color-scheme-5 + .section_cta53 .padding-section-large:not(.hero):not(.service-hero):not(.service-1):not(.service):not(.service-last){padding-top:0}
/* Logo strip and reel rail used their own padding; bring them onto the tokens. */
.section_logo4 .padding-section-medium{padding-top:var(--section-pad-top);padding-bottom:var(--section-pad-bottom)}
.reel-rail.ega-reels{padding-top:var(--section-pad-top);padding-bottom:var(--section-pad-bottom)}
/* Hero badges still ran 6px off a 320px screen ("Faster Turnarounds") and "Extreme Convenience" overlapped the next icon. */
@media screen and (max-width:479px){
  .hero-icon-wrappers{grid-template-columns:auto auto;justify-content:space-between;column-gap:.5rem}
}
@media screen and (max-width:389px){
  .hero-icon-box{gap:.375rem}
  .hero-icon-box .icon-embed-xsmall.hero{width:1.125rem;height:1.125rem}
  .hero-icon-box .text-size-small{font-size:.75rem}
}

/* Desktop dropdown: the tap-target rule above made each link a centred 44px flex box inside a wrapper that keeps 16px top
   and bottom padding, so items were centred and 76px apart. Left-align them and stack them as 44px rows; each wrapper
   shrinks to its label so the hover underline matches the text. */
@media (min-width:992px){
.navbar1_dropdown-list>.text-link-wrapper{align-self:flex-start;margin:0 .75rem;padding:0}
.navbar1_dropdown-list .navbar10_link.w-nav-link{justify-content:flex-start;min-width:0;padding:0;line-height:1.5;text-align:left}
}

/* Collapsed menu (991 and below). Webflow only stacked the links under 480px, so from 480 to 991 the four top-level links
   ran inline in a centred row under the dropdown. The dropdown items were also 18px against 16px top-level links, with
   no indent. Now: one left-aligned column of 44px rows at one size, with the service links indented under Core Services. */
@media (max-width:991px){
.navbar1_menu-links{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}
.navbar1_menu-links>.text-link-wrapper,.navbar1_menu-links>.w-dropdown{display:block;margin:0;padding:0}
.navbar1_menu-links>.w-dropdown{width:100%}
.navbar1_menu-links .navbar10_link.w-nav-link,.navbar1_menu-links .navbar1_dropdown-toggle{display:flex;align-items:center;min-height:44px;padding:.5rem 0;font-size:1.125rem;line-height:1.5}
.navbar1_menu-links .navbar1_dropdown-toggle .text-block{font-size:1.125rem}
.navbar1_menu-links .navbar1_dropdown-list.w--open{padding:.25rem 0 .25rem 1rem;background-color:transparent;border-left:2px solid var(--color-scheme-1--border);border-radius:0;margin:0 0 .25rem}
.navbar1_dropdown-list>.text-link-wrapper{display:block;width:fit-content;margin:0;padding:0}
.navbar1_dropdown-list .navbar10_link.w-nav-link{font-size:1rem}
}
/* Hero badges: from 480 to 991 each label wrapped to two lines beside its icon. Keep labels on one line in a 2x2 grid, as on phones. */
@media (min-width:480px) and (max-width:991px){
.hero-icon-wrappers{display:grid;grid-template-columns:auto auto;justify-content:center;column-gap:2.5rem;row-gap:.75rem}
.hero-icon-box .text-size-small{white-space:nowrap}
}
/* Pricing buttons: the one-line "Get Initial Inspection" label is 196px at 16px, so from 480 to 767 it forced 260px columns
   (page overflowed by up to 240px) and from 768 to 991 it was clipped inside 170px buttons. From 600 to 991 the label
   drops to 12px, which fits; below 600 three columns cannot hold it, so the row is hidden as Webflow already did under 480
   (the enrollment form below is the CTA). */
@media (min-width:480px) and (max-width:599px){.pricing22_bottom-row{display:none}}
@media (min-width:600px) and (max-width:767px){
  .pricing22_bottom-row{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pricing22_bottom-row-content .animated-button{width:100%;padding-left:.375rem;padding-right:.375rem;justify-content:center}
  .pricing22_bottom-row-content .animated-button .button-icon-hover{display:none}
}
@media (min-width:600px) and (max-width:991px){.pricing22_bottom-row-content .animated-button-text{font-size:.75rem}}
/* Open mobile menu: the header was still transparent over the hero at the top of the page, so the logo and close button
   sat on the photo above a solid menu. While the menu is open the header uses the menu's background, whatever the scroll
   position (overrides the inline scroll colour from ix.ts). The class comes off once the menu has slid away. */
@media (max-width:991px){.navbar1_component.is-menu-open{background-color:var(--color-scheme-1--background)!important;transition:background-color 200ms ease}}
/* FTD footer credit: snug stack with copyright + legal */
.footer3_bottom-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 28px}
.footer3_meta{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0;flex:1 1 240px}
.footer3_credit-text{margin:0}
.footer3_ftd{display:flex;align-items:center}
.footer3_legal-list{margin:0}
@media (max-width:767px){
  .footer3_bottom-wrapper{flex-direction:column;align-items:flex-start;gap:12px}
  .footer3_meta{gap:8px}
  .footer3_ftd{min-height:0}
}
/* Team placeholders until headshots arrive: initials in a brand-blue circle, same size as the photos. */
.team3_image-wrapper.is-placeholder{display:flex;align-items:center;justify-content:center;background-color:var(--_primitives---colors--off-shore-blue);color:var(--_primitives---colors--white)}
.team3_initials{font-family:inherit;font-size:1.5rem;font-weight:700;letter-spacing:.04em;line-height:1}
/* Hiring card: full-width strip under the team, text left and button right; stacks on phones. */
.team3_item.hiring{grid-column:1/-1;flex-flow:row wrap;justify-content:space-between;align-items:center;gap:1.5rem 2rem;text-align:left}
.team3_item.hiring:hover{transform:none}
.team3_hiring-action{flex:none}
@media (max-width:767px){.team3_item.hiring{flex-direction:column;align-items:flex-start}}
/* Mobile menu panel: links at the top, brand/contact/social block pinned to the bottom of the panel. */
.navbar1_menu-footer{display:none}
@media (max-width:991px){
.navbar1_menu.w-nav-menu[data-nav-menu-open]{display:flex!important;flex-direction:column;align-items:stretch;justify-content:flex-start;padding-bottom:max(1.5rem,env(safe-area-inset-bottom))}
.navbar1_menu-footer{display:flex;flex-direction:column;gap:1.25rem;margin-top:auto;text-align:left;padding-top:2rem;border-top:1px solid rgba(255,255,255,.12);color:var(--_primitives---colors--white)}
.navbar1_menu-brand{display:flex;align-items:center;gap:1rem}
.navbar1_menu-logo{width:3.5rem;height:auto;flex:none}
.navbar1_menu-tagline{margin:0;font-size:.9375rem;line-height:1.45;opacity:.75}
.navbar1_menu-footer-row{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem}
.navbar1_menu-contact{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.navbar1_menu-contact a{display:flex;align-items:center;min-height:44px;color:inherit;text-decoration:none;font-size:1rem}
.navbar1_menu-social{display:flex;gap:.25rem;margin-right:-10px;flex:none}
.navbar1_menu-social-link{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;color:inherit;transition:opacity 200ms ease-out}
.navbar1_menu-social-link:hover,.navbar1_menu-contact a:hover{opacity:.7}
}
