:root {
  --ink: #050505;
  --muted: #868686;
  --line: #d9d9d9;
  --blue: #3790ee;
  --cyan: #41b7c3;
  --green: #46d978;
  --teal-dark: #024059;
  --card: #ffffff;
  --shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
  --soft-shadow: 0 10px 24px rgba(0, 0, 0, 0.10);
  --grad: linear-gradient(102deg, #338bed 0%, #41b8bf 52%, #47db74 100%);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ink);
  font-family: "Manrope", Arial, "Helvetica Neue", Helvetica, sans-serif;
  background: #fff;
  font-size: 20px;
  line-height: 1.28;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
textarea {
  font: inherit;
}

.container {
  width: min(100% - 140px, 1300px);
  margin: 0 auto;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  height: 65px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 105px;
  background: rgba(255, 255, 255, 0.94);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(12px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: max-content;
  font-weight: 700;
  font-size: 20px;
  line-height: 1;
  background: linear-gradient(90deg, #3C8BEB 0%, #42B1B9 49.52%, #49DA84 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.brand__mark {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
}

.desktop-nav {
  display: flex;
  align-items: center;
  gap: 65px;
  font-size: 16px;
  font-weight: 500;
}

.desktop-nav a,
.mobile-menu a {
  transition: color 0.2s ease;
}

.desktop-nav a:hover,
.mobile-menu a:hover {
  color: var(--cyan);
}

.header-cta {
  justify-self: end;
  min-width: 170px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  color: #fff;
  background: var(--teal-dark);
  border-radius: 8px;
  font-size: 16px;
  font-weight: 500;
  transition: transform 0.2s ease, background 0.2s ease;
}

.header-cta:hover {
  transform: translateY(-2px);
  background: #063f50;
}

.menu-toggle,
.mobile-menu {
  display: none;
}

.section-gradient {
  background:
    radial-gradient(circle at 20% 28%, rgba(63, 151, 240, 0.30), transparent 26%),
    radial-gradient(circle at 79% 18%, rgba(70, 217, 120, 0.30), transparent 26%),
    radial-gradient(circle at 48% 64%, rgba(113, 220, 230, 0.22), transparent 32%),
    #fff;
}

.hero {
  min-height: 900px;
  padding: 115px 0 125px;
}

.hero__inner {
  text-align: center;
}

.hero__eyebrow {
  display: none;
}

.hero h1 {
  max-width: 940px;
  margin: 0 auto;
  font-size: 64px;
  line-height: 1.16;
  font-weight: 400;
}

.hero h1 span,
.contact-copy h2,
.case-grid p,
.effect-card > div > p {
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.hero__actions {
  display: flex;
  justify-content: center;
  gap: 18px;
  margin-top: 34px;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 40px;
  padding: 9px 18px;
  border: 1px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.btn:hover {
  transform: translateY(-2px);
}

.btn-primary {
  color: #fff;
  background: var(--grad);
}

.arrow-icon {
  --arrow-w: 29px;
  --arrow-h: 24px;
  display: inline-block;
  width: var(--arrow-w);
  height: var(--arrow-h);
  flex: 0 0 var(--arrow-w);
  background: linear-gradient(180deg, #3C8BEB 0%, #42B1B9 49.5%, #49DA84 100%);
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='29' height='24' viewBox='0 0 29 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M27.6314 13.0121L17.5064 23.1371C17.1894 23.4542 16.7594 23.6323 16.3111 23.6323C15.8628 23.6323 15.4328 23.4542 15.1158 23.1371C14.7988 22.8201 14.6207 22.3902 14.6207 21.9418C14.6207 21.4935 14.7988 21.0635 15.1158 20.7465L22.3594 13.5057H1.6875C1.23995 13.5057 0.810725 13.3279 0.494257 13.0115C0.17779 12.695 0 12.2658 0 11.8182C0 11.3707 0.17779 10.9415 0.494257 10.625C0.810725 10.3085 1.23995 10.1307 1.6875 10.1307H22.3594L15.1186 2.88574C14.8016 2.56872 14.6235 2.13876 14.6235 1.69043C14.6235 1.2421 14.8016 0.812131 15.1186 0.495114C15.4356 0.178098 15.8656 0 16.3139 0C16.7622 0 17.1922 0.178098 17.5092 0.495114L27.6342 10.6201C27.7916 10.7771 27.9164 10.9636 28.0014 11.169C28.0865 11.3743 28.1301 11.5944 28.1298 11.8167C28.1296 12.039 28.0854 12.259 27.9999 12.4642C27.9143 12.6693 27.7891 12.8555 27.6314 13.0121Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='29' height='24' viewBox='0 0 29 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M27.6314 13.0121L17.5064 23.1371C17.1894 23.4542 16.7594 23.6323 16.3111 23.6323C15.8628 23.6323 15.4328 23.4542 15.1158 23.1371C14.7988 22.8201 14.6207 22.3902 14.6207 21.9418C14.6207 21.4935 14.7988 21.0635 15.1158 20.7465L22.3594 13.5057H1.6875C1.23995 13.5057 0.810725 13.3279 0.494257 13.0115C0.17779 12.695 0 12.2658 0 11.8182C0 11.3707 0.17779 10.9415 0.494257 10.625C0.810725 10.3085 1.23995 10.1307 1.6875 10.1307H22.3594L15.1186 2.88574C14.8016 2.56872 14.6235 2.13876 14.6235 1.69043C14.6235 1.2421 14.8016 0.812131 15.1186 0.495114C15.4356 0.178098 15.8656 0 16.3139 0C16.7622 0 17.1922 0.178098 17.5092 0.495114L27.6342 10.6201C27.7916 10.7771 27.9164 10.9636 28.0014 11.169C28.0865 11.3743 28.1301 11.5944 28.1298 11.8167C28.1296 12.039 28.0854 12.259 27.9999 12.4642C27.9143 12.6693 27.7891 12.8555 27.6314 13.0121Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
}

.arrow-icon--button {
  --arrow-w: 18px;
  --arrow-h: 15px;
  background: #fff;
}

.btn-secondary {
  color: #111;
  background: rgba(255, 255, 255, 0.75);
  border-color: #cfd6d8;
}

.tags {
  display: flex;
  justify-content: center;
  gap: 25px;
  margin-top: 35px;
  color: #14556b;
  font-weight: 700;
  font-size: 16px;
}

.tags span {
  padding: 3px 8px;
  background: rgba(229, 236, 240, 0.9);
  border-radius: 4px;
}

.flow-card {
  width: min(1038px, 100%);
  min-height: 360px;
  margin: 50px auto 0;
  display: grid;
  grid-template-columns: 1fr 280px 1fr;
  gap: 42px;
  align-items: center;
  padding: 54px 50px;
  text-align: left;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 17px;
  box-shadow: var(--soft-shadow);
}

.flow-list h2 {
  margin: 0 0 25px;
  color: #14556b;
  font-size: 22px;
  font-weight: 400;
}

.doc-row {
  min-height: 50px;
  display: grid;
  grid-template-columns: 28px 1fr auto;
  align-items: center;
  gap: 14px;
  margin-top: 24px;
  padding: 0 16px;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  font-size: 15px;
}

.doc-row em {
  color: #7d7d7d;
  font-style: normal;
}

.file-icon {
  width: 24px;
  height: 22px;
  border-radius: 4px;
  position: relative;
  display: inline-block;
  background: color-mix(in srgb, currentColor 10%, #fff);
}

.file-icon::before {
  content: "";
  position: absolute;
  inset: 3px 4px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='270.976 647.25 11.5 13.5' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M282.256 650.97L278.756 647.47C278.687 647.4 278.604 647.345 278.513 647.307C278.422 647.269 278.324 647.25 278.226 647.25H272.226C271.894 647.25 271.576 647.382 271.342 647.616C271.107 647.851 270.976 648.168 270.976 648.5V659.5C270.976 659.832 271.107 660.149 271.342 660.384C271.576 660.618 271.894 660.75 272.226 660.75H281.226C281.557 660.75 281.875 660.618 282.109 660.384C282.344 660.149 282.476 659.832 282.476 659.5V651.5C282.476 651.301 282.397 651.111 282.256 650.97ZM278.726 649.562L280.163 651H278.726V649.562ZM272.476 659.25V648.75H277.226V651.75C277.226 651.949 277.305 652.14 277.445 652.28C277.586 652.421 277.777 652.5 277.976 652.5H280.976V659.25H272.476Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='270.976 647.25 11.5 13.5' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M282.256 650.97L278.756 647.47C278.687 647.4 278.604 647.345 278.513 647.307C278.422 647.269 278.324 647.25 278.226 647.25H272.226C271.894 647.25 271.576 647.382 271.342 647.616C271.107 647.851 270.976 648.168 270.976 648.5V659.5C270.976 659.832 271.107 660.149 271.342 660.384C271.576 660.618 271.894 660.75 272.226 660.75H281.226C281.557 660.75 281.875 660.618 282.109 660.384C282.344 660.149 282.476 659.832 282.476 659.5V651.5C282.476 651.301 282.397 651.111 282.256 650.97ZM278.726 649.562L280.163 651H278.726V649.562ZM272.476 659.25V648.75H277.226V651.75C277.226 651.949 277.305 652.14 277.445 652.28C277.586 652.421 277.777 652.5 277.976 652.5H280.976V659.25H272.476Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
}

.file-icon.blue {
  color: var(--blue);
}

.file-icon.green {
  color: #25c76a;
}

.ai-core {
  position: relative;
  min-height: 270px;
  display: grid;
  place-items: center;
  color: var(--cyan);
}

.flow-arrow {
  position: absolute;
  --arrow-w: 28.13px;
  --arrow-h: 23.63px;
  display: inline-block;
  width: var(--arrow-w);
  height: var(--arrow-h);
  background: linear-gradient(180deg, #3C8BEB 0%, #42B1B9 49.5%, #49DA84 100%);
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='29' height='24' viewBox='0 0 29 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M27.6314 13.0121L17.5064 23.1371C17.1894 23.4542 16.7594 23.6323 16.3111 23.6323C15.8628 23.6323 15.4328 23.4542 15.1158 23.1371C14.7988 22.8201 14.6207 22.3902 14.6207 21.9418C14.6207 21.4935 14.7988 21.0635 15.1158 20.7465L22.3594 13.5057H1.6875C1.23995 13.5057 0.810725 13.3279 0.494257 13.0115C0.17779 12.695 0 12.2658 0 11.8182C0 11.3707 0.17779 10.9415 0.494257 10.625C0.810725 10.3085 1.23995 10.1307 1.6875 10.1307H22.3594L15.1186 2.88574C14.8016 2.56872 14.6235 2.13876 14.6235 1.69043C14.6235 1.2421 14.8016 0.812131 15.1186 0.495114C15.4356 0.178098 15.8656 0 16.3139 0C16.7622 0 17.1922 0.178098 17.5092 0.495114L27.6342 10.6201C27.7916 10.7771 27.9164 10.9636 28.0014 11.169C28.0865 11.3743 28.1301 11.5944 28.1298 11.8167C28.1296 12.039 28.0854 12.259 27.9999 12.4642C27.9143 12.6693 27.7891 12.8555 27.6314 13.0121Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='29' height='24' viewBox='0 0 29 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M27.6314 13.0121L17.5064 23.1371C17.1894 23.4542 16.7594 23.6323 16.3111 23.6323C15.8628 23.6323 15.4328 23.4542 15.1158 23.1371C14.7988 22.8201 14.6207 22.3902 14.6207 21.9418C14.6207 21.4935 14.7988 21.0635 15.1158 20.7465L22.3594 13.5057H1.6875C1.23995 13.5057 0.810725 13.3279 0.494257 13.0115C0.17779 12.695 0 12.2658 0 11.8182C0 11.3707 0.17779 10.9415 0.494257 10.625C0.810725 10.3085 1.23995 10.1307 1.6875 10.1307H22.3594L15.1186 2.88574C14.8016 2.56872 14.6235 2.13876 14.6235 1.69043C14.6235 1.2421 14.8016 0.812131 15.1186 0.495114C15.4356 0.178098 15.8656 0 16.3139 0C16.7622 0 17.1922 0.178098 17.5092 0.495114L27.6342 10.6201C27.7916 10.7771 27.9164 10.9636 28.0014 11.169C28.0865 11.3743 28.1301 11.5944 28.1298 11.8167C28.1296 12.039 28.0854 12.259 27.9999 12.4642C27.9143 12.6693 27.7891 12.8555 27.6314 13.0121Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
}

.ai-core .top {
  top: 0;
}

.ai-core .bottom {
  bottom: 0;
}

.ai-stage {
  position: relative;
  width: 220px;
  height: 220px;
  display: grid;
  place-items: center;
}

.ai-dash {
  position: absolute;
  inset: 0;
  overflow: visible;
  transform-origin: center;
  animation: orbit-spin 6s linear infinite;
}

.ai-dash rect {
  fill: rgba(73, 218, 132, 0.10);
  stroke: #49DA84;
  stroke-width: 1px;
  stroke-dasharray: 6 6;
}

@keyframes orbit-spin {
  from {
    transform: rotate(-5.06deg);
  }
  to {
    transform: rotate(354.94deg);
  }
}

.ai-box {
  width: 200px;
  height: 200px;
  display: grid;
  place-items: center;
  text-align: center;
  color: #fff;
  background: linear-gradient(180deg, #3C8BEB 0%, #42B1B9 49.5%, #49DA84 100%);
  border-radius: 40px;
  position: relative;
  z-index: 1;
}

.ai-box strong {
  display: block;
  font-size: 72px;
  font-weight: 400;
}

.ai-box span {
  display: block;
  margin-top: -18px;
  font-size: 26px;
}

.flow-list--done {
  padding-top: 8px;
}

.live {
  color: var(--green);
  font-size: 14px;
  font-weight: 700;
  text-align: right;
}

.live span {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  position: relative;
  isolation: isolate;
  vertical-align: middle;
  background: var(--green);
  border-radius: 50%;
  animation: live-pulse 1.6s ease-out infinite;
}

.live span::after {
  content: "";
  position: absolute;
  inset: -8px;
  border-radius: inherit;
  background: rgba(73, 218, 132, 0.26);
  animation: live-wave 1.6s ease-out infinite;
  z-index: -1;
}

@keyframes live-pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.86);
  }
}

@keyframes live-wave {
  0% {
    opacity: 0.65;
    transform: scale(0.45);
  }
  100% {
    opacity: 0;
    transform: scale(1.35);
  }
}

.problem,
.steps,
.features,
.cases,
.models,
.effect,
.contact-block {
  padding: 55px 0 78px;
}

.section-kicker {
  margin: 0 0 34px;
  font-size: 20px;
  font-weight: 500;
}

section h2 {
  margin: 0;
  font-size: 42px;
  line-height: 1.15;
  font-weight: 700;
}

.problem__grid {
  display: grid;
  grid-template-columns: 400px 330px 80px 330px;
  gap: 48px;
  align-items: center;
  margin-top: 42px;
}

.copy-block p {
  margin: 0 0 34px;
  font-size: 24px;
}

.compare-card {
  min-height: 266px;
  padding: 26px;
  background: #fff;
  border-radius: 14px;
  box-shadow: var(--soft-shadow);
  font-size: 16px;
}

.compare-card p {
  margin: 0 0 24px;
}

.compare-card h3 {
  margin: 0 0 18px;
  font-size: 30px;
}

.compare-card ul {
  margin: 0;
  padding-left: 20px;
}

.badge {
  display: inline-block;
  padding: 3px 7px;
  border-radius: 4px;
  font-weight: 700;
}

.badge-warn {
  color: #ff9d34;
  background: #fff1df;
}

.badge-ok {
  color: #36bf74;
  background: #dff8e9;
}

.big-arrow {
  display: grid;
  place-items: center;
}

.big-arrow .arrow-icon {
  --arrow-w: 44px;
  --arrow-h: 37px;
}

.problem__note {
  max-width: 760px;
  margin: 30px 0 0 575px;
  font-size: 21px;
}

.problem__note span {
  color: var(--cyan);
}

.steps__grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 26px;
  margin-top: 32px;
}

.step-card,
.case-grid article,
.model-grid article {
  background: rgba(255, 255, 255, 0.94);
  border-radius: 12px;
  box-shadow: var(--soft-shadow);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.step-card:hover,
.case-grid article:hover,
.model-grid article:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.14);
}

.step-card {
  min-height: 225px;
  padding: 28px 20px;
}

.step-card span {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  margin-bottom: 25px;
  color: #fff;
  font-size: 32px;
  background: var(--grad);
  border-radius: 50%;
}

.step-card h3,
.case-grid h3,
.model-grid h3 {
  margin: 0 0 14px;
  font-size: 27px;
  font-weight: 400;
}

.step-card p,
.model-grid p {
  margin: 0;
  color: var(--muted);
}

.feature-list {
  display: grid;
  gap: 48px;
  margin-top: 45px;
}

.feature-list article {
  display: grid;
  grid-template-columns: 72px 280px 1fr;
  gap: 28px;
  align-items: center;
}

.feature-list h3 {
  margin: 0;
  font-size: 25px;
}

.feature-list p {
  margin: 0;
}

.round-icon {
  width: 68px;
  height: 68px;
  display: grid;
  place-items: center;
  background: #fff;
  border-radius: 50%;
  box-shadow: var(--soft-shadow);
}

.round-icon::before {
  content: "";
  width: 38px;
  height: 38px;
  display: block;
  background: var(--grad);
  -webkit-mask: var(--round-mask) center / contain no-repeat;
  mask: var(--round-mask) center / contain no-repeat;
}

.icon-doc {
  --round-mask: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13 8C13 6.895 13.895 6 15 6H29.25L39 15.75V37C39 38.105 38.105 39 37 39H15C13.895 39 13 38.105 13 37V8ZM28 9.5V17H35.5L28 9.5ZM17 10V35H35V21H26C24.895 21 24 20.105 24 19V10H17ZM10 14H8V42C8 43.105 8.895 44 10 44H31V40H12V14H10Z' fill='black'/%3E%3C/svg%3E");
}

.icon-check::before {
  --round-mask: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='82.5 2430.9 42.7 42.7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M113.471 2445.65C113.689 2445.87 113.863 2446.13 113.981 2446.42C114.099 2446.7 114.16 2447.01 114.16 2447.31C114.16 2447.62 114.099 2447.93 113.981 2448.21C113.863 2448.5 113.689 2448.76 113.471 2448.97L102.533 2459.91C102.315 2460.13 102.057 2460.3 101.772 2460.42C101.487 2460.54 101.182 2460.6 100.873 2460.6C100.565 2460.6 100.259 2460.54 99.9743 2460.42C99.6894 2460.3 99.4306 2460.13 99.2129 2459.91L94.5254 2455.22C94.3074 2455.01 94.1344 2454.75 94.0165 2454.46C93.8985 2454.18 93.8377 2453.87 93.8377 2453.56C93.8377 2453.26 93.8985 2452.95 94.0165 2452.67C94.1344 2452.38 94.3074 2452.12 94.5254 2451.9C94.7434 2451.69 95.0022 2451.51 95.2871 2451.4C95.5719 2451.28 95.8772 2451.22 96.1856 2451.22C96.4939 2451.22 96.7992 2451.28 97.084 2451.4C97.3689 2451.51 97.6277 2451.69 97.8457 2451.9L100.875 2454.93L110.154 2445.65C110.372 2445.43 110.631 2445.26 110.916 2445.14C111.201 2445.02 111.506 2444.96 111.814 2444.96C112.122 2444.96 112.427 2445.03 112.711 2445.14C112.995 2445.26 113.253 2445.44 113.471 2445.65ZM125.094 2452C125.094 2456.17 123.857 2460.25 121.539 2463.72C119.221 2467.19 115.927 2469.89 112.072 2471.49C108.218 2473.08 103.977 2473.5 99.8848 2472.69C95.793 2471.87 92.0345 2469.87 89.0845 2466.92C86.1345 2463.97 84.1255 2460.21 83.3116 2456.12C82.4977 2452.02 82.9154 2447.78 84.5119 2443.93C86.1085 2440.07 88.8121 2436.78 92.2809 2434.46C95.7498 2432.14 99.8281 2430.91 104 2430.91C109.593 2430.91 114.954 2433.14 118.909 2437.09C122.863 2441.05 125.088 2446.41 125.094 2452ZM120.406 2452C120.406 2448.76 119.444 2445.58 117.641 2442.89C115.839 2440.19 113.276 2438.08 110.278 2436.84C107.281 2435.6 103.982 2435.28 100.799 2435.91C97.6168 2436.54 94.6935 2438.1 92.399 2440.4C90.1046 2442.69 88.542 2445.62 87.909 2448.8C87.276 2451.98 87.6009 2455.28 88.8426 2458.28C90.0844 2461.28 92.1872 2463.84 94.8852 2465.64C97.5832 2467.44 100.755 2468.41 104 2468.41C108.35 2468.4 112.52 2466.67 115.596 2463.6C118.672 2460.52 120.402 2456.35 120.406 2452Z' fill='black'/%3E%3C/svg%3E");
  width: 42px;
  height: 42px;
}

.icon-box {
  --round-mask: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 8H38C40.209 8 42 9.791 42 12V38C42 40.209 40.209 42 38 42H12C9.791 42 8 40.209 8 38V12C8 9.791 9.791 8 12 8ZM12 12V38H38V12H12ZM34.53 19.53L23 31.06L16.47 24.53L19.3 21.7L23 25.4L31.7 16.7L34.53 19.53Z' fill='black'/%3E%3C/svg%3E");
}

.icon-sync {
  --round-mask: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M31.5 8.5L41.5 18.5L31.5 28.5V22H15C11.686 22 9 24.686 9 28V31H5V28C5 22.477 9.477 18 15 18H31.5V8.5ZM18.5 41.5L8.5 31.5L18.5 21.5V28H35C38.314 28 41 25.314 41 22V19H45V22C45 27.523 40.523 32 35 32H18.5V41.5Z' fill='black'/%3E%3C/svg%3E");
}

.icon-chart {
  --round-mask: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 40H42V44H8C6.895 44 6 43.105 6 42V8H10V40ZM16 24H22V36H16V24ZM26 14H32V36H26V14ZM36 8H42V36H36V8Z' fill='black'/%3E%3C/svg%3E");
}

.case-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 35px;
}

.case-grid article,
.model-grid article {
  padding: 30px;
  border: 1.5px solid #54cf96;
}

.case-grid p {
  margin: 0 0 18px;
  font-size: 22px;
  font-weight: 700;
}

.case-grid span {
  display: block;
  min-height: 75px;
  color: var(--muted);
  font-size: 21px;
}

.case-grid b {
  display: block;
  margin-top: 20px;
  color: var(--teal-dark);
  font-size: 20px;
}

.wide-text {
  max-width: 1160px;
  margin: 18px 0 32px;
}

.model-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.mini-compare,
.model-table {
  min-height: 83px;
  margin: 22px 0;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  background: #f4f4f4;
  border-radius: 4px;
  text-align: center;
  font-size: 17px;
}

.mini-compare .is-struck {
  text-decoration: line-through;
  text-decoration-thickness: 2px;
  text-decoration-skip-ink: none;
}

.mini-arrow {
  --arrow-w: 28px;
  --arrow-h: 24px;
}

.mini-compare small {
  color: #333;
  font-size: 14px;
}

.model-table {
  display: grid;
  text-align: left;
}

.model-table span {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid #ddd;
}

.model-table b {
  color: var(--green);
  font-weight: 400;
}

.tabs {
  display: flex;
  gap: 20px;
  margin: 28px 0 28px;
}

.tab {
  padding: 11px 20px;
  color: #7b7b7b;
  background: #fff;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
}

.tab.is-active {
  color: #fff;
  background: var(--teal-dark);
}

.effect-card {
  display: grid;
  grid-template-columns: 1fr 490px;
  gap: 50px;
  align-items: center;
  min-height: 260px;
  padding: 60px 54px;
  background: rgba(255, 255, 255, 0.94);
  border: 1.5px solid #54cf96;
  border-radius: 12px;
}

.effect-card > div > p {
  margin: 0 0 20px;
  font-size: 25px;
  font-weight: 700;
}

.effect-card h3 {
  margin: 0 0 22px;
  font-size: 32px;
  font-weight: 700;
}

.effect-card span {
  display: block;
  max-width: 560px;
}

.metrics {
  min-height: 140px;
  display: grid;
  grid-template-columns: 1fr 55px 1fr;
  align-items: center;
  padding: 26px 38px;
  background: #f6f6f6;
  border-radius: 8px;
  text-align: center;
}

.metrics small {
  display: block;
  margin-bottom: 16px;
  font-size: 14px;
}

.metrics strong {
  display: block;
  color: var(--cyan);
  font-size: 52px;
  font-weight: 700;
}

.metrics div:last-child strong {
  color: #000;
}

.metrics .mini-arrow {
  justify-self: center;
  --arrow-w: 38px;
  --arrow-h: 32px;
}

.contact-block {
  padding-bottom: 126px;
}

.contact-block__inner,
.contacts-layout {
  display: grid;
  grid-template-columns: 1fr 625px;
  gap: 85px;
  align-items: start;
}

.contact-copy {
  padding-top: 18px;
}

.contact-copy h2 {
  margin: 0 0 44px;
  font-size: 43px;
}

.contact-copy p:not(.section-kicker) {
  max-width: 560px;
  margin: 0 0 45px;
  font-size: 24px;
}

.check-list {
  display: grid;
  gap: 36px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-weight: 700;
}

.check-list li::before {
  content: "";
  width: 24px;
  height: 18px;
  display: inline-block;
  margin-right: 30px;
  vertical-align: -2px;
  background: var(--grad);
  -webkit-mask: url("../img/icon-check.svg") center / contain no-repeat;
  mask: url("../img/icon-check.svg") center / contain no-repeat;
}

.lead-form {
  padding: 35px 25px 30px;
  background: rgba(255, 255, 255, 0.96);
  border-radius: 17px;
  box-shadow: var(--shadow);
}

.lead-form h2 {
  margin: 0 0 30px;
  font-size: 29px;
}

.lead-form label {
  display: block;
  margin-bottom: 24px;
  font-size: 20px;
}

.lead-form input,
.lead-form textarea {
  width: 100%;
  min-height: 52px;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid #d8d8d8;
  border-radius: 8px;
  outline: none;
  color: #111;
  background: #fff;
  font-size: 16px;
}

.lead-form textarea {
  min-height: 102px;
  resize: vertical;
}

.lead-form input:focus,
.lead-form textarea:focus {
  border-color: var(--cyan);
  box-shadow: 0 0 0 3px rgba(65, 183, 195, 0.16);
}

.lead-form .consent {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 24px;
  font-size: 17px;
}

.consent input {
  width: 23px;
  height: 23px;
  min-height: auto;
  margin: 0;
  position: relative;
  flex: 0 0 23px;
  appearance: none;
  border: 2px solid #111;
  border-radius: 2px;
  background: #fff;
  cursor: pointer;
}

.consent input:checked::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 7px;
  height: 12px;
  border: solid #111;
  border-width: 0 2px 2px 0;
  transform: translate(-50%, -58%) rotate(45deg);
}

.lead-form .btn {
  width: 100%;
  border: 0;
  font-size: 17px;
}

.lead-form .btn:disabled {
  cursor: wait;
  opacity: 0.72;
  transform: none;
}

.form-status {
  min-height: 20px;
  margin: 12px 0 0;
  color: var(--teal-dark);
  font-size: 14px;
  text-align: center;
}

.form-status.is-success {
  color: #159447;
}

.form-status.is-error {
  color: #b42318;
}

.site-footer {
  padding: 42px 0 34px;
  color: #fff;
  background: var(--teal-dark);
}

.site-footer .footer-inner {
  width: min(100% - 280px, 1160px);
}

.footer-grid {
  display: grid;
  grid-template-columns: 300px 120px 120px 220px;
  justify-content: space-between;
  gap: 64px;
}

.site-footer h2,
.site-footer h3 {
  margin: 0 0 20px;
  font-size: 20px;
  line-height: 1;
  font-weight: 600;
}

.site-footer p {
  margin: 0;
  max-width: 248px;
  font-size: 16px;
  line-height: 1.38;
  font-weight: 400;
}

.site-footer nav,
.site-footer address {
  display: flex;
  flex-direction: column;
  gap: 18px;
  font-style: normal;
}

.site-footer a,
.site-footer span {
  color: rgba(255, 255, 255, 0.92);
  font-size: 16px;
  line-height: 1;
  font-weight: 400;
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 32px;
  margin-top: 34px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.28);
}

.footer-bottom p {
  max-width: none;
  color: rgba(255, 255, 255, 0.72);
}

.footer-bottom nav {
  display: flex;
  flex-direction: row;
  gap: 28px;
}

.footer-bottom a {
  color: rgba(255, 255, 255, 0.78);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.contacts-page {
  min-height: 947px;
  padding: 58px 0 155px;
}

.contacts-layout {
  padding-top: 0;
}

.contacts-copy {
  padding-top: 10px;
}

.contacts-copy h1 {
  margin: 0 0 42px;
  font-size: 48px;
  line-height: 1.28;
  font-weight: 400;
}

.contacts-copy p {
  max-width: 460px;
  margin: 0;
  font-size: 25px;
}

.not-found {
  min-height: 761px;
  display: grid;
  place-items: start center;
  padding-top: 150px;
  text-align: center;
}

.not-found h1 {
  margin: 0 0 32px;
  font-size: 180px;
  line-height: 0.9;
  font-weight: 400;
}

.not-found h1 span {
  color: var(--cyan);
}

.not-found p {
  margin: 0 0 34px;
  font-size: 48px;
}

.reveal-ready {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

.reveal-ready.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 1180px) {
  .container {
    width: min(100% - 48px, 980px);
  }

  .site-header {
    padding: 0 32px;
  }

  .problem__grid,
  .contact-block__inner,
  .contacts-layout {
    grid-template-columns: 1fr;
  }

  .problem__note {
    margin-left: 0;
  }

  .big-arrow {
    display: none;
  }

  .steps__grid,
  .model-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .effect-card {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  body {
    font-size: 16px;
  }

  .container {
    width: min(100% - 26px, 402px);
  }

  .site-header {
    height: 65px;
    grid-template-columns: 1fr auto;
    padding: 0 27px;
  }

  .brand {
    gap: 10px;
    font-size: 20px;
  }

  .brand__mark {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }

  .desktop-nav,
  .header-cta {
    display: none;
  }

  .menu-toggle {
    display: grid;
    gap: 5px;
    width: 31px;
    padding: 0;
    background: transparent;
    border: 0;
  }

  .menu-toggle span {
    width: 31px;
    height: 3px;
    background: #000;
    border-radius: 99px;
  }

  .mobile-menu {
    position: absolute;
    top: 64px;
    left: 0;
    right: 0;
    display: grid;
    gap: 16px;
    padding: 18px 28px 24px;
    background: rgba(255, 255, 255, 0.98);
    border-bottom: 1px solid var(--line);
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.18s ease, transform 0.18s ease;
  }

  .mobile-menu.is-open {
    opacity: 1;
    transform: translateY(0);
  }

  .section-gradient {
    background:
      radial-gradient(circle at 22% 42%, rgba(63, 151, 240, 0.30), transparent 25%),
      radial-gradient(circle at 82% 18%, rgba(70, 217, 120, 0.30), transparent 27%),
      #fff;
  }

  .hero {
    min-height: auto;
    padding: 50px 0 55px;
  }

  .hero__eyebrow {
    display: block;
    margin: 0 0 8px;
    color: #52b8c1;
    font-size: 13px;
  }

  .hero h1 {
    font-size: 27px;
    line-height: 1.2;
  }

  .hero__actions {
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
  }

  .btn {
    min-height: 35px;
    padding: 8px 13px;
    font-size: 12px;
  }

  .tags {
    gap: 6px;
    margin-top: 12px;
    font-size: 10px;
  }

  .tags span {
    padding: 3px 5px;
  }

  .flow-card {
    min-height: 493px;
    grid-template-columns: 1fr;
    gap: 8px;
    width: 270px;
    margin-top: 20px;
    padding: 18px 18px;
    border-radius: 8px;
  }

  .flow-list h2 {
    margin-bottom: 9px;
    font-size: 13px;
  }

  .doc-row {
    min-height: 28px;
    margin-top: 8px;
    grid-template-columns: 17px 1fr auto;
    gap: 8px;
    padding: 0 8px;
    font-size: 8px;
  }

  .file-icon {
    width: 18px;
    height: 17px;
  }

  .file-icon::before {
    inset: 2px 3px;
  }

  .ai-core {
    min-height: 190px;
  }

  .flow-arrow {
    --arrow-w: 28.13px;
    --arrow-h: 23.63px;
  }

  .ai-stage {
    width: 135px;
    height: 135px;
  }

  .ai-box {
    width: 123px;
    height: 123px;
    border-radius: 24px;
  }

  .ai-box strong {
    font-size: 42px;
  }

  .ai-box span {
    margin-top: -10px;
    font-size: 16px;
  }

  .live {
    font-size: 8px;
  }

  .live span {
    width: 12px;
    height: 12px;
  }

  .problem,
  .steps,
  .features,
  .cases,
  .models,
  .effect,
  .contact-block {
    padding: 34px 0 42px;
  }

  .section-kicker {
    margin-bottom: 16px;
    font-size: 11px;
  }

  section h2 {
    font-size: 24px;
  }

  .problem__grid {
    gap: 16px;
    margin-top: 18px;
  }

  .copy-block p {
    margin-bottom: 18px;
    font-size: 16px;
  }

  .compare-card {
    min-height: auto;
    padding: 16px;
    font-size: 12px;
  }

  .compare-card h3 {
    font-size: 19px;
  }

  .problem__note {
    font-size: 13px;
  }

  .steps__grid,
  .case-grid,
  .model-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .step-card {
    min-height: 120px;
    padding: 14px;
  }

  .step-card span {
    width: 31px;
    height: 31px;
    margin-bottom: 10px;
    font-size: 22px;
  }

  .step-card h3,
  .case-grid h3,
  .model-grid h3 {
    font-size: 18px;
  }

  .feature-list {
    gap: 26px;
    margin-top: 24px;
  }

  .feature-list article {
    grid-template-columns: 47px 1fr;
    gap: 14px;
  }

  .feature-list p {
    grid-column: 2;
    font-size: 12px;
  }

  .feature-list h3 {
    font-size: 14px;
  }

  .round-icon {
    width: 42px;
    height: 42px;
  }

  .round-icon::before {
    width: 24px;
    height: 24px;
  }

  .case-grid article,
  .model-grid article {
    padding: 16px;
  }

  .case-grid p,
  .case-grid span,
  .case-grid b,
  .wide-text,
  .model-grid p {
    font-size: 12px;
  }

  .case-grid span {
    min-height: auto;
  }

  .mini-compare,
  .model-table {
    min-height: auto;
    font-size: 10px;
  }

  .tabs {
    gap: 6px;
    overflow-x: auto;
    margin: 14px 0;
  }

  .tab {
    flex: 0 0 auto;
    padding: 8px 12px;
    font-size: 11px;
  }

  .effect-card {
    min-height: auto;
    gap: 16px;
    padding: 22px;
  }

  .effect-card > div > p {
    font-size: 14px;
  }

  .effect-card h3 {
    font-size: 18px;
  }

  .effect-card span {
    font-size: 12px;
  }

  .metrics {
    min-height: 74px;
    padding: 12px;
  }

  .metrics small {
    margin-bottom: 8px;
    font-size: 8px;
  }

  .metrics strong {
    font-size: 28px;
  }

  .metrics b {
    font-size: 24px;
  }

  .contact-block__inner,
  .contacts-layout {
    gap: 26px;
  }

  .contact-copy h2 {
    margin-bottom: 20px;
    font-size: 26px;
  }

  .contact-copy p:not(.section-kicker) {
    margin-bottom: 24px;
    font-size: 14px;
  }

  .check-list {
    gap: 16px;
    font-size: 12px;
  }

  .check-list li::before {
    width: 16px;
    height: 12px;
    margin-right: 14px;
  }

  .lead-form {
    padding: 26px 16px;
    border-radius: 15px;
  }

  .lead-form h2 {
    margin-bottom: 24px;
    font-size: 22px;
  }

  .lead-form label {
    margin-bottom: 20px;
    font-size: 16px;
  }

  .lead-form input,
  .lead-form textarea {
    min-height: 42px;
    margin-top: 10px;
    font-size: 12px;
  }

  .lead-form textarea {
    min-height: 84px;
  }

  .lead-form .consent {
    gap: 11px;
    font-size: 12px;
  }

  .consent input {
    width: 21px;
    height: 21px;
  }

  .site-footer {
    padding: 57px 0 58px;
  }

  .site-footer .footer-inner {
    width: min(100% - 32px, 370px);
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .site-footer h2,
  .site-footer h3 {
    margin-bottom: 25px;
    font-size: 22px;
  }

  .site-footer p,
  .site-footer a,
  .site-footer span {
    font-size: 16px;
  }

  .site-footer nav,
  .site-footer address {
    gap: 22px;
  }

  .footer-bottom {
    flex-direction: column;
    gap: 18px;
    margin-top: 38px;
    padding-top: 24px;
  }

  .footer-bottom nav {
    flex-direction: row;
    gap: 22px;
  }

  .contacts-page {
    min-height: 1199px;
    padding: 50px 0 124px;
  }

  .contacts-copy h1 {
    margin-bottom: 26px;
    font-size: 38px;
    line-height: 1.28;
  }

  .contacts-copy p {
    font-size: 21px;
  }

  .not-found {
    min-height: 954px;
    padding-top: 188px;
  }

  .not-found h1 {
    margin-bottom: 38px;
    font-size: 129px;
  }

  .not-found p {
    margin-bottom: 38px;
    font-size: 39px;
    line-height: 1.35;
  }
}

.symbol {
  display: inline-block;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  background: var(--grad);
  -webkit-mask: var(--round-mask) center / contain no-repeat;
  mask: var(--round-mask) center / contain no-repeat;
}

.symbol.icon-agent-chat-card,
.symbol.icon-agent-users,
.symbol.icon-agent-clock,
.symbol.icon-agent-chart-line,
.symbol.icon-process-chat,
.symbol.icon-process-grid,
.symbol.icon-process-done {
  -webkit-mask: none;
  mask: none;
}

.symbol.icon-agent-chat-card {
  display: grid;
  place-items: center;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.symbol.icon-agent-chat-card::before,
.symbol.icon-process-chat::before {
  content: none;
}

.symbol.icon-agent-chat-card svg,
.symbol.icon-process-chat svg {
  display: block;
  width: 32px;
  height: 32px;
}

.symbol.icon-agent-users,
.symbol.icon-agent-clock,
.symbol.icon-agent-chart-line,
.symbol.icon-process-chat,
.symbol.icon-process-grid {
  position: relative;
  display: grid;
  place-items: center;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.symbol.icon-agent-users::before,
.symbol.icon-agent-clock::before,
.symbol.icon-agent-chart-line::before,
.symbol.icon-process-chat::before,
.symbol.icon-process-grid::before,
.symbol.icon-process-done::before {
  content: "";
  display: block;
  width: 32px;
  height: 32px;
  background: var(--icon-image) center / contain no-repeat;
}

.symbol.icon-process-chat::before {
  content: none;
  display: none;
}

.symbol.icon-agent-users,
.symbol.icon-process-users {
  --icon-image: url("../img/bpc-icon-users.svg");
}

.symbol.icon-agent-clock {
  --icon-image: url("../img/bpc-icon-clock.svg");
}

.symbol.icon-agent-chart-line {
  --icon-image: url("../img/bpc-icon-chart-line.svg");
}

.symbol.icon-process-chat {
  --icon-image: url("../img/bpc-icon-chat-blue.svg");
}

.symbol.icon-process-grid {
  --icon-image: url("../img/bpc-icon-grid-green.svg");
}

.symbol.icon-process-grid::before {
  width: 23px;
  height: 23px;
}

.symbol.icon-process-done {
  --icon-image: url("../img/bpc-icon-check-white.svg");
  display: grid;
  place-items: center;
  background: var(--grad);
  border-radius: 50%;
}

.icon-check-square {
  --round-mask: url("../img/icon-check-square.svg");
}

.bpc-page main {
  background:
    radial-gradient(circle at 16% 12%, rgba(60, 139, 235, 0.24), transparent 18%),
    radial-gradient(circle at 82% 8%, rgba(73, 218, 132, 0.22), transparent 16%),
    radial-gradient(circle at 20% 36%, rgba(60, 139, 235, 0.22), transparent 18%),
    radial-gradient(circle at 78% 39%, rgba(73, 218, 132, 0.2), transparent 18%),
    radial-gradient(circle at 50% 56%, rgba(66, 177, 185, 0.12), transparent 20%),
    radial-gradient(circle at 18% 78%, rgba(60, 139, 235, 0.16), transparent 18%),
    radial-gradient(circle at 78% 82%, rgba(73, 218, 132, 0.16), transparent 16%),
    #fff;
}

.bpc-page .section-gradient {
  background: transparent;
}

.bpc-hero {
  min-height: 760px;
  padding: 178px 0 72px;
}

.bpc-hero__grid,
.bpc-problem__grid,
.bpc-scenario__grid,
.bpc-ai__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 46px;
  align-items: start;
}

.bpc-hero__grid {
  grid-template-columns: 530px 530px;
  gap: 130px;
  align-items: center;
  justify-content: center;
}

.bpc-problem__grid {
  grid-template-columns: 530px 530px;
  gap: 130px;
  align-items: start;
  margin-top: 25px;
}

.bpc-hero__copy h1,
.bpc-problem h2,
.bpc-solution h2,
.bpc-features h2,
.bpc-scenario h2,
.bpc-ai h2,
.bpc-security h2,
.contact-copy h2 {
  margin: 0;
  font-size: 44px;
  line-height: 1.15;
  font-weight: 500;
}

.bpc-hero__copy h1 {
  max-width: 530px;
}

.bpc-hero__copy p,
.bpc-intro,
.bpc-scenario__copy p,
.bpc-ai__copy > p:not(.section-kicker),
.bpc-security .bpc-intro,
.bpc-problem-text {
  margin: 24px 0 0;
  color: #3b3b3b;
  font-size: 20px;
  line-height: 1.45;
}

.bpc-hero__copy p {
  max-width: 530px;
  margin-top: 36px;
  color: #000;
  font-size: 24px;
  line-height: 1.35;
  font-weight: 500;
}

.hero__actions--left {
  justify-content: flex-start;
  gap: 18px;
  margin-top: 25px;
}

.bpc-hero .btn {
  width: 200px;
  min-height: 40px;
  padding: 10px 16px;
  font-size: 16px;
  font-weight: 500;
}

.bpc-chat-stage {
  position: relative;
  min-height: 505px;
  padding: 0 0 18px;
}

.bpc-chat-icon {
  position: absolute;
  top: -20px;
  left: -76px;
  z-index: 0;
  width: 100px;
  height: 100px;
  display: grid;
  place-items: center;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

.bpc-chat-icon img,
.bpc-chat-icon svg {
  width: 64px;
  height: 64px;
  display: block;
}

.bpc-chat-window {
  position: relative;
  z-index: 1;
  width: min(100%, 530px);
  margin-left: auto;
  min-height: 487px;
  padding: 30px;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.bpc-chat-head {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(148, 148, 148, 0.2);
}

.bpc-chat-head strong,
.bpc-metrics-card h3,
.bpc-flow-sheet h3 {
  display: block;
  font-size: 20px;
  font-weight: 600;
  margin: 0;
}

.bpc-chat-head span,
.bpc-flow-item p,
.bpc-flow-sheet p {
  color: var(--muted);
  font-size: 14px;
  margin: 2px 0 0 0;
}

.bpc-chat-head > div > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #49da84;
}

.bpc-chat-head > div > span::before {
  content: "";
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #49da84;
  flex: 0 0 14px;
}

.bpc-chat-badge,
.bubble-mark {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  background: #4d93f0;
}

.bubble-mark {
  width: 36px;
  height: 36px;
  font-size: 16px;
  font-weight: 600;
  flex: 0 0 36px;
}

.bubble-mark--m {
  background: #4d93f0;
}

.bubble-mark--ai {
  background: linear-gradient(180deg, #4890ee 0%, #43b6c0 50%, #49da84 100%);
}

.bubble-mark--ok {
  background: #49da84;
}

.bpc-chat-thread {
  display: grid;
  gap: 22px;
}

.bpc-chat-bubble {
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 14px;
  align-items: start;
}

.bpc-chat-bubble > div {
  max-width: 362px;
  padding: 12px 14px 10px;
  background: #fff;
  border: 1px solid rgba(148, 148, 148, 0.22);
  border-radius: 14px;
}

.bpc-chat-bubble--accent > div {
  background: #fff;
  border-color: rgba(73, 218, 132, 0.55);
}

.bpc-chat-bubble strong,
.bpc-flow-item strong,
.bpc-agent-card h3,
.bpc-security-card h3 {
  display: block;
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: 600;
}

.bpc-chat-bubble strong {
  color: #3c8beb;
  font-weight: 500;
}

.bpc-chat-bubble p,
.bpc-agent-card p,
.bpc-security-card p {
  margin: 0;
  color: #555;
  font-size: 13px;
  line-height: 1.4;
}

.bpc-security-card h3 {
  margin-bottom: 9px;
  font-size: 18px;
  line-height: 1.18;
}

.bpc-security-card p {
  color: #555;
  font-size: 16px;
  line-height: 1.45;
}

.bpc-chat-bubble > div::after {
  content: "10:24";
  display: block;
  margin-top: 4px;
  color: #bcbcbc;
  font-size: 12px;
  line-height: 1.2;
}

.bpc-chat-dots {
  width: 56px;
  min-height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  margin-top: 20px;
  padding: 5px 10px;
  background: #efefef;
  border-radius: 20px;
}

.bpc-chat-dots span {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #d4d4d4;
}

.bpc-refresh {
  position: absolute;
  right: -58px;
  bottom: -38px;
  z-index: 0;
  width: 88px;
  height: 88px;
  display: grid;
  place-items: center;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.bpc-refresh img {
  width: 60px;
  height: 60px;
  display: block;
}

.bpc-refresh .symbol,
.bpc-process-step .symbol {
  width: 26px;
  height: 26px;
  flex-basis: 26px;
}

.bpc-problem,
.bpc-solution,
.bpc-features,
.bpc-scenario,
.bpc-ai,
.bpc-security {
  padding: 68px 0 0;
}

.bpc-problem h2 span,
.bpc-features h2,
.contact-copy h2 {
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.bpc-problem h2 {
  max-width: 1190px;
  font-size: 36px;
  line-height: 1;
  font-weight: 500;
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.bpc-problem h2 span {
  background: none;
  color: inherit;
}

.bpc-solution h2 {
  font-size: 36px;
  line-height: 1;
  font-weight: 600;
}

.bpc-solution .bpc-intro {
  max-width: 730px;
  margin-top: 30px;
  color: #000;
  font-size: 20px;
  line-height: 1.35;
  font-weight: 400;
}

.bpc-problem .section-kicker {
  margin-bottom: 50px;
  font-size: 20px;
  line-height: 1;
  font-weight: 500;
}

.bpc-problem__copy p {
  margin: 0 0 28px;
  font-size: 20px;
  line-height: 1.25;
  font-weight: 400;
  letter-spacing: 0;
  color: #000;
}

.bpc-problem__copy,
.bpc-problem-text {
  width: 530px;
  max-width: 100%;
}

.bpc-quote {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 20px;
  width: 488px;
  max-width: 100%;
  margin-top: 52px;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.bpc-quote::before {
  content: "";
  flex: 0 0 8px;
  width: 8px;
  height: 81px;
  border-radius: 999px;
  background: linear-gradient(180deg, #3c8beb 0%, #42b1b9 49.52%, #49da84 100%);
}

.bpc-quote .symbol {
  display: none;
}

.bpc-quote p {
  width: 468px;
  margin: 0;
  font-size: 20px;
  line-height: 1;
  font-weight: 500;
  color: #000;
}

.bpc-metrics-card,
.bpc-routing-card,
.bpc-flow-sheet {
  padding: 28px 26px;
  background: rgba(255, 255, 255, 0.96);
  border-radius: 18px;
  box-shadow: var(--soft-shadow);
}

.bpc-metrics-card {
  width: 530px;
  min-height: 342px;
  margin-top: 0;
  padding: 30px;
  justify-self: end;
}

.bpc-metrics-card h3 {
  margin-bottom: 25px;
  font-size: 24px;
  line-height: 1;
  font-weight: 600;
}

.bpc-meter {
  display: flex;
  gap: 25px;
  align-items: center;
  width: 470px;
  margin-top: 28px;
  font-size: 20px;
  line-height: 1;
  font-weight: 400;
}

.bpc-routing-row {
  display: grid;
  grid-template-columns: 1fr 140px;
  gap: 20px;
  align-items: center;
  width: 100%;
  padding: 16px 0;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  font-size: 16px;
  line-height: 1.2;
}

.bpc-routing-card .bpc-routing-row {
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 24px;
  padding: 18px 0;
}

.bpc-routing-row:last-of-type {
  border-bottom: none;
}

.bpc-routing-info strong {
  display: block;
  font-size: 15px;
  font-weight: 500;
  margin-bottom: 6px;
}

.bpc-routing-card .bpc-routing-info strong {
  font-size: 16px;
  line-height: 1.15;
}

.bpc-routing-info p {
  font-size: 11px;
  color: var(--muted);
  margin: 0;
}

.bpc-routing-card .bpc-routing-info p {
  font-size: 11px;
  line-height: 1.25;
}

.bpc-meter span {
  flex: 0 0 auto;
}

.bpc-meter div {
  flex: 0 0 180px;
}

.bpc-meter div,
.bpc-routing-row .bpc-routing-bar {
  position: relative;
  height: 16px;
  background: rgba(148, 148, 148, 0.22);
  border-radius: 999px;
  overflow: hidden;
}

.bpc-routing-row .bpc-routing-bar {
  height: 12px;
}

.bpc-routing-card .bpc-routing-bar {
  height: 13px;
}

.bpc-meter i,
.bpc-routing-row i {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: 999px;
}

.bpc-meter i {
  background: linear-gradient(90deg, #4f93f0 0%, #43b5c0 56%, #49da84 100%);
}

.bpc-meter i.is-muted {
  background: #b8b8b8;
}

.bpc-metrics-card .bpc-meter:nth-of-type(4) i {
  background: #b8b8b8;
}

.bpc-routing-row i.is-deep {
  background: linear-gradient(90deg, #44b5c0 0%, #2fc666 100%);
}

.bpc-meter strong {
  min-width: 44px;
  margin-left: auto;
  font-size: 20px;
  line-height: 1;
  font-weight: 600;
  text-align: right;
}

.bpc-legend {
  display: flex;
  gap: 25px;
  margin-top: 25px;
  padding-top: 25px;
  border-top: 1px solid rgba(148, 148, 148, 0.2);
  color: #666;
  font-size: 16px;
  line-height: 1;
  font-weight: 400;
}

.bpc-legend span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.bpc-legend i {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: linear-gradient(90deg, #4f93f0 0%, #49da84 100%);
}

.bpc-legend .is-muted {
  background: #b8b8b8;
}

.bpc-intro {
  max-width: 740px;
}

.bpc-intro--wide {
  max-width: 980px;
}

.bpc-agent-grid,
.bpc-security-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 50px;
}

.bpc-agent-card,
.bpc-security-card {
  min-height: 264px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(58, 214, 130, 0.42);
  border-radius: 20px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.05);
}

.bpc-security-card {
  border-color: transparent;
  background:
    linear-gradient(rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.96)) padding-box,
    linear-gradient(115deg, #3c8beb 0%, #42b1b9 48%, #49da84 100%) border-box;
}

.bpc-agent-card {
  border-color: transparent;
  background:
    linear-gradient(rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.96)) padding-box,
    linear-gradient(115deg, #3c8beb 0%, #42b1b9 48%, #49da84 100%) border-box;
}

.bpc-agent-card .symbol {
  width: 50px;
  height: 50px;
  margin-bottom: 18px;
}

.bpc-security-card .symbol {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  margin-bottom: 20px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.06);
  background: #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
}

.bpc-agent-card .icon-agent-chat-card {
  width: 70px;
  height: 70px;
  margin: -10px 0 8px -10px;
}

.bpc-agent-card small {
  display: table;
  width: auto;
  margin-bottom: 10px;
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-size: 20px;
  line-height: 1;
  font-weight: 500;
}

.bpc-agent-grid .bpc-agent-card > small {
  display: table;
  width: auto;
  background: linear-gradient(90deg, #3c8beb 0%, #42b1b9 49.52%, #49da84 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.bpc-agent-card h3 {
  margin-bottom: 16px;
  font-size: 24px;
  line-height: 1;
  font-weight: 500;
}

.bpc-agent-card p {
  color: #808080;
  font-size: 20px;
  line-height: 1.15;
  font-weight: 500;
}

.bpc-process-flow {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-top: 34px;
}

.bpc-process-flow > .arrow-icon {
  margin-top: 23px;
}

.bpc-process-step {
  flex: 1 1 0;
  display: grid;
  justify-items: center;
  grid-template-rows: 70px auto;
  gap: 12px;
  text-align: center;
}

.bpc-process-step .symbol {
  width: 70px;
  height: 70px;
  padding: 0;
  background: #fff;
  border-radius: 50%;
  position: relative;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.bpc-process-step .symbol::before {
  position: static;
  inset: auto;
  background: var(--icon-image) center / contain no-repeat;
  -webkit-mask: none;
  mask: none;
}

.bpc-process-step .icon-process-done {
  background: var(--grad);
}

.bpc-process-step strong {
  font-size: 20px;
  line-height: 1.2;
  font-weight: 600;
}

.feature-list--bpc {
  gap: 42px;
  max-width: 1040px;
  margin-top: 34px;
}

.feature-list--bpc article {
  grid-template-columns: 68px 184px minmax(0, 1fr);
  gap: 20px;
}

.bpc-features h2 {
  max-width: 690px;
  font-size: 34px;
  line-height: 1.18;
}

.bpc-features .bpc-intro {
  max-width: 720px;
  margin-top: 24px;
  font-size: 19px;
  line-height: 1.35;
}

.feature-list--bpc h3 {
  font-size: 22px;
  line-height: 1.24;
  font-weight: 700;
}

.feature-list--bpc p {
  max-width: 780px;
  color: #000;
  font-size: 18px;
  line-height: 1.36;
}

.feature-list--bpc .round-icon {
  width: 68px;
  height: 68px;
}

.feature-list--bpc .round-icon::before {
  width: 42px;
  height: 42px;
}

.feature-list--bpc .icon-sync {
  --round-mask: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='19.5' stroke='black' stroke-width='4.6'/%3E%3Cpath d='M16.5 25.3L22 30.8L34 18.8' stroke='black' stroke-width='4.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.feature-list--bpc .icon-box {
  --round-mask: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='19.5' stroke='black' stroke-width='4.6'/%3E%3Cpath d='M25 14.5V25H35.5' stroke='black' stroke-width='4.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.feature-list--bpc .icon-chart {
  --round-mask: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 39H41' stroke='black' stroke-width='4.3' stroke-linecap='round'/%3E%3Cpath d='M12 30H20V39H12V30Z' stroke='black' stroke-width='4.3' stroke-linejoin='round'/%3E%3Cpath d='M22 22H30V39H22V22Z' stroke='black' stroke-width='4.3' stroke-linejoin='round'/%3E%3Cpath d='M32 14H40V39H32V14Z' stroke='black' stroke-width='4.3' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.feature-list--bpc .icon-check::before {
  --round-mask: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='10.5' y='10.5' width='29' height='29' rx='1.8' stroke='black' stroke-width='4.6'/%3E%3Cpath d='M17.5 25.7L22.4 30.5L32.6 20.3' stroke='black' stroke-width='4.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.feature-list--bpc .icon-doc {
  --round-mask: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 6.5H31.2L39 14.3V43.5H12V6.5Z' stroke='black' stroke-width='4.4' stroke-linejoin='round'/%3E%3Cpath d='M30.5 7.5V15H38' stroke='black' stroke-width='4.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M19 27H31' stroke='black' stroke-width='4.4' stroke-linecap='round'/%3E%3Cpath d='M19 35H31' stroke='black' stroke-width='4.4' stroke-linecap='round'/%3E%3C/svg%3E");
}

.bpc-scenario__copy {
  padding-top: 6px;
}

.bpc-scenario-note {
  margin: 22px 0 30px;
}

.bpc-scenario-note strong {
  display: block;
  font-size: 18px;
}

.bpc-scenario-note p {
  margin: 10px 0 0;
  font-size: inherit;
}

.bpc-flow-sheet {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  padding: 30px !important;
  gap: 25px;
  background: #FFFFFF !important;
  box-shadow: 0px 2px 20px rgba(0, 0, 0, 0.1) !important;
  border-radius: 20px !important;
  width: min(100%, 589px);
  justify-self: end;
}

.bpc-flow-item {
  display: grid;
  grid-template-columns: 45px 1fr;
  gap: 20px;
  align-items: center;
}

.bpc-flow-item .bubble-mark {
  width: 45px;
  height: 45px;
  flex: 0 0 45px;
  box-shadow: 0px 1.8px 9px rgba(0, 0, 0, 0.05);
}

.bpc-flow-item > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.bpc-routing-card {
  width: min(100%, 430px);
  min-height: 470px;
  align-self: center;
  padding: 42px 32px 36px;
  border-radius: 18px;
}

.bpc-routing-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.bpc-routing-card__head h3 {
  max-width: 270px;
  margin: 0;
  font-size: 18px;
  line-height: 1.18;
  font-weight: 600;
}

.bpc-routing-card__head span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #45ca76;
  font-size: 13px;
  font-weight: 500;
}

.bpc-routing-card__head span::before {
  content: "";
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
  border-radius: 50%;
  background: #49da84;
}

.bpc-ai-list {
  display: grid;
  gap: 20px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}

.bpc-ai-list li {
  display: grid;
  grid-template-columns: 63px 1fr;
  gap: 6px;
  align-items: center;
}

.bpc-ai-list .symbol {
  width: 26px;
  height: 26px;
  margin-top: 3px;
}

.bpc-ai-list .icon-check-circle {
  position: relative;
  display: block;
  width: 63px;
  height: 63px;
  color: transparent !important;
}

.bpc-ai-list .icon-check-circle::before {
  content: "";
  position: absolute;
  left: 9px;
  top: 7.2px;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: linear-gradient(90deg, #3c8beb 0%, #42b1b9 49.52%, #49da84 100%);
  box-shadow: 0 1.8px 9px rgba(0, 0, 0, 0.05);
}

.bpc-ai-list .icon-check-circle::after {
  content: "";
  position: absolute;
  left: 23.6px;
  top: 24.4px;
  width: 16.4px;
  height: 12px;
  background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='17' height='13' viewBox='0 0 17 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.663 1.988L6.663 11.988C6.576 12.076 6.473 12.145 6.359 12.192C6.245 12.24 6.123 12.264 5.999 12.264C5.876 12.264 5.754 12.24 5.64 12.192C5.526 12.145 5.422 12.076 5.335 11.988L0.96 7.613C0.873 7.526 0.804 7.422 0.756 7.309C0.709 7.195 0.685 7.073 0.685 6.949C0.685 6.826 0.709 6.704 0.756 6.59C0.804 6.476 0.873 6.372 0.96 6.285C1.047 6.198 1.151 6.129 1.265 6.082C1.379 6.034 1.501 6.01 1.624 6.01C1.748 6.01 1.87 6.034 1.984 6.082C2.097 6.129 2.201 6.198 2.288 6.285L6 9.997L15.337 0.662C15.513 0.486 15.752 0.387 16.001 0.387C16.25 0.387 16.489 0.486 16.665 0.662C16.841 0.838 16.94 1.077 16.94 1.326C16.94 1.575 16.841 1.814 16.665 1.99L16.663 1.988Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='17' height='13' viewBox='0 0 17 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.663 1.988L6.663 11.988C6.576 12.076 6.473 12.145 6.359 12.192C6.245 12.24 6.123 12.264 5.999 12.264C5.876 12.264 5.754 12.24 5.64 12.192C5.526 12.145 5.422 12.076 5.335 11.988L0.96 7.613C0.873 7.526 0.804 7.422 0.756 7.309C0.709 7.195 0.685 7.073 0.685 6.949C0.685 6.826 0.709 6.704 0.756 6.59C0.804 6.476 0.873 6.372 0.96 6.285C1.047 6.198 1.151 6.129 1.265 6.082C1.379 6.034 1.501 6.01 1.624 6.01C1.748 6.01 1.87 6.034 1.984 6.082C2.097 6.129 2.201 6.198 2.288 6.285L6 9.997L15.337 0.662C15.513 0.486 15.752 0.387 16.001 0.387C16.25 0.387 16.489 0.486 16.665 0.662C16.841 0.838 16.94 1.077 16.94 1.326C16.94 1.575 16.841 1.814 16.665 1.99L16.663 1.988Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
}

.bpc-ai-list strong {
  display: block;
  margin-bottom: 4px;
  font-size: 17px;
}

.bpc-ai-list p {
  margin: 0;
  color: #666;
  font-size: 14px;
}

.bpc-ai__copy .feature-list--bpc {
  display: grid;
  gap: 20px;
  max-width: none;
  margin: 28px 0 0 !important;
  padding: 0;
  list-style: none;
}

.bpc-ai__copy .feature-list--bpc li {
  display: grid;
  grid-template-columns: 63px minmax(0, 1fr);
  gap: 6px;
  align-items: center;
  list-style: none;
}

.bpc-ai__copy .feature-list--bpc li::marker {
  content: "";
}

.bpc-ai__copy .feature-list--bpc .icon-check-circle {
  position: relative;
  display: block;
  width: 63px;
  height: 63px;
  color: transparent !important;
  font-size: 0;
  line-height: 0;
}

.bpc-ai__copy .feature-list--bpc .icon-check-circle::before {
  content: "";
  position: absolute;
  left: 9px;
  top: 7.2px;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: linear-gradient(90deg, #3c8beb 0%, #42b1b9 49.52%, #49da84 100%);
  box-shadow: 0 1.8px 9px rgba(0, 0, 0, 0.05);
}

.bpc-ai__copy .feature-list--bpc .icon-check-circle::after {
  content: "";
  position: absolute;
  left: 23.6px;
  top: 24.4px;
  width: 16.4px;
  height: 12px;
  background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='17' height='13' viewBox='0 0 17 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.663 1.988L6.663 11.988C6.576 12.076 6.473 12.145 6.359 12.192C6.245 12.24 6.123 12.264 5.999 12.264C5.876 12.264 5.754 12.24 5.64 12.192C5.526 12.145 5.422 12.076 5.335 11.988L0.96 7.613C0.873 7.526 0.804 7.422 0.756 7.309C0.709 7.195 0.685 7.073 0.685 6.949C0.685 6.826 0.709 6.704 0.756 6.59C0.804 6.476 0.873 6.372 0.96 6.285C1.047 6.198 1.151 6.129 1.265 6.082C1.379 6.034 1.501 6.01 1.624 6.01C1.748 6.01 1.87 6.034 1.984 6.082C2.097 6.129 2.201 6.198 2.288 6.285L6 9.997L15.337 0.662C15.513 0.486 15.752 0.387 16.001 0.387C16.25 0.387 16.489 0.486 16.665 0.662C16.841 0.838 16.94 1.077 16.94 1.326C16.94 1.575 16.841 1.814 16.665 1.99L16.663 1.988Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='17' height='13' viewBox='0 0 17 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.663 1.988L6.663 11.988C6.576 12.076 6.473 12.145 6.359 12.192C6.245 12.24 6.123 12.264 5.999 12.264C5.876 12.264 5.754 12.24 5.64 12.192C5.526 12.145 5.422 12.076 5.335 11.988L0.96 7.613C0.873 7.526 0.804 7.422 0.756 7.309C0.709 7.195 0.685 7.073 0.685 6.949C0.685 6.826 0.709 6.704 0.756 6.59C0.804 6.476 0.873 6.372 0.96 6.285C1.047 6.198 1.151 6.129 1.265 6.082C1.379 6.034 1.501 6.01 1.624 6.01C1.748 6.01 1.87 6.034 1.984 6.082C2.097 6.129 2.201 6.198 2.288 6.285L6 9.997L15.337 0.662C15.513 0.486 15.752 0.387 16.001 0.387C16.25 0.387 16.489 0.486 16.665 0.662C16.841 0.838 16.94 1.077 16.94 1.326C16.94 1.575 16.841 1.814 16.665 1.99L16.663 1.988Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
}

.bpc-ai__copy .feature-list--bpc strong {
  display: block;
  margin-bottom: 4px;
}

.bpc-ai__copy .feature-list--bpc p {
  max-width: none;
  margin: 0;
  color: #000;
}

.bpc-security-grid {
  grid-template-columns: repeat(3, 1fr);
}

.bpc-security-card {
  min-height: 220px;
}

@media (max-width: 1120px) {
  .bpc-hero__grid,
  .bpc-problem__grid,
  .bpc-scenario__grid,
  .bpc-ai__grid {
    grid-template-columns: 1fr;
  }

  .bpc-hero__grid {
    gap: 46px;
    justify-content: stretch;
  }

  .bpc-chat-icon {
    left: 0;
  }

  .bpc-chat-window,
  .bpc-metrics-card,
  .bpc-flow-sheet,
  .bpc-routing-card {
    width: 100%;
  }

  .bpc-metrics-card,
  .bpc-flow-sheet,
  .bpc-routing-card {
    justify-self: stretch;
  }

  .bpc-agent-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 860px) {
  .bpc-hero {
    min-height: auto;
    padding: 66px 0 90px;
  }

  .bpc-hero__copy h1,
  .bpc-problem h2,
  .bpc-solution h2,
  .bpc-features h2,
  .bpc-scenario h2,
  .bpc-ai h2,
  .bpc-security h2 {
    font-size: 44px;
  }

  .bpc-features h2 {
    font-size: 34px;
  }

  .bpc-agent-grid,
  .bpc-security-grid {
    grid-template-columns: 1fr;
  }

  .bpc-process-flow {
    flex-wrap: wrap;
    justify-content: center;
  }

  .bpc-process-flow > .arrow-icon {
    flex: 0 0 28px;
  }

  .feature-list--bpc article {
    grid-template-columns: 60px 1fr;
    gap: 16px;
    align-items: start;
  }

  .feature-list--bpc {
    gap: 34px;
  }

  .feature-list--bpc h3 {
    font-size: 22px;
  }

  .feature-list--bpc p {
    font-size: 17px;
  }

  .feature-list--bpc .round-icon {
    width: 60px;
    height: 60px;
  }

  .feature-list--bpc .round-icon::before {
    width: 36px;
    height: 36px;
  }

  .feature-list--bpc p {
    grid-column: 2 / -1;
  }

  .bpc-ai__copy .feature-list--bpc p {
    grid-column: auto;
  }
}

@media (max-width: 620px) {
  .bpc-hero {
    padding: 52px 0 76px;
  }

  .bpc-hero__copy h1,
  .bpc-problem h2,
  .bpc-solution h2,
  .bpc-features h2,
  .bpc-scenario h2,
  .bpc-ai h2,
  .bpc-security h2 {
    font-size: 28px;
    line-height: 1.18;
  }

  .bpc-hero__copy p,
  .bpc-intro,
  .bpc-scenario__copy p,
  .bpc-ai__copy > p:not(.section-kicker),
  .bpc-security .bpc-intro,
  .bpc-problem__copy p {
    font-size: 16px;
  }

  .bpc-chat-stage {
    min-height: 0;
    padding: 0 0 28px;
  }

  .bpc-chat-icon {
    position: relative;
    top: auto;
    left: auto;
    width: 58px;
    height: 58px;
    margin: 0 0 14px 8px;
  }

  .bpc-chat-icon img,
  .bpc-chat-icon svg {
    width: 42px;
    height: 42px;
  }

  .bpc-chat-window,
  .bpc-metrics-card,
  .bpc-routing-card,
  .bpc-flow-sheet {
    padding: 20px 16px;
    border-radius: 16px;
  }

  .bpc-routing-card {
    min-height: 0;
  }

  .bpc-chat-window {
    min-height: 0;
  }

  .bpc-refresh {
    width: 58px;
    height: 58px;
    right: 4px;
    bottom: 0;
  }

  .bpc-refresh img {
    width: 40px;
    height: 40px;
  }

  .bpc-meter,
  .bpc-routing-row {
    gap: 8px;
    width: 100%;
  }

  .bpc-meter {
    flex-direction: column;
    align-items: stretch;
  }

  .bpc-routing-row {
    grid-template-columns: 1fr;
  }

  .bpc-meter div {
    flex-basis: auto;
    width: 100%;
  }

  .bpc-meter strong {
    align-self: flex-end;
    margin-left: 0;
  }

  .bpc-legend {
    display: grid;
    gap: 10px;
  }

  .bpc-agent-card,
  .bpc-security-card {
    min-height: 0;
  }

  .bpc-process-flow {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .bpc-process-flow > .arrow-icon {
    margin-top: 0;
    justify-self: center;
    transform: rotate(90deg);
  }

  .feature-list--bpc article {
    grid-template-columns: 46px 1fr;
  }

  .feature-list--bpc {
    gap: 28px;
  }

  .feature-list--bpc h3 {
    font-size: 18px;
  }

  .feature-list--bpc p {
    font-size: 15px;
  }

  .feature-list--bpc .round-icon {
    width: 46px;
    height: 46px;
  }

  .feature-list--bpc .round-icon::before {
    width: 28px;
    height: 28px;
  }

  .bpc-ai__copy .feature-list--bpc {
    gap: 18px;
  }

  .bpc-ai__copy .feature-list--bpc li {
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 8px;
  }

  .bpc-ai__copy .feature-list--bpc .icon-check-circle {
    width: 54px;
    height: 54px;
  }

  .bpc-ai__copy .feature-list--bpc .icon-check-circle::before {
    left: 7px;
    top: 6px;
    width: 40px;
    height: 40px;
  }

  .bpc-ai__copy .feature-list--bpc .icon-check-circle::after {
    left: 19.8px;
    top: 21.4px;
    width: 14.6px;
    height: 10.6px;
  }

  .bpc-ai__copy .feature-list--bpc p {
    grid-column: auto;
  }

  .bpc-flow-item {
    grid-template-columns: 28px 1fr;
  }

  .bubble-mark {
    width: 28px;
    height: 28px;
    font-size: 12px;
    flex-basis: 28px;
  }

  .bpc-chat-bubble {
    grid-template-columns: 28px 1fr;
    gap: 10px;
  }

  .bpc-chat-bubble > div {
    max-width: none;
  }
}