/*-- -------------------------- -->
<---      Theme v2 (site-wide)    -->
<--- -------------------------- -*/
/* Bold & rugged layer: condensed display type, near-black navy surfaces,
   sky blue as the single accent. Load AFTER core-styles / shared-sections /
   cs-navigation so these tokens and overrides win. */

@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&display=swap");

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  :root {
    --fontDisplay: "Oswald", "Archivo", sans-serif;
    --ink: #07111F;
    --inkSoft: #0E1B2E;
    --accent: var(--secondary);
    --accentHover: #4CC4F5;
    --onAccent: var(--onSecondary);
    --lineOnDark: rgba(255, 255, 255, 0.12);
    --radius: 0.25rem;
    --headerFontSize: clamp(2.25rem, 5vw, 3.75rem);
    --topperFontSize: clamp(0.8125rem, 1.4vw, 0.9375rem);
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  .cs-title,
  .sb-title {
    font-weight: 700;
    letter-spacing: 0.005em;
    line-height: 1.05em;
  }

  .cs-topper,
  .sb-topper {
    font-family: "Archivo", sans-serif;
    font-weight: 800;
    letter-spacing: 0.18em;
    color: var(--secondaryText);
  }

  .v2-title {
    font-family: var(--fontDisplay);
    font-size: var(--headerFontSize);
    font-weight: 700;
    line-height: 1.05em;
    text-transform: uppercase;
    color: var(--headerColor);
    margin: 0 0 1rem;
    max-width: 22ch;
  }
  .v2-title .v2-accent {
    color: var(--secondaryText);
  }
  .v2-dark .v2-title {
    color: #fff;
  }
  .v2-dark .v2-title .v2-accent {
    color: var(--accent);
  }
  .v2-text {
    font-size: 1.0625rem;
    line-height: 1.6em;
    color: var(--bodyTextColor);
    max-width: 38rem;
  }
  .v2-dark .v2-text {
    color: rgba(255, 255, 255, 0.78);
  }

  /* Buttons ------------------------------------------------ */
  .v2-btn,
  .cs-button-solid,
  .sb-button-solid {
    font-family: var(--fontDisplay);
    font-size: 1.0625rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: var(--radius);
  }
  .v2-btn {
    min-height: 3.375rem;
    padding: 0 1.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    border: 2px solid var(--accent);
    background: var(--accent);
    color: var(--onAccent);
    transition: background-color 0.2s, border-color 0.2s, color 0.2s, transform 0.2s;
  }
  .v2-btn:hover {
    background: var(--accentHover);
    border-color: var(--accentHover);
    transform: translateY(-2px);
  }
  .v2-btn:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 3px;
  }
  .v2-btn-ghost {
    background: transparent;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.55);
  }
  .v2-btn-ghost:hover {
    background: #fff;
    border-color: #fff;
    color: var(--primary);
  }
  .v2-btn-dark {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
  }
  .v2-btn-dark:hover {
    background: var(--ink);
    border-color: var(--ink);
  }
  .v2-btn-icon {
    width: 1.125rem;
    height: 1.125rem;
    flex: none;
  }

  /* Nav accents */
  #cs-navigation .cs-nav-button {
    background-color: var(--accent);
    color: var(--onAccent);
    font-family: var(--fontDisplay);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: var(--radius);
  }
  #cs-navigation .cs-li-link {
    font-family: var(--fontDisplay);
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }

  /* Scroll reveal (enabled by home-v2.js adding .v2-js to <html>) */
  .v2-js [data-reveal] {
    opacity: 0;
    transform: translateY(1.5rem);
    transition: opacity 0.7s ease, transform 0.7s ease;
  }
  .v2-js [data-reveal].v2-in {
    opacity: 1;
    transform: none;
  }

  /* Mobile sticky call / quote bar */
  .v2-callbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 11000;
    display: grid;
    grid-template-columns: 1fr 1fr;
    background: var(--ink);
    box-shadow: 0 -6px 24px rgba(0, 0, 0, 0.25);
    padding-bottom: env(safe-area-inset-bottom);
  }
  .v2-callbar a {
    min-height: 3.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-family: var(--fontDisplay);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    color: #fff;
  }
  .v2-callbar a + a {
    background: var(--accent);
    color: var(--onAccent);
  }
  body.v2-has-callbar {
    padding-bottom: 3.5rem;
  }
  body.v2-has-callbar .sb-textus {
    bottom: 4.5rem;
  }
}

