/* ==========================================================================
   共用 Footer 片段 fragments/footer.html 用到的样式
   已抽离自 style.css（原 1299~1488 行）
   依赖 style.css 中的通用类：.container / .section-header / .section-title / .title-icon
   ========================================================================== */

/* ===== 友情链接（合并于页脚内） ===== */
.friend-links-inner {
    padding: calc(44 * var(--u)) 0 calc(28 * var(--u));
    border-bottom: 1px solid rgba(255, 255, 255, .15);
}

.footer-img {
    height: calc(231 * var(--u));
}

.friend-links-inner .section-header {
    margin-bottom: 22px;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
}

.friend-links-inner .section-title {
    color: #fff;
    font-size: calc(42 * var(--u));
    font-weight: 400;
    gap: calc(25 * var(--u));
}

.friend-links-inner .section-title::before {
    background: #4fc3f7;
}

.friend-links-inner .title-icon::before,
.friend-links-inner .title-icon::after {
    background: #fff;
}

.friend-icon {
    margin-right: calc(10 * var(--u));
    font-size: calc(22 * var(--u));
    opacity: .95;
}

.friend-links-wrap {
    display: flex;
    flex-direction: column;
    gap: calc(14 * var(--u));
}

.friend-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.friend-row a {
    font-size: 15px;
    color: #4fc3f7;
    padding: 0 calc(18 * var(--u));
    border-right: 1px solid #08C4DF;
    transition: color .2s;
    font-size: calc(24 * var(--u));
    color: #08C4DF;
    line-height: calc(23 * var(--u));
}

.friend-row a:first-child {
    padding-left: 0;
}

.friend-row a:last-child {
    border-right: none;
}

.friend-row a:hover {
    color: #fff;
}

/* ===== 页脚 ===== */
.footer {
    background: #0d3b66;
    color: rgba(255, 255, 255, .85);
    padding: calc(38 * var(--u)) 0;
    background: #19376E;
}

.footer-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: calc(30 * var(--u));
}

.footer-logo {
    width: calc(76 * var(--u));
    height: calc(76 * var(--u));
    flex-shrink: 0;
}

.footer-logo svg {
    width: 100%;
    height: 100%;
}

.footer-divider {
    width: 1px;
    height: calc(70 * var(--u));
    background: rgba(255, 255, 255, .2);
    flex-shrink: 0;
}

.footer-info {
    flex-shrink: 0;
}

.footer-info p {
    font-size: 14px;
    line-height: 1.9;
    font-size: calc(20 * var(--u));
    color: #FFFFFF;
    line-height: calc(24 * var(--u));
    margin-bottom: calc(7 * var(--u));
}

.footer-links-row {
    display: flex;
    align-items: center;
    gap: calc(10 * var(--u));
}


.footer-links-row a:hover {
    color: #4fc3f7;
}

.footer-links-row .sep {
    opacity: .5;
}

.footer-qr {
    display: flex;
    gap: calc(40 * var(--u));
    flex-shrink: 0;
}

.qr-item {
    text-align: center;
    border-radius: calc(20 * var(--u));
    border: 1px solid #FFFFFF;
    padding: calc(12 * var(--u)) calc(15 * var(--u)) calc(5 * var(--u));
}

.qr-item img {
    width: calc(107 * var(--u));
    height: calc(107 * var(--u));
    background: #fff;
    margin-bottom: calc(8 * var(--u));
    padding: calc(3 * var(--u));
}

.qr-item span {
    font-size: calc(12 * var(--u));
}

/* ===== 返回顶部 ===== */
.back-top {
    position: fixed;
    right: calc(28 * var(--u));
    bottom: calc(36 * var(--u));
    width: calc(46 * var(--u));
    height: calc(46 * var(--u));
    background: #0e5aa7;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(20 * var(--u));
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .25);
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s, visibility .3s, background .2s;
    z-index: 200;
}

.back-top.show {
    opacity: 1;
    visibility: visible;
}

.back-top:hover {
    background: #1468a8;
}

/* ===== 手机端适配（≤768px） ===== */
@media (max-width: 768px) {
    /* 隐藏友情链接 */
    .friend-links-inner,.m-footer-info {
        display: none;
    }

    /* 页脚主区：保持单行横向排列（不堆叠）；各块允许收缩 + 缩小尺寸以适配窄屏。
       若极窄屏仍放不下，整行可横向滚动而非被裁切 */
    .footer-main {
        flex-wrap: nowrap;
        align-items: center;
        justify-content: space-between;
        gap: calc(12 * var(--u));
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .footer-divider {
        display: none;
    }

    .footer-logo {
        width: calc(88 * var(--u));
        height: calc(88 * var(--u));
    }

    .footer-info {
        flex-shrink: 1;
        min-width: 0;
    }

    .footer-info p {
        font-size: calc(16 * var(--u));
        line-height: calc(20 * var(--u));
        margin-bottom: calc(4 * var(--u));
    }

    .footer-qr {
        flex-shrink: 1;
        gap: calc(12 * var(--u));
    }

    .qr-item {
        padding: calc(6 * var(--u)) calc(8 * var(--u)) calc(3 * var(--u));
    }

    .qr-item img {
        width: calc(88 * var(--u));
        height: calc(88 * var(--u));
    }

    .qr-item span {
        font-size: calc(11 * var(--u));
    }

    .footer-img {
        height: auto;
    }
}