/* Benefits section color refinements. Kept outside the generated Framer bundle
   so the mirror remains maintainable and the rules survive client hydration. */
.framer-1gatr7d .framer-1yox2n,
.framer-1gatr7d .framer-1yox2n p {
  --framer-text-color: #fff !important;
  color: #fff !important;
}

.framer-1gatr7d .framer-1p1iwg5-container a {
  --border-color: #fff !important;
  border-color: #fff !important;
  background-color: #fff !important;
}

.framer-1gatr7d .framer-1p1iwg5-container .framer-85vqeb,
.framer-1gatr7d .framer-1p1iwg5-container .framer-19v5f6n,
.framer-1gatr7d .framer-1p1iwg5-container p {
  --extracted-r6o4lv: #000 !important;
  --framer-text-color: #000 !important;
  color: #000 !important;
}

.framer-1gatr7d .framer-1ujsorc-container a {
  --border-color: #fff !important;
  border-color: #fff !important;
  background-color: transparent !important;
}

.framer-1gatr7d .framer-1ujsorc-container .framer-85vqeb,
.framer-1gatr7d .framer-1ujsorc-container .framer-19v5f6n,
.framer-1gatr7d .framer-1ujsorc-container p {
  --extracted-r6o4lv: #fff !important;
  --framer-text-color: #fff !important;
  color: #fff !important;
}

.framer-GHHwH .framer-LKhC6 .framer-6xdjb7 {
  background-color: #fff !important;
  color: #000 !important;
}

.framer-GHHwH .framer-LKhC6 .framer-6xdjb7 svg {
  color: #000 !important;
}

.framer-GHHwH .framer-LKhC6 .framer-6xdjb7 svg [stroke] {
  stroke: #000 !important;
}

/* Builder AI square: retain the original card geometry and surface while
   replacing the old currency illustration with a simple top/bottom layout. */
.framer-GHHwH .framer-1vk2j27 {
  align-content: flex-start !important;
  align-items: flex-start !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

.framer-GHHwH .framer-1vk2j27 > .framer-120bs9z {
  display: none !important;
}

.framer-GHHwH .framer-1vk2j27 .bs-builder-ai-description {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 430px;
  margin: 0;
  color: #fff;
  font-family: "Inter", "Inter Placeholder", sans-serif;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.45;
  text-wrap: pretty;
}

.framer-GHHwH .framer-1vk2j27 .bs-builder-ai-orb {
  position: absolute;
  z-index: 1;
  top: 48px;
  right: 166px;
  left: auto;
  width: 176px;
  height: 176px;
  pointer-events: none;
  transform: none;
}

.framer-GHHwH .framer-1vk2j27 .bs-builder-ai-orb svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.bai-orb-layer {
  transform-origin: 256px 256px;
}

.bai-orb-glow {
  animation: bai-orb-glow-pulse 2.4s ease-in-out infinite;
}

.bai-orb-layer-ambient {
  animation:
    bai-orb-spin-cw 7s linear infinite,
    bai-orb-pulse 2s ease-in-out infinite;
}

.bai-orb-layer-orange {
  animation: bai-orb-spin-cw 4.5s linear infinite;
}

.bai-orb-layer-magenta {
  animation: bai-orb-spin-ccw 6s linear infinite;
}

.bai-orb-layer-gold {
  animation: bai-orb-spin-ccw 3.5s linear infinite;
}

.bai-orb-layer-hot {
  animation: bai-orb-spin-cw 2.5s linear infinite;
}

.bai-orb-layer-fine {
  animation: bai-orb-spin-ccw 4s linear infinite;
}

@keyframes bai-orb-glow-pulse {
  0%,
  100% {
    filter: drop-shadow(0 0 4px rgba(255, 122, 0, 0.45));
  }

  50% {
    filter: drop-shadow(0 0 10px rgba(255, 122, 0, 0.85))
      drop-shadow(0 0 4px rgba(214, 51, 184, 0.5));
  }
}

@keyframes bai-orb-spin-cw {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

@keyframes bai-orb-spin-ccw {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(-360deg);
  }
}

@keyframes bai-orb-pulse {
  0%,
  100% {
    opacity: 0.5;
  }

  50% {
    opacity: 1;
  }
}

@media (max-width: 809.98px) {
  /* Mobile hero: tighten the intentionally split display title and keep the
     single primary action. */
  .framer-GHHwH .framer-9kzwhx h1,
  .framer-GHHwH .framer-9kzwhx h1 span {
    --framer-line-height: 0.9em !important;
    line-height: 0.9em !important;
  }

  .framer-GHHwH .framer-gk4hcn .framer-1grv0uk-container {
    display: none !important;
  }

  /* About card: retain its inset while switching the copy and CTA from the
     template's centered mobile treatment to normal left alignment. */
  .framer-GHHwH .framer-1lbc9fw {
    align-items: flex-start !important;
  }

  .framer-GHHwH .framer-187t72p,
  .framer-GHHwH .framer-187t72p h4 {
    text-align: left !important;
    --framer-text-alignment: left !important;
  }

  .framer-GHHwH .framer-9temuz-container {
    align-self: flex-start !important;
  }

  .framer-GHHwH .framer-1ikga3l h6 {
    --framer-font-size: 16px !important;
    font-size: 16px !important;
    --framer-line-height: 1.35em !important;
    line-height: 1.35em !important;
  }

  .framer-GHHwH .framer-1hz5rno {
    height: 650px !important;
  }

  /* Builder AI card: slightly shorter on phones, with the orb placed after
     the title instead of over it. */
  .framer-GHHwH .framer-1vk2j27 {
    height: 460px !important;
  }

  .framer-GHHwH .framer-1vk2j27 .bs-builder-ai-orb {
    right: 10px;
    width: 148px;
    height: 148px;
  }

  .framer-GHHwH .framer-1vk2j27 .bs-builder-ai-description {
    font-size: 16px;
    line-height: 1.5;
  }

  /* Process cards: the replacement copy is longer than the template text.
     Give titles more horizontal room and let every description fit fully. */
  .framer-GHHwH .framer-8b08tn {
    height: auto !important;
  }

  .framer-GHHwH .framer-8b08tn .framer-q5yyj7 {
    gap: 16px !important;
  }

  .framer-GHHwH .framer-8b08tn .framer-1ltvwgl {
    width: 48px !important;
  }

  .framer-GHHwH .framer-8b08tn .framer-1ltvwgl h3 {
    --framer-font-size: 42px !important;
    font-size: 42px !important;
    --framer-line-height: 0.95em !important;
    line-height: 0.95em !important;
  }

  .framer-GHHwH .framer-8b08tn .framer-162rit4 h5 {
    --framer-font-size: 27px !important;
    font-size: 27px !important;
    --framer-line-height: 1.12em !important;
    line-height: 1.12em !important;
  }

  .framer-GHHwH .framer-8b08tn .framer-cJQnt,
  .framer-GHHwH .framer-8b08tn .framer-13oi2uy-container,
  .framer-GHHwH .framer-8b08tn .framer-6t3jtw-container,
  .framer-GHHwH .framer-8b08tn .framer-6m69kg-container,
  .framer-GHHwH .framer-8b08tn .framer-13gbka5-container,
  .framer-GHHwH .framer-8b08tn .framer-1m3nbs5-container,
  .framer-GHHwH .framer-8b08tn .framer-1m3nbs5-container > section,
  .framer-GHHwH .framer-8b08tn .framer-1m3nbs5-container > section > div {
    height: 470px !important;
  }

  .framer-GHHwH .framer-8b08tn .framer-2fy2eb {
    height: 530px !important;
  }

  /* Benefits already communicates its actions elsewhere on the mobile page. */
  .framer-GHHwH #benefits .framer-1h1esvm {
    display: none !important;
  }
}

