.project {
    max-width: 1200px;
    margin: 0 auto;
  }
  
  .project header {
    margin-bottom: 2rem;
  }
  
  .project-content {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 2rem;
  }
  
  .description {
    grid-column: 1;
  }
  
  .meta {
    grid-column: 2;
  }
  
  .img-landscape {
    width: 100%;
  }
  
  .img-portrait {
    width: 70%;
    margin: 0 auto;
  }

  article.project {
    margin-bottom: 5em;
  }

  article.project a {
    color:#666;
  }

  article.project .project-title {
    margin-top: 3em;
  }

  .field--name-field-project-description {
    max-width: 600px;
    padding: 3em 1em;
  }

/* Flexbox */
/* .gallery {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }
  
  .gallery-item {
    width: 50%;
    padding: 5px;
    box-sizing: border-box;
    min-height: 200px;
  }
  
  .gallery-item.landscape {
    width: 100%;
  }
  
  .gallery-item img {
    width: 100%;
    height: auto;
    display: block;
  }
  
  .gallery-item.portrait + .gallery-item.portrait {
    margin-left: 0;
  }
  
  @media screen and (min-width: 768px) {
    .gallery {
      position: relative;
      justify-content: space-between;
    }
    
    .gallery-item {
      width: 40%;
      min-height: 400px;
    }
    
    
    .gallery-item.portrait + .gallery-item.portrait {
      margin-right: 0;
    }
    
    .gallery-item.landscape {
      width: 60%;
    }
  } */



/* Grid */
.gallery {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 1em;
    width: 100%;
  }
  
  .gallery-item {
    grid-column: span 1;
  }
  
  .gallery-item.landscape {
    grid-column: span 2;
  }
  
  .gallery-item img {
    width: 100%;
    height: auto;
    display: block;
    min-height: 200px;
  }
  
/*  @media screen and (min-width: 768px) {
    .gallery {
      grid-template-columns: repeat(10, 1fr);
      grid-gap: 2em;
    }
    
    .gallery-item.portrait {
      grid-column: span 4;
    }
    
    .gallery-item.landscape {
      grid-column: span 6;
    }

    .gallery-item.landscape:nth-of-type(odd) + .gallery-item.landscape:nth-of-type(even) + .gallery-item.landscape:nth-of-type(odd) {
        grid-column: span 4;
    }

    .gallery-item.landscape + .gallery-item.landscape + .gallery-item.landscape + .gallery-item.landscape {
        grid-column: span 6;
    }
    
    .gallery-item.landscape + .gallery-item.portrait {
      grid-column-end: 11;
      justify-items: flex-end;
    }

    .gallery-item.portrait + .gallery-item.portrait {
        justify-items: flex-end;
    }

    .gallery-item.portrait + .gallery-item.portrait, .gallery-item.portrait:has(+ .gallery-item.portrait) {
        grid-column: span 5;
        overflow: hidden;
    }

    .gallery-item.portrait + .gallery-item.portrait, .gallery-item.portrait:has(+ .gallery-item.portrait) img {
        object-fit: cover;
        max-height: 460px;
    }
    
    .gallery-item.portrait:nth-of-type(odd) + .gallery-item.portrait:nth-of-type(even) + .gallery-item.portrait:nth-of-type(odd) {
        grid-column: span 5;
        max-height: none;
    }

    .gallery-item.portrait:nth-of-type(odd) + .gallery-item.portrait:nth-of-type(even) + .gallery-item.portrait:nth-of-type(odd) img {
        max-height: none;
    }
    

    .gallery-item img {
            min-height: 200px;
      width: 100%;
      object-fit: cover;
    }
    
    .gallery-item:first-child img {
        max-height: none!important;
    }

    .gallery-item.portrait img {
      min-height: 420px;
      width: auto;
      max-width: 100%;
    }
  }
*/
  @media screen and (min-width: 1023px) {

    .project-breadcrumbs {
        font-size: 2rem;
        margin-top: 1em;
    }
    
    .project-title {
        font-size: 3em;
    }

  }

.path-node .nav a._active, .path-projects .nav a._active {
    color: inherit;
}


/* Flexbox Projects list */
.projects-grid .view-content {
    position: relative;
    padding-top: 0;
    margin-top: 48px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 48px 24px; /* 48px по вертикали, 24px по горизонтали */
}

/* @media (max-width: 960px) {
    .projects-grid .view-content {
        padding-top: calc(1.875rem + 24px);
    }
} */

.projects-grid .view-content img {
    max-width: 100%;
    height: auto;
    aspect-ratio: 3 / 4;
        width: 100%;
        height: auto; 
        object-fit: cover;
}

.projects-grid .view-content .count {
    position: absolute;
    top: 0;
    left: 0;
    color: #000000;
    line-height: 1.375;
    font-size: 0.875rem;
}

@media (min-width: 961px) {
    .projects-grid .view-content .count {
        width: calc((100% - 24px * 2) / 12 * 4);
    }
}

.projects-grid .view-content  ._p._p4 {
    line-height: 1.33;
    padding-top: 1em;
}

.projects-grid .view-content > .project-item {
    width: calc(25% - 18px); /* 4 items in a row, with gaps */
}

@media (max-width: 960px) {
    .projects-grid .view-content > .project-item {
        width: calc(33%); 
    }
}

@media (max-width: 640px) {
    .projects-grid .view-content > .project-item {
        width: calc((100% - 24px) * 0.5);
    }
}

.projects-grid .view-content > .project-item .picture {
    display: none;
}

.projects-grid .view-content > .project-item .picture.portrait {
    display: block;
}