/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  .v2-callbar {
    display: none;
  }
  body.v2-has-callbar {
    padding-bottom: 0;
  }
  body.v2-has-callbar .sb-textus {
    bottom: 1rem;
  }
}

/*-- -------------------------- -->
<---             CTA              -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #cta-v2 {
    padding: var(--sectionPadding);
    position: relative;
    overflow: hidden;
    background: var(--ink);
  }
  #cta-v2 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: grid;
    gap: 2.5rem;
    align-items: center;
    position: relative;
    z-index: 1;
  }
  #cta-v2 .v2-text {
    margin-bottom: 2rem;
  }
  #cta-v2 .cs-button-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
  }
  #cta-v2 .cs-phone {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    background: var(--accent);
    color: var(--ink);
    padding: clamp(1.75rem, 4vw, 2.75rem);
    text-decoration: none;
    position: relative;
    transition: transform 0.2s;
  }
  #cta-v2 .cs-phone:hover {
    transform: translateY(-4px);
  }
  #cta-v2 .cs-phone:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 4px;
  }
  #cta-v2 .cs-mascot {
    position: absolute;
    right: 1.25rem;
    top: -3.5rem;
    width: 7rem;
    height: auto;
  }
  #cta-v2 .cs-phone-label {
    margin-bottom: 1.25rem;
    font-size: 0.875rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
  }
  #cta-v2 .cs-phone-number {
    font-family: var(--fontDisplay);
    font-size: clamp(2.25rem, 4.5vw, 3.25rem);
    font-weight: 700;
    line-height: 1.1;
    white-space: nowrap;
    margin: 0 0 0.375rem;
  }
  #cta-v2 .cs-areas {
    list-style: none;
    margin: 0;
    padding: 1rem 0 0;
    border-top: 2px solid rgba(7, 17, 31, 0.2);
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem 1rem;
    width: 100%;
  }
  #cta-v2 .cs-areas li {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--ink);
  }
  #cta-v2 .cs-background {
    position: absolute;
    inset: 0;
    z-index: 0;
  }
  #cta-v2 .cs-background:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(7, 17, 31, 0.95) 0%, rgba(7, 17, 31, 0.78) 100%);
  }
  #cta-v2 .cs-background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #cta-v2 .cs-container {
    grid-template-columns: 1fr 26rem;
    gap: 5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .v2-js [data-reveal] {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .v2-btn {
    transition: none;
  }
}

/*-- -------------------------- -->
<---   Browser surfaces + misc    -->
<--- -------------------------- -*/

@media only screen and (min-width: 0rem) {
  ::selection {
    background: var(--accent);
    color: var(--ink);
  }
  body {
    background: #fff;
  }
  html {
    accent-color: var(--accent);
    scrollbar-color: var(--primaryLight) #E6EDF3;
  }
  a {
    text-underline-offset: 0.2em;
  }
  :focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 3px;
  }
  /* retired template decoration */
  .cs-snow,
  .cs-bubbles,
  .sb-mascot-float,
  .sb-mascot-cta,
  #faq-1263 .cs-background {
    display: none !important;
  }
}