@media (max-width: 359.98px) {
  .framer-GHHwH .framer-1hz5rno {
    height: 680px !important;
  }

  /* Extra vertical room for the same complete copy on very narrow phones. */
  .framer-GHHwH .framer-8b08tn .framer-cJQnt,
  .framer-GHHwH .framer-8b08tn .framer-13oi2uy-container,
  .framer-GHHwH .framer-8b08tn .framer-6t3jtw-container,
  .framer-GHHwH .framer-8b08tn .framer-6m69kg-container,
  .framer-GHHwH .framer-8b08tn .framer-13gbka5-container,
  .framer-GHHwH .framer-8b08tn .framer-1m3nbs5-container,
  .framer-GHHwH .framer-8b08tn .framer-1m3nbs5-container > section,
  .framer-GHHwH .framer-8b08tn .framer-1m3nbs5-container > section > div {
    height: 510px !important;
  }

  .framer-GHHwH .framer-8b08tn .framer-2fy2eb {
    height: 570px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bai-orb-layer,
  .bai-orb-glow {
    animation: none !important;
  }
}

/* Process & Info panel: mirror the Pro pricing card's orange treatment so
   its accent originates at the bottom-right instead of the bottom-left. */
.framer-GHHwH .framer-8b08tn {
  background: radial-gradient(
    100% 50% at 100% 100%,
    var(
        --token-208b04aa-c858-4af0-b026-21281badcb8a,
        rgb(255, 92, 0)
      )
      0%,
    rgb(0, 0, 0) 100%
  ) !important;
  box-shadow:
    0 0.4829012286px 2.4145061431px -1.125px rgba(255, 92, 0, 0.46207),
    0 4px 20px -2.25px rgba(255, 92, 0, 0.55) !important;
}

/* Suite Features accordion: white closed-state + controls, with hover feedback
   reserved for the + control instead of also recoloring the leading icon. */
.framer-13f5ywo
  .framer-XqwIQ.framer-v-fzpdtk:not(.hover)
  .framer-1y8bdfo {
  --border-color: #fff !important;
  background-color: var(
    --token-f0794ba6-6d3f-4f06-b3fa-5d79eb2188ea,
    rgb(36, 36, 36)
  ) !important;
}

.framer-13f5ywo
  .framer-XqwIQ.framer-v-fzpdtk:not(.hover)
  .framer-abnil1-container
  svg {
  color: #fff !important;
}

.framer-13f5ywo
  .framer-XqwIQ.framer-v-fzpdtk:not(.hover)
  .framer-abnil1-container
  svg
  [stroke] {
  stroke: #fff !important;
}

/* All nine Suite Features + glyphs stay white in every interaction state. */
.framer-13f5ywo .framer-XqwIQ .framer-abnil1-container svg,
.framer-13f5ywo .framer-XqwIQ .framer-1ll3lzs-container svg {
  color: #fff !important;
}

.framer-13f5ywo .framer-XqwIQ .framer-abnil1-container svg [stroke],
.framer-13f5ywo .framer-XqwIQ .framer-1ll3lzs-container svg [stroke] {
  stroke: #fff !important;
}

.framer-13f5ywo
  .framer-XqwIQ.framer-v-fzpdtk.hover
  .framer-1i5qovo {
  background-color: var(
    --token-208b04aa-c858-4af0-b026-21281badcb8a,
    rgb(255, 107, 61)
  ) !important;
}

.framer-13f5ywo
  .framer-XqwIQ.framer-v-fzpdtk.hover
  .framer-1ll3lzs-container
  svg {
  color: #fff !important;
}

.framer-13f5ywo
  .framer-XqwIQ.framer-v-fzpdtk.hover
  .framer-1ll3lzs-container
  svg
  [stroke] {
  stroke: #fff !important;
}

/* Suite Modules: keep the original pill component, but place all 18 entries
   in true row order across the same three-column desktop footprint. */
#features .framer-9x63fi.bs-module-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 10px !important;
}

#features .bs-module-grid > .bs-module-pill-container {
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  position: relative;
}

#features .bs-module-pill {
  height: auto !important;
  max-height: 77px;
  width: 100% !important;
  transition:
    max-height 380ms cubic-bezier(0.22, 1, 0.36, 1),
    background-color 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

#features .bs-module-pill.bs-module-pill-custom {
  background-color: transparent !important;
  box-shadow: inset 0 0 0 2px rgb(36, 36, 36) !important;
}

#features .bs-module-pill .framer-fkwsyc {
  transition: opacity 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

#features .bs-module-pill .framer-1y8bdfo {
  transition:
    background-color 220ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

#features .bs-module-pill .framer-abnil1-container {
  transform-origin: center;
  transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

#features .bs-module-pill.bs-module-open .framer-fkwsyc {
  height: min-content !important;
  padding: 0 32px 10px 73px !important;
  opacity: 1 !important;
}

#features .bs-module-pill.bs-module-open {
  height: auto !important;
  max-height: var(--bs-module-open-height, 260px);
}

#features .bs-module-pill.bs-module-open .framer-abnil1-container {
  transform: rotate(45deg) !important;
}

#features .bs-module-pill.bs-module-measuring {
  max-height: none !important;
  transition: none !important;
}

#features .bs-module-pill.bs-module-measuring .framer-fkwsyc {
  height: min-content !important;
  padding: 0 32px 10px 73px !important;
  opacity: 0 !important;
  transition: none !important;
}

#features .bs-module-pill:hover .framer-1y8bdfo {
  --border-color: var(
    --token-208b04aa-c858-4af0-b026-21281badcb8a,
    rgb(255, 107, 61)
  ) !important;
  background-color: var(
    --token-208b04aa-c858-4af0-b026-21281badcb8a,
    rgb(255, 107, 61)
  ) !important;
  transform: scale(1.06);
}

@media (max-width: 1199.98px) {
  #features .framer-9x63fi.bs-module-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #features
    .framer-9x63fi.bs-module-grid:not(.bs-modules-expanded)
    > .bs-module-pill-container:nth-child(n + 7) {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #features .bs-module-pill,
  #features .bs-module-pill .framer-fkwsyc,
  #features .bs-module-pill .framer-1y8bdfo,
  #features .bs-module-pill .framer-abnil1-container {
    transition: none !important;
  }
}

/* All in One Place module cards. */
.framer-GHHwH #services #service-4 {
  display: none !important;
}

.framer-GHHwH #services :is(#service-1, #service-2, #service-3) {
  transform: none !important;
}

.framer-GHHwH
  #services
  :is(#service-1, #service-2, #service-3)
  .framer-71kn9z {
  flex-direction: column !important;
  flex-wrap: nowrap !important;
}

.framer-GHHwH #services .bs-portal-card-inner {
  transform-origin: center center;
  transition: none !important;
  will-change: transform;
}

.framer-1ozbx30 .framer-JN2sV .framer-5dsinn,
.framer-1ozbx30 .framer-JN2sV .framer-1p517h8,
.framer-1ozbx30 .framer-JN2sV .framer-13txvca {
  --border-color: #fff !important;
}

.framer-1ozbx30
  .framer-JN2sV
  a[data-framer-name="Secondary"] {
  --border-color: #fff !important;
  border-color: #fff !important;
  background-color: #fff !important;
}

.framer-1ozbx30
  .framer-JN2sV
  a[data-framer-name="Secondary"]
  .framer-85vqeb,
.framer-1ozbx30
  .framer-JN2sV
  a[data-framer-name="Secondary"]
  .framer-19v5f6n,
.framer-1ozbx30
  .framer-JN2sV
  a[data-framer-name="Secondary"]
  p {
  --extracted-r6o4lv: #000 !important;
  --framer-text-color: #000 !important;
  color: #000 !important;
}

/* Trusted users statistic immediately following the module cards. */
.framer-GHHwH
  .framer-19dlvab
  > [data-framer-background-image-wrapper="true"]
  > img[src*="Builder_suite_tablet_chantier.webp"] {
  -webkit-mask-image:
    linear-gradient(
      to right,
      transparent 0%,
      #000 18%,
      #000 82%,
      transparent 100%
    ),
    linear-gradient(
      to bottom,
      #000 0%,
      #000 58%,
      rgba(0, 0, 0, 0.72) 70%,
      rgba(0, 0, 0, 0.28) 82%,
      transparent 92%
    );
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(
      to right,
      transparent 0%,
      #000 18%,
      #000 82%,
      transparent 100%
    ),
    linear-gradient(
      to bottom,
      #000 0%,
      #000 58%,
      rgba(0, 0, 0, 0.72) 70%,
      rgba(0, 0, 0, 0.28) 82%,
      transparent 92%
    );
  mask-composite: intersect;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  clip-path: inset(12% 0 0 0);
}

.framer-19dlvab .framer-1e7bcju,
.framer-19dlvab .framer-1e7bcju span,
.framer-19dlvab .framer-1e7bcju h6,
.framer-19dlvab .framer-1e7bcju p {
  --framer-text-color: #fff !important;
  color: #fff !important;
}

/* Why Builder Suite Explore CTA. */
.framer-dd88vw .framer-1tqdj58-container {
  display: none !important;
}

.framer-dd88vw .framer-q43si6 .framer-5vsljj {
  display: none !important;
}

.framer-dd88vw
  :is(.framer-gku551, .framer-5fxakq, .framer-ssmh5j) {
  justify-content: center !important;
  gap: 48px !important;
}

.framer-dd88vw .bs-portal-count-label {
  position: relative;
  top: 6px;
  display: inline-block;
  font-size: 30px;
  font-weight: 400;
  line-height: 1.3;
  vertical-align: top;
}

.framer-dd88vw
  .framer-1p7bkdi-container
  > :not(.bs-why-portal-marquee) {
  display: none !important;
}

.framer-dd88vw .bs-why-portal-marquee {
  position: absolute;
  inset: 0;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    #000 8%,
    #000 92%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    transparent 0%,
    #000 8%,
    #000 92%,
    transparent 100%
  );
}

.framer-dd88vw .bs-why-portal-track,
.framer-dd88vw .bs-why-portal-group {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
}

.framer-dd88vw .bs-why-portal-track {
  width: max-content;
  height: 68px;
  will-change: transform;
  animation: bs-why-portal-marquee 26s linear infinite;
}

