﻿/* semantic-styles.css  —  已对齐 HP 商城设计 token (--hp-*) 并替换硬编码 rem 间距 */

.case-card {
    border: 1px solid var(--hp-border-light);
    display: flex;
    flex-direction: column;
    height: 100%;
}
/* 🟠 重度修复：标杆项目案例图比例统一 4/3（实测 2.98 / 1.33 / 1.66 严重不一） */
.case-card .case-image {
    margin: 0;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--hp-bg-image-placeholder);
    background-size: 200% 100%;
    border-radius: var(--hp-radius-lg) var(--hp-radius-lg) 0 0;
    flex-shrink: 0;
}
.case-card .case-content {
    padding: var(--hp-space-8);
    flex: 1;
}
.case-card .case-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}
.case-card:hover .case-image img { transform: scale(1.05); }
.case-btn-alt { margin-left: var(--hp-space-3); }

.article-card {
    border: 1px solid var(--hp-border-light);
    padding: var(--hp-space-8);
    position: relative;
    z-index: 1;
}
.article-card h4 {
    text-align: center;
    margin-bottom: var(--hp-space-6);
    position: relative;
    z-index: 2;
}
.article-card p {
    text-align: center;
    margin-bottom: var(--hp-space-6);
    position: relative;
    z-index: 2;
}
.article-card .article-meta {
    text-align: center;
    margin-bottom: var(--hp-space-6);
    position: relative;
    z-index: 2;
}
.article-card .text-center {
    text-align: center;
    position: relative;
    z-index: 2;
}

.industry-card {
    border: 1px solid var(--hp-border-light);
    padding: var(--hp-space-8);
}
.industry-card h4 {
    text-align: center;
    margin-bottom: var(--hp-space-4);
}
.industry-card p {
    text-align: center;
    margin-bottom: var(--hp-space-6);
}
.industry-card .text-center { text-align: center; }

.solutions-tabs {
    border: 1px solid var(--hp-border-light);
}
.solution-content {
    border: 1px solid var(--hp-border-light);
}

/* 移动端：卡边距收紧 */
@media (max-width: 768px) {
    .case-card .case-content { padding: var(--hp-space-6); }
    .article-card { padding: var(--hp-space-6); }
    .industry-card { padding: var(--hp-space-6); }
}

.new-solutions-card .card-header,
.new-services-card .card-header {
    display: flex;
    align-items: center;
    gap: var(--hp-space-3);
    border-bottom: 1px solid var(--hp-border-light);
    padding-bottom: var(--hp-space-4);
    margin-bottom: var(--hp-space-5);
}
.new-solutions-card .card-header i,
.new-services-card .card-header i {
    font-size: var(--hp-text-2xl);
}
