
.footer{height:auto;padding: 80px 0 0;position: relative;}
/* Noi dung toi da 1444px o giua; man hep van giu le 140px */
.footer .widpub{
    padding-left: max(140px, calc((100% - 1444px) / 2));
    padding-right: max(140px, calc((100% - 1444px) / 2));
}

/* ---------- Grid: logo + mo ta | cac cot menu ---------- */
.footer-grid{
    display: flex;
    gap: 40px;
    padding-bottom: 56px;
}
.footer-brand{
    flex: 0 0 min(360px, 32%);
    min-width: 0;
}
.footer-brand__logo{ display: block; max-width: 100%; }
.footer-brand__desc{
    margin-top: 20px;
    color: #999;
    font-size: 13px;
    line-height: 1.8;
}
.footer-brand__desc p{ margin: 0 0 8px; }
.footer-brand__desc p:last-child{ margin-bottom: 0; }

.footer-col{
    flex: 1 1 0;
    min-width: 120px;
}
.footer-col__title{
    margin: 0 0 20px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
}
.footer-col__title a{ color: #fff; }
.footer-col__title a:hover{ color: #7091D9; }
.footer-col__list{
    list-style: none;
    margin: 0;
    padding: 0;
}
.footer-col__list li{ margin: 0 0 10px; }
.footer-col__list a{
    color: #999;
    font-size: 13px;
    line-height: 22px;
}
.footer-col__list a:hover{ color: #7091D9; }

/* Desktop: nut accordion an, hien link goc */
.footer .fot_acc_toggle{ display: none; }
.footer .fot_acc_link{ display: inline; }

/* ---------- Bottom: ban quyen | mang xa hoi ---------- */
.footer-bottom{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px 40px;
    padding: 24px 0;
    border-top: 1px solid rgba(255,255,255,.12);
}
.footer-bottom__legal{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 30px;
    color: #999;
    font-size: 12px;
}
.footer-bottom__legal span{
    display: flex;
    align-items: center;
}
.footer-bottom__legal img{ width: 15px; margin-right: 5px; }
.footer-bottom__legal a{ color: #999; }
.footer-bottom__legal a:hover{ color: #999; text-decoration: underline; }

.footer-social{
    display: flex;
    align-items: center;
    gap: 14px;
    color: #999;
    font-size: 12px;
}
.footer-social__item{
    position: relative;
    display: flex;
    align-items: center;
    color: #999;
}
.footer-social__item:hover{ color: #fff; text-decoration: none; }
.footer-social__icon{
    width: 25px;
    height: 25px;
    max-width: none;
    object-fit: contain;
    opacity: .75;
    transition: opacity .2s ease;
}
.footer-social__item:hover .footer-social__icon{ opacity: 1; }
/* QR hien khi hover (Zalo/WeChat...) */
.footer-social__qr{
    display: none;
    position: absolute;
    bottom: 100%;
    left: 50%;
    width: 100px;
    max-width: none;
    margin: 0 0 10px -50px;
    z-index: 5;
}
.footer-social__item.has-qr:hover .footer-social__qr{ display: block; }

/* ---------- Responsive ---------- */
@media (max-width: 1200px){
    .footer{ padding-top: 60px; }
    .footer .widpub{ padding: 0 40px; min-width: 0 !important; }
    .footer-grid{ gap: 28px; }
}

@media (max-width: 991px){
    .footer{
        height: auto !important;
        padding: 32px 0 0;
        min-width: 0 !important;
        background: #111;
    }
    .footer .widpub{
        padding: 0 20px !important;
        min-width: 0 !important;
    }

    .footer-grid{
        display: block;
        padding-bottom: 8px;
    }
    .footer-brand{ margin-bottom: 24px; }
    .footer-brand__logo{ width: 72px !important; }

    /* Accordion menu */
    .footer-col{
        border-bottom: 1px solid rgba(255,255,255,.12);
    }
    .footer-brand + .footer-col{
        border-top: 1px solid rgba(255,255,255,.12);
    }
    .footer-col__title{ margin: 0; }
    .footer .fot_acc_link{ display: none !important; }
    .footer .fot_acc_toggle{
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: 16px 0;
        margin: 0;
        border: 0;
        background: transparent;
        color: #ddd;
        font-size: 15px;
        text-align: left;
        cursor: pointer;
        font-family: inherit;
    }
    .footer-col:not(.has-sub) .footer-col__title > a{
        display: block;
        padding: 16px 0;
        color: #ddd;
        font-size: 15px;
        line-height: 28px;
    }
    .footer .fot_acc_icon{
        position: relative;
        width: 14px;
        height: 14px;
        flex-shrink: 0;
    }
    .footer .fot_acc_icon::before{
        content: "";
        position: absolute;
        width: 8px;
        height: 8px;
        left: 3px;
        top: 2px;
        border-right: 1.5px solid #aaa;
        border-bottom: 1.5px solid #aaa;
        transform: rotate(45deg);
        box-sizing: border-box;
        transition: transform .25s ease;
    }
    .footer-col.is-open .fot_acc_icon::before{
        top: 6px;
        transform: rotate(-135deg);
    }
    .footer-col__list{
        display: none;
        padding: 0 0 10px 12px;
    }
    .footer-col.is-open .footer-col__list{ display: block; }
    .footer-col__list li{ margin: 0; }
    .footer-col__list a{
        display: block;
        color: #888;
        font-size: 13px;
        line-height: 1.8;
        padding: 2px 0;
    }

    /* Mang xa hoi len tren, ban quyen can giua ben duoi */
    .footer-bottom{
        flex-direction: column-reverse;
        align-items: center;
        gap: 18px;
        border-top: 0;
        padding: 20px 0 32px;
    }
    .footer-social__title{ display: none; }
    .footer-social__icon{
        width: 28px;
        height: 28px;
        border-radius: 50%;
        object-fit: cover;
    }
    .footer-bottom__legal{
        flex-direction: column;
        gap: 4px;
        text-align: center;
        color: #777;
        font-size: 11px;
        line-height: 1.6;
    }
    .footer-bottom__legal span{ justify-content: center; }
}

@media (max-width: 575px){
    .footer .widpub{ padding: 0 16px !important; }
    .footer-brand__logo{ width: 64px !important; }
}