/*-- -------------------------- -->
<---          Page Hero           -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #page-hero-v2 {
    padding: calc(var(--nav-offset) + clamp(2.5rem, 6vw, 4.5rem)) 1rem clamp(3.5rem, 7vw, 5.5rem);
    position: relative;
    overflow: hidden;
    background: var(--ink);
  }
  #page-hero-v2 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    position: relative;
    z-index: 1;
  }
  #page-hero-v2 .cs-breadcrumb {
    list-style: none;
    margin: 0 0 1.25rem;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    font-size: 0.875rem;
  }
  #page-hero-v2 .cs-breadcrumb li {
    color: rgba(255, 255, 255, 0.6);
    font-size: inherit;
    display: flex;
    gap: 0.5rem;
  }
  #page-hero-v2 .cs-breadcrumb li + li:before {
    content: "/";
    color: rgba(255, 255, 255, 0.35);
  }
  #page-hero-v2 .cs-breadcrumb a {
    color: rgba(255, 255, 255, 0.85);
    font-size: inherit;
  }
  #page-hero-v2 .cs-title {
    font-size: clamp(2.5rem, 6.5vw, 4.75rem);
    line-height: 1;
    color: #fff;
    max-width: 18ch;
    margin: 0 0 1.25rem;
  }
  #page-hero-v2 .cs-title .cs-color,
  #page-hero-v2 .cs-title .v2-accent {
    color: var(--accent);
  }
  #page-hero-v2 .cs-text {
    font-size: clamp(1.0625rem, 1.6vw, 1.1875rem);
    line-height: 1.6em;
    color: rgba(255, 255, 255, 0.82);
    max-width: 40rem;
    margin: 0 0 2rem;
  }
  #page-hero-v2 .cs-meta {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.9375rem;
    margin: 0;
  }
  #page-hero-v2 .cs-meta strong {
    color: var(--secondaryLight);
  }
  #page-hero-v2 .cs-button-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
  }
  #page-hero-v2 .cs-background {
    position: absolute;
    inset: 0;
    z-index: 0;
  }
  #page-hero-v2 .cs-background:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(7, 17, 31, 0.95) 0%, rgba(7, 17, 31, 0.82) 50%, rgba(7, 17, 31, 0.5) 100%);
  }
  #page-hero-v2 .cs-background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

/*-- -------------------------- -->
<---      Page Body (articles)    -->
<--- -------------------------- -*/

