/** Site Theme Tokens **/

:root {
    --core-site-font-body: 'Open Sans', sans-serif;
    --core-site-heading-font: 'Nunito Sans', sans-serif;
    --core-site-color-text: var(--color-text);
    --core-site-color-link: var(--color-brand);
    --core-accent: var(--color-brand);
    --core-radius: 10px;
}
body { font-family: var(--core-site-font-body); }
h1, h2, h3, h4, h5, h6 { font-family: var(--core-site-heading-font); }
body { color: var(--core-site-color-text); }
a { color: var(--core-site-color-link); }


/** Site Custom Stylesheet (From File) **/ 



 /** Site Custom Styles (From DB) **/ 

/* ---------- Design tokens (site palette) ---------- */ :root  {
  --base-content-section-padding-x: 24px;
  /* Brand blue — hero card, heading accents, slider knob */ --color-sky: #2f9cda;
  --color-sky-vivid: #24a9dd;
  --color-sky-light: #5cc0ef;
  --color-sky-dark: #1d7db4;
  /* Green — primary call-to-action buttons */ --color-forest: #306d29;
  --color-forest-dark: #21491c;
  /* Clay/orange — CTA band, ticks */ --color-clay: #cd7932;
  --color-clay-deep: #c86d1b;
  /* Warm accent — step labels, eyebrows */ --color-ember: #f15a29;
  /* Review stars */ --color-amber: #f5a623;
  /* Neutrals */ --color-ink: #15161a;
  --color-slate: #5c5e66;
  --color-espresso: #2b2722;
  --color-cloud: #f5f5f4;
  --color-line: #e7e5e0;
  /* Semantic anchors */ --color-brand: var(--color-sky);
  --color-text: var(--color-ink);
  --color-bg: #ffffff;
}
/* ---------- Background utilities ---------- */ .bg-sky  {
  background-color: var(--color-sky);
}
.bg-sky-vivid  {
  background-color: var(--color-sky-vivid);
}
.bg-sky-light  {
  background-color: var(--color-sky-light);
}
.bg-sky-dark  {
  background-color: var(--color-sky-dark);
}
.bg-forest  {
  background-color: var(--color-forest);
}
.bg-clay  {
  background-color: var(--color-clay);
}
.bg-clay-deep  {
  background-color: var(--color-clay-deep);
}
.bg-ember  {
  background-color: var(--color-ember);
}
.bg-cloud  {
  background-color: var(--color-cloud);
}
.bg-espresso  {
  background-color: var(--color-espresso);
}
.bg-ink  {
  background-color: var(--color-ink);
}
/* ---------- Base ---------- */ body  {
  overflow-x: hidden;
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
}
img  {
  max-width: 100%;
  display: block;
}
a  {
  text-decoration: none;
}
a:hover  {
  color: var(--color-sky-dark);
}
html  {
  scroll-behavior: smooth;
}
.eyebrow  {
  font-family: 'Nunito Sans', sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--color-ember);
  margin-bottom: 12px;
}
/* ---------- Buttons (shared across many sections) ---------- */ .btn  {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: 'Nunito Sans', sans-serif;
  font-weight: 800;
  font-size: 16px;
  line-height: 1;
  border: none;
  border-radius: 5px;
  padding: 17px 26px;
  cursor: pointer;
  text-decoration: none;
}
.btn svg  {
  width: 17px;
  height: 17px;
}
.btn-primary  {
  background: var(--color-forest);
  color: #fff;
}
.btn-primary:hover  {
  background: var(--color-forest-dark);
  color: #fff;
}
.btn-outline-light  {
  background: transparent;
  color: #fff;
  border: 1.5px solid rgba(255,255,255,.55);
}
.btn-outline-light:hover  {
  background: rgba(255,255,255,.12);
  border-color: #fff;
  color: #fff;
}
.btn-outline-dark  {
  background: transparent;
  color: var(--color-ink);
  border: 1.5px solid #cfcdc7;
}
.btn-outline-dark:hover  {
  border-color: var(--color-ink);
  color: var(--color-ink);
}
.btn-outline-dark svg  {
  fill: var(--color-clay);
}
.btn-outline-white  {
  background: transparent;
  color: #fff;
  border: 1.5px solid #fff;
}
.btn-outline-white:hover  {
  background: rgba(255,255,255,.14);
  color: #fff;
}
.button-row  {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 30px;
}
/* ---------- Quote tray content (snippet: tray-quote-form) ---------- */ #tray-modal-quote .core-tray-header h4  {
  font-weight: 800;
  font-size: 26px;
  line-height: 1.15;
  letter-spacing: -.02em;
  margin: 0 0 8px;
}
#tray-modal-quote .tray-lede  {
  font-size: 15.5px;
  line-height: 1.55;
  color: var(--color-slate);
  margin: 0 0 24px;
}
#tray-modal-quote label  {
  font-family: 'Nunito Sans', sans-serif;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: #7a7c84;
}
/* ---------- Prominent form success / failure messages ---------- */ #tray-modal-quote .w-form-done, #tray-modal-quote .w-form-fail  {
  text-align: center;
  padding: 34px 26px 30px;
  border-radius: 14px;
  margin-bottom: 20px;
}
#tray-modal-quote .w-form-done  {
  background: rgba(47,156,218,.09);
}
#tray-modal-quote .w-form-fail  {
  background: rgba(192,57,43,.08);
}
/* Big round icon badge */ #tray-modal-quote .form-msg-icon  {
  width: 84px;
  height: 84px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  color: #fff;
}
#tray-modal-quote .form-msg-icon svg  {
  width: 42px;
  height: 42px;
  display: block;
}
#tray-modal-quote .form-msg-icon-done  {
  background: var(--color-brand);
  box-shadow: 0 10px 26px -10px rgba(47,156,218,.75);
}
#tray-modal-quote .form-msg-icon-fail  {
  background: #c0392b;
  box-shadow: 0 10px 26px -10px rgba(192,57,43,.7);
}
#tray-modal-quote .form-msg-title  {
  font-family: 'Nunito Sans', sans-serif;
  font-weight: 800;
  font-size: 30px;
  line-height: 1.15;
  letter-spacing: -.02em;
  color: var(--color-ink);
  margin: 0 0 10px;
}
#tray-modal-quote .form-msg-text  {
  font-size: 17px;
  line-height: 1.55;
  color: var(--color-slate);
  margin: 0;
  max-width: 30ch;
  margin-left: auto;
  margin-right: auto;
}
#tray-modal-quote .w-form-done .form-msg-text a  {
  color: var(--color-brand);
  font-weight: 700;
}
#tray-modal-quote .w-form-fail .form-msg-text a  {
  color: #c0392b;
  font-weight: 700;
}
/* ---------- Marquee keyframes (must live site-wide, not in a section
   style column — see note below). The `animation:` reference stays in the
   Trusted-By section CSS; only the @keyframes definition lives here so it
   registers globally and the animation name resolves. ---------- */ @keyframes tfMarquee  {
  from  {
    transform: translateX(0);
  }
  to  {
    transform: translateX(-50%);
  }
}
/* ---------- Small-phone overrides ---------- */ @media (max-width: 639px)  {
  :root  {
    --base-content-section-padding-x: 20px;
  }
  .btn  {
    width: 100%;
    justify-content: center;
    min-height: 48px;
  }
  .nav-phone.btn, .nav-cta.btn  {
    width: auto;
  }
  input, select, textarea  {
    font-size: 16px;
  }
  #tray-modal-quote .form-msg-title  {
    font-size: 26px;
  }
  #tray-modal-quote .form-msg-icon  {
    width: 74px;
    height: 74px;
  }
}


 /** Content Section Styles **/ 