/*@media (min-width: 1321px) {
    .projects-grid .view-content > .project-item:nth-of-type(15n+5),
    .projects-grid .view-content > .project-item:nth-of-type(15n+13),
    .projects-grid .view-content > .project-item:nth-of-type(15n+14) {
        width: calc((100% - 24px * 2) / 12 * 8);
    }
}

@media (max-width: 960px) {
    .projects-grid .view-content > .project-item:nth-of-type(3n) {
        width: calc(66% - 18px);
    }
}

@media (max-width: 640px) {
    .projects-grid .view-content > .project-item:nth-of-type(3n),
    .projects-grid .view-content > .project-item:nth-of-type(15n+5),
    .projects-grid .view-content > .project-item:nth-of-type(15n+13),
    .projects-grid .view-content > .project-item:nth-of-type(15n+14) {
        width: 100%;
    }
}

.projects-grid .view-content > .project-item .picture.landscape {
    display: block;
}

@media (min-width: 961px) {
    .projects-grid .view-content > .project-item:nth-of-type(15n+21),
    .projects-grid .view-content > .project-item:nth-of-type(15n+5),
    .projects-grid .view-content > .project-item:nth-of-type(15n+8),
    .projects-grid .view-content > .project-item:nth-of-type(15n+13),
    .projects-grid .view-content > .project-item:nth-of-type(15n+15) {
        margin-left: calc(50% + 12px);
        width: calc(100%);
    }


    .projects-grid .view-content > .project-item:nth-of-type(15n+21) img,
    .projects-grid .view-content > .project-item:nth-of-type(15n+5) img,
    .projects-grid .view-content > .project-item:nth-of-type(15n+8) img,
    .projects-grid .view-content > .project-item:nth-of-type(15n+13) img,
    .projects-grid .view-content > .project-item:nth-of-type(15n+15) img {
        aspect-ratio: 4 / 3;
        width: 100%;
        height: auto; /* или можно явно задать height, если надо */
        object-fit: cover;
    }
}

@media (max-width: 960px) and (min-width: 641px) {
    .projects-grid .view-content > .project-item:nth-of-type(15n+21),
    .projects-grid .view-content > .project-item:nth-of-type(15n+5),
    .projects-grid .view-content > .project-item:nth-of-type(15n+8),
    .projects-grid .view-content > .project-item:nth-of-type(15n+9),
    .projects-grid .view-content > .project-item:nth-of-type(15n+13),
    .projects-grid .view-content > .project-item:nth-of-type(15n+15) {
        margin-left: 232.5px;
    }
}
*/


/* Grid Projects List */
/* 
.projects-grid .view-content {
    position: relative;
    padding-top: 0;
    margin-top: 48px;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-gap: 48px 24px;
}

@media (max-width: 960px) {
    .projects-grid .view-content {
        padding-top: calc(1.875rem + 24px);
    }
}

.projects-grid .view-content img {
    max-width: 100%;
    height: auto;
}

.projects-grid .view-content .count {
    position: absolute;
    top: 0;
    left: 0;
    color: #000000;
    line-height: 1.375;
    font-size: 0.875rem;
}

@media (min-width: 961px) {
    .projects-grid .view-content .count {
        grid-column: span 4;
    }
}

.projects-grid .view-content .count::before {
    content: 'Showing' ' ' attr(data-count-filter) ' ' 'of' ' ' attr(data-count-total) '\a' 'available projects';
    white-space: pre;
}

.projects-grid .view-content > .project-item {
    grid-column: span 4;
}

@media (max-width: 960px) {
    .projects-grid .view-content > .project-item {
        grid-column: span 4;
    }
}

@media (max-width: 640px) {
    .projects-grid .view-content > .project-item {
        grid-column: span 6;
    }
}

.projects-grid .view-content > .project-item .picture {
    display: none;
}

.projects-grid .view-content > .project-item .picture.portrait {
    display: block;
}

@media (min-width: 1321px) {
    .projects-grid .view-content > .project-item:nth-of-type(15n+5),
    .projects-grid .view-content > .project-item:nth-of-type(15n+13),
    .projects-grid .view-content > .project-item:nth-of-type(15n+14) {
        grid-column: span 8;
    }
}

@media (max-width: 960px) {
    .projects-grid .view-content > .project-item:nth-of-type(3n) {
        grid-column: span 6;
    }
}

@media (max-width: 640px) {
    .projects-grid .view-content > .project-item:nth-of-type(3n),
    .projects-grid .view-content > .project-item:nth-of-type(15n+5),
    .projects-grid .view-content > .project-item:nth-of-type(15n+13),
    .projects-grid .view-content > .project-item:nth-of-type(15n+14) {
        grid-column: span 12;
    }
}

.projects-grid .view-content > .project-item .picture.landscape {
    display: block;
}

@media (min-width: 961px) {
    .projects-grid .view-content > .project-item:nth-of-type(15n+1),
    .projects-grid .view-content > .project-item:nth-of-type(15n+5),
    .projects-grid .view-content > .project-item:nth-of-type(15n+8),
    .projects-grid .view-content > .project-item:nth-of-type(15n+9),
    .projects-grid .view-content > .project-item:nth-of-type(15n+13),
    .projects-grid .view-content > .project-item:nth-of-type(15n+15) {
        grid-column: span 4;
    }
}

@media (max-width: 960px) and (min-width: 641px) {
    .projects-grid .view-content > .project-item:nth-of-type(15n+1),
    .projects-grid .view-content > .project-item:nth-of-type(15n+5),
    .projects-grid .view-content > .project-item:nth-of-type(15n+8),
    .projects-grid .view-content > .project-item:nth-of-type(15n+9),
    .projects-grid .view-content > .project-item:nth-of-type(15n+13),
    .projects-grid .view-content > .project-item:nth-of-type(15n+15) {
        grid-column: span 6;
    }
} */