/* =========================================
   TOPRANK FOOTER
========================================= */

.tr-home-footer{
    position:relative;

    padding:65px 0 25px;

    background:#07090c;

    color:#aeb5bd;
}


/* =========================================
   GRID
========================================= */

.tr-footer-grid{
    display:grid;

    grid-template-columns:1.5fr 1fr 1fr 1fr;

    gap:40px;
}


/* =========================================
   LOGO
========================================= */

.tr-footer-brand{
    display:flex;
    align-items:flex-start;
}

.tr-footer-logo{
    width:160px;

    margin:0 0 15px -11px;

    display:block;
}


/* =========================================
   HEADINGS
========================================= */

.tr-home-footer h4{
    margin:0 0 15px;

    color:#fff;

    font-size:11px;

    font-weight:700;

    letter-spacing:1px;
}


/* =========================================
   FOOTER MENUS
========================================= */

.tr-footer-menu{
    list-style:none;

    padding:0;
    margin:0;
}

.tr-footer-menu li{
    list-style:none;

    padding:0;
    margin:0;
}

.tr-footer-menu a{
    display:block;

    color:#aeb5bd;

    font-size:12px;

    line-height:2;

    text-decoration:none;

    transition:
        color .25s ease,
        transform .25s ease;
}

.tr-footer-menu a:hover{
    color:#fff;

    transform:translateX(2px);
}


/* =========================================
   FOOTER CONTACT
   IMPORTANT:
   These classes are UNIQUE to footer.
   They do NOT affect contact-us page.
========================================= */

.tr-footer-contact{
    display:block;
}


/* CONTACT ITEM */

.tr-footer-contact-item{
    display:flex !important;

    align-items:flex-start;

    gap:9px;

    margin:0 0 12px;

    color:#aeb5bd;

    font-size:12px;

    line-height:1.65;

    text-decoration:none;
}


/* CONTACT ICON */

.tr-footer-contact-icon{
    width:14px;

    min-width:14px;

    height:18px;

    margin-top:2px;

    display:flex;

    align-items:center;

    justify-content:center;
}


/* SVG */

.tr-footer-contact-icon svg{
    width:13px;

    height:13px;

    display:block;

    fill:none;

    stroke:#e62930;

    stroke-width:1.8;

    stroke-linecap:round;

    stroke-linejoin:round;
}


/* CONTACT TEXT */

.tr-footer-contact-text{
    display:block;

    color:#aeb5bd;

    font-size:12px;

    line-height:1.65;
}


/* CONTACT HOVER */

.tr-footer-contact a:hover
.tr-footer-contact-text{
    color:#fff;
}

.tr-footer-contact a:hover
.tr-footer-contact-icon svg{
    stroke:#fff;
}


/* =========================================
   COPYRIGHT
========================================= */

.tr-footer-copy{
    margin-top:40px;

    padding-top:20px;

    border-top:1px solid #25292d;

    color:#aeb5bd;

    font-size:10px;
}


/* =========================================
   BACK TO TOP
   DESIGN #1
========================================= */

.tr-footer-back-top{
    position:fixed;

    right:28px;
    bottom:28px;

    z-index:9999;

    width:44px;
    height:44px;

    padding:0;

    display:flex;

    align-items:center;
    justify-content:center;

    border:0;
    border-radius:50%;

    background:#e62930;

    cursor:pointer;

    opacity:0;
    visibility:hidden;

    transform:translateY(12px);

    box-shadow:
        0 8px 24px rgba(0,0,0,.28);

    transition:
        opacity .25s ease,
        visibility .25s ease,
        transform .25s ease,
        background .25s ease;
}

.tr-footer-back-top.is-visible{
    opacity:1;

    visibility:visible;

    transform:translateY(0);
}

.tr-footer-back-top:hover{
    background:#090c10;

    transform:translateY(-3px);
}

.tr-footer-back-top svg{
    width:18px;
    height:18px;

    fill:none;

    stroke:#fff;

    stroke-width:2;

    stroke-linecap:round;

    stroke-linejoin:round;
}


/* =========================================
   TABLET
========================================= */

@media (max-width:1050px){

    .tr-footer-grid{
        grid-template-columns:1.4fr 1fr 1fr 1fr;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width:767px){

    .tr-home-footer{
        padding:50px 0 22px;
    }


    .tr-footer-grid{
        grid-template-columns:1fr;

        gap:28px;
    }


    .tr-footer-logo{
        width:140px;

        margin-bottom:12px;
    }


    .tr-home-footer h4{
        margin-bottom:9px;
    }


    .tr-footer-menu a{
        font-size:11px;

        line-height:1.9;
    }


    .tr-footer-contact-item{
        gap:8px;

        margin-bottom:10px;

        font-size:11px;
    }


    .tr-footer-contact-icon{
        width:13px;

        min-width:13px;

        height:16px;

        margin-top:2px;
    }


    .tr-footer-contact-icon svg{
        width:12px;
        height:12px;
    }


    .tr-footer-contact-text{
        font-size:11px;

        line-height:1.7;
    }


    .tr-footer-copy{
        margin-top:28px;

        padding-top:16px;

        font-size:9px;

        line-height:1.5;
    }


    /* BACK TO TOP */

    .tr-footer-back-top{
        right:18px;

        bottom:18px;

        width:40px;

        height:40px;
    }


    .tr-footer-back-top svg{
        width:17px;

        height:17px;
    }

}