.floating {  
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    animation-direction: normal;
}

@keyframes floating {
    from { transform: translateY(0px); }
    65%  { transform: translateY(15px); }
    to   { transform: translateY(-0px); }    
}

.border-line {
    border: 2px solid transparent;
    border-image: url("../images/line.png") 30 round;
}

.company__info > span {
    border-top: 1px solid var(--brown);
}

.company__info > span:last-child {
    border-bottom: 1px solid var(--brown);
}

.bg-menu {
    background-color: #f2f3f4;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    transition: 0.4s;
}

.bg-menu-black {
    border-bottom: 1px solid rgb(31, 41, 55);
    background-color: #000;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    transition: 0.4s;
}

.hamburger-menu {
    --x-width: calc( var(--hamburger-height) * 1.41421356237);
    display: flex;
    flex-direction: column;
    gap: var(--hamburger-gap);
    width: max-content;
    position: absolute;
    /* top: var(--ham-margin); */
    top: 15px;
    right: var(--ham-margin);
    z-index: 999;
    cursor: pointer;
}

.hamburger-menu:has(input:focus-visible)::before,
.hamburger-menu:has(input:focus-visible)::after,
.hamburger-menu input:focus-visible {
    border: 1px solid white;
    box-shadow: 0 0 0 1px var(--fore-ground);
}

.hamburger-menu:has(input:checked) {
    --fore-ground: white;
}

.hamburger-menu::before,
.hamburger-menu::after,
.hamburger-menu input {
    content: "";
    width: var(--bar-width);
    height: var(--bar-height);
    background-color: var(--fore-ground);
    border-radius: 9999px;
    transform-origin: left center;
    transition: opacity var(--animation-timing), width var(--animation-timing), rotate var(--animation-timing), transalte var(--animation-timing),
    background-color var(--animation-timing);

}

.hamburger-menu input:focus {
    outline: none !important;
    outline-offset: 0px !important;
    --tw-ring-inset: unset !important;
    --tw-ring-offset-width: 0px !important;
    --tw-ring-offset-color: unset !important;
    --tw-ring-color: unset !important;
    --tw-ring-offset-shadow: unset !important;
    --tw-ring-shadow: unset !important;
    box-shadow: unset !important;
}

.hamburger-menu input {
    appearance: none !important;
    background-image: unset !important;
    padding: 0;
    margin: 0;
    outline: none;
    pointer-events: none;
    border-color: var(--fore-ground);
}

.hamburger-menu:has(input:checked)::before {
    rotate: 45deg;
    width: var(--x-width);
    translate: 0 calc( var(--bar-height) / -2 );
}

.hamburger-menu:has(input:checked)::after {
    rotate: -45deg;
    width: var(--x-width);
    translate: 0 calc( var(--bar-height) / 2 );

}

.hamburger-menu input:checked {
    opacity: 0;
    width: 0;
}

.menu_left {
    left: -200%;
}

.hamburger_visible {
    display: flex !important;
}

.mb__menu {
    transition: all var(--animation-timing);
}

.hamburger-menu:has(input:checked) + .mb__menu {
    right: 0;
    opacity: 1;
}


.mb__menu ul li > a {
 transition: background-color var(--animation-timing);
}

.mb__menu ul li > a:hover,
.mb__menu ul li:hover {
    background-color: #e0e0e0;
    color: #000;
}

.scroll-arrow::after {
    content: url("../images/half-arrow.svg");
}

#loader {
    background: white no-repeat center / cover; 
}

@keyframes slideInBlur {
    from {
        transform: translateY(30px);
        opacity: 0;
    }

    to {
        transform: translateY(0px);
        opacity: 1;
    }
}

.slideInBlur {
    animation: slideInBlur 1s ease-in 0.6s 1 normal both;
}

#header,
#vegasCarousel div > p,
#vegasCarousel div > h2,
#vegasCarousel div > span,
#business .reveal > h1 {
    -webkit-transition: all 1.5s ease-in-out, background-color 0.5s ease-in;
    transition: all 1.5s ease-in-out, background-color 0.5s ease-in;
    opacity: 0;
    -webkit-filter: blur(5px);
    filter: blur(5px);
    margin-top: -1em;
}

#business .reveal > h1 {
    -webkit-transition: all 1.5s ease-in-out 1s;
    transition: all 1s ease-in-out 1s;
}

#header.go,
#vegasCarousel.go div > p,
#vegasCarousel.go div > h2,
#vegasCarousel.go div > span,
#business.go .reveal.active > h1 {
    opacity: 1;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    margin-top: 0;
}


.seller-link a {
    display: flex;
    flex-direction: column;
    position: relative;
}

.seller-link a::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0px;
    height: 1px;
    background: #313638;
    transition: all 0.5s ease;
}

.seller-link a:hover::before {
    width: 80%;
}


@media (prefers-reduced-motion: no-preference) {
    .reveal {
        position: relative;
        transform: translateY(130px);
        opacity: 0;
        filter: blur(10px);
        transition: all 1.5s ease 0.25s;
     }
    
     .reveal.active {
        transform: translateY(0);
        opacity: 1;
        filter: blur(0px);
     }
}

@media screen and (min-width: 768px) {
    .bg-menu-black {
        background: none;
        box-shadow: unset;
    }

    .white-logo {
        display: none;
    }

    .black-logo {
        display: block;
    }

    .seller-link a {
        display: block;
        position: relative;
    }
}
