/* ==========================================================================
   LeadVector — Home page styles
   Loaded AFTER css/bootstrap.min.css (Bootstrap 5.2.3, unmodified) and
   overrides it to give the page its design.

   1. Bootstrap overrides — undo Bootstrap reboot defaults the design does
      not use and neutralise Bootstrap components whose class names collide
      with page classes (.btn, .nav).
   2. Page styles.
   3. Segment tile charts (Chart.js 4.5.1).
   ========================================================================== */

/* ---------- 1. Bootstrap overrides ---------- */
:root{scroll-behavior:auto}
body{line-height:normal}
img,svg{vertical-align:baseline}
button{font-family:revert;font-size:revert;line-height:revert}
body{-webkit-text-size-adjust:revert;text-size-adjust:revert;-webkit-tap-highlight-color:revert}
h1,h2,h3,h4{font-weight:revert;line-height:revert}
button,[type=button],[type=reset]{-webkit-appearance:revert;appearance:revert}
/* Bootstrap's a:hover colour would repaint links whose colour comes from a class */
.entryDoor:hover{color:#fff}
.insightTile:hover{color:#0B1220}

/* Page classes that collide with Bootstrap components (.btn, .nav).
   Bootstrap's .btn states read these variables, so they are pointed at the
   page's own colours: hover/focus/active look exactly like the design. */
.btn{
  user-select:revert;vertical-align:revert;
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:var(--primary);
  --bs-btn-hover-border-color:currentColor;
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:color-mix(in srgb,var(--primary)92%,#fff);
  --bs-btn-active-border-color:currentColor;
}
.btn.secondary{
  --bs-btn-hover-bg:color-mix(in srgb,var(--accent)55%,#0B1230);
  --bs-btn-active-bg:color-mix(in srgb,var(--accent)64%,#0B1230);
}
.btn:focus-visible{outline:revert}
:root{
--font:Onest,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

/* LeadVector typography system */
--fs-nav:15px;
--fs-btn:15px;
--fs-input:17px;
--fs-body:19px;
--fs-hint:15px;
--fs-suggest-section:15px;
--fs-suggest-name:18px;
--fs-suggest-meta:15px;
--fs-h1:clamp(40px,4.85vw,64px);
--lh-tight:1.08;
--lh-title:1.12;
--lh-body:1.58;
--lh-ui:1.32;
--fw-regular:400;
--fw-medium:500;
--fw-semibold:600;
--fw-display:650;--bg0:#060816;--bg1:#0B1230;--primary:#335CFF;--accent:#8A64FF;--r:6px;--btn-font:15px;--btn-line:21px;--auth-h:38px;--cta-h:52px}
*{box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}html,body{height:100%}body{margin:0;font-family:var(--font);background:linear-gradient(180deg,var(--bg0),var(--bg1));color:#fff;overflow-x:hidden}button{font-family:var(--font)}.hero{min-height:100vh;position:relative;overflow:visible}.bg{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(720px 340px at 45% 38%,color-mix(in srgb,var(--primary)55%,transparent),transparent 60%),radial-gradient(660px 340px at 100% 100%,color-mix(in srgb,var(--accent)40%,transparent),transparent 66%);filter:saturate(1.12)}.wrap{width:min(1160px,100%);margin:0 auto;padding:24px 22px 0}.brand{display:flex;align-items:center;height:42px;cursor:pointer}.brandLogo{display:block;width:168px;height:auto}
.brandLogo .logoVectorRest,
.brandLogo .logoArrow path{fill:color-mix(in srgb,var(--primary)85%,white);transition:fill .2s ease,transform .24s cubic-bezier(.2,.8,.2,1)}
.brandLogo .logoArrow{transform-box:fill-box;transform-origin:center}
.brandLogo .logoArrowRight{transform-box:fill-box;transform-origin:50% 100%}
.brand:hover .brandLogo .logoVectorRest,
.brand:hover .brandLogo .logoArrow path{fill:var(--primary)}.btn{height:var(--cta-h);padding:0 24px;border-radius:7px;border:0;font-size:16px;line-height:20px;font-weight:500;background:var(--primary);color:#fff;cursor:pointer;min-width:220px;display:inline-flex;align-items:center;justify-content:center;gap:10px;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision;letter-spacing:-.012em;transition:background-color .16s ease,transform .16s ease}.btn:hover{background:color-mix(in srgb,var(--primary)92%,#fff)}.btn.secondary{background:color-mix(in srgb,var(--accent)55%,#0B1230)}.btn.secondary:hover{background:color-mix(in srgb,var(--accent)64%,#0B1230)}.center{min-height:calc(100vh - 70px);display:flex;align-items:center;justify-content:center;padding:0 0 44px}.block{max-width:900px;text-align:center}h1{margin:0 0 16px;font-size:var(--fs-h1);font-weight:650;line-height:var(--lh-title);letter-spacing:-.035em}.sub{margin:0 auto 28px;max-width:74ch;color:rgba(255,255,255,.82);font-size:var(--fs-body);font-weight:400;line-height:var(--lh-body);letter-spacing:-.012em}/* Clean white suggestion dropdown */
/* Clean white suggestion dropdown */.hl{position:relative;display:inline-block;padding:0 .12em;z-index:0}.hl:before{content:"";position:absolute;left:-.11em;right:-.11em;bottom:.09em;height:.84em;background:linear-gradient(90deg,color-mix(in srgb,var(--primary)82%,transparent) 0%,color-mix(in srgb,var(--accent)74%,transparent) 50%,color-mix(in srgb,var(--primary)82%,transparent) 100%);opacity:.72;border-radius:14px;transform:rotate(-1.1deg);filter:blur(.35px);z-index:-1}


.highlightsSection{position:relative;background:#F7F9FC;color:#0B1220;padding:92px 22px 108px;font-family:var(--font)}
.highlightsWrap{width:min(1160px,100%);margin:0 auto}
.highlightsHeader{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:42px;align-items:end;margin-bottom:30px}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:32px;
  padding:0 12px;
  border-radius:999px;
  background:#ECFDF3;
  color:#079455;
  font-size:14px;
  line-height:1;
  font-weight:500;
  letter-spacing:-.012em;
  margin-bottom:18px;
}
.eyebrowDot{
  width:7px;
  height:7px;
  border-radius:999px;
  background:#12B76A;
  box-shadow:0 0 0 5px rgba(18,183,106,.10);
  animation:lvPulse 1.6s infinite;
}
@keyframes lvPulse{
  0%{transform:scale(1);opacity:1}
  50%{transform:scale(1.4);opacity:.6}
  100%{transform:scale(1);opacity:1}
}
.highlightsTitle{margin:0;max-width:780px;font-size:clamp(34px,3.8vw,52px);line-height:1.08;font-weight:650;letter-spacing:-.04em;color:#0B1220}
.highlightsLead{margin:0 0 4px;color:#667085;font-size:18px;line-height:1.55;font-weight:400;letter-spacing:-.012em}
.tileGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.insightTile{position:relative;min-height:292px;display:flex;flex-direction:column;justify-content:space-between;padding:22px;border:1px solid #E6EAF2;border-radius:26px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.035);text-decoration:none;color:#0B1220;overflow:hidden;isolation:isolate;transition:box-shadow .28s cubic-bezier(.16,1,.3,1),border-color .28s ease,background .28s ease}
.insightTile:before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(420px 200px at 80% 0%,rgba(51,92,255,.06),transparent 65%);
  opacity:0;
  transition:opacity .3s ease;
  pointer-events:none;
  z-index:0;
}
.insightTile:hover{border-color:#D9E1F2;box-shadow:0 18px 56px rgba(15,23,42,.10),0 4px 14px rgba(15,23,42,.045);z-index:2}
.insightTile:hover:before{opacity:1}
.tileTop,.tileBottom{position:relative;z-index:1;transition:transform .30s cubic-bezier(.16,1,.3,1)}
.tileMeta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.tileMetricRow{display:flex;align-items:flex-end;justify-content:space-between;gap:14px}
.tileMetric{font-size:42px;line-height:.98;font-weight:500;letter-spacing:-.055em;color:#0B1220}
.tileChart{width:100%;height:82px;margin:22px 0 4px}
.barChart{display:flex;align-items:flex-end;gap:7px;height:84px;margin:20px 0 4px}
.tileText{margin:0 0 18px;color:#667085;font-size:16px;line-height:1.48;font-weight:400;letter-spacing:-.014em}
.tileCTA{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:17px;border-top:1px solid #EEF2F6}
.tileCTA strong{font-size:15px;line-height:1;font-weight:500;color:#079455;letter-spacing:-.014em}
.tileCTA span{width:30px;height:30px;border-radius:999px;display:grid;place-items:center;background:#F3F6FB;color:#079455;transition:transform .18s ease,background .18s ease}
.insightTile:hover .tileCTA span{transform:translateX(2px);background:#335CFF;color:#fff}
.tileCTA svg{width:16px;height:16px;stroke-width:2}
.filterPreview{display:none}
.insightTile:hover .filterPreview{display:none}
.filterChip{height:28px;display:inline-flex;align-items:center;padding:0 10px;border-radius:999px;background:#F7F9FC;border:1px solid #E6EAF2;color:#596579;font-size:13px;font-weight:400;letter-spacing:-.012em}
.insightTile.featured{
  grid-column:span 2;
  background:#fff;
}
.insightTile.featured .tileMetric{font-size:56px}
.tableHint{margin-top:22px;display:flex;align-items:flex-start;gap:12px;padding:16px 18px;border-radius:18px;background:#fff;border:1px solid #E6EAF2;color:#667085;font-size:15px;line-height:1.45;letter-spacing:-.012em}
.tableHintIcon{width:34px;height:34px;flex:0 0 34px;border-radius:999px;display:grid;place-items:center;background:#ECFDF3;color:#079455}
.tableHintIcon svg{width:18px;height:18px}.tableHint b{color:#0B1220;font-weight:500}
@media(max-width:980px){.highlightsHeader{grid-template-columns:1fr;gap:18px}.tileGrid{grid-template-columns:1fr 1fr}.insightTile.featured{
  grid-column:span 2;
  background:#fff;
}}
@media(max-width:680px){.highlightsSection{padding:68px 18px 78px}.tileGrid{grid-template-columns:1fr}.insightTile.featured{
  grid-column:span 2;
  background:#fff;
}.insightTile.featured .tileMetric{font-size:44px}}

/* Typography hierarchy:
   H1 40–64 / 650
   Body lead 19 / 400
   Search input 17 / 400
   Suggest section 15 / 400
   Suggest title 18 / 400
   Suggest meta 15 / 400
   Nav/buttons 15–16 / 400–500
*/
@media(max-width:760px){.sub br{display:none}}

.brandLogo .logoArrowMoving{
  transform-box:fill-box;
  transform-origin:50% 50%;
  transition:fill .2s ease,transform .28s cubic-bezier(.16,1,.3,1);
}
.brand:hover .brandLogo .logoArrowMoving{
  transform:translate(4px,-4px);
}


.insightTile:hover .tileTop{transform:translateY(-2px)}
.insightTile:hover .tileBottom{transform:translateY(-1px)}
.insightTile .tileCTA strong{transition:color .24s ease}
.insightTile:hover .tileCTA strong{color:#2448E8}
@media (prefers-reduced-motion: reduce){
  .insightTile,.tileTop,.tileBottom,.tileCTA span,.tileCTA strong{transition:none!important;transform:none!important}
}


/* Chart redraw on hover */


/* v45 fix: unified 0.5s chart redraw without layout break */

/* remove old stagger delays from v43 */


/* v46: reliable chart rebuild - normalized SVG line length + smoother unified timing */


/* v47: visible line redraw layer */


/* v48: slower bar animation */


/* v49: LeadVector radius system for highlight tiles */
:root{
  --lv-radius-card:8px;
  --lv-radius-inner:6px;
  --lv-radius-bar:6px;
}

.insightTile{
  border-radius:var(--lv-radius-card)!important;
}

.insightTile:before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(420px 200px at 80% 0%,rgba(51,92,255,.06),transparent 65%);
  opacity:0;
  transition:opacity .3s ease;
  pointer-events:none;
  z-index:0;
}


.filterChip,
.tableHint,
.tableHintIcon,
.tileCTA span{
  border-radius:var(--lv-radius-inner)!important;
}

.eyebrow{
  border-radius:var(--lv-radius-inner)!important;
}


.insightTile.featured{
  grid-column:span 2;
  background:#fff;
}


/* v53: clean 3 palette: white / dark violet / dark blue */

/* DARK VIOLET */
.insightTile.violet{
  background:linear-gradient(180deg,#1A1333,#0E0A1F)!important;
  color:#fff;
  border-color:rgba(255,255,255,.06)!important;
}
.insightTile.violet .tileMetric,
.insightTile.violet .tileCTA strong{color:#fff!important;}
.insightTile.violet .tileText{color:rgba(255,255,255,.7)!important;}
.insightTile.violet .tileCTA span{background:rgba(255,255,255,.1)!important;color:#fff!important;}
.insightTile.violet:hover .tileCTA span{background:#fff!important;color:#6F4EFF!important;}
.insightTile.violet:before{
  background:radial-gradient(420px 220px at 78% 0%,rgba(138,100,255,.07),transparent 66%)!important;
}

/* DARK BLUE */
.insightTile.blue{
  background:linear-gradient(180deg,#0E1B2E,#0A1220)!important;
  color:#fff;
  border-color:rgba(255,255,255,.06)!important;
}
.insightTile.blue .tileMetric,
.insightTile.blue .tileCTA strong{color:#fff!important;}
.insightTile.blue .tileText{color:rgba(255,255,255,.7)!important;}
.insightTile.blue .tileCTA span{background:rgba(255,255,255,.1)!important;color:#fff!important;}
.insightTile.blue:hover .tileCTA span{background:#fff!important;color:#3B82F6!important;}
.insightTile.blue:before{
  background:radial-gradient(420px 220px at 78% 0%,rgba(59,130,246,.07),transparent 66%)!important;
}


/* v54: refined violet (lighter + slight burgundy tint) */
.insightTile.violet{
  background:linear-gradient(180deg,#2A1E3F,#140F24)!important;
  color:#fff;
  border-color:rgba(255,255,255,.06)!important;
}
.insightTile.violet:before{
  background:radial-gradient(420px 220px at 78% 0%,rgba(180,90,255,.10),rgba(120,40,90,.06),transparent 70%)!important;
}
.insightTile.violet:hover{
  box-shadow:0 22px 64px rgba(40,18,60,.28),0 6px 20px rgba(40,18,60,.14)!important;
}
.insightTile.violet:hover .tileCTA span{
  color:#A78BFA!important;
}


/* v55: premium solid bars - no gradient */

/* semantic solid colors by tile type */


/* v62: CTA blue on white tiles */
.insightTile:not(.violet):not(.blue) .tileCTA strong{
  color:#335CFF !important;
}
.insightTile:not(.violet):not(.blue) .tileCTA span{
  background:#EEF2FF !important;
  color:#335CFF !important;
}
.insightTile:not(.violet):not(.blue):hover .tileCTA span{
  background:#335CFF !important;
  color:#fff !important;
}


/* v63: unify typography across hero and highlights */
:root{
  --fs-h1:clamp(42px,5vw,66px);
  --fs-body:20px;
  --fs-input:18px;
}

h1{
  font-size:var(--fs-h1)!important;
  line-height:1.08!important;
  font-weight:650!important;
  letter-spacing:-.04em!important;
}

.sub{
  font-size:20px!important;
  line-height:1.55!important;
  letter-spacing:-.014em!important;
  color:rgba(255,255,255,.83)!important;
}

.highlightsTitle{
  font-size:clamp(36px,3.9vw,54px)!important;
  line-height:1.08!important;
  font-weight:650!important;
  letter-spacing:-.04em!important;
}

.highlightsLead{
  font-size:19px!important;
  line-height:1.52!important;
  letter-spacing:-.014em!important;
}

/* Suggest should always float over the next screen */
.hero,
.wrap,
.center,
.block{
  z-index:10;
}

/* Prevent the next section from covering the dropdown while it is open */
.highlightsSection{
  position:relative;
  z-index:1;
}



/* v77: clean explainer video block */
.videoSection{
  position:relative;
  background:#fff;
  color:#0B1220;
  padding:96px 22px 104px;
  font-family:var(--font);
  overflow:hidden;
}
.videoSection:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(720px 340px at 16% 10%,rgba(51,92,255,.055),transparent 62%),
    radial-gradient(620px 300px at 90% 78%,rgba(138,100,255,.055),transparent 64%);
  pointer-events:none;
}
.videoWrap{
  width:min(1160px,100%);
  margin:0 auto;
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,390px) minmax(0,1fr);
  gap:54px;
  align-items:center;
}
.videoTitle{
  margin:0;
  font-size:clamp(34px,3.7vw,52px);
  line-height:1.08;
  font-weight:650;
  letter-spacing:-.04em;
  color:#0B1220;
}
.videoLead{
  margin:18px 0 0;
  color:#667085;
  font-size:19px;
  line-height:1.52;
  font-weight:400;
  letter-spacing:-.014em;
}
.videoBullets{
  display:grid;
  gap:12px;
  margin:28px 0 0;
  padding:0;
  list-style:none;
}
.videoBullets li{
  display:grid;
  grid-template-columns:26px minmax(0,1fr);
  gap:10px;
  align-items:start;
  color:#475467;
  font-size:16px;
  line-height:1.45;
  letter-spacing:-.012em;
}
.videoBulletIcon{
  width:26px;
  height:26px;
  border-radius:8px;
  display:grid;
  place-items:center;
  background:#EEF2FF;
  color:#335CFF;
  margin-top:1px;
  align-self:start;
  flex-shrink:0;
}
.videoBulletIcon svg{
  width:15px;
  height:15px;
  stroke-width:2.2;
}
.videoPlayer{
  position:relative;
  border-radius:12px;
  border:1px solid #E2E8F0;
  background:#0B1220;
  box-shadow:0 26px 80px rgba(15,23,42,.16),0 5px 18px rgba(15,23,42,.07);
  overflow:hidden;
  aspect-ratio:16/9;
  cursor:pointer;
  isolation:isolate;
}
.videoPlayer:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(255,255,255,.08),transparent 18%),
    radial-gradient(520px 260px at 72% 22%,rgba(51,92,255,.42),transparent 64%),
    radial-gradient(480px 240px at 26% 74%,rgba(138,100,255,.26),transparent 65%),
    linear-gradient(180deg,#10182F,#0A1020);
  z-index:0;
}
.videoPlayer:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.36));
  z-index:2;
  pointer-events:none;
}
.videoPlay{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:76px;
  height:76px;
  border-radius:999px;
  background:#fff;
  color:#335CFF;
  display:grid;
  place-items:center;
  z-index:4;
  box-shadow:0 18px 42px rgba(0,0,0,.22),0 0 0 10px rgba(255,255,255,.14);
  transition:transform .22s cubic-bezier(.16,1,.3,1),box-shadow .22s ease;
}
.videoPlayer:hover .videoPlay{
  transform:translate(-50%,-50%) scale(1.045);
  box-shadow:0 22px 48px rgba(0,0,0,.26),0 0 0 12px rgba(255,255,255,.16);
}
.videoPlay svg{
  width:28px;
  height:28px;
  margin-left:3px;
}
.videoModal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:28px;
  background:rgba(6,8,22,.78);
  backdrop-filter:blur(12px);
}
.videoModal.is-open{
  display:flex;
}
.videoModalFrame{
  position:relative;
  width:min(1040px,100%);
  aspect-ratio:16/9;
  border-radius:14px;
  background:#050816;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 40px 110px rgba(0,0,0,.45);
  overflow:hidden;
}
.videoClose{
  position:absolute;
  right:16px;
  top:16px;
  z-index:2;
  width:40px;
  height:40px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:8px;
  background:rgba(255,255,255,.08);
  color:#fff;
  cursor:pointer;
  display:grid;
  place-items:center;
}
.videoClose svg{
  width:19px;
  height:19px;
}
@media(max-width:980px){
  .videoSection{padding:72px 18px 82px}
  .videoWrap{grid-template-columns:1fr;gap:34px}
}
@media(max-width:620px){
  .videoPlayer{border-radius:10px}
  .videoPlay{width:62px;height:62px}
}


/* v71: Data Flow integrated - symmetric disorder + middle entry + 5 dots */
.dataFlowSection{
  position:relative;
  background:#fff;
  color:#0B1220;
  padding:96px 22px 112px;
  font-family:var(--font);
  overflow:hidden;
}
.dataFlowSection:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(760px 360px at 18% 14%,rgba(138,100,255,.07),transparent 62%),
    radial-gradient(620px 300px at 86% 72%,rgba(51,92,255,.055),transparent 64%);
  pointer-events:none;
}
.dataFlowWrap{
  width:min(1160px,100%);
  margin:0 auto;
  position:relative;
  z-index:1;
}
.dataFlowHead{
  max-width:760px;
  margin:0 auto 54px;
  text-align:center;
}
.flowEyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:32px;
  padding:0 12px;
  border-radius:8px;
  background:#F3F6FB;
  color:#5D6878;
  font-size:14px;
  line-height:1;
  font-weight:500;
  letter-spacing:-.012em;
  margin-bottom:18px;
}
.flowEyebrowDot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#8A64FF;
  box-shadow:0 0 0 5px rgba(138,100,255,.10);
}
.dataFlowTitle{
  margin:0;
  font-size:clamp(36px,4vw,54px);
  line-height:1.08;
  font-weight:650;
  letter-spacing:-.04em;
  color:#0B1220;
}
.dataFlowLead{
  margin:16px auto 0;
  max-width:640px;
  color:#667085;
  font-size:19px;
  line-height:1.52;
  font-weight:400;
  letter-spacing:-.014em;
}
.flowCanvas{
  position:relative;
  min-height:540px;
}
.flowSvg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
  z-index:1;
}
.flowLine{
  fill:none;
  stroke:#7B3FE4;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.78;
}
.flowLineGhost{
  fill:none;
  stroke:#7B3FE4;
  stroke-width:7;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.09;
  filter:blur(.55px);
}
.flowPacket{
  fill:#8A64FF;
  filter:drop-shadow(0 0 9px rgba(138,100,255,.62));
}
.flowCard{
  position:absolute;
  z-index:2;
  width:280px;
  height:216px;
  padding:22px;
  border-radius:8px;
  background:#fff;
  border:1px solid #E6EAF2;
  box-shadow:0 10px 30px rgba(15,23,42,.07),0 1px 2px rgba(15,23,42,.035);
  transition:transform .28s cubic-bezier(.16,1,.3,1),box-shadow .28s ease,border-color .28s ease;
  overflow:hidden;
}
.flowCard:hover{
  transform:translateY(-3px);
  border-color:#D9E1F2;
  box-shadow:0 18px 48px rgba(15,23,42,.10),0 4px 12px rgba(15,23,42,.045);
}
.flowCardIcon{
  width:40px;
  height:40px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:linear-gradient(180deg,#F7F9FC,#EEF2F7);
  color:#536176;
  margin-bottom:18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 1px 2px rgba(15,23,42,.04);
}
.flowCardIcon svg{
  width:21px;
  height:21px;
  stroke-width:1.85;
}
.flowCardIcon .rubleIcon{
  font-size:21px;
  line-height:1;
  font-weight:600;
  letter-spacing:-.04em;
  transform:translateY(-1px);
}
.flowCard h3{
  margin:0 0 9px;
  color:#101828;
  font-size:20px;
  line-height:1.22;
  font-weight:500;
  letter-spacing:-.025em;
}
.flowCard p{
  margin:0;
  color:#667085;
  font-size:16px;
  line-height:1.47;
  letter-spacing:-.014em;
}

/* Симметричный беспорядок: 1 → 2 → 3 → 4 → 5 */
.flowCard.source{left:0;top:58px}
.flowCard.signal{left:196px;top:344px}
.flowCard.magic{left:392px;top:96px}
.flowCard.score{right:110px;top:0}
.flowCard.result{right:0;top:278px}

.flowCard.magic{
  color:#fff;
  background:
    radial-gradient(300px 160px at 84% 0%,rgba(138,100,255,.28),transparent 62%),
    linear-gradient(180deg,#2A1E3F,#140F24);
  border-color:rgba(255,255,255,.08);
  box-shadow:0 18px 56px rgba(24,14,46,.22);
}
.flowCard.magic:before{
  content:"";
  position:absolute;
  inset:-40px;
  background-image:radial-gradient(circle,rgba(255,255,255,.20) 0 1px,transparent 1.6px);
  background-size:18px 18px;
  opacity:.12;
  animation:magicNoise 8s linear infinite;
}
.flowCard.magic>*{position:relative;z-index:1}
.flowCard.magic .flowCardIcon,
.flowCard.result .flowCardIcon{
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.07));
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 1px 2px rgba(0,0,0,.10);
}
.flowCard.magic h3,
.flowCard.result h3{color:#fff}
.flowCard.magic p{color:rgba(255,255,255,.72)}
.flowCard.result{
  color:#fff;
  background:
    radial-gradient(300px 160px at 84% 0%,rgba(59,130,246,.18),transparent 62%),
    linear-gradient(180deg,#0E1B2E,#0A1220);
  border-color:rgba(255,255,255,.08);
}
.flowCard.result p{color:rgba(255,255,255,.72)}

@keyframes magicNoise{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(18px,18px,0)}
}
@media(max-width:980px){
  .dataFlowSection{padding:72px 18px 84px}
  .flowCanvas{min-height:auto;display:grid;gap:14px}
  .flowSvg{display:none}
  .flowCard,
  .flowCard.source,
  .flowCard.signal,
  .flowCard.magic,
  .flowCard.score,
  .flowCard.result{
    position:relative;
    left:auto;
    right:auto;
    top:auto;
    width:100%;
    height:auto;
    min-height:168px;
  }
}
@media (prefers-reduced-motion: reduce){
  .flowCard{transition:none!important}
  .flowCard:hover{transform:none!important}
  .flowCard.magic:before{animation:none!important}
}



/* v79: centered intro */

.videoIntro{
  width:min(760px,100%);
  margin:0 auto 46px;
  text-align:center;
}

.videoTitleSingle{
  font-size:clamp(34px,3.3vw,48px);
}
.videoCopy .videoLead{
  margin-top:0;
  margin-bottom:2px;
}

.videoIntro .videoLead{
  margin-left:auto;
  margin-right:auto;
}

/* v78: video block balance + subtle animated preview */
.videoWrap{
  grid-template-columns:minmax(0,430px) minmax(0,1fr);
  gap:58px;
}
.videoCopy{
  min-height:430px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.videoBullets{
  gap:15px;
  margin-top:30px;
}
.videoPlayer{
  max-height:430px;
}
.videoPlayer:before{
  animation:videoGlowDrift 9s ease-in-out infinite alternate;
}
@keyframes videoGlowDrift{
  from{
    background:
      linear-gradient(180deg,rgba(255,255,255,.08),transparent 18%),
      radial-gradient(520px 260px at 70% 22%,rgba(51,92,255,.38),transparent 64%),
      radial-gradient(480px 240px at 26% 74%,rgba(138,100,255,.22),transparent 65%),
      linear-gradient(180deg,#10182F,#0A1020);
  }
  to{
    background:
      linear-gradient(180deg,rgba(255,255,255,.08),transparent 18%),
      radial-gradient(560px 280px at 76% 28%,rgba(51,92,255,.46),transparent 64%),
      radial-gradient(500px 260px at 20% 68%,rgba(138,100,255,.30),transparent 65%),
      linear-gradient(180deg,#10182F,#0A1020);
  }
}
@media(max-width:980px){
  .videoCopy{
    min-height:auto;
    justify-content:flex-start;
  }
  .videoPlayer{
    max-height:none;
  }
}
@media (prefers-reduced-motion: reduce){
  .videoPlayer:before{
    animation:none!important;
  }
}


/* v83: hero-native scroll CTA, no white peek */
.heroScrollCue{
  position:absolute;
  left:50%;
  bottom:28px;
  transform:translateX(-50%);
  z-index:12;
  height:46px;
  padding:0 9px 0 10px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.075);
  color:rgba(255,255,255,.84);
  backdrop-filter:blur(16px);
  box-shadow:0 18px 52px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.10);
  cursor:pointer;
  user-select:none;
  transition:transform .22s cubic-bezier(.16,1,.3,1),background .22s ease,border-color .22s ease,color .22s ease;
}
.heroScrollCue:hover{
  transform:translateX(-50%) translateY(-2px);
  background:rgba(255,255,255,.105);
  border-color:rgba(255,255,255,.22);
  color:#fff;
}
.heroScrollPlay{
  width:30px;
  height:30px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#fff;
  color:#335CFF;
  box-shadow:0 0 0 5px rgba(255,255,255,.08);
}
.heroScrollPlay svg{
  width:14px;
  height:14px;
  margin-left:2px;
}
.heroScrollText{
  font-size:14.5px;
  line-height:1;
  font-weight:400;
  letter-spacing:-.012em;
  white-space:nowrap;
}
.heroScrollArrow{
  width:30px;
  height:30px;
  border-radius:999px;
  display:grid;
  place-items:center;
  color:rgba(255,255,255,.72);
  animation:heroScrollNudge 1.9s ease-in-out infinite;
}
.heroScrollArrow svg{
  width:22px;
  height:22px;
}
@keyframes heroScrollNudge{
  0%,100%{transform:translateY(-1px)}
  50%{transform:translateY(2px)}
}
@media(max-width:760px){
  .heroScrollCue{
    bottom:18px;
    max-width:calc(100% - 36px);
  }
  .heroScrollText{
    overflow:hidden;
    text-overflow:ellipsis;
  }
}
@media (prefers-reduced-motion: reduce){
  .heroScrollArrow{animation:none!important}
}


/* v84: features grid + big animated product screen */
.featuresSection{
  position:relative;
  background:#F7F9FC;
  color:#0B1220;
  padding:104px 22px 118px;
  font-family:var(--font);
  overflow:hidden;
}
.featuresSection:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(720px 340px at 12% 16%,rgba(51,92,255,.055),transparent 62%),
    radial-gradient(640px 300px at 90% 84%,rgba(138,100,255,.055),transparent 64%);
  pointer-events:none;
}
.featuresWrap{
  width:min(1160px,100%);
  margin:0 auto;
  position:relative;
  z-index:1;
}
.featuresHead{
  max-width:780px;
  margin:0 auto 54px;
  text-align:center;
}
.featuresTitle{
  margin:0;
  font-size:clamp(36px,4vw,54px);
  line-height:1.08;
  font-weight:650;
  letter-spacing:-.04em;
  color:#0B1220;
}
.featuresLead{
  margin:16px auto 0;
  max-width:660px;
  color:#667085;
  font-size:19px;
  line-height:1.52;
  font-weight:400;
  letter-spacing:-.014em;
}
/* v85: editorial features list */
.featuresGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:26px 34px;
  margin:0 0 34px;
}
.featureCard{
  position:relative;
  min-height:auto;
  padding:0 0 18px;
  background:transparent;
  border:none;
  border-radius:0;
  box-shadow:none;
  overflow:visible;
  transition:transform .22s cubic-bezier(.16,1,.3,1),opacity .22s ease;
}
.featureCard:before{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:56px;
  height:2px;
  border-radius:99px;
  background:linear-gradient(90deg,#335CFF,#8A64FF);
  opacity:.9;
}
.featureCard:hover{
  transform:translateY(-2px);
}
.featureCard:hover:before{
  width:74px;
  transition:width .24s ease;
}
.featureCard h3{
  margin:0 0 10px;
  color:#101828;
  font-size:21px;
  line-height:1.18;
  font-weight:600;
  letter-spacing:-.032em;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
.featureCard p{
  margin:0;
  color:#667085;
  font-size:17px;
  line-height:1.62;
  letter-spacing:-.014em;
  max-width:94%;
}

.productDemo{
  position:relative;
  margin-top:26px;
  border-radius:14px;
  border:1px solid #E2E8F0;
  background:#0B1220;
  box-shadow:0 30px 90px rgba(15,23,42,.17),0 6px 18px rgba(15,23,42,.07);
  overflow:hidden;
  min-height:690px;
  isolation:isolate;
}
.productDemo:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(620px 300px at 72% 10%,rgba(51,92,255,.34),transparent 64%),
    radial-gradient(560px 260px at 12% 88%,rgba(138,100,255,.22),transparent 65%),
    linear-gradient(180deg,#10182F,#080D1A);
  animation:demoGlow 10s ease-in-out infinite alternate;
  z-index:0;
}
@keyframes demoGlow{
  from{
    filter:saturate(1);
    transform:scale(1);
  }
  to{
    filter:saturate(1.12);
    transform:scale(1.015);
  }
}
@media(max-width:980px){
  .featuresSection{padding:76px 18px 86px}
  .featuresGrid{grid-template-columns:1fr 1fr}
  .productDemo{min-height:auto}
}
@media(max-width:680px){
  .featuresGrid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion: reduce){
  .productDemo:before{
    animation:none!important;
  }
}


/* v87: who / why / data sections */
.audienceSection{
  position:relative;
  background:#fff;
  padding:108px 22px 112px;
  overflow:hidden;
}
.audienceWrap,
.whyWrap,
.dataWrap{
  width:min(1160px,100%);
  margin:0 auto;
  position:relative;
  z-index:1;
}
.audienceHead{
  max-width:760px;
  margin:0 auto 56px;
  text-align:center;
}
.audienceTitle,
.whyTitle,
.dataTitle{
  margin:0;
  color:#0B1220;
  font-size:clamp(36px,4vw,54px);
  line-height:1.08;
  font-weight:650;
  letter-spacing:-.04em;
}
.audienceGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:38px 52px;
  max-width:1040px;
  margin:0 auto;
}
.audienceItem{
  display:grid;
  grid-template-columns:56px minmax(0,1fr);
  gap:18px;
  align-items:start;
}
.audienceIcon{
  width:56px;
  height:56px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:rgba(51,92,255,.08);
  color:#335CFF;
  border:1px solid rgba(51,92,255,.12);
}
.audienceIcon svg{
  width:26px;
  height:26px;
}
.audienceItem h3{
  margin:2px 0 10px;
  font-size:32px;
  line-height:1.08;
  letter-spacing:-.035em;
  font-weight:520;
  color:#101828;
}
.audienceItem p{
  margin:0;
  max-width:92%;
  color:#667085;
  font-size:18px;
  line-height:1.58;
  letter-spacing:-.014em;
}
.audienceOutro{
  max-width:760px;
  margin:78px auto 0;
  text-align:center;
}
.audienceOutro h3{
  margin:0 0 18px;
  font-size:42px;
  line-height:1.1;
  letter-spacing:-.04em;
  font-weight:600;
  color:#0B1220;
}
.audienceOutro p{
  margin:0 auto;
  max-width:680px;
  color:#667085;
  font-size:19px;
  line-height:1.62;
}

.whySection{
  position:relative;
  background:#090E1E;
  color:#fff;
  padding:112px 22px 118px;
  overflow:hidden;
}
.whySection:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(760px 320px at 10% 0%,rgba(51,92,255,.16),transparent 64%),
    radial-gradient(620px 260px at 90% 100%,rgba(138,100,255,.16),transparent 64%);
}
.whyHead{
  margin:0 auto 58px;
  text-align:center;
}
.whyTitle{
  color:#fff;
}
.whyGrid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:34px;
}
.whyItem{
  position:relative;
  padding:0 0 22px;
}
.whyItem:after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:58px;
  height:2px;
  border-radius:99px;
  background:linear-gradient(90deg,#4E7BFF,#8A64FF);
}
.whyIcon{
  width:56px;
  height:56px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
  color:#7EA2FF;
  margin-bottom:22px;
}
.whyIcon svg{
  width:26px;
  height:26px;
}
.whyItem h3{
  margin:0 0 14px;
  font-size:31px;
  line-height:1.08;
  letter-spacing:-.035em;
  font-weight:520;
  color:#fff;
}
.whyItem p{
  margin:0;
  color:rgba(255,255,255,.68);
  font-size:17px;
  line-height:1.62;
}

.dataSection{
  position:relative;
  background:#F7F9FC;
  padding:112px 22px 122px;
  overflow:hidden;
}
.dataSection:before{
  content:"";
  position:absolute;
  inset:0;
  background-image:radial-gradient(rgba(51,92,255,.08) 1px,transparent 1px);
  background-size:22px 22px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.55),transparent 100%);
  opacity:.35;
}
.dataHead{
  text-align:center;
  margin:0 auto 68px;
}
.dataGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:48px 40px;
}
.dataMetric{
  text-align:center;
}
.dataValue{
  display:block;
  color:#335CFF;
  font-size:clamp(62px,7vw,112px);
  line-height:.92;
  letter-spacing:-.06em;
  font-weight:620;
  margin-bottom:14px;
}
.dataLabel{
  display:block;
  color:#101828;
  font-size:28px;
  line-height:1.08;
  letter-spacing:-.03em;
  font-weight:520;
  margin-bottom:12px;
}
.dataDesc{
  max-width:320px;
  margin:0 auto;
  color:#667085;
  font-size:17px;
  line-height:1.58;
}
@media(max-width:980px){
  .audienceGrid,
  .whyGrid,
  .dataGrid{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:720px){
  .audienceGrid,
  .whyGrid,
  .dataGrid{
    grid-template-columns:1fr;
  }
  .audienceItem h3,
  .whyItem h3{
    font-size:26px;
  }
  .audienceOutro h3{
    font-size:34px;
  }
}


/* v88: typography unification + dark violet data card */
.audienceItem h3,
.whyItem h3{
  font-size:21px !important;
  line-height:1.18 !important;
  font-weight:600 !important;
  letter-spacing:-.032em !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}

.audienceItem p,
.whyItem p{
  font-size:17px !important;
  line-height:1.62 !important;
  letter-spacing:-.014em !important;
}

.audienceItem p{
  max-width:96%;
}

.audienceOutro h3{
  font-size:clamp(32px,3.4vw,44px) !important;
  line-height:1.1 !important;
  letter-spacing:-.04em !important;
}

.audienceOutro p{
  font-size:18px !important;
  line-height:1.62 !important;
}

.whyGrid{
  gap:40px;
}

.dataSection{
  background:#F7F9FC !important;
  padding:96px 22px 112px !important;
}

.dataSection:before{
  opacity:.18 !important;
}

.dataWrap{
  max-width:1160px;
  background:
    radial-gradient(720px 340px at 16% 8%,rgba(138,100,255,.26),transparent 62%),
    radial-gradient(620px 300px at 88% 86%,rgba(51,92,255,.22),transparent 64%),
    linear-gradient(180deg,#1A1333,#0B1024);
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  padding:78px 64px 84px;
  box-shadow:0 30px 90px rgba(15,23,42,.18),0 8px 22px rgba(15,23,42,.08);
  overflow:hidden;
}

.dataTitle{
  color:#fff !important;
}

.dataValue{
  color:#8A64FF !important;
  text-shadow:0 0 34px rgba(138,100,255,.16);
}

.dataLabel{
  color:#fff !important;
  font-size:21px !important;
  line-height:1.18 !important;
  font-weight:600 !important;
  letter-spacing:-.032em !important;
}

.dataDesc{
  color:rgba(255,255,255,.66) !important;
  font-size:17px !important;
  line-height:1.62 !important;
}

@media(max-width:980px){
  .dataWrap{
    padding:62px 28px 68px;
  }
}

@media(max-width:720px){
  .dataWrap{
    padding:52px 20px 58px;
    border-radius:12px;
  }
}


/* v89: premium audience icons + live counters */
.audienceIcon{
  width:48px !important;
  height:48px !important;
  border-radius:12px !important;
  background:#F5F7FB !important;
  color:#335CFF !important;
  border:1px solid rgba(51,92,255,.10) !important;
  box-shadow:none !important;
}
.audienceIcon svg{
  width:23px !important;
  height:23px !important;
  stroke-width:1.85 !important;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.audienceItem{
  grid-template-columns:48px minmax(0,1fr) !important;
  gap:18px !important;
}

.dataValue{
  font-variant-numeric:tabular-nums;
}
.dataValue .countSuffix{
  display:inline-block;
  margin-left:.04em;
}
.dataValue.is-counting{
  animation:dataCounterGlow 1.15s ease-out both;
}
@keyframes dataCounterGlow{
  0%{filter:brightness(1.35);text-shadow:0 0 38px rgba(138,100,255,.28)}
  100%{filter:brightness(1);text-shadow:0 0 34px rgba(138,100,255,.16)}
}


/* v91: flat no-frame audience icons + gradient strokes */
.audienceIcon{
  background:#F5F7FB !important;
  border:0 !important;
  box-shadow:none !important;
}


/* v95: safe inline gradient icons, no layout side effects */
.audienceIcon{
  width:48px !important;
  height:48px !important;
  border-radius:12px !important;
  background:#F5F7FB !important;
  color:#335CFF !important;
  border:0 !important;
  box-shadow:none !important;
  position:relative;
}
.audienceIcon svg{
  width:23px !important;
  height:23px !important;
}


/* v96: stable large metrics in one line */


/* v97: fix long data metrics wrapping in "Наши данные" */
.dataValue{
  white-space:nowrap !important;
}

.dataValue .countSuffix{
  display:inline !important;
  margin-left:.02em !important;
}


/* v98: unified data stats typography - all big metrics same size */
.dataValue{
  font-size:clamp(62px,5.15vw,92px) !important;
  line-height:.92 !important;
  letter-spacing:-.065em !important;
  font-weight:650 !important;
  white-space:nowrap !important;
}

.dataValue .countSuffix{
  display:inline !important;
  margin-left:.015em !important;
}

@media(max-width:980px){
  .dataValue{
    font-size:clamp(56px,8vw,84px) !important;
  }
}


/* v99: final CTA block */



/* v101: inline CTA under "Наши данные" */
.simpleCta{
  padding:56px 0 0;
}

.simpleCtaWrap{
  width:min(1160px,100%);
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

.simpleCtaTitle{
  margin:0;
  color:#0B1220;
  font-size:clamp(34px,3.8vw,52px);
  line-height:1.08;
  font-weight:650;
  letter-spacing:-.045em;
  max-width:920px;
}

.simpleCtaActions{
  margin-top:30px;
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  justify-content:center;
}

.simpleCtaActions .btn{
  min-width:220px;
}

@media(max-width:760px){
  .simpleCta{
    padding-top:42px;
  }

  .simpleCtaActions{
    width:100%;
  }

  .simpleCtaActions .btn{
    width:100%;
  }
}



/* v102: CTA directly under "Наши данные" */
.simpleCta{
  padding:56px 0 0 !important;
  background:transparent !important;
}

.simpleCtaWrap{
  width:min(1160px,100%);
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.simpleCtaTitle{
  margin:0 !important;
  color:#0B1220 !important;
  font-size:clamp(32px,3.4vw,48px) !important;
  line-height:1.08 !important;
  font-weight:650 !important;
  letter-spacing:-.045em !important;
  max-width:920px;
}

.simpleCtaActions{
  margin-top:28px !important;
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
}


/* v103: visible inline CTA between data card and footer */
.simpleCta{
  display:block !important;
  background:#F7F9FC !important;
  padding:54px 22px 84px !important;
  margin:0 !important;
  color:#0B1220 !important;
}

.simpleCtaWrap{
  width:min(1160px,100%) !important;
  margin:0 auto !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
}

.simpleCtaTitle{
  margin:0 !important;
  color:#0B1220 !important;
  opacity:1 !important;
  visibility:visible !important;
  font-size:clamp(34px,3.7vw,52px) !important;
  line-height:1.08 !important;
  font-weight:650 !important;
  letter-spacing:-.045em !important;
  max-width:920px !important;
}

.simpleCtaActions{
  margin-top:30px !important;
  display:flex !important;
  justify-content:center !important;
  gap:14px !important;
  flex-wrap:wrap !important;
  opacity:1 !important;
  visibility:visible !important;
}

.simpleCtaActions .btn{
  min-width:220px !important;
}

@media(max-width:760px){
  .simpleCta{
    padding:46px 18px 66px !important;
  }
  .simpleCtaActions,
  .simpleCtaActions .btn{
    width:100% !important;
  }
}


/* v104: CTA spacing polish */
.simpleCta{
  padding:48px 22px 56px !important;
}

.simpleCtaTitle{
  margin:0 !important;
}

.simpleCtaActions{
  margin-top:26px !important;
}


/* v105: real CTA spacing balance - reduce previous section bottom gap, add footer breathing room */
.dataSection{
  padding-bottom:32px !important;
}

.simpleCta{
  padding:28px 22px 76px !important;
}

.simpleCtaTitle{
  margin:0 !important;
}

.simpleCtaActions{
  margin-top:26px !important;
}

@media(max-width:760px){
  .dataSection{
    padding-bottom:28px !important;
  }

  .simpleCta{
    padding:24px 18px 64px !important;
  }
}


/* v106: seamless transition from data card to CTA */
.dataSection{
  padding-bottom:0 !important;
  margin-bottom:0 !important;
}

.simpleCta{
  margin-top:-2px !important;
  padding:34px 22px 76px !important;
  background:#F5F6FA !important;
}

@media(max-width:760px){
  .simpleCta{
    padding:28px 18px 64px !important;
  }
}


/* v107: Level 1 - three equal entry doors */
.entryHub{width:min(860px,100%);margin:34px auto 0}
.entryPrompt{font-size:18px;font-weight:500;letter-spacing:-.018em;color:#fff;margin-bottom:10px}
.entryBranch{height:46px;width:min(650px,82%);margin:0 auto 2px;display:block;overflow:visible}
.entryBranch path{fill:none;stroke:rgba(255,255,255,.26);stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.entryBranch circle{fill:#8A64FF;filter:drop-shadow(0 0 7px rgba(138,100,255,.45))}
.entryDoors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.entryDoor{min-height:132px;padding:19px 18px 17px;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:rgba(255,255,255,.055);color:#fff;text-decoration:none;text-align:left;display:flex;flex-direction:column;justify-content:space-between;backdrop-filter:blur(8px);transition:transform .2s cubic-bezier(.16,1,.3,1),background .2s ease,border-color .2s ease,box-shadow .2s ease}
.entryDoor:hover{transform:translateY(-3px);background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.27);box-shadow:0 18px 44px rgba(0,0,0,.16)}
.entryDoorTop{display:flex;align-items:center;justify-content:space-between;gap:10px}
.entryDoorTitle{font-size:18px;line-height:1.2;font-weight:500;letter-spacing:-.02em}
.entryExamples{margin-top:18px;font-size:13.5px;line-height:1.45;color:rgba(255,255,255,.58)}
@media(max-width:760px){.entryHub{margin-top:28px}.entryBranch{display:none}.entryDoors{grid-template-columns:1fr;gap:10px}.entryDoor{min-height:108px}.entryPrompt{margin-bottom:16px}}

/* v108: refined hero entry hub */
.entryHub{margin-top:30px}
.entryPrompt{display:inline-flex;align-items:center;gap:9px;padding:9px 14px;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:rgba(255,255,255,.09);box-shadow:0 8px 28px rgba(0,0,0,.10),inset 0 1px 0 rgba(255,255,255,.06);font-size:18px;font-weight:600;color:#fff;margin-bottom:9px}
.entryPrompt:before{content:"";width:7px;height:7px;border-radius:50%;background:#8A64FF;box-shadow:0 0 0 5px rgba(138,100,255,.14)}
.entryBranch path{stroke:rgba(255,255,255,.34);stroke-width:1.45}
.entryDoor{min-height:138px;padding:19px 18px 17px;background:rgba(255,255,255,.105);border-color:rgba(255,255,255,.20);box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.entryDoor:hover{background:rgba(255,255,255,.145);border-color:rgba(255,255,255,.32)}
.entryDoorTop{justify-content:flex-start}
.entryDoorIcon{width:34px;height:34px;flex:0 0 34px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.10);color:rgba(255,255,255,.92)}
.entryDoorIcon svg{width:18px;height:18px;display:block}
.entryDoorTitle{font-size:18px}
.entryExamples{display:flex;align-items:center;flex-wrap:wrap;gap:4px 0;margin-top:18px;min-width:0}
@media(max-width:900px){.entryDoors{gap:10px}.entryDoor{padding-left:15px;padding-right:15px}.entryExamples{font-size:13px}}
@media(max-width:760px){.entryPrompt{font-size:17px}.entryDoor{min-height:112px}.entryExamples{margin-top:14px}}

/* v109: symmetric single-line hints + thinner branch */
.entryBranch path{stroke:rgba(255,255,255,.30);stroke-width:.85}
.entryBranch circle{r:2.3px}
.entryExamples{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:nowrap;
  gap:0;
  margin-top:18px;
  font-size:12.5px;
  line-height:1.35;
  white-space:nowrap;
}
@media(max-width:900px) and (min-width:761px){
  .entryExamples{font-size:11.5px}
}

/* v110: prompt is a section label, not a fake button */
.entryPrompt{
  display:block!important;
  width:max-content;
  max-width:100%;
  margin:0 auto 8px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:rgba(255,255,255,.92)!important;
  font-size:19px!important;
  line-height:1.3!important;
  font-weight:600!important;
  letter-spacing:-.02em!important;
}
.entryPrompt:before{display:none!important;content:none!important}
.entryPrompt:after{
  content:"";
  display:block;
  width:34px;
  height:2px;
  margin:9px auto 0;
  border-radius:99px;
  background:linear-gradient(90deg,#335CFF,#8A64FF);
  opacity:.95;
}
.entryBranch{margin-top:0!important}

/* v111: cards use one descriptive navigation line */
.entryDoorTop{justify-content:flex-start!important}
.entryExamples{
  margin-top:22px!important;
  font-size:16px!important;
  line-height:1.35!important;
  color:rgba(255,255,255,.70)!important;
  letter-spacing:-.012em!important;
}
.entryMoreArrow{
  display:inline-block;
  margin-left:7px;
  color:rgba(255,255,255,.60);
  font-size:18px;
  line-height:1;
  transition:transform .18s ease,color .18s ease;
}
.entryDoor:hover .entryMoreArrow{transform:translateX(3px);color:#fff}
@media(max-width:900px) and (min-width:761px){.entryExamples{font-size:14px!important}}

/* v112: compact entry cards + safe single-line hints */
.entryDoor{
  min-height:104px!important;
  padding:16px 18px 15px!important;
  justify-content:flex-start!important;
}
.entryExamples{
  margin-top:13px!important;
  width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  flex-wrap:nowrap!important;
  font-size:15px!important;
  line-height:1.3!important;
}
.entryMoreArrow{flex:0 0 auto!important}
.entryDoor:first-child .entryExamples{font-size:14.25px!important;letter-spacing:-.018em!important}
@media(max-width:900px) and (min-width:761px){
  .entryDoor{padding-left:13px!important;padding-right:13px!important}
  .entryExamples{font-size:13px!important}
  .entryDoor:first-child .entryExamples{font-size:12.25px!important}
}


/* v113: two-line descriptive hints + hover compositing fix */
.entryDoor{
  min-height:124px!important;
  padding:16px 18px 15px!important;
  justify-content:flex-start!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  isolation:isolate;
  transform:translateZ(0);
}
.entryDoor:hover{
  transform:translateY(-3px) translateZ(0)!important;
}
.entryExamples{
  display:block!important;
  margin-top:12px!important;
  width:100%!important;
  overflow:visible!important;
  white-space:normal!important;
  font-size:14px!important;
  line-height:1.48!important;
  letter-spacing:-.014em!important;
  color:rgba(255,255,255,.72)!important;
}
.entryExamples > span{
  display:block;
  white-space:nowrap;
}
.entryMoreArrow{
  margin-left:6px!important;
  font-size:17px!important;
  vertical-align:-1px;
}
@media(max-width:900px) and (min-width:761px){
  .entryDoor{padding-left:13px!important;padding-right:13px!important}
  .entryExamples{font-size:12.25px!important}
}


/* v114: safe hint wrapping + wider solid CTA underline */
.entryDoor{
  overflow:hidden!important;
}
.entryExamples{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  white-space:normal!important;
}
.entryExamples > span{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}

/* CTA underline: 2x wider, single solid accent */
.entryPrompt:after{
  width:64px!important;
  background:#735CFF!important;
  background-image:none!important;
}


/* v116: actually widen the 3-door block beyond the 900px hero text column */
.entryHub{
  width:min(1080px,calc(100vw - 64px))!important;
  max-width:none!important;
  position:relative!important;
  left:50%!important;
  transform:translateX(-50%)!important;
}
.entryDoors{
  width:100%!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;
}
.entryDoor{
  min-width:0!important;
}
@media(max-width:760px){
  .entryHub{
    width:100%!important;
    left:auto!important;
    transform:none!important;
  }
}


/* v118: narrower cards + deliberately balanced two-line info rhythm */
.entryHub{
  width:min(960px,calc(100vw - 64px))!important;
}
.entryDoors{
  gap:16px!important;
}
.entryDoor{
  min-height:128px!important;
  padding:16px 18px 15px!important;
}
.entryExamples{
  margin-top:12px!important;
  font-size:13.5px!important;
  line-height:1.5!important;
  letter-spacing:-.018em!important;
}


/* v120: coherent icon system */
.entryDoorIcon{
  width:36px!important;
  height:36px!important;
  flex:0 0 36px!important;
  border-radius:9px!important;
  background:rgba(255,255,255,.085)!important;
  border:1px solid rgba(255,255,255,.045)!important;
  color:rgba(255,255,255,.88)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.entryDoorIcon svg{
  width:19px!important;
  height:19px!important;
  stroke-width:1.7!important;
}
.entryDoor:hover .entryDoorIcon{
  background:rgba(115,92,255,.16)!important;
  border-color:rgba(130,108,255,.20)!important;
  color:#fff!important;
}


/* v121: use the user's supplied SVG assets exactly; only inherit interface color */
.entryDoorIcon svg{
  width:19px!important;
  height:19px!important;
}
.entryDoorIcon svg path,
.entryDoorIcon svg rect,
.entryDoorIcon svg line{
  stroke:currentColor!important;
}

/* v123 - demo segment names are the primary card titles */
#explore-insights .tileMetricRow{align-items:flex-start;}
#explore-insights .tileMetric{font-size:30px;line-height:1.08;font-weight:600;letter-spacing:-.035em;max-width:100%;}
#explore-insights .insightTile.featured .tileMetric{font-size:30px;line-height:1.08;}
#explore-insights .tileText{font-weight:400;}
@media(max-width:680px){#explore-insights .insightTile.featured .tileMetric,#explore-insights .tileMetric{font-size:28px;}}

/* v131 - demo preset filter formula */
.presetFilterRow{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  min-width:0;
}
.presetFilterChip{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 10px;
  border-radius:6px;
  background:#F3F6FB;
  color:#667085;
  font-size:14px;
  line-height:1.2;
  font-weight:400;
  letter-spacing:-.012em;
  white-space:nowrap;
}
.presetJoin{
  color:#98A2B3;
  font-size:14px;
  line-height:1;
  font-weight:500;
}
.insightTile.violet .presetFilterChip,
.insightTile.blue .presetFilterChip{
  background:rgba(255,255,255,.09);
  color:rgba(255,255,255,.86);
}
.insightTile.violet .presetJoin,
.insightTile.blue .presetJoin{
  color:rgba(255,255,255,.42);
}

/* v132 - keep demo preset filters on one line */
.presetFilterRow{
  flex-wrap:nowrap !important;
  gap:4px !important;
  white-space:nowrap;
}
.presetFilterChip{
  min-height:26px !important;
  padding:0 7px !important;
  border-radius:5px !important;
  font-size:12px !important;
  letter-spacing:-.018em !important;
}
.presetJoin{
  flex:0 0 auto;
  font-size:12px !important;
}

/* v133 - slightly stronger filter-chip contrast */
.presetFilterChip{
  color:#526071 !important;
}
.insightTile.violet .presetFilterChip,
.insightTile.blue .presetFilterChip{
  color:rgba(255,255,255,.94) !important;
}

/* v134 - optical breathing room below bar charts */

/* v135 - real layout spacing below bar charts */

/* v136 - optical gap inside the actual bar-chart box */
.barChart{
  margin:20px 0 4px !important;
  height:84px !important;
  padding-bottom:16px !important;
  box-sizing:border-box !important;
}

/* Production video: embedded poster, native accessible modal and HTML5 controls. */
.videoPlayer{padding:0;display:block;width:100%;aspect-ratio:1501/691;max-height:none}
.videoPoster{position:absolute;top:0;left:0;width:100%;height:auto;display:block;z-index:1}
.videoPlayer:before{display:none;animation:none}
.videoPlayer:after{background:rgba(6,8,22,.13);z-index:2}
.videoPlayer:focus-visible{outline:3px solid #335CFF;outline-offset:5px}
dialog.videoModal{inset:50% 0 auto;margin:0 auto;transform:translateY(-50%);padding:0;width:min(1100px,calc(100% - 40px),calc((100dvh - 40px) * 16 / 9));height:fit-content;max-width:none;max-height:calc(100dvh - 40px);border:0;border-radius:14px;background:#050816;overflow:visible;backdrop-filter:none;color:#fff}
dialog.videoModal:not([open]){display:none}
dialog.videoModal[open]{display:block}
dialog.videoModal::backdrop{background:rgba(6,8,22,.82);backdrop-filter:blur(10px)}
.videoModal .videoModalFrame{width:100%;height:auto;min-height:0;aspect-ratio:16/9;border:0;overflow:visible;background:#000}
#leadVectorVideo{display:block;width:100%;height:100%;object-fit:contain;max-height:calc(100dvh - 40px);aspect-ratio:16/9;background:#000;border-radius:14px}
.videoModal .videoClose{top:10px;right:10px;background:rgba(5,8,22,.8);z-index:3}
.videoClose:focus-visible{outline:2px solid #fff;outline-offset:3px}
.videoError{position:absolute;left:12px;right:12px;bottom:58px;margin:0;padding:14px;border-radius:8px;background:#10182f;color:white;font-size:14px;text-align:center}
.videoError a{color:#b8c6ff}
@media(max-width:620px){dialog.videoModal{width:min(calc(100% - 20px),calc((100dvh - 40px) * 16 / 9))}.videoPlay{width:64px;height:64px}}

/* v141: fixed media geometry, independent of intrinsic video dimensions. */
dialog#videoModal{height:auto!important;min-height:0!important;aspect-ratio:16/9!important;overflow:hidden!important;padding:0!important;box-sizing:border-box!important}
#videoModal .videoModalFrame{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;margin:0!important;padding:0!important;aspect-ratio:auto!important;overflow:hidden!important;border-radius:inherit!important}
#videoModal #leadVectorVideo{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-height:none!important;min-height:0!important;margin:0!important;object-fit:contain!important;aspect-ratio:auto!important;border-radius:inherit!important}
#videoError[hidden]{display:none!important}

/* v143: brand play button */
.videoPlay{background:var(--primary,#335CFF);color:#fff;box-shadow:0 12px 30px rgba(51,92,255,.28),0 0 0 10px rgba(51,92,255,.13)}
@keyframes lvPlayBounce{0%,100%{transform:translate(-50%,-50%)}40%{transform:translate(-50%,calc(-50% - 7px))}70%{transform:translate(-50%,calc(-50% - 2px))}}
.videoPlayer:hover .videoPlay,.videoPlayer:focus-visible .videoPlay{animation:lvPlayBounce .55s cubic-bezier(.2,.7,.3,1) both;box-shadow:0 18px 38px rgba(51,92,255,.34),0 0 0 12px rgba(51,92,255,.16)}
@media(prefers-reduced-motion:reduce){.videoPlayer:hover .videoPlay,.videoPlayer:focus-visible .videoPlay{animation:none;transform:translate(-50%,-50%)}}

/* v144: deeper indigo play button */
.videoPlay{background:#3730A3;box-shadow:0 12px 30px rgba(55,48,163,.22),0 0 0 10px rgba(55,48,163,.12)}
.videoPlayer:hover .videoPlay,.videoPlayer:focus-visible .videoPlay{box-shadow:0 18px 38px rgba(55,48,163,.28),0 0 0 12px rgba(55,48,163,.15)}

/* v145: real interface recording, no mock browser frame or overlays. */
.productDemo.productDemoLive{min-height:0;height:auto;padding:0;aspect-ratio:1920/1038;background:#fff;overflow:hidden}
.productDemo.productDemoLive:before,.productDemo.productDemoLive:after{display:none;content:none}
.productLoopVideo{display:block;width:100%;height:auto;aspect-ratio:1920/1038;object-fit:contain;border:0}

/* ==========================================================================
   Segment tile charts (Chart.js 4.5.1 canvases)
   ========================================================================== */
.insightTile{--lv-spark-color:#335CFF;--lv-bar-color:#335CFF}
.insightTile.violet{--lv-bar-color:#8A64FF}
.insightTile.blue{--lv-bar-color:#3B82F6}
.tileChart{position:relative;display:inline-block;vertical-align:baseline}
.barChart{position:relative;display:block}
.tileChart canvas,.barChart canvas{display:block}

/* ==========================================================================
   Segment tiles — mobile (≤680px): one column, cards stacked; the wide
   (featured, 2-column) card is hidden.
   ========================================================================== */
@media (max-width:680px){
  .tileGrid{grid-template-columns:minmax(0,1fr)}
  .tileGrid .insightTile.featured{display:none}
}

/* ==========================================================================
   «Начните поиск клиентов» — mobile (≤760px): entry cards in one column.
   (!important is needed: the desktop 3-column rule above uses it too.)
   ========================================================================== */
@media (max-width:760px){
  .entryDoors{grid-template-columns:minmax(0,1fr)!important;gap:10px!important}
}
@media (max-width:760px){
  /* The hero grows taller than the screen once the cards are stacked, so the
     «Смотреть…» cue is put back into the flow at the hero's bottom edge
     instead of being pinned to the first screen (where it covered a card). */
  .center{padding-bottom:88px}
  /* the page gradient is one screen tall; give the taller hero its own copy
     so it does not restart halfway down the hero */
  .hero{background:linear-gradient(180deg,var(--bg0),var(--bg1))}
  .heroScrollCue{
    position:relative;left:auto;bottom:auto;transform:none;
    display:flex;width:max-content;
    margin:-64px auto 18px;
  }
}