/* Progressive pagination style */
.swiper-container {
    position: relative; /* Ensures absolutely positioned elements are relative to the container */
}

.swiper-pagination {
    height: 4px; /* Height of the progress bar */
    background-color: #e0e0e0; /* Background color of the bar */
    position: absolute;
    top: 0; /* Positions the bar at the top relative to the image */
    left: 0;
    right: 0;
    border-radius: 2px; /* Rounded corners */
    z-index: 10; /* Ensures the bar is visible above the image */
}

.swiper-container {
    max-width: 100%; /* Ensures the container fits the width of the post */
    overflow: hidden; /* Hides partially visible images */
    margin: 0 auto; /* Centers the carousel */
}

.swiper-slide {
    margin-right: 0; /* Removes additional margin */
}

.swiper-slide {
    width: 100%; /* Sets the width to 100% of the parent */
    aspect-ratio: 4 / 3; /* Maintains a 4:3 aspect ratio */
    overflow: hidden; /* Hides parts of the image that exceed the container */
    position: relative;
}

.swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Crops the image to fit the container */
    position: absolute;
    top: 0;
    left: 0;
}