/* Full family scan; identification is a presentation layer, never a pixel edit. */
body.story-edition .birth-layout--family-photo {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr);
  grid-template-rows: auto 1fr;
  column-gap: clamp(28px, 5vw, 68px);
  row-gap: 24px;
}
body.story-edition .birth-layout--family-photo > .birth-title {
  grid-column: 1;
  grid-row: 1;
  margin-bottom: 0;
}
body.story-edition .birth-layout--family-photo > .story-copy {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
}
body.story-edition .birth-layout--family-photo > .childhood-family-photo {
  grid-column: 2;
  grid-row: 1 / span 2;
}
.childhood-family-photo {
  min-width: 0;
  width: 100%;
  max-width: 590px;
  margin: 12px 0 0;
  justify-self: center;
}
.childhood-family-photo__plane {
  display: block;
  position: relative;
  isolation: isolate;
}
body.story-edition .childhood-family-photo__plane img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: contain;
  filter: none;
}
.childhood-family-photo__mark {
  position: absolute;
  left: 53.1%;
  top: 56.85%;
  width: 7.5%;
  height: 6.9%;
  border: 1px solid var(--red, #8b3029);
  border-radius: 42%;
  box-shadow: 0 0 0 1px #f4efe399;
  pointer-events: none;
}
.childhood-family-photo__mark::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 100%;
  width: clamp(9px, 1.7vw, 22px);
  height: 1px;
  background: var(--red, #8b3029);
  box-shadow: 0 1px #f4efe399;
}
.childhood-family-photo__name {
  position: absolute;
  left: calc(100% + clamp(9px, 1.7vw, 22px));
  top: 50%;
  transform: translateY(-50%);
  padding: 3px 6px;
  background: #f4efe3;
  color: var(--red, #8b3029);
  font: 500 clamp(10px, 1vw, 12px)/1.25 var(--sans, sans-serif);
  letter-spacing: .02em;
  white-space: nowrap;
}
body.story-edition .childhood-family-photo figcaption {
  font: 14px/1.65 var(--sans, sans-serif);
  margin-top: 14px;
  color: #50544a;
  text-wrap: pretty;
  max-width: 58ch;
}
@media (max-width: 800px) {
  body.story-edition .birth-layout--family-photo {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto;
    gap: 24px;
  }
  body.story-edition .birth-layout--family-photo > .birth-title,
  body.story-edition .birth-layout--family-photo > .story-copy,
  body.story-edition .birth-layout--family-photo > .childhood-family-photo {
    grid-column: 1;
    grid-row: auto;
  }
  .childhood-family-photo { margin-top: 4px; }
}
@media print {
  body.story-edition .birth-layout--family-photo { display: block; }
  .childhood-family-photo { max-width: 95mm; break-inside: avoid; }
  .childhood-family-photo__name { print-color-adjust: exact; }
}
