/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */
/* =============================================
=                    Latest                     =
============================================= */
@layer sdc {
  .latest {
    --card-title-color: var(--color-black-main);
    padding-block: var(--component-inner-space);
  }
  .latest__view__content {
    display: flex;
    flex-direction: column;
    row-gap: 2rem;
  }
  @media (min-width: 42.5em) {
    .latest__view__content {
      flex-flow: row wrap;
      column-gap: 2rem;
    }
  }

  /* buttons control tabs */
  .latest-tabs {
    position: relative;
    padding-top: 5rem;
  }
  .latest-tabs__buttons {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    overflow: hidden;
    width: 100%;
    height: 2.5rem;
    transition:
      height 0.1s ease-in-out,
      box-shadow 0.3s ease-out;
    background-color: var(--color-white);
  }
  .latest-tabs__buttons[aria-selected="true"] {
    font-weight: 700;
  }
  .latest-tabs__buttons.js-open {
    box-shadow: var(--box-shadow);
  }
  @media (width >= 56.3125em) {
    .latest-tabs__buttons button:not(:nth-last-child(2)):after {
      display: block;
      width: 2px;
      height: 1.5rem;
      content: "";
      background-color: var(--color-grey-1);
    }
    .latest-tabs__buttons {
      position: relative;
      display: flex;
      flex-flow: row nowrap;
      height: auto;
      margin-bottom: 2rem;
      column-gap: 1.25rem;
    }
  }
  .latest-tabs__arrow {
    --color-arrow: var(--color-action);
    position: absolute;
    top: 0.7rem;
    right: 1.25rem;
    transition: transform 0.2s ease-out;
    pointer-events: none;
    border: none;
    outline: transparent;
    background-color: initial;
  }
  .latest-tabs__arrow.is-open {
    transform: rotate(-180deg);
  }
  @media (width >= 56.3125em) {
    .latest-tabs__arrow {
      display: none;
    }
  }

  /* Open/close layer buttons */
  .latest-tabs__placeholder {
    height: 2.5rem;
    padding: 0 1.25rem;
    text-transform: uppercase;
    border: 2px solid hsl(0, 0%, 67%, 0.2);
    font-weight: 500;
    line-height: 2.5rem;
  }
  .latest-tabs__placeholder:hover {
    cursor: pointer;
  }
  .latest-tabs__placeholder.is-open {
    opacity: 0.3;
  }
  @media (width >= 56.3125em) {
    .latest-tabs__placeholder {
      display: none;
    }
  }

  /* role="tab" */
  .latest-tabs__link {
    display: block;
    width: 100%;
    padding: 0 1.25rem;
    text-align: left;
    text-transform: uppercase;
    border: none;
    outline: transparent;
    background-color: initial;
    font-weight: 300;
    line-height: 2.5rem;
  }
  .latest-tabs__link:focus,
  .latest-tabs__link:hover {
    color: var(--color-action);
  }
  .latest-tabs__link:hover {
    cursor: pointer;
  }
  @media (width >= 56.3125em) {
    .latest-tabs__link[aria-selected="true"] {
      color: var(--color-action);
    }
    .latest-tabs__link {
      display: flex;
      align-items: center;
      width: auto;
      padding: 0;
      column-gap: 1.25rem;
      font-size: 1.1rem;
      font-weight: 400;
    }
  }

  /* Content panels role="tabpanel" */
  .latest-tabs__content[hidden] {
    display: none;
  }
  @media (width >= 56.3125em) {
    .latest-tabs {
      padding-top: 0;
    }
  }
}