/**
 * @license EUPL-1.2+
 * Copyright Gemeente Amsterdam
 */

.ams-image {
  aspect-ratio: var(--ams-image-aspect-ratio);
  block-size: auto; /* [1] */
  font-style: italic; /* [3] */
  inline-size: 100%; /* [1] */
  object-fit: cover; /* [4] */
  vertical-align: middle; /* [2] */
}

// [1] Allow for fluid image sizing while maintaining aspect ratio governed by inline/block size attributes
// [2] Remove ‘phantom’ white space
// [3] Italicise alt text to visually offset it from surrounding copy
// Source: https://x.com/csswizardry/status/1717841334462005661
// [4] Crop the image to maintain a supported aspect ratio