/**
 * Set custom typography sizes (e.g. header)
 * @param  {int} $size        font-size
 * @param  {int} $line-height line-height
 * @param  {int} $av          AV letter-spacing from XD
 * @return {void}
 */
/**
 * Converts a pixel, percentage, rem or em value to a unitless value based on a given font size. Ideal for working out unitless line heights.
 *
 * @param {Number} $value - Value to convert to a unitless line height
 * @param {Number} $base - The font size to use to work out the line height - defaults to $rem-font-size
 *
 * @return {Number} - Unitless number
 */
/**
 * AV letter spacing measurement convertor from Adobe applications
 * https://scotch.io/tutorials/converting-photoshop-letter-spacing-to-css
 */
.wp-block-sht-image-teaser {
  position: relative;
}
.wp-block-sht-image-teaser.with--gradient .wp-block-sht-image-teaser__inner::after {
  content: "";
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
  z-index: 0;
  background: linear-gradient(to bottom, rgba(107, 75, 75, 0) 65%, rgb(0, 0, 0) 100%);
  opacity: 0.5;
  mix-blend-mode: multiply;
}
.wp-block-sht-image-teaser.is-style-caption-outside-top .wp-block-sht-image-teaser__figure, .wp-block-sht-image-teaser.is-style-caption-outside-bottom .wp-block-sht-image-teaser__figure {
  position: relative;
}
.wp-block-sht-image-teaser.is-style-caption-outside-top .wp-block-sht-image-teaser__inner, .wp-block-sht-image-teaser.is-style-caption-outside-bottom .wp-block-sht-image-teaser__inner {
  display: flex;
  flex-direction: column;
  padding-bottom: 0;
}
.wp-block-sht-image-teaser.is-style-caption-outside-top .wp-block-sht-image-teaser__inner::after, .wp-block-sht-image-teaser.is-style-caption-outside-bottom .wp-block-sht-image-teaser__inner::after {
  display: none;
}
.wp-block-sht-image-teaser.is-style-caption-outside-top .wp-block-sht-image-teaser__title, .wp-block-sht-image-teaser.is-style-caption-outside-bottom .wp-block-sht-image-teaser__title {
  position: relative;
  padding: 0;
  margin-top: var(--unit-medium);
}
.wp-block-sht-image-teaser.is-style-caption-outside-top .wp-block-sht-image-teaser__title > a, .wp-block-sht-image-teaser.is-style-caption-outside-bottom .wp-block-sht-image-teaser__title > a {
  position: static;
  padding: 0;
}
.wp-block-sht-image-teaser.is-style-caption-outside-top .wp-block-sht-image-teaser__title::after, .wp-block-sht-image-teaser.is-style-caption-outside-bottom .wp-block-sht-image-teaser__title::after {
  content: "";
  position: absolute;
  top: calc(100% + var(--unit-small));
  left: var(--unit);
  height: var(--unit2-medium);
  border-left: 1px solid currentColor;
}
.wp-block-sht-image-teaser.is-style-caption-outside-top .wp-block-sht-image-teaser__inner {
  flex-direction: column-reverse;
}
.wp-block-sht-image-teaser.is-style-caption-outside-top .wp-block-sht-image-teaser__title {
  margin-top: 0;
  margin-bottom: var(--unit-medium);
}
.wp-block-sht-image-teaser.is-style-caption-outside-bottom .wp-block-sht-image-teaser__title::after {
  top: auto;
  bottom: calc(100% + var(--unit-small));
}
.wp-block-sht-image-teaser__cardlink {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
  z-index: 2;
  text-align: left;
  text-indent: -999rem;
  background: rgba(255, 255, 255, 0.01);
}
.wp-block-sht-image-teaser__cardlink::after {
  display: none;
}
.wp-block-sht-image-teaser__inner {
  position: relative;
  z-index: 1;
  border-radius: 0.1875rem;
}
.with--aspect_ratio--4x3 .wp-block-sht-image-teaser__inner {
  padding-bottom: 75%;
}
.with--aspect_ratio--3x2 .wp-block-sht-image-teaser__inner {
  padding-bottom: 66.6666666667%;
}
.wp-block-sht-image-teaser__figure {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
  width: 100%;
  border-radius: 0.1875rem;
  overflow: hidden;
}
.with--blockshadow .wp-block-sht-image-teaser__figure {
  filter: drop-shadow(0 0 var(--unit-medium) rgba(11, 87, 134, 0.5));
}
.wp-block-sht-image-teaser.with--aspect_ratio--3x2 .wp-block-sht-image-teaser__figure {
  aspect-ratio: 3/2;
}
.wp-block-sht-image-teaser.with--aspect_ratio--4x3 .wp-block-sht-image-teaser__figure {
  aspect-ratio: 4/3;
}
.wp-block-sht-image-teaser__figure--empty {
  background-color: var(--wp--preset--color--blue-5);
  aspect-ratio: 3/2;
}
.wp-block-sht-image-teaser__figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 0.1875rem;
  aspect-ratio: inherit;
}
.wp-block-sht-image-teaser__title {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
  display: flex;
  align-items: flex-end;
  z-index: 1;
  padding: var(--unit2-small) var(--unit);
  font-size: 1rem;
  line-height: 1.25;
  letter-spacing: 0.1em;
  font-weight: 700;
  text-transform: uppercase;
}
.wp-block-sht-image-teaser__title--textshadow {
  text-shadow: 0 1px 1px var(--wp--preset--color--black);
}
.wp-block-sht-image-teaser__title--textshadow::after {
  filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.25));
}
.wp-block-sht-image-teaser__title > a {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
  display: flex;
  flex: 0 0 100%;
  align-items: flex-end;
  padding: var(--unit2-small) var(--unit);
  text-decoration: none;
}