/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #page-body-v2 {
    padding: var(--sectionPadding);
    background: #fff;
  }
  #page-body-v2 .cs-container {
    width: 100%;
    max-width: 80rem;
    margin: auto;
    display: grid;
    gap: clamp(2.5rem, 5vw, 4rem);
  }
  #page-body-v2 .cs-prose {
    max-width: 44rem;
    min-width: 0;
  }
  #page-body-v2 .cs-prose > * + * {
    margin-top: 1.25rem;
  }
  #page-body-v2 .cs-prose p,
  #page-body-v2 .cs-prose li {
    font-size: 1.0625rem;
    line-height: 1.7em;
    color: var(--bodyTextColor);
  }
  #page-body-v2 .cs-prose h2 {
    font-size: clamp(1.75rem, 3.4vw, 2.5rem);
    line-height: 1.05em;
    margin-top: clamp(2.5rem, 5vw, 3.5rem);
  }
  #page-body-v2 .cs-prose h3 {
    font-size: clamp(1.375rem, 2.4vw, 1.75rem);
    line-height: 1.1em;
    margin-top: 2.25rem;
  }
  #page-body-v2 .cs-prose h4 {
    font-size: 1.25rem;
    margin-top: 2rem;
  }
  #page-body-v2 .cs-prose h2 + *,
  #page-body-v2 .cs-prose h3 + *,
  #page-body-v2 .cs-prose h4 + * {
    margin-top: 0.75rem;
  }
  #page-body-v2 .cs-prose ul,
  #page-body-v2 .cs-prose ol {
    padding-left: 0;
    list-style: none;
    display: grid;
    gap: 0.5rem;
  }
  #page-body-v2 .cs-prose ul li {
    padding-left: 1.75rem;
    position: relative;
  }
  #page-body-v2 .cs-prose ul li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 0.625rem;
    height: 0.625rem;
    background: var(--accent);
  }
  #page-body-v2 .cs-prose ol {
    counter-reset: v2ol;
  }
  #page-body-v2 .cs-prose ol li {
    counter-increment: v2ol;
    padding-left: 2.25rem;
    position: relative;
  }
  #page-body-v2 .cs-prose ol li:before {
    content: counter(v2ol);
    position: absolute;
    left: 0;
    top: 0.1em;
    font-family: var(--fontDisplay);
    font-weight: 600;
    color: var(--secondaryText);
  }
  #page-body-v2 .cs-prose a:not(.v2-btn) {
    color: var(--secondaryText);
    font-weight: 600;
    font-size: inherit;
  }
  #page-body-v2 .cs-prose a:not(.v2-btn):hover {
    color: var(--primary);
  }
  #page-body-v2 .cs-prose .v2-btn {
    margin-top: 2rem;
  }
  #page-body-v2 .cs-prose table {
    width: 100%;
    border-collapse: collapse;
    font-variant-numeric: tabular-nums;
  }
  #page-body-v2 .cs-prose th,
  #page-body-v2 .cs-prose td {
    text-align: left;
    padding: 0.75rem;
    border-bottom: 1px solid #DCE6EF;
    font-size: 1rem;
  }
  #page-body-v2 .cs-prose th {
    font-family: var(--fontDisplay);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--headerColor);
  }
  #page-body-v2 .cs-prose img {
    width: 100%;
    height: auto;
    display: block;
  }

  /* aside */
  #page-body-v2 .cs-aside {
    display: grid;
    gap: 1rem;
    align-content: start;
  }
  #page-body-v2 .cs-aside-photo {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
  }
  #page-body-v2 .cs-aside-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  #page-body-v2 .cs-call {
    background: var(--ink);
    padding: 1.75rem;
    display: grid;
    gap: 0.75rem;
  }
  #page-body-v2 .cs-call-label {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--secondaryLight);
  }
  #page-body-v2 .cs-call-number {
    font-family: var(--fontDisplay);
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
  }
  #page-body-v2 .cs-call-number:hover {
    color: var(--accent);
  }
  #page-body-v2 .cs-call-text {
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.9375rem;
  }
  #page-body-v2 .cs-call .v2-btn {
    margin-top: 0.5rem;
  }
  #page-body-v2 .cs-points {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid #DCE6EF;
  }
  #page-body-v2 .cs-point {
    padding: 1.25rem 1.5rem;
  }
  #page-body-v2 .cs-point + .cs-point {
    border-top: 1px solid #DCE6EF;
  }
  #page-body-v2 .cs-point-title {
    font-size: 1.25rem;
    margin: 0 0 0.375rem;
    display: flex;
    align-items: center;
    gap: 0.625rem;
  }
  #page-body-v2 .cs-point-title:before {
    content: "";
    width: 1.25rem;
    height: 1.25rem;
    flex: none;
    background: var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23082048' stroke-width='3.5'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center / 70% no-repeat;
  }
  #page-body-v2 .cs-point-text {
    font-size: 0.9375rem;
    color: var(--mutedText);
  }
}
/* Desktop - 1024px */
@media only screen and (min-width: 64rem) {
  #page-body-v2 .cs-container {
    grid-template-columns: minmax(0, 1fr) 22rem;
    gap: 5rem;
  }
  #page-body-v2 .cs-aside {
    position: sticky;
    top: calc(var(--nav-offset) + 1.5rem);
  }
}

/*-- -------------------------- -->
<---       FAQ (restyled)         -->
<--- -------------------------- -*/

