/*
A simple little SCSS mixin for creating scrim gradients
Inspired by Andreas Larson - https://github.com/larsenwork
https://css-tricks.com/easing-linear-gradients/
*/
/* HIGHTLIGHT GRID STYLE - reusable - for FacetWp */
/**
 * CARDS
 *
 * Style for site's cards
 * opd-card
 * opd-card--base
 * 
 *
*/
/* ------------------------------------ *\
  #CARD-CUSTOM-PROPERTIES
\* ------------------------------------ */
.opd-card {
  --_card-display: var(--card-display, flex);
  --_card-align-items: var(--card-align-items, " ");
  --_card-flex-flow: var(--card-flex-flow, column nowrap);
  --_card-justify-content: var(--card-justify-content, " ");
  --_card-grid-template-areas: var(--grid-template-areas, " ");
  --_card-grid-template-columns: var(--grid-template-columns, " ");
  --_card-grid-gap: var(--card-grid-gap, " ");
  --_card-aspect-ratio: var(--card-aspect-ratio, " ");
  --_card-spacer-y-t: var(--card-spacer-y-t, 0.625rem);
  --_card-spacer-y-b: var(--card-spacer-y-b, 0.625rem);
  --_card-spacer-x-l: var(--card-spacer-x-l, 0.625rem);
  --_card-spacer-x-r: var(--card-spacer-x-r, 0.625rem);
  --_card-border-width: var(--card-border-width, " ");
  --_card-border-color: var(--card-border-color, " ");
  --_card-border-radius: var(--card-border-radius, " ");
  --_card-box-shadow: var(--card-box-shadow, " ");
  --_card-box-shadow-hover: var(--card-box-shadow-hover, " ");
  --_card-color: var(--card-color, hsl(214deg, 13%, 24%));
  --_card-background: var(--card-background, #ffffff);
  --_card-text-font-size: var(--card-text-font-size, " ");
  --_card-text-spacer-y-t: var(--card-text-spacer-y-t, " ");
  --_card-text-spacer-y-b: var(--card-text-spacer-y-b, " ");
  --_card-text-spacer-x-l: var(--card-text-spacer-x-l, " ");
  --_card-text-spacer-x-r: var(--card-text-spacer-x-r, " ");
  --_card-description-color: var(--card-description-color, var(--_card-color));
  --_card-description-font-size: var(--card-description-font-size, 0.875rem);
  --_card-date-height: var(--card-date-height, " ");
  --_card-date-font-size: var(--card-date-font-size, " ");
  --_card-date-color: var(--card-date-color, var(--_card-color));
  --_card-date-background: var(--card-date-background, " ");
  --_card-date-spacer-y-t: var(--card-date-spacer-y-t, " ");
  --_card-date-spacer-y-b: var(--card-date-spacer-y-b, " ");
  --_card-date-margin-spacer-x-l: var(--card-date-margin-spacer-x-l, " ");
  --_card-date-margin-spacer-x-r: var(--card-date-margin-spacer-x-r, " ");
  --_card-date-spacer-x-l: var(--card-date-spacer-x-l, " ");
  --_card-date-spacer-x-r: var(--card-date-spacer-x-r, " ");
  --_card-decorated-item-color: var(--card-decorated-item-color, #752E4A);
  --card-title-spacer-y: 0.625rem;
  --card-title-font-size: clamp(1rem, 1rem + 1.2vw, 1.25rem);
  --_card-title-font-family: var(--card-title-font-family, inherit);
  --card-category-order: " ";
  --_card-category-font-size: var(--category-font-size, clamp(0.75rem, 1rem + 1.5vw, 0.875rem));
  --card-meta-color: " ";
  --_card-meta-icon-color: var(--card-meta-icon-color, hsl(214deg, 22%, 59%));
  --card-image-aspect-ratio: 16/9;
  --_card-image-object-fit: var(--card-image-object-fit, cover);
  /* change tag component font size in card */
  --tag-font-size: 0.75rem;
  /* Custom properties settings */
  display: var(--_card-display);
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: var(--_card-flex-flow);
          flex-flow: var(--_card-flex-flow);
  -webkit-box-pack: var(--_card-justify-content);
      -ms-flex-pack: var(--_card-justify-content);
          justify-content: var(--_card-justify-content);
  -webkit-box-align: var(--_card-align-items);
      -ms-flex-align: var(--_card-align-items);
          align-items: var(--_card-align-items);
  grid-template-areas: var(--_card-grid-template-areas);
  gap: var(--_card-grid-gap);
  grid-template-columns: var(--_card-grid-template-columns);
  padding: var(--_card-spacer-y-t) var(--_card-spacer-x-r) var(--_card-spacer-y-b) var(--_card-spacer-x-l);
  -webkit-box-shadow: var(--_card-box-shadow);
          box-shadow: var(--_card-box-shadow);
  border-radius: var(--_card-border-radius);
  border: var(--_card-border-width) solid var(--_card-border-color);
  background-color: var(--_card-background);
  aspect-ratio: var(--_card-aspect-ratio);
}
.opd-card__text {
  padding: var(--_card-text-spacer-y-t) var(--_card-text-spacer-x-r) var(--_card-text-spacer-y-b) var(--_card-text-spacer-x-l);
}
.opd-card__title {
  margin-bottom: var(--card-title-spacer-y, 0.625rem);
  font-size: var(--card-title-font-size, " ");
  color: var(--card-color, hsl(214deg, 13%, 24%));
  font-weight: 500;
  font-family: var(--_card-title-font-family);
}
.opd-card__title .opd-card__category {
  margin-bottom: 1em;
}
.opd-card__title a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.opd-card__category {
  -webkit-box-ordinal-group: var(--card-category-order, " ");
      -ms-flex-order: var(--card-category-order, " ");
          order: var(--card-category-order, " ");
  font-size: var(--_card-category-font-size);
  font-weight: 600;
  font-family: "Lora", serif;
}
.opd-card__decorated-item {
  color: var(--_card-decorated-item-color);
}
.opd-card__text {
  color: var(--card-color, hsl(214deg, 13%, 24%));
}
.opd-card__date, .opd-card__meta-list {
  color: var(--card-meta-color, var(--card-color));
  font-size: clamp(0.75rem, 1rem + 1.5vw, 0.875rem);
}
.opd-card__date {
  min-height: var(--_card-date-height);
  margin-right: var(--_card-date-margin-spacer-x-r);
  margin-bottom: var(--_card-date-spacer-y-b);
  margin-left: var(--_card-date-margin-spacer-x-l);
  padding-top: 0.5em;
  padding-right: var(--_card-date-spacer-x-r);
  padding-bottom: 0.5em;
  padding-left: var(--_card-date-spacer-x-l);
  background-color: var(--_card-date-background);
  color: var(--_card-date-color);
  font-weight: 500;
  font-size: var(--_card-date-font-size);
}
.opd-card__meta-icon {
  margin-right: 0.15em;
  color: var(--_card-meta-icon-color);
}
.opd-card__description {
  color: var(--_card-description-color);
  font-size: var(--_card-description-font-size);
}
.opd-card__numbered-list {
  padding-left: 1em;
  font-size: var(--_card-description-font-size);
  list-style: decimal;
}
.opd-card__numbered-list li + li {
  margin-top: 0.3125rem;
}
.opd-card__numbered-list a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-decoration: underline;
}
.opd-card__meta-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.opd-card__meta-item + .opd-card__meta-item {
  margin-left: 1.25rem;
}
.opd-card__thumb-wrapper {
  line-height: 0; /* resolve image wrapper over-height issue */
}
.opd-card__thumb {
  width: 100%;
  -o-object-position: center center;
     object-position: center center;
  -o-object-fit: var(--_card-image-object-fit);
     object-fit: var(--_card-image-object-fit);
  aspect-ratio: var(--card-image-aspect-ratio, " ");
}
.opd-card a:hover, .opd-card a:focus {
  color: inherit;
}

/* ------------------------------------ *\
  #CARDS
\* ------------------------------------ */
/* base card - manage border, background color, padding */
.opd-card--base {
  --card-justify-content: space-between;
  --card-spacer-y-t: 0.9375rem;
  --card-spacer-y-b: 0.9375rem;
  --card-spacer-x-l: 2.5rem;
  --card-spacer-x-r: 2.5rem;
  --card-title-spacer-y: 0.75em;
  --card-border-width: 1px;
  --card-border-color: hsl(0deg, 0%, 85%);
  --card-category-order: -1;
  --card-meta-color: hsl(215deg, 14%, 35%);
  --card-date-spacer-y-b: 0;
  --card-date-font-size: 0.875rem;
  --card-date-color: var(--card-meta-color);
}
.opd-card--base .opd-card__category {
  margin-bottom: 0.5em;
}
.opd-card--base .opd-card__description + .opd-card__date {
  margin-top: 0.9375rem;
}
.opd-card--base .opd-card__meta {
  padding-top: 0.625rem;
  border-top: 1px solid hsl(0deg, 0%, 85%);
}

/* ------------------------------------ *\
  #CARD-ALIGN-CONTENT-START
\* ------------------------------------ */
/* Card with flex-start content alignment (justify content on y assis)  */
.opd-card--align-content-start {
  --card-justify-content: flex-start;
}

/* ------------------------------------ *\
  #CARD-HAS-LINE-CATEGORY
\* ------------------------------------ */
/* manage line decoration in category or title */
.opd-card--has-line-decoration {
  --card-line-spacing-base: var(--_card-spacer-x-l);
  --card-line-height: 2px;
}
.opd-card--has-line-decoration .opd-card__decorated-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}
.opd-card--has-line-decoration .opd-card__decorated-item a {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.opd-card--has-line-decoration .opd-card__decorated-item::before {
  content: "";
  display: inline-block;
  width: calc(0.5 * var(--card-line-spacing-base)); /* half card padding */
  height: var(--card-line-height);
  margin-right: calc(0.5 * var(--card-line-spacing-base)); /* half card padding */
  margin-left: calc(-1 * var(--card-line-spacing-base)); /* card padding */
  background-color: var(--card-line-bg, currentColor);
}

/* ------------------------------------ *\
  #CARD-HAS-WHITE-BG
\* ------------------------------------ */
.opd-card--has-white-bg {
  --card-background: #ffffff;
}

/* ------------------------------------ *\
  #CARD-BACKGROUND-00
\* ------------------------------------ */
/* Light gray background */
.opd-card--has-bg-00 {
  --card-background: hsl(40deg, 20%, 97%);
  --card-spacer-y-t: 2.5rem;
  --card-spacer-y-b: 2.5rem;
  --card-spacer-x-l: 2.5rem;
  --card-spacer-x-r: 2.5rem;
  --card-title-spacer-y: 0.75em;
  --card-title-font-size: clamp(1.5rem, 1rem + 1.2vw, 2rem);
}

/* ------------------------------------ *\
  #CARD-HAS-BOX-SHADOW
\* ------------------------------------ */
/* box shadow card */
.opd-card--has-shadow {
  --card-box-shadow: 0px 2px 11px rgba(0, 0, 0, 0.06);
}

/* ------------------------------------ *\
  #CARD-HAS-LOGO-BG
\* ------------------------------------ */
/* logo bg card */
.opd-card--has-logo-bg {
  background-image: url("/wp-content/themes/opd/assets/images/logo-bg-gray.svg");
  background-position: right bottom;
  background-repeat: no-repeat;
}

/* ------------------------------------ *\
  #CARD-HAS-BORDER-RADIUS
\* ------------------------------------ */
/* border-radius card */
.opd-card--has-border-radius {
  --card-border-radius: 5px;
  overflow: hidden;
}

/* ------------------------------------ *\
  #CARD-TEASER-VIDEO
\* ------------------------------------ */
/* teaser card */
.opd-card--teaser-video {
  --thumb-icon-size: clamp(40px, 5vw, 52px);
}
.opd-card--teaser-video .opd-card__thumb-wrapper {
  display: grid;
  grid-template-areas: "thumb";
}
.opd-card--teaser-video .opd-card__thumb-wrapper > * {
  grid-area: thumb;
}
.opd-card--teaser-video .opd-card__thumb-wrapper::after {
  content: "\f04b";
  font-family: "Font Awesome 6 Pro" !important;
  speak: none;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  grid-area: thumb;
  align-self: center;
  justify-self: center;
  width: var(--thumb-icon-size);
  height: var(--thumb-icon-size);
  border-radius: 50%;
  background-color: hsla(0deg, 0%, 0%, 0.4);
  color: #ffffff;
  font-size: clamp(1.125rem, 1rem + 1.2vw, 1.5rem);
}

/* ------------------------------------ *\
  #CARD-HAS-THUMB
\* ------------------------------------ */
/* HAS side thumb */
.opd-card--has-side-thumb {
  --card-display: grid;
  --card-align-items: stretch;
}
.opd-card--has-side-thumb .opd-card__thumb-wrapper {
  grid-area: thumb;
}
.opd-card--has-side-thumb .opd-card__thumb-wrapper img {
  height: 100%;
}

/* THUMB LEFT */
.opd-card--has-side-thumb-left {
  --grid-template-areas: "thumb text";
  --grid-template-columns: 1fr 2fr;
  --card-image-aspect-ratio: 3/4;
  --card-grid-gap: 2.5rem;
}
.opd-card--has-side-thumb-left .opd-card__title + .opd-card__description {
  margin-top: 0.625rem;
}
.opd-card--has-side-thumb-left .opd-card__thumb {
  height: 100%;
}
.opd-card--has-side-thumb-left.opd-card--teaser {
  --card-title-font-size: clamp(1.5rem, 1rem + 1.2vw, 2rem);
  --card-description-font-size: clamp(0.875rem, 1rem + 1.5vw, 1rem);
  /* card teaser with left thumb in desktop mode */
  --grid-template-areas: "thumb" "text";
  --grid-template-columns: 1fr;
  --card-spacer-x-l: 1.875rem;
  --card-spacer-x-r: 1.875rem;
  --card-spacer-y-b: 0.9375rem;
  --_thumb-wrapper-spacer-t: var(--thumb-wrapper-spacer-t, calc(-1 * var(--_card-spacer-y-t)));
  --_thumb-wrapper-spacer-r: var(--thumb-wrapper-spacer-r, calc(-1 * var(--_card-spacer-x-r)));
  --_thumb-wrapper-spacer-b: var(--thumb-wrapper-spacer-b, var(--_card-spacer-y-t));
  --_thumb-wrapper-spacer-l: var(--thumb-wrapper-spacer-l, calc(-1 * var(--_card-spacer-x-l)));
  --card-grid-gap: 0.625rem;
}
.opd-card--has-side-thumb-left.opd-card--teaser .opd-card__thumb-wrapper {
  margin-top: var(--_thumb-wrapper-spacer-t);
  margin-right: var(--_thumb-wrapper-spacer-r);
  margin-bottom: var(--_thumb-wrapper-spacer-b);
  margin-left: var(--_thumb-wrapper-spacer-l);
}

.opd-card--side-left-thumb-no-space {
  --card-spacer-y-t: 0;
  --card-spacer-y-b: 0;
  --card-spacer-x-l: 0;
  --card-spacer-x-r: 0;
  --card-line-spacing-base: var(--card-grid-gap);
  --card-text-spacer-y-t: 1.5625rem;
  --card-text-spacer-y-b: 1.5625rem;
  --card-text-spacer-x-r: 1.5625rem;
  --card-text-spacer-x-l: 0;
}

/* THUMB RIGHT */
.opd-card--has-side-thumb-right {
  --grid-template-areas: "text thumb";
  --grid-template-columns: 2fr 1fr;
  --card-image-aspect-ratio: 1/1;
  --card-grid-gap: 1.875rem;
}

/* THUMB TOP */
.opd-card--has-top-thumb {
  --card-spacer-x-l: 1.875rem;
  --card-spacer-x-r: 1.875rem;
}
.opd-card--has-top-thumb .opd-card__thumb-wrapper {
  margin-top: calc(-1 * var(--_card-spacer-y-t));
  margin-right: calc(-1 * var(--_card-spacer-x-r));
  margin-bottom: var(--_card-spacer-y-t);
  margin-left: calc(-1 * var(--_card-spacer-x-l));
}

/* THUMB TOP LOGO - EG PARTNERS */
.opd-card--has-top-thumb-logo {
  --card-spacer-x-r: 0.9375rem;
  --card-spacer-x-l: 0.9375rem;
  --card-image-aspect-ratio: 7/3;
  --card-image-object-fit: scale-down;
  --card-title-font-size: clamp(0.875rem, 1rem + 1.5vw, 1rem);
  --card-title-spacer-y: 0;
}
.opd-card--has-top-thumb-logo .opd-card__thumb-wrapper {
  padding: 0.625rem 0.625rem 0;
}
.opd-card--has-top-thumb-logo .opd-card__title a {
  gap: 0.33em;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column nowrap;
          flex-flow: column nowrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.opd-card--has-top-thumb-logo .opd-card__title-label {
  font-size: clamp(0.75rem, 1rem + 1.5vw, 0.875rem);
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  word-break: break-word;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
}

/* THUMB BACKGROUND */
.opd-card--has-bg-thumb {
  --card-display: grid;
  --grid-template-areas: "card";
  --card-spacer-y-t: 0;
  --card-spacer-y-b: 0;
  --card-spacer-x-l: 0;
  --card-spacer-x-r: 0;
  --card-title-spacer-y: 0;
  --card-color: #ffffff;
  --card-text-spacer-y-t: 0;
  --card-text-spacer-y-b: 1.5625rem;
  --card-text-spacer-x-r: 1.5625rem;
  --card-text-spacer-x-l: 1.5625rem;
}
.opd-card--has-bg-thumb .opd-card__thumb,
.opd-card--has-bg-thumb .opd-card__text {
  grid-area: card;
}
.opd-card--has-bg-thumb .opd-card__text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-flow: column-reverse;
          flex-flow: column-reverse;
  -ms-flex-item-align: stretch;
      align-self: stretch;
  background-image: -webkit-gradient(linear, left bottom, left top, from(hsl(0deg, 0%, 0%)), color-stop(19%, hsla(0deg, 0%, 0%, 0.738)), color-stop(34%, hsla(0deg, 0%, 0%, 0.541)), color-stop(47%, hsla(0deg, 0%, 0%, 0.382)), color-stop(66.5%, hsla(0deg, 0%, 0%, 0.278)), color-stop(73%, hsla(0deg, 0%, 0%, 0.1)), color-stop(77%, hsla(0deg, 0%, 0%, 0.04)), color-stop(85%, hsla(0deg, 0%, 0%, 0)));
  background-image: -o-linear-gradient(bottom, hsl(0deg, 0%, 0%) 0%, hsla(0deg, 0%, 0%, 0.738) 19%, hsla(0deg, 0%, 0%, 0.541) 34%, hsla(0deg, 0%, 0%, 0.382) 47%, hsla(0deg, 0%, 0%, 0.278) 66.5%, hsla(0deg, 0%, 0%, 0.1) 73%, hsla(0deg, 0%, 0%, 0.04) 77%, hsla(0deg, 0%, 0%, 0) 85%);
  background-image: linear-gradient(to top, hsl(0deg, 0%, 0%) 0%, hsla(0deg, 0%, 0%, 0.738) 19%, hsla(0deg, 0%, 0%, 0.541) 34%, hsla(0deg, 0%, 0%, 0.382) 47%, hsla(0deg, 0%, 0%, 0.278) 66.5%, hsla(0deg, 0%, 0%, 0.1) 73%, hsla(0deg, 0%, 0%, 0.04) 77%, hsla(0deg, 0%, 0%, 0) 85%);
}
.opd-card--has-bg-thumb .opd-card__thumb {
  height: 100%;
}

/* ------------------------------------ *\
  #CARD-TEASER
\* ------------------------------------ */
/* teaser card */
.opd-card--teaser {
  --card-image-aspect-ratio: 5.6/3.7;
}

/* ------------------------------------ *\
  #CARD-SQUARE
\* ------------------------------------ */
/* Square card with 1/1 aspect ratio */
.opd-card--square {
  --card-aspect-ratio: 1/1;
}

/* ------------------------------------ *\
  #CARD-RECTANGLE
\* ------------------------------------ */
/* Rectangle card with 5/6 aspect ratio */
.opd-card--rectangle {
  --card-aspect-ratio: 5/6;
}

/* ------------------------------------ *\
  #CARD-RECTANGLE-16/9
\* ------------------------------------ */
/* Rectangle card with 16/9 aspect ratio */
.opd-card--rectangle-16-9 {
  --card-aspect-ratio: 16/9;
}

/* ------------------------------------ *\
  #CARD-HAS-TOP-DATE
\* ------------------------------------ */
.opd-card--has-top-date {
  --card-date-background: #752E4A;
  --card-date-font-size: 0.75rem;
  --card-date-height: calc(var(--_card-date-font-size) * 3);
  --card-spacer-y-t: 0;
  --card-date-spacer-y-t: calc(var(--_card-date-height) * -1);
  --card-date-margin-spacer-x-r: calc(var(--_card-spacer-x-r) * -1);
  --card-date-spacer-y-b: auto;
  --card-date-margin-spacer-x-l: calc(var(--_card-spacer-x-l) * -1);
  --card-date-spacer-x-r: var(--_card-spacer-x-r);
  --card-date-spacer-x-l: var(--_card-spacer-x-l);
}
.opd-card--has-top-date .opd-card__date {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.opd-card--has-top-date.opd-card--has-bg-thumb {
  --card-date-margin-spacer-x-r: calc(var(--_card-text-spacer-x-r) * -1);
  --card-date-margin-spacer-x-l: calc(var(--_card-text-spacer-x-l) * -1);
  --card-date-spacer-x-r: var(--_card-text-spacer-x-r);
  --card-date-spacer-x-l: var(--_card-text-spacer-x-l);
}

/* ------------------------------------ *\
  #CARD-PEOPLE
\* ------------------------------------ */
.opd-card--people {
  --card-spacer-y-b: 1.875rem;
  --card-image-aspect-ratio: 9/8;
  --card-background: #752E4A;
  --card-color: #ffffff;
  --card-decorated-item-color: var(--_card-color);
  --card-title-font-size: clamp(1.125rem, 1rem + 1.2vw, 1.5rem);
}
.opd-card--people .opd-card__description {
  opacity: 0.65;
}

/* ------------------------------------ *\
  #CARD-CLICKABLE
\* ------------------------------------ */
/* Card with wide clickable area eg with image etc
   * 1. Use a pseudo-element to expand the  clicable area of the link over
   *    the whole card.
   * 2. Expand the hitbox over the whole card.
   * 3. Place the pseudo-element on top of the whole card.
   */
.opd-card--full-clickable {
  --card-box-shadow-hover: 0px 8px 16px rgba(0, 0, 0, 0.1);
  position: relative;
}
.opd-card--full-clickable .opd-card__title a {
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.opd-card--full-clickable .opd-card__title a::before {
  display: block;
  content: ""; /* 1 */
  position: absolute; /* 2 */
  top: 0; /* 2 */
  left: 0; /* 2 */
  right: 0; /* 2 */
  bottom: 0; /* 2 */
  z-index: 1; /* 3 */
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-transition: -webkit-box-shadow 0.3s ease;
  transition: -webkit-box-shadow 0.3s ease;
  -o-transition: box-shadow 0.3s ease;
  transition: box-shadow 0.3s ease;
  transition: box-shadow 0.3s ease, -webkit-box-shadow 0.3s ease;
}
.opd-card--full-clickable .opd-card__title a:hover::before {
  -webkit-box-shadow: var(--_card-box-shadow-hover);
          box-shadow: var(--_card-box-shadow-hover);
}

.opd-list .opd-card {
  height: 100%;
}

/* ------------------------------------ *\
  #CARD-ADDITIONAL-INFOS
\* ------------------------------------ */
/* Light gray background */
.opd-card--additional-infos {
  --card-description-color: #1C4D5E;
  --card-description-font-size: 1.125rem;
  --card-title-font-family: Nib Pro, serif;
  --card-image-object-fit: scale-down;
  --grid-template-columns: 3fr minmax(20%, 162px);
}

/* ------------------------------------ *\
  #MEDIA-QUERIES
\* ------------------------------------ */
/* Media query for touch screens */
@media (hover: none) and (pointer: coarse) {
  .opd-card__numbered-list a {
    padding: 0.3125rem 0;
  }
}
@media all and (min-width: 768px) {
  .opd-card--has-side-thumb-left.opd-card--teaser {
    --card-line-spacing-base: 1.875rem;
    --grid-template-areas: "thumb text";
    --grid-template-columns: 1fr 1fr;
    --card-spacer-y-t: 0;
    --card-spacer-y-b: 0;
    --card-spacer-x-l: 0;
    --card-spacer-x-r: 0;
    --card-grid-gap: calc(var(--card-line-spacing-base) * 1.5);
    --thumb-wrapper-spacer-r: 0;
    --thumb-wrapper-spacer-b: 0;
  }
  .opd-card--has-side-thumb-left.opd-card--teaser .opd-card__thumb-wrapper {
    height: 100%;
  }
  .opd-card--has-side-thumb-left.opd-card--teaser .opd-card__content {
    padding: 1.875rem 1.25rem;
  }
}