#footer {
  --color-text: var(--color-white);
  --color-link: var(--color-white);
  color: var(--color-text);

  #footer_logo {
    margin-inline: auto;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='206' height='39' fill='none' viewBox='0 0 206 39'%3E%3Cpath fill='%23fff' d='M94.9072 36q-4.954 0-8.2868-2.0802-3.2877-2.0802-4.954-5.6653Q80 24.6251 80 20.0221t1.6664-8.2323q1.7114-3.6294 4.9991-5.7096Q89.9982 4 94.9072 4t8.1968 2.1245c2.222 1.3868 3.888 3.29 4.999 5.7095 1.111 2.3901 1.666 5.1194 1.666 8.1881 0 3.0392-.57 5.7686-1.711 8.1881-1.111 2.4196-2.762 4.3228-4.954 5.7096Q99.8161 36 94.9072 36m0-2.213q4.1434 0 6.8458-1.8589 2.7015-1.859 4.008-5.0014c.871-2.095 1.306-4.3965 1.306-6.9046q0-2.8326-.765-5.3112c-.481-1.6819-1.216-3.1572-2.207-4.426q-1.4865-1.9032-3.783-2.9654-2.2973-1.1065-5.4048-1.1065-4.1433 0-6.8906 1.9032-2.7023 1.9032-4.0533 5.0456-1.3062 3.0983-1.3061 6.8603 0 3.718 1.3511 6.8603 1.351 3.1425 4.0533 5.0457 2.7473 1.859 6.8456 1.8589M115.293 35.6459v-23.325h2.432l.045 4.6915c.661-1.2982 1.471-2.3015 2.432-3.0096q1.4415-1.0623 3.153-1.4606 1.7115-.3984 3.423-.3984h.675v2.2573h-.675c-2.102 0-3.814.4426-5.135 1.3278-1.321.8557-2.297 2.036-2.927 3.5408-.601 1.5049-.901 3.2162-.901 5.1342v11.242zM136.384 35.6459l-7.206-23.325h2.793l6.305 21.0678 6.62-21.0678h3.783l6.621 21.0678 6.26-21.0678h2.837l-7.296 23.325h-3.648l-6.665-20.8022-6.666 20.8022zM178.602 35.9557c-2.522 0-4.609-.5163-6.26-1.5491q-2.4765-1.549-3.693-4.2489c-.781-1.7999-1.171-3.8506-1.171-6.1522 0-2.2425.42-4.2637 1.261-6.0636q1.2615-2.744 3.738-4.3375c1.651-1.0622 3.678-1.5933 6.08-1.5933 1.741 0 3.243.3245 4.504.9737 1.261.6196 2.312 1.4606 3.152 2.5228.841 1.0622 1.472 2.272 1.892 3.6293q.63 2.036.675 4.249.045.3098 0 .6639v.7524h-18.735c.09 1.7114.45 3.2458 1.081 4.6031.63 1.3573 1.561 2.4343 2.792 3.2309 1.261.7672 2.883 1.1508 4.864 1.1508.841 0 1.697-.1033 2.567-.3098.901-.2361 1.712-.5902 2.432-1.0623.751-.5016 1.321-1.1655 1.712-1.9917h2.702c-.45 1.2983-1.186 2.3606-2.207 3.1868q-1.5315 1.195-3.468 1.7704t-3.918.5753m-8.512-13.278h16.168q-.09-2.3457-.99-4.2489-.9015-1.9474-2.658-3.054-1.7115-1.1507-4.233-1.1507c-1.712 0-3.168.3983-4.369 1.195s-2.131 1.8294-2.792 3.0982-1.036 2.6556-1.126 4.1604M194.373 35.6459V4.3541h2.567v31.2918zM203.433 35.6459V4.3541H206v31.2918z'/%3E%3Cpath fill='%236d7c75' d='M33.5405 0H37l-4.3529 7H29z'/%3E%3Cpath fill='%23c0c7c5' d='M42.2054 0H34l14.6263 23H57z'/%3E%3Cpath fill='%23bfd583' d='M18.9956 9h9.3584L9 39H0z'/%3E%3Cpath fill='%2389bb24' d='M31.8038 9H19.6846L39 39h12z'/%3E%3Cpath fill='%23056e30' d='M60.7478 13H63l-5 7.4368L57 19z'/%3E%3Cpath fill='%232ea935' d='M65.1826 13H61l8.8174 14H74z'/%3E%3C/svg%3E");

    @media (width >= 992px) {
      margin-inline: initial;
    }
  }

  a {
    display: inline-block;

    &[href^="tel:"] {
      --color-link: var(--color-light-green);
      --color-link-hover: var(--color-orange);
      font-weight: 800;
    }
  }

  .footer_container,
  .footer_safespaces {
    display: flex;
    flex-direction: column;
  }

  .footer_container {
    gap: var(--gap-m);
    align-items: center;
    text-align: center;

    .footer_menu {
      display: flex;
      flex-flow: column nowrap;
      gap: calc(var(--gap-s) / 2) var(--gap-m);

      li {
        list-style: none;

        a {
          padding: calc(var(--gap-xxs) / 2) 0;
          font-weight: 400;
        }
      }
    }

    @media (width >= 576px) {
      .footer_menu {
        max-width: 418px;
        flex-flow: row wrap;

        li {
          flex-basis: calc(50% - (var(--gap-m) / 2));

          a {
            min-width: 189px;
          }
        }
      }
    }

    @media (width >= 992px) {
      flex-direction: row;
      justify-content: space-between;
      align-items: flex-start;

      .footer_column {
        &:first-of-type {
          max-width: 384px;
          text-align: left;
        }

        &:last-of-type {
          max-width: 320px;
          text-align: right;
        }
      }

      .footer_menu {
        li {
          text-align: left;
        }
      }
    }
  }

  .footer_safespaces {
    gap: var(--gap-s);
    margin-top: var(--gap-l);
    background-color: hsl(from var(--color-white) h s l / 0.08);
    padding: var(--gap-s) var(--gap-m);
    border-radius: var(--border-radius-l);

    .logo_container,
    .links_container {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
    }

    .logo_container {
      gap: calc(var(--gap-s) / 2) var(--gap-s);

      img {
        max-width: 120px;
      }
    }

    .links_container {
      a {
        position: relative;
        isolation: isolate;
        margin: var(--gap-m) 0 0 0;
        padding: calc(var(--gap-xxs) / 2) 0;

        &::before {
          content: "";
          position: absolute;
          top: calc(0px - (var(--gap-m) / 2));
          left: 50%;
          transform: translateX(-50%);
          display: block;
          width: 28px;
          height: 1px;
          background-color: var(--color-white);
        }

        &:first-of-type {
          margin: 0;

          &::before {
            display: none;
          }
        }
      }
    }

    @media (width >= 576px) {
      .logo_container,
      .links_container {
        flex-direction: row;
        justify-content: center;
      }

      .links_container {
        a {
          margin: 0 0 0 var(--gap-m);

          &::before {
            top: 50%;
            left: calc(0px - (var(--gap-m) / 2));
            transform: translateY(-50%);
            width: 1px;
            height: 28px;
          }
        }
      }
    }

    @media (width >= 992px) {
      flex-direction: row;
      justify-content: space-between;

      .logo_container {
        justify-content: flex-start;
      }
    }
  }
}

.end_of_page {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: calc(var(--gap-m) / 2) var(--gap-m);

  .marketing_by {
    display: flex;
    align-items: center;
    gap: var(--gap-xxs);

    a {
      height: 23px;
      transition: opacity 0.4s ease;

      &:is(:hover, :focus) {
        opacity: 0.7;
      }
    }
  }

  @media (width >= 800px) {
    flex-direction: row;
    justify-content: space-between;
  }
}
