/* ==========================================================
   HARDIYANTO THEME
   FOOTER
========================================================== */

/* ==========================================
   FOOTER
========================================== */

.site-footer{

    margin-top:80px;

    background:#ffffff;

    border-top:1px solid var(--border);

}

/* ==========================================
   CONTAINER
========================================== */

.footer-inner{

    padding:70px 0 30px;

}

/* ==========================================
   TOP
========================================== */

.footer-top{

    display:grid;

    grid-template-columns:2fr 1fr 1fr;

    gap:60px;

    margin-bottom:50px;

}

/* ==========================================
   COLUMN
========================================== */

.footer-column{

    min-width:0;

}

/* ==========================================
   LOGO
========================================== */

.footer-logo{

    display:inline-block;

    margin-bottom:18px;

    font-family:'Plus Jakarta Sans',sans-serif;

    font-size:36px;

    font-weight:800;

    color:var(--heading);

}

.footer-logo:hover{

    color:var(--primary);

}

/* ==========================================
   DESCRIPTION
========================================== */

.footer-description{

    max-width:500px;

    margin-bottom:28px;

    font-size:17px;

    line-height:1.9;

    color:var(--light);

}


   
   /* ==========================================
   TITLE
========================================== */

.footer-title{

    margin:0 0 24px;

    font-size:22px;

    font-weight:700;

    color:var(--heading);

}

/* ==========================================
   MENU
========================================== */

.footer-menu{

    margin:0;

    padding:0;

    list-style:none;

}

.footer-menu li{

    margin-bottom:14px;

}

.footer-menu li:last-child{

    margin-bottom:0;

}

.footer-menu a{

    color:var(--text);

    font-size:16px;

    transition:var(--transition);

}

.footer-menu a:hover{

    color:var(--primary);

    padding-left:6px;

}

/* ==========================================
   SOCIAL
========================================== */

.footer-social{

    display:flex;

    align-items:center;

    gap:14px;

    margin-top:24px;

}

.footer-social a{

    display:flex;

    align-items:center;

    justify-content:center;

    width:42px;

    height:42px;

    border-radius:50%;

    border:1px solid var(--border);

    background:#fff;

    color:var(--heading);

    transition:var(--transition);

}

.footer-social a:hover{

    background:var(--primary);

    border-color:var(--primary);

    color:#fff;

    transform:translateY(-2px);

}

/* ==========================================
   BOTTOM
========================================== */

.footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    padding-top:28px;

    border-top:1px solid var(--border);

}

/* ==========================================
   COPYRIGHT
========================================== */

.footer-copyright{

    font-size:15px;

    color:var(--light);

}

/* ==========================================
   FOOTER NAV
========================================== */

.footer-bottom-menu{

    display:flex;

    gap:24px;

}

.footer-bottom-menu a{

    font-size:15px;

    color:var(--light);

}

.footer-bottom-menu a:hover{

    color:var(--primary);

}

/* ==========================================
   LINK
========================================== */

.site-footer a{

    text-decoration:none;

}

/* ==========================================
   MOBILE
========================================== */

@media (max-width:992px){

    .footer-top{

        grid-template-columns:1fr 1fr;

        gap:40px;

    }

}

@media (max-width:768px){

    .footer-inner{

        padding:60px 0 30px;

    }

    .footer-top{

        grid-template-columns:1fr;

        gap:35px;

    }

    .footer-column{

        text-align:center;

    }

    .footer-description{

        margin-left:auto;

        margin-right:auto;

    }

    .footer-social{

        justify-content:center;

    }

    .footer-bottom{

        flex-direction:column;

        text-align:center;

    }

    .footer-bottom-menu{

        justify-content:center;

        flex-wrap:wrap;

    }

}