.framer-dd88vw .bs-why-portal-group {
  flex: none;
  gap: 10px;
  padding-right: 10px;
}

.framer-dd88vw .bs-why-portal-pill {
  display: flex;
  flex: none;
  align-items: center;
  gap: 12px;
  height: 68px;
  padding: 10px 20px 10px 10px;
  border-radius: 40px;
  background: var(--token-f0794ba6-6d3f-4f06-b3fa-5d79eb2188ea, #242424);
  color: #fff;
  font-family: "Inter", "Inter Placeholder", sans-serif;
  font-size: 16px;
  line-height: 1.4;
}

.framer-dd88vw .bs-why-portal-pill strong {
  font-weight: 500;
  white-space: nowrap;
}

.framer-dd88vw .bs-why-portal-dot {
  display: block;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
}

.framer-dd88vw .bs-portal-marquee-dot-enterprise {
  background-color: #ff5c00;
}

.framer-dd88vw .bs-portal-marquee-dot-client {
  background-color: #2f80ed;
}

.framer-dd88vw .bs-portal-marquee-dot-architect {
  background-color: #8b5cf6;
}

@keyframes bs-why-portal-marquee {
  to {
    transform: translate3d(-50%, 0, 0);
  }
}

.framer-dd88vw
  :is(
    .framer-bgsv8n-container,
    .framer-1mzfbww-container,
    .framer-hd2li9-container
  )
  .framer-MWk0L {
  padding-right: 34px !important;
}

.framer-dd88vw
  :is(
    .framer-bgsv8n-container,
    .framer-1mzfbww-container,
    .framer-hd2li9-container
  )
  .framer-1c39roq
  p {
  font-size: 18px !important;
  line-height: 1.35 !important;
}

.framer-dd88vw .bs-white-label-check {
  position: absolute;
  top: 50%;
  right: 0;
  display: grid;
  width: 24px;
  height: 24px;
  margin-top: -12px;
  place-items: center;
  border: 1px solid rgba(34, 197, 94, 0.68);
  border-radius: 50%;
  background: rgba(34, 197, 94, 0.12);
  color: #22c55e;
  pointer-events: none;
  animation: bs-white-label-check-pop 4.2s ease-in-out infinite;
}

.framer-dd88vw .bs-white-label-check svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.framer-dd88vw .bs-white-label-check path {
  stroke-dasharray: 16;
  stroke-dashoffset: 16;
  animation: bs-white-label-check-draw 4.2s ease-in-out infinite;
}

.framer-dd88vw .framer-1mzfbww-container .bs-white-label-check,
.framer-dd88vw .framer-1mzfbww-container .bs-white-label-check path {
  animation-delay: 180ms;
}

.framer-dd88vw .framer-hd2li9-container .bs-white-label-check,
.framer-dd88vw .framer-hd2li9-container .bs-white-label-check path {
  animation-delay: 360ms;
}

@keyframes bs-white-label-check-pop {
  0%,
  10%,
  100% {
    opacity: 0.45;
    transform: scale(0.86);
  }
  24%,
  88% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes bs-white-label-check-draw {
  0%,
  10% {
    opacity: 0;
    stroke-dashoffset: 16;
  }
  28%,
  88% {
    opacity: 1;
    stroke-dashoffset: 0;
  }
  100% {
    opacity: 0;
    stroke-dashoffset: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .framer-dd88vw .bs-why-portal-track,
  .framer-dd88vw .bs-white-label-check,
  .framer-dd88vw .bs-white-label-check path {
    animation: none !important;
  }

  .framer-dd88vw .bs-white-label-check {
    opacity: 1;
    transform: none;
  }

  .framer-dd88vw .bs-white-label-check path {
    opacity: 1;
    stroke-dashoffset: 0;
  }
}

.framer-dd88vw .framer-169f0fn-container a {
  --border-color: #fff !important;
  border-color: #fff !important;
  background-color: #fff !important;
}

.framer-dd88vw .framer-169f0fn-container .framer-85vqeb,
.framer-dd88vw .framer-169f0fn-container .framer-19v5f6n,
.framer-dd88vw .framer-169f0fn-container p {
  --extracted-r6o4lv: #000 !important;
  --framer-text-color: #000 !important;
  color: #000 !important;
}

/* AI-Powered Analytics 70% statistic. */
.framer-wpa3ph .framer-1u2tkb5,
.framer-wpa3ph .framer-1u2tkb5 span,
.framer-wpa3ph .framer-1u2tkb5 p {
  --framer-text-color: #fff !important;
  color: #fff !important;
}

/* Our Analytics Feature: white glyphs inside both glowing red circles. */
.framer-YcK7N .framer-6li1j8-container svg {
  color: #fff !important;
}

.framer-YcK7N .framer-6li1j8-container svg [stroke] {
  stroke: #fff !important;
}

/* Hydrated component fallbacks: keep every Suite Features + glyph white. */
.framer-XqwIQ .framer-abnil1-container svg {
  color: #fff !important;
}

.framer-XqwIQ .framer-abnil1-container svg [stroke] {
  stroke: #fff !important;
}

/* First two Flexible Plans CTAs retain white text in both animation layers. */
.framer-r3olmq .framer-rsac0g-container .framer-kfjhyb-container,
.framer-r3olmq .framer-rsac0g-container .framer-kfjhyb-container p,
.framer-r3olmq .framer-13giuik-container .framer-kfjhyb-container,
.framer-r3olmq .framer-13giuik-container .framer-kfjhyb-container p {
  --extracted-r6o4lv: #fff !important;
  --framer-text-color: #fff !important;
  color: #fff !important;
}

/* Builder Suite pricing rewrite: preserve Framer's cards and replace only
   the exported template comparison content beneath them. */
.framer-r3olmq .framer-zzl318 {
  display: none !important;
}

.framer-r3olmq .bs-pricing-card-featured {
  --border-bottom-width: 0px !important;
  --border-left-width: 0px !important;
  --border-right-width: 0px !important;
  --border-top-width: 0px !important;
  background: radial-gradient(100% 50% at 0% 100%, #ff5c00 0%, #000 100%) !important;
  box-shadow:
    0 0.482901px 2.41451px -1.125px rgba(255, 92, 0, 0.46),
    0 4px 20px -2.25px rgba(255, 92, 0, 0.55) !important;
}

.framer-r3olmq .bs-pricing-card-standard {
  --border-bottom-width: 1px !important;
  --border-color: rgba(255, 255, 255, 0.15) !important;
  --border-left-width: 1px !important;
  --border-right-width: 1px !important;
  --border-top-width: 1px !important;
  background: radial-gradient(100% 50% at 0% 100%, #000 0%, #000 100%) !important;
  box-shadow: none !important;
}

.framer-r3olmq .framer-K6yET .framer-1i5xr6y {
  min-height: 78px;
}

/* Annual billing keeps the existing toggle and highlights its two free months. */
.framer-r3olmq .framer-K6yET .framer-1rlapd {
  overflow: visible !important;
}

.framer-r3olmq .framer-nTZTm .framer-eyc9ct::after {
  position: absolute;
  top: calc(100% + 4px);
  right: -38px;
  display: inline-flex;
  min-height: 17px;
  align-items: center;
  padding: 2px 6px;
  border: 1px solid rgba(74, 222, 128, 0.42);
  border-radius: 999px;
  background: rgba(34, 197, 94, 0.14);
  color: #4ade80;
  content: "2 MONTHS FREE";
  font-family: "Inter", sans-serif;
  font-size: 8px;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1;
  white-space: nowrap;
}

.bs-pricing-details {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 72px;
  color: #fff;
  font-family: "Urbanist", "Urbanist Placeholder", sans-serif;
}

.bs-pricing-setup-line {
  display: flex;
  max-width: 920px;
  align-self: center;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, 0.62);
  font-size: 16px;
  line-height: 1.55;
  text-align: center;
  text-wrap: pretty;
}

.bs-pricing-setup-line p {
  margin: 0;
}

.bs-pricing-setup-line strong {
  color: #fff;
  font-weight: 600;
}

.bs-pricing-setup-line a {
  color: #ff7a2e;
  font-weight: 600;
  text-decoration: none;
}

.bs-pricing-setup-line a::after {
  margin-left: 6px;
  content: "→";
}

.bs-pricing-table-wrap {
  width: 100%;
  overflow-x: auto;
  border-radius: 24px;
  background: #070707;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.13);
  scrollbar-color: rgba(255, 92, 0, 0.65) transparent;
}

.bs-pricing-table-wrap:focus-visible {
  outline: 2px solid #ff5c00;
  outline-offset: 3px;
}

.bs-pricing-table {
  width: 100%;
  min-width: 840px;
  border-collapse: collapse;
  table-layout: fixed;
}

.bs-pricing-table th,
.bs-pricing-table td {
  padding: 18px 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  font-size: 15px;
  font-weight: 450;
  line-height: 1.4;
  text-align: center;
  vertical-align: middle;
}

.bs-pricing-table thead th {
  padding-top: 22px;
  padding-bottom: 22px;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
}

.bs-pricing-table th:first-child {
  width: 46%;
  color: rgba(255, 255, 255, 0.88);
  text-align: left;
}

.bs-pricing-table thead th:not(:first-child) {
  width: 18%;
}

.bs-pricing-table td {
  color: rgba(255, 255, 255, 0.72);
}

.bs-pricing-table tbody tr:last-child > * {
  border-bottom: 0;
}

.bs-pricing-table .bs-pricing-group-row th {
  padding-top: 26px;
  padding-bottom: 14px;
  border-bottom-color: rgba(255, 92, 0, 0.22);
  background: rgba(255, 255, 255, 0.035);
  color: #fff;
  font-size: 17px;
  font-weight: 600;
}

.bs-pricing-group-icon {
  display: inline-grid;
  width: 28px;
  height: 28px;
  margin-right: 10px;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 92, 0, 0.14);
  color: #ff7a2e;
  vertical-align: middle;
}

.bs-pricing-group-icon svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.bs-pricing-check {
  color: #fff;
  font-weight: 700;
}

.bs-pricing-cross {
  color: rgba(255, 255, 255, 0.35);
  font-weight: 650;
}

.bs-pricing-table .bs-pricing-addon {
  color: #ff7a2e;
  font-weight: 650;
}

.bs-pricing-ai-explainer {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.bs-pricing-ai-explainer article {
  min-height: 190px;
  padding: 30px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.045);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.bs-pricing-ai-explainer h4,
.bs-pricing-implementation-card h4 {
  margin: 0;
  color: #fff;
  font-size: 22px;
  font-weight: 550;
  line-height: 1.25;
  text-wrap: balance;
}

.bs-pricing-ai-explainer article p,
.bs-pricing-implementation-card p {
  margin: 16px 0 0;
  color: rgba(255, 255, 255, 0.62);
  font-size: 15px;
  line-height: 1.6;
  text-wrap: pretty;
}

.bs-pricing-ai-explainer .bs-pricing-ai-plus {
  background: radial-gradient(100% 110% at 0% 100%, rgba(122, 31, 0, 0.72), #080808 72%);
}

.bs-pricing-fair-use {
  grid-column: 1 / -1;
  max-width: 760px;
  margin: 2px auto 0;
  color: rgba(255, 255, 255, 0.48);
  font-size: 13px;
  line-height: 1.55;
  text-align: center;
}

.bs-pricing-implementation {
  display: flex;
  flex-direction: column;
  gap: 28px;
  scroll-margin-top: 120px;
}

.bs-pricing-implementation-heading {
  display: flex;
  flex-direction: column;
  gap: 10px;
  text-align: center;
}

/* Matches "Flexible Plans" above it exactly (same section, same weight of
   importance) rather than reading as a smaller sub-header. */
.bs-pricing-implementation-heading h3 {
  margin: 0;
  color: #fff;
  font-size: 70px;
  font-weight: 600;
  letter-spacing: -2.1px;
  line-height: 84px;
}

.bs-pricing-implementation-heading p {
  margin: 0;
  color: rgba(255, 255, 255, 0.58);
  font-size: 16px;
  line-height: 1.5;
}

.bs-pricing-implementation-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.bs-pricing-implementation-card {
  position: relative;
  display: flex;
  min-height: 330px;
  flex-direction: column;
  padding: 34px 30px;
  overflow: hidden;
  border-radius: 24px;
  background: #050505;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);
}

.bs-pricing-implementation-card > strong {
  display: block;
  margin-top: 34px;
  color: #fff;
  font-size: 34px;
  font-weight: 500;
  line-height: 1.1;
}

.bs-pricing-implementation-card.is-featured {
  background: radial-gradient(100% 70% at 0% 100%, #ff5c00 0%, #000 100%);
  box-shadow:
    0 0.482901px 2.41451px -1.125px rgba(255, 92, 0, 0.46),
    0 4px 20px -2.25px rgba(255, 92, 0, 0.55);
}

.bs-pricing-popular {
  position: absolute;
  top: 24px;
  right: 24px;
  padding: 5px 9px;
  border-radius: 999px;
  background: #ff7a2e;
  color: #fff;
  font-size: 8px;
  font-weight: 700;
  line-height: 1.4;
}

@media (max-width: 809.98px) {
  .framer-r3olmq .framer-K6yET .framer-1i5xr6y {
    min-height: 0;
  }

  .bs-pricing-details {
    gap: 56px;
  }

  .bs-pricing-setup-line {
    font-size: 15px;
  }

  .bs-pricing-table-wrap {
    border-radius: 18px;
  }

  .bs-pricing-table th,
  .bs-pricing-table td {
    padding: 16px;
    font-size: 14px;
  }

  .bs-pricing-ai-explainer,
  .bs-pricing-implementation-grid {
    grid-template-columns: 1fr;
  }

  .bs-pricing-ai-explainer article {
    min-height: 0;
    padding: 24px;
    border-radius: 18px;
  }

  .bs-pricing-implementation-heading h3 {
    font-size: 45px;
    letter-spacing: -1.35px;
    line-height: 54px;
  }

  .bs-pricing-implementation-card {
    min-height: 0;
    padding: 28px 24px;
    border-radius: 18px;
  }

  .bs-pricing-implementation-card > strong {
    margin-top: 28px;
    font-size: 30px;
  }
}

/* Community CTA: retain its background while using a white border and label. */
.framer-YNajA .framer-10znhlp-container a {
  --border-color: #fff !important;
  border-color: #fff !important;
}

.framer-YNajA .framer-10znhlp-container .framer-85vqeb,
.framer-YNajA .framer-10znhlp-container .framer-19v5f6n,
.framer-YNajA .framer-10znhlp-container p {
  --extracted-r6o4lv: #fff !important;
  --framer-text-color: #fff !important;
  color: #fff !important;
}

/* Keep one social row: LinkedIn, Instagram, and TikTok. */
.framer-YNajA .framer-1bxplxo {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(1, min-content) !important;
  height: auto !important;
}

.framer-YNajA .framer-1bwuqik-container {
  order: 1;
}

.framer-YNajA .framer-1e3nau-container {
  order: 2;
}

.framer-YNajA .framer-16d8rl5-container {
  order: 3;
}

.framer-YNajA .framer-1sau9jc-container,
.framer-YNajA .framer-1ju5q26-container,
.framer-YNajA .framer-nl9230-container {
  display: none !important;
}

/* Preserve the large footer type while stacking the two words. */
.framer-YNajA .framer-19hbdlp h1 > span {
  display: block;
}

/* Match only the footer wordmark weight to the Builder Suite hero heading. */
.framer-YNajA .framer-19hbdlp h1,
.framer-YNajA .framer-19hbdlp h1 span {
  font-weight: 800 !important;
  -webkit-text-stroke: 0.35px currentColor;
}

/* Header navigation labels remain white while hover/selection uses orange fill. */
.framer-miO6B .framer-1snl8nc .framer-FUS5K .framer-1dii7ih,
.framer-miO6B .framer-1snl8nc .framer-FUS5K .framer-1dii7ih p {
  --extracted-r6o4lv: #fff !important;
  --framer-text-color: #fff !important;
  color: #fff !important;
}

/* Keep the header logo stationary instead of rotating with page scroll. */
.framer-miO6B > .framer-1i4yca0-container {
  transform: none !important;
}

@media (max-width: 809.98px) {
  /* Match the desktop header material on phones instead of using an opaque
     black bar. */
  .framer-miO6B[data-framer-name="Phone"] {
    background-color: rgba(0, 0, 0, 0.4) !important;
    backdrop-filter: blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
  }

  /* The expanded menu is a full-height frosted panel within the header's
     existing 20px viewport inset. */
  .framer-miO6B.framer-v-m74flm .framer-1snl8nc {
    height: calc(100dvh - 40px) !important;
    min-height: calc(100dvh - 40px) !important;
    border-radius: 40px !important;
    background-color: rgba(0, 0, 0, 0.4) !important;
    backdrop-filter: blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body:has(.framer-miO6B.framer-v-m74flm) {
    overflow: hidden !important;
  }

  /* Mask the header outline beneath the close control, then redraw one clean
     circle so the open-state icon has no doubled stroke on its right edge. */
  .framer-miO6B.framer-v-m74flm
    .framer-95kf43-container
    .framer-L7DwY.framer-v-15la4b5 {
    border: 0 !important;
    background-color: rgba(0, 0, 0, 0.72) !important;
    box-shadow:
      0 0 0 2px rgba(0, 0, 0, 0.72),
      inset 0 0 0 1px rgb(36, 36, 36) !important;
  }
}

/* Selected CTAs use the brand-orange border on hover and keyboard/click focus. */
.framer-1grv0uk-container a:is(:hover, :focus, :active, .hover),
.framer-10znhlp-container a:is(:hover, :focus, :active, .hover) {
  --border-color: var(
    --token-ac24ef42-1c2a-43a2-993b-47ae50bcd9d8,
    rgb(255, 92, 0)
  ) !important;
  border-color: var(
    --token-ac24ef42-1c2a-43a2-993b-47ae50bcd9d8,
    rgb(255, 92, 0)
  ) !important;
}

/* Header Contact Sales border blends into the transparent header background. */
.framer-184ahf0-container a,
.framer-184ahf0-container a:is(:hover, :focus, :active, .hover) {
  --border-color: transparent !important;
  border-color: transparent !important;
}

/* Stable official TikTok mark for the repurposed social card. */
.framer-16d8rl5-container .framer-18klydg-container {
  display: grid;
  place-items: center;
}

.framer-16d8rl5-container .framer-18klydg-container svg {
  display: none !important;
}

.framer-16d8rl5-container .framer-18klydg-container::before {
  width: 32px;
  height: 32px;
  content: "";
  background: url("/images/tiktok-logo.svg") center / contain
    no-repeat;
}

/* Builder Suite SaaS titles: font-family only; preserve all layout and motion. */
.framer-GHHwH :is(h1, h2, h3, h4, h5, h6),
.framer-GHHwH :is(h1, h2, h3, h4, h5, h6) * {
  --framer-font-family: "Inter", sans-serif !important;
  font-family: "Inter", sans-serif !important;
}

/* Section headings (Building Success, More than a construction platform,
   All in One Place, Total Control, Customer Experience, Flexible Plans,
   Your Guide to Builder Suite, etc.): slightly tighter tracking and bolder
   weight. Excludes the "Builder Suite" hero h1, which stays as-is. */
.framer-GHHwH :is(h1, h2, h3, h4, h5, h6):not(.bs-hero-heading),
.framer-GHHwH :is(h1, h2, h3, h4, h5, h6):not(.bs-hero-heading) * {
  --framer-letter-spacing: -0.03em !important;
  --framer-font-weight: 600 !important;
  font-weight: 600 !important;
}

/* "What you always needed" step-benefits title: tighter leading/tracking. */
.framer-styles-preset-qsaucd:not(.rich-text-wrapper),
.framer-8F3Ln .framer-styles-preset-qsaucd.rich-text-wrapper h4 {
  --framer-line-height: 1.12em !important;
  --framer-letter-spacing: -0.01em !important;
}

/* Body-style paragraphs that happen to render as h4/h6: pull weight back down
   from the section-heading bolding above, since these read as text, not
   titles. Covers the About Us intro, the founder quote, the four module
   card titles, the three plan prices, and the eight FAQ question titles. */
.framer-187t72p :is(h1, h2, h3, h4, h5, h6).framer-text,
.framer-jw6n3m :is(h1, h2, h3, h4, h5, h6).framer-text,
.framer-o3adfo :is(h1, h2, h3, h4, h5, h6).framer-text,
.framer-hl4e7p :is(h1, h2, h3, h4, h5, h6).framer-text,
.framer-1ikga3l :is(h1, h2, h3, h4, h5, h6).framer-text,
[data-framer-name="Question"] :is(h1, h2, h3, h4, h5, h6).framer-text,
.framer-187t72p :is(h1, h2, h3, h4, h5, h6).framer-text *,
.framer-jw6n3m :is(h1, h2, h3, h4, h5, h6).framer-text *,
.framer-o3adfo :is(h1, h2, h3, h4, h5, h6).framer-text *,
.framer-hl4e7p :is(h1, h2, h3, h4, h5, h6).framer-text *,
.framer-1ikga3l :is(h1, h2, h3, h4, h5, h6).framer-text *,
[data-framer-name="Question"] :is(h1, h2, h3, h4, h5, h6).framer-text * {
  --framer-font-weight: 400 !important;
  font-weight: 400 !important;
}

/* The two added FAQ entries reuse the native accordion markup and motion. */
#help-center .bs-faq-clone-container {
  position: relative;
  width: 100% !important;
  height: auto !important;
}

#help-center .bs-faq-clone {
  width: 100% !important;
  height: auto !important;
  transition: gap 360ms cubic-bezier(0.22, 1, 0.36, 1);
}

#help-center .bs-faq-clone .framer-1ukcnxi {
  height: auto !important;
  max-height: 1px;
  padding: 0 !important;
  opacity: 0 !important;
  transition:
    max-height 380ms cubic-bezier(0.22, 1, 0.36, 1),
    opacity 220ms ease;
}

#help-center .bs-faq-clone .framer-5sejvb-container {
  transform-origin: center;
  transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

#help-center .bs-faq-clone.bs-faq-open {
  gap: 20px !important;
}

#help-center .bs-faq-clone.bs-faq-open .framer-1ukcnxi {
  max-height: var(--bs-faq-answer-height, 320px);
  opacity: 1 !important;
}

#help-center .bs-faq-clone.bs-faq-open .framer-5sejvb-container {
  transform: rotate(45deg) !important;
}

#help-center .bs-faq-clone.bs-faq-measuring .framer-1ukcnxi {
  max-height: none !important;
  opacity: 0 !important;
  transition: none !important;
}

