.banner-section {
    background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url('images/zenroom1.png');
    background-size: cover;
    background-position: center;
    padding: 80px 40px; /* Increased top and bottom padding */
    color: white;
    text-align: center;
    display: flex; /* Added flexbox for centering */
    flex-direction: column; /* Stack content vertically */
    justify-content: center; /* Vertically center content */
    min-height: 200px; /* Further reduced minimum height by ~20% */
    border-radius: 15px; /* Match parent's rounded corners, slightly smaller */
}

.banner-container {
    border: 5px solid #5A3E36; /* Thicker dark brown border */
    margin: 20px 20px; /* Added margin to the sides */
    border-radius: 20px; /* Accentuated rounded corners */
    overflow: hidden; /* Clip content to rounded corners */
}

.banner-content {
    max-width: 800px;
    margin: 0 auto;
    line-height: 1.6;
}

.banner-text {
    font-size: 1.2rem;
}

.jps-image {
    width: 100px; /* Made twice as big */
    height: 100px; /* Made twice as big */
    border-radius: 50%; /* Keep it circular */
    display: block; /* Keep it a block element for centering */
    margin: 10px auto 0; /* Keep margin */
}

.ceo-name {
    margin-bottom: 0; /* Reduce gap */
}

.ceo-title {
    margin-top: -7px; /* Adjust as needed to move it down slightly */
}

@media (max-width: 768px) {
    .banner-section {
        padding: 60px 20px; /* Adjusted padding for tablets */
    }
    .banner-text {
        font-size: 1rem; /* Reduced font size for tablets */
    }
    .jps-image {
        width: 80px; /* Smaller image for tablets */
        height: 80px;
    }
    .ceo-name {
        font-size: 0.9rem; /* Adjusted font size for tablets */
    }
    .ceo-title {
        font-size: 0.8rem; /* Adjusted font size for tablets */
    }
}

@media (max-width: 480px) {
    .banner-section {
        padding: 40px 15px; /* Adjusted padding for mobile */
    }
    .banner-text {
        font-size: 0.9rem; /* Reduced font size for mobile */
    }
    .jps-image {
        width: 60px; /* Even smaller image for mobile */
        height: 60px;
    }
    .ceo-name {
        font-size: 0.8rem; /* Adjusted font size for mobile */
    }
    .ceo-title {
        font-size: 0.7rem; /* Adjusted font size for mobile */
    }
}