@keyframes aiAnimate {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    to {
        transform: translate(-50%, -50%) rotate(1turn);
    }
}









@scope ([data-app="storelocator"][data-context="public"]) {

    #indexBooking {
        border-radius: 0 0 var(--vdev--container-radius) var(--vdev--container-radius);

        canvas {
            filter: saturate(150%) contrast(125%) hue-rotate(-5deg);
        }
    }
}

@scope ([data-context="public"]) {

    #indexExamples .swiper-slide.is-active::after {
        content: '';
        position: absolute;
        inset: -.625rem;
        border-radius: 1.625rem;
        border: .1rem solid #fff;
    }

    #indexExamples .swiper-slide.is-active img.rounded-4 {
        aspect-ratio: 16 / 9;
        object-fit: cover;
        object-position: top;
        /*box-shadow: 0 0 3rem .25rem #00f3ff !important;*/
        box-shadow: 0 0 3rem #00d5ff !important;
    }

    #indexExamples .swiper-slide img.rounded-3 {
        border: .2rem solid #444 !important;
        aspect-ratio: 8 / 16;
        width: calc(100% / 4);
        object-fit: cover;
        background: #fff;
        position: absolute;
        right: 3%;
        top: 15%;
        z-index: 2;
        border-radius: .75rem !important;
    }

    #indexExamples .swiper-slide {
        transition: .45s opacity ease;
    }

    #indexExamples .swiper-slide-prev,
    #indexExamples .swiper-slide-next + .swiper-slide + .swiper-slide {
        opacity: .25;
    }

    #indexPlatforms {
        background-color: var(--bs-body-bg) !important;
    }

    #indexMaps {
        border-radius: var(--vdev--container-radius) var(--vdev--container-radius) 0 0;
    }

    #indexExamples {
        border-radius: var(--vdev--container-radius) var(--vdev--container-radius) 0 0;
    }

    #indexFaq {
        border-radius: var(--vdev--container-radius);
    }

    @media (max-width: 767px) {

        #indexFaq {
            margin-top: 5rem;
        }

        #indexPlatforms {
            box-shadow: 0 -115px 150px 150px var(--bs-body-bg);
        }

        #indexMaps .move-right {
            transform: translateX(calc(60% + var(--scroll-y)));
        }

        #indexMaps .move-left {
            transform: translateX(calc(-60% - var(--scroll-y)));
        }

        #indexMaps .move img {
            aspect-ratio: 4 / 3;
            object-fit: cover;
            object-position: top;
        }

        #indexDevices__desktopImages {

            .rounded-5 {
                border-radius: var(--bs-border-radius-xl) !important;
            }
        }
    }

    @media (min-width: 768px) {

        #indexMaps {

            .move {
                width: calc(100% / 9);

                img {
                    aspect-ratio: 2;
                    object-fit: cover;
                    object-position: top;
                }

                &.move-right {
                    transform: translateX(calc(50% + var(--scroll-y)));
                }

                &.move-left {
                    transform: translateX(calc(-50% - var(--scroll-y)));
                }
            }
        }

        #indexPlatforms {
            box-shadow: 0 -115px 150px 150px var(--bs-body-bg);

            .col-md-2 {
                width: calc(100% / 8);
                flex: 0 0 calc(100% / 8);
            }
        }

        #indexExamples {
            padding-top: 7rem !important;
        }

        #indexDevices__desktop {
            margin-top: -6.75rem;
        }
    }




    #indexDevices--desktop {

        img {
            aspect-ratio: 2;
            object-fit: cover;
            object-position: top;
        }
    }

    @media (max-width: 767px) {

        #indexMobile {
            --scroll-progress: 0;
        }

        #indexDevices__row {
            height: 200dvh;
            /*width: 200%;*/
            /*max-width: none;*/

            & > div {
                position: sticky;
                top: 6.5rem;
                overflow: hidden;

                & > div {
                    width: 200% !important;
                    max-width: none !important;
                    position: relative;
                    left: calc(25% + var(--scroll-progress) * (-150%));
                    transition: left 0.45s ease-in-out;
                }
            }
        }
    }

    @media (min-width: 768px) {

        #indexDevices__desktopImages {

            & > .row {

                & > .col-12 {

                    &:first-child {

                        & > div {
                            /*margin-left: -36%;*/
                        }
                    }

                    &:nth-child(2) {

                        & > div {
                            /*margin-right: -36%;*/
                        }
                    }
                }
            }
        }
    }

}

.bg-white .accordion-button {
    background: #f2f2f2 !important;
}

.icons .icon-square {
    border-radius: .75rem;
    background: #fff !important;
    filter: invert(1);

    &::before {
        display: none;
    }
}

.accordion-button[data-bs-toggle="collapse"] {
    filter: none !important;
    background: var(--bs-body-bg) !important;
    padding: 1.25rem 2rem !important;
    border-radius: 1rem !important;
}