@media (prefers-reduced-motion: reduce) {
  #help-center .bs-faq-clone,
  #help-center .bs-faq-clone .framer-1ukcnxi,
  #help-center .bs-faq-clone .framer-5sejvb-container {
    transition: none !important;
  }
}

/* "Meet your new Assistant / Builder AI" phone-chat title: at the base
   160px preset size the flying-word text overflows its line, so this was
   sized down to fit on one line -- but 140px, with no breakpoint scoping,
   also applied to mobile, where it ran far past the viewport on both
   sides ("Assistant" and "Builder AI" both clipped at the edges).
   Desktop/tablet keep 140px; mobile drops to 58px, matching the "Modules"
   and "Our Analytics" titles elsewhere on the page (same
   framer-styles-preset-1iqiuvo preset, same mobile size). */
@media (min-width: 810px) {
  #phone-chat-title h1 {
    --framer-font-size: 140px !important;
    font-size: 140px !important;
  }
}

@media (max-width: 809.98px) {
  #phone-chat-title h1 {
    --framer-font-size: 58px !important;
    font-size: 58px !important;
  }
}

/* About heading: widen its centered text area without changing its alignment. */
.framer-GHHwH .framer-1emg2jy-container .framer-81gw {
  max-width: 800px;
}

@media (min-width: 1200px) {
  .framer-GHHwH .framer-1emg2jy-container .framer-81gw {
    white-space: nowrap;
    word-break: normal;
    overflow-wrap: normal;
  }
}

