/* --------------------------------------------------------------------------
   7. СЕКЦИЯ ПРОЕКТЫ (#project)
   -------------------------------------------------------------------------- */
#project {
    background-color: #f8f8f8;
    padding-bottom:   100px;
}

/* Сетка карточек — 3 колонки */
.project__list {
    width:                 100%;
    display:               grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap:                   30px;
    margin-top:            20px;
    font-size:             12px;
}

/* Карточка проекта — фото-фон + контент снизу */
.project__list a {
    position:            relative;
    display:             flex;
    gap:                 10px;
    flex-direction:      column;
    justify-content:     flex-end;
    width:               100%;
    min-height:          650px;
    padding:             30px;
    border-radius:       12px;
    overflow:            hidden;
    color:               #fff;
    text-decoration:     none;
    background-size:     cover;
    background-position: center;
    background-repeat:   no-repeat;
    transition:          transform 0.35s ease, box-shadow 0.35s ease !important;
}

/* Ховер — карточка слегка приподнимается */
.project__list a:hover {
    transform:  translateY(-6px) !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.18) !important;
}

/* Фоновые изображения для каждой карточки */
.project__list li:nth-child(1) a { background-image: linear-gradient(to top, rgba(0,0,0,.15) 0%, rgba(255,255,255,0) 40%, #fff 100%), url('/assets/img/gazprom-arena.jpg'); }
.project__list li:nth-child(2) a { background-image: linear-gradient(to top, rgba(0,0,0,.15) 0%, rgba(255,255,255,0) 40%, #fff 100%), url('/assets/img/lahta-center.jpg'); }
.project__list li:nth-child(3) a { background-image: linear-gradient(to top, rgba(0,0,0,.15) 0%, rgba(255,255,255,0) 40%, #fff 100%), url('/assets/img/as-spb.jpg'); }
.project__list li:nth-child(4) a { background-image: linear-gradient(to top, rgba(0,0,0,.15) 0%, rgba(255,255,255,0) 40%, #fff 100%), url('/assets/img/as-nv.jpg'); }
.project__list li:nth-child(5) a { background-image: linear-gradient(to top, rgba(0,0,0,.15) 0%, rgba(255,255,255,0) 40%, #fff 100%), url('/assets/img/ostankino.jpg'); }
.project__list li:nth-child(6) a { background-image: linear-gradient(to top, rgba(0,0,0,.15) 0%, rgba(255,255,255,0) 40%, #fff 100%), url('/assets/img/km.jpg'); }

/* Заголовок карточки проекта */
.project__list h3 { font-size: 20px; font-weight: 500; }

/* Кнопка «Подробнее» внутри карточки */
.project__list a button {
    margin-top:    auto;
    width:         fit-content;
    padding:       8px 18px;
    border-radius: 10px;
    border:        none;
}
.project__list a button:hover { background-color: var(--accent); }

/* Кнопка «Смотреть другие работы» — во всю ширину */
.go-progect {
    background-color: var(--accent);
    color:            #111;
    padding:          16px 22px;
    border-radius:    10px;
    font-size:        16px;
    font-weight:      500;
    display:          flex;
    gap:              20px;
    margin-top:       50px;
    width:            100%;
    justify-content:  center;
}
.go-progect::after {
    content:          "";
    width:            25px;
    height:           20px;
    margin-top:       -2px;
    display:          inline-block;
    background-image: url('/assets/img/ico-top-right.svg');
    background-size:  cover;
}
.go-progect:hover { background-color: var(--accent-hover); }


@media (max-width: 900px) {
    .project__list   { grid-template-columns: 1fr; gap: 16px; }
    .project__list a { min-height: 500px; }
    #project {
        padding-bottom:   0px;
    }
}

@media (max-width: 560px) {
    
}