@scope ([data-context="public"]) {

    body {
        --font-body-family: 'Inter', sans-serif;
        --font-body-style: normal;
        --font-body-weight: 300;

        --font-heading-family: 'Prompt', sans-serif;
        --font-heading-style: normal;
        --font-heading-weight: 700;

        --bs-link-hover-color: #2dd6fd;

        --theme-sidebar-width: 14rem;
        --vdev--preset-hue: 0deg;
        --bs-body-bg: #f3f7f9;
    }

    a {
        font-family: var(--font-body-family);
        font-style: var(--font-body-style);
        font-weight: var(--font-body-weight);
        text-decoration-thickness: .1rem;
        text-decoration-color: #91efff;
        text-underline-offset: 4px;
        transition: color 0.15s ease-in-out, text-decoration 0.15s ease-in-out;

        &:hover {
            text-decoration: none;
        }
    }

    #headerLogo,
    .btn:where(.btn-primary, .btn-secondary),
    vdev-builder--sidebar button[data-card-handle] .icon,
    vdev-builder .builder-bg,
    .text-primary,
    .bg-primary,
    #footerLogo,
    #indexBooking canvas {
        filter: hue-rotate(var(--vdev--preset-hue));
    }

    .bg-primary .btn {
        filter: none;
    }

    .icons {

        .icon-square {
            border-radius: .75rem;
            background: #fff !important;
            filter: invert(1);

            &::before {
                display: none;
            }
        }
    }

    #header {

        .btn-outline-primary {
            background: none !important;
        }
    }

    h1 {
        font-family: 'Prompt', sans-serif;
        margin-inline: auto;
        max-width: 780px;
        position: relative;

        &::after {
            content: '';
            display: block;
            margin-top: -8px;
            margin-inline: -50px;
            border-bottom: 1px solid;
        }
    }

    .feature-icon-small {
        width: 2.5rem;
        height: 2.5rem;
        background: #fff !important;
        color: #000 !important;
    }

    .widget-option {
        border-width: .15rem !important;
        flex-direction: column;
        position: relative;

        input[type="checkbox"] {
            position: absolute;
            top: .625rem;
            right: .625rem;
            width: 1rem;
            height: 1rem;
            opacity: .25;
        }

        .widget-option__icon {
            width: 2rem;
        }

        .widget-option__icon svg {
            aspect-ratio: 1;
            width: 100%;
            height: auto;
        }

        .widget-option__title {
            height: 32px;
            line-height: 1.125 !important;
        }
    }

    h1.display-3 {
        max-width: 920px;

        &::after {
            border-bottom: .075rem solid;
        }
    }

    body .btn-check-group .btn {
        border-radius: .5rem !important;
    }

    #footer {
        border-radius: var(--vdev--container-radius) var(--vdev--container-radius) 0 0;

        #footerTitle {
            line-height: .6 !important;
            z-index: 9;
        }

        #footerLogo {
            overflow: visible;
        }
    }

    #indexMobile {
        border-radius: var(--vdev--container-radius);
    }

    #indexFeatures {
        border-radius: var(--vdev--container-radius);
    }

    @media (max-width: 767px) {

        h1::after {
            margin-top: -6px;
            margin-inline: -50px;
        }

        h1.display-3::after {
            margin-top: -7px;
        }

        #indexHero {
            --header-height: 50px;

            canvas {
                position: absolute !important;
                top: 0 !important;
                height: calc(100dvh - var(--header-height)) !important;
            }
        }

        #indexFeatures {

            .card {
                border-radius: 1.25rem !important;

                img {
                    border-radius: .825rem !important;
                }
            }
        }

        #footer {

            #footerLogo {
                margin-inline: auto;
                max-width: 3rem;
                height: auto !important;
                display: block;
                outline: .2rem solid #fff;
                border-radius: .75rem;
            }
        }
    }

    @media (min-width: 768px) {

        h1::after {
            margin-top: -.175em;
        }

        h1.display-3::after {
            margin-top: -11px;
        }

        #footer {

            #footerLogo {
                width: auto;
                position: absolute;
                top: 0;
                right: 0;

            }
        }
    }
}

@scope ([data-context="public"][data-app="storelocator"]) {

    #header {
        top: 1rem;
        z-index: 9999;

        &::before {
            content: '';
            position: absolute;
            top: -1rem;
            right: 0;
            bottom: -4rem;
            left: 0;
            background: #ffffff10;
            backdrop-filter: blur(1rem);
            mask-image: linear-gradient(to bottom, black 40%, transparent);
            -webkit-mask-image: linear-gradient(to bottom, black 40%, transparent);
        }

        header {
            border-bottom-color: #000 !important;
            background: rgba(255, 255, 255, 0.85);
            /*box-shadow: 0 11px 50px rgba(0, 0, 0, 0.08);*/
            backdrop-filter: blur(10px);
            border-radius: 1.25rem !important;
            padding: .5rem 1rem .5rem .5rem !important;

            .nav {
                --bs-nav-link-color: #000;
                padding-inline: 1.25rem;
            }

            #headerLogo {
                width: 34px;
                aspect-ratio: 1;
                border: .125rem solid #fff;
                border-radius: 33.333%
            }

            #headerTitle > span:last-child {
                --bg-color: #fff;
                -webkit-text-stroke-width: .0625rem;
                -webkit-text-stroke-color: var(--bs-body-color);
                color: var(--bg-color);
            }

            #headerButtons {
                right: 1rem;

                #headerButton {
                    aspect-ratio: 1;

                    .icon {
                        font-size: 2em;
                        bottom: .5rem;
                    }
                }
            }
        }
    }

    #indexPricing {

        .icon {
            font-size: 1.125em;
            position: relative;
            bottom: .25rem;
        }
    }

    @media (max-width: 767px) {

        #indexIntro {

            #indexIntro__buttons {

                .btn {
                    min-width: 300px !important;
                }
            }
        }

        #footerTitle {
            margin-block: .2rem .075rem !important;
            font-size: 2.4rem;
        }

        #footer {

            #footerLogo {
                height: 40%;
            }
        }
    }

    @media (min-width: 768px) {

        #footerTitle {
            margin-block: -1.55rem -1.25rem !important;
            font-size: 7.5rem;
        }

        #footer {

            #footerLogo {
                height: 21rem;
            }
        }
    }
}