/* Builder Suite hero H1: subtly fuller than its inline 800 setting without
   snapping to the significantly heavier 900 face. */
.framer-GHHwH .framer-9kzwhx h1,
.framer-GHHwH .framer-9kzwhx h1 span {
  font-weight: 800 !important;
  -webkit-text-stroke: 0.35px currentColor;
}

/* "All in One Place" stacked-card covers: replace only the image resource;
   Framer's existing wrapper, sizing, crop, radius, and card motion remain. */
.framer-GHHwH #services img[src*="WqN7va85LwgTiXP7IBx2iqyPbP4.svg"] {
  content: url("/images/builder_suite_stacked_cards/Project_Management.webp");
}

.framer-GHHwH #services img[src*="q6g4uOgpWDf4Pa7EE73PWYIHhg.svg"] {
  content: url("/images/builder_suite_stacked_cards/quality_receptions.webp");
}

.framer-GHHwH #services img[src*="7T1cNgmIzU6JQcpCWj1t0AaJDU.svg"] {
  content: url("/images/builder_suite_stacked_cards/investment_tracking.webp");
}

.framer-GHHwH #services img[src*="yYRW4X991SfqjIHUl3esjOO0Go.svg"] {
  content: url("/images/builder_suite_stacked_cards/orders_materials.webp");
}

/* "Suite Features" title: "Features" (the wider word) runs past the
   viewport edge, cutting off the last "s". Each word's SVG box is
   flex:1 0 0, so both split the row equally regardless of content width --
   shrinking font-size alone doesn't help since the box stays the same
   size. Give "Features" a smaller font size AND a narrower fixed box
   (instead of the equal flex split) so it actually shrinks on screen.
   "Suite" also gets a fixed width (instead of flex-growing to fill
   whatever "Features" doesn't use) so the gap between the two words -
   where they visually meet - lands on the section's actual center.
   Desktop only: the fixed widths are sized for the 1440px layout and
   overflow the row at tablet, which already renders this title fine.

   .framer-rqflyx = "Suite", .framer-wv7kkm = "Features" -- targeted by
   class rather than :first-of-type/:last-of-type because each svg is the
   only svg inside its own wrapper div, so both of those pseudo-classes
   match both elements. */
