/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Custom styles for the carousel overlay */
.carousel-item {
    height: 80vh; /* Adjust height as needed */
    min-height: 400px;
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    position: relative;
}

.carousel-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Semi-transparent black overlay */
    /*background-color: rgba(0, 60, 40, 0.8); !* Semi-transparent dark green overlay *!*/
}

.carousel-caption {
    bottom: 30%;
    z-index: 10;
}

.carousel-caption h5 {
    font-size: 2.5rem;
    font-weight: 700;
    /*text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);*/
}

.carousel-caption p {
    font-size: 1.2rem;
    max-width: 600px;
    margin: 0 auto 20px;
    color: #d4edda;
    /*text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);*/
}

.btn-custom {
    padding: 10px 25px;
    font-weight: 600;
    border-radius: 30px;
}

/*=========================================*/

/* Carousel base class */
.carousel {
  margin-bottom: 4rem;
}


/* RESPONSIVE CSS
-------------------------------------------------- */
@media (min-width: 40em) {
  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }
}

.placeholder-wave {
    animation: placeholder-wave 1.5s linear infinite;
}

@keyframes placeholder-wave {
    0% { opacity: 0.6; }
    50% { opacity: 1; }
    100% { opacity: 0.6; }
}

.placeholder-card {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: placeholder-shimmer 1.5s linear infinite;
}

@keyframes placeholder-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}