.why-battery{
    background-color: #bcdafa;
    padding-bottom: 20px;
    text-align: center;
}
.why-battery h3{
    color: #000;

    /* Heading-1 */
    font-family: Outfit;
    font-size: 30px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    padding: 10px;
}

.list-container{
    display: flex;
    justify-content: center;
    align-items: center;
}

.list-container ul.list-ic {
    list-style-position: inside; /* Align text with bullet */
}

.list-container ul.list-ic li {
    margin-bottom: 20px;
}
.why-battery .list-container ul {
    list-style-type: none; /* Removes the bullet points */
    padding: 0; /* Removes the default padding of the list */
    margin: 0; /* Removes the default margin of the list */
}

.list-ic a {
    color: #788288;
    text-decoration: none;
    color: #000;
    /* Header-Navbar */
    font-family: Outfit;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.image-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 5px 5px;
    justify-content: center;
    align-items: center;
    margin: auto; /* Centers the entire grid container */
    width: fit-content; /* Ensures the grid’s width only takes up necessary space */
}

.image-grid img {
    width: 500px; /* Adjust width as needed */
    height: 350px; /* Adjust height as needed */
    object-fit: cover;
    border-radius: 8px; /* Optional: adds rounded corners */
    margin: 0;
}

/* Blackout Part*/
.blackout-title{
    /* padding-left: 160px;
    padding-right: 110px; */
    text-align: center;
}



.blackout-party-text{
    color: #000;
    /* Header-Navbar */
    font-family: Outfit;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding-left: 160px;
    padding-right: 110px;
}
@media (max-width: 1045px) {
    .image-grid img {
        width: 400px; /* Makes images responsive */
        height: 280px; /* Maintains aspect ratio */
    }
}

/* Responsive design for smaller screens */
@media (max-width: 768px) {
    .why-battery h3{
        font-size: 20px;
    }
    .blackout-party-text{
        font-size: 14px;
        padding: 8px 12px;
    }
    .list-container{
        padding: 8px 12px;
    }
    .list-ic a {
        font-size: 14px;
    }
    .list-container ul.list-ic li::marker {
        font-size: 1em; /* Adjust bullet size as needed */
    }
    .image-grid {
        grid-template-columns: None;
        width: 100%; /* Adjusts width to fit smaller screens */
        gap: 20px; /* Optional: adjust gap for smaller screens */
    }

    .image-grid img {
        width: 200px; /* Makes images responsive */
        height: 140px; /* Maintains aspect ratio */
    
    }
}