@media (min-width: 1200px) {
  #feature-title {
    transform: translateX(-114px);
  }

  #feature-title .framer-rqflyx {
    flex: 0 0 520px !important;
    width: 520px !important;
  }

  #feature-title .framer-wv7kkm {
    flex: 0 0 520px !important;
    width: 520px !important;
  }

  #feature-title .framer-wv7kkm h1 {
    --framer-font-size: 112.5px !important;
    font-size: 112.5px !important;
  }

  #feature-title svg.framer-wv7kkm {
    overflow: visible !important;
  }
}

/* "Builder Suite is the all-in-one platform..." intro paragraph: more
   breathing room between lines for readability on desktop, since it uses
   a heading preset's tight line-height despite being body-length copy. */
@media (min-width: 810px) {
  .framer-jw6n3m h4 {
    --framer-line-height: 1.35em !important;
    line-height: 1.35em !important;
  }
}

/* "More than a construction platform" benefit pills: pull each one a bit
   closer toward the heading at its center, desktop only. Cloud Sync and
   Real-Time Alerts only need a nudge; the rest move further since they sit
   further out. Tablet keeps its own separate, already-tighter positions. */
.framer-GHHwH
  #benefits
  .framer-iug4c6-container
  > .framer-LKhC6 {
  background: rgb(40, 40, 40) !important;
}

@media (min-width: 1200px) {
  .framer-GHHwH .framer-iug4c6-container {
    top: 170px !important;
  }

  .framer-GHHwH .framer-1enjdw9-container {
    bottom: 85px !important;
  }

  .framer-GHHwH .framer-1hun139-container {
    left: 181px !important;
  }

  .framer-GHHwH .framer-1ivx4kv-container {
    right: 180px !important;
  }

  .framer-GHHwH .framer-lidvyb-container {
    left: 178px !important;
  }

  .framer-GHHwH .framer-4vz7o3-container {
    right: 180px !important;
  }

  .framer-GHHwH .framer-enetwy-container {
    left: 81px !important;
  }

  .framer-GHHwH .framer-fhump2-container {
    right: 81px !important;
  }
}

.bs-mobile-hero-break {
  display: none;
}

@media (max-width: 809px) {
  .framer-GHHwH .framer-57sk9u {
    width: calc(100vw - 40px) !important;
  }

  .framer-GHHwH .framer-1xj6aqr {
    width: 100% !important;
    padding-inline: 0 !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  .framer-GHHwH .framer-1xj6aqr p {
    --framer-font-size: clamp(10.5px, 3.35vw, 14px) !important;
    font-size: clamp(10.5px, 3.35vw, 14px) !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  .bs-mobile-hero-break {
    display: none !important;
  }
}

/*
 * Mobile header nav: the "Contact Sales" button becomes "Try Demo" (text/href
 * swapped, and the row centered, in site-overrides.js — its own container is
 * Framer-Motion-animated and reverts CSS overrides, so centering happens on
 * the stable parent row instead). This just guarantees the flat look (no
 * fill/border) on the mirror's own mobile breakpoint (max-width: 809.98px);
 * desktop is untouched.
 */
@media (max-width: 809px) {
  .framer-184ahf0-container a {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    justify-content: center !important;
  }
}

/* Tablet hero interior only: static image plus a borderless frosted demo pill. */
.framer-GHHwH .framer-b2lftc-container {
  aspect-ratio: 1.73 !important;
  height: var(--framer-aspect-ratio-supported, 555px) !important;
}

.framer-pTlx9
  > [data-framer-background-image-wrapper="true"]
  > img {
  object-fit: fill !important;
}

.framer-9awqj2 .bs-tablet-demo-image,
.framer-9awqj2 img[src*="img_mockup_hero_buildersuite"] {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  object-fit: contain !important;
  object-position: center !important;
}

.framer-9awqj2 .bs-tablet-demo-cta {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 72px;
  padding: 20px 52px;
  border: 0;
  border-radius: 999px;
  background: var(
    --token-ac24ef42-1c2a-43a2-993b-47ae50bcd9d8,
    rgb(255, 92, 0)
  );
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  backdrop-filter: blur(22px) saturate(150%);
  color: #fff;
  font-family: "Inter", sans-serif;
  font-size: clamp(18px, 1.7vw, 22px);
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.24),
    0 10px 30px rgba(0, 0, 0, 0.28);
  transform: translate(-50%, -50%);
  transition: background-color 180ms ease;
}

html.bs-js .framer-9awqj2 .bs-tablet-demo-cta {
  opacity: 0;
  filter: blur(12px);
  pointer-events: none;
  transform: translate(-50%, -50%) scale(0.92);
}

html.bs-js
  .framer-9awqj2
  .bs-tablet-demo-cta.bs-tablet-demo-cta-visible {
  animation: bs-tablet-demo-cta-reveal 900ms cubic-bezier(0.16, 1, 0.3, 1)
    both;
  pointer-events: auto;
}

@keyframes bs-tablet-demo-cta-reveal {
  0% {
    opacity: 0;
    filter: blur(12px);
    transform: translate(-50%, -50%) scale(0.92);
  }

  100% {
    opacity: 1;
    filter: blur(0);
    transform: translate(-50%, -50%) scale(1);
  }
}

.framer-9awqj2 .bs-tablet-demo-cta::after {
  width: 19px;
  height: 19px;
  flex: none;
  content: "";
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.framer-9awqj2 .bs-tablet-demo-cta:is(:hover, :focus-visible) {
  background: rgb(255, 112, 31);
}

.framer-9awqj2 .bs-tablet-demo-cta:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  html.bs-js .framer-9awqj2 .bs-tablet-demo-cta,
  html.bs-js
    .framer-9awqj2
    .bs-tablet-demo-cta.bs-tablet-demo-cta-visible {
    opacity: 1;
    filter: none;
    animation: none;
    pointer-events: auto;
    transform: translate(-50%, -50%);
  }
}

@media (max-width: 809px) {
  .framer-9awqj2 .bs-tablet-demo-cta {
    gap: 8px;
    min-height: 50px;
    padding: 13px 28px;
    font-size: 14px;
  }

  .framer-9awqj2 .bs-tablet-demo-cta::after {
    width: 15px;
    height: 15px;
  }
}

/* Locale switcher pill, inserted by site-overrides.js next to the
   Contact Sales / Try Demo button inside each .framer-1kij7b5 nav row. */
.bs-locale-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: none;
  padding: 0 14px;
  height: 40px;
  border: 1px solid rgba(255, 92, 0, 0.55);
  border-radius: 32px;
  color: #ff5c00;
  font-family: "Inter", sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-decoration: none;
  white-space: nowrap;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.bs-locale-switch:hover {
  border-color: #ff5c00;
  background-color: rgba(255, 92, 0, 0.08);
}

.bs-locale-switch svg {
  flex: none;
}

@media (max-width: 809.98px) {
  .bs-locale-switch {
    position: absolute;
    right: 62px;
    top: 50%;
    transform: translateY(-50%);
    height: 34px;
    padding: 0 10px;
    font-size: 12px;
  }
}

/* Section order: show "Easy Client Communication" (Phone Chat, .framer-of9bix)
   between the Suite Modules pills (#features) and the portals stack
   (#services) instead of its source position after About Us. Flex `order` on
   the Main column instead of moving the nodes: the Framer bundle hydrates
   against the static DOM in source order, so reordering the HTML (or the DOM
   pre-hydration) triggers a React mismatch re-render that reverts it. Every
   scroll/appear animation reads layout positions (IntersectionObserver /
   getBoundingClientRect), which `order` already reflects at first paint.
   Only the sections that must stay BEFORE Phone Chat get order:-1; Phone
   Chat and everything after keep the default 0 and their DOM order, so any
   direct child hydration later swaps in lands in the right group untouched.
   The navbar container is position:fixed and ignores order entirely. */
main[data-framer-name="Main"] > .framer-xqx63x,
main[data-framer-name="Main"] > .framer-m9mxaa,
main[data-framer-name="Main"] > .framer-1gatr7d,
main[data-framer-name="Main"] > .framer-13f5ywo {
  order: -1;
}

/* Builder AI conversation inside the existing iPhone mockup. The Framer
   phone shell remains the original background layer; only its former chat
   children are suppressed after this isolated replacement mounts. */
.framer-1umsr.bs-ai-phone-mounted
  > :not([data-framer-background-image-wrapper="true"]):not(.bs-ai-phone) {
  display: none !important;
}

.framer-1umsr .bs-ai-phone {
  position: absolute;
  z-index: 2;
  top: 52px;
  right: 17px;
  bottom: 15px;
  left: 17px;
  display: block;
  overflow: hidden;
  border-radius: 0 0 38px 38px;
  background:
    radial-gradient(circle at 88% 4%, rgba(255, 92, 0, 0.13), transparent 28%),
    #0b0b0c;
  color: #fff;
  font-family: "Inter", "Inter Placeholder", sans-serif;
  pointer-events: none;
}

.bs-ai-phone *,
.bs-ai-phone *::before,
.bs-ai-phone *::after {
  box-sizing: border-box;
}

.bs-ai-phone-header {
  position: absolute;
  z-index: 3;
  top: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 62px;
  padding: 9px 15px 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(11, 11, 12, 0.92);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.18);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.bs-ai-phone-header-orb,
.bs-ai-phone-avatar {
  display: block;
  flex: none;
}

.bs-ai-phone-header-orb {
  width: 42px;
  height: 42px;
}

.bs-ai-phone-header-orb svg,
.bs-ai-phone-avatar svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.bs-ai-phone-heading {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.bs-ai-phone-heading strong {
  color: #fff;
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -0.025em;
  line-height: 1;
}

.bs-ai-phone-heading > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: rgba(255, 255, 255, 0.58);
  font-size: 8.5px;
  font-weight: 500;
  line-height: 1;
}

.bs-ai-phone-heading i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #79db84;
  box-shadow: 0 0 7px rgba(121, 219, 132, 0.72);
}