@media only screen and (min-width: 0rem) {
  #faq-1263 {
    background: var(--surfaceSoft);
    padding: var(--sectionPadding);
    /* clip, not hidden: hidden makes the section a scroll container and breaks the sticky heading */
    overflow: clip;
  }
  #faq-1263 .cs-container {
    max-width: 80rem;
    display: grid;
    align-items: start;
    gap: clamp(2rem, 4vw, 3rem);
  }
  #faq-1263 .cs-content {
    text-align: left;
    align-items: flex-start;
  }
  #faq-1263 .cs-title {
    color: var(--headerColor);
    font-weight: 700;
    line-height: 1.05em;
    margin: 0;
  }
  #faq-1263 .cs-faq-note {
    margin-top: 1rem;
    color: var(--mutedText);
    font-size: 1.0625rem;
  }
  #faq-1263 .cs-faq-note a {
    color: var(--secondaryText);
    font-weight: 700;
    font-size: inherit;
    white-space: nowrap;
  }
  #faq-1263 .cs-faq-group {
    gap: 0;
    border-top: 2px solid var(--primary);
  }
  #faq-1263 .cs-faq-item {
    background: transparent;
    border-bottom: 1px solid #C8D3DE;
  }
  #faq-1263 .cs-button {
    padding: 1.375rem 3.5rem 1.375rem 0;
  }
  #faq-1263 .cs-button:before,
  #faq-1263 .cs-button:after {
    right: 0.5rem;
    width: 1rem;
    height: 0.1875rem;
    background: var(--secondaryText);
  }
  #faq-1263 .cs-button-text {
    font-family: var(--fontDisplay);
    font-size: clamp(1.1875rem, 2vw, 1.4375rem);
    font-weight: 600;
    line-height: 1.2em;
    text-transform: uppercase;
    letter-spacing: 0.01em;
  }
  #faq-1263 .cs-button:hover .cs-button-text {
    color: var(--secondaryText);
  }
  #faq-1263 .cs-item-p {
    padding: 0 3.5rem 1.5rem 0;
    font-size: 1.0625rem;
    line-height: 1.65em;
    max-width: 46rem;
  }
}
@media only screen and (min-width: 64rem) {
  #faq-1263 .cs-container {
    grid-template-columns: 22rem 1fr;
    gap: 5rem;
  }
  #faq-1263 .cs-content {
    align-self: start;
    position: sticky;
    top: calc(var(--nav-offset) + 1.5rem);
  }
}

/*-- -------------------------- -->
<---      Steps (restyled)        -->
<--- -------------------------- -*/

@media only screen and (min-width: 0rem) {
  #steps-277 {
    background: #fff;
  }
  #steps-277 .cs-title {
    font-weight: 700;
    line-height: 1.05em;
  }
  #steps-277 .cs-number {
    border-radius: var(--radius);
    background: var(--accent);
    color: var(--ink);
    font-family: var(--fontDisplay);
    font-weight: 700;
    box-shadow: none;
    animation: none;
  }
  #steps-277 .cs-number:before {
    display: none;
  }
  #steps-277 .cs-card-group:before {
    background: var(--accent);
    opacity: 0.5;
    width: 2px;
  }
  #steps-277 .cs-h3 {
    font-weight: 600;
    font-size: clamp(1.375rem, 2.4vw, 1.75rem);
  }
  #steps-277 .cs-button-solid {
    background-color: var(--accent);
    color: var(--onAccent);
    border-radius: var(--radius);
  }
}

/*-- -------------------------- -->
<---      Footer (restyled)       -->
<--- -------------------------- -*/

@media only screen and (min-width: 0rem) {
  #sb-footer-269 {
    background: var(--ink);
    box-shadow: inset 0 4px 0 var(--accent);
  }
  #sb-footer-269 .sb-header {
    font-family: var(--fontDisplay);
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--accent);
  }
  #sb-footer-269 .sb-text,
  #sb-footer-269 .sb-contact-li {
    color: rgba(255, 255, 255, 0.72);
  }
  #sb-footer-269 .sb-nav-link,
  #sb-footer-269 .sb-contact-link {
    color: rgba(255, 255, 255, 0.9);
  }
  #sb-footer-269 .sb-nav-link:hover,
  #sb-footer-269 .sb-contact-link:hover {
    color: var(--accent);
  }
  #sb-footer-269 .sb-logo {
    border-radius: var(--radius);
  }
}

/*-- -------------------------- -->
<---        Forms (shared)        -->
<--- -------------------------- -*/
/* One field language for the contact form, the instant-quote calculator,
   the booking form and the chat composer. */

