/*
 * 
 *
 * Same class names, same guarantees as before:
 *  - the blur is keyed on the PHP body class, so it is on before first paint
 *    and stays on with scripts off;
 *  - the teaser carries its own blur in case the theme nests it;
 *  - the overlay must be a direct child of <body>.
 *
 * What changed is the look: one restrained palette (ink navy, warm ivory,
 * a single copper accent), more air inside the card, quieter light effects,
 * and controls that pass contrast and show a clear focus state.
 */

/* ---------------------------------------------------------------------------
   Tokens
   ------------------------------------------------------------------------ */

.vc-csg-overlay,
.vc-csg-ghost {
    font-family: Poppins, Arial, sans-serif;
    --vc-ink:        #1C2E48;   /* deepest navy, the band and the head */
    --vc-ink-2:      #1C2E48;
    --vc-ink-3:      #2C5187;
    --vc-paper:      #ffffff;
    --vc-ivory:      #F2F2F2;   /* the card body's resting surface */
    --vc-text:       #111827;
    --vc-text-2:     #5D6B78;   /* 7.5:1 on white */
    --vc-line:       #D9D9D9;
    --vc-field:      #5D6B78;   /* field borders: 3.7:1 on white */
    --vc-copper:     #C6490D;   /* the one accent: 5.2:1 with white text */
    --vc-copper-hi:  #F0A868;
    --vc-copper-dk:  #A82100;
    --vc-gold-soft:  #F0A868;   /* accent tint for text on navy */
    --vc-sky:        #E9EFF8;   /* light blue */
    --vc-sky-2:      #F2F6FB;
    --vc-mist:       #F7F8FA;   /* near-white, cool */
    --vc-ember:      #A82100;   /* orange-red, used only as light */
    --vc-focus:      rgba(194, 65, 12, 0.28);
    --vc-error:      #A82100;
    --vc-ok:         #234371;
    --vc-radius:     20px;
    --vc-ease:       cubic-bezier(.16, .84, .32, 1);
}

/* ---------------------------------------------------------------------------
   The full gate: blurred page, locked
   ------------------------------------------------------------------------ */

body.vc-csg-gated {
    overflow: hidden !important;
}

/* Two blurs stack behind the card: this one and the overlay's backdrop
   filter. Together no word survives; separately each stays mild enough
   that the page still reads as a page. */
body.vc-csg-gated > *:not(.vc-csg-overlay) {
    filter: blur(6px) saturate(0.75);
    pointer-events: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;
}

/* Belt and braces: the teaser is the only real text on the page, so it
   blurs on its own class alone. Strip the body class in devtools and the
   teaser stays unreadable. Only the inline mode, where the text is meant
   to be read, switches it off. */
.vc-csg-teaser {
    filter: blur(6px);
    user-select: none !important;
    -webkit-user-select: none !important;
}

body.vc-csg-inline .vc-csg-teaser {
    filter: none;
    user-select: auto !important;
    -webkit-user-select: auto !important;
}


.vc-csg-ghost {
    margin: 32px 0 0;
    user-select: none !important;
    -webkit-user-select: none !important;
    pointer-events: none !important;
}

.vc-csg-ghost-line {
    display: block;
    height: 12px;
    margin: 0 0 15px;
    border-radius: 999px;
    background: #D9D9D9;
}

.vc-csg-ghost-line.is-head {
    height: 36px;
    margin-bottom: 18px;
    border-radius: 8px;
    background: #5D6B78;
}

.vc-csg-ghost-line.is-sub {
    height: 16px;
    margin-bottom: 30px;
    background: #D9D9D9;
}

.vc-csg-ghost-line.is-h2 {
    height: 22px;
    margin: 36px 0 20px;
    border-radius: 6px;
    background: #5D6B78;
}

.vc-csg-ghost-line.is-big {
    height: 32px;
    margin-bottom: 12px;
    border-radius: 6px;
    background: #5D6B78;
}

.vc-csg-ghost-para { margin: 0 0 30px; }

.vc-csg-ghost-figure {
    margin: 0 0 34px;
    border-radius: 14px;
    overflow: hidden;
}

/* The featured image is already public (archive, social card). */
.vc-csg-ghost-img {
    display: block;
    width: 100%;
    height: auto;
}

.vc-csg-ghost-figure.is-empty {
    height: 300px;
    background: #D9D9D9;
}

.vc-csg-ghost-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 28px;
    margin: 34px 0;
    padding: 26px 0;
    border-top: 1px solid #D9D9D9;
    border-bottom: 1px solid #D9D9D9;
}

.vc-csg-ghost-stat { flex: 1 1 140px; }

/* ---------------------------------------------------------------------------
   The overlay (full gate)
   ------------------------------------------------------------------------ */

