/* Education Section */
#education {
    padding: 0.938rem; /* Reduced by 25% from 1.25rem */
}

/* Education Cards Container */
.education-cards {
    width: 100%;
}

/* Education Card Styling */
.education-card {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 11.719rem; /* Reduced by 25% from 15.625rem */
    margin: 1.406rem 0; /* Reduced by 25% from 1.875rem */
    border-radius: 0.703rem; /* Reduced by 25% from 0.9375rem */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center right;
    position: relative;
    overflow: hidden;
    opacity: 0;
    transform: translateX(-23.438rem); /* Reduced by 25% from -31.25rem */
    transition: opacity 0.5s ease, transform 1.0s ease;
}

/* Reverse the layout for alternating cards */
.education-card.reverse {
    justify-content: flex-end;
    background-position: center left;
    transform: translateX(23.438rem); /* Reduced by 25% from 31.25rem */
}

/* Class to slide in when in view */
.education-card.in-view {
    opacity: 1;
    transform: translateX(0);
}

/* Gradient Overlay */
.education-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));
    z-index: 1;
}

.education-card.reverse::before {
    background: linear-gradient(to left, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));
}

/* Education Info */
.education-info-left, .education-info-right {
    position: relative;
    z-index: 2;
    padding: 1.406rem; /* Reduced by 25% from 1.875rem */
    width: 50%;
    color: var(--text-color);
}

.education-info-left h3, .education-info-right h3 {
    font-size: 1.688rem; /* Reduced by 25% from 2.25rem */
    margin-bottom: 0.469rem; /* Reduced by 25% from 0.625rem */
    color: var(--secondary-color);
}

.education-info-left p, .education-info-right p {
    font-size: 1.125rem; /* Reduced by 25% from 1.5rem */
    line-height: 1.6;
    color: var(--text-color);
}

/* GPA Styling */
.gpa {
    margin-top: 0.469rem; /* Reduced by 25% from 0.625rem */
    font-weight: bold;
    color: var(--primary-color);
}

/* Responsive Design for Smaller Screens */
@media (max-width: 36rem) { /* Reduced by 25% from 48rem */
    .education-card {
        flex-direction: column;
        height: auto;
    }

    .education-card.reverse {
        flex-direction: column;
    }

    .education-info-left, .education-info-right {
        width: 100%;
        padding: 0.938rem; /* Reduced by 25% from 1.25rem */
    }
}
