/* ============================================================
   关于我们 特有样式 (about.css)
   风格: 黑 / 白 / 深灰 高对比 · 摄影大图 + 黑色渐变遮罩
   ============================================================ */

/* ---------- 发现更多：双卡（联系我们 / 支持中心） ----------
   卡片采用摄影大图为底，底部叠加深色渐变遮罩，
   标题与按钮浮于遮罩之上，hover 时图片微放大增强质感。 */
.about-card {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    aspect-ratio: 17 / 11;          /* 还原设计稿 850×550 接近比例 */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}
.about-card__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
}
.about-card:hover .about-card__img { transform: scale(1.05); }
/* 底部黑色渐变遮罩，确保白字可读 */
.about-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .15) 0%, rgba(0, 0, 0, .65) 100%);
    pointer-events: none;
}
.about-card__body {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    padding: clamp(28px, 4vw, 50px);
    z-index: 1;
    text-align: center;
}

@media (max-width: 768px) {
    .about-card { aspect-ratio: 4 / 3; }
}