/* ==========================================================================
   联系我们区块 · 独立样式 (zz: 按参考图 · 3列布局：图标列/文本列/微信列)
   ========================================================================== */

/* ---------- 外层双栏：左窄(表单) / 右宽(合作+方式) ---------- */
.contact-grid-two {
    display: grid;
    grid-template-columns: 0.9fr 1.3fr;
    gap: 24px;
    align-items: stretch;
    grid-auto-rows: 1fr;
}
.contact-grid-two > .contact-card {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
.contact-form-wrap.contact-card { padding: 28px; }

/* ---------- 右栏：合作模式 + 联系方式（顶部紧贴/紧凑）---------- */
.contact-info-wrap.contact-card {
    padding: 28px 32px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ---------- 左段：合作模式 ---------- */
.contact-info-wrap .coop-integrated {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--gray-100, #eef2f7);
}
.contact-info-wrap .coop-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--gray-900, #0f172a);
    margin: 0 0 4px 0;
}
.contact-info-wrap .coop-cards {
    display: flex;
    flex-direction: row;
    gap: 16px;
    align-items: stretch; /* 两张合作卡等高 */
}
.contact-info-wrap .coop-cards .coop-card {
    flex: 1 1 0;
    background: var(--gray-50, #f8fafc);
    border: 1px solid var(--gray-100, #eef2f7);
    border-radius: 12px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* 内容顶部对齐，避免短内容被垂直居中造成视觉留白 */
    gap: 8px;
    min-width: 0;
}
.contact-info-wrap .coop-card h4 {
    font-size: 15px;
    font-weight: 700;
    color: var(--primary-dark, #1e40af);
    margin: 0;
    line-height: 1.4;
    word-break: break-word;
}
.contact-info-wrap .coop-card p {
    margin: 0;
    font-size: 13px;
    color: var(--gray-600, #475569);
    line-height: 1.6;
    word-break: break-word;
}

/* ---------- 右段：联系方式 ---------- */
.contact-info-wrap .zc-ct-header {
    font-size: 22px;
    font-weight: 700;
    color: var(--gray-900, #0f172a);
    margin: 0;
}

/* ---------- 3列网格：图标列 | 文本列 | 微信列 ---------- */
.contact-info-wrap .zc-contact-list {
    display: grid;
    grid-template-columns: 60px minmax(0, 1.1fr) minmax(0, 1fr);
    grid-auto-rows: min-content;
    column-gap: 20px;
    row-gap: 14px;
    flex: 1 1 auto;
    align-items: stretch;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
}

/* ---------- 单行信息（邮箱、电话、地址、工作时间）----------
   使用 display:contents 让 item 在 grid 中透明，子元素直接落到 grid 行/列
   老浏览器（Safari<15, Edge<88）降级为普通 flex 行，仍能展示内容
*/
@supports (display: contents) {
    .contact-info-wrap .zc-info-item { display: contents; }
}
@supports not (display: contents) {
    .contact-info-wrap .zc-info-item {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 8px 4px;
    }
}

/* 大圆形描线图标（56px）*/
.contact-info-wrap .zc-info-icon {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary, #2563eb);
    border-radius: 50%;
    background: #fff;
    border: 1.5px solid var(--primary, #2563eb);
    align-self: center;
}
.contact-info-wrap .zc-info-icon svg { display: block; width: 26px; height: 26px; }

/* 文本列 */
.contact-info-wrap .zc-info-text {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0;
}
.contact-info-wrap .zc-info-text h4 {
    font-size: 12px;
    margin: 0 0 4px 0;
    line-height: 1.3;
    font-weight: 500;
    letter-spacing: .5px;
    color: var(--gray-500, #64748b);
}
.contact-info-wrap .zc-info-text p {
    color: var(--primary, #2563eb);
    font-size: 15px;
    line-height: 1.45;
    font-weight: 500;
    word-break: break-word;
    overflow-wrap: anywhere;
    margin: 0;
}
.contact-info-wrap .zc-info-text a { color: var(--primary, #2563eb); }

/* ---------- 微信列：二维码(上·跨3行) + 工作时间(下) ---------- */
.contact-info-wrap .zc-info-wechat-col {
    grid-column: 3;
    grid-row: 1 / span 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 6px 6px 20px;
}
.contact-info-wrap .zc-wechat-qr-wrap {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 0;
}
.contact-info-wrap .zc-wechat-qr-img {
    width: 100%;
    max-width: 200px;
    aspect-ratio: 1 / 1;
    border-radius: 10px;
    object-fit: cover;
    border: 1px solid var(--gray-100, #eef2f7);
}
.contact-info-wrap .zc-wechat-placeholder {
    width: 180px;
    aspect-ratio: 1 / 1;
    background: var(--gray-50, #f8fafc);
    border: 1px dashed var(--gray-200, #e2e8f0);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    text-align: center;
    font-size: 12px;
    color: var(--gray-500, #64748b);
}

/* 工作时间（横排：图标 + 文本）*/
.contact-info-wrap .zc-worktime-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
}
.contact-info-wrap .zc-worktime-icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary, #2563eb);
    border-radius: 50%;
    background: #fff;
    border: 1.5px solid var(--primary, #2563eb);
}
.contact-info-wrap .zc-worktime-icon svg { display: block; width: 20px; height: 20px; }
.contact-info-wrap .zc-worktime-text { min-width: 0; }
.contact-info-wrap .zc-worktime-text h4 {
    font-size: 11px;
    margin: 0 0 2px 0;
    line-height: 1.3;
    font-weight: 500;
    letter-spacing: .5px;
    color: var(--gray-500, #64748b);
}
.contact-info-wrap .zc-worktime-text p {
    margin: 0;
    font-size: 13px;
    color: var(--gray-800, #1e293b);
    font-weight: 500;
    line-height: 1.4;
}

/* ---------- 窄屏：单列 ---------- */
@media (max-width: 768px) {
    .contact-grid-two { grid-template-columns: 1fr; }
    .contact-info-wrap .coop-cards { flex-direction: column; }
    .contact-info-wrap .zc-contact-list {
        grid-template-columns: 56px 1fr;
    }
    .contact-info-wrap .zc-info-wechat-col {
        grid-column: 1 / -1;
        grid-row: auto;
        border-top: 1px solid var(--gray-100, #eef2f7);
        padding: 16px 0 0 0;
        flex-direction: row;
        justify-content: flex-start;
        gap: 20px;
    }
    .contact-info-wrap .zc-wechat-qr-wrap { flex: 0 0 auto; }
    .contact-info-wrap .zc-wechat-qr-img { max-width: 120px; }
    .contact-info-wrap .zc-worktime-row { flex: 0 0 auto; }
}