/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */
/* =============================================
=            Custom header Main                =
============================================= */
@layer sdc {
  @media (min-width: 64em) {
    .hamburger {
      display: none;
    }
  }
  .hamburger span {
    pointer-events: none;
  }
  .header-main {
    --logo-width: 2.375rem;
    position: relative;
    z-index: 3;
    background: var(--color-white);

    /* Scroll position fixed */
  }
  @media (min-width: 64em) {
    .header-main {
      --logo-width: 7.4375rem;
      z-index: 5;
    }
  }
  .header-main__inner {
    position: relative;
    padding: 0;
  }
  @media (min-width: 64em) {
    .header-main__inner {
      display: grid;
      grid-template-areas: "left bottom top" "left center center";
      grid-template-rows: 1fr auto;
      grid-template-columns: var(--logo-width) 1fr auto;
      align-content: end;
      min-height: var(--logo-width);
      padding: 0 1.25rem;
      background-color: var(--color-white);
    }
    .header-main__inner:after {
      position: absolute;
      bottom: 0;
      left: 50%;
      width: calc(100vw - var(--scrollbar-width));
      height: 0.25rem;
      content: "";
      transform: translateX(-50%);
      background-color: var(--color-white);
      box-shadow: 0 2px 4px 0 rgb(0, 0, 0, 0.08);
    }
  }
  @media (min-width: 77.5rem) {
    .header-main__inner {
      padding: 0;
    }
  }
  .header-main__top {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 3.8125rem;
    padding: 0 1.25rem;
    background-color: var(--color-white);
    box-shadow: var(--box-shadow);
  }
  @media (min-width: 64em) {
    .header-main__top {
      position: static;
      grid-area: top;
      align-items: stretch;
      justify-content: flex-end;
      padding: 0;
      box-shadow: none;
    }
  }
  .header-main__nav {
    position: fixed;
    z-index: 2;
    inset: 0;
    top: var(--header-top-height);
    overflow-y: auto;
    padding: 5rem 2rem 0.5rem;
    transition: transform 0.2s ease-out;
    transform: translateX(-100%);
    background-color: var(--color-white);
  }
  @media (min-width: 64em) {
    .header-main__nav {
      position: static;
      z-index: auto;
      top: auto;
      display: flex;
      overflow: unset;
      grid-area: center;
      align-content: flex-end;
      justify-content: space-between;
      margin-left: 1rem;
      padding: 0;
      transition: none;
      transform: none;
    }
  }
  @media (min-width: 87.5em) {
    .header-main__nav {
      margin-left: 2rem;
    }
  }
  .header-main__nav.is-open {
    transform: translateX(0);
  }
  @media (min-width: 64em) {
    .header-main__nav.is-open {
      transform: none;
    }
    .header-main__bottom {
      position: relative;
      overflow: hidden;
      grid-area: bottom;
      align-self: center;
      min-height: 2.75rem;
    }
    .header-main__bottom.is-active .site-slogan {
      opacity: 0;
    }
  }
  .header-main__logo {
    flex-grow: 1;
  }
  @media (min-width: 64em) {
    .header-main__logo {
      position: absolute;
      top: 0;
      left: 0;
    }
  }
  .header-main__logo__link {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: center;
    transition: color 0.3s ease-out;
    -webkit-text-decoration: none;
    text-decoration: none;
  }
  @media (min-width: 64em) {
    .header-main__logo__link {
      height: var(--logo-width);
    }
  }
  .header-main__logo__link:link,
  .header-main__logo__link:visited {
    color: var(--color-grey-one);
  }
  .header-main__logo__link:hover {
    color: var(--color-grey-two);
  }
  .header-main__logo svg {
    width: auto;
    height: var(--logo-width);
  }

  /* Slogan inside block-system-branding-block */
  .header-main__logo__slogan {
    display: block;
    padding: 0 0.7rem;
    text-align: center;
    font-size: clamp(0.625rem, 0.2244rem + 1.6026vw, 1.25rem);
    font-weight: 300;
  }
  @media (min-width: 64em) {
    .header-main__logo__slogan {
      display: none;
    }
  }

  /* Slogan inside region header top */
  .header-main .site-slogan {
    display: none;
  }
  @media (min-width: 64em) {
    .header-main .site-slogan {
      display: block;
      flex-grow: 1;
      align-self: center;
      margin-left: 1rem;
      padding: 0.5rem 0;
      transition: opacity 0.3s ease-out;
      opacity: 1;
      color: var(--color-grey-one);
      font-size: 1.5rem;
      font-weight: 300;
    }
  }
  @media (min-width: 87.5em) {
    .header-main .site-slogan {
      margin-inline-start: 2rem;
    }
  }
  .header-main__icons {
    display: flex;
  }
  @media (min-width: 64em) {
    .header-main__icons {
      position: relative;
      z-index: 2;
      background-color: var(--color-white);
    }
  }
  .header-main__language {
    flex-direction: row;
    column-gap: 0.3rem;
  }
  .header-main__language .js-language-active {
    display: flex;
    flex-direction: column;
    letter-spacing: -0.05em;
    letter-spacing: -0.6px;
    text-transform: uppercase;
    pointer-events: none;
    color: var(--color-black-main);
    font-size: 0.9375rem;
    font-weight: 500;
    line-height: 1rem;
  }
  .header-main__language .js-language-active:after {
    width: 100%;
    height: 1px;
    content: "";
    background-color: var(--color-primary);
  }
  .header-main__language,
  .header-main__search {
    display: flex;
    place-items: center;
    min-width: 3rem;
    min-height: 3rem;
    border: none;
    outline: transparent;
    background-color: initial;
  }
  .header-main__language.is-active path,
  .header-main__search.is-active path {
    fill: var(--color-primary);
  }
  .header-main__language:focus,
  .header-main__language:hover,
  .header-main__search:focus,
  .header-main__search:hover {
    cursor: pointer;
  }
  .header-main__language:focus path,
  .header-main__language:hover path,
  .header-main__search:focus path,
  .header-main__search:hover path {
    fill: var(--color-primary);
  }
  .header-main__language svg,
  .header-main__search svg {
    pointer-events: none;
  }
  .header-main .block-language,
  .header-main .block-search {
    position: absolute;
    z-index: 2;
    top: var(--header-top-height);
    left: 0;
    width: 100%;
    transition:
      transform 0.2s ease-out,
      opacity 0.2s ease-out;
    transform: translateY(-100%);
    opacity: 0;
  }
  @media (min-width: 64em) {
    .header-main .block-language,
    .header-main .block-search {
      top: 50%;
      right: 0;
      left: unset;
      width: auto;
      transform: translate(102%, -50%);
      opacity: 0;
    }
  }
  .header-main .block-language.is-open,
  .header-main .block-search.is-open {
    transform: translateY(0);
    opacity: 1;
    box-shadow: 0 6px 20px -3px rgb(0, 0, 0, 0.05);
  }
  @media (min-width: 64em) {
    .header-main .block-language.is-open,
    .header-main .block-search.is-open {
      transform: translate(-3.125rem, -50%);
      box-shadow: unset;
    }
    .header-main.js-fixed-menu {
      --header-top-height: 4rem;
      position: fixed;
      inset: unset;
      top: -5.625rem;
      width: 100%;
      animation: slide-bottom 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
    }
    .header-main.js-fixed-menu .header-main__inner {
      grid-template-rows: 0 auto 0;
      min-height: unset;
    }
    .header-main.js-fixed-menu .header-main__top {
      grid-area: left;
      justify-content: flex-start;
      min-height: unset;
    }
    .header-main.js-fixed-menu .header-main__logo {
      position: relative;
      top: unset;
      left: unset;
      align-self: center;
      justify-self: flex-start;
      margin-left: 0;
    }
    .header-main.js-fixed-menu .header-main__logo__link {
      justify-content: flex-start;
      height: unset;
    }
    .header-main.js-fixed-menu .header-main__logo svg {
      width: 2.8125rem;
      height: 2.8125rem;
    }
    .header-main.js-fixed-menu .header-main__nav {
      margin-inline-start: 0;
      padding-top: 1.25rem;
    }
    .header-main.js-fixed-menu .header-main__bottom,
    .header-main.js-fixed-menu .header-main__icons,
    .header-main.js-fixed-menu .site-slogan {
      display: none;
    }
    .header-main__top {
      -ms-grid-row: 1;
      -ms-grid-column: 3;
    }
    .header-main__nav {
      -ms-grid-row: 2;
      -ms-grid-column: 2;
      -ms-grid-column-span: 2;
    }
    .header-main__bottom {
      -ms-grid-row: 1;
      -ms-grid-column: 2;
    }
    .header-main.js-fixed-menu .header-main__top {
      -ms-grid-row: 1;
      -ms-grid-row-span: 2;
      -ms-grid-column: 1;
    }
  }

  /* Animation slide-bottom */
  @keyframes slide-bottom {
    0% {
      transform: translateY(0);
    }
    to {
      transform: translateY(5.625rem);
    }
  }
  @media (min-width: 64em) {
    .toolbar-vertical .header-main.js-fixed-menu {
      top: -3.1875rem;
      width: calc(100vw - 15rem);
    }
    .toolbar-horizontal .header-main.js-fixed-menu {
      top: -0.6875rem;
    }
  }
}