@media only screen and (min-width: 0rem) {
  :root {
    --fieldBg: #F4F7FA;
    --fieldLine: #CBD6E2;
    --fieldRadius: 0.375rem;
    --fieldRing: 0 0 0 3px rgba(24, 176, 240, 0.28);
    --chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23082048' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    --tick: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2307111F' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E");
  }

  /* text fields */
  #contact-401 .sb-input,
  #pricing-1769 .cs-field select,
  #pricing-1769 .cs-field input[type="text"],
  #pricing-1769 .cs-field input[type="email"],
  #pricing-1769 .cs-field input[type="tel"],
  #pricing-1769 .cs-field input[type="number"] {
    width: 100%;
    min-height: 3.375rem;
    margin: 0;
    padding: 0 1rem;
    font-family: "Archivo", sans-serif;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.4;
    text-transform: none;
    letter-spacing: 0;
    color: var(--headerColor);
    background-color: var(--fieldBg);
    border: 1px solid var(--fieldLine);
    border-radius: var(--fieldRadius);
    box-shadow: none;
    transition: border-color 0.2s, background-color 0.2s, box-shadow 0.2s;
  }
  #contact-401 .sb-textarea {
    min-height: 9rem;
    padding: 0.875rem 1rem;
    resize: vertical;
  }
  #contact-401 select.sb-input,
  #pricing-1769 .cs-field select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 2.75rem;
    background-image: var(--chevron);
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 1.125rem;
    cursor: pointer;
  }
  #contact-401 .sb-input::placeholder,
  #pricing-1769 .cs-field input::placeholder {
    color: #6B7787;
    opacity: 1;
  }
  #contact-401 .sb-input:hover,
  #pricing-1769 .cs-field select:hover,
  #pricing-1769 .cs-field input:hover {
    border-color: #8FA3B8;
  }
  #contact-401 .sb-input:focus,
  #pricing-1769 .cs-field select:focus,
  #pricing-1769 .cs-field input:focus {
    outline: none;
    background-color: #fff;
    border-color: var(--secondaryText);
    box-shadow: var(--fieldRing);
  }
  #contact-401 .sb-input:user-invalid,
  #pricing-1769 .cs-field input:user-invalid {
    border-color: #B42318;
    box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.15);
  }

  /* labels */
  #contact-401 .sb-label,
  #pricing-1769 .cs-field {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0;
    font-family: "Archivo", sans-serif;
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
    color: var(--headerColor);
  }
  #pricing-1769 .cs-field > span {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
  }

  /* contact form layout */
  #contact-401 .sb-form {
    display: grid;
    gap: 1.25rem;
    margin-top: 2rem;
  }
  #contact-401 .sb-form .v2-btn {
    justify-self: start;
    min-width: 12rem;
  }

  /* calculator fieldsets */
  #pricing-1769 .cs-quote-form {
    display: grid;
    gap: 1.5rem;
  }
  #pricing-1769 .cs-fieldset {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
    display: grid;
    gap: 1rem;
  }
  #pricing-1769 .cs-fieldset[hidden] {
    display: none;
  }
  #pricing-1769 .cs-legend {
    padding: 0;
    margin-bottom: 1rem;
    font-family: var(--fontDisplay);
    font-size: 1.375rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--headerColor);
  }

  /* add-on checkboxes as selectable tiles */
  #pricing-1769 .cs-check-field {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    min-height: 3.375rem;
    margin: 0;
    padding: 0.75rem 1rem;
    font-family: "Archivo", sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--headerColor);
    background: #fff;
    border: 1px solid var(--fieldLine);
    border-radius: var(--fieldRadius);
    cursor: pointer;
    transition: border-color 0.2s, background-color 0.2s, box-shadow 0.2s;
  }
  #pricing-1769 .cs-check-field:hover {
    border-color: #8FA3B8;
  }
  #pricing-1769 .cs-check-field:has(input:checked) {
    background: var(--surfaceSoftAlt);
    border-color: var(--secondaryText);
  }
  #pricing-1769 .cs-check-field:has(input:focus-visible) {
    box-shadow: var(--fieldRing);
  }
  #pricing-1769 .cs-check-field input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    flex: none;
    width: 1.375rem;
    height: 1.375rem;
    margin: 0;
    border: 2px solid #8FA3B8;
    border-radius: 0.25rem;
    background: #fff center / 75% no-repeat;
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s;
  }
  #pricing-1769 .cs-check-field input[type="checkbox"]:checked {
    background-color: var(--accent);
    background-image: var(--tick);
    border-color: var(--accent);
  }
  #pricing-1769 .cs-check-field input[type="checkbox"]:focus-visible {
    outline: none;
  }

  /* quote panel chrome */
  #pricing-1769 .cs-quote-panel {
    border-radius: 0;
  }
  #pricing-1769 .cs-back {
    font-family: var(--fontDisplay);
    font-size: 0.9375rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--secondaryText);
    background: none;
    border: 0;
    padding: 0.5rem 0;
    cursor: pointer;
  }
  #pricing-1769 .cs-back:hover {
    color: var(--primary);
  }
  #pricing-1769 .cs-quote-summary {
    background: var(--ink);
    border-radius: 0;
    padding: clamp(1.5rem, 3vw, 2rem);
  }
  #pricing-1769 .cs-summary-label {
    color: var(--secondaryLight);
  }
  #pricing-1769 .cs-summary-price,
  #pricing-1769 .cs-summary-price span {
    color: #fff;
    font-family: var(--fontDisplay);
  }
  #pricing-1769 .cs-summary-note,
  #pricing-1769 .cs-summary-note strong,
  #pricing-1769 .cs-breakdown li {
    color: rgba(255, 255, 255, 0.82);
  }
  #pricing-1769 .cs-breakdown li {
    border-color: var(--lineOnDark);
  }

  /* booking form */
  #pricing-1769 .cs-book-form {
    border-top: 1px solid #DCE6EF;
    padding-top: 2rem;
  }
  #pricing-1769 .cs-book-title {
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
  }
  #pricing-1769 .cs-book-grid {
    gap: 1.25rem;
  }

  /* chat composer */
  .sb-chat-composer textarea,
  .sb-chat-composer input {
    font-family: "Archivo", sans-serif;
    font-size: 1rem;
    background: var(--fieldBg);
    border: 1px solid var(--fieldLine);
    border-radius: var(--fieldRadius);
    transition: border-color 0.2s, box-shadow 0.2s, background-color 0.2s;
  }
  .sb-chat-composer textarea:focus,
  .sb-chat-composer input:focus {
    outline: none;
    background: #fff;
    border-color: var(--secondaryText);
    box-shadow: var(--fieldRing);
  }
}

