/* Feature Container */
.feature {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 90%;
    max-width: 104rem;
    background-color: white;
    border-radius: 20px;
    box-shadow: 0 0 20px rgba(122, 132, 120, 0.2);
    border: 0.21px solid #2ecc71;
    padding: 3rem;
    margin: 8rem auto; /* Centers & adds space between sections */
    gap: 2rem;
}

/* Ensure Features Are Centered */
.feature:first-of-type {
    margin-top: 8rem; /* Add space at the top */
}

/* Feature Text */
.feature-text {
    width: 55%;
    text-align: left;
    padding: 2rem;
}

/* Headings */
.feature-text h2 {
    font-size: 3rem;
    font-weight: bold;
    color: #2ecc71;
    margin-bottom: 1.5rem;
}

/* Paragraphs */
.feature-text p {
    font-size: 2rem;
    color: #4a4a4a;
}

/* Feature Image */
.feature-image {
    width: 45%;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Image Styling */
.feature-image img {
    max-width: 90%;
    width: 100%;
    height: auto;
    object-fit: contain;
    border-radius: 15px; /* Make the image look nice */
}

/* Responsive Design */
@media (max-width: 1080px) {
    .feature {
        padding: 2rem;
    }

    .feature-text h2 {
        font-size: 2.5rem;
    }

    .feature-text p {
        font-size: 1.5rem;
    }
}

/* Stack on smaller screens */
@media (max-width: 810px) {
    .feature {
        flex-direction: column;
        text-align: center;
        gap: 3rem;
    }

    .feature-text {
        width: 100%;
        text-align: center;
    }

    .feature-image {
        width: 100%;
    }

    .feature-image img {
        max-width: 80%;
    }
}