/* =========================================================================
 * 阳光标讯 - 公共样式
 * 用于所有页面共享：footer、二维码、悬浮工具栏等
 * ========================================================================= */

/* ========== 通用变量（与 index.html 保持一致） ========== */
:root {
    --gray-500: #6B7280;
}

/* ========== 页脚 ========== */
.footer {
    background: #1F2937;
    color: rgba(255, 255, 255, 0.5);
    padding: 40px 24px 0;
    margin-top: auto;
}

.footer-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 200px;
    padding: 0 24px 36px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    flex-wrap: wrap;
}

.footer-col { flex: 0 0 auto; min-width: 0; }
.footer-col.footer-col-links { text-align: left; }
.footer-col.footer-col-qr { flex: 0 0 auto; }

.footer-col h3 {
    font-size: 15px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 16px;
}

.footer-col ul { list-style: none; padding: 0; margin: 0; }
.footer-col li { margin-bottom: 8px; }

.footer-col a {
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
    font-size: 13px;
    transition: color 0.15s;
}
.footer-col a:hover { color: #fff; }

/* ========== 二维码 ========== */
.footer-qrs {
    display: flex;
    gap: 24px;
}

.qr-item { text-align: center; }

/* ★ 关键：限定 QR 容器尺寸，避免图片撑爆布局 */
.qr-img {
    width: 90px;
    height: 90px;
    background: #fff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 6px;
    font-size: 11px;
    color: var(--gray-500);
    overflow: hidden;
}

.qr-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.qr-label {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.5);
}

.footer-bottom {
    max-width: 1280px;
    margin: 0 auto;
    padding: 16px 0;
    text-align: center;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.3);
}

/* ========== 响应式 ========== */
@media (max-width: 768px) {
    .footer-inner { gap: 32px; }
    .footer-qrs { display: none; }   /* 移动端隐藏二维码 */
}