/* 完全保留原样式 */
.container1 { display: flex; width: 100%; min-height: 400px; position: relative; }
.text-area { width: 40%; display: flex; flex-direction: column; }
.text-area .text { display: none; max-width: 90%; }
.text-area .text.active { display: block; animation: fadeIn 0.5s ease; }
.text-area h3 { font-size: 60px; font-weight: 600; margin-bottom: 15px; color: #fff; }
.text-area p { font-size: 16px; line-height: 1.6; color: #fff; }
@keyframes fadeIn { from {opacity:0; transform:translateY(10px);} to {opacity:1; transform:translateY(0);} }

.image-grid { width: 60%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.image-grid .image { cursor: pointer; border: 2px solid transparent; transition: border 0.3s; }
.image-grid .image img { aspect-ratio: 1 / 1; width: 100%; height: 100%; object-fit: cover; border-radius: 5px; }
.image-grid .image.active { border: 2px solid #0073e6; border-radius: 6px; }

@media (max-width:900px){ .image-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width:768px){ .container1{ flex-direction: column; } .text-area{ width:100%; } .image-grid{ width:100%; grid-template-columns: repeat(3,1fr); margin-top:30px; } }