/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #contact-401 .sb-form {
    grid-template-columns: 1fr 1fr;
    column-gap: 1rem;
  }
  #contact-401 .sb-form .sb-label:nth-of-type(n + 5),
  #contact-401 .sb-form .v2-btn {
    grid-column: 1 / -1;
  }
}

/* detector clean-ups: no stripe accents, no glow rings */
@media only screen and (min-width: 0rem) {
  #sb-footer-269 {
    box-shadow: none;
  }
  .sb-textus-status {
    box-shadow: none;
  }
  .sb-audience h2,
  .sb-quick h2,
  .sb-toc h2 {
    font-family: var(--fontDisplay);
    font-size: 1.375rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    line-height: 1.15;
  }
}

/*-- -------------------------- -->
<---   Mobile header (< 768px)    -->
<--- -------------------------- -*/
/* The phone number and 24/7 line live in the fixed bottom call bar on
   phones, so the top utility bar is removed there. */
@media only screen and (max-width: 47.9375rem) {
  :root {
    --nav-offset: 5.5rem;
  }
  #cs-navigation .cs-top-bar {
    display: none;
  }
}

/*-- -------------------------- -->
<---      Review fix batch        -->
<--- -------------------------- -*/

@media only screen and (min-width: 0rem) {
  /* header icons: CodeStitch green -> brand navy */
  #cs-navigation .cs-link-icon,
  #cs-navigation .cs-drop-icon {
    filter: brightness(0) saturate(100%) invert(10%) sepia(60%) saturate(2600%) hue-rotate(205deg) brightness(92%);
  }
  /* white working sections */
  #faq-1263,
  #pain-v2 {
    background: #fff;
  }
  #pain-v2 .cs-item {
    border: 1px solid #DCE6EF;
    border-top: 4px solid #C8D3DE;
  }
  /* dispatch-board numerals */
  .cs-phone-number,
  .cs-call-number,
  .cs-summary-price,
  .cs-breakdown,
  .cs-stat-num,
  .cs-number {
    font-variant-numeric: tabular-nums;
  }
  /* pricing: line icons + navy-graded photo ground */
  #pricing-1769 .cs-line-icon {
    width: 3.25rem;
    height: 3.25rem;
    color: var(--secondaryText);
  }
  #pricing-1769 .cs-popular .cs-line-icon {
    color: var(--accent);
  }
  #pricing-1769 .cs-background:before,
  #pricing-1769 .cs-background:after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(7, 17, 31, 0.92) 0%, rgba(8, 32, 72, 0.88) 100%);
    opacity: 1;
  }
  #pricing-1769 .cs-background img {
    filter: none;
    opacity: 1;
  }
}

