.grid-section {
    position: relative; background: #ffffff; z-index: 10;
    min-height: 100vh; width: 100%;
    /* КРИТИЧНО: Отступ сверху под меню */
    padding-top: 140px; 
    display: flex; flex-direction: column;
}

.masonry-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 25vw;
    background-color: #f0f0f0; gap: 1px; border-top: 1px solid #f0f0f0;
    flex-grow: 1; align-content: start;
}

.grid-item { position: relative; background: #fff; overflow: hidden; transition: opacity 0.4s; }
.grid-item.hide { display: none; }
.grid-item.small { grid-column: span 1; }
.grid-item.large { grid-column: span 2; }

.project-card { display: block; width: 100%; height: 100%; position: relative; text-decoration: none; }
.project-card img {
    width: 100%; height: 100%; object-fit: cover;
    filter: grayscale(100%) contrast(105%);
    transition: transform 1.2s cubic-bezier(0.19, 1, 0.22, 1), filter 0.5s ease;
}
.grid-item:hover img { transform: scale(1.04); filter: grayscale(0%) contrast(100%); }

.card-info {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 2.5vw;
    display: flex; flex-direction: column; justify-content: flex-end;
    background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 50%);
    opacity: 0; transition: opacity 0.5s ease;
}
.grid-item:hover .card-info { opacity: 1; }

.bottom-text { width: 100%; transform: translateY(15px); transition: transform 0.5s ease; }
.grid-item:hover .bottom-text { transform: translateY(0); }
.bottom-text h2 { font-family: 'Cormorant Garamond', serif; color: #fff; font-size: 2.2vw; font-style: italic; margin: 0; line-height: 1; }
.bottom-text p { font-family: 'Helvetica Neue', sans-serif; color: rgba(255,255,255,0.8); font-size: 0.8vw; text-transform: uppercase; letter-spacing: 1px; margin: 0; }