:root {
    --hover-brightness: 98%;
}

html, body {
    width: 100%;
    height: auto;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden; 
}

@layer utilities {
    .titulo-video-lg {
        padding-top: 16rem; 
    }

    /*/ @media (max-width: 1439px) {
        .titulo-video-lg {
            padding-top: 10rem; 
        }
    }/*/

    @media (min-width: 1650px) {
        .titulo-video-lg {
            padding-top: 20rem; 
        }
    }
}

.video-wrapper {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}

video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

nav {
    background: transparent;
}

.absolute {
    position: absolute;
}

.relative {
    position: relative;
}

.z-0 {
    z-index: 0;
}

.z-10 {
    z-index: 10;
}

.opacity-70 {
    opacity: 0.7;
}

.text-white {
    color: #f2f2f2;
}

.text-slate {
    color: #3d4752;
}

.text-center {
    text-align: center;
}

@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.marquee {
    overflow: hidden;
    position: relative;
    white-space: nowrap;
}

.marquee-inner {
    display: flex;
    animation: marquee 20s linear infinite;
}

@media (max-width: 767px) {
    .marquee-inner {
        animation-duration: 10s; 
    }
}

.fade-in1 {
    opacity: 0;
    transition: opacity 0.5s ease;
}

.delayed-fade-in1 {
    opacity: 0;
    transition: opacity 1s ease; 
}

.opacity-100 {
    opacity: 1 !important;
}