/* phones: chat docks into the bottom bar instead of floating over copy */
@media only screen and (max-width: 47.9375rem) {
  .v2-callbar {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .v2-callbar .v2-callbar-chat {
    background: var(--primary);
    color: #fff;
    border: 0;
    font: inherit;
    font-family: var(--fontDisplay);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
  }
  .v2-callbar .v2-callbar-chat + a {
    background: var(--accent);
    color: var(--onAccent);
  }
  body.v2-has-callbar .sb-textus-btn {
    display: none;
  }
  body.v2-has-callbar .sb-textus {
    bottom: 4.25rem;
  }
}

/*-- -------------------------- -->
<---     Early-bird promo card    -->
<--- -------------------------- -*/

@media only screen and (min-width: 0rem) {
  .v2-promo {
    position: fixed;
    left: 0.75rem;
    right: 0.75rem;
    bottom: 4.25rem;
    z-index: 11500;
    padding: 1.25rem 1.25rem 1.25rem;
    background: var(--ink);
    border: 1px solid var(--lineOnDark);
    border-radius: var(--radius);
    box-shadow: 0 1rem 2.5rem rgba(0, 0, 0, 0.35);
    display: grid;
    gap: 0.375rem;
    opacity: 0;
    transform: translateY(1rem);
    pointer-events: none;
    visibility: hidden;
    transition: opacity 0.4s ease, transform 0.4s ease, visibility 0s linear 0.4s;
  }
  .v2-promo.v2-promo-in {
    opacity: 1;
    transform: none;
    pointer-events: auto;
    visibility: visible;
    transition: opacity 0.4s ease, transform 0.4s ease, visibility 0s;
  }
  .v2-promo-title {
    font-family: var(--fontDisplay);
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.1;
    text-transform: uppercase;
    color: var(--accent);
    padding-right: 2rem;
  }
  .v2-promo-text {
    font-size: 0.9375rem;
    color: rgba(255, 255, 255, 0.82);
    margin-bottom: 0.5rem;
  }
  .v2-promo-text strong {
    color: #fff;
  }
  .v2-promo .v2-btn {
    min-height: 2.875rem;
    justify-self: start;
  }
  .v2-promo-close {
    position: absolute;
    top: 0.625rem;
    right: 0.625rem;
    width: 2.25rem;
    height: 2.25rem;
    padding: 0.5rem;
    border: 0;
    border-radius: var(--radius);
    background: transparent;
    color: rgba(255, 255, 255, 0.7);
    cursor: pointer;
  }
  .v2-promo-close:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
  }
  .v2-promo-close svg {
    width: 100%;
    height: 100%;
    display: block;
  }
  /* highlight the offer line on pricing cards */
  #pricing-1769 .cs-promo-li strong {
    color: var(--secondaryText);
  }
  #pricing-1769 .cs-popular .cs-promo-li strong {
    color: var(--accent);
  }
}
@media only screen and (min-width: 48rem) {
  .v2-promo {
    left: 1rem;
    right: auto;
    bottom: 1rem;
    width: 21rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .v2-promo,
  .v2-promo.v2-promo-in {
    transition: none;
    transform: none;
  }
}
