@charset "UTF-8";
/* CSS Document */

/* Hero: ~98% of the viewport height, with sane min/max guards */
.carrusel { 
  --hero-min: 560px;
  --hero-max: 1080px;
  --hero-vh: 98dvh;          /* was 100dvh */
}

/* Fallback for older browsers without dvh */
@supports not (height: 1dvh) {
  .carrusel { --hero-vh: 98vh; }
}

.carrusel .rslides,
.carrusel .rslides li {
  min-height: clamp(var(--hero-min), var(--hero-vh), var(--hero-max));
  /* optional: keep backgrounds looking right */
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.slide01 {
  width: 100%;
  height: 100% !important;
  background-image: linear-gradient(rgba(0,0,0,0.0), rgba(0,0,0,0.95)), url("../images/slide01.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.slide02 {
  width: 100%;
  height: 100% !important;
  background-image:linear-gradient(rgba(0,0,0,0.0), rgba(0,0,0,0.95)), url("../images/slide02.jpg");
  background-size: cover !important;
  background-position: top center;
}

.video-container {
  min-height: 768px;
  width: 100%;
  position: relative;
  height: 100%;
}