body #webfly-cursor-canvas {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    display: block !important;
    pointer-events: none !important;
    z-index: 2147483645 !important;
    background: transparent !important;
    mix-blend-mode: normal !important;
}


/* Webfly animated contact widget. Kept in the main CSS file intentionally:
   even if Botble keeps loading only webfly-cursor.css from an old manifest,
   the contact button animation still comes back. */
.cfw,
.cfw * {
    box-sizing: border-box !important;
}

.cfw {
    position: fixed !important;
    right: 26px !important;
    bottom: 26px !important;
    width: 86px !important;
    height: 86px !important;
    z-index: 2147483646 !important;
    font-family: inherit !important;
    pointer-events: auto !important;
}

.cfb {
    position: absolute !important;
    inset: 0 !important;
    width: 86px !important;
    height: 86px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    cursor: pointer !important;
    outline: none !important;
    display: grid !important;
    place-items: center !important;
    overflow: visible !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

.cfr {
    position: absolute !important;
    inset: 8px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(102, 230, 110, 0.54) !important;
    background: rgba(102, 230, 110, 0.08) !important;
    pointer-events: none !important;
    opacity: 0 !important;
    transform: scale(0.68) !important;
    animation: cfw-ring 2.7s cubic-bezier(.22, .61, .36, 1) infinite !important;
    will-change: transform, opacity !important;
}

.cfr.r2 { animation-delay: .9s !important; }
.cfr.r3 { animation-delay: 1.8s !important; }

.cfo {
    position: absolute !important;
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: rgba(123, 230, 255, .95) !important;
    box-shadow: 0 0 16px rgba(123, 230, 255, .75) !important;
    pointer-events: none !important;
    will-change: transform, opacity !important;
}

.cfo.o1 {
    top: 8px !important;
    right: 17px !important;
    animation: cfw-float-1 3.2s ease-in-out infinite !important;
}

.cfo.o2 {
    left: 13px !important;
    bottom: 20px !important;
    width: 6px !important;
    height: 6px !important;
    animation: cfw-float-2 3.6s ease-in-out infinite !important;
}

.cfc {
    position: relative !important;
    width: 64px !important;
    height: 64px !important;
    border-radius: 50% !important;
    display: grid !important;
    place-items: center !important;
    background: radial-gradient(circle at 35% 30%, #7df66a 0%, #40c95a 42%, #1d457f 100%) !important;
    box-shadow: 0 18px 42px rgba(22, 39, 91, .38), 0 0 0 9px rgba(85, 207, 99, .12), 0 0 38px rgba(99, 225, 176, .42) !important;
    transform: translateZ(0) !important;
    animation: cfw-pulse 2.2s ease-in-out infinite !important;
    will-change: transform, box-shadow !important;
}

.cfi {
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    display: grid !important;
    place-items: center !important;
    animation: cfw-icon 1.7s ease-in-out infinite !important;
    will-change: transform !important;
}

.cfi img,
.cfitem img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

.cfp {
    position: absolute !important;
    right: 7px !important;
    bottom: 94px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(18px) scale(.88) !important;
    transition: opacity .28s ease, transform .28s ease, visibility .28s ease !important;
}

.cfw.open .cfp {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
}

.cfl {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
}

.cfitem {
    width: 50px !important;
    height: 50px !important;
    padding: 11px !important;
    border-radius: 50% !important;
    display: grid !important;
    place-items: center !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 12px 28px rgba(9, 19, 46, .18) !important;
    transform: translateY(10px) scale(.82) !important;
    opacity: 0 !important;
    text-decoration: none !important;
    transition: opacity .25s ease, transform .25s ease, box-shadow .25s ease !important;
    will-change: transform, opacity !important;
}

.cfw.open .cfitem {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
}

.cfw.open .cfitem:nth-child(2) { transition-delay: .04s !important; }
.cfw.open .cfitem:nth-child(3) { transition-delay: .08s !important; }
.cfw.open .cfitem:nth-child(4) { transition-delay: .12s !important; }

.cfitem:hover,
.cfitem:focus-visible {
    transform: translateY(-2px) scale(1.06) !important;
    box-shadow: 0 16px 36px rgba(9, 19, 46, .24) !important;
}

.cfb:hover .cfc,
.cfb:focus-visible .cfc {
    transform: scale(1.05) !important;
}

@keyframes cfw-ring {
    0% { opacity: .75; transform: scale(.64); }
    72% { opacity: 0; transform: scale(1.34); }
    100% { opacity: 0; transform: scale(1.34); }
}

@keyframes cfw-pulse {
    0%, 100% { transform: scale(1); box-shadow: 0 18px 42px rgba(22, 39, 91, .38), 0 0 0 9px rgba(85, 207, 99, .12), 0 0 34px rgba(99, 225, 176, .34); }
    50% { transform: scale(1.065); box-shadow: 0 22px 52px rgba(22, 39, 91, .45), 0 0 0 13px rgba(85, 207, 99, .10), 0 0 46px rgba(99, 225, 176, .50); }
}

@keyframes cfw-icon {
    0%, 100% { transform: rotate(0deg) scale(1); }
    12% { transform: rotate(-12deg) scale(1.04); }
    24% { transform: rotate(12deg) scale(1.04); }
    36% { transform: rotate(-8deg) scale(1.02); }
    48% { transform: rotate(8deg) scale(1.02); }
    60% { transform: rotate(0deg) scale(1); }
}

@keyframes cfw-float-1 {
    0%, 100% { transform: translate3d(0, 0, 0); opacity: .9; }
    50% { transform: translate3d(4px, -8px, 0); opacity: .55; }
}

@keyframes cfw-float-2 {
    0%, 100% { transform: translate3d(0, 0, 0); opacity: .75; }
    50% { transform: translate3d(-5px, 7px, 0); opacity: .45; }
}

@media (max-width: 575px) {
    .cfw {
        right: 16px !important;
        bottom: 16px !important;
        transform: scale(.92) !important;
        transform-origin: right bottom !important;
    }
}