.content-section-2851  {
  &.content-section  {
    position: sticky;
    top: 0;
    z-index: 50;
    border-bottom: 1px solid var(--color-line);
  }
  .content-section-inner  {
    padding-top: 16px;
    padding-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 26px;
    transition: padding .25s ease;
  }
  .site-logo  {
    display: flex;
    align-items: center;
    flex-shrink: 0;
  }
  .site-logo img  {
    height: 64px;
    width: auto;
    transition: height .25s ease;
  }
  .core-menu  {
    margin-left: auto;
  }
  .core-menu-link  {
    font-weight: 600;
  }
  .nav-phone  {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-weight: 700;
    font-size: 16px;
    color: var(--color-clay-deep);
    white-space: nowrap;
    border: 1.5px solid var(--color-clay-deep);
    border-radius: 6px;
    padding: 11px 16px;
  }
  .nav-phone svg  {
    width: 16px;
    height: 16px;
    fill: currentColor;
  }
  .nav-cta  {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    background: var(--color-forest);
    color: #fff;
    padding: 14px 22px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    transition: padding .25s ease;
  }
  .nav-cta:hover  {
    background: var(--color-forest-dark);
  }
  /* Shrunk state — applied once the page is scrolled */ &.content-section.is-shrunk .content-section-inner  {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  &.content-section.is-shrunk .site-logo img  {
    height: 48px;
  }
  &.content-section.is-shrunk .nav-phone  {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  &.content-section.is-shrunk .nav-cta  {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  @media (max-width: 1279px)  {
    /* 1024–1279px band: the desktop menu is still shown (collapse point is
   ~1023px). Keep the header on ONE row — logo left, menu in the middle,
   phone + CTA on the right — instead of wrapping the menu to its own line.
   There's enough room between the logo and the CTAs at these widths. */ .content-section-inner  {
      flex-wrap: nowrap;
      gap: 14px 18px;
    }
    .core-menu:not(.is-collapsed)  {
      margin-left: auto;
    }
    .nav-phone  {
      margin-left: 0;
    }
    /* When the menu collapses to a hamburger, keep it far right with the phone +
   CTA beside it on its inner side (no full-width wrap of the desktop list). */ .content-section-inner:has(.core-menu.is-collapsed)  {
      flex-wrap: nowrap;
      gap: 14px 18px;
    }
    .core-menu.is-collapsed  {
      order: 4;
      margin-left: 0;
      width: auto;
    }
    .core-menu.is-collapsed ~ .nav-cta, .content-section-inner:has(.core-menu.is-collapsed) .nav-cta  {
      order: 3;
    }
    .content-section-inner:has(.core-menu.is-collapsed) .nav-phone  {
      order: 2;
      margin-left: auto;
    }
    .content-section-inner:has(.core-menu.is-collapsed) .site-logo  {
      order: 1;
    }
  }
  @media (max-width: 1023px)  {
    /* Below the hamburger breakpoint (~1023px): logo left, then phone + CTA, then
   the burger hard right. Tighten spacing so the row doesn't overflow. */ .content-section-inner  {
      flex-wrap: nowrap;
      gap: 10px 12px;
    }
    .core-menu.is-collapsed  {
      order: 4;
      margin-left: 0;
    }
    .nav-phone  {
      order: 2;
      margin-left: auto;
    }
    .nav-cta  {
      order: 3;
    }
    .site-logo  {
      order: 1;
      margin-right: 0;
    }
  }
  @media (max-width: 767px)  {
    /* Phones: drop the text phone button (keep the CTA + burger), free up room. */ .content-section-inner  {
      gap: 8px 10px;
    }
    .nav-phone  {
      display: none;
    }
    /* The phone button carried margin-left:auto to push the trailing cluster
   right; since it's now hidden, move that onto the CTA so the CTA + burger
   still sit hard against the right edge of the header. */ .nav-cta  {
      order: 3;
      font-size: 15px;
      padding: 11px 16px;
      margin-left: auto;
    }
    .core-menu.is-collapsed  {
      order: 4;
      margin-left: 0;
    }
  }
  @media (max-width: 639px)  {
    .site-logo img  {
      height: 44px;
    }
    .nav-cta  {
      font-size: 14px;
      padding: 10px 13px;
    }
  }
}
.content-section-2852  {
  padding-top: clamp(44px, 5vw, 56px);
  padding-bottom: clamp(44px, 5vw, 56px);
  &.content-section  {
    color: #fff;
  }
  .content-section-inner  {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1.1fr;
    gap: 40px;
    align-items: start;
  }
  .footer-logo  {
    height: 88px;
    width: auto;
    display: block;
  }
  .footer-contact  {
    font-size: 16px;
    line-height: 1.4;
    color: #fff;
  }
  .footer-contact a  {
    font-weight: 700;
    text-decoration: underline;
    color: #fff;
  }
  .footer-hours  {
    font-size: 15px;
    line-height: 1.85;
    color: #e6e3de;
    margin-top: 24px;
  }
  .footer-social  {
    display: flex;
    gap: 18px;
    align-items: center;
  }
  .footer-social a  {
    display: inline-flex;
    color: var(--color-sky);
  }
  .footer-social a:hover  {
    color: var(--color-sky-light);
  }
  .footer-social svg  {
    width: 26px;
    height: 26px;
  }
  .footer-copy  {
    font-size: 15px;
    line-height: 1.4;
    color: #fff;
    margin-top: 30px;
  }
  @media (max-width: 1023px)  {
    .content-section-inner  {
      grid-template-columns: 1fr;
      gap: 28px;
    }
  }
}
.content-section-2853  {
  .hero-grid  {
    display: grid;
    grid-template-columns: 1.04fr .96fr;
    gap: 18px;
    align-items: stretch;
  }
  .hero-box  {
    background: var(--color-sky);
    color: #fff;
    border-radius: 16px;
    padding: clamp(32px, 4vw, 52px);
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .hero-rating  {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .hero-rating .stars  {
    color: var(--color-amber);
    font-size: 19px;
    letter-spacing: .1em;
  }
  .hero-eyebrow  {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: rgba(255,255,255,.92);
  }
  .hero-box h1  {
    font-weight: 800;
    font-size: clamp(30px, 3.3vw, 50px);
    line-height: 1.06;
    white-space: nowrap;
    letter-spacing: -.025em;
    margin: 20px 0 0;
    color: #fff;
  }
  .hero-box p  {
    font-size: 19px;
    line-height: 1.6;
    color: rgba(255,255,255,.92);
    margin: 22px 0 0;
    text-wrap: pretty;
  }
  .hero-media  {
    border-radius: 16px;
    overflow: hidden;
    min-height: clamp(320px, 36vw, 540px);
    background: #dcdcda;
  }
  .hero-media img  {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 62%;
  }
  @media (max-width: 1023px)  {
    .hero-grid  {
      grid-template-columns: 1fr;
    }
    /* Let the headline wrap below desktop so the fixed line breaks don't force
   horizontal overflow on tablets. */ .hero-box h1  {
      white-space: normal;
    }
  }
  @media (max-width: 767px)  {
    /* Full-width, stacked hero buttons on phones. */ .button-row  {
      width: 100%;
    }
    .button-row .btn  {
      width: 100%;
    }
  }
  @media (max-width: 639px)  {
    .hero-box h1  {
      white-space: normal;
      font-size: 30px;
    }
    .hero-box p  {
      font-size: 17px;
    }
  }
}
.content-section-2854  {
  .trust-bar-grid  {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }
  .trust-bar-item  {
    padding: 2px 30px;
    text-align: center;
  }
  .trust-bar-item + .trust-bar-item  {
    border-left: 2px solid var(--color-line);
  }
  .trust-bar-title  {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 800;
    font-size: 26px;
    line-height: 1.2;
    letter-spacing: -.015em;
  }
  .trust-bar-sub  {
    font-size: 14px;
    color: var(--color-slate);
    margin-top: 6px;
  }
  @media (max-width: 1023px)  {
    .trust-bar-item  {
      padding: 2px 16px;
    }
    .trust-bar-title  {
      font-size: 22px;
    }
  }
  @media (max-width: 767px)  {
    .trust-bar-grid  {
      grid-template-columns: 1fr;
      gap: 22px 0;
    }
    .trust-bar-item  {
      padding: 16px 0 0;
    }
    .trust-bar-item + .trust-bar-item  {
      border-left: 0;
      border-top: 2px solid var(--color-line);
    }
  }
}
.content-section-2855  {
  h2  {
    font-weight: 800;
    font-size: clamp(28px, 3.6vw, 42px);
    line-height: 1.06;
    letter-spacing: -.02em;
    margin: 0 0 34px;
    text-align: center;
  }
  .reviews-grid  {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    align-items: stretch;
  }
  .review-card  {
    background: #fff;
    border: 1px solid var(--color-line);
    border-radius: 12px;
    padding: 30px;
    display: flex;
    flex-direction: column;
  }
  .review-card .stars  {
    font-size: 18px;
    color: var(--color-amber);
    letter-spacing: .1em;
  }
  .review-card p  {
    font-size: 15.5px;
    line-height: 1.62;
    color: #46474d;
    margin: 13px 0 0;
  }
  .review-card p:first-of-type  {
    margin-top: 16px;
  }
  .review-author  {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    margin-top: auto;
    padding-top: 18px;
    border-top: 1px solid #ece9e3;
  }
  @media (max-width: 1023px)  {
    .reviews-grid  {
      grid-template-columns: 1fr;
    }
  }
  @media (max-width: 639px)  {
    h2  {
      text-wrap: pretty;
    }
  }
}
.content-section-2856  {
  &.content-section  {
    text-align: center;
  }
  h2  {
    font-weight: 800;
    font-size: clamp(28px, 3.6vw, 42px);
    line-height: 1.06;
    letter-spacing: -.02em;
    margin: 0 0 36px;
  }
  .partners-marquee  {
    overflow: hidden;
    width: 100%;
    -webkit-mask-image: linear-gradient(to right, transparent, #000 7%, #000 93%, transparent);
    mask-image: linear-gradient(to right, transparent, #000 7%, #000 93%, transparent);
  }
  .partners-track  {
    display: flex;
    align-items: center;
    width: max-content;
    animation: tfMarquee 34s linear infinite;
  }
  .partners-marquee:hover .partners-track  {
    animation-play-state: paused;
  }
  .partners-track img  {
    height: 56px;
    width: auto;
    object-fit: contain;
    opacity: .78;
    margin-right: clamp(40px, 5vw, 64px);
    flex-shrink: 0;
  }
  @media (max-width: 639px)  {
    h2  {
      text-wrap: pretty;
    }
    .partners-track img  {
      height: 44px;
      margin-right: 36px;
    }
  }
}
.content-section-2857  {
  .our-work-head  {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 34px;
  }
  .our-work-head h2  {
    font-weight: 800;
    font-size: clamp(26px, 3vw, 34px);
    line-height: 1.1;
    letter-spacing: -.02em;
    margin: 0;
  }
  .our-work-head .eyebrow  {
    color: var(--color-slate);
  }
  .our-work-head p  {
    font-size: 16px;
    line-height: 1.6;
    color: var(--color-slate);
    margin: 12px 0 0;
  }
  .slider-track  {
    gap: 22px;
    padding-bottom: 4px;
  }
  .slider-item img  {
    width: 100%;
    height: 340px;
    object-fit: cover;
    border-radius: 10px;
    background: #e8e6e2;
  }
  .work-title  {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    margin: 14px 0 4px;
  }
  .work-sub  {
    font-size: 14px;
    line-height: 1.5;
    color: var(--color-slate);
  }
  .core-content-slider  {
    position: relative;
    overflow: hidden;
    padding-bottom: 60px;
  }
  .slider-dots  {
    position: absolute;
    left: 0;
    bottom: 2px;
    display: flex;
    align-items: center;
    gap: 9px;
  }
  .slider-prev, .slider-next  {
    position: absolute;
    bottom: 0;
    width: 38px;
    height: 38px;
    background: #fff;
    border: 1.5px solid var(--color-line);
    color: var(--color-ink);
    font-size: 17px;
    line-height: 1;
  }
  .slider-next  {
    right: 0;
  }
  .slider-prev  {
    right: 48px;
  }
  @media (max-width: 767px)  {
    .slider-item img  {
      height: 260px;
    }
    .core-content-slider  {
      padding-bottom: 56px;
    }
    /* Stack the head and let the "View all" button go full width. */ .our-work-head  {
      flex-direction: column;
      align-items: flex-start;
    }
    .our-work-head .btn  {
      width: 100%;
    }
  }
  @media (max-width: 639px)  {
    .slider-prev, .slider-next  {
      width: 44px;
      height: 44px;
    }
    .slider-prev  {
      right: 54px;
    }
    .core-content-slider  {
      padding-bottom: 62px;
    }
  }
}
.content-section-2858  {
  h2  {
    font-weight: 800;
    font-size: clamp(28px, 3.6vw, 42px);
    line-height: 1.06;
    letter-spacing: -.02em;
    margin: 0 auto 44px;
    max-width: 760px;
    text-align: center;
  }
  h2 span  {
    color: var(--color-sky-vivid);
  }
  .trust-grid  {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
  .trust-card  {
    background: #fff;
    border: 1px solid var(--color-line);
    border-radius: 12px;
    padding: 28px 26px;
  }
  .trust-grid > .trust-card:last-child  {
    grid-column: 1 / -1;
    width: calc(50% - 10px);
    margin: 0 auto;
  }
  .trust-grid > .trust-card:last-child .trust-card-head  {
    justify-content: center;
  }
  .trust-grid > .trust-card:last-child p  {
    text-align: center;
    padding-left: 0;
  }
  .trust-card-head  {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
  }
  .trust-card-head .tick  {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    border-radius: 3px;
    background: var(--color-clay);
    color: #fff;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 11px;
    line-height: 20px;
    text-align: center;
  }
  .trust-card h3  {
    font-weight: 700;
    font-size: 19px;
    line-height: 1.25;
    margin: 0;
  }
  .trust-card p  {
    font-size: 15px;
    line-height: 1.6;
    color: var(--color-slate);
    margin: 0;
    padding-left: 32px;
  }
  @media (max-width: 1023px)  {
    .trust-grid  {
      grid-template-columns: 1fr;
    }
    .trust-grid > .trust-card:last-child  {
      width: 100%;
    }
  }
  @media (max-width: 639px)  {
    h2  {
      text-wrap: pretty;
    }
  }
}
.content-section-2859  {
  &.content-section  {
    color: #fff;
  }
  .content-section-inner  {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    align-items: center;
    justify-content: space-between;
  }
  .cta-band-copy  {
    flex: 1;
    min-width: 300px;
    max-width: 700px;
  }
  h2  {
    font-weight: 800;
    font-size: clamp(28px, 3.6vw, 42px);
    line-height: 1.06;
    letter-spacing: -.02em;
    margin: 0;
  }
  .cta-band-copy p  {
    font-size: 17px;
    line-height: 1.6;
    color: rgba(255,255,255,.94);
    margin: 14px 0 0;
  }
  .cta-band-actions  {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    flex-shrink: 0;
  }
  @media (max-width: 767px)  {
    .content-section-inner  {
      flex-direction: column;
      align-items: flex-start;
    }
    /* Full-width stacked action buttons on small screens. */ .cta-band-actions  {
      width: 100%;
      flex-direction: column;
    }
    .cta-band-actions .btn  {
      width: 100%;
    }
  }
  @media (max-width: 639px)  {
    .cta-band-copy  {
      min-width: 0;
    }
    .cta-band-actions  {
      width: 100%;
    }
  }
}
.content-section-2860  {
  .ba-slider  {
    --pos: 50%;
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    cursor: ew-resize;
    user-select: none;
    touch-action: none;
    box-shadow: 0 18px 44px -26px rgba(0,0,0,.55);
  }
  .ba-slider img  {
    display: block;
    width: 100%;
    aspect-ratio: 2.35 / 1;
    object-fit: cover;
    pointer-events: none;
  }
  .ba-before  {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    clip-path: inset(0 calc(100% - var(--pos)) 0 0);
  }
  .ba-label  {
    position: absolute;
    top: 14px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #fff;
    background: rgba(15,16,19,.72);
    padding: 7px 11px;
    border-radius: 5px;
    pointer-events: none;
  }
  .ba-label-before  {
    left: 14px;
  }
  .ba-label-after  {
    right: 14px;
  }
  .ba-handle  {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 3px;
    background: #fff;
    left: var(--pos);
    transform: translateX(-50%);
    box-shadow: 0 0 10px rgba(0,0,0,.4);
    pointer-events: none;
  }
  .ba-knob  {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: var(--color-sky);
    box-shadow: 0 2px 12px rgba(0,0,0,.35);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
  }
  .ba-knob span  {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 26px;
    line-height: 1;
    color: #fff;
  }
  .ba-hint  {
    position: absolute;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    font-weight: 600;
    font-size: 12px;
    color: #fff;
    background: rgba(15,16,19,.62);
    padding: 7px 13px;
    border-radius: 100px;
    pointer-events: none;
  }
  @media (max-width: 639px)  {
    .ba-slider img  {
      aspect-ratio: 1.5 / 1;
    }
  }
}
.content-section-2861  {
  .process-grid  {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: clamp(32px, 4vw, 64px);
    align-items: start;
  }
  .process-intro h2  {
    font-weight: 800;
    font-size: clamp(28px, 3.4vw, 40px);
    line-height: 1.08;
    letter-spacing: -.02em;
    margin: 0;
  }
  .process-intro h2 span  {
    color: var(--color-sky-vivid);
  }
  .process-intro p  {
    font-size: 17px;
    line-height: 1.62;
    color: var(--color-slate);
    margin: 18px 0 0;
  }
  .process-steps  {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  .process-card  {
    background: #fff;
    border: 1px solid var(--color-line);
    border-radius: 14px;
    padding: 28px 30px;
    display: flex;
    gap: 24px;
    align-items: flex-start;
  }
  .process-card-body  {
    flex: 1;
  }
  .process-card > img  {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
  }
  .process-step  {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--color-ember);
  }
  .process-card h3  {
    font-weight: 700;
    font-size: 21px;
    line-height: 1.2;
    margin: 10px 0;
  }
  .process-card p  {
    font-size: 15.5px;
    line-height: 1.6;
    color: var(--color-slate);
    margin: 0;
  }
  @media (max-width: 1023px)  {
    .process-grid  {
      grid-template-columns: 1fr;
    }
  }
  @media (max-width: 767px)  {
    /* Full-width stacked buttons on small screens. */ .button-row  {
      width: 100%;
    }
    .button-row .btn  {
      width: 100%;
    }
  }
  @media (max-width: 639px)  {
    .process-card  {
      flex-direction: column;
      gap: 14px;
    }
  }
}
.content-section-2862  {
  background: linear-gradient(rgba(35,33,30,.86), rgba(35,33,30,.72)), url('/site-assets/images/warehouse-bg.jpg') center 72% / 120% auto no-repeat #3a3733;
  &.content-section  {
    color: #fff;
  }
  h2  {
    font-weight: 800;
    font-size: 35px;
    line-height: 1.2;
    letter-spacing: -.01em;
    color: var(--color-sky-vivid);
    margin: 0 0 44px;
    text-align: center;
  }
  .why-epoxy-grid  {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }
  .why-epoxy-item  {
    padding: 0 30px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 800;
    font-size: clamp(22px, 2.1vw, 27px);
    line-height: 1.2;
    letter-spacing: -.015em;
    color: #fff;
    text-align: center;
  }
  .why-epoxy-item + .why-epoxy-item  {
    border-left: 1px solid rgba(255,255,255,.28);
  }
  @media (max-width: 1023px)  {
    .why-epoxy-grid  {
      grid-template-columns: 1fr;
      gap: 26px 0;
    }
    .why-epoxy-item  {
      padding: 20px 0 0;
      text-align: left;
    }
    .why-epoxy-item + .why-epoxy-item  {
      border-left: 0;
      border-top: 1px solid rgba(255,255,255,.28);
    }
  }
  @media (max-width: 639px)  {
    h2  {
      font-size: 28px;
      text-wrap: pretty;
    }
  }
}
.content-section-2863  {
  h2  {
    font-weight: 800;
    font-size: clamp(28px, 3.6vw, 42px);
    line-height: 1.06;
    letter-spacing: -.02em;
    margin: 0 0 40px;
    text-align: center;
  }
  h2 span  {
    color: var(--color-sky-light);
  }
  summary  {
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 700;
    font-size: 19px;
    line-height: 1.35;
    color: var(--color-sky-vivid);
  }
  details p  {
    font-size: 16px;
    line-height: 1.62;
    color: var(--color-slate);
  }
  @media (max-width: 639px)  {
    h2  {
      text-wrap: pretty;
    }
  }
}
.content-section-2864  {
  background: linear-gradient(90deg, rgba(28,27,25,.86) 0%, rgba(28,27,25,.68) 48%, rgba(28,27,25,.42) 100%), url('/site-assets/images/cta-final.jpg') center / cover no-repeat var(--color-espresso);
  &.content-section  {
    color: #fff;
  }
  .final-cta-copy  {
    max-width: 880px;
  }
  h2  {
    font-weight: 800;
    font-size: clamp(30px, 4vw, 50px);
    line-height: 1.05;
    letter-spacing: -.025em;
    margin: 0;
    color: #fff;
  }
  .final-cta-copy p  {
    font-size: 17px;
    line-height: 1.7;
    color: rgba(255,255,255,.86);
    margin: 22px 0 0;
  }
  @media (max-width: 767px)  {
    /* Full-width stacked buttons on small screens. */ .button-row  {
      width: 100%;
    }
    .button-row .btn  {
      width: 100%;
    }
  }
  @media (max-width: 639px)  {
    h2  {
      font-size: 30px;
    }
  }
}