/* WJAZ V61: larger artwork set into the page, with a quiet recessed edge. */
.about-page .about-story-section > .container {
  width: min(calc(100% - 48px), 1560px);
}
.about-page .about-story-section .story {
  grid-template-columns: minmax(280px, .66fr) minmax(0, 1.34fr);
  gap: clamp(28px, 3vw, 48px);
  align-items: center;
}
.about-page .story-panel.wjaz-about-inset {
  width: 100%;
  min-width: 0;
  min-height: 0;
  aspect-ratio: 4 / 3;
  margin: 0;
  padding: 0;
  align-self: center;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(105, 80, 58, .28);
  border-radius: clamp(16px, 1.5vw, 22px);
  background: #eee2d3;
  /* A fine lower bevel; depth comes from the inner shadows below. */
  box-shadow: 0 1px 0 rgba(255, 255, 255, .92);
  transform: none;
  transition: none;
}
.about-page .wjaz-about-inset .about-kafd-image,
.about-page .wjaz-about-inset:hover .about-kafd-image {
  display: block;
  width: 100%;
  height: auto;
  min-height: 0;
  max-width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  object-position: center;
  margin: 0;
  padding: 0;
  filter: none;
  transform: none;
  transition: none;
  border-radius: inherit;
}
.about-page .story-panel.wjaz-about-inset::before,
.about-page .story-panel.wjaz-about-inset::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  background: none;
  pointer-events: none;
}
.about-page .story-panel.wjaz-about-inset::before {
  box-shadow: inset 0 2px 4px rgba(43, 32, 23, .2),
              inset 2px 0 4px rgba(43, 32, 23, .1),
              inset 0 -1px 0 rgba(255, 255, 255, .6);
}
.about-page .story-panel.wjaz-about-inset::after {
  /* Shadow stays at the edge; the lettering and skyline remain clear. */
  box-shadow: inset 0 18px 24px -17px rgba(43, 32, 23, .52),
              inset 14px 0 22px -17px rgba(43, 32, 23, .3),
              inset -7px 0 16px -14px rgba(43, 32, 23, .15);
}
.about-artwork-caption {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 900px) {
  .about-page .about-story-section > .container {
    width: calc(100% - 32px);
  }
  .about-page .about-story-section .story {
    grid-template-columns: minmax(0, 1fr);
    gap: 30px;
  }
  .about-page .story-panel.wjaz-about-inset { order: -1; }
}
