.image-grid { 
	display: grid; 
	grid-template-columns: repeat(3, 1fr);  /* --- 将容器宽度分为 3 等份，创建 3 列等宽的网格 --- */
	gap: 1rem;
	margin-top: 30px; /* 整个网格距离上方30px */
}
    .image-card {
		display: flex;  /* --- 启用弹性盒布局 --- */
		flex-direction: column;  /* --- 设置弹性项目垂直排列（从上到下） --- */
		align-items: center;
		padding: 15px;
        cursor: pointer; /* --- 当鼠标悬停时，将光标样式设置为手型（表示可点击）--- */
}
    .image-card .card-inner { 
		position: relative;  /* ---设置该元素为相对定位，作为其绝对定位子元素的参照。--- */
		 /* ---width: 100%;
		height: 120px;--- */
		border-radius: 0.5rem;  /* ---将元素的边框圆角设置为 0.5rem--- */
        overflow: hidden;   /* ---隐藏超出元素边界的内容  --- */
		box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);     /* ---为卡片添加一个细微的阴影，增强层次感。  --- */
}

    .image-card img { width: 100%; height: 100%; object-fit: cover; display: block;align-items: center}

.image-card a {
  text-decoration: none;
}