.floating-cta {
    align-items: center;
    background: var(--floating-cta-bg, #123f3b);
    border-radius: 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    bottom: 0;
    box-shadow: 0 -10px 30px rgba(9, 35, 32, 0.14);
    color: var(--floating-cta-text, #fff);
    display: flex;
    font-family: var(--floating-cta-font, inherit);
    left: 0;
    min-height: var(--floating-cta-height, 82px);
    padding: 10px 24px;
    position: fixed;
    right: 0;
    z-index: 9999;
}

.floating-cta--has-close {
    padding-left: 72px;
    padding-right: 72px;
}

.floating-cta[hidden] { display: none; }

.floating-cta__inner {
    align-items: center;
    display: flex;
    gap: 28px;
    justify-content: center;
    margin: 0 auto;
    max-width: 1120px;
    width: 100%;
}

.floating-cta__copy {
    display: grid;
    line-height: 1.18;
    min-width: 0;
}

.floating-cta__copy strong {
    color: var(--floating-cta-text, #fff) !important;
    font-size: var(--floating-cta-headline-size, 19px);
    font-weight: var(--floating-cta-headline-weight, 700) !important;
    letter-spacing: 0.01em;
}

.floating-cta__copy span {
    color: var(--floating-cta-text, #fff) !important;
    font-size: var(--floating-cta-supporting-size, 15px);
    font-weight: var(--floating-cta-supporting-weight, 400) !important;
    margin-top: 4px;
    opacity: 0.78;
}

.floating-cta__separator {
    background: currentColor;
    height: 44px;
    opacity: 0.24;
    width: 1px;
}

/*
 * Use the CTA id plus !important on user-controlled button appearance values.
 * This prevents common WordPress themes/page builders from replacing the
 * configured background, text, radius, or border with global a/button rules.
 */
#floating-cta .floating-cta__button,
#floating-cta a.floating-cta__button,
#floating-cta a.floating-cta__button:link,
#floating-cta a.floating-cta__button:visited {
    -webkit-appearance: none !important;
    align-items: center;
    appearance: none !important;
    background-color: var(--floating-cta-button-bg, #f7f7f3) !important;
    background-image: none !important;
    border-color: var(--floating-cta-border, #fff) !important;
    border-radius: var(--floating-cta-radius, 5px) !important;
    border-style: solid !important;
    border-width: var(--floating-cta-border-size, 1px) !important;
    box-shadow: 0 2px 8px rgba(5, 27, 25, 0.18);
    box-sizing: border-box !important;
    color: var(--floating-cta-button-text, #123f3b) !important;
    display: inline-flex;
    font-size: var(--floating-cta-button-size, 15px);
    font-weight: 800;
    gap: 16px;
    justify-content: center;
    letter-spacing: 0.025em;
    min-height: 0;
    padding: var(--floating-cta-button-padding-y, 15px) var(--floating-cta-button-padding-x, 27px);
    text-decoration: none !important;
    text-transform: uppercase;
    transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
    white-space: nowrap;
}

#floating-cta .floating-cta__button:hover,
#floating-cta .floating-cta__button:focus,
#floating-cta .floating-cta__button:focus-visible,
#floating-cta a.floating-cta__button:hover,
#floating-cta a.floating-cta__button:focus,
#floating-cta a.floating-cta__button:focus-visible {
    background-color: var(--floating-cta-button-hover-bg, #fff) !important;
    background-image: none !important;
    border-color: var(--floating-cta-border-hover, #fff) !important;
    border-style: solid !important;
    border-width: var(--floating-cta-border-size, 1px) !important;
    color: var(--floating-cta-button-hover-text, #0d332f) !important;
    box-shadow: 0 5px 14px rgba(5, 27, 25, 0.24);
    text-decoration: none !important;
    transform: translateY(-1px);
}

.floating-cta__chevrons {
    border-right: 2px solid currentColor;
    border-top: 2px solid currentColor;
    height: 9px;
    position: relative;
    transform: rotate(45deg);
    width: 9px;
}

.floating-cta__chevrons::before {
    border-right: 2px solid currentColor;
    border-top: 2px solid currentColor;
    content: "";
    height: 9px;
    left: -6px;
    position: absolute;
    top: 4px;
    width: 9px;
}

.floating-cta__close {
    background: transparent;
    border: 0;
    cursor: pointer;
    height: 44px;
    padding: 0;
    position: absolute;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
}

.floating-cta__close span::before,
.floating-cta__close span::after {
    background: currentColor;
    content: "";
    height: 2px;
    left: 12px;
    position: absolute;
    top: 21px;
    width: 20px;
}

.floating-cta__close span::before { transform: rotate(45deg); }
.floating-cta__close span::after { transform: rotate(-45deg); }
.floating-cta__close:hover { opacity: 0.72; }

.floating-cta--closing {
    opacity: 0;
    transform: translateY(100%);
    transition: opacity 220ms ease, transform 220ms ease;
}

@media (max-width: 700px) {
    .floating-cta {
        box-sizing: border-box;
        min-height: 70px;
        padding: 10px 16px;
    }

    .floating-cta--has-close {
        padding-left: 52px;
        padding-right: 52px;
    }

    .floating-cta__inner {
        align-items: center;
        display: flex;
        flex: 0 1 auto;
        gap: clamp(18px, 5vw, 34px);
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
        max-width: none;
        width: auto;
    }

    .floating-cta__copy span, .floating-cta__separator { display: none; }
    .floating-cta__copy {
        flex: 0 0 auto;
        justify-self: auto;
        text-align: center;
    }
    .floating-cta__copy strong {
        font-size: clamp(13px, 3.5vw, min(var(--floating-cta-headline-size, 19px), 16px));
        line-height: 1.15;
    }
    #floating-cta .floating-cta__button,
    #floating-cta a.floating-cta__button {
        box-sizing: border-box !important;
        font-size: min(var(--floating-cta-button-size, 15px), 13px);
        flex: 0 0 auto;
        gap: 12px;
        justify-self: auto;
        min-height: 0;
        padding: var(--floating-cta-button-padding-y, 15px) var(--floating-cta-button-padding-x, 27px);
    }
    .floating-cta__button span:first-child { font-size: 0; }
    .floating-cta__button span:first-child::after { content: "Start free trial"; font-size: 13px; }
    .floating-cta__close { right: 4px; }
}

@media (max-width: 430px) {
    .floating-cta--has-close {
        padding-left: 16px;
        padding-right: 48px;
    }

    .floating-cta__inner { gap: 12px; }
    .floating-cta__copy strong { font-size: 13px; }
    #floating-cta .floating-cta__button,
    #floating-cta a.floating-cta__button { padding: var(--floating-cta-button-padding-y, 15px) var(--floating-cta-button-padding-x, 27px); }
    .floating-cta__chevrons { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .floating-cta__button, .floating-cta--closing { transition: none; }
}