.vc-csg-overlay {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 16px;
    background:
        /* Top-right: Rich burnt copper / brand ember glow */
        radial-gradient(circle 550px at 85% 15%, rgba(224, 120, 47, 0.42) 0%, rgba(194, 65, 12, 0.15) 50%, transparent 75%),
        /* Top-left: Vibrant corporate sapphire / royal blue light */
        radial-gradient(circle 600px at 12% 20%, rgba(37, 99, 235, 0.38) 0%, rgba(28, 39, 68, 0.15) 55%, transparent 75%),
        /* Bottom-left: Warm golden amber bloom */
        radial-gradient(circle 500px at 20% 85%, rgba(232, 85, 43, 0.30) 0%, rgba(241, 201, 165, 0.12) 45%, transparent 70%),
        /* Bottom-right: Deep cyan/slate contrast wash */
        radial-gradient(circle 550px at 82% 80%, rgba(30, 64, 175, 0.32) 0%, transparent 65%),
        /* Center ambient halo to subtly highlight the gate card */
        radial-gradient(ellipse 60% 50% at 50% 50%, rgba(30, 44, 77, 0.55) 0%, transparent 80%),
        /* Deeper rich-navy foundation */
        linear-gradient(150deg, #1C2E48 0%, #1C2E48 45%, #2C5187 75%, #1C2E48 100%);
    -webkit-backdrop-filter: blur(18px) saturate(1.35);
    backdrop-filter: blur(18px) saturate(1.35);
    overflow-y: auto;
    overscroll-behavior: contain;
    filter: none !important;
    pointer-events: auto !important;
}

/* Still inside the preview: the card exists but is not in the way yet. */
.vc-csg-overlay.is-waiting {
    display: none !important;
}

/* ---------------------------------------------------------------------------
   The in-page gate (with a preview)
   ------------------------------------------------------------------------ */

/* The last published section fades its own pixels, whatever its colour. */
.vc-csg-cut {
    -webkit-mask-image: linear-gradient(to bottom, #000 35%, rgba(0,0,0,0.4) 70%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 35%, rgba(0,0,0,0.4) 70%, transparent 100%);
}

/* A light, cool ground with two lights in it: sky blue high on the left,
   orange-red low on the right, and a navy haze along the bottom so the
   band still ends with weight. The navy card head anchors the middle. */
.vc-csg-overlay.is-inline {
    position: relative;
    inset: auto;
    display: block;
    z-index: auto;
    margin: -64px auto 0;
    padding: 140px 20px 120px;
    background:
        /* 1. Top wash: Guarantees a seamless, pure-white merge with the article above */
        linear-gradient(180deg, #ffffff 0%, rgba(255, 255, 255, 0.95) 10%, rgba(255, 255, 255, 0) 28%),

      
        radial-gradient(ellipse 650px 520px at 85% 58%, rgba(224, 120, 47, 0.44) 0%, rgba(194, 65, 12, 0.16) 45%, transparent 70%),

        radial-gradient(ellipse 700px 580px at 12% 62%, rgba(37, 99, 235, 0.40) 0%, rgba(28, 39, 68, 0.18) 50%, transparent 72%),

        /* 4. Warm golden/ember bloom (lower left anchor) */
        radial-gradient(circle 480px at 22% 88%, rgba(232, 85, 43, 0.28) 0%, transparent 65%),

        /* 5. Slate/blue contrast bloom (lower right anchor) */
        radial-gradient(circle 520px at 80% 86%, rgba(30, 64, 175, 0.30) 0%, transparent 65%),

        /* 6. Base continuous ramp: White -> Mist -> Sky Blue -> Slate -> Deep Brand Ink-Navy */
        linear-gradient(180deg, 
            #ffffff 0%, 
            #F7F8FA 8%, 
            #E9EFF8 18%, 
            #D6E1F0 28%, 
            #2C5187 40%, 
            #2C5187 55%, 
            #1C2E48 72%, 
            #1C2E48 100%
        );
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    overflow: visible;
    /* Softened shallow arc */
    border-radius: 100% 100% 0 0 / 72px 72px 0 0;
}

/* A fine hairline along the crown, the one ornament on the band. */
.vc-csg-overlay.is-inline::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    border-top: 1px solid rgba(19, 28, 51, 0.07);
    -webkit-mask-image: linear-gradient(to right, transparent 15%, #000 40%, #000 60%, transparent 85%);
    mask-image: linear-gradient(to right, transparent 15%, #000 40%, #000 60%, transparent 85%);
}

.vc-csg-overlay.is-inline .vc-csg-card {
    position: relative;
    z-index: 1;
    margin: 0 auto;
}

/* The card starts hidden only when scripts are running to reveal it and
   the person hasn't asked for less motion. With JavaScript off, reduced
   motion on, or a browser that doesn't know these queries, it is simply
   there. */
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) {
    .vc-csg-overlay.is-inline .vc-csg-card {
        opacity: 0;
        transform: translateY(48px);
        transition: opacity .6s ease, transform .8s var(--vc-ease);
        will-change: transform, opacity;
    }
}

/* Nothing is blurred here: what is behind the card is what we published. */
body.vc-csg-inline > *:not(.vc-csg-overlay) {
    filter: none !important;
    pointer-events: auto !important;
    user-select: auto !important;
}

/* ---------------------------------------------------------------------------
   The card
   ------------------------------------------------------------------------ */

.vc-csg-card {
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.08),
        0 20px 40px -10px rgba(0, 0, 0, 0.55),
        0 40px 80px -20px rgba(194, 65, 12, 0.22) !important;
}

/* The head: what they are getting, on ink navy. */
.vc-csg-head {
    position: relative;
    padding: 30px 32px 28px;
    color: #fff;
    background: linear-gradient(160deg, var(--vc-ink-3) 0%, var(--vc-ink-2) 45%, var(--vc-ink) 100%);
}

/* A thin copper rule where the head meets the form. */
.vc-csg-head::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--vc-copper) 0%, var(--vc-copper-hi) 50%, var(--vc-copper) 100%);
}

.vc-csg-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--vc-gold-soft);
}

.vc-csg-badge-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    color: var(--vc-gold-soft);
    background: rgba(241, 201, 165, 0.10);
    box-shadow: inset 0 0 0 1px rgba(241, 201, 165, 0.24);
}

.vc-csg-heading {
    margin: 18px 0 8px;
    font-size: 27px;
    line-height: 1.18;
    font-weight: 700;
    letter-spacing: -0.018em;
    color: #fff;
    text-wrap: balance;
}

.vc-csg-sub {
    margin: 0;
    max-width: 36ch;
    font-size: 15px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.78);
}

.vc-csg-body {
    padding: 28px 32px 26px;
}

.vc-csg-form {
    min-height: 40px;
}

/* ---------------------------------------------------------------------------
   The form (HubSpot's embed, or the fallback with its class names)
   ------------------------------------------------------------------------ */

.vc-csg-form .hs-form-field {
    margin-bottom: 16px;
}

.vc-csg-form label {
    display: block;
    margin-bottom: 7px;
    font-size: 13.5px;
    font-weight: 600;
    letter-spacing: 0.005em;
    color: var(--vc-text);
}

.vc-csg-form input[type="text"],
.vc-csg-form input[type="email"],
.vc-csg-form input[type="tel"],
.vc-csg-form select,
.vc-csg-form textarea {
    width: 100% !important;
    box-sizing: border-box;
    min-height: 48px;
    padding: 12px 14px;
    font: inherit;
    font-size: 15px;
    color: var(--vc-text);
    background: #fff;
    border: 1px solid var(--vc-field);
    border-radius: 10px;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.vc-csg-form input[type="text"]:hover,
.vc-csg-form input[type="email"]:hover,
.vc-csg-form input[type="tel"]:hover,
.vc-csg-form select:hover,
.vc-csg-form textarea:hover {
    border-color: #5D6B78;
}

.vc-csg-form input::placeholder,
.vc-csg-form textarea::placeholder {
    color: #5D6B78;
}

.vc-csg-form input:focus,
.vc-csg-form select:focus,
.vc-csg-form textarea:focus {
    outline: none;
    border-color: var(--vc-copper);
    box-shadow: 0 0 0 4px var(--vc-focus);
}

.vc-csg-form input.vc-csg-bad {
    border-color: var(--vc-error);
    box-shadow: 0 0 0 4px rgba(180, 35, 24, 0.14);
}

/* The one solid block of colour in the card. */
.vc-csg-form input[type="submit"],
.vc-csg-form .hs-button {
    width: 100%;
    min-height: 52px;
    margin-top: 8px;
    padding: 14px 18px;
    font: inherit;
    font-size: 15.5px;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: #fff;
    background: var(--vc-copper);
    border: 0;
    border-radius: 12px;
    cursor: pointer;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 1px 2px rgba(154, 52, 18, 0.30),
        0 10px 24px -10px rgba(194, 65, 12, 0.55);
    transition: background-color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.vc-csg-form input[type="submit"]:hover,
.vc-csg-form .hs-button:hover {
    background: var(--vc-copper-dk);
}

.vc-csg-form input[type="submit"]:active,
.vc-csg-form .hs-button:active {
    transform: translateY(1px);
}

.vc-csg-form input[type="submit"]:focus-visible,
.vc-csg-form .hs-button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--vc-copper);
}

