/* =============================================================
   PORTFOLIO.CSS
   -------------------------------------------------------------
   TODO: базовые стили для блока "portfolio" ещё не написаны.
   В blocks.css было только .portfolio-grid внутри @media (max-width: 900px)
   (переведено в responsive.css).
   Написать при наполнении портфолио:
   - .portfolio-grid (grid с auto-fit)
   - .portfolio-item / .portfolio-image / .portfolio-title
   ============================================================= */

   /* =============================================================
   PORTFOLIO.CSS
   Блок "Портфолио": сетка выполненных объектов.
   -------------------------------------------------------------
   Структура (предполагаемая, в editor.php):
     .portfolio-grid
       .portfolio-card
         .portfolio-image  (background-image или <img>)
         .portfolio-title
         .portfolio-desc   (опционально)
   Если в editor.php поля называются иначе — поправь селекторы.
   ============================================================= */


/* -------------------------------------------------------------
   СЕТКА ПОРТФОЛИО
   auto-fit + minmax: на десктопе 3 колонки, на планшете 2,
   на мобильном 1 (через responsive.css).
   ------------------------------------------------------------- */
.portfolio-grid {
    display               : grid;
    grid-template-columns : repeat(auto-fit, minmax(280px, 1fr));
    gap                   : 25px;
    margin                : 30px 0;
}


/* -------------------------------------------------------------
   КАРТОЧКА ОБЪЕКТА
   Тень + скругление + hover-подъём — единый стиль с услугами.
   ------------------------------------------------------------- */
.portfolio-card {
    background    : #fff;
    border        : 1px solid #eee;
    border-radius : 12px;
    overflow      : hidden;
    box-shadow    : 0 2px 8px rgba(0, 0, 0, 0.06);
    transition    : transform 0.25s ease, box-shadow 0.25s ease;
}

.portfolio-card:hover {
    transform  : translateY(-5px);
    box-shadow : 0 8px 20px rgba(0, 0, 0, 0.12);
}


/* -------------------------------------------------------------
   КАРТИНКА ОБЪЕКТА
   Как background-image — фиксированная высота, cover.
   Если в editor.php выводится <img> — стилизуй .portfolio-image img.
   ------------------------------------------------------------- */
.portfolio-image {
    height              : 220px;
    background-size     : cover;
    background-position : center;
    background-color    : #f0f0f0;
    display             : flex;
    align-items         : center;
    justify-content     : center;
    color               : #999;
    font-size           : 14px;
}


/* -------------------------------------------------------------
   ЗАГОЛОВОК ОБЪЕКТА
   ------------------------------------------------------------- */
.portfolio-title {
    font-size  : 18px;
    font-weight: bold;
    margin     : 15px 20px 8px;
    color      : #222;
}


/* -------------------------------------------------------------
   ОПИСАНИЕ / ПОДПИСЬ ПОД ЗАГОЛОВКОМ
   ------------------------------------------------------------- */
.portfolio-desc {
    font-size     : 14px;
    color         : #666;
    margin        : 0 20px 20px;
    line-height   : 1.5;
}