.card--content-wide {
  overflow: visible;
  padding: 14px;
}

.gallery-page {
  position: relative;
  z-index: 1;
}

.gallery-page p {
  color: var(--text);
  font-size: 0.95rem;
  line-height: 1.75;
  margin: 0;
}

.gallery-lead {
  max-width: 62ch;
  margin: 0 0 18px;
  color: var(--summary);
}

.gallery-masonry {
  column-count: 3;
  column-gap: 10px;
}

.gallery-card {
  position: relative;
  display: inline-block;
  width: 100%;
  min-width: 0;
  margin: 0 0 10px;
  padding: 14px;
  break-inside: avoid;
  border: 1px solid rgba(232, 222, 204, 0.13);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.02);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
  vertical-align: top;
}

.gallery-card--simple {
  background:
    linear-gradient(to bottom, rgba(255, 255, 255, 0.035), transparent 64%),
    rgba(38, 35, 31, 0.96);
}

.gallery-card--texture {
  background:
    repeating-linear-gradient(
      135deg,
      rgba(232, 222, 204, 0.035) 0 2px,
      transparent 2px 8px
    ),
    linear-gradient(to bottom, rgba(143, 168, 120, 0.08), rgba(199, 162, 74, 0.035)),
    rgba(45, 41, 36, 0.98);
}

.gallery-card--text {
  padding: 18px;
}

.gallery-card--compact {
  min-height: 132px;
}

.gallery-card--roomy {
  min-height: 238px;
  padding: 24px 20px;
}

.gallery-card--tall {
  min-height: 300px;
  padding-bottom: 48px;
}

.gallery-card--wide-simple {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, 0.42fr);
  gap: 16px;
  align-items: center;
  margin: 4px 0 20px;
  padding: 16px;
  overflow: hidden;
}

.gallery-card--wide-simple::before {
  content: "";
  position: absolute;
  inset: 8px;
  pointer-events: none;
  border: 1px dashed rgba(232, 222, 204, 0.10);
  border-radius: 9px;
}

.gallery-wide-main,
.gallery-wide-media {
  position: relative;
  z-index: 1;
}

.gallery-wide-label {
  margin-bottom: 6px;
  color: var(--accent-yellow);
  font-family: var(--pixel-font);
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: lowercase;
}

.gallery-wide-media {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(232, 222, 204, 0.10);
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.12);
}

.gallery-wide-media img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
  padding: 5px;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.025);
}

.gallery-card--bar {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  margin: 4px 0 20px;
  padding: 10px 16px;
  border-style: dashed;
  border-color: rgba(199, 162, 74, 0.34);
  background:
    repeating-linear-gradient(
      90deg,
      rgba(199, 162, 74, 0.10) 0 8px,
      rgba(143, 168, 120, 0.08) 8px 16px
    ),
    rgba(0, 0, 0, 0.12);
}

.gallery-card--bar span {
  font-family: var(--pixel-font);
  font-size: 0.82rem;
  letter-spacing: 0.08em;
  color: #fff7e7;
  text-transform: lowercase;
}

.gallery-card figure {
  margin: 0;
}

.gallery-image {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid rgba(232, 222, 204, 0.12);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.14);
}

.gallery-image--small {
  width: min(100%, 120px);
  margin-inline: auto;
}

.gallery-image--pixel,
.gallery-tile-grid img {
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}

.gallery-card figcaption,
.gallery-caption {
  margin-top: 8px;
  color: var(--muted-full);
  font-size: 0.76rem;
  line-height: 1.55;
}

.gallery-card--mixed p,
.gallery-card--tiles p {
  margin-top: 12px;
}

.gallery-link-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  margin-top: 12px;
  padding: 5px 11px;
  border: 1px solid rgba(199, 162, 74, 0.42);
  border-radius: 999px;
  color: #f0d9a1;
  background: rgba(199, 162, 74, 0.08);
  font-family: var(--pixel-font);
  font-size: 0.76rem;
  letter-spacing: 0.05em;
}

.gallery-link-pill:hover {
  background: rgba(199, 162, 74, 0.16);
}

.gallery-tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(54px, 1fr));
  gap: 8px;
  padding: 8px;
  border: 1px solid rgba(232, 222, 204, 0.10);
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.12);
}

.gallery-tile-grid img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
  padding: 5px;
  border: 1px solid rgba(232, 222, 204, 0.09);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.025);
}

.gallery-sticker {
  position: absolute;
  z-index: 2;
  width: 52px;
  height: auto;
  pointer-events: none;
  filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.34));
}

.gallery-sticker--top-right {
  top: -7px;
  right: 10px;
  transform: rotate(7deg);
}

.gallery-sticker--bottom-left {
  bottom: 10px;
  left: 12px;
  transform: rotate(-6deg);
}

@media (max-width: 700px) {
  .gallery-masonry {
    column-count: 2;
    column-gap: 10px;
  }

  .gallery-card--wide-simple {
    grid-template-columns: 1fr;
  }

  .gallery-wide-media {
    max-width: 260px;
  }

  .gallery-card--roomy,
  .gallery-card--tall {
    min-height: 0;
  }
}

@media (max-width: 560px) {
  .gallery-masonry {
    columns: 1;
  }

  .gallery-card {
    margin-bottom: 10px;
  }
}
