body.widget-snippet { padding: 0; margin: 0; }
.widget-snippet * { box-sizing: border-box; }
div[section="body"], div[section="body"] > .widget-container, div[section="body"] > .widget-container > .page-content { overflow: visible !important; padding: 0 !important; }
.widget-snippet .wcs_section_302b37cb a { background: initial; background-color: initial; border: initial; border-bottom: initial; border-color: initial; border-radius: initial; border-top: initial; box-shadow: initial; color: inherit; font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; line-height: inherit; margin: initial; margin-bottom: initial; margin-left: initial; margin-right: initial; margin-top: initial; padding: initial; padding-left: initial; padding-right: initial; text-align: inherit; text-decoration: inherit; text-transform: inherit; vertical-align: initial; }
.widget-snippet .wcs_section_302b37cb blockquote { border-left: none; color: inherit; font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; line-height: inherit; margin: 0; padding-left: 0; text-transform: inherit; }
.widget-snippet .wcs_section_302b37cb button { background: initial; background-color: revert; border: revert; border-color: initial; border-radius: initial; border-style: initial; border-width: initial; box-shadow: initial; color: revert; font-family: revert; font-size: revert; font-style: inherit; font-weight: revert; line-height: normal; margin: 0; margin-left: initial; margin-right: initial; margin-top: initial; padding: var(--bk-btn-secondary-pad, 0); text-align: revert; text-decoration: inherit; text-transform: revert; }
.widget-snippet .wcs_section_302b37cb code { color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; }
.widget-snippet .wcs_section_302b37cb fieldset { border: none; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; margin: 0; padding: 0; }
.widget-snippet .wcs_section_302b37cb figure { margin: 0; margin-left: initial; margin-right: initial; padding: initial; }
.widget-snippet .wcs_section_302b37cb h1 { background-color: initial; color: inherit; font-family: inherit; font-size: revert; font-style: inherit; font-weight: revert; line-height: inherit; margin: 0; margin-bottom: initial; margin-top: initial; padding: initial; padding-bottom: initial; text-align: inherit; text-transform: inherit; }
.widget-snippet .wcs_section_302b37cb h2 { color: inherit; font-family: inherit; font-size: revert; font-style: inherit; font-weight: revert; line-height: inherit; margin: 0; margin-bottom: initial; margin-top: initial; padding: initial; padding-bottom: initial; padding-left: initial; text-align: inherit; text-transform: inherit; }
.widget-snippet .wcs_section_302b37cb h3 { color: inherit; font-family: inherit; font-size: revert; font-style: inherit; font-weight: revert; line-height: inherit; margin: 0; margin-bottom: initial; margin-top: initial; padding: initial; padding-bottom: initial; text-align: inherit; text-transform: inherit; }
.widget-snippet .wcs_section_302b37cb h4 { border-bottom: initial; color: inherit; font-family: inherit; font-size: revert; font-style: inherit; font-weight: revert; line-height: inherit; margin: 0; margin-bottom: initial; margin-top: initial; padding-bottom: initial; text-align: inherit; text-transform: inherit; }
.widget-snippet .wcs_section_302b37cb h5 { border-bottom: initial; color: inherit; font-family: inherit; font-size: revert; font-style: inherit; font-weight: revert; line-height: inherit; margin: 0; margin-bottom: initial; margin-top: initial; padding: initial; text-transform: inherit; }
.widget-snippet .wcs_section_302b37cb h6 { color: inherit; font-family: inherit; font-size: revert; font-style: inherit; font-weight: revert; line-height: inherit; margin: 0; margin-bottom: initial; margin-top: initial; padding: initial; text-transform: inherit; }
.widget-snippet .wcs_section_302b37cb hr { border: none; border-top: 1px solid currentColor; margin-bottom: initial; margin-top: initial; }
.widget-snippet .wcs_section_302b37cb img { background: initial; border: none; border-radius: initial; margin: initial; margin-bottom: initial; padding: initial; vertical-align: middle; }
.widget-snippet .wcs_section_302b37cb input { background: initial; background-color: initial; border: initial; border-radius: initial; border-right: initial; color: inherit; font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; line-height: var(--bk-p-line-height, normal); margin: 0; margin-right: initial; margin-top: initial; outline: initial; padding: initial; padding-left: initial; text-align: start; vertical-align: initial; }
.widget-snippet .wcs_section_302b37cb li { border: initial; border-radius: initial; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; list-style: inherit; margin: 0; margin-bottom: initial; margin-right: initial; padding: 0; padding-bottom: initial; text-align: inherit; }
.widget-snippet .wcs_section_302b37cb ol { color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; margin: 0; padding-left: initial; }
.widget-snippet .wcs_section_302b37cb p { background: initial; border-bottom: initial; color: inherit; font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; line-height: inherit; margin: 0; margin-bottom: initial; margin-top: initial; padding: initial; padding-bottom: initial; padding-top: initial; text-align: inherit; text-transform: inherit; }
.widget-snippet .wcs_section_302b37cb pre { background: transparent; border-radius: 0; border-width: initial; color: inherit; font-family: inherit; font-size: inherit; line-height: inherit; margin: 0; padding: 0; }
.widget-snippet .wcs_section_302b37cb select { background: initial; background-color: initial; border: initial; border-color: initial; border-radius: initial; border-width: initial; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; margin: 0; margin-right: initial; padding: initial; text-transform: none; }
.widget-snippet .wcs_section_302b37cb table { background: initial; border: initial; border-bottom: initial; border-radius: initial; box-shadow: initial; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; margin: initial; margin-bottom: initial; padding: initial; }
.widget-snippet .wcs_section_302b37cb textarea { background: initial; background-color: initial; border: initial; border-bottom: initial; border-color: initial; border-radius: initial; color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; margin: 0; padding: initial; text-align: start; }
.widget-snippet .wcs_section_302b37cb ul { color: inherit; font-family: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; list-style: none; margin: 0; margin-top: initial; padding: 0; padding-left: initial; }
/* wcs:scoped-begin */
.widget-snippet .wcs_section_302b37cb :where(h1, h2, h3, h4, h5, h6, p, blockquote, figure, figcaption, dd, dl) { margin: 0; padding: 0; }
  .widget-snippet .wcs_section_302b37cb, .widget-snippet .wcs_section_302b37cb *, .widget-snippet .wcs_section_302b37cb *::before, .widget-snippet .wcs_section_302b37cb *::after { box-sizing: border-box; }
  .widget-snippet .wcs_section_302b37cb .gh-svc {
    position: relative;
    isolation: isolate;
    background-color: var(--bk-color-surface, #f2f2f2);
    font-family: var(--bk-p-family, var(--bk-font-base, "Montserrat", sans-serif));
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc-track {
    position: relative;
    width: 100%;
    height: 500vh;
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc-stage {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc-panel {
    position: relative;
    width: 60%;
    max-width: 100%;
    height: 108vh;
    margin: -4vh auto 0;
    border-radius: 24px;
    overflow: hidden;
    background-color: var(--bk-color-primary, #3a3462);      
    will-change: width, border-radius;
    transform: translateZ(0);
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0 0;
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
      radial-gradient(120% 90% at 50% 50%, transparent 30%, color-mix(in srgb, var(--bk-color-primary, #0c0828) 65%, transparent) 100%),
      linear-gradient(180deg, color-mix(in srgb, var(--bk-color-primary, #0c0828) 15%, transparent) 0%, transparent 40%);
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc-items {
    position: absolute;
    inset: 0;
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc-title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    width: min(780px, 80%);
    margin: 0;
    text-align: center;
    pointer-events: none;
    font-family: var(--bk-h2-family, "Montserrat", sans-serif);
    font-weight: var(--bk-h2-weight, 400);
    font-size: var(--bk-h2-size, clamp(32px, 5vw, 64px));
    line-height: var(--bk-h2-line-height, 1.05);
    letter-spacing: var(--bk-h2-letter-spacing, -0.02em);
    color: var(--bk-color-background, #ffffff);
    text-wrap: balance;
    will-change: opacity;
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc-title .gh-svc-accent { color: var(--bk-color-secondary, #a4ace5); }
  .widget-snippet .wcs_section_302b37cb .gh-svc-card {
    position: relative;
    z-index: 10;
    display: block;
    width: min(560px, 82%);
    margin: 0 auto 32px;
    padding: 28px 32px 24px;
    border-radius: 20px;
    border: 1px solid transparent;
    background: transparent;
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    box-shadow: inset 0 2px 10px 0 color-mix(in srgb, var(--bk-color-background, #ffffff) 40%, transparent), inset 0 2px 10px 0 color-mix(in srgb, var(--bk-color-primary, #29234a) 20%, transparent);
    color: var(--bk-color-background, #ffffff);
    will-change: transform;
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc-card:first-of-type { margin-top: 100vh; }
  .widget-snippet .wcs_section_302b37cb .gh-svc-card:last-of-type { margin-bottom: 80vh; }
  .widget-snippet .wcs_section_302b37cb .gh-svc-card-title {
    font-family: var(--bk-h3-family, "Montserrat", sans-serif);
    font-size: var(--bk-h3-size, 22px);
    font-weight: var(--bk-h3-weight, 500);
    line-height: var(--bk-h3-line-height, 1.6);
    color: var(--bk-color-background, #ffffff);
    margin: 0 0 10px;
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc-card-text {
    font-family: var(--bk-p-family, "Montserrat", sans-serif);
    font-size: var(--bk-p-size, 14px);
    font-weight: var(--bk-p-weight, 400);
    line-height: var(--bk-p-line-height, 1.55);
    color: color-mix(in srgb, var(--bk-color-background, #ffffff) 78%, transparent);
    margin: 0;
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc .gh-svc-card .gh-svc-card-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 28px;
    padding: var(--bk-btn-secondary-pad, 12px 22px);
    border-radius: var(--bk-btn-radius, 999px);
    background-color: var(--bk-btn-fill, #b3bbe9);
    color: var(--bk-btn-text, #1e193a);
    font-family: var(--bk-btn-secondary-font-family, var(--bk-font-base, "Montserrat", sans-serif));
    font-size: var(--bk-btn-secondary-font-size, 12.5px);
    font-weight: var(--bk-btn-secondary-font-weight, 500);
    line-height: 20px;
    letter-spacing: var(--bk-btn-secondary-font-letter-spacing, 0.05em);
    text-decoration: none;
    transition: color 0.2s;
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc .gh-svc-card .gh-svc-card-btn::after {
    content: "";
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2 7h9m0 0L7.5 3.5M11 7l-3.5 3.5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 12px 12px;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2 7h9m0 0L7.5 3.5M11 7l-3.5 3.5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 12px 12px;
  }
  .widget-snippet .wcs_section_302b37cb .gh-svc .gh-svc-card .gh-svc-card-btn:hover, .widget-snippet .wcs_section_302b37cb .gh-svc .gh-svc-card .gh-svc-card-btn:focus-visible {
    color: var(--bk-btn-secondary-hover-color, var(--bk-color-ink, #1e193a));
    transform: var(--bk-btn-secondary-hover-transform, translateY(-1px));
  }
@media (max-width: 991px) {
  .widget-snippet .wcs_section_302b37cb .gh-svc-track { height: auto; overflow-x: hidden; }
  .widget-snippet .wcs_section_302b37cb .gh-svc-stage { position: relative; height: auto; overflow: visible; }
  .widget-snippet .wcs_section_302b37cb .gh-svc-panel {
      width: 100% !important;
      height: auto;
      margin: 0;
      padding: 80px 20px;
      border-radius: 0 !important;
      overflow: visible;
    }
  .widget-snippet .wcs_section_302b37cb .gh-svc-items { position: static; }
  .widget-snippet .wcs_section_302b37cb .gh-svc-title {
      position: relative;
      top: auto;
      left: auto;
      transform: none !important;
      opacity: 1 !important;
      width: 100%;
      margin: 0 0 40px;
      font-size: var(--bk-h2-size, 48px);
      line-height: var(--bk-h2-line-height, 52px);
      pointer-events: auto;
    }
  .widget-snippet .wcs_section_302b37cb .gh-svc-card {
      width: 100%;
      margin: 0 0 20px !important;
      transform: none !important;
    }
  .widget-snippet .wcs_section_302b37cb .gh-svc-card:last-of-type { margin-bottom: 0 !important; }
}
@media (max-width: 767px) {
  .widget-snippet .wcs_section_302b37cb .gh-svc-panel { padding: 60px 15px; }
  .widget-snippet .wcs_section_302b37cb .gh-svc-title { font-size: var(--bk-h2-size, 32px); line-height: var(--bk-h2-line-height, 40px); }
}

/* editor only (body.fee): lift the title above the item list's click overlay (z-index 10)
   so a click on it opens the normal text toolbar (bold / italic / colour). Front end unaffected. */
body.fee .widget-snippet .wcs_section_302b37cb .gh-svc .gh-svc-title { z-index: 11; pointer-events: auto; }

/* editor only (body.fee): the title scrolls with the cards instead of staying pinned above them.
   snippet.js publishes the cards' scroll offset as --gh-svc-scroll-y. Front end unaffected. */
@media (min-width: 992px) {
  body.fee .widget-snippet .wcs_section_302b37cb .gh-svc .gh-svc-title { transform: translate(-50%, calc(-50% + var(--gh-svc-scroll-y, 0px))); }
}

/* Description paragraphs: snippet.js rewrites each description into one <div> per paragraph
   (from the editor's Enter -> <br> and pasted lines -> <div>); give them a paragraph gap. */
.widget-snippet .wcs_section_302b37cb .gh-svc-card-text > div + div{margin-top:.6em}

/* [gh-svc-frame-gradient] Redesign v1: the frame continues the lavender the "Connecting" gradient ends on
   (#9599d6) and only fades to the page colour as the panel contracts into "How it works". */
.widget-snippet .wcs_section_302b37cb section.gh-svc {
  background: linear-gradient(180deg, var(--bk-color-secondary, #9599d6) 0%, var(--bk-color-secondary, #9599d6) 72%, var(--bk-color-surface, #f3f2f1) 96%);
}
@media (max-width: 991px) {
  .widget-snippet .wcs_section_302b37cb section.gh-svc {
    background: linear-gradient(180deg, var(--bk-color-secondary, #9599d6) 0%, var(--bk-color-secondary, #9599d6) 85%, var(--bk-color-surface, #f3f2f1) 100%);
  }
}
/* [/gh-svc-frame-gradient] */