/*
 * Pig - vertical scroll, triptych rows for portraits
 * Dark blood red background
 */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background: #2a0a0a;
  min-height: 100vh;
  padding: 4rem 0;
}

.gallery {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  max-width: 1200px;
  margin: 0 auto;
}

/* Single landscape row */
.row {
  width: 70%;
}

.row img {
  width: 100%;
  height: auto;
  display: block;
}

/* Triptych row: landscape | portrait | landscape */
.row.triptych {
  width: 90%;
  display: flex;
  gap: 3px;
  align-items: center;
}

.row.triptych img {
  height: 100%;
  width: auto;
  flex: 1;
  object-fit: contain;
}

.row.triptych img.portrait {
  flex: 0 0 auto;
  height: 400px;
}

.row.triptych img.landscape {
  flex: 1;
  max-height: 400px;
  object-fit: cover;
}

/* Solo portrait - smaller, centered */
.row.portrait-solo {
  width: 35%;
}

.row.portrait-solo img {
  width: 100%;
  height: auto;
}

@media (max-width: 768px) {
  .row {
    width: 95%;
  }

  .row.triptych {
    width: 100%;
    flex-direction: column;
  }

  .row.triptych img.portrait,
  .row.triptych img.landscape {
    width: 100%;
    height: auto;
    max-height: none;
  }
}
