/*====================================
CONTACT
==================================================*/

.contact{

    position:relative;

    padding:140px 0;

}

.contact::before{

    content:"";

    position:absolute;

    left:-180px;

    bottom:-180px;

    width:500px;

    height:500px;

    background: #505050 ;

    border-radius:50%;

    opacity:.05;

    filter:blur(150px);

}

/*====================================
CONTACT GRID
====================================*/

.contact-grid{

    display:grid;

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

    gap:35px;

    margin-top:70px;

}

/*====================================
CONTACT CARD
====================================*/

.contact-card{

    position:relative;

    overflow:hidden;

    text-align:center;

    padding:45px 30px;

    border-radius:30px;

    background:#0b0b0b;

    border:1px solid #a30000;

    transition:.45s;

}

.contact-card:hover{

    transform:translateY(-12px);

    border-color: #f2f5ed;

    box-shadow:

    0 30px 80px #dbc49f;

}

.contact-card::before{

    content:"";

    position:absolute;

    width:220px;

    height:220px;

    background: #dbc49f;

    border-radius:50%;

    top:-120px;

    right:-120px;

    filter:blur(120px);

    opacity:0;

    transition:.4s;

}

.contact-card:hover::before{

    opacity:.16;

}

/*====================================
ICON
====================================*/

.contact-card img{

    width:72px;

    height:72px;

    object-fit:contain;

    margin:0 auto 25px;

    transition:.4s;

}

.contact-card:hover img{

    transform:scale(1.15) rotate(10deg);

}

/*====================================
TEXT
====================================*/

.contact-card h3{

    font-size:24px;

    margin-bottom:12px;

}

.contact-card p{

    color:#0b0b0b;

    margin-bottom:20px;

}

.contact-card span{

    display:inline-block;

    color: #0B0B0B;

    font-weight:700;

}