.gallery{
  padding: 40px 0 100px;
}

.gallery-wrap{
  max-width: 760px;
  margin: 0 auto;
}

.gallery-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.gallery-item{
  position: relative;
  aspect-ratio: 1 / 1;
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid var(--glass-border);
  background: var(--navy-900);
  box-shadow: 0 14px 34px rgba(7,25,24,.16);
}

.gallery-item:first-child{
  grid-column: span 2;
  grid-row: span 2;
  aspect-ratio: auto;
}

.gallery-item img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s var(--ease);
}

.gallery-item:hover img{ transform: scale(1.08); }

.gallery-item::after{
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(42,32,19,.45) 100%);
  opacity: 0;
  transition: opacity .4s var(--ease);
}
.gallery-item:hover::after{ opacity: 1; }

@media (max-width: 620px){
  .gallery-grid{ grid-template-columns: repeat(2, 1fr); }
  .gallery-item:first-child{ grid-column: span 2; grid-row: span 1; aspect-ratio: 16/10; }
}