/* style.css */

/* The big banner at the top */
.hero-section {
    background-color: #212529; /* Dark Grey */
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)); /* Dark overlay */
    height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    margin-bottom: 30px;
}

/* Make the hotel images look neat */
.card-img-top {
    height: 200px;
    object-fit: cover;
}

/* Add some space to the footer */
footer {
    margin-top: 50px;
    padding: 20px 0;
    background-color: #212529;
    color: white;
}
/* Carousel Styling */
.carousel-img {
    height: 500px;         /* Fixed height for all slides */
    object-fit: cover;     /* Crops the image perfectly without stretching */
    filter: brightness(0.7); /* Darkens image slightly so text is readable */
}

.carousel-caption {
    bottom: 20%;           /* Moves text up a bit */
    text-shadow: 2px 2px 4px rgba(0,0,0,0.7); /* Makes text pop */
}