section[style*="0a3d3d"] a:hover {
        transform: translateY(-10px) !important;
    }

    .whojoin-wrapper{
        background: linear-gradient(135deg, #0c2742d9 0%, #081421 100%); 
        padding: 60px 20px; 
        text-align: center; 
        margin: 0; 
        width: 100%; 
        box-sizing: border-box;
    }

    .whojoin-header{
        color: #ffffff; 
        font-size: 36px; 
        font-weight: 400; 
        margin: 0 0 50px 0; 
        padding: 0; 
        font-family: Arial, sans-serif;
    }

    .whojoin-container{
        display: flex; 
        justify-content: center; 
        align-items: center; 
        gap: 40px; 
        flex-wrap: wrap; 
        max-width: 1200px; 
        margin: 0 auto; 
        padding: 0;
    }
    .whojoin-link{
        position: relative; 
        text-decoration: none; 
        display: inline-block; 
        transition: transform 0.3s ease;
    }
    .whojoin-card-wrapper{
        position: relative; 
        width: 240px; 
        height: 260px;
    }

    .whojoin-image-wrapper{
        position: relative; 
        width: 240px; 
        height: 240px; 
        /* clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);  */
        /* background:  linear-gradient(135deg, #0c2742d9 0%, #081421 100%);  */
        overflow: hidden;
    }

    .whojoin-image-wrapper img{
        width: 100%; 
        height: 100%; 
        object-fit: cover; 
        display: block;
    }

    .whojoin-link-title{
        color: #ffffff; 
        font-size: 24px; 
        font-weight: bold; 
        text-transform: uppercase; 
        margin: 15px 0 0 0; 
        padding: 0; 
        letter-spacing: 1px; 
        font-family: Arial, sans-serif; 
        display: flex; 
        align-items: center; 
        justify-content: center; 
        gap: 10px;
    } 

    .whojoin-link-title span{
        font-size: 28px; 
        font-weight: normal;
    }
    /* Tablet */
    @media (max-width: 992px) {
        section[style*="0a3d3d"] h2 {
            font-size: 32px !important;
        }
    }

    /* Mobile */
    @media (max-width: 768px) {
        section[style*="0a3d3d"] {
            padding: 40px 15px !important;
        }
        section[style*="0a3d3d"] h2 {
            font-size: 28px !important;
            margin-bottom: 35px !important;
        }
        section[style*="0a3d3d"] > div {
            gap: 25px !important;
        }
        section[style*="0a3d3d"] h3 {
            font-size: 20px !important;
        }
    }

    /* Small Mobile */
    @media (max-width: 576px) {
        section[style*="0a3d3d"] > div {
            flex-direction: column !important;
            gap: 30px !important;
        }
        section[style*="0a3d3d"] h2 {
            font-size: 24px !important;
        }
    }