/* Responsive Content Grid */
.content-wrapper {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
}

.text-content {
    flex: 1;
    min-width: 300px;
}

.image-content {
    flex: 0 0 350px;
}

.about-image {
    width: 100%;
    border-radius: 15px;
    box-shadow: var(--shadow-soft);
    transition: transform 0.5s ease;
}

.about-image:hover {
    transform: scale(1.02);
}

@media (max-width: 768px) {
    .image-content { flex: 100%; text-align: center; }
}