.photo-gallery {
    display: grid;
    grid-template-columns: repeat(3, 171px); /* 3 колонки по 178px */
    grid-template-rows: repeat(3, 171px); /* 3 ряда по 178px */
    gap: 1px; /* расстояние между изображениями */
    justify-items: center; /* центрирование изображений по горизонтали */
}
.photo-gallery .image-container {
    width: 171px; /* фиксированная ширина */
    height: 171px; /* фиксированная высота */
    background-size: cover; /* сохраняет пропорции фона */
    background-position: center; /* центрирование фона */
    cursor: pointer; /* курсор указывает, что элемент кликабельный */
    transition: transform 0.3s ease, filter 0.3s ease, box-shadow 0.3s ease; /* Плавный переход для трансформации и фильтров */
    overflow: hidden; /* Скрыть лишнюю часть изображения */
    filter: blur(0.5px); /* Применяем фильтры для улучшения изображения с размытие */
    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5); /* Внутренняя тень */
}
.photo-gallery .image-container:hover {
    transform: scale(1.15) rotate(5deg); /* Увеличение и поворот на 5 градусов */
    filter: blur(0px); /* Убираем размытие при наведении */
    box-shadow: none; /* Убираем внутреннюю тень при наведении */
}
.photo-gallery img {
    //width: 517px; /* фиксированная ширина */
    //height: 517px; /* фиксированная высота */
    object-fit: cover; /* сохраняет пропорции и обрезает изображение, если оно не вписывается */
    border-radius: 0px; /* скругление углов */
    cursor: pointer; /* курсор указывает, что элемент кликабельный */
    transition: transform 0.3s ease; /* Плавный переход */
}
.photo-gallery img:hover {
    transform: scale(1.05) rotate(5deg); /* Увеличение и поворот на 5 градусов */
}