.social-card{
    font-family: 'Brush Script MT', cursive;

    width:1200px;

    margin:140px auto 80px;

    background:#a3b899;

    border-radius:30px;

    border:5px outset #667b68;

    padding:40px;

    box-shadow:
        0 10px 30px rgba(0,0,0,.08);
        
}

.social-card h2{

    text-align:center;

    color:#4b5c80;

    margin-top:0;
    margin-bottom:35px;
}

.social-grid{

    display:grid;

    grid-template-columns:repeat(6, 1fr);

    gap:25px;
}

.social-btn:nth-child(1){
    grid-column:1 / span 2;
}

.social-btn:nth-child(2){
    grid-column:3 / span 2;
}

.social-btn:nth-child(3){
    grid-column:5 / span 2;
}

.social-btn:nth-child(4){
    grid-column:1 / span 2;
}

.social-btn:nth-child(5){
    grid-column:3 / span 2;
}

.social-btn:nth-child(6){
    grid-column:5 / span 2;
}


.social-btn{

    height:110px;

    background:#f7faf5;

   
    border-radius:22px;

    text-decoration:none;

    color:#4b5c80;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    gap:10px;

     transition:all 0.45s ease;
}

.social-btn:hover{

     transform:translateY(-8px) scale(1.03);

    background:#eef5ea;
}

.social-btn i{

    font-size:38px;
}

.social-btn span{

    font-size:18px;

    font-weight:600;
}

.discord-btn{
    position:relative;
}

.discord-username{
    position:absolute;
    top:-30px;
    left:50%;

    transform:translateX(-50%);

    background:#4b5c80;
    color:white;

    padding:5px 10px;
    border-radius:10px;

    font-size:13px;

    opacity:0;
    transition:0.2s;

    pointer-events:none;
    white-space:nowrap;
}

.discord-btn:hover .discord-username{
    opacity:1;
    top:-40px;
}