/* Override intrinsic HTML image heights while retaining each chapter's crop. */
.journal-feature img,
.editorial-card img,
.article-cover img {
  display: block;
  height: auto;
}

/* Smaller landscape postcards, with the original tilt and gentle parallax. */
.journal-wall .story-wall {
  max-width: 1260px;
  margin-inline: auto;
  min-height: 0;
  gap: clamp(22px, 3vw, 42px);
  padding: 65px 6px 42px;
}
.journal-wall .wall-story {
  min-width: 0;
  transform: translateY(clamp(-28px, var(--wall-drift, 0px), 28px)) rotate(var(--wall-angle, 0deg));
}
.journal-wall .wall-story-one { margin-top: 5px; }
.journal-wall .wall-story-two { margin-top: 55px; }
.journal-wall .wall-story-three { margin-top: 25px; }
.journal-wall .wall-photo {
  position: relative;
  aspect-ratio: 4 / 3;
  border-width: 8px;
}
.journal-wall .wall-photo img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
}
.journal-wall .wall-copy { padding: 22px 10px 12px; }
.journal-wall .wall-copy h3 {
  font-size: clamp(1.8rem, 2.3vw, 2.65rem);
  line-height: 1.15;
  margin: 14px 0 20px;
}
.journal-wall .story-wall[hidden],
.journal-wall .wall-story[hidden] { display: none; }

/* Reserve each photo's shape while the gallery loads it, including in columns. */
.gallery-tile[data-photo-state]:not([data-photo-state="ready"]) {
  aspect-ratio: var(--photo-aspect, 4 / 3);
  background: rgba(184, 151, 98, .08);
}
.gallery-tile[data-photo-state] img { display: block; }
.gallery-tile[data-photo-state]:not([data-photo-state="ready"]) img { opacity: 0; }
.gallery-tile > .gallery-photo-state {
  display: grid;
  place-items: center;
  inset: 0;
  padding: 18px;
  background: transparent;
  color: #ceb995;
  opacity: 1;
  line-height: 1.6;
  text-align: center;
}
.gallery-tile > .gallery-photo-state[hidden] { display: none; }
.gallery-tile[data-photo-state="unavailable"] { outline: 1px solid #8c704e77; outline-offset: -1px; }

@media (max-width: 750px) {
  .journal-wall .story-wall {
    max-width: none;
    margin: 0 -24px;
    padding: 40px 24px 35px;
    gap: 24px;
  }
  .journal-wall .wall-story {
    flex: 0 0 min(80vw, 360px);
    margin-top: 0;
    transform: rotate(var(--wall-angle, 0deg));
  }
  .journal-wall .wall-photo { border-width: 6px; }
  .journal-wall .wall-copy { padding: 20px 6px 10px; }
  .journal-wall .wall-copy h3 { font-size: 2rem; }
}
