/* Item page: media left, main metadata (Title/Description/Identifier) right */
@media (min-width: 900px) {
  body.item.resource.show #content{
    display: grid;
    grid-template-columns: 55% 1fr;
    column-gap: 2rem;
    align-items: start;
  }

  /* Headings full width */
  body.item.resource.show #content > h2,
  body.item.resource.show #content > h3{
    grid-column: 1 / -1;
  }

  /* Image left */
  body.item.resource.show #content > .media-embeds{
    grid-column: 1;
  }

/* Rename the "Description" label to "Transcription" (visual only) */
body.item.resource.show #content > dl:not(.item-sets):not(.media-list)
  > .property:nth-of-type(2) > dt {
  font-size: 0;            /* hide the original word */
  line-height: 0;
}

body.item.resource.show #content > dl:not(.item-sets):not(.media-list)
  > .property:nth-of-type(2) > dt::after {
  content: "Transcription";
  font-size: 1rem;         /* adjust if your theme uses a different size */
  line-height: 1.2;
  font-weight: 600;
}

  /* The FIRST dl (Title/Description/Identifier) goes right */
  body.item.resource.show #content > dl:not(.item-sets):not(.media-list){
    grid-column: 2;
  }

  /* Optional: keep these on the right too (remove if you want them below) */
  body.item.resource.show #content > dl.item-sets,
  body.item.resource.show #content > dl.media-list{
    grid-column: 2;
  }

  /* Make image responsive */
  body.item.resource.show #content > .media-embeds img{
    max-width: 100%;
    height: auto;
    display: block;
  }
}


/* Bigger headings (dt labels like Title / Transcription) */
body.item.resource.show #content dl > .property > dt{
  font-size: 1.25rem;   /* try 1.4rem if you want even bigger */
  line-height: 1.2;
  font-weight: 700;
  margin-bottom: 0.35rem;
}

/* Optional: add a little space between properties */
body.item.resource.show #content dl > .property{
  margin-bottom: 1.25rem;
}

/* Make the injected "Transcription" label the same size as other headings */
body.item.resource.show #content > dl:not(.item-sets):not(.media-list)
  > .property:nth-of-type(2) > dt::after{
  font-size: 1.25rem;
  line-height: 1.2;
  font-weight: 700;
}