.sn-footer {
  position: relative;
  padding: 2rem 2rem 1rem;
  border-top: solid 2px var(--primary);
  background-color: var(--background);
  text-align: center;
  a {
    text-decoration: none;
  }
  .region-footer {
    display: block;

    gap: 1rem 2rem;
    margin: 0 auto;
    width: 100%;
    max-width: 1200px;

    p {
      margin: 0 1rem 0 0;
      font-weight: 700;
      text-transform: uppercase;
    }
  }
}

/* // follow us block */
#block-footerfollow {
  align-self: start;
  grid-column: 1 / span 1;
  grid-row: 1 / span 1;

  .field__item {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
  }

  .img-logo {
    margin-bottom: 2rem;
    width: 100%;
    height: 8rem;
    text-align: left;
    img {
      display: block;
      width: 100%;
      max-width: 20rem;
      height: 100%;
      object-fit: contain;
      margin: auto;
    }
  }
  p {
    width: 100%;
  }
  ul {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin: 1rem auto;
  }
  li {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    height: 2.5rem;
    width: 2.5rem;
    background-color: var(--background-accent);
    border-radius: 100%;
    a,
    svg {
      position: absolute;
      left: 0;
      top: 0;
      height: 100%;
      width: 100%;
    }
    a {
      font-size: 0;
      display: block;
      z-index: 1;
    }
  }

  li:hover {
    background-color: var(--background);
  }
  h4 {
    margin-top: 2rem;
    margin-bottom: 0;
  }
}

/* // News letter form */
#block-webform-2 {
  display: block;
  grid-column: 1 / span 1;
  grid-row: 2 / span 1;
  label[for="edit-description"] {
    display: block;
    margin-bottom: 1rem;
  }

  input {
    height: 3rem;
  }

  label {
    line-height: 1.25;
    font-size: var(--text-sm);
  }
  .form-wrapper {
    gap: 0;
  }
  .form-actions {
    padding: 0;
    margin: 0;
  }

  .webform-flex {
    flex: 1;
  }

  .webform-flex:has([data-drupal-selector="edit-captcha"]) {
    display: none;
  }

  .webform-flex:last-child {
    flex: 0 0 100%;
    input {
      width: 100%;
      max-width: none;
      min-width: 0;
      font-size: var(--text-base);
    }
  }
}

/* // Navigation */

.menu--footer {
  margin-top: 2rem;
  background-color: transparent;
  .menu-container {
    display: block;
  }
  .menu-item {
    padding: 1rem;
    border-bottom: 1px solid var(--accent);
    &:not(:has(*)) {
      display: none;
    }
    &:has(.menu-parent-container) {
      padding: 0;
    }
    .menu-parent-container {
      position: static;
      width: auto;
    }
  }

  .menu-parent-container .menu-item.menu-item--expanded {
    position: relative;
    isolation: isolate;
  }
  .menu-parent-container .menu-item.menu-item--expanded > a,
  .menu-parent-container .menu-item.menu-item--expanded > span {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 0;
    &::after {
      content: "+";
      display: block;
      font-size: var(--text-lg);
    }
  }
  .menu-group {
    overflow: hidden;
    max-height: 0;
    li {
      a {
        text-transform: none;
        font-weight: 400;

        &:hover {
          text-decoration: underline;
        }
      }
    }
  }

  .menu-parent-container .menu-item.menu-item--expanded.open .menu-group {
    overflow: initial;
    max-height: 200svh;
  }

  .menu-parent-container .menu-item.menu-item--expanded.open > a::after,
  .menu-parent-container .menu-item.menu-item--expanded.open > span::after {
    content: "-";
  }

  .arrow {
    position: absolute;
    width: 50%;
    height: 4rem;
    right: 0;
    top: 0;
    z-index: 1;
  }
}
.menu--footer,
#block-addrescontacts {
  position: relative;
  grid-column: 2 / span 1;
  grid-row: 1 / span 2;
  font-size: var(--text-sm);
}

.menu--footer .menu,
.address_contacts {
  text-align: left;
  position: relative;
  margin: 0;
  padding: 0;
  list-style: none;

  margin-left: auto;
  .menu-item {
    list-style: none;

    /* padding: 0; */
    /* margin-bottom: 1rem; */
  }

  a {
    text-transform: uppercase;
    font-weight: 700;

    transition: color 0.3s var(--ease);
    &:hover {
      color: var(--primary);
    }
    img {
      margin-top: 0.5rem;
      margin-right: 0.5rem;
      width: 2rem;
      display: inline;
    }
  }
  span {
    text-transform: uppercase;

    font-weight: 700;

    color: var(--foreground);
  }
  .no-name {
    > span {
      display: none;
    }
  }
}

#block-addrescontacts {
  grid-column: 3 / span 1;
  grid-row: 1 / span 2;
  text-align: left;
  padding-bottom: 2rem;
  p {
    padding: 1rem;
  }

  .address_contacts {
    margin: 0;
    padding-left: 1rem;
  }
}

#block-bottompage {
  grid-column: 1 / span 3;
  border-top: solid 1px var(--accent);
  .field__item {
    display: block;
  }

  ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin: 0;
    padding: 0;
    font-size: var(--text-sm);
    li {
      margin: 0;
      padding: 1rem 0;
      list-style: none;
      a {
        transition: color 0.3s var(--ease);
        &:hover {
          color: var(--primary);
        }
      }
    }
  }
  p {
    margin: 0;
    font-size: var(--text-xs);
    font-weight: 400;
    text-transform: initial;
  }
}

/* // Navigation */
/* .menu--footer,
#block-addrescontacts {
  ul.menu,
  ul.address_contacts {
    > li {
      a {
        &:hover {
          text-decoration: underline;
        }
      }

      ul.menu-group {
        li {
          a {
            &:hover {
              text-decoration: underline;
            }
          }
        }
      }
    }
  }
} */

@media (min-width: 1024px) {
  .sn-footer {
    text-align: left;
    .region-footer {
      display: grid;
      grid-template-columns: 25rem 3fr 1fr;
      grid-template-rows: auto auto;
    }
    .menu-parent-container .menu-item.menu-item--expanded > a,
    .menu-parent-container .menu-item.menu-item--expanded > span {
      display: block;
      &::after {
        display: none;
      }
    }
    .menu-group {
      overflow: initial;
      max-height: initial;
    }
  }

  #block-footerfollow {
    p {
      width: auto;
    }
    .img-logo {
      margin-bottom: 0;
      img {
        margin: 0;
      }
    }
  }

  .menu--footer {
    margin-top: 0;
    .menu-container {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 3rem;
      max-width: max-content;
    }

    .menu-group {
      display: block;
      margin-top: 1rem;
      padding-left: 1rem;
    }

    .menu-item {
      padding: 0;
      border: 0;
      margin-bottom: 0.25rem;
    }
  }

  #block-addrescontacts {
    p {
      padding: 0;
    }
    .address_contacts {
      margin: 1rem 0;
    }
  }

  #block-bottompage {
    .field__item {
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
  }

  #block-webform-2 {
    .webform-flex:last-child {
      flex: 0 0 auto;
    }
  }
}