@scope ([data-app="core"][data-context="public"]) {

    body {
        background: #f1f1f1;
    }

    h1 {
        font-family: 'Prompt', sans-serif;
        margin-inline: auto;
        max-width: 780px;
        position: relative;

        &::after {
            content: '';
            display: block;
            margin-top: -8px;
            margin-inline: -50px;
            border-bottom: 1px solid;
        }
    }

    .feature-icon-small {
        width: 2.5rem;
        height: 2.5rem;
        background: #fff !important;
        color: #000 !important;
    }

    .widget-option {
        border-width: .15rem !important;
        flex-direction: column;
        position: relative;

        input[type="checkbox"] {
            position: absolute;
            top: .625rem;
            right: .625rem;
            width: 1rem;
            height: 1rem;
            opacity: .25;
        }
    }

    .widget-option__icon {
        width: 2rem;

        svg {
            aspect-ratio: 1;
            width: 100%;
            height: auto;
        }
    }

    .widget-option__title {
        height: 32px;
        line-height: 1.125 !important;
    }

    .vertical-slider {
        --row-i: 0;
        --row-height: 97px;
        height: var(--row-height);
        overflow: hidden;
        position: relative;
    }

    .vertical-slider .texts {
        display: flex;
        flex-direction: column;
        transition: transform 0.5s ease-in-out;
        transform: translateY(calc(var(--row-i) * var(--row-height) * -1));
    }

    .vertical-slider .texts span {
        height: var(--row-height);
    }

    #indexHero {

        canvas {
            /*filter: saturate(150%) contrast(125%) hue-rotate(-5deg);*/
            filter: saturate(150%) contrast(125%) hue-rotate(-5deg) brightness(90%);
        }

        .links {

            .link-body-emphasis {
                border: .1rem solid transparent;
                /*background: #ffffff8f;*/
                position: relative;
                background: #ffffff29;

                &.active {
                    border-color: #fff;
                    background: #ffffffd9;
                    /*background: #ffffff3b;*/
                    box-shadow: 0 .25rem 1rem .125rem #fff;
                    backdrop-filter: blur(10px);

                    /*&::after {*/
                    /*    content: '';*/
                    /*    position: absolute;*/
                    /*    top: 0;*/
                    /*    inset: -.7rem;*/
                    /*    border: .1rem solid #fff;*/
                    /*    border-radius: 2rem;*/
                    /*}*/

                    /*&::before {*/
                    /*    content: '';*/
                    /*    position: absolute;*/
                    /*    top: calc(100% + 1rem);*/
                    /*    left: 50%;*/
                    /*    border: .125rem solid #fff;*/
                    /*    width: 1rem;*/
                    /*    aspect-ratio: 1;*/
                    /*    border-radius: 50%;*/
                    /*    transform: translateX(-50%);*/
                    /*}*/
                }

                img {
                    border: .25rem solid #fff;
                    border-radius: 33.333%;
                }

                .icon {
                    font-size: 1.375em;
                }
            }
        }
    }

    #indexVideo {
        box-shadow: 0 0 10rem currentColor;
        z-index: 2;
        border-radius: var(--vdev--container-radius);
    }

    @media (max-width: 767px) {

        #indexHero {

            &::after {
                content: '';
                position: absolute;
                top: 95dvh;
                left: 0;
                width: 100%;
                height: 10rem;
                background: linear-gradient(0deg, var(--bs-body-bg) 0%, rgba(255, 255, 255, 0) 100%);
                transform: translateY(-100%);
            }

            .links {

                .link-body-emphasis {
                    border-radius: 1.5rem !important;

                    img {
                        width: 48px;
                    }
                }
            }
        }

        #indexProgress {
            position: relative;

            & > div {
                position: sticky;
                top: 0;
            }
        }
    }

    @media (min-width: 768px) {

        #indexHero {

            .link-body-emphasis {
                border-radius: 2rem !important;

                img {
                    width: 56px;
                }
            }
        }

        #indexVideo {
            margin-block: calc(var(--vdev--container-radius) * -1) .125rem;
        }
    }
}