.hero-mobile {
background-size: cover;
background-position: center;
}

@media (max-width: 991.98px) {
.hero-mobile {
    background-image: url('<?php echo $mobile_background_url; ?>');
    background-position: right !important;
    aspect-ratio: 9 / 14 !important;
}
}

@media (min-width: 992px) {
.hero-mobile {
    background-image: url('<?php echo $desktop_background_url; ?>');
    aspect-ratio: 20 / 9 !important;
}
}

.hero-layer {
background-image: url('/wp-content/themes/SPOT/assets/images/HeroLayer.png');
background-size: cover;
background-position: center;
opacity: 1;
}

.home-hero-progress-bar {
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 1px;
width: 90%;
max-width: 1500px;
background: rgba(255, 255, 255, 0.2);
z-index: 10;
margin-top: -70px;
}

.home-hero-progress-fill {
margin-top: -2px;
height: 5px;
width: 0%;
background: #fff;
transition: width 5s linear;
}


.home-hero-button-wrapper {
position: absolute;
bottom: 60px;
right: 140px;
display: flex;
gap: 1rem;
z-index: 20;
}

@media (min-width: 992px) {
.homeHero-texto {
    width: 70%;
}
}

@media (max-width: 991.98px) {
.homeHero-texto {
    width: 100%;
}
}