body[no-touch],
body[no-touch] * {
    pointer-events: none;
}

.hero video {
    position: absolute;
    top: 0;
    left: 0;
}

.search-container-parent {
    position: relative;
    z-index: 9999;
}

.search-container-parent * {
    z-index: 9999;
}

.search-container {
    position: relative;
    border-radius: 1rem;
    transition: var(--transition);
}

.search-container::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, .25);
    backdrop-filter: blur(3px);
    z-index: 1;
    border-radius: .25rem;
    transition: var(--transition);
}

.search-container-trigger {
    position: relative;
    z-index: 2;
    padding: .5rem 1.25rem;
    overflow: hidden;
}

.search-container input {
    background-color: unset;
    border: unset;
    outline: unset;
    width: 90%;
    padding: .5rem 0;
    font-size: var(--font-15);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: "Secondary";
    font-weight: var(--font-regular);
    color: var(--color-white);
}

.search-container-options {
    position: absolute;
    bottom: 0;
    transform: translateY(100%);
    left: 0;
    width: 100%;
    max-height: calc(var(--screen-height, 100vh) / 3.33);
    overflow-y: scroll;
    z-index: 99;
    opacity: 0;
    pointer-events: none;
    border-bottom-right-radius: .25rem;
    border-bottom-left-radius: .25rem;
    transition: var(--transition);
    background: var(--color-white);
}

.search-container[data-searching] .search-container-options li:not([data-active]) {
    display: none;
}

.search-container[data-fixed] {
    position: fixed;
    z-index: 99999;
}

.search-container[data-fixed] * {
    z-index: 99999;
}

.search-container[data-fixed][data-mobile-fixed] {
    top: 10vh !important;
}

.search-container[data-active]::after {
    border-radius: .25rem .25rem 0 0;
}

.search-container[data-active] .search-container-options {
    opacity: 1;
    pointer-events: all;
}

.search-container[data-active] .search-container-options .destination {
    transform: none;
}

.search-container .search-container-options .destination {
    overflow: visible !important;
}

.search-container-options ul {
    padding: 1rem;
    position: relative;
    z-index: 1;
}

.search-container-options ul {
    text-align: left;
}

.search-container-options ul li {
    display: flex;
}

.search-container-options::-webkit-scrollbar {
    width: .5rem;
}

.search-container-options::-webkit-scrollbar-thumb {
    background-color: var(--color-primary);
}

.search-container-options .destination {
    color: var(--color-black);
    padding: .5rem 0;
    font-family: "Secondary";
    font-weight: var(--font-regular);
    text-transform: uppercase;
    transform: translateY(100%);
    position: relative;
    transition: var(--transition);
}

.search-container-options .destination--child {
    font-size: var(--font-12);
}

.search-container-options .no-results {
    color: var(--color-black);
    padding: 1.5rem 1rem;
    font-family: "Secondary";
    font-weight: var(--font-regular);
    text-transform: uppercase;
    display: none;
}

.search-container-options .destination::after {
    position: absolute;
    top: 50%;
    left: -2rem;
    width: .35rem;
    height: .35rem;
    border-radius: 50%;
    background-color: var(--color-primary);
    content: '';
    transition: var(--transition);
    transform: translateY(-50%);
    transform-origin: left;
    opacity: 0;
}

.search-container[data-no-results] ul {
    padding: 0;
}

.search-container[data-no-results] .search-container-options .no-results {
    display: block;
}

.cta-container {
    position: absolute;
    z-index: 3;
    top: 50%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
}

.circle-cta {
    border: 1px solid var(--color-white);
    border-radius: 50%;
    font-family: "Primary";
    font-weight: var(--font-light);
    font-style: italic;
    white-space: nowrap;
}

.section-image::after {
    opacity: 6%;
}

@media (min-width: 64rem) {
    h1 {
        font-size: 7rem;
    }

    .search-container {
        width: 60%;
        margin-left: auto;
        margin-right: auto;
    }

    .hero-bottom-container {
        position: absolute;
        z-index: 3;
        bottom: 2rem;
        left: 0;
        width: 100%;
    }

    .hero-bottom-container .grid-x .cell:last-child .social-container {
        justify-content: flex-end;
    }

    .section-quote__paragraph {
        width: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 2;
    }

    .section-quote__images

    h2,
    .h2 {
        font-size: 3.75rem;
        line-height: 1.2;
    }

    .circle-cta {
        width: 20rem;
        height: 20rem;
    }

    .circle-cta span {
        transition: var(--transition);
    }

    .circle-cta:hover span {
        transform: scale(1.1);
    }

    .section-quote__paragraph {
        font-size: 3.75rem;
    }

    .section-quote .image-container {
        transition: .1s;
        will-change: transform;
    }

    .search-container-options ul li:hover a {
        padding-left: .5rem;
    }

    .search-container-options ul li:hover a::after {
        left: 0;
        opacity: 1;
    }

}

@media (max-width: 63.9375rem) {
    h1 {
        font-size: 3.5rem;
        line-height: 1.1;
    }

    h2,
    .h2 {
        font-size: 2.2rem;
        line-height: 1.2;
    }

    .hero-bottom-container .grid-x .cell:last-child .social-container {
        justify-content: center;
    }

    .search-container-options {
        max-height: calc(var(--screen-height, 100vh) / 2.5);
    }

    .search-container input {
        font-size: 16px;
    }

    .search-container input::placeholder {
        font-size: .75rem;
    }

    .section-quote__paragraph {
        position: relative;
        z-index: 1;
    }

    .section-quote__images {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 0;
    }


    /* .search-container-options .destination,
    .search-container-options .no-results {
        font-size: .9rem;
    } */

    .circle-cta {
        border-radius: unset;
        border: unset;
        text-decoration: underline;
    }
}