.vc-csg-form input[type="submit"][disabled],
.vc-csg-form .hs-button[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
}

/* HubSpot's validation text, and ours, in one voice. */
.vc-csg-form .hs-error-msg,
.vc-csg-form .hs-error-msgs label,
.vc-csg-error,
.vc-csg-note {
    margin: 7px 0 0;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;
    color: var(--vc-error);
}

.vc-csg-form .hs-error-msgs {
    list-style: none;
    margin: 6px 0 0;
    padding: 0;
}

/* ---------------------------------------------------------------------------
   After submit
   ------------------------------------------------------------------------ */

.vc-csg-done {
    margin: 4px 0 0;
    padding: 16px 18px;
    font-size: 15px;
    line-height: 1.55;
    color: var(--vc-ok);
    background: #E9EFF8;
    border: 1px solid #D6E1F0;
    border-radius: 12px;
}

/* The manual link: a pop-up blocker must not leave them with nothing to
   click. Navy, so the copper stays the colour of the one first action. */
.vc-csg-get {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    margin-top: 12px;
    padding: 12px 20px;
    box-sizing: border-box;
    font-size: 15px;
    font-weight: 600;
    color: #fff !important;
    background: var(--vc-ink-2);
    border-radius: 12px;
    text-decoration: none;
    transition: background-color .15s ease;
}

.vc-csg-get:hover {
    background: var(--vc-ink-3);
}

.vc-csg-get:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--vc-ink-3);
}

/* ---------------------------------------------------------------------------
   Fine print
   ------------------------------------------------------------------------ */

.vc-csg-fineprint {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 22px -32px -26px;
    padding: 16px 32px 18px;
    font-size: 12.5px;
    line-height: 1.55;
    color: var(--vc-text-2);
    background: var(--vc-ivory);
    border-top: 1px solid var(--vc-line);
}

.vc-csg-fine-lock {
    flex: 0 0 auto;
    margin-top: 2px;
    color: #5D6B78;
}


/* ---------------------------------------------------------------------------
   Light inline layout and graphics enhancements
   ------------------------------------------------------------------------ */

.vc-csg-gate-layout {
    position: relative;
    display: grid;
    grid-template-columns: minmax(300px, 1fr) minmax(360px, 460px);
    gap: 64px;
    align-items: center;
    width: min(1120px, 100%);
    margin: 0 auto;
    z-index: 1;
}

.vc-csg-gate-layout::before,
.vc-csg-gate-layout::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

/* darker dotted pattern top-left */
.vc-csg-gate-layout::before {
    top: -70px;
    left: -34px;
    width: 180px;
    height: 180px;
    opacity: 0.7;
    background-image: radial-gradient(circle, rgba(127, 162, 223, 0.72) 1.2px, transparent 1.3px);
    background-size: 20px 20px;
}

/* second dotted cluster on the right side */
.vc-csg-gate-layout::after {
    top: -26px;
    right: -26px;
    width: 156px;
    height: 220px;
    opacity: 0.55;
    background-image: radial-gradient(circle, rgba(127, 162, 223, 0.68) 1.15px, transparent 1.25px);
    background-size: 18px 18px;
}

.vc-csg-overlay.is-inline {
    position: relative;
}

.vc-csg-overlay.is-inline::after {
    content: "";
    position: absolute;
    inset: 46px 0 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 16% 22%, rgba(86, 140, 235, 0.15) 0 54px, transparent 55px),
        radial-gradient(circle at 86% 16%, rgba(86, 140, 235, 0.11) 0 42px, transparent 43px),
        radial-gradient(circle at 80% 76%, rgba(224, 120, 47, 0.10) 0 90px, transparent 91px),
        radial-gradient(circle at 12% 84%, rgba(224, 120, 47, 0.10) 0 72px, transparent 73px),
        radial-gradient(circle at 92% 84%, rgba(86, 140, 235, 0.08) 0 120px, transparent 121px),
        radial-gradient(circle at 7% 78%, rgba(86, 140, 235, 0.08) 0 120px, transparent 121px);
}

.vc-csg-intro {
    position: relative;
    z-index: 1;
    max-width: 500px;
}

.vc-csg-intro::before,
.vc-csg-intro::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

/* subtle orbit line */
.vc-csg-intro::before {
    top: -102px;
    left: -210px;
    width: 720px;
    height: 240px;
    border-top: 1.5px solid rgba(127, 162, 223, 0.42);
    border-radius: 50%;
}

/* bottom-left extra dots */
.vc-csg-intro::after {
    bottom: -110px;
    left: -34px;
    width: 170px;
    height: 130px;
    opacity: 0.52;
    background-image: radial-gradient(circle, rgba(127, 162, 223, 0.68) 1.15px, transparent 1.25px);
    background-size: 18px 18px;
}

.vc-csg-intro-kicker {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 26px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.16em;
    color: #2C5187;
}

.vc-csg-intro-kicker::before {
    content: "";
    width: 36px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--vc-copper) 0%, var(--vc-copper-hi) 100%);
}

.vc-csg-intro-title {
    margin: 0;
    font-size: clamp(40px, 4vw, 64px);
    line-height: 1.02;
    letter-spacing: -0.04em;
    font-weight: 700;
    color: #1C2E48;
    text-wrap: balance;
}

.vc-csg-intro-title span {
    color: var(--vc-copper-hi);
}

.vc-csg-intro-copy {
    margin: 22px 0 0;
    max-width: 34ch;
    font-size: 16px;
    line-height: 1.72;
    color: #5D6B78;
}

.vc-csg-intro-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 26px 0 24px;
}

.vc-csg-intro-chip {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: #2C5187;
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(156, 181, 224, 0.55);
    border-radius: 999px;
    box-shadow: 0 10px 24px -22px rgba(32, 73, 145, 0.4);
    backdrop-filter: blur(4px);
}

.vc-csg-intro-benefits {
    list-style: none;
    margin: 0;
    padding: 0;
}

.vc-csg-intro-benefits li {
    position: relative;
    margin: 0 0 14px;
    padding-left: 34px;
    font-size: 15px;
    line-height: 1.55;
    color: #2C5187;
}

.vc-csg-intro-benefits li::before {
    content: "\2713";
    position: absolute;
    left: 0;
    top: 1px;
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    font-size: 12px;
    font-weight: 700;
    color: var(--vc-copper);
    background: rgba(224, 120, 47, 0.16);
    border-radius: 50%;
}

