.main-footer{
    position: relative;
    background-color: var(--block-color-two);
}
.main-footer .footer-top{
    padding-top: 100px;
}
.main-footer .footer-logo{
    max-width: 325px;
    width: 80%;
}
.main-footer .shape-weight{
    position: absolute;
    right: 0;
    bottom: 20px;
}
.main-footer .container{
    max-width: 1410px;
    width: 100%;
}
.main-footer .widget-title{
    margin-right: 50px;
    margin-bottom: 40px;
}
.main-footer .widget-title h5{
    position: relative;
    padding-bottom: 18px;
    text-transform: capitalize;
    color: var(--white-color);
}
.main-footer .widget-title h5:before{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    content: '';
    background-color: #4D4D4D;
}
.main-footer .widget-title h5:after{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 45px;
    height: 2px;
    content: '';
    background: linear-gradient(270deg, #d91b1b -22.92%, #FF9360 56.63%);
}
.footer-column .footer-widget{
    margin-bottom: 40px;
}
.footer-widget p.text{
    color: var(--white-color);
}
.footer-widget .contact-info-two li {
    display: flex;
    justify-content: left;
}
.footer-widget .contact-info-two li a{
    display: inline-flex;
}
.newsletter-form{
    position: relative;
    margin-top: 17px;    
}
.newsletter-form .icon i{
    position: absolute;
    top: 15px;
    left: 22px;
    color: var(--white-color);
}
.newsletter-form input{
    width: 100%;
    height: 55px;
    padding: 14px 10px 14px 45px;
    color: var(--white-color);
    background-color: #272727;
    border: 1px solid #272727;
    transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
}
.newsletter-form input:focus,
.newsletter-form input:hover{
    border-color: var(--secondary-color);
}
.newsletter-form button {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 1;
    width: 45px;
    height: 45px;
    line-height: 48px;
    text-align: center;
    color: var(--white-color);
    text-transform: capitalize;
    background-color: var(--secondary-color);
}
.newsletter-form button:before{
    position: absolute;
    top: 0;
    right: 0;
    width: 0;
    height: 45px;
    content: '';
    z-index: -1;
    background-color: var(--tertiary-color);
    transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
}
.newsletter-form button:hover:before{
    width: 100%;
}
.project-widget .wrapper-box {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 10px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0px -4.5px;
}
.project-widget .wrapper-box .image {
    position: relative;
    overflow: hidden;
    display: inline-block;
    cursor: pointer;
    margin: 0px 3.5px 8px;
}
.project-widget .wrapper-box .image img{
    width: 100%;
    transform: scale(1);
    transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
}
.project-widget .wrapper-box .image:hover img{
    transform: scale(1.15);
}
.footer-bottom-inner{
    border-top: 1px solid #4C4C4C;
}
.copyright-text{    
    text-align: center;
    padding: 27px 0px;
    color: var(--white-color);
}
.copyright-text a{
    display: inline-block;
    cursor: pointer;
    color: var(--white-color);
}
.copyright-text a:hover{
    color: var(--secondary-color);
}

.main-footer.home-four{
    background-color: var(--block-color-two);
}
.main-footer.home-four .footer-upper-inner{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 80px 0px 40px;
}
.main-footer.home-four .footer-upper-inner .title h4{
    color: var(--white-color);
}
.main-footer.home-seven{
    background-color: var(--primary-color);
}
.main-footer.home-seven .widget-title h5:before{
    background-color: rgb(255 255 255 / 30%);
}
.main-footer.home-seven .footer-bottom-inner{
    border-color: rgb(255 255 255 / 30%);
}
.main-footer.home-seven .shape-forklift{
    position: absolute;
    bottom: 0px;
    left: -230px;
}
.main-footer.home-eight{
    background-color: var(--block-color-three);
}
.main-footer.home-eight .quick-widget,
.main-footer.home-eight .faq-widget{
    margin-left: 100px;
}
.quick-widget .quick-links li{
    margin-bottom: 20px;
}
.quick-widget .quick-links li a{
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    color: #fff;
}
.quick-widget .quick-links li a:hover{
    color: var(--tertiary-color);
}
.faq-widget .faq-links li{
    margin-bottom: 20px;
}
.faq-widget .faq-links li a{
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    color: #fff;
}
.faq-widget .faq-links li a:hover{
    color: var(--tertiary-color);
}
.main-footer.home-eight .newsletter-form input{
    background-color: rgb(255 255 255 / 10%);
}
.main-footer.inner-page{
    position: relative;
    overflow: hidden;
}
.main-footer .parallax-scene{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.main-footer .pattern-1{
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
}
.main-footer.home-six .footer-upper-inner{
    display: flex;
    align-items: center;
    padding: 110px 0px 60px;
    justify-content: space-between;
}
.main-footer.home-six p{
    font-size: 18px;
    line-height: 30px;
    font-weight: 400;
    color: var(--white-color);
}
.main-footer.home-six .newsletter-form{
    max-width: 500px;
    width: 100%;
}
.main-footer.home-six .newsletter-form button{
    width: auto;
    padding: 0px 35px;
}
.main-footer.home-six .footer-bottom-inner{
    position: relative;
}
.main-footer.home-six .footer-bottom-inner .social-midea{
    position: absolute;
    right: 0;
    top: 15px;
}

@media only screen and (max-width: 1200px){
    .main-footer .widget-title{
        margin-right: 0px;
    }
}

@media only screen and (max-width: 1199px){
    .main-footer.home-eight .quick-widget, 
    .main-footer.home-eight .faq-widget{
        margin-left: 0;
    }
    .main-footer.home-six .footer-upper-inner{
        display: block;
        padding: 110px 0px 60px;
        text-align: center;
    }
    .main-footer.home-six .footer-logo{
        margin: 0 auto;
        margin-bottom: 30px;
    }
    .main-footer.home-six p{
        margin-bottom: 30px;
    }
    .main-footer.home-six .newsletter-form{
        margin: 0 auto;
    }
    .main-footer.home-six .footer-bottom-inner .social-midea{
        position: relative;
        text-align: center;
        top: 0;
        padding-bottom: 20px;
    }    
}
@media only screen and (max-width: 991px){
    .main-footer.home-four .footer-upper-inner{
        display: block;
        text-align: center;
    }
    .main-footer.home-four .footer-upper-inner .title h4{
        margin-bottom: 30px;
    }
    .main-footer.home-four .footer-upper-inner .footer-logo{
        margin-bottom: 30px;
    }
    .main-footer.home-four .footer-logo{
        margin: 0 auto;
    }
}
@media only screen and (max-width: 500px){
    .main-footer .footer-logo{
        max-width: 280px;
    }
    .main-footer.home-six .newsletter-form button{
        position: relative;
        margin-top: 15px;
    }
}


/* ==========================================================================
   Modern footer  (scoped to .footer-modern)
   --------------------------------------------------------------------------
   Everything below is namespaced under .footer-modern so the older footer
   variants elsewhere in this file (home-four / home-six / home-eight) keep
   rendering exactly as they did. Palette comes from css/global.css tokens.
   ========================================================================== */

.footer-modern{
    position: relative;
    background-color: #161616;
    background-image:
        radial-gradient(900px 380px at 12% -12%, rgba(217,27,27,.16), transparent 60%),
        radial-gradient(700px 320px at 92% 8%,  rgba(255,147,96,.10), transparent 62%);
}
.footer-modern .footer-accent{
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(270deg, #d91b1b -22.92%, #FF9360 56.63%);
}
.footer-modern .footer-top{
    padding-top: 84px;
    padding-bottom: 20px;
}
.footer-modern .footer-logo{ max-width: 260px; }

.footer-modern .footer-widget p.text{
    color: #C7C7C7;
    font-size: 15px;
    line-height: 28px;
    margin-bottom: 24px;
}

/* --- section headings --------------------------------------------------- */
.footer-modern .widget-title{
    margin-right: 0;
    margin-bottom: 26px;
}
.footer-modern .widget-title h5{
    font-size: 18px;
    letter-spacing: .2px;
    padding-bottom: 14px;
}
.footer-modern .widget-title h5:before{ background-color: rgba(255,255,255,.12); }
.footer-modern .widget-title h5:after{ width: 42px; height: 3px; border-radius: 3px; }

/* --- trust chips -------------------------------------------------------- */
.footer-modern .footer-trust{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 26px;
    padding: 0;
    list-style: none;
}
.footer-modern .footer-trust li{
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 13px;
    font-size: 12.5px;
    line-height: 1;
    color: #E4E4E4;
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 999px;
}
.footer-modern .footer-trust li i{ color: var(--primary-color); font-size: 12px; }

/* --- social ------------------------------------------------------------- */
.footer-modern .footer-social{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 0;
    list-style: none;
}
.footer-modern .footer-social a{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    color: #fff;
    font-size: 15px;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.12);
    transition: background-color .3s ease, transform .3s ease, border-color .3s ease;
}
.footer-modern .footer-social a:hover{
    background: var(--primary-color);
    border-color: var(--primary-color);
    transform: translateY(-4px);
}

/* --- link columns ------------------------------------------------------- */
.footer-modern .footer-links{ padding: 0; list-style: none; }
.footer-modern .footer-links li{ margin-bottom: 13px; }
.footer-modern .footer-links li:last-child{ margin-bottom: 0; }
.footer-modern .footer-links a{
    position: relative;
    display: inline-block;
    padding-left: 16px;
    font-size: 15px;
    line-height: 26px;
    color: #C7C7C7;
    transition: color .3s ease, transform .3s ease;
}
.footer-modern .footer-links a:before{
    content: '';
    position: absolute;
    left: 0;
    top: 11px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255,255,255,.28);
    transition: background-color .3s ease, width .3s ease;
}
.footer-modern .footer-links a:hover{
    color: #fff;
    transform: translateX(4px);
}
.footer-modern .footer-links a:hover:before{
    width: 10px;
    border-radius: 4px;
    background: var(--primary-color);
}

/* --- contact rows ------------------------------------------------------- */
.footer-modern .footer-contact{ padding: 0; list-style: none; margin-bottom: 26px; }
.footer-modern .footer-contact li{
    display: flex;
    align-items: flex-start;
    gap: 13px;
    margin-bottom: 18px;
}
.footer-modern .footer-contact li:last-child{ margin-bottom: 0; }
.footer-modern .fc-icon{
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 14px;
    color: var(--primary-color);
    background: rgba(217,27,27,.14);
    border: 1px solid rgba(217,27,27,.25);
}
.footer-modern .fc-body{ display: flex; flex-direction: column; }
.footer-modern .fc-label{
    font-size: 11.5px;
    letter-spacing: .6px;
    text-transform: uppercase;
    color: #8C8C8C;
    margin-bottom: 3px;
}
.footer-modern .fc-body a,
.footer-modern .fc-plain{
    font-size: 15px;
    line-height: 24px;
    color: #EDEDED;
    transition: color .3s ease;
}
.footer-modern .fc-body a:hover{ color: var(--primary-color); }

/* --- CTA ---------------------------------------------------------------- */
.footer-modern .footer-cta{
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 13px 26px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(270deg, #d91b1b -22.92%, #FF9360 130%);
    box-shadow: 0 8px 22px rgba(217,27,27,.28);
    transition: transform .3s ease, box-shadow .3s ease;
}
.footer-modern .footer-cta:hover{
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(217,27,27,.42);
}

/* --- bottom bar --------------------------------------------------------- */
.footer-modern .footer-bottom{
    margin-top: 30px;
    border-top: 1px solid rgba(255,255,255,.1);
    background: rgba(0,0,0,.28);
}
.footer-modern .footer-bottom-inner{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 22px 0;
}
.footer-modern .copyright-text{
    font-size: 14.5px;
    line-height: 26px;
    color: #A8A8A8;
    margin: 0;
}
.footer-modern .copyright-text a{ color: #fff; }
.footer-modern .copyright-text a:hover{ color: var(--primary-color); }
.footer-modern .footer-bottom-links{
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
    padding: 0;
    margin: 0;
    list-style: none;
}
.footer-modern .footer-bottom-links a{
    font-size: 14.5px;
    color: #A8A8A8;
    transition: color .3s ease;
}
.footer-modern .footer-bottom-links a:hover{ color: var(--primary-color); }

/* --- responsive --------------------------------------------------------- */
@media only screen and (max-width: 991px){
    .footer-modern .footer-top{ padding-top: 64px; }
}
@media only screen and (max-width: 767px){
    .footer-modern .footer-top{ padding-top: 52px; }
    .footer-modern .footer-bottom-inner{
        flex-direction: column;
        text-align: center;
        gap: 14px;
    }
    .footer-modern .footer-bottom-links{ justify-content: center; gap: 18px; }
}
@media only screen and (max-width: 575px){
    .footer-modern .footer-logo{ max-width: 220px; }
    .footer-modern .footer-cta{ width: 100%; justify-content: center; }
    .footer-modern .footer-trust li{ font-size: 12px; padding: 6px 11px; }
}

/* --- interop with css/mobile.css ---------------------------------------
   mobile.css sets `.main-footer ul li a { display:inline-flex; min-height:44px }`
   with !important to guarantee 44px tap targets. That is the right call for the
   text links, but it stretches the round social buttons into ovals. These
   selectors carry one more class than that rule, so they win without needing to
   weaken it - the 44px minimum still applies everywhere else.
   -------------------------------------------------------------------------- */
@media only screen and (max-width: 767px){
    .footer-modern .footer-social li a{
        width: 44px !important;
        min-height: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        justify-content: center !important;
    }
    .footer-modern .footer-contact li a{
        min-height: 0 !important;
        padding: 0 !important;
        display: inline !important;
    }
    .footer-modern .footer-bottom-links li a{
        min-height: 34px !important;
    }
}