.bs-ai-phone-viewport {
  position: absolute;
  top: 62px;
  right: 0;
  bottom: 55px;
  left: 0;
  overflow: hidden auto;
  padding: 13px 12px 17px;
  scrollbar-width: none;
}

.bs-ai-phone-viewport::-webkit-scrollbar {
  display: none;
}

.bs-ai-phone-stream {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  justify-content: flex-end;
}

.bs-ai-message,
.bs-ai-phone-opening,
.bs-ai-suggestions,
.bs-ai-phone-card,
.bs-ai-phone-followup {
  visibility: hidden;
  max-height: 0;
  margin-top: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateY(9px) scale(0.985);
  transform-origin: bottom center;
  transition:
    max-height 520ms cubic-bezier(0.16, 1, 0.3, 1),
    margin-top 520ms cubic-bezier(0.16, 1, 0.3, 1),
    padding-top 520ms cubic-bezier(0.16, 1, 0.3, 1),
    padding-bottom 520ms cubic-bezier(0.16, 1, 0.3, 1),
    border-top-width 520ms cubic-bezier(0.16, 1, 0.3, 1),
    border-bottom-width 520ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 320ms ease,
    transform 520ms cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0s linear 520ms;
}

.bs-ai-message.is-visible,
.bs-ai-phone-opening.is-visible,
.bs-ai-suggestions.is-visible,
.bs-ai-phone-card.is-visible,
.bs-ai-phone-followup.is-visible {
  visibility: visible;
  max-height: 220px;
  margin-top: 9px;
  opacity: 1;
  transform: none;
  transition-delay: 0s;
}

/* The row clips while its height is collapsing, then releases overflow once
   open so the Builder AI orb's reflected glow has no rectangular boundary. */
.bs-ai-message.is-visible:not(.is-collapsed) {
  overflow: visible;
}

.bs-ai-message.is-collapsed,
.bs-ai-phone-opening.is-collapsed,
.bs-ai-suggestions.is-collapsed,
.bs-ai-phone-card.is-collapsed,
.bs-ai-phone-followup.is-collapsed {
  visibility: hidden;
  max-height: 0;
  margin-top: 0;
  opacity: 0;
  transform: translateY(-5px) scale(0.985);
}

.bs-ai-phone-opening {
  padding: 0 4px;
  color: rgba(255, 255, 255, 0.53);
  font-size: 10px;
  font-weight: 450;
  line-height: 1.4;
  text-wrap: pretty;
}

.bs-ai-phone-opening.is-visible:not(.is-collapsed) {
  max-height: 64px;
}

.bs-ai-message {
  display: flex;
  align-items: flex-end;
  gap: 7px;
}

.bs-ai-message-user {
  justify-content: flex-end;
  padding-left: 38px;
}

.bs-ai-phone-avatar {
  width: 28px;
  height: 28px;
  margin: 0 -3px -1px -3px;
  padding: 3px;
  overflow: visible;
}

.bs-ai-bubble {
  max-width: 242px;
  padding: 10px 11px;
  border-radius: 12px 12px 12px 4px;
  background: #f5f5f3;
  color: #181819;
  font-size: 11.2px;
  font-weight: 450;
  line-height: 1.35;
}

.bs-ai-bubble strong {
  font-weight: 700;
}

.bs-ai-message-user .bs-ai-bubble {
  border-radius: 12px 12px 4px;
  background: #ff5c00;
  color: #fff;
  box-shadow: 0 6px 18px rgba(255, 92, 0, 0.18);
}

.bs-ai-suggestions,
.bs-ai-phone-followup {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  padding-left: 24px;
}

.bs-ai-suggestions.is-visible:not(.is-collapsed) {
  max-height: 190px;
}

.bs-ai-suggestions button,
.bs-ai-phone-followup button {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 8px;
  padding: 9px 11px;
  border: 1px solid rgba(255, 115, 31, 0.28);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.045);
  color: rgba(255, 255, 255, 0.86);
  font: inherit;
  font-size: 10.5px;
  line-height: 1.2;
  text-align: left;
}

.bs-ai-suggestions button {
  position: relative;
  opacity: 0;
  transform: translateY(6px);
}

