/* Desktop-only hero boards. Loaded with media=(min-width: 901px); shared/mobile rules remain in globals.css. */
.hero-video-card{
  position:absolute;
  z-index:8;
  width:218px;
  overflow:hidden;
  border:1px solid rgba(0,9,87,.09);
  border-radius:16px;
  background:rgba(255,255,255,.92);
  box-shadow:0 18px 48px rgba(0,9,87,.14);
  backdrop-filter:blur(14px);
  opacity:var(--story-cards);
  cursor:grab;
  user-select:none;
  touch-action:none;
  transform:translate3d(var(--drag-x,0),calc(var(--drag-y,0) + ((1 - var(--story-cards)) * 18px)),0) scale(calc(.965 + (var(--story-cards) * .035)));
  transition:opacity .22s ease,box-shadow .22s ease,border-color .22s ease,filter .22s ease;
  will-change:transform,opacity;
}
.hero-video-card.is-dragging{
  cursor:grabbing;
  z-index:12;
  box-shadow:0 26px 68px rgba(0,9,87,.2);
  transition:none;
}
.hero-video-card.is-active{
  border-color:rgba(17,50,192,.34);
  box-shadow:0 20px 54px rgba(17,50,192,.18);
}
.hero-video-card-media{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#f0f3fb;
}
.hero-video-card.is-portrait{width:158px}
.hero-video-card.is-portrait .hero-video-card-media{aspect-ratio:9/13.5}
.hero-video-card video{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  object-fit:cover;
  background:transparent;
}
.hero-video-card-placeholder{
  position:absolute;
  inset:0;
  z-index:1;
  display:grid;
  place-items:center;
  overflow:hidden;
  color:#1132c0;
  background:linear-gradient(145deg,#f5f7fd,#e9eefb);
  transition:opacity .2s ease;
}
.hero-video-card-placeholder.is-hidden{opacity:0}
.hero-video-card-placeholder img{object-fit:cover;object-position:center top;filter:saturate(.88)}
.hero-video-card-scrim{
  position:absolute;
  z-index:3;
  inset:auto 0 0;
  height:52%;
  pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(0,9,87,.42));
}
.hero-video-card-caption{
  position:absolute;
  z-index:4;
  right:12px;
  left:42px;
  bottom:10px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:right;
  color:#fff;
  pointer-events:none;
}
.hero-video-card-caption small{
  font-size:8.5px;
  line-height:1.4;
  color:rgba(255,255,255,.72);
  font-weight:var(--font-weight-bold);
}
.hero-video-card-caption b{
  margin-top:2px;
  font-size:11px;
  line-height:1.55;
  font-weight:var(--font-weight-extrabold);
}
.hero-video-card-action{
  position:absolute;
  z-index:6;
  left:9px;
  bottom:9px;
  width:28px;
  height:28px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.48);
  border-radius:9px;
  background:rgba(255,255,255,.9);
  color:#1132c0;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(0,9,87,.12);
}
.hero-video-card-action:focus-visible{outline:2px solid #1132c0;outline-offset:2px}
.hero-video-card-human{left:-72px;top:72px;transform-origin:right center}
.hero-video-card-customers{right:-88px;top:64px}
.hero-video-card-pipeline{left:-96px;bottom:62px}
.hero-video-card-management{right:-76px;bottom:48px}


.hero-smart-analytics{
  width:235px;
  min-height:178px;
  padding:12px 13px 11px;
  border-color:rgba(17,50,192,.14);
  background:
    linear-gradient(rgba(17,50,192,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(17,50,192,.04) 1px,transparent 1px),
    rgba(255,255,255,.97);
  background-size:21px 21px;
  color:#000957;
  cursor:grab;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.hero-smart-analytics::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 84% 12%,rgba(17,50,192,.08),transparent 38%);
}
.hero-smart-analytics>*{position:relative;z-index:1}
.hero-smart-analytics-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.hero-smart-analytics-head>span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:#1132c0;
  font-size:9.5px;
  font-weight:var(--font-weight-black);
}
.hero-smart-analytics-head>small{
  color:#8794aa;
  font-size:7.5px;
  font-weight:var(--font-weight-bold);
}
.hero-smart-analytics-chart{
  position:relative;
  min-height:91px;
  margin-top:4px;
  padding-left:42px;
}
.hero-smart-analytics-chart>svg{
  width:100%;
  height:91px;
  overflow:visible;
}
.hero-smart-analytics-chart circle{
  fill:#fff;
  stroke:#1132c0;
  stroke-width:2;
}
.hero-analytics-grid{
  fill:none;
  stroke:rgba(0,9,87,.08);
  stroke-width:1;
}
.hero-analytics-area{
  fill:rgba(17,50,192,.07);
  stroke:none;
}
.hero-analytics-line{
  fill:none;
  stroke:#1132c0;
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-dasharray:260;
  stroke-dashoffset:260;
  animation:heroAnalyticsDraw 2.1s ease .25s forwards;
}
.hero-smart-analytics-insight{
  min-height:34px;
  padding:6px 8px;
  border:1px solid #e0e7f3;
  border-radius:9px;
  background:rgba(248,250,255,.92);
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:6px;
  align-items:center;
}
.hero-smart-analytics-insight>span{
  display:inline-flex;
  align-items:center;
  gap:4px;
  color:#7786a0;
  font-size:7px;
  font-weight:var(--font-weight-bold);
  white-space:nowrap;
}
.hero-smart-analytics-insight>span svg{color:#1132c0}
.hero-smart-analytics-insight>b{
  min-width:0;
  color:#1b2f5e;
  font-size:9.2px;
  line-height:1.5;
  font-weight:var(--font-weight-extrabold);
  animation:heroAnalyticsInsight .32s ease both;
}

.hero-smart-whiteboard{
  width:230px;
  min-height:172px;
  padding:13px 14px 12px;
  border-color:rgba(17,50,192,.14);
  background:
    linear-gradient(rgba(17,50,192,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(17,50,192,.045) 1px,transparent 1px),
    rgba(255,255,255,.97);
  background-size:22px 22px;
  color:#000957;
  cursor:grab;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.hero-smart-whiteboard::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:radial-gradient(circle at 78% 18%,rgba(17,50,192,.08),transparent 38%);
}
.hero-smart-whiteboard>*{position:relative;z-index:1}
.hero-smart-whiteboard-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.hero-smart-whiteboard-head>span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:#1132c0;
  font-size:9.5px;
  font-weight:var(--font-weight-black);
}
.hero-smart-whiteboard-head>small{
  color:#8492aa;
  font-size:7.5px;
  font-weight:var(--font-weight-bold);
}
.hero-smart-whiteboard-body{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding:6px 3px 4px;
}
.hero-smart-whiteboard-line{
  min-height:31px;
  color:#000957;
  font-size:15px;
  line-height:1.8;
  font-weight:var(--font-weight-extrabold);
  display:inline-flex;
  align-items:center;
}
.hero-smart-whiteboard-cursor{
  width:2px;
  height:18px;
  margin-right:3px;
  border-radius:999px;
  background:#1132c0;
  animation:heroWhiteboardCursor .75s steps(1,end) infinite;
}
.hero-smart-whiteboard-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:#74829a;
}
.hero-smart-whiteboard-footer>span:first-child{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:7.5px;
  font-weight:var(--font-weight-bold);
}
.hero-smart-whiteboard-footer>span:first-child svg{color:#1132c0}
.hero-video-card-workflow.is-portrait{
  width:160px;
}
.hero-video-card-workflow.is-portrait .hero-video-card-media{
  aspect-ratio:9 / 14.2;
}
.hero-video-card-workflow video,
.hero-video-card-workflow .hero-video-card-placeholder img{
  object-position:center 46%;
  transform:scale(1.065);
  transform-origin:center center;
}

@media(hover:hover) and (pointer:fine){
  .hero-video-card:not(.is-dragging):hover{
    border-color:rgba(17,50,192,.22);
    box-shadow:0 22px 58px rgba(0,9,87,.17);
  }
}

@media(max-width:1280px) and (min-width:901px){
  .hero-video-card{width:194px}
  .hero-video-card.is-portrait{width:142px}
  .hero-video-card-human{left:-48px;top:60px}
  .hero-video-card-customers{right:-54px;top:56px}
  .hero-video-card-pipeline{left:-58px;bottom:52px}
  .hero-video-card-management{right:-48px;bottom:46px}
}

@media(prefers-reduced-motion:reduce){
  .hero-video-card{opacity:1!important;transform:translate3d(var(--drag-x,0),var(--drag-y,0),0)!important;transition:none!important}
}
@media (min-width:1281px){
  .hero-video-card{width:202px}
  .hero-video-card.is-portrait{width:150px}
  .hero-video-card-human{
    left:-174px;
    top:58px;
  }
  .hero-video-card-customers{
    right:-224px;
    top:132px;
  }
  .hero-video-card-pipeline{
    left:-226px;
    bottom:58px;
  }
  .hero-video-card-management{
    right:-214px;
    bottom:8px;
  }
  .hero-video-card-workflow.is-portrait{
    right:-184px;
    bottom:-8px;
  }
}

@media (min-width:901px) and (max-width:1280px){
  .hero-video-card{width:158px}
  .hero-video-card.is-portrait{width:126px}
  .hero-video-card-human{left:-146px;top:54px}
  .hero-video-card-customers{right:-176px;top:108px}
  .hero-video-card-pipeline{left:-178px;bottom:48px}
  .hero-video-card-management{right:-174px;bottom:4px}
  .hero-video-card-workflow.is-portrait{right:-152px;bottom:-5px}
}

.hero-video-card[role='button']{cursor:pointer}
.hero-video-card[role='button'].is-dragging{cursor:grabbing}
.hero-video-card[role='button']:focus-visible{
  outline:2px solid rgba(17,50,192,.45);
  outline-offset:4px;
}
@media (min-width:1281px){
  .hero-video-card:not(.is-portrait){width:222px}
}

@media (min-width:901px) and (max-width:1280px){
  .hero-video-card:not(.is-portrait){width:176px}
}
@media (min-width:1281px){
  .hero-video-card:not(.is-portrait){width:238px}
  .hero-video-card-customers{right:-252px}
  .hero-video-card-management{right:-246px}
}

@media (min-width:901px) and (max-width:1280px){
  .hero-video-card:not(.is-portrait){width:188px}
  .hero-video-card-customers{right:-198px}
  .hero-video-card-management{right:-196px}
}
@media (min-width:1281px){
  .hero-smart-whiteboard{min-height:148px}
}
@media (min-width:901px) and (max-width:1280px){
  .hero-smart-whiteboard{
    min-height:126px;
    padding:11px 12px 10px;
  }
  .hero-smart-whiteboard-line{font-size:11px}
  .hero-smart-whiteboard-head>small{display:none}
  .hero-video-card-workflow.is-portrait{width:132px}
}
@media(prefers-reduced-motion:reduce){
  .hero-smart-whiteboard-cursor{animation:none!important}
}
@media (min-width:1281px){
  .hero-smart-analytics{min-height:150px}
}
@media (min-width:901px) and (max-width:1280px){
  .hero-smart-analytics{
    min-height:128px;
    padding:10px 11px 9px;
  }
  .hero-smart-analytics-head>small{display:none}
  .hero-smart-analytics-chart{
    min-height:58px;
    padding-left:34px;
  }
  .hero-smart-analytics-chart>svg{height:58px}
  .hero-smart-analytics-insight>b{font-size:7.3px}
}
@media(prefers-reduced-motion:reduce){
  .hero-analytics-line,
  .hero-smart-analytics-insight>b{
    animation:none!important;
    stroke-dashoffset:0!important;
    transform:none!important;
    opacity:1!important;
  }
}
@media (min-width:1281px){
  .hero-smart-whiteboard{
    width:244px;
    min-height:180px;
    padding:15px 16px 13px;
  }
  .hero-smart-analytics{
    width:248px;
    min-height:184px;
    padding:14px 15px 12px;
  }
  .hero-smart-analytics-chart{
    min-height:95px;
    padding-left:46px;
  }
  .hero-smart-analytics-chart>svg{height:95px}
  .hero-smart-whiteboard-body{min-height:62px}
  .hero-smart-whiteboard-footer>span:first-child{font-size:8px}
}

@media (min-width:901px) and (max-width:1280px){
  .hero-smart-whiteboard{
    width:200px;
    min-height:146px;
    padding:12px 13px 11px;
  }
  .hero-smart-whiteboard-line{font-size:12.5px}
  .hero-smart-analytics{
    width:205px;
    min-height:148px;
  }
  .hero-smart-analytics-chart{
    min-height:67px;
    padding-left:38px;
  }
  .hero-smart-analytics-chart>svg{height:67px}
}
@media (hover:hover) and (pointer:fine) and (min-width:901px){
  .hero-smart-whiteboard:hover,
  .hero-smart-analytics:hover{
    border-color:rgba(17,50,192,.24);
    box-shadow:0 22px 58px rgba(0,9,87,.16);
  }
}
.hero-smart-whiteboard.is-dragging,
.hero-smart-analytics.is-dragging{
  cursor:grabbing;
}
.hero-smart-analytics-chart{overflow:visible}
.hero-smart-analytics-chart>svg{position:relative;z-index:1}
.hero-analytics-point{
  transform-box:fill-box;
  transform-origin:center;
  animation:heroAnalyticsPointSoft 4.2s ease-in-out infinite;
}
.hero-analytics-point-1{animation-delay:.55s}
.hero-analytics-point-2{animation-delay:1.35s}
.hero-analytics-point-3{animation-delay:2.15s}
.hero-smart-analytics-insight{
  position:relative;
  overflow:hidden;
}
.hero-smart-analytics-insight::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 34%,rgba(255,255,255,.72) 49%,transparent 64%);
  transform:translateX(-140%);
  animation:heroAnalyticsInsightGlow 6.4s ease-in-out infinite;
}
.hero-smart-analytics-insight>*{position:relative;z-index:1}
.hero-smart-analytics-insight>b{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
@media (prefers-reduced-motion:reduce){
  .hero-analytics-point,
  .hero-smart-analytics-insight::after{animation:none!important}
}
.hero-smart-analytics-chart{
  min-height:96px;
  margin-top:6px;
  padding:0;
  overflow:hidden;
  border-radius:10px;
  background:linear-gradient(180deg,rgba(255,255,255,.68),rgba(248,250,255,.34));
}
.hero-smart-analytics-chart>svg{
  display:block;
  width:100%;
  height:96px;
  overflow:visible;
}
.hero-analytics-grid{
  fill:none;
  stroke:rgba(0,9,87,.075);
  stroke-width:.8;
  vector-effect:non-scaling-stroke;
}
.hero-analytics-baseline{
  fill:none;
  stroke:rgba(0,9,87,.14);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}
.hero-analytics-area-clean{
  fill:url(#heroAnalyticsAreaGradient);
  opacity:0;
  animation:heroAnalyticsAreaIn .7s ease .18s forwards;
}
.hero-analytics-line-clean{
  fill:none;
  stroke:#1132c0;
  stroke-width:2.5;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
  stroke-dasharray:260;
  stroke-dashoffset:260;
  animation:heroAnalyticsCleanDraw 1.45s cubic-bezier(.2,.75,.25,1) .12s forwards;
}
.hero-analytics-point-clean,
.hero-analytics-point-latest{
  fill:#fff;
  stroke:#1132c0;
  stroke-width:2;
  vector-effect:non-scaling-stroke;
}
.hero-analytics-point-clean{
  opacity:0;
  animation:heroAnalyticsPointIn .32s ease forwards;
}
.hero-analytics-point-clean:nth-of-type(1){animation-delay:.58s}
.hero-analytics-point-clean:nth-of-type(2){animation-delay:.82s}
.hero-analytics-point-clean:nth-of-type(3){animation-delay:1.06s}
.hero-analytics-guide{
  stroke:rgba(17,50,192,.18);
  stroke-width:1;
  stroke-dasharray:3 4;
  vector-effect:non-scaling-stroke;
}
.hero-analytics-point-halo{
  fill:rgba(17,50,192,.11);
  stroke:none!important;
  transform-box:fill-box;
  transform-origin:center;
  animation:heroAnalyticsLatestHalo 3.2s ease-in-out 1.4s infinite;
}
.hero-analytics-point-latest{
  filter:drop-shadow(0 2px 4px rgba(17,50,192,.18));
}
.hero-smart-analytics-insight::after{display:none!important}

@media (min-width:901px) and (max-width:1280px){
  .hero-smart-analytics-chart{min-height:72px}
  .hero-smart-analytics-chart>svg{height:72px}
}

@media(prefers-reduced-motion:reduce){
  .hero-analytics-area-clean,
  .hero-analytics-line-clean,
  .hero-analytics-point-clean,
  .hero-analytics-point-halo{animation:none!important}
  .hero-analytics-area-clean{opacity:1}
  .hero-analytics-line-clean{stroke-dashoffset:0}
  .hero-analytics-point-clean{opacity:1}
}

.hero-analytics-point-latest{animation:none!important}
.hero-smart-analytics-chart::after{
  content:"";
  position:absolute;
  z-index:1;
  top:0;
  bottom:0;
  left:0;
  width:28%;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(17,50,192,.055),transparent);
  transform:translateX(-145%);
  animation:heroAnalyticsChartSweep 5.8s cubic-bezier(.45,0,.2,1) 1.25s infinite;
}
.hero-smart-analytics-chart>svg{position:relative;z-index:2}
.hero-analytics-point-clean{
  transform-box:fill-box;
  transform-origin:center;
}
.hero-analytics-point-1{
  animation:heroAnalyticsPointIn .32s ease .58s forwards,
            heroAnalyticsPointPulse 4.6s ease-in-out 1.75s infinite;
}
.hero-analytics-point-2{
  animation:heroAnalyticsPointIn .32s ease .82s forwards,
            heroAnalyticsPointPulse 4.6s ease-in-out 2.55s infinite;
}
.hero-analytics-point-3{
  animation:heroAnalyticsPointIn .32s ease 1.06s forwards,
            heroAnalyticsPointPulse 4.6s ease-in-out 3.35s infinite;
}
.hero-analytics-point-latest{
  transform-box:fill-box;
  transform-origin:center;
  animation:heroAnalyticsLatestPoint 4.6s ease-in-out 1.45s infinite!important;
}
.hero-analytics-area-clean{
  animation:heroAnalyticsAreaIn .7s ease .18s forwards,
            heroAnalyticsAreaBreath 5.6s ease-in-out 1.2s infinite;
}
.hero-smart-analytics-insight>span svg{
  transform-origin:center;
  animation:heroAnalyticsSparkle 3.8s ease-in-out 1.2s infinite;
}

@media(prefers-reduced-motion:reduce){
  .hero-smart-analytics-chart::after,
  .hero-analytics-point-1,
  .hero-analytics-point-2,
  .hero-analytics-point-3,
  .hero-analytics-point-latest,
  .hero-analytics-area-clean,
  .hero-smart-analytics-insight>span svg{animation:none!important}
  .hero-smart-analytics-chart::after{display:none!important}
  .hero-analytics-point-1,
  .hero-analytics-point-2,
  .hero-analytics-point-3{opacity:1}
  .hero-analytics-area-clean{opacity:1}
}
.hero-smart-analytics-head{
  min-height:18px;
}
.hero-analytics-topic-dots{
  display:inline-flex;
  align-items:center;
  gap:4px;
  direction:ltr;
}
.hero-analytics-topic-dots button{
  width:5px;
  height:5px;
  padding:0;
  border:0;
  border-radius:999px;
  background:#cbd5e8;
  cursor:pointer;
  transition:width .28s ease,background-color .28s ease,box-shadow .28s ease;
}
.hero-analytics-topic-dots button.is-active{
  width:14px;
  background:#1132c0;
  box-shadow:0 0 0 3px rgba(17,50,192,.08);
}
.hero-analytics-topic-dots button:focus-visible{
  outline:2px solid rgba(17,50,192,.55);
  outline-offset:2px;
}
.hero-smart-analytics-chart{
  min-height:92px;
  height:92px;
  margin-top:5px;
  padding:0;
  overflow:hidden;
  isolation:isolate;
}
.hero-smart-analytics-chart::after{
  display:none!important;
}
.hero-analytics-view{
  position:absolute!important;
  inset:0;
  z-index:1!important;
  display:block;
  width:100%!important;
  height:92px!important;
  padding-top:14px;
  animation:heroAnalyticsViewIn .48s cubic-bezier(.2,.75,.25,1) both;
}
.hero-analytics-line-view .hero-analytics-line-clean{
  animation:heroAnalyticsCleanDraw 1.05s cubic-bezier(.2,.75,.25,1) .08s forwards;
}
.hero-analytics-line-view .hero-analytics-area-clean{
  animation:heroAnalyticsAreaIn .48s ease .12s forwards;
}
.hero-analytics-line-view .hero-analytics-point-clean{
  animation-duration:.26s;
}
.hero-analytics-funnel-bar{
  fill:url(#heroAnalyticsFunnelGradient);
  transform-box:fill-box;
  transform-origin:center;
  opacity:0;
  animation:heroAnalyticsFunnelBarIn .5s cubic-bezier(.2,.75,.25,1) forwards;
}
.hero-analytics-funnel-bar-1{animation-delay:.06s}
.hero-analytics-funnel-bar-2{animation-delay:.15s;opacity:.88}
.hero-analytics-funnel-bar-3{animation-delay:.24s;opacity:.76}
.hero-analytics-funnel-bar-4{animation-delay:.33s;opacity:.64}
.hero-analytics-funnel-labels text{
  fill:#fff;
  font-size:6px;
  font-family:inherit;
  font-weight:var(--font-weight-bold);
  dominant-baseline:middle;
  pointer-events:none;
}
.hero-analytics-donut-track{
  fill:none!important;
  stroke:#e8edf7!important;
  stroke-width:10!important;
}
.hero-analytics-donut-segment{
  fill:none!important;
  stroke-width:10!important;
  stroke-linecap:round;
  transform-box:fill-box;
  transform-origin:center;
  opacity:0;
  animation:heroAnalyticsDonutIn .62s cubic-bezier(.2,.75,.25,1) forwards;
}
.hero-analytics-donut-segment-1{
  stroke:#1132c0!important;
  stroke-dasharray:42 58;
  stroke-dashoffset:0;
  animation-delay:.05s;
}
.hero-analytics-donut-segment-2{
  stroke:#6f8cff!important;
  stroke-dasharray:31 69;
  stroke-dashoffset:-46;
  animation-delay:.16s;
}
.hero-analytics-donut-segment-3{
  stroke:#b7c6ff!important;
  stroke-dasharray:21 79;
  stroke-dashoffset:-81;
  animation-delay:.27s;
}
.hero-analytics-donut-value{
  fill:#000957;
  font-size:10px;
  font-family:inherit;
  font-weight:var(--font-weight-black);
}
.hero-analytics-donut-caption{
  fill:#7d8ca6;
  font-size:5.8px;
  font-family:inherit;
  font-weight:var(--font-weight-bold);
}
.hero-smart-analytics-insight{
  min-height:34px;
  overflow:hidden;
  animation:heroAnalyticsInsightSwap .38s ease both;
}
.hero-smart-analytics-insight>b{
  animation:none!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media (min-width:901px) and (max-width:1280px){
  .hero-smart-analytics-chart,
  .hero-analytics-view{height:72px!important;min-height:72px}
  .hero-analytics-view{padding-top:11px}
}

@media (prefers-reduced-motion:reduce){
  .hero-analytics-view,
  .hero-analytics-funnel-bar,
  .hero-analytics-donut-segment,
  .hero-smart-analytics-insight{animation:none!important}
  .hero-analytics-funnel-bar,
  .hero-analytics-donut-segment{opacity:1}
}
.hero-smart-analytics{
  width:248px;
  min-height:206px;
  padding:13px 13px 12px;
  border:1px solid rgba(17,50,192,.13);
  border-radius:18px;
  background:rgba(255,255,255,.975);
  box-shadow:0 18px 46px rgba(0,9,87,.105);
  gap:8px;
  justify-content:flex-start;
}
.hero-smart-analytics::before{
  background:linear-gradient(180deg,rgba(17,50,192,.035),transparent 32%);
  border-radius:inherit;
}
.hero-smart-analytics-head{
  min-height:35px;
  align-items:center;
  gap:8px;
}
.hero-smart-analytics-title{
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
}
.hero-smart-analytics-title>i{
  flex:0 0 auto;
  width:30px;
  height:30px;
  border:1px solid rgba(17,50,192,.09);
  border-radius:9px;
  background:#f0f4ff;
  color:#1132c0;
  display:grid;
  place-items:center;
}
.hero-smart-analytics-title>span{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:right;
}
.hero-smart-analytics-title b{
  color:#000957;
  font-size:10.2px;
  line-height:1.45;
  font-weight:var(--font-weight-black);
  white-space:nowrap;
}
.hero-smart-analytics-title small{
  margin-top:1px;
  color:#8996ac;
  font-size:6.6px;
  line-height:1.45;
  font-weight:var(--font-weight-semibold);
  white-space:nowrap;
}
.hero-analytics-topic-dots{
  margin-inline-start:auto;
  gap:4px;
}
.hero-analytics-topic-dots button{
  width:5px;
  height:5px;
  background:#d7e0f1;
}
.hero-analytics-topic-dots button.is-active{
  width:15px;
  background:#1132c0;
  box-shadow:none;
}
.hero-analytics-summary{
  min-height:30px;
  padding:4px 7px;
  border:1px solid #e3e9f4;
  border-radius:10px;
  background:#fbfcff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  animation:heroAnalyticsSummaryIn .3s ease both;
}
.hero-analytics-summary>span{
  min-width:0;
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:#526482;
  font-size:7.3px;
  line-height:1;
  font-weight:var(--font-weight-bold);
  white-space:nowrap;
}
.hero-analytics-summary>span svg{color:#1132c0}
.hero-analytics-summary>strong{
  flex:0 0 auto;
  min-height:20px;
  padding:4px 7px;
  border-radius:8px;
  background:#eef3ff;
  color:#1132c0;
  font-size:7.8px;
  line-height:1;
  font-weight:var(--font-weight-black);
  white-space:nowrap;
}
.hero-smart-analytics-chart{
  position:relative;
  min-height:86px;
  height:86px;
  margin:0;
  padding:0;
  overflow:hidden;
  border:1px solid #edf1f7;
  border-radius:12px;
  background:#fff;
}
.hero-smart-analytics-chart>svg,
.hero-analytics-view{
  height:86px!important;
  padding-top:0!important;
}
.hero-analytics-view{
  inset:0;
  animation:heroAnalyticsViewIn .36s cubic-bezier(.2,.75,.25,1) both;
}
.hero-analytics-grid{
  stroke:rgba(0,9,87,.065);
  stroke-width:.7;
}
.hero-analytics-baseline{
  stroke:rgba(0,9,87,.10);
}
.hero-analytics-line-clean{
  stroke-width:2.2;
}
.hero-analytics-funnel-tracks rect{
  fill:#eef2f8;
  stroke:none;
}
.hero-analytics-funnel-bar{
  fill:url(#heroAnalyticsFunnelGradient);
  transform-origin:left center;
  opacity:0;
  animation:heroAnalyticsFunnelBarIn .44s cubic-bezier(.2,.75,.25,1) forwards;
}
.hero-analytics-funnel-bar-1{animation-delay:.04s}
.hero-analytics-funnel-bar-2{animation-delay:.12s;opacity:.88}
.hero-analytics-funnel-bar-3{animation-delay:.20s;opacity:.76}
.hero-analytics-funnel-bar-4{animation-delay:.28s;opacity:.64}
.hero-analytics-funnel-labels text{
  fill:#64738f;
  font-size:6.7px;
  font-family:inherit;
  font-weight:var(--font-weight-bold);
  dominant-baseline:middle;
}
.hero-analytics-donut-track{stroke:#edf1f7!important}
.hero-analytics-donut-segment{stroke-width:9!important}
.hero-analytics-donut-segment-1{
  stroke:#1132c0!important;
  stroke-dasharray:42 58;
  stroke-dashoffset:0;
  animation-delay:.05s;
}
.hero-analytics-donut-segment-2{
  stroke:#6f8cff!important;
  stroke-dasharray:31 69;
  stroke-dashoffset:-46;
  animation-delay:.16s;
}
.hero-analytics-donut-segment-3{
  stroke:#bfd0ff!important;
  stroke-dasharray:27 73;
  stroke-dashoffset:-80;
  animation-delay:.27s;
}
.hero-analytics-source-card{
  display:grid;
  grid-template-columns:72px minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:7px 9px;
  direction:ltr;
}
.hero-analytics-source-donut-svg{
  width:72px;
  height:72px;
  display:block;
  overflow:visible;
}
.hero-analytics-source-list{
  min-width:0;
  display:grid;
  gap:6px;
  direction:rtl;
}
.hero-analytics-source-item{
  min-width:0;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:6px;
}
.hero-analytics-source-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  display:block;
}
.hero-analytics-source-dot-1{background:#1132c0}
.hero-analytics-source-dot-2{background:#6f8cff}
.hero-analytics-source-dot-3{background:#bfd0ff}
.hero-analytics-source-item>span{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:7px;
  padding-bottom:4px;
  border-bottom:1px solid #eef2f8;
}
.hero-analytics-source-item:last-child>span{padding-bottom:0;border-bottom:0}
.hero-analytics-source-item b{
  min-width:0;
  color:#455778;
  font-size:6.8px;
  line-height:1.45;
  font-weight:var(--font-weight-bold);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.hero-analytics-source-item small{
  flex:0 0 auto;
  color:#1132c0;
  font-size:6.6px;
  line-height:1;
  font-weight:var(--font-weight-black);
}
.hero-analytics-donut-value{font-size:10.2px}
.hero-analytics-donut-caption{font-size:5.6px}
.hero-smart-analytics-insight{
  min-height:42px;
  padding:7px 8px;
  border:1px solid #dfe6f3;
  border-radius:11px;
  background:linear-gradient(180deg,#fbfcff,#f7f9ff);
  display:grid;
  grid-template-columns:27px minmax(0,1fr);
  gap:7px;
  align-items:center;
  animation:heroAnalyticsInsightSwap .32s ease both;
}
.hero-smart-analytics-insight>i{
  width:27px;
  height:27px;
  border-radius:8px;
  background:#edf3ff;
  color:#1132c0;
  display:grid;
  place-items:center;
}
.hero-smart-analytics-insight>span{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:1px;
  white-space:normal;
  color:inherit;
}
.hero-smart-analytics-insight>span small{
  color:#8b97aa;
  font-size:6.2px;
  line-height:1.35;
  font-weight:var(--font-weight-bold);
}
.hero-smart-analytics-insight>span b{
  max-width:100%;
  color:#1a2c5d;
  font-size:7.6px;
  line-height:1.55;
  font-weight:var(--font-weight-extrabold);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.hero-smart-analytics-insight::after{display:none!important}

@media (min-width:901px) and (max-width:1280px){
  .hero-smart-analytics{
    width:214px;
    min-height:174px;
    padding:10px 10px 9px;
    gap:6px;
  }
  .hero-smart-analytics-head{min-height:30px}
  .hero-smart-analytics-title>i{width:26px;height:26px;border-radius:8px}
  .hero-smart-analytics-title b{font-size:8.7px}
  .hero-smart-analytics-title small{font-size:5.7px}
  .hero-analytics-summary{min-height:26px;padding:3px 6px}
  .hero-analytics-summary>span{font-size:6.5px}
  .hero-analytics-summary>strong{font-size:6.8px;min-height:18px;padding:3px 6px}
  .hero-smart-analytics-chart,
  .hero-smart-analytics-chart>svg,
  .hero-analytics-view{height:70px!important;min-height:70px}
  .hero-analytics-source-card{grid-template-columns:58px minmax(0,1fr);gap:7px;padding:6px 7px}
  .hero-analytics-source-donut-svg{width:58px;height:58px}
  .hero-analytics-source-item{gap:5px}
  .hero-analytics-source-item b{font-size:6px}
  .hero-analytics-source-item small{font-size:5.8px}
  .hero-smart-analytics-insight{min-height:35px;padding:5px 6px;grid-template-columns:23px minmax(0,1fr);gap:5px}
  .hero-smart-analytics-insight>i{width:23px;height:23px}
  .hero-smart-analytics-insight>span small{font-size:5.5px}
  .hero-smart-analytics-insight>span b{font-size:6.6px}
  .hero-analytics-funnel-labels text{font-size:6px}
}

@media (prefers-reduced-motion:reduce){
  .hero-analytics-summary{animation:none!important}
}