.vc-csg-intro-foot {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 28px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: #5D6B78;
}

.vc-csg-intro-foot::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: linear-gradient(180deg, rgba(224, 120, 47, 0.95) 0%, rgba(194, 65, 12, 0.95) 100%);
    box-shadow: 0 0 0 5px rgba(224, 120, 47, 0.12);
}

.vc-csg-card {
    position: relative;
    z-index: 2;
}

/* keep a light visual style for the inline version */
.vc-csg-overlay.is-inline .vc-csg-card {
    max-width: 460px;
}

.vc-csg-overlay.is-inline .vc-csg-card .vc-csg-head {
    background: transparent !important;
    color: var(--vc-text) !important;
    padding: 24px 26px 10px !important;
}

.vc-csg-overlay.is-inline .vc-csg-card .vc-csg-head::after {
    display: none !important;
}

.vc-csg-overlay.is-inline .vc-csg-card .vc-csg-badge {
    color: #5D6B78 !important;
    font-size: 12.5px !important;
    letter-spacing: 0.04em !important;
}

.vc-csg-overlay.is-inline .vc-csg-card .vc-csg-badge-icon {
    width: 28px !important;
    height: 28px !important;
    color: #2C5187 !important;
    background: rgba(95, 146, 238, 0.11) !important;
    box-shadow: inset 0 0 0 1px rgba(95, 146, 238, 0.14) !important;
}

.vc-csg-overlay.is-inline .vc-csg-card .vc-csg-heading {
    color: #2C5187 !important;
    -webkit-text-fill-color: #2C5187 !important;
    font-size: 22px !important;
    margin: 16px 0 8px !important;
}

.vc-csg-overlay.is-inline .vc-csg-card .vc-csg-sub {
    color: #5D6B78 !important;
    -webkit-text-fill-color: #5D6B78 !important;
    max-width: none !important;
}

.vc-csg-overlay.is-inline .vc-csg-card {
    background: rgba(255, 255, 255, 0.86) !important;
    border: 1px solid rgba(184, 198, 224, 0.5) !important;
    box-shadow:
        0 14px 32px -18px rgba(31, 55, 98, 0.22),
        0 40px 80px -40px rgba(224, 120, 47, 0.32) !important;
    backdrop-filter: blur(10px);
}

.vc-csg-overlay.is-inline .vc-csg-card .vc-csg-body {
    background: transparent !important;
    padding: 14px 26px 24px !important;
}

.vc-csg-overlay.is-inline .vc-csg-card .vc-csg-fineprint {
    background: rgba(248, 250, 253, 0.92) !important;
    border-top: 1px solid rgba(203, 214, 233, 0.7) !important;
}

@media (max-width: 980px) {
    .vc-csg-gate-layout {
        grid-template-columns: 1fr;
        gap: 34px;
        width: min(680px, 100%);
    }

    .vc-csg-intro {
        max-width: none;
    }

    .vc-csg-intro::before {
        left: -110px;
        width: 520px;
    }

    .vc-csg-overlay.is-inline .vc-csg-card {
        max-width: none !important;
    }
}

@media (max-width: 480px) {
    .vc-csg-gate-layout::before,
    .vc-csg-gate-layout::after,
    .vc-csg-intro::before,
    .vc-csg-intro::after {
        opacity: 0.42;
    }

    .vc-csg-intro-kicker {
        margin-bottom: 20px;
    }

    .vc-csg-intro-title {
        font-size: 36px;
    }

    .vc-csg-intro-copy {
        font-size: 15px;
        margin-top: 18px;
    }

    .vc-csg-intro-chips {
        margin: 20px 0 20px;
        gap: 8px;
    }

    .vc-csg-intro-chip {
        min-height: 34px;
        padding: 7px 12px;
        font-size: 12.5px;
    }

    .vc-csg-overlay.is-inline .vc-csg-card .vc-csg-head {
        padding: 22px 22px 8px !important;
    }

    .vc-csg-overlay.is-inline .vc-csg-card .vc-csg-body {
        padding: 14px 22px 22px !important;
    }
}


/* ---------------------------------------------------------------------------
   Small screens
   ------------------------------------------------------------------------ */

@media (max-width: 480px) {
    .vc-csg-overlay.is-inline {
        padding: 96px 14px 88px;
        border-radius: 100% 100% 0 0 / 56px 56px 0 0;
    }
    .vc-csg-card {
        --vc-radius: 16px;
    }
    .vc-csg-head {
        padding: 24px 22px 22px;
    }
    .vc-csg-body {
        padding: 22px 22px 22px;
    }
    .vc-csg-fineprint {
        margin: 20px -22px -22px;
        padding: 14px 22px 16px;
    }
    .vc-csg-heading {
        font-size: 23px;
    }
}

/* ---------------------------------------------------------------------------
   Print: the printed page must not be a way around the gate.
   ------------------------------------------------------------------------ */

@media print {
    body.vc-csg-gated > *:not(.vc-csg-overlay) {
        display: none !important;
    }
    .vc-csg-overlay {
        position: static;
        background: none;
        color: #000;
    }
}

