:root{
  --champion:var(--bk-color-secondary, #a4ace5);
  --champion-ink:var(--bk-color-secondary, #585cba);
  --sage:var(--bk-color-secondary, #b6bbed);
  --lavender:var(--bk-color-secondary, #b3bbe9);
  --royal:var(--bk-color-primary, #1e193a);
  --royal-2:#201b3b;
  --bow:var(--bk-color-primary, #534b7e);
  --nude:var(--bk-color-surface, #f3f2f1);
  --nude-2:#ece9e3;
  --white:var(--bk-color-background, #ffffff);
  --vanta:var(--bk-color-ink, #000000);

  --ink:var(--royal);
  --ink-2:var(--bow);
  --mute:var(--bk-color-secondary, #8a86a3);
  --rule:var(--bk-color-surface, #e4e1db);
  --rule-2:#d6d2ca;

  --radius: 16px;
  --radius-sm: 10px;
  --radius-pill: 999px;

  --font-sans:'Montserrat',ui-sans-serif,system-ui,sans-serif;
  --font-mono:'Montserrat',ui-sans-serif,system-ui,sans-serif;

  --wrap: 1240px;
  --shadow-1: 0 1px 2px rgba(41,35,74,.04), 0 8px 20px -8px rgba(41,35,74,.08);
  --shadow-2: 0 2px 6px rgba(41,35,74,.05), 0 20px 50px -20px rgba(41,35,74,.18);
  --shadow-3: 0 30px 80px -30px rgba(41,35,74,.28);
}

.widget-snippet .wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}

.widget-snippet .display{font-weight:var(--bk-p-weight, 300);letter-spacing:var(--bk-p-letter-spacing, -0.025em);line-height:var(--bk-p-line-height, 1);color:var(--bk-p-color, var(--bk-color-ink, var(--royal)))}
.widget-snippet .display em{font-style:var(--bk-p-style, normal);color:var(--bk-color-secondary, var(--champion));font-weight:var(--bk-p-weight, 500)}
.display.display-md{font-size:var(--bk-h2-size, clamp(36px,4.6vw,64px));line-height:var(--bk-h2-line-height, 1.02)}
.widget-snippet h2.display{text-wrap:pretty}
.widget-snippet .sec-label{font-size:var(--bk-overline-size, 11px);letter-spacing:var(--bk-overline-letter-spacing, 0.24em);text-transform:var(--bk-overline-transform, uppercase);color:var(--bk-color-secondary, var(--mute));margin-bottom:20px;display:inline-flex;align-items:center;gap:10px}
.widget-snippet .sec-label::before{content:"";width:18px;height:1px;background:var(--bk-color-secondary, var(--champion));display:inline-block}
.widget-snippet .sec-sub{margin-top:20px;font-size:var(--bk-p-size, 17px);color:var(--bk-p-color, var(--bk-color-ink, var(--ink-2)));max-width:62ch;line-height:var(--bk-p-line-height, 1.55);font-weight:var(--bk-p-weight, 400)}

.widget-snippet .btn{display:inline-flex;align-items:center;gap:10px;font-weight:var(--bk-btn-font-weight, 500);font-size:var(--bk-btn-font-size, 14px);letter-spacing:var(--bk-btn-font-letter-spacing, -0.003em);border-radius:var(--bk-btn-radius, var(--radius-pill));padding:var(--bk-btn-pad, 12px 20px);transition:transform .18s ease, background .2s, color .2s, box-shadow .2s, border-color .2s;white-space:nowrap}
.widget-snippet .btn-lg{padding:var(--bk-btn-pad, 16px 26px);font-size:var(--bk-btn-font-size, 15px);gap:14px}
.btn-primary{background:var(--bk-btn-fill, var(--bk-color-secondary, var(--champion)));color:var(--bk-btn-text, #fff);box-shadow:var(--bk-btn-shadow, 0 6px 18px -6px rgba(164,172,229,.6))}
.widget-snippet .btn-primary:hover{background:var(--bk-btn-hover-bg, var(--bk-color-secondary, #8f98dc));transform:var(--bk-btn-hover-transform, translateY(-1px));box-shadow:var(--bk-btn-hover-shadow, 0 12px 28px -10px rgba(164,172,229,.65))}
.btn-arrow{flex-shrink:0;transition:transform .2s ease}
.widget-snippet .btn:hover .btn-arrow{transform:translateX(3px)}
.widget-snippet .btn-outline{color:var(--bk-btn-tertiary-text, var(--bk-color-ink, var(--royal)));border:1px solid var(--bk-btn-tertiary-border-color, var(--bk-color-ink, var(--rule-2)));background:transparent}
.widget-snippet .btn-outline:hover{border-color:var(--bk-btn-tertiary-hover-border-color, var(--bk-color-primary, var(--royal)));background:var(--bk-btn-tertiary-hover-bg, color-mix(in srgb, var(--bk-color-primary, #29234a) 4.5%, transparent));transform:var(--bk-btn-tertiary-hover-transform, translateY(-1px))}
.widget-snippet .btn .pulse{width:7px;height:7px;border-radius:50%;background:var(--bk-color-secondary, var(--sage));box-shadow:0 0 0 0 color-mix(in srgb, var(--bk-color-secondary, #b6bbed) 70%, transparent);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--bk-color-secondary, #b6bbed) 70%, transparent)}70%{box-shadow:0 0 0 8px color-mix(in srgb, var(--bk-color-secondary, #b6bbed) 0%, transparent)}100%{box-shadow:0 0 0 0 color-mix(in srgb, var(--bk-color-secondary, #b6bbed) 0%, transparent)}}

/* compare */
.widget-snippet .cmp-corner.empty-box {
    min-width: 506px;
}
.widget-snippet .compare{padding:120px 0;background:var(--bk-color-background, var(--white));border-bottom:1px solid var(--bk-color-surface, var(--rule))}
.widget-snippet .cmp-head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:48px}
.widget-snippet .cmp-scroll{overflow-x:auto;scrollbar-width:thin}
.widget-snippet .cmp{display:flex;flex-direction:column;min-width:840px;border:1px solid var(--bk-color-surface, var(--rule));border-radius:var(--radius);overflow:hidden;background:var(--bk-color-background, var(--white))}
.widget-snippet .cmp-row{display:flex}
.widget-snippet .cmp-row>*{flex:1 1 0;min-width:0}
.widget-snippet .cmp-row>*:first-child{flex:1.5 1 0}
.widget-snippet .cmp-row>*:not(:last-child){border-right:1px solid var(--bk-color-surface, var(--rule))}
.widget-snippet .cmp-cell{padding:18px 22px;border-bottom:1px solid var(--bk-color-surface, var(--rule));font-size:var(--bk-p-size, 14px);color:var(--bk-p-color, var(--bk-color-ink, var(--ink-2)));line-height:var(--bk-p-line-height, 1.5);display:flex;flex-direction:column;justify-content:center}
.widget-snippet .cmp-rowlabel{font-weight:var(--bk-p-weight, 600);color:var(--bk-p-color, var(--bk-color-ink, var(--royal)));font-size:var(--bk-p-size, 13.5px);background:var(--bk-color-surface, var(--nude));letter-spacing:var(--bk-p-letter-spacing, -0.003em)}
.widget-snippet .cmp-prodhead{padding:26px 22px;border-bottom:1px solid var(--bk-color-surface, var(--rule));position:relative;background:var(--bk-color-surface, var(--nude));display:flex;flex-direction:column}
.widget-snippet .cmp-prodhead.feat{background:linear-gradient(180deg,color-mix(in srgb, var(--bk-color-secondary, #6c70cf) 8%, transparent),color-mix(in srgb, var(--bk-color-secondary, #6c70cf) 2%, transparent))}
.widget-snippet .cmp-pname{font-size:var(--bk-p-size, 19px);font-weight:var(--bk-p-weight, 500);color:var(--bk-p-color, var(--bk-color-ink, var(--royal)));letter-spacing:var(--bk-p-letter-spacing, -0.015em);margin-top:6px}
.cmp-add{width:100%;justify-content:center;margin-top:auto}
.widget-snippet .cmp-corner{background:var(--bk-color-background, var(--white));border-bottom:1px solid var(--bk-color-surface, var(--rule))}
.widget-snippet .cmp-genes{font-size:var(--bk-p-size, 30px);font-weight:var(--bk-p-weight, 300);color:var(--bk-p-color, var(--bk-color-ink, var(--royal)));letter-spacing:var(--bk-p-letter-spacing, -0.02em);line-height:var(--bk-p-line-height, 1)}
.widget-snippet .cmp-dash{color:var(--bk-color-secondary, var(--mute));font-size:var(--bk-p-size, 20px);line-height:var(--bk-p-line-height, 1)}

/* compare 2-col override */
.widget-snippet .cmp.cmp2{min-width:720px}
.widget-snippet  .cmp.cmp2 .cmp-row>*:first-child{flex:1.6 1 0}

/* toast */

@media (max-width:900px){
  .compare{padding:80px 0}
}