/* 全局图片重置 - 添加在最前面 */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* 1. 网格容器 - 改为单列布局，一行一个 */
.grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 修改这里：定义两列 */
    gap: 1.5rem; /* 可以适当增加间距，使布局更舒适 */
    padding: 1rem;
    max-width: 1200px;
    margin: 0 auto;
}
/* 卡片样式 - 保持水平布局 */
.card {
    background: white;
    padding: 1.5rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 
                0 2px 4px -1px rgba(0, 0, 0, 0.06);
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    transition: all 0.3s ease;
    border: 1px solid #e5e7eb;
    /* 宽度现在由网格容器控制，无需设置100% */
    height: 100%; /* 建议添加，使同一行卡片高度一致 */
}

.card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px -5px rgba(0, 0, 0, 0.1), 
                0 6px 8px -2px rgba(0, 0, 0, 0.04);
    border-color: rgba(99, 102, 241, 0.3);
}

/* 3. 图标容器 */
.card-icon {
    flex-shrink: 0;
    margin-right: 1.5rem;
    
    width: 60px;
    height: 60px;
    
    aspect-ratio: 1/1;
    
    background-color: rgba(99, 102, 241, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.card-icon img {
    width: 60% !important;
    height: 60% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain;
    object-position: center;
}

/* 4. 内容区域 */
.card-content {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.card-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #111827;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.card-summary {
    color: #6b7280;
    margin-bottom: 0.75rem;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 0.875rem;
}

.card-link {
    color: #4f46e5;
    font-weight: 500;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    transition: color 0.2s ease;
    font-size: 0.875rem;
    margin-top: auto;
    align-self: flex-start;
}

.card-link:hover {
    color: #3730a3;
}

/* ================== 响应式设计 ================== */

/* 超小屏幕（手机）: < 480px */
@media (max-width: 479px) {
    .grid-container {
        gap: 0.75rem;
        padding: 0.75rem;
    }
    
    .card {
        padding: 1.25rem;
        flex-direction: row; /* 保持水平布局 */
        align-items: center; /* 居中对齐 */
    }
    
    .card-icon {
        width: 48px;
        height: 48px;
        margin-right: 1rem;
    }
    
    .card-icon img {
        width: 55% !important;
        height: 55% !important;
    }
    
    .card-title {
        font-size: 1.125rem;
    }
    
    .card-summary {
        font-size: 0.8125rem;
        -webkit-line-clamp: 2;
    }
}

/* 小屏幕（手机）: 480px - 639px */
@media (min-width: 480px) and (max-width: 639px) {
    .grid-container {
        gap: 1rem;
        padding: 1rem;
    }
    
    .card {
        padding: 1.5rem;
        align-items: flex-start;
    }
    
    .card-icon {
        width: 52px;
        height: 52px;
        margin-right: 1.25rem;
    }
    
    .card-icon img {
        width: 60% !important;
        height: 60% !important;
    }
    
    .card-title {
        font-size: 1.125rem;
    }
    
    .card-summary {
        font-size: 0.875rem;
        -webkit-line-clamp: 2;
    }
}

/* 中等屏幕（平板）: 640px - 767px */
@media (min-width: 640px) and (max-width: 767px) {
    .grid-container {
        gap: 1.25rem;
        padding: 1.25rem;
    }
    
    .card {
        padding: 1.75rem;
    }
    
    .card-icon {
        width: 56px;
        height: 56px;
        margin-right: 1.5rem;
    }
    
    .card-title {
        font-size: 1.25rem;
    }
    
    .card-summary {
        font-size: 0.875rem;
        -webkit-line-clamp: 3;
    }
}

/* 大屏幕（桌面）: 768px - 1023px */
@media (min-width: 768px) and (max-width: 1023px) {
    .grid-container {
        gap: 1.5rem;
        padding: 1.5rem;
    }
    
    .card {
        padding: 2rem;
    }
    
    .card-icon {
        width: 64px;
        height: 64px;
        margin-right: 1.75rem;
    }
    
    .card-icon img {
        width: 60% !important;
        height: 60% !important;
    }
    
    .card-title {
        font-size: 1.25rem;
    }
    
    .card-summary {
        font-size: 0.875rem;
        -webkit-line-clamp: 3;
    }
}

/* 超大屏幕: 1024px 及以上 */
@media (min-width: 1024px) {
    .grid-container {
        gap: 1.75rem;
        padding: 1.75rem;
    }
    
    .card {
        padding: 2.25rem;
    }
    
    .card-icon {
        width: 72px;
        height: 72px;
        margin-right: 2rem;
    }
    
    .card-icon img {
        width: 60% !important;
        height: 60% !important;
    }
    
    .card-title {
        font-size: 1.5rem; /* 大屏幕增大标题 */
    }
    
    .card-summary {
        font-size: 1rem; /* 大屏幕增大摘要字号 */
        -webkit-line-clamp: 3;
    }
    
    .card-link {
        font-size: 1rem;
    }
}

/* 特大屏幕: 1280px 及以上 */
@media (min-width: 1280px) {
    .grid-container {
        max-width: 1400px;
    }
    
    .card {
        padding: 2.5rem;
    }
    
    .card-icon {
        width: 80px;
        height: 80px;
        margin-right: 2.5rem;
    }
}

/* 可选：垂直居中布局 */
.card.align-center {
    align-items: center;
}

/* 如果希望图标垂直居中 */
.card.align-center .card-icon {
    align-self: center;
    margin-top: 0;
}

/* 如果希望内容垂直居中 */
.card.align-center .card-content {
    justify-content: center;
}

/* 触摸设备优化 */
@media (hover: none) and (pointer: coarse) {
    .card:hover {
        transform: none;
    }
    
    .card-link {
        min-height: 44px;
        padding: 8px 0;
    }
}

/* 打印优化 */
@media print {
    .card {
        box-shadow: none;
        border: 1px solid #ddd;
        break-inside: avoid;
    }
    
    .card-icon {
        background-color: #f0f0f0 !important;
    }
    
}
.faqbody{min-height: 66vh;}
.faqdiv {

     background-color: #ffffff;
      /* 圆角（圆弧角度）：数值越大越圆，50%则为圆形（需宽高相等） */
      border-radius: 12px; 
      /* 阴影效果：水平偏移 垂直偏移 模糊半径 扩散半径 阴影颜色（rgba最后一位是透明度） */
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
      /* 可选：内边距，避免内容贴边 */
      padding: 20px;
      /* 可选：居中显示（方便预览） */
      margin: 30px auto;
    }
    .homeimg{
 
   width: 100%;
  height: 100%;
  background-image: url('/images/banner2.png');
  background-size: contain; /* 或 'cover' 如果要填充但会裁剪 */
  background-position: center;
  background-repeat: no-repeat;
  background-color: #f0f0f0; /* 填充空白区域 */

    }.homeimg img {
  display: none; /* 隐藏img标签，仅用于SEO */
}