.bs-ai-suggestions.is-visible button {
  animation: bs-ai-suggestion-in 430ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.bs-ai-suggestions.is-visible button:nth-child(2) {
  animation-delay: 90ms;
}

.bs-ai-suggestions.is-visible button:nth-child(3) {
  animation-delay: 180ms;
}

.bs-ai-suggestions.is-visible button:nth-child(4) {
  animation-delay: 270ms;
}

.bs-ai-suggestions button span,
.bs-ai-phone-followup button span {
  color: #ff7a1f;
  font-size: 12px;
}

.bs-ai-suggestions button.is-tapped,
.bs-ai-phone-followup button.is-tapped {
  background: rgba(255, 92, 0, 0.13);
  box-shadow: inset 0 0 0 1px rgba(255, 128, 58, 0.12);
}

.bs-ai-suggestions button::after,
.bs-ai-phone-followup button::after {
  --bs-ai-tap-x: 50%;
  position: absolute;
  top: 50%;
  right: 21px;
  width: 17px;
  height: 17px;
  border: 1.5px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  content: "";
  opacity: 0;
  transform: translate(var(--bs-ai-tap-x), -50%) scale(0.35);
  box-shadow:
    0 0 0 3px rgba(255, 255, 255, 0.12),
    0 0 10px rgba(255, 255, 255, 0.22);
}

.bs-ai-suggestions button.is-tapped::after,
.bs-ai-phone-followup button.is-tapped::after,
.bs-ai-confirm.is-tapped::after,
.bs-ai-document-actions button.is-tapped::after,
.bs-ai-phone-mic-control.is-tapped::after {
  animation: bs-ai-recorded-tap 760ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes bs-ai-suggestion-in {
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes bs-ai-recorded-tap {
  0% {
    opacity: 0;
    transform: translate(var(--bs-ai-tap-x), -50%) scale(0.35);
  }

  18% {
    opacity: 0.92;
    transform: translate(var(--bs-ai-tap-x), -50%) scale(0.72);
  }

  48% {
    opacity: 0.72;
    transform: translate(var(--bs-ai-tap-x), -50%) scale(1);
  }

  100% {
    opacity: 0;
    transform: translate(var(--bs-ai-tap-x), -50%) scale(1.55);
  }
}

.bs-ai-message-typing.is-visible:not(.is-collapsed) {
  max-height: 52px;
}

.bs-ai-message-typing .bs-ai-bubble {
  display: flex;
  gap: 3px;
  padding: 11px 13px;
}

.bs-ai-message-typing .bs-ai-bubble i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #8b8b8b;
  animation: bs-ai-typing-dot 900ms ease-in-out infinite;
}

.bs-ai-message-typing .bs-ai-bubble i:nth-child(2) {
  animation-delay: 120ms;
}

.bs-ai-message-typing .bs-ai-bubble i:nth-child(3) {
  animation-delay: 240ms;
}

@keyframes bs-ai-typing-dot {
  0%,
  60%,
  100% {
    opacity: 0.35;
    transform: translateY(0);
  }

  30% {
    opacity: 1;
    transform: translateY(-2px);
  }
}

.bs-ai-phone-card {
  position: relative;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 11px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.055);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.bs-ai-phone-card:not(.is-visible),
.bs-ai-phone-card.is-collapsed {
  padding-top: 0;
  padding-bottom: 0;
  border-top-width: 0;
  border-bottom-width: 0;
}

.bs-ai-phone-card.is-visible:not(.is-collapsed) {
  max-height: 110px;
}

.bs-ai-phone-alert {
  border-color: rgba(255, 113, 67, 0.22);
  background: linear-gradient(120deg, rgba(255, 92, 0, 0.09), rgba(255, 255, 255, 0.045));
}

.bs-ai-card-icon {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 8px;
  background: rgba(255, 92, 0, 0.14);
  color: #ff7a1f;
}

.bs-ai-card-icon svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.bs-ai-card-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}

.bs-ai-card-copy strong {
  display: -webkit-box;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.91);
  font-size: 9.3px;
  font-weight: 600;
  line-height: 1.2;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.bs-ai-card-copy small {
  overflow: hidden;
  color: rgba(255, 255, 255, 0.46);
  font-size: 8.1px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bs-ai-phone-alert .bs-ai-card-copy strong {
  font-size: 10px;
}

.bs-ai-phone-alert .bs-ai-card-copy small {
  font-size: 8.7px;
}

.bs-ai-status-badge {
  padding: 4px 6px;
  border: 1px solid rgba(255, 105, 68, 0.26);
  border-radius: 999px;
  background: rgba(255, 86, 48, 0.12);
  color: #ff876b;
  font-size: 7.8px;
  font-weight: 650;
}

.bs-ai-phone-alert .bs-ai-status-badge {
  font-size: 8.2px;
}

.bs-ai-status-badge.is-blocking {
  background: rgba(224, 54, 54, 0.13);
  color: #ff7770;
}

.bs-ai-status-badge.is-critical {
  border-color: #d83a32;
  background: #c92f28;
  color: #fff;
}

.bs-ai-status-badge.is-important {
  border-color: rgba(255, 175, 46, 0.25);
  background: rgba(255, 158, 28, 0.11);
  color: #ffc266;
}

.bs-ai-card-icon.is-important {
  background: rgba(255, 158, 28, 0.12);
  color: #ffb23f;
}

.bs-ai-document-card {
  grid-template-columns: 28px minmax(0, 1fr);
}

.bs-ai-document-card.is-visible:not(.is-collapsed) {
  max-height: 132px;
}

.bs-ai-document-actions {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: 0.75fr 1.25fr;
  gap: 6px;
}

.bs-ai-document-actions button {
  position: relative;
  min-height: 30px;
  padding: 7px 8px;
  border-radius: 8px;
  font: inherit;
  font-size: 8.8px;
  font-weight: 650;
  transition:
    color 260ms ease,
    background-color 260ms ease,
    box-shadow 260ms ease;
}

.bs-ai-verify {
  border: 1px solid rgba(255, 92, 0, 0.5);
  background: transparent;
  color: #ff8b48;
}

.bs-ai-send-client {
  border: 0;
  background: #ff5c00;
  color: #fff;
}

.bs-ai-document-actions button::after,
.bs-ai-phone-mic-control::after {
  --bs-ai-tap-x: -50%;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 17px;
  height: 17px;
  border: 1.5px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  content: "";
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.35);
  box-shadow:
    0 0 0 3px rgba(255, 255, 255, 0.12),
    0 0 10px rgba(255, 255, 255, 0.22);
}

.bs-ai-document-actions button.is-tapped {
  background: #e95400;
  color: #fff;
}

.bs-ai-verify.is-verified::before {
  order: 2;
  margin-left: 6px;
  color: #8ce29b;
  content: "✓";
}

.bs-ai-verify.is-verified {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-color: rgba(140, 226, 155, 0.28);
  background: rgba(103, 208, 123, 0.1);
  color: #8ce29b;
}

.bs-ai-document-card.is-sent .bs-ai-verify {
  display: none;
}

.bs-ai-document-card.is-sent .bs-ai-send-client {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  grid-column: 1 / -1;
  background: rgba(103, 208, 123, 0.13);
  color: #8ce29b;
  box-shadow: inset 0 0 0 1px rgba(140, 226, 155, 0.18);
}

.bs-ai-document-card.is-sent .bs-ai-send-client::before {
  order: 2;
  margin-left: 6px;
  content: "✓";
}

.bs-ai-phone-followup.is-visible:not(.is-collapsed) {
  max-height: 54px;
}

.bs-ai-phone-followup button {
  position: relative;
  width: auto;
  background: rgba(255, 92, 0, 0.08);
}

.bs-ai-phone-action {
  grid-template-columns: 28px minmax(0, 1fr);
}

.bs-ai-confirm {
  position: relative;
  grid-column: 1 / -1;
  width: 100%;
  min-height: 30px;
  padding: 7px 9px;
  border: 0;
  border-radius: 8px;
  background: #ff5c00;
  color: #fff;
  font: inherit;
  font-size: 9.4px;
  font-weight: 650;
  transition:
    color 300ms ease,
    background-color 300ms ease,
    box-shadow 300ms ease;
}

.bs-ai-confirm::after {
  --bs-ai-tap-x: -50%;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 17px;
  height: 17px;
  border: 1.5px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  content: "";
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.35);
  box-shadow:
    0 0 0 3px rgba(255, 255, 255, 0.12),
    0 0 10px rgba(255, 255, 255, 0.22);
}

.bs-ai-confirm.is-tapped {
  background: #e95400;
}

.bs-ai-confirm.is-resolved {
  background: rgba(103, 208, 123, 0.13);
  color: #8ce29b;
  box-shadow: inset 0 0 0 1px rgba(140, 226, 155, 0.18);
}

.bs-ai-phone-input {
  position: absolute;
  z-index: 3;
  right: 10px;
  bottom: 10px;
  left: 10px;
  display: flex;
  height: 38px;
  align-items: center;
  gap: 7px;
  padding: 5px 5px 5px 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 13px;
  background: rgba(27, 27, 29, 0.96);
  box-shadow: 0 -10px 25px #0b0b0c;
  color: rgba(255, 255, 255, 0.36);
  font-size: 10px;
}

.bs-ai-phone-input-copy {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color 180ms ease;
}

.bs-ai-phone-input svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.bs-ai-phone-mic-control {
  position: relative;
  display: grid;
  width: 14px;
  height: 14px;
  flex: none;
  place-items: center;
  color: rgba(255, 255, 255, 0.45);
}

.bs-ai-phone-mic-control svg {
  width: 14px;
  height: 14px;
}

.bs-ai-phone-mic-control.is-recording {
  color: #ff7730;
  animation: bs-ai-mic-recording 900ms ease-in-out infinite;
}

.bs-ai-phone-input:has(.bs-ai-phone-mic-control.is-recording)
  .bs-ai-phone-input-copy {
  color: rgba(255, 255, 255, 0.88);
}

@keyframes bs-ai-mic-recording {
  0%,
  100% {
    filter: drop-shadow(0 0 0 rgba(255, 92, 0, 0));
    transform: scale(1);
  }

  50% {
    filter: drop-shadow(0 0 5px rgba(255, 92, 0, 0.78));
    transform: scale(1.08);
  }
}

.bs-ai-phone-input > i {
  display: grid;
  width: 28px;
  height: 28px;
  flex: none;
  place-items: center;
  border-radius: 50%;
  background: #ff5c00;
  color: #fff;
  box-shadow: 0 5px 14px rgba(255, 92, 0, 0.25);
}

.bs-ai-phone-input > i svg {
  width: 14px;
  height: 14px;
}

@media (prefers-reduced-motion: reduce) {
  .bs-ai-phone *,
  .bs-ai-phone *::before,
  .bs-ai-phone *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }
}

/* Benefit pills mobile list ("Top Security", "AI Assistant", etc.), built
   by ensureBenefitPillsMobile in site-overrides.js. Desktop/tablet already
   show the real floating pills (Framer's own markup); this stacked list is
   mobile-only, styled after the Suite Modules pill list (#features
   .bs-module-pill) so both mobile "show more" sections feel consistent. */
.bs-benefit-pills-list {
  display: none;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  margin-top: 40px;
}

.bs-benefit-pill {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 18px 24px;
  border-radius: 40px;
  background-color: var(--token-f0794ba6-6d3f-4f06-b3fa-5d79eb2188ea, rgb(36, 36, 36));
}

.bs-benefit-pill-icon {
  display: grid;
  flex: none;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #fff;
}

.bs-benefit-pill-icon svg {
  width: 20px;
  height: 20px;
}

.bs-benefit-pill-label {
  font-weight: 600;
  color: #fff;
}

.bs-benefit-pills-list .bs-benefit-pill-extra {
  display: none;
}

.bs-benefit-pills-list.bs-benefit-pills-expanded .bs-benefit-pill-extra {
  display: flex;
}

.framer-1gatr7d .framer-1amwru8-container[data-bs-benefits-clone] {
  display: none;
  width: 100%;
  margin-top: 16px;
}

@media (max-width: 809.98px) {
  .bs-benefit-pills-list,
  .framer-1gatr7d .framer-1amwru8-container[data-bs-benefits-clone] {
    display: flex;
  }
}

/* "Values" stats section (trusted users / average rating / retention
   rate): on mobile the three stacked bubble cards (each 40px padding,
   70px number) run tall and nearly opaque, covering most of the
   background site photo behind them. Smaller number and tighter padding
   keep the cards readable but leave more of the photo visible. Desktop
   is untouched -- these bubbles read fine there against the wider photo
   crop. */
@media (max-width: 809.98px) {
  .framer-19dlvab [data-framer-name="Numbers"] span {
    font-size: 44px !important;
  }

  .framer-19dlvab .framer-1e7bcju,
  .framer-19dlvab .framer-lbtbd8,
  .framer-19dlvab .framer-15uc9h6 {
    padding: 24px !important;
  }
}