.footer-with-svg-overlay {
  position: relative;
  overflow: hidden;
}

/* .footer-svg-first {
  transform-origin: bottom;
  animation: waveFtFirst 12s ease-in-out infinite alternate;
} */

@keyframes waveFtFirst {
  0% {
    d: path("M11.5 465.717L0.000976562 465.075L11.5 259.139V465.717ZM755.845 40.5547C864.566 39.6147 909.516 39.621 962.054 42.5547C1099.84 50.2485 1130.15 54.4448 1178.21 63.6387C1201.71 68.134 1270.6 78.3894 1334.89 117.152C1225.94 78.8753 1083.99 74.9653 855.5 81.4932C605.704 88.6296 219.033 150.844 14.6797 202.191L18.1758 139.582C18.0378 142.077 43.3107 129.498 168.315 105.399C293.324 81.2999 291.044 83.718 336.203 76.2139C381.362 68.7097 441.109 62.0112 519.704 54.4111C631.571 43.5936 699.839 41.0389 755.845 40.5547Z"
      );
  }

  100% {
    d: path("M 11.5 465.717 L 0.001 465.075 L 11.5 259.139 V 465.717 Z M 755.845 40.5547 C 864.566 39.6147 909.516 39.621 962.054 42.5547 C 1099.84 50.2485 1130.15 54.4448 1178.21 63.6387 C 1201.71 68.134 1243 77 1289 135 C 1151 78 974 69 965 67 C 855 62 411 5 8 165 L 18.1758 139.582 C 18.0378 142.077 43.3107 129.498 161 92 C 235 72 254 58 334 50 C 430 39 453 39 524 37 C 631.571 43.5936 721 40 755.845 40.5547 Z"
      );
  }
}

/* .footer-svg-second {
  transform-origin: bottom;
  animation: waveFtsec 12s ease-in-out infinite alternate;
} */

@keyframes waveFtsec {
  0% {
    d: path("M1030 64.9998C712.8 37.7998 211.167 113 0 154V-128.5H1467.5V186.5C1467.5 165.167 1347.2 92.1998 1030 64.9998Z"
      );
  }

  100% {
    d: path("M 652 47 C 331 28 143 88 0 154 V -128.5 H 1467.5 V 183 C 1232 151 1303 93 880 56 Z"
      );
  }
}

.footer-with-svg-overlay .footer-crop-svg {
  position: absolute;
  top: -1px;
  left: 0;
  right: 0;
  display: block;
  width: 100%;
  min-width: 100%;
  height: auto;
  pointer-events: none;
  z-index: 2;
}

#footer ul.contacts a:hover,
#footer #menu-footer li a:hover,
#footer #menu-footer-1 li a:hover,
#footer .menu-footer-container .contacts li:hover i,
#footer .footer-sub-menu li a:hover {
  color: var(--color3);
}

#footer {
  background-color: var(--color1);
  background: linear-gradient(180deg, rgb(2 76 92) 0%, rgb(0 114 138) 46%);
}

#footer .footer-bg {
  padding-top: clamp(56px, 17vw, 240px);
}

#footer .footer-logodesc p {
  color: var(--white);
  margin: 29px 0 26px;
  text-align: justify;
}

#footer .footer-menu-column .title {
  color: var(--white);
  font-family: var(--main_font);
  font-size: 1.125rem;
  line-height: 1.6;
  margin-bottom: 1.25rem;
}

#footer .footer-menu-column {
  margin-bottom: 60px;
}

#footer ul.contacts li a,
#footer #menu-footer li a,
#footer #menu-footer-1 li a,
#footer .footer-sub-menu li a {
  color: var(--white);
  font-family: var(--regular);
  font-size: 15px;
}

#footer ul.contacts li a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

#footer ul.contacts li a.footer-email {
  font-family: var(--english);
}

#footer .copyright {
  padding: 1rem 0;
  background-color: #fff;
}

#footer .copyright-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#footer .copyright p {
  color: var(--color2);
  font-family: var(--main_font);
  font-size: 14px;
}

#footer .copyright span {
  font-family: var(--bold);
  color: var(--color3);
}

#footer .footer-socials {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

#footer .footer-socials a {
  font-size: 18px;
  color: var(--white);
  border-radius: 50%;
  width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  background-color: var(--color3);
}

#footer .footer-socials a:hover {
  background-color: var(--white);
  color: var(--color3);
}

#footer .namad-scripts {
  flex-direction: column;
  gap: 0.5rem;
}

#footer .footer-logodesc {
  margin-bottom: 2.5rem;
}

#footer .menu-footer-container .contacts li i {
  width: 1.25rem;
  height: 1.25rem;
  font-size: 1.125rem;
  color: var(--white);
  transition: 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
}

#footer .menu-footer-container .contacts li i.icon-mail {
  font-size: 1rem;
}

@media screen and (min-width: 62em) {

  ul.contacts,
  .menu-footer-container,
  .footer-sub-menu {
    display: flex !important;
    flex-direction: column;
    gap: 0.75rem;
  }

  #footer .title {
    pointer-events: none;
  }

  /* Desktop: content-sized columns + equal gaps (override Bootstrap cols) */
  #footer .footer-columns {
    display: grid;
    grid-template-columns: 1fr auto auto auto auto;
    column-gap: clamp(1.5rem, 2.5vw, 2.5rem);
    row-gap: 0;
    align-items: start;
    margin-left: 0;
    margin-right: 0;
  }

  #footer .footer-columns>.footer-col {
    width: auto;
    max-width: none;
    flex: none;
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
    align-items: flex-start !important;
  }

  #footer .footer-columns>.footer-col--brand {
    margin-inline: 0;
    min-width: 0;
  }
}