/* Last word on the reveal, so no earlier resting state out-ranks it. */
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) {
    .vc-csg-overlay.is-inline.is-in .vc-csg-card {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===========================================================================
   THEME SHIELD
   ---------------------------------------------------------------------------
   WordPress themes, page builders and HubSpot's own embed stylesheet all
   style h2, p, label, input and button globally, and HubSpot injects its
   CSS after ours. Everything the card depends on is re-asserted here with
   !important at a specificity of three classes, so a theme rule like
   `.entry-content h2` or HubSpot's `fieldset.form-columns-1 .hs-input`
   cannot win. Keep this block LAST in the file.
   ======================================================================== */

.vc-csg-overlay .vc-csg-card,
.vc-csg-overlay .vc-csg-card *,
.vc-csg-overlay .vc-csg-card *::before,
.vc-csg-overlay .vc-csg-card *::after {
    box-sizing: border-box !important;
}

.vc-csg-overlay .vc-csg-card {
    width: 100% !important;
    max-width: 460px !important;
    padding: 0 !important;
    color: var(--vc-text) !important;
    background: var(--vc-paper) !important;
    border-radius: var(--vc-radius) !important;
    overflow: hidden !important;
    text-align: left !important;
    line-height: 1.5 !important;
}

/* ---- Head ---------------------------------------------------------------- */

.vc-csg-overlay .vc-csg-card .vc-csg-head {
    margin: 0 !important;
    padding: 30px 32px 28px !important;
    background: linear-gradient(160deg, var(--vc-ink-3) 0%, var(--vc-ink-2) 45%, var(--vc-ink) 100%) !important;
    border: 0 !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-badge {
    margin: 0 !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
    color: var(--vc-gold-soft) !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-heading {
    display: block !important;
    margin: 18px 0 8px !important;
    padding: 0 !important;
    font-family: inherit !important;
    font-size: 27px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 1.18 !important;
    letter-spacing: -0.018em !important;
    text-transform: none !important;
    text-align: left !important;
    text-shadow: none !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;   /* themes that paint headings with gradient text */
    background: none !important;
    border: 0 !important;
    opacity: 1 !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-heading::before,
.vc-csg-overlay .vc-csg-card .vc-csg-heading::after {
    content: none !important;   /* theme heading underlines and icons */
}

.vc-csg-overlay .vc-csg-card .vc-csg-sub {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 36ch !important;
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.55 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: rgba(255, 255, 255, 0.78) !important;
    -webkit-text-fill-color: currentColor !important;
}

/* ---- Body and HubSpot's form scaffolding --------------------------------- */

.vc-csg-overlay .vc-csg-card .vc-csg-body {
    margin: 0 !important;
    padding: 28px 32px 26px !important;
    background: var(--vc-paper) !important;
}

.vc-csg-overlay .vc-csg-form form,
.vc-csg-overlay .vc-csg-form fieldset {
    width: 100% !important;
    max-width: none !important;   /* HubSpot caps fieldsets at 500px */
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
}

.vc-csg-overlay .vc-csg-form .hs-form-field,
.vc-csg-overlay .vc-csg-form .field {
    float: none !important;
    width: 100% !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
}

/* HubSpot's two-column rows (first name / last name side by side). */
.vc-csg-overlay .vc-csg-form fieldset.form-columns-2 {
    display: flex !important;
    gap: 14px !important;
}

.vc-csg-overlay .vc-csg-form fieldset.form-columns-2 .hs-form-field {
    flex: 1 1 0 !important;
    min-width: 0 !important;
}

/* HubSpot wraps each input in .input with a right margin. */
.vc-csg-overlay .vc-csg-form .input {
    margin: 0 !important;
    padding: 0 !important;
}

.vc-csg-overlay .vc-csg-form legend.hs-field-desc,
.vc-csg-overlay .vc-csg-form .hs-field-desc {
    margin: 0 0 6px !important;
    font-size: 13px !important;
    color: var(--vc-text-2) !important;
}

/* ---- Labels -------------------------------------------------------------- */

.vc-csg-overlay .vc-csg-form label:not(.hs-error-msg):not(.hs-form-booleancheckbox-display):not(.hs-form-checkbox-display):not(.hs-form-radio-display) {
    display: block !important;
    float: none !important;
    width: auto !important;
    margin: 0 0 7px !important;
    padding: 0 !important;
    font-family: inherit !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    font-style: normal !important;
    line-height: 1.4 !important;
    letter-spacing: 0.005em !important;
    text-transform: none !important;
    text-align: left !important;
    color: var(--vc-text) !important;
}

.vc-csg-overlay .vc-csg-form .hs-form-required {
    margin-left: 2px !important;
    color: var(--vc-copper) !important;
}

/* ---- Text fields --------------------------------------------------------- */

.vc-csg-overlay .vc-csg-form input[type="text"],
.vc-csg-overlay .vc-csg-form input[type="email"],
.vc-csg-overlay .vc-csg-form input[type="tel"],
.vc-csg-overlay .vc-csg-form input[type="number"],
.vc-csg-overlay .vc-csg-form input[type="url"],
.vc-csg-overlay .vc-csg-form select,
.vc-csg-overlay .vc-csg-form textarea {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 12px 14px !important;
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    text-indent: 0 !important;
    color: var(--vc-text) !important;
    background: #fff !important;
    border: 1px solid var(--vc-field) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    outline: none !important;
    opacity: 1 !important;
    transition: border-color .15s ease, box-shadow .15s ease !important;
}

.vc-csg-overlay .vc-csg-form input[type="text"],
.vc-csg-overlay .vc-csg-form input[type="email"],
.vc-csg-overlay .vc-csg-form input[type="tel"],
.vc-csg-overlay .vc-csg-form input[type="number"],
.vc-csg-overlay .vc-csg-form input[type="url"],
.vc-csg-overlay .vc-csg-form textarea {
    -webkit-appearance: none !important;
    appearance: none !important;
}

.vc-csg-overlay .vc-csg-form textarea {
    min-height: 120px !important;
    resize: vertical !important;
}

.vc-csg-overlay .vc-csg-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):hover,
.vc-csg-overlay .vc-csg-form select:hover,
.vc-csg-overlay .vc-csg-form textarea:hover {
    border-color: #5D6B78 !important;
}

.vc-csg-overlay .vc-csg-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):focus,
.vc-csg-overlay .vc-csg-form select:focus,
.vc-csg-overlay .vc-csg-form textarea:focus {
    border-color: var(--vc-copper) !important;
    box-shadow: 0 0 0 4px var(--vc-focus) !important;
}

.vc-csg-overlay .vc-csg-form input.vc-csg-bad,
.vc-csg-overlay .vc-csg-form input.invalid,
.vc-csg-overlay .vc-csg-form input.error {
    border-color: var(--vc-error) !important;
    box-shadow: 0 0 0 4px rgba(180, 35, 24, 0.14) !important;
}

.vc-csg-overlay .vc-csg-form input::placeholder,
.vc-csg-overlay .vc-csg-form textarea::placeholder {
    font-family: inherit !important;
    font-size: 15px !important;
    font-style: normal !important;
    color: #5D6B78 !important;
    opacity: 1 !important;
}

/* ---- Consent text and the submit row ------------------------------------- */

.vc-csg-overlay .vc-csg-form .legal-consent-container,
.vc-csg-overlay .vc-csg-form .hs-richtext {
    margin: 4px 0 8px !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
    color: var(--vc-text-2) !important;
}

.vc-csg-overlay .vc-csg-form .legal-consent-container p,
.vc-csg-overlay .vc-csg-form .hs-richtext p {
    margin: 0 0 6px !important;
    font-size: inherit !important;
}

.vc-csg-overlay .vc-csg-form .hs_submit,
.vc-csg-overlay .vc-csg-form .hs-submit,
.vc-csg-overlay .vc-csg-form .actions {
    margin: 0 !important;
    padding: 0 !important;
}

.vc-csg-overlay .vc-csg-form .hs_recaptcha:empty,
.vc-csg-overlay .vc-csg-form .hs-field-desc:empty {
    display: none !important;
}

.vc-csg-overlay .vc-csg-form input[type="submit"],
.vc-csg-overlay .vc-csg-form .hs-button {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 52px !important;
    margin: 8px 0 0 !important;
    padding: 14px 18px !important;
    font-family: inherit !important;
    font-size: 15.5px !important;
    font-weight: 700 !important;
    font-style: normal !important;
    line-height: 1.2 !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
    text-align: center !important;
    text-shadow: none !important;
    white-space: normal !important;
    color: #fff !important;
    background: var(--vc-copper) !important;
    border: 0 !important;
    border-radius: 12px !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 1px 2px rgba(154, 52, 18, 0.30),
        0 10px 24px -10px rgba(194, 65, 12, 0.55) !important;
    cursor: pointer !important;
    opacity: 1 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    transition: background-color .15s ease, transform .15s ease !important;
}

.vc-csg-overlay .vc-csg-form input[type="submit"]:hover,
.vc-csg-overlay .vc-csg-form .hs-button:hover {
    color: #fff !important;
    background: var(--vc-copper-dk) !important;
}

.vc-csg-overlay .vc-csg-form input[type="submit"]:focus-visible,
.vc-csg-overlay .vc-csg-form .hs-button:focus-visible {
    outline: none !important;
    box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--vc-copper) !important;
}

.vc-csg-overlay .vc-csg-form input[type="submit"][disabled],
.vc-csg-overlay .vc-csg-form .hs-button[disabled] {
    opacity: 0.55 !important;
    cursor: not-allowed !important;
}

/* ---- Errors, success, download link -------------------------------------- */

.vc-csg-overlay .vc-csg-form .hs-error-msgs {
    margin: 6px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.vc-csg-overlay .vc-csg-form .hs-error-msgs li {
    margin: 0 !important;
    padding: 0 !important;
}

.vc-csg-overlay .vc-csg-form .hs-error-msgs li::before {
    content: none !important;   /* theme list bullets */
}

.vc-csg-overlay .vc-csg-form .hs-error-msg,
.vc-csg-overlay .vc-csg-form .hs-error-msgs label,
.vc-csg-overlay .vc-csg-card .vc-csg-error,
.vc-csg-overlay .vc-csg-card .vc-csg-note {
    display: block !important;
    margin: 7px 0 0 !important;
    padding: 0 !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;
    text-transform: none !important;
    color: var(--vc-error) !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-done {
    margin: 4px 0 0 !important;
    padding: 16px 18px !important;
    font-family: inherit !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    color: var(--vc-ok) !important;
    background: #E9EFF8 !important;
    border: 1px solid #D6E1F0 !important;
    border-radius: 12px !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-get {
    display: inline-flex !important;
    min-height: 48px !important;
    margin: 12px 0 0 !important;
    padding: 12px 20px !important;
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    text-transform: none !important;
    color: #fff !important;
    background: var(--vc-ink-2) !important;
    border: 0 !important;
    border-radius: 12px !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-get:hover {
    color: #fff !important;
    background: var(--vc-ink-3) !important;
}

/* ---- Fine print (its negative margins depend on these values) ------------ */

.vc-csg-overlay .vc-csg-card .vc-csg-fineprint {
    display: flex !important;
    margin: 22px -32px -26px !important;
    padding: 16px 32px 18px !important;
    font-family: inherit !important;
    font-size: 12.5px !important;
    line-height: 1.55 !important;
    color: var(--vc-text-2) !important;
    background: var(--vc-ivory) !important;
    border: 0 !important;
    border-top: 1px solid var(--vc-line) !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-fineprint span {
    font-size: inherit !important;
    color: inherit !important;
}

/* ---- Ghost lines are spans: themes sometimes style those too ------------- */

body .vc-csg-ghost .vc-csg-ghost-line {
    display: block !important;
    padding: 0 !important;
    border: 0 !important;
}

/* ---- Small screens: the same values, asserted ---------------------------- */

@media (max-width: 480px) {
    .vc-csg-overlay .vc-csg-card .vc-csg-head   { padding: 24px 22px 22px !important; }
    .vc-csg-overlay .vc-csg-card .vc-csg-body   { padding: 22px !important; }
    .vc-csg-overlay .vc-csg-card .vc-csg-heading { font-size: 23px !important; }
    .vc-csg-overlay .vc-csg-card .vc-csg-fineprint {
        margin: 20px -22px -22px !important;
        padding: 14px 22px 16px !important;
    }
    .vc-csg-overlay .vc-csg-form fieldset.form-columns-2 {
        flex-direction: column !important;
        gap: 0 !important;
    }
}

.vc-csg-overlay {
    --vc-design-ink:#1C2E48;
    --vc-design-muted:#5D6B78;
    --vc-design-orange:#C6490D;
    --vc-design-blue:#2C5187;
}
.vc-csg-overlay.is-inline {
    isolation:isolate;
    margin:-42px auto 0;
    min-height:680px;
    padding:130px clamp(18px,4vw,64px) 120px;
    border-radius:0;
    background:
      radial-gradient(ellipse 25% 36% at 0% 48%,rgba(99,159,244,.19),transparent 100%),
      radial-gradient(ellipse 27% 45% at 100% 66%,rgba(255,178,125,.20),transparent 100%),
      linear-gradient(180deg,#fff 0%,#F7F8FA 14%,#F2F6FB 63%,#ffffff 100%);
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
}
.vc-csg-overlay.is-inline::before {
    content:"";
    position:absolute;
    inset:0;
    border:0;
    border-radius:0;
    -webkit-mask-image:none;
    mask-image:none;
    opacity:.85;
    background-image:radial-gradient(#D6E1F0 1.3px,transparent 1.3px);
    background-size:21px 21px;
    -webkit-mask-image:linear-gradient(90deg,#000 0%,transparent 16%,transparent 84%,#000 100%);
    mask-image:linear-gradient(90deg,#000 0%,transparent 16%,transparent 84%,#000 100%);
    pointer-events:none;
}
.vc-csg-overlay.is-inline::after {
    content:"";
    position:absolute;
    inset:15px -4% 0;
    border:1px solid transparent;
    border-top-color:rgba(70,150,255,.23);
    border-radius:50% 35% 0 0 / 130px 110px 0 0;
    transform:rotate(-3deg);
    pointer-events:none;
    z-index:0;
}
/* Make the same design work in original immediate modal mode, without
   changing its gating/locking behavior. */
.vc-csg-overlay:not(.is-inline) {
    background:linear-gradient(135deg,#E9EFF8 0%,#fff 48%,#FCF0E6 100%);
    -webkit-backdrop-filter:blur(12px);
    backdrop-filter:blur(12px);
}
.vc-csg-overlay .vc-csg-gate-layout {
    width:min(1040px,100%);
    margin:0 auto;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(360px,460px);
    gap:clamp(35px,6vw,94px);
    align-items:center;
    position:relative;
    z-index:2;
}
.vc-csg-overlay:not(.is-inline) .vc-csg-gate-layout {max-height:100%;}
.vc-csg-overlay .vc-csg-intro {
    max-width:475px;
    color:var(--vc-design-ink);
    text-align:left;
}
.vc-csg-intro-kicker {
    display:inline-flex;
    align-items:center;
    gap:12px;
    font-size:11px;
    font-weight:800;
    letter-spacing:.18em;
    color:#2C5187;
}
.vc-csg-intro-kicker::before {
    content:"";
    display:inline-block;
    width:38px;
    height:3px;
    border-radius:3px;
    background:var(--vc-design-orange);
}
.vc-csg-overlay .vc-csg-intro-title {
    margin:23px 0 15px;
    font-size:clamp(34px,3.35vw,50px);
    font-weight:800;
    letter-spacing:-.035em;
    line-height:1.14;
    color:var(--vc-design-ink);
}
.vc-csg-overlay .vc-csg-intro-title span{color:var(--vc-design-orange);}
.vc-csg-overlay .vc-csg-intro-copy {
    font-size:16px;
    line-height:1.75;
    color:var(--vc-design-muted);
    margin:0 0 25px;
}
.vc-csg-intro-benefits {list-style:none;padding:0!important;margin:0 0 23px!important;}
.vc-csg-intro-benefits li {
    position:relative;
    padding:8px 0 8px 38px;
    color:#1C2E48;
    font-size:14px;
    line-height:1.5;
}
.vc-csg-intro-benefits li::before {
    content: "\2713";
    position:absolute;
    left:0;
    top:7px;
    display:grid;
    place-items:center;
    width:23px;height:23px;
    border-radius:50%;
    background:#FCF0E6;
    color:#C6490D;
    font-size:13px;
    font-weight:900;
}
.vc-csg-overlay .vc-csg-intro-foot {font-size:12px;color:#5D6B78;margin:10px 0 0;}
.vc-csg-overlay .vc-csg-card {
    box-shadow:0 30px 80px rgba(41,76,136,.11),0 2px 16px rgba(46,72,121,.04)!important;
    border:1px solid #D6E1F0!important;
}
.vc-csg-overlay .vc-csg-gate-layout .vc-csg-card {
    margin:0 auto;
    max-width:460px!important;
    width:100%!important;
    border-radius:19px!important;
    overflow:hidden!important;
}
.vc-csg-overlay .vc-csg-card .vc-csg-head {
    padding:29px 30px 10px!important;
    background:#fff!important;
}
.vc-csg-overlay .vc-csg-card .vc-csg-head::after {display:none!important;}
.vc-csg-overlay .vc-csg-card .vc-csg-badge,
.vc-csg-overlay .vc-csg-card .vc-csg-badge-text {color:#2C5187!important;font-weight:800!important;letter-spacing:.1em!important;font-size:11px!important;}
.vc-csg-overlay .vc-csg-card .vc-csg-badge-icon {
    background:#E9EFF8!important;
    color:#2C5187!important;
    box-shadow:none!important;
}
.vc-csg-overlay .vc-csg-card .vc-csg-heading {
    font-size:26px!important;
    margin:12px 0 7px!important;
    color:var(--vc-design-ink)!important;
    -webkit-text-fill-color:var(--vc-design-ink)!important;
    line-height:1.22!important;
}
.vc-csg-overlay .vc-csg-card .vc-csg-sub {
    max-width:none!important;
    color:#5D6B78!important;
    -webkit-text-fill-color:#5D6B78!important;
    font-size:14px!important;
}
.vc-csg-overlay .vc-csg-card .vc-csg-body {padding:18px 30px 27px!important;}
.vc-csg-overlay .vc-csg-form input[type="text"],
.vc-csg-overlay .vc-csg-form input[type="email"],
.vc-csg-overlay .vc-csg-form input[type="tel"],
.vc-csg-overlay .vc-csg-form select,
.vc-csg-overlay .vc-csg-form textarea {
    background:#F7F8FA!important;
    border-color:#D6E1F0!important;
    border-radius:9px!important;
    min-height:46px!important;
}
.vc-csg-overlay .vc-csg-form input[type="submit"],
.vc-csg-overlay .vc-csg-form .hs-button {
    background:#C6490D!important;
    border-radius:9px!important;
    box-shadow:0 9px 18px rgba(244,119,25,.17)!important;
}
.vc-csg-overlay .vc-csg-form input[type="submit"]:hover,
.vc-csg-overlay .vc-csg-form .hs-button:hover {background:#A82100!important;}
.vc-csg-overlay .vc-csg-card .vc-csg-fineprint {background:#fff!important;border-top:1px solid #D9D9D9!important;}
/* Keep the gate visible if there is no JavaScript or no IntersectionObserver. */
@media (max-width:850px) {
    .vc-csg-overlay.is-inline {padding:105px 20px 85px;}
    .vc-csg-overlay .vc-csg-gate-layout {
        max-width:590px;
        grid-template-columns:minmax(0,1fr);
        gap:32px;
    }
    .vc-csg-overlay .vc-csg-intro {max-width:100%;}
    .vc-csg-overlay .vc-csg-intro-title {font-size:clamp(29px,6vw,42px);}
    .vc-csg-overlay:not(.is-inline) {align-items:flex-start;}
}
@media (max-width:480px) {
    .vc-csg-overlay.is-inline {padding:85px 15px 70px;}
    .vc-csg-overlay .vc-csg-card .vc-csg-head {padding:24px 21px 8px!important;}
    .vc-csg-overlay .vc-csg-card .vc-csg-body {padding:17px 21px 24px!important;}
    .vc-csg-overlay .vc-csg-card .vc-csg-heading {font-size:23px!important;}
    .vc-csg-overlay .vc-csg-intro-copy {font-size:15px;}
    .vc-csg-overlay .vc-csg-gate-layout {gap:26px;}
}
@media(prefers-reduced-motion:reduce){.vc-csg-overlay .vc-csg-card{transform:none!important;opacity:1!important;}}

/* Title */
.vc-csg-heading { color: #c6490d; }

/* Download button */
.vc-csg-card .vc-csg-get {
    background: #1c2e48;
    border-color: #1c2e48;
    color: #fff;
}

/* Success box (the green one above the button) */
.vc-csg-card .vc-csg-done {
    background: #E9EFF8;
    border-color: #E9EFF8;
    color: #111827;
}

/* Value Creed case-study gate — UI refinement v1.16 */
.vc-csg-overlay {
    --vc-shadow: 0 28px 70px -26px rgba(28, 46, 72, .34);
}

.vc-csg-overlay.is-inline {
    min-height: 720px;
    padding: 112px clamp(24px, 5vw, 80px) 112px;
    background:
        radial-gradient(circle at 8% 28%, rgba(44, 81, 135, .10) 0 80px, transparent 81px),
        radial-gradient(circle at 88% 72%, rgba(198, 73, 13, .10) 0 88px, transparent 89px),
        linear-gradient(115deg, rgba(233, 239, 248, .78), transparent 34%),
        linear-gradient(245deg, rgba(252, 240, 230, .72), transparent 33%),
        #F7F8FA;
}

.vc-csg-overlay.is-inline::before {
    opacity: .48;
    background-image: radial-gradient(rgba(44, 81, 135, .42) 1px, transparent 1.2px);
    background-size: 22px 22px;
}

.vc-csg-overlay.is-inline::after {
    inset: 22px -8% auto;
    height: 210px;
    border: 1px solid transparent;
    border-top-color: rgba(44, 81, 135, .18);
    border-radius: 50%;
    transform: rotate(-4deg);
}

.vc-csg-overlay .vc-csg-gate-layout {
    width: min(1080px, 100%);
    grid-template-columns: minmax(0, 1.06fr) minmax(390px, 470px);
    gap: clamp(48px, 7vw, 104px);
}

.vc-csg-overlay .vc-csg-intro {
    max-width: 500px;
}

.vc-csg-intro-kicker {
    gap: 10px;
    margin-bottom: 22px;
    color: #2C5187;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
}

.vc-csg-intro-kicker::before {
    width: 34px;
    height: 3px;
    background: #C6490D;
}

.vc-csg-overlay .vc-csg-intro-title {
    max-width: 10ch;
    margin: 0 0 18px;
    color: #1C2E48;
    font-size: clamp(40px, 4.1vw, 58px);
    font-weight: 700;
    letter-spacing: -.045em;
    line-height: 1.04;
}

.vc-csg-overlay .vc-csg-intro-title span {
    color: #C6490D;
}

.vc-csg-overlay .vc-csg-intro-copy {
    max-width: 46ch;
    margin-bottom: 24px;
    color: #5D6B78;
    font-size: 16px;
    line-height: 1.7;
}

.vc-csg-intro-chips {
    gap: 8px;
    margin-bottom: 24px;
}

.vc-csg-intro-chip {
    padding: 8px 12px;
    color: #2C5187;
    background: rgba(255, 255, 255, .78);
    border: 1px solid #D6E1F0;
    border-radius: 999px;
    box-shadow: 0 5px 14px -12px rgba(28, 46, 72, .4);
}

.vc-csg-intro-benefits {
    display: grid;
    gap: 9px;
    margin: 0 !important;
}

.vc-csg-intro-benefits li {
    min-height: 28px;
    padding: 8px 12px 8px 42px;
    color: #1C2E48;
    background: rgba(255, 255, 255, .58);
    border: 1px solid rgba(214, 225, 240, .74);
    border-radius: 10px;
}

.vc-csg-intro-benefits li::before {
    left: 10px;
    top: 8px;
    width: 23px;
    height: 23px;
    color: #C6490D;
    background: #FCF0E6;
}

.vc-csg-overlay .vc-csg-card {
    border: 1px solid rgba(44, 81, 135, .16) !important;
    border-top: 4px solid #C6490D !important;
    border-radius: 22px !important;
    box-shadow: var(--vc-shadow) !important;
    overflow: hidden !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-head {
    padding: 28px 30px 26px !important;
    color: #E8EFF6 !important;
    background: linear-gradient(145deg, #1C2E48, #2C5187) !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-badge,
.vc-csg-overlay .vc-csg-card .vc-csg-badge-text {
    color: #F0A868 !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-badge-icon {
    color: #F0A868 !important;
    background: rgba(240, 168, 104, .12) !important;
    box-shadow: inset 0 0 0 1px rgba(240, 168, 104, .28) !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-heading {
    margin: 0 0 7px !important;
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
    font-size: 27px !important;
    letter-spacing: -.025em !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-sub {
    color: #E8EFF6 !important;
    -webkit-text-fill-color: #E8EFF6 !important;
    line-height: 1.55 !important;
}

.vc-csg-overlay .vc-csg-card .vc-csg-body {
    padding: 25px 30px 28px !important;
    background: #FFFFFF !important;
}

.vc-csg-overlay .vc-csg-form input[type="text"],
.vc-csg-overlay .vc-csg-form input[type="email"],
.vc-csg-overlay .vc-csg-form input[type="tel"],
.vc-csg-overlay .vc-csg-form select,
.vc-csg-overlay .vc-csg-form textarea {
    min-height: 48px !important;
    background: #FFFFFF !important;
    border: 1px solid #C9D6E4 !important;
    border-radius: 10px !important;
}

.vc-csg-overlay .vc-csg-form input:focus,
.vc-csg-overlay .vc-csg-form select:focus,
.vc-csg-overlay .vc-csg-form textarea:focus {
    border-color: #C6490D !important;
    box-shadow: 0 0 0 4px rgba(198, 73, 13, .13) !important;
}

.vc-csg-overlay .vc-csg-form input[type="submit"],
.vc-csg-overlay .vc-csg-form .hs-button {
    min-height: 52px !important;
    margin-top: 10px !important;
    background: #C6490D !important;
    border-radius: 10px !important;
    box-shadow: 0 12px 24px -13px rgba(168, 33, 0, .7) !important;
}

.vc-csg-overlay .vc-csg-form input[type="submit"]:hover,
.vc-csg-overlay .vc-csg-form .hs-button:hover {
    background: #A82100 !important;
    transform: translateY(-1px);
}

.vc-csg-overlay .vc-csg-card .vc-csg-fineprint {
    min-height: 38px;
    margin: 20px -30px -28px !important;
    padding: 13px 30px !important;
    color: #5D6B78 !important;
    background: #F2F6FB !important;
    border-top: 1px solid #D6E1F0 !important;
}

@media (max-width: 850px) {
    .vc-csg-overlay.is-inline { padding: 82px 22px 76px; }
    .vc-csg-overlay .vc-csg-gate-layout {
        max-width: 620px;
        grid-template-columns: 1fr;
        gap: 38px;
    }
    .vc-csg-overlay .vc-csg-intro { max-width: 560px; }
    .vc-csg-overlay .vc-csg-intro-title { max-width: 12ch; }
}

@media (max-width: 480px) {
    .vc-csg-overlay.is-inline { padding: 64px 14px 54px; }
    .vc-csg-overlay .vc-csg-intro-title { font-size: 36px; }
    .vc-csg-intro-chips { display: none; }
    .vc-csg-overlay .vc-csg-card { border-radius: 17px !important; }
    .vc-csg-overlay .vc-csg-card .vc-csg-head { padding: 24px 21px 22px !important; }
    .vc-csg-overlay .vc-csg-card .vc-csg-body { padding: 22px 21px 25px !important; }
    .vc-csg-overlay .vc-csg-card .vc-csg-fineprint {
        margin: 18px -21px -25px !important;
        padding: 12px 21px !important;
    }
}