@media screen and (max-width: 992px) {
  #footer {
    padding-top: 3rem;
    overflow-anchor: none;
  }

  .footer-logo {
    display: table;
    margin: auto;
  }

  .accordion-title+ul.contacts,
  .accordion-title+.menu-footer-container {
    max-height: 0;
    overflow: hidden;
    padding: 0 1rem;
    margin: 0;
    transition: max-height 0.45s ease-in-out;
    position: relative;
  }

  .accordion-title.active+ul.contacts,
  .accordion-title.active+.menu-footer-container {
    max-height: 400px;
    padding: 1.5rem 1rem 0;
  }

  #footer .footer-menu-column ul {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  #footer .title.accordion-title:after {
    content: "\e912";
    font-family: "icomoon";
    line-height: 2px;
    transition: 0.4s;
    font-size: 8px;
  }

  #footer .accordion-title.active:after {
    transition: 0.4s;
    transform: rotate(180deg);
  }

  #footer .footer-menu-column {
    margin-bottom: 1rem;
    position: relative;
    background: #005264;
    padding: 1rem;
    transition: 0.3s;
    border-radius: 1.5rem;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    flex-direction: column;
  }

  #footer .footer-socials {
    justify-content: center;
  }

  #footer .title.accordion-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 0px;
  }

  #footer .title.accordion-title.active {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }

  .wrap-contact h4,
  .contacts li a {
    color: #fff;
  }

  #footer .namad-scripts {
    margin-bottom: 2rem;
  }

  #footer .footer-bg::before {
    content: "";
    position: absolute;
    background-image: url(../img/sadaf-right.svg);
    background-size: contain;
    background-position: right;
    background-repeat: no-repeat;
    width: 190px;
    height: 180px;
    z-index: 1;
    right: 0;
    top: -2rem;
  }
}

@media screen and (max-width: 768px) {
  #footer .copyright-content {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}

@media screen and (min-width: 992px) {
  #footer .footer-bg {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
  }

  #footer .footer-bg::before {
    content: "";
    position: absolute;
    background-image: url(../img/sadaf-right.svg);
    background-size: contain;
    background-position: right;
    background-repeat: no-repeat;
    width: 381px;
    height: 317px;
    z-index: 1;
    right: 9rem;
    top: -4rem;
  }

  #footer .footer-bg::after {
    content: "";
    position: absolute;
    background-image: url(../img/sadaf-left.svg);
    background-size: contain;
    background-position: left;
    background-repeat: no-repeat;
    width: 510px;
    height: 425px;
    z-index: 1;
    left: -7rem;
    bottom: -7rem;
  }
}

#footer .footer-bg::after {
  animation: smoothRotateOpacity 12s ease-in-out infinite alternate;
}

@keyframes smoothRotateOpacity {
  0% {
    transform: rotate(0deg);
    opacity: 0.8;
  }

  100% {
    transform: rotate(10deg);
    opacity: 0.3;
  }
}

/* --------------------
    Quick Access Menu
-------------------- */
@media screen and (max-width: 576px) {
  .quick-access-menu-wrapper {
    position: fixed;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    aspect-ratio: 376 / 130;
    overflow: hidden;
    z-index: 40;
  }

  #footer .copyright {
    padding-bottom: 7rem;
  }

  .quick-access-menu-wrapper .quick-access-crop-svg {
    position: absolute;
    left: 50%;
    bottom: calc((-30 / 130) * 100%);
    transform: translateX(-50%);
    display: block;
    width: calc((376 / 320) * 100%);
    min-width: calc((376 / 320) * 100%);
    height: auto;
    pointer-events: none;
    z-index: 1;
    box-shadow: 0px -3px 28px 0px #0000000a;
  }

  .quick-access-menu-wrapper .quick-access-menu {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    z-index: 2;
  }

  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-home {
    flex-shrink: 0;
  }

  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-home a {
    position: absolute;
    top: calc((80 / 189) * 100% - 3rem);
    right: 50%;
    transform: translateX(50%);
    width: 4rem;
    height: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: var(--color1);
    box-shadow: 0px 4px 52px 0px #06738c52;
    color: var(--white);
    font-size: 1.5rem;
    transition: 0.3s;
  }

  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-list {
    position: absolute;
    top: 75%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    padding: 0 clamp(1rem, 5vw, 2rem);
    margin: 0;
    list-style: none;
  }

  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-list li {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-list li>a,
  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-list li>button,
  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-list li .header-search.quick-access-item {
    flex-direction: column;
    display: flex;
    align-items: center;
    gap: 6px;
    width: auto;
    min-width: 2.5rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: #575757;
    font-size: 1.5rem;
    line-height: 1;
  }

  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-list .quick-access-label {
    display: block;
    font-size: 0.75rem;
    font-family: var(--main_font);
    color: #575757;
    white-space: nowrap;
    transition: 0.3s;
  }

  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-list li i {
    width: 1.25rem;
    height: 1.25rem;
    font-size: 1.25rem;
    color: #575757;
    transition: 0.3s;
  }

  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-list li:hover i,
  .quick-access-menu-wrapper .quick-access-menu .quick-access-menu-list li:hover span {
    color: var(--color2);
  }
}

@media screen and (min-width: 1920px) {
  #footer .footer-bg {
    padding-top: 320px;
  }

  #footer .footer-bg::before {
    top: 4rem;
  }
}