/* Footer Styles from mainf.css */

/* Стили для контейнера футера */
#footer-container {
  width: 100% !important;
  display: flex !important;
  justify-content: center;
  background-color: #F8F9FA !important;
  padding: 0 !important;
  margin: 0 !important;
}

.element .text {
  position: relative;
  width: 58px;
  height: 16px;
}

.element .text-navbar-primary {
  width: 98.28%;
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: var(--gray-0);
  font-size: 14px;
  letter-spacing: 0;
  line-height: 16px;
  white-space: nowrap;
}

.element .section {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  position: relative;
  flex: 0 0 auto;
}

.element .pages {
  display: inline-flex;
  align-items: center;
  gap: 24px;
  padding: 12px 0px;
  position: relative;
  flex: 0 0 auto;
}

.element .footer,
footer.footer.element {
  display: flex !important;
  justify-content: center;
  gap: 24px;
  padding: 40px 80px !important;
  max-width: 100% !important;
  margin: 0 !important;
  position: relative;
  width: 100% !important;
  flex: 0 0 auto;
  background-color: #F8F9FA !important;
  flex-direction: row !important;
  overflow-x: hidden !important;
}

.element .text-navbar-gray-wrapper {
  position: relative;
  width: 110px;
  height: 16px;
}

.element .text-navbar-gray {
  width: 100%;
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: var(--gray-0);
  font-size: 14px;
  letter-spacing: 0;
  line-height: 16px;
  white-space: nowrap;
}

.element .div-wrapper {
  position: relative;
  width: 136px;
  height: 16px;
}

.element .text-wrapper {
  width: 99.26%;
  height: 100%;
  top: 0;
  font-weight: 500;
  color: var(--gray-0);
  line-height: 16px;
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter", Helvetica;
  font-size: 14px;
  letter-spacing: 0;
  white-space: nowrap;
}

.element .div {
  position: relative;
  width: 84px;
  height: 16px;
}

.element .text-navbar-gray-2 {
  width: 98.81%;
  height: 100%;
  top: 0;
  font-weight: 500;
  color: var(--gray-0);
  line-height: 16px;
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter", Helvetica;
  font-size: 14px;
  letter-spacing: 0;
  white-space: nowrap;
}

.element .text-3 {
  position: relative;
  width: 68px;
  height: 16px;
}

.element .text-navbar-gray-3 {
  width: 97.92%;
  height: 100%;
  top: 0;
  font-weight: 500;
  color: var(--gray-0);
  line-height: 16px;
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter", Helvetica;
  font-size: 14px;
  letter-spacing: 0;
  white-space: nowrap;
}

.element .text-navbar-gray-4 {
  width: 98.53%;
  height: 100%;
  top: 0;
  font-weight: 500;
  color: var(--gray-0);
  line-height: 16px;
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter", Helvetica;
  font-size: 14px;
  letter-spacing: 0;
  white-space: nowrap;
}

.element .text-navbar-gray-5 {
  width: 98.81%;
  height: 125.00%;
  top: -12.50%;
  font-weight: var(--text-SB-14-font-weight);
  color: #101113;
  line-height: var(--text-SB-14-line-height);
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--text-SB-14-font-family);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .text-navbar-gray-6 {
  width: 100.74%;
  height: 125.00%;
  top: -12.50%;
  font-weight: var(--text-SB-14-font-weight);
  color: #101113;
  line-height: var(--text-SB-14-line-height);
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--text-SB-14-font-family);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .text-navbar-gray-8 {
  width: 101.82%;
  height: 125.00%;
  top: -12.50%;
  font-weight: var(--text-SB-14-font-weight);
  color: #101113;
  line-height: var(--text-SB-14-line-height);
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--text-SB-14-font-family);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .div-3 {
  flex-direction: column;
  gap: 24px;
  display: flex;
  align-items: flex-start;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.element .email-box {
  display: flex;
  flex-direction: column;
  max-width: 372px;
  align-items: flex-start;
  gap: 24px;
  padding: 20px;
  position: relative;
  align-self: stretch;
  margin-left: -4.00px;
  background-color: #ffffff;
  border-radius: 24px;
}

.element .text-wrapper-37 {
  position: relative;
  align-self: stretch;
  margin-top: -1.00px;
  font-family: var(--head-04-font-family);
  font-weight: var(--head-04-font-weight);
  color: var(--dark-9);
  font-size: var(--head-04-font-size);
  letter-spacing: var(--head-04-letter-spacing);
  line-height: var(--head-04-line-height);
  font-style: var(--head-04-font-style);
}

.element .input-unstyled {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 5px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  background-color: var(--gray-0);
  border-radius: 40px;
  border: 1px solid;
  border-color: #dee2e6;
}

.element .container {
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  border-radius: 2px;
}

.element .left-container {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 1px 16px;
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.element .icon {
  width: 16px;
  height: 16px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  position: relative;
}

.element .img-9 {
  position: relative;
  flex: 1;
  align-self: stretch;
  flex-grow: 1;
}

.element .text-wrapper-38 {
  position: relative;
  flex: 1;
  margin-top: -1.00px;
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #868e96;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 48px;
}

.element .checkbox {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  border-radius: 2px;
}

.element .icon-wrapper {
  background-color: var(--yellow-5);
  position: relative;
  width: 24px;
  height: 24px;
  border-radius: 2px;
}

.element .check-wrapper {
  width: 50.00%;
  height: 50.00%;
  top: 25.00%;
  left: 25.00%;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  position: relative;
}

.element .label {
  position: relative;
  flex: 1;
  margin-top: -1.00px;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: var(--dark-9);
  font-size: 14px;
  letter-spacing: 0;
  line-height: 14px;
}

.element .text-wrapper-39 {
  color: #101113;
  font-weight: var(--text-m-14-font-weight);
  line-height: var(--text-m-14-line-height);
  font-family: var(--text-m-14-font-family);
  font-style: var(--text-m-14-font-style);
  letter-spacing: var(--text-m-14-letter-spacing);
  font-size: var(--text-m-14-font-size);
}

.element .text-wrapper-40 {
  font-weight: var(--text-m-14-font-weight);
  color: #868e96;
  line-height: var(--text-m-14-line-height);
  font-family: var(--text-m-14-font-family);
  font-style: var(--text-m-14-font-style);
  letter-spacing: var(--text-m-14-letter-spacing);
  font-size: var(--text-m-14-font-size);
}

.element .checkbox-2 {
  border: 1px solid;
  border-color: #dee2e6;
  position: relative;
  width: 24px;
  height: 24px;
  border-radius: 2px;
}

.element .info-box {
  display: flex;
  flex-direction: column;
  max-width: 924px;
  align-items: flex-start;
  gap: 24px;
  position: relative;
}

.p1,
.p2 {
  text-decoration: underline;
}

.custom-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
  user-select: none;
}

.custom-checkbox input {
  display: none;
}

.custom-checkbox .checkmark {
  width: 24px;
  height: 24px;
  min-width: 24px;
  background: #fff url("img/icons/Checkbox.svg") center/contain no-repeat;
  border-radius: 4px;
  flex-shrink: 0;
  transition: 0.2s ease-in-out;
}

.custom-checkbox input:checked+.checkmark {
  background: #fff url("img/icons/Checkbox-checked.svg") center/contain no-repeat;
}

.custom-checkbox .label-text {
  font-size: 14px;
  color: #333;
  line-height: 24px;
}

.element .pages-2 {
  min-height: 149px;
  display: flex;
  align-items: flex-start;
  gap: 48px;
  padding: 20px;
  align-self: stretch;
  width: 100%;
  background-color: #ffffff;
  border-radius: 24px;
  position: relative;
  flex: 0 0 auto;
}

.element .div-13 {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 16px;
  position: relative;
  flex: 0 0 auto;
}

.element .text-navbar-gray-wrapper {
  position: relative;
  width: 110px;
  height: 16px;
}

.element .text-2 {
  position: relative;
  width: 48px;
  height: 16px;
}

.element .text-navbar-gray-7 {
  width: 100%;
  height: 125.00%;
  top: -12.50%;
  font-weight: var(--text-SB-14-font-weight);
  color: #101113;
  line-height: var(--text-SB-14-line-height);
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--text-SB-14-font-family);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .text-navbar-primary-3 {
  width: 56.01%;
  color: var(--gray-7);
  position: absolute;
  height: 125.00%;
  top: -12.50%;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-family: var(--text-SB-14-font-family);
  font-weight: var(--text-SB-14-font-weight);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  line-height: var(--text-SB-14-line-height);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .text-navbar-primary-4 {
  width: 88.61%;
  color: var(--gray-7);
  position: absolute;
  height: 125.00%;
  top: -12.50%;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-family: var(--text-SB-14-font-family);
  font-weight: var(--text-SB-14-font-weight);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  line-height: var(--text-SB-14-line-height);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .text-navbar-primary-5 {
  width: 97.15%;
  color: var(--gray-7);
  position: absolute;
  height: 125.00%;
  top: -12.50%;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-family: var(--text-SB-14-font-family);
  font-weight: var(--text-SB-14-font-weight);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  line-height: var(--text-SB-14-line-height);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .text-navbar-primary-6 {
  width: 42.72%;
  color: var(--gray-7);
  position: absolute;
  height: 125.00%;
  top: -12.50%;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-family: var(--text-SB-14-font-family);
  font-weight: var(--text-SB-14-font-weight);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  line-height: var(--text-SB-14-line-height);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .text-navbar-gray-9 {
  width: 101.72%;
  height: 125.00%;
  top: -12.50%;
  font-weight: var(--text-SB-14-font-weight);
  color: #101113;
  line-height: var(--text-SB-14-line-height);
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--text-SB-14-font-family);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .text-navbar-gray-7 {
  width: 100%;
  height: 125.00%;
  top: -12.50%;
  font-weight: var(--text-SB-14-font-weight);
  color: #101113;
  line-height: var(--text-SB-14-line-height);
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--text-SB-14-font-family);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .text-navbar-primary-wrapper {
  position: relative;
  width: 316px;
  height: 16px;
}

.element .text-wrapper-41 {
  position: relative;
  width: 130px;
  margin-top: -1.00px;
  font-family: var(--text-m-14-font-family);
  font-weight: var(--text-m-14-font-weight);
  color: #868e96;
  font-size: var(--text-m-14-font-size);
  letter-spacing: var(--text-m-14-letter-spacing);
  line-height: var(--text-m-14-line-height);
  font-style: var(--text-m-14-font-style);
}

.element .text-navbar-primary-2 {
  width: 98.28%;
  color: #101113;
  position: absolute;
  height: 125.00%;
  top: -12.50%;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-family: var(--text-SB-14-font-family);
  font-weight: var(--text-SB-14-font-weight);
  font-size: var(--text-SB-14-font-size);
  letter-spacing: var(--text-SB-14-letter-spacing);
  line-height: var(--text-SB-14-line-height);
  white-space: nowrap;
  font-style: var(--text-SB-14-font-style);
}

.element .media {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 10px;
  position: relative;
  flex: 0 0 auto;
}

a {
  color: inherit;
  text-decoration: none;
}

.element .img-8 {
  position: relative;
  width: 24px;
  height: 24px;
}

.element .icons {
  display: inline-flex;
  align-items: flex-start;
  gap: 24px;
  position: relative;
  flex: 0 0 auto;
}

.element .icons a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease, opacity 0.3s ease;
  border-radius: 8px;
  padding: 4px;
}

.element .icons a:hover {
  transform: scale(1.1);
  opacity: 0.8;
}

.element .icons a:focus {
  outline: 2px solid #fcc419;
  outline-offset: 2px;
}

.element .contacts {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  position: relative;
  flex: 0 0 auto;
}

.element .privacy-policy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 20px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  background-color: var(--dark-9);
  border-radius: 24px;
}

.element .div-14 {
  position: relative;
  align-self: stretch;
  margin-top: -1.00px;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #dee2e6;
  font-size: 14px;
  letter-spacing: 0;
  line-height: 14px;
}

.element .text-wrapper-42 {
  font-weight: 500;
  line-height: 16.8px;
}

.element .text-wrapper-43 {
  font-weight: var(--text-SB-14-font-weight);
  line-height: var(--text-SB-14-line-height);
  font-family: var(--text-SB-14-font-family);
  font-style: var(--text-SB-14-font-style);
  letter-spacing: var(--text-SB-14-letter-spacing);
  font-size: var(--text-SB-14-font-size);
}

.element .text-wrapper-44 {
  position: relative;
  align-self: stretch;
  font-family: var(--text-m-14-font-family);
  font-weight: var(--text-m-14-font-weight);
  color: #dee2e6;
  font-size: var(--text-m-14-font-size);
  letter-spacing: var(--text-m-14-letter-spacing);
  line-height: var(--text-m-14-line-height);
  font-style: var(--text-m-14-font-style);
}

/* Accessibility and semantic improvements */
.text-wrapper-38 {
  border: none;
  background: transparent;
  outline: none;
  width: 100%;
}

.icon-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.icon-wrapper input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
}

.checkbox-2 input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
}

.checkbox label {
  cursor: pointer;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

/* Focus styles for accessibility */
button:focus,
input:focus,
summary:focus,
[role="tab"]:focus {
  outline: 1px solid transparent;
  outline-offset: 1px;
}

/* Interactive states */
button:hover {
  opacity: 0.9;
  transition: opacity 0.2s ease;
}

[role="tab"] {
  cursor: pointer;
}

[role="tab"]:hover {
  opacity: 0.8;
}

/* Form improvements */
form {
  width: 100%;
}

input[type="email"] {
  font-family: "Inter", Helvetica;
  font-weight: 500;
  color: #868e96;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 48px;
}

input[type="email"]:focus {
  color: var(--dark-9);
}

/* Address styling */
address {
  font-style: normal;
}

.soc-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
}

.soc-link {
  transform: scale(1);
  transition: .3s;
}

.soc-link:hover {
  transform: scale(1.1);
}

.btn-submit {
  width: 40px;
  height: 40px;
  background: url("img/icons/arrow-narrow-right.svg") right center no-repeat;
  border: none;
  cursor: pointer;
  transition: .3s;
}

.btn-submit:hover {
  opacity: .8;
}

/* Стили для навигационных ссылок в футере */
.element .text-navbar-gray-5,
.element .text-navbar-gray-6,
.element .text-navbar-gray-7,
.element .text-navbar-gray-8,
.element .text-navbar-gray-9 {
  text-decoration: none;
  transition: color 0.3s ease, opacity 0.3s ease;
  cursor: pointer;
}

.element .text-navbar-gray-5:hover,
.element .text-navbar-gray-6:hover,
.element .text-navbar-gray-7:hover,
.element .text-navbar-gray-8:hover,
.element .text-navbar-gray-9:hover {
  color: #fcc419;
  opacity: 0.8;
}

.element .text-navbar-gray-5:focus,
.element .text-navbar-gray-6:focus,
.element .text-navbar-gray-7:focus,
.element .text-navbar-gray-8:focus,
.element .text-navbar-gray-9:focus {
  outline: 2px solid #fcc419;
  outline-offset: 2px;
}

/* ===== АДАПТИВНЫЕ СТИЛИ ФУТЕРА ===== */

/* Разрешение 1280px и меньше - горизонтальная компоновка как на скрине 1 */
@media (max-width: 1280px) {
  .element .footer {
    flex-direction: row;
    gap: 32px;
    padding: 0px 20px;
    align-items: flex-start;
  }

  /* Блок подписки слева */
  .element .email-box {
    flex: 0 0 auto;
    max-width: 300px;
    width: 300px;
    margin: 0;
    order: 1;
  }

  /* Правая часть с навигацией */
  .element .info-box {
    flex: 1;
    order: 2;
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: calc(100% - 332px);
    overflow: hidden;
  }

  /* Навигационные блоки в 4 колонки */
  .element .pages-2 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 16px 24px;
  }

  /* Первый ряд: все навигационные блоки */
  .element .pages-2 > .div-13:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .element .pages-2 > .div-13:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }

  .element .pages-2 > .media {
    grid-column: 3;
    grid-row: 1;
  }

  .element .pages-2 > .contacts {
    grid-column: 4;
    grid-row: 1;
  }

  /* Контакты в одну колонку */
  .element .pages-2 > .contacts {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
  }

  /* Уменьшаем шрифт для контактов */
  .element .contacts .text-navbar-primary-3,
  .element .contacts .text-navbar-primary-4,
  .element .contacts .text-navbar-primary-5,
  .element .contacts .text-navbar-primary-6 {
    font-size: 12px;
    line-height: 1.3;
    word-wrap: break-word;
    word-break: break-word;
    white-space: normal !important;
  }

  .element .div-13 {
    align-items: flex-start;
    text-align: left;
  }

  .element .media {
    align-items: flex-start;
    text-align: left;
  }

  .element .contacts {
    align-items: flex-start;
    text-align: left;
  }

  .element .icons {
    justify-content: flex-start;
  }
}

/* Разрешение 1080px и меньше - как на скрине 2 с синими рамками */
@media (max-width: 1080px) {
  .element .footer {
    flex-direction: column;
    gap: 24px;
    padding: 0px 20px;
    align-items: stretch;
  }

  /* Блок подписки сверху */
  .element .email-box {
    max-width: 100%;
    width: 100%;
    order: 1;
    margin: 0 auto;
    max-width: 500px;
  }

  /* Правая часть с навигацией */
  .element .info-box {
    max-width: 100%;
    order: 2;
  }

  /* Навигационные блоки в 3 колонки */
  .element .pages-2 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 24px 32px;
  }

  /* Первый ряд: "Компания", "Услуги", "Мы в соц сетях" */
  .element .pages-2 > .div-13:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .element .pages-2 > .div-13:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }

  .element .pages-2 > .media {
    grid-column: 3;
    grid-row: 1;
  }

  /* Второй ряд: "Контакты" на всю ширину */
  .element .pages-2 > .contacts {
    grid-column: 1 / -1;
    grid-row: 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
    gap: 8px 32px;
    align-items: flex-start;
  }

  /* Заголовок "Контакты" на всю ширину */
  .element .contacts .text-wrapper-41 {
    grid-column: 1 / -1;
    grid-row: 1;
    margin-bottom: 8px;
  }

  /* Левая колонка: название компании */
  .element .contacts .text-navbar-primary-wrapper:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
  }

  /* Левая колонка: реквизиты */
  .element .contacts .text-navbar-primary-wrapper:nth-child(3) {
    grid-column: 1;
    grid-row: 3;
  }

  /* Правая колонка: адрес */
  .element .contacts .text-navbar-primary-wrapper:nth-child(4) {
    grid-column: 2;
    grid-row: 2;
  }

  /* Правая колонка: телефон */
  .element .contacts .text-navbar-primary-wrapper:nth-child(5) {
    grid-column: 2;
    grid-row: 3;
  }

  /* Размер шрифта для контактов */
  .element .contacts .text-navbar-primary-3,
  .element .contacts .text-navbar-primary-4,
  .element .contacts .text-navbar-primary-5,
  .element .contacts .text-navbar-primary-6 {
    font-size: 13px;
    line-height: 1.4;
    word-wrap: break-word;
    white-space: normal !important;
  }
}

/* Средние экраны 1200px - оптимизируем пространство */
@media (max-width: 1200px) {
  .element .footer {
    flex-direction: row;
    gap: 24px;
    padding: 0px 20px;
    align-items: flex-start;
  }

  /* Блок подписки компактнее */
  .element .email-box {
    flex: 0 0 auto;
    max-width: 280px;
    width: 280px;
    margin: 0;
    order: 1;
  }

  /* Правая часть с навигацией */
  .element .info-box {
    flex: 1;
    order: 2;
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: calc(100% - 304px);
    overflow: hidden;
  }

  /* Навигационные блоки в 2 ряда по 2 колонки */
  .element .pages-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
    gap: 20px 5px;
  }

  /* Первый ряд: "Компания" и "Услуги" */
  .element .pages-2 > .div-13:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .element .pages-2 > .div-13:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }

  /* Второй ряд: "Мы в соц сетях" 
  .element .pages-2 > .media {
    grid-column: 1;
    grid-row: 2;
  }*/

  /* Третий ряд: "Контакты" на всю ширину */
  .element .pages-2 > .contacts {
    grid-column: 1 / -1;
    grid-row: 3;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
    gap: 6px 24px;
    align-items: flex-start;
  }

  /* Заголовок "Контакты" на всю ширину */
  .element .contacts .text-wrapper-41 {
    grid-column: 1 / -1;
    grid-row: 1;
    margin-bottom: 6px;
  }

  /* Левая колонка контактов */
  .element .contacts .text-navbar-primary-wrapper:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
  }

  .element .contacts .text-navbar-primary-wrapper:nth-child(3) {
    grid-column: 1;
    grid-row: 3;
  }

  /* Правая колонка контактов */
  .element .contacts .text-navbar-primary-wrapper:nth-child(4) {
    grid-column: 2;
    grid-row: 2;
  }

  .element .contacts .text-navbar-primary-wrapper:nth-child(5) {
    grid-column: 2;
    grid-row: 3;
  }

  /* Компактные стили для контактов */
  .element .contacts .text-navbar-primary-3,
  .element .contacts .text-navbar-primary-4,
  .element .contacts .text-navbar-primary-5,
  .element .contacts .text-navbar-primary-6 {
    font-size: 13px;
    line-height: 1.3;
    word-wrap: break-word;
    white-space: normal !important;
  }
}

/* Планшеты и мобильные - исправленная версия */
@media (max-width: 1024px) {
  .element .footer {
    flex-direction: column;
    gap: 24px;
    padding: 0px 20px;
  }

  /* Блок подписки компактнее и уже */
  .element .email-box {
    max-width: 160px;
    width: 100%;
    order: 1;
    padding: 20px;
    margin: 0 auto;
  }

  /* Убираем лишние отступы в блоке подписки */
  .element .email-box .text-wrapper-37 {
    margin-bottom: 16px;
  }

  .element .email-box .div-3 {
    gap: 16px;
  }

  /* Навигационные блоки в 3 колонки */
  .element .pages-2 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 24px 32px;
  }

  /* Первый ряд: "Компания", "Услуги", "Мы в соц сетях" */
  .element .pages-2 > .div-13:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .element .pages-2 > .div-13:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }

  .element .pages-2 > .media {
    grid-column: 3;
    grid-row: 1;
  }

  /* Второй ряд: "Контакты" в столбец */
  .element .pages-2 > .contacts {
    grid-column: 1 / -1;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
    width: 100%;
  }

  /* Все элементы контактов в столбец с выравниванием по левому краю */
  .element .contacts .text-wrapper-41,
  .element .contacts .text-navbar-primary-wrapper {
    width: 100%;
    margin-bottom: 0;
    text-align: left !important;
    display: block;
  }

  /* Выравнивание текста в контактах по левому краю */
  .element .contacts .text-navbar-primary-3,
  .element .contacts .text-navbar-primary-4,
  .element .contacts .text-navbar-primary-5,
  .element .contacts .text-navbar-primary-6 {
    text-align: left !important;
    width: 100%;
    word-wrap: break-word;
    white-space: normal !important;
    overflow-wrap: break-word;
  }

  /* Заголовок "Контакты" */
  .element .contacts .text-wrapper-41 {
    text-align: left !important;
    margin-bottom: 8px;
  }

  /* Адрес - обеспечиваем правильный перенос */
  .element .contacts address {
    text-align: left !important;
    white-space: normal !important;
    word-wrap: break-word;
  }

  /* Черный блок политики - возвращаем обычный стиль */
  .element .privacy-policy {
    width: 100% !important;
    max-width: 100% !important;
    margin: 24px 0 0 0 !important;
    padding: 16px 20px !important;
    box-sizing: border-box;
  }

  .element .div-13 {
    align-items: flex-start;
    text-align: left;
  }

  .element .media {
    align-items: flex-start;
    text-align: left;
  }

  .element .contacts {
    align-items: flex-start;
    text-align: left;
  }

  .element .icons {
    justify-content: flex-start;
  }
}

/* Средние планшеты */
@media (max-width: 900px) and (min-width: 601px) {
  .element .footer {
    flex-direction: column;
    padding: 0px 24px;
    gap: 32px;
  }

  .element .email-box {
    max-width: 500px;
    width: 100%;
    margin: 0 auto;
  }

  .element .pages-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
    gap: 32px;
  }

  .element .pages-2 > .div-13:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .element .pages-2 > .div-13:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }

  .element .pages-2 > .media {
    grid-column: 1;
    grid-row: 2;
  }

  .element .pages-2 > .contacts {
    grid-column: 1 / -1;
    grid-row: 3;
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
  }

  .element .div-13,
  .element .media,
  .element .contacts {
    align-items: flex-start;
    text-align: left;
  }

  .element .icons {
    justify-content: flex-start;
  }
}

/* Планшеты и большие мобильные устройства */
@media (max-width: 600px) {
  .element .footer {
    flex-direction: column;
    padding: 0px 20px;
    gap: 24px;
  }

  /* Блок подписки на всю ширину */
  .element .email-box {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
  }

  /* Навигационные блоки в 2 колонки */
  .element .pages-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
    gap: 24px 32px;
  }

  /* Первый ряд: "Компания" и "Услуги" */
  .element .pages-2 > .div-13:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }

  .element .pages-2 > .div-13:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
  }

  /* Второй ряд: "Мы в соц сетях" */
  .element .pages-2 > .media {
    grid-column: 1;
    grid-row: 2;
  }

  /* Третий ряд: "Контакты" на всю ширину */
  .element .pages-2 > .contacts {
    grid-column: 1 / -1;
    grid-row: 3;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
  }

  .element .contacts .text-navbar-primary-wrapper {
    width: 100%;
    margin-bottom: 4px;
  }

  .element .div-13 {
    align-items: flex-start;
    text-align: left;
  }

  .element .media {
    align-items: flex-start;
    text-align: left;
  }

  .element .contacts {
    align-items: flex-start;
    text-align: left;
  }

  .element .icons {
    justify-content: flex-start;
  }
}

/* Мобильные устройства - 3 блока друг за другом */
@media (max-width: 768px) {
  .element .footer,
  footer.footer.element {
    flex-direction: column;
    padding: 20px 20px !important;
    gap: 16px !important;
    width: 100%;
    max-width: 100%;
  }

  /* Блок 1: Подписка на всю ширину */
  .element .email-box {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 0 16px 0 !important;
    padding: 20px 20px 16px 20px !important;
    order: 1;
    border-radius: 16px !important;
    box-sizing: border-box !important;
    gap: 8px !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .element .email-box .text-wrapper-37 {
    font-size: 18px !important;
    line-height: 1.3 !important;
    margin: 0 0 8px 0 !important;
  }

  .element .email-box .div-3 {
    gap: 8px !important;
    margin: 0 !important;
  }

  .element .email-box .custom-checkbox {
    margin: 0 !important;
    padding: 4px 0 !important;
  }

  .element .email-box .custom-checkbox:last-child {
    padding-bottom: 0 !important;
  }

  /* Блок 2: Навигация на всю ширину */
  .element .pages-2 {
    width: 100%;
    padding: 24px 16px;
    margin: 0;
    order: 2;
    display: flex;
    flex-direction: column;
    gap: 24px;
    border-radius: 0;
    box-sizing: border-box;
  }

  /* Навигационные секции в ряд */
  .element .pages-2 > .div-13:nth-child(1),
  .element .pages-2 > .div-13:nth-child(2),
  .element .pages-2 > .media {
    width: 100%;
    margin-bottom: 24px;
  }

  /* Контакты отдельно */
  .element .pages-2 > .contacts {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
    margin-top: 8px;
  }

  .element .contacts .text-navbar-primary-wrapper {
    width: 100%;
    margin-bottom: 8px;
  }

  /* Блок 3: Политика конфиденциальности на всю ширину */
  .element .privacy-policy {
    width: 100%;
    margin: 0;
    padding: 24px 16px;
    order: 3;
    border-radius: 0;
    box-sizing: border-box;
  }
  
  /* Убираем отступы у контейнера футера */
  #footer-container {
    padding: 0;
  }
  
  /* Info-box на всю ширину */
  .element .info-box {
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 0;
  }

  /* Выравнивание элементов по левому краю */
  .element .div-13,
  .element .media,
  .element .contacts {
    align-items: flex-start;
    text-align: left;
  }
  
  .element .icons {
    gap: 20px;
    justify-content: flex-start;
  }
}

/* Маленькие мобильные устройства - под дизайн 375px */
@media (max-width: 480px) {
  .element .footer,
  footer.footer.element {
    gap: 16px !important;
    padding: 16px 16px !important;
    flex-direction: column;
    align-items: stretch;
  }
  
  .element .email-box {
    padding: 20px 20px 10px 20px !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 0 !important;
    border-radius: 16px !important;
    height: auto !important;
  }

  .element .email-box .text-wrapper-37 {
    font-size: 18px !important;
    line-height: 1.3 !important;
    margin-bottom: 8px !important;
  }

  .element .email-box .custom-checkbox {
    margin-bottom: 0 !important;
  }
  
  .element .pages-2 {
    padding: 16px;
    gap: 20px;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  
  .element .text-wrapper-37 {
    font-size: 16px;
    line-height: 1.4;
    text-align: left;
  }
  
  
  .element .icons {
    gap: 20px;
    justify-content: flex-start;
  }
  
  .element .div-13 {
    gap: 12px;
    flex: 1;
    min-width: 120px;
    align-items: flex-start;
    text-align: left;
  }
  
  .element .contacts {
    gap: 12px;
    align-items: flex-start;
    text-align: left;
    width: 100%;
    margin-top: 16px;
  }
  
  .element .media {
    align-items: flex-start;
    text-align: left;
    width: 100%;
    order: -1;
  }
  
  .element .text-wrapper-41 {
    font-size: 14px;
    text-align: left;
    margin-bottom: 10px;
    color: #868e96;
  }
  
  /* Улучшение кнопки отправки */
  .element .btn-submit {
    min-width: 44px;
    min-height: 44px;
  }
  
  /* Улучшение читаемости на маленьких экранах */
  .element .text-navbar-gray-5,
  .element .text-navbar-gray-6,
  .element .text-navbar-gray-7,
  .element .text-navbar-gray-8,
  .element .text-navbar-gray-9 {
    font-size: 15px;
    line-height: 1.6;
    padding: 10px 0;
  }
  
  .element .text-navbar-primary-3,
  .element .text-navbar-primary-4,
  .element .text-navbar-primary-5,
  .element .text-navbar-primary-6 {
    font-size: 13px;
    line-height: 1.6;
  }
}

/* Мобильная версия - основной breakpoint */
@media (max-width: 860px) {
  .element .footer,
  footer.footer.element,
  footer.footer,
  .footer,
  #footer-container .footer,
  #footer-container footer {
    display: flex !important;
    flex-direction: column !important;
    padding: 20px 16px !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .element .email-box,
  footer .email-box,
  #footer-container .email-box {
    padding: 16px 16px 12px 16px !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 16px 0 !important;
    border-radius: 16px !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    flex: none !important;
    align-self: flex-start !important;
  }
  
  /* Ensure other footer blocks are visible */
  .element .info-box,
  footer .info-box,
  .info-box,
  #footer-container .info-box,
  #footer-container footer .info-box {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    order: 2 !important;
    visibility: visible !important;
    opacity: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  
  .element .pages-2,
  footer .pages-2,
  .pages-2,
  #footer-container .pages-2,
  #footer-container footer .pages-2 {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: auto auto auto !important;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
    padding: 24px 16px !important;
    gap: 32px 16px !important;
    background: #FFFFFF !important;
    border-radius: 16px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  }
  
  /* Компания - первая колонка, первая строка */
  .element .pages-2 > .div-13:nth-child(1),
  footer .pages-2 > .div-13:nth-child(1),
  .pages-2 > .div-13:nth-child(1) {
    grid-column: 1 !important;
    grid-row: 1 !important;
    order: 1 !important;
    align-self: start !important;
  }
  
  /* Услуги - вторая колонка, первая строка */
  .element .pages-2 > .div-13:nth-child(2),
  footer .pages-2 > .div-13:nth-child(2),
  .pages-2 > .div-13:nth-child(2) {
    grid-column: 2 !important;
    grid-row: 1 !important;
    order: 2 !important;
    align-self: start !important;
  }
  
  /* Обнуляем все вложенные элементы */
  .element .pages-2 .div-13 *,
  footer .pages-2 .div-13 *,
  .pages-2 .div-13 * {
    margin: 0 !important;
    padding: 0 !important;
  }
  
  /* Восстанавливаем отступы для ссылок */
  .element .pages-2 .div-13 a,
  footer .pages-2 .div-13 a,
  .pages-2 .div-13 a {
    padding: 4px 0 !important;
    display: block !important;
  }
  
  /* Мы в соц сетях - обе колонки, вторая строка */
  .element .pages-2 > .media,
  footer .pages-2 > .media,
  .pages-2 > .media {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    order: 3 !important;
    margin-top: 8px !important;
  }
  
  /* Контакты - обе колонки, третья строка */
  .element .pages-2 > .contacts,
  footer .pages-2 > .contacts,
  .pages-2 > .contacts {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    order: 4 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    align-items: flex-start !important;
    margin-top: 8px !important;
  }
  
  /* Выравнивание всех секций по левому краю */
  .element .div-13,
  footer .div-13,
  .pages-2 .div-13,
  .element .media,
  footer .media,
  .pages-2 .media,
  .element .contacts,
  footer .contacts,
  .pages-2 .contacts {
    text-align: left !important;
    align-items: flex-start !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
  }
  
  /* Отступы между пунктами меню */
  .element .div-13 > div,
  footer .div-13 > div,
  .pages-2 .div-13 > div {
    margin: 0 !important;
  }
  
  /* Заголовки секций */
  .element .text-wrapper-41,
  footer .text-wrapper-41,
  .pages-2 .text-wrapper-41 {
    font-size: 14px !important;
    color: #9CA3AF !important;
    margin-bottom: 12px !important;
    padding: 0 !important;
    text-transform: none !important;
    display: block !important;
  }
  
  /* Контейнеры ссылок */
  .element .pages-2 .div,
  .element .pages-2 .div-wrapper,
  .element .pages-2 .text-3,
  .element .pages-2 .text-2,
  .element .pages-2 .text,
  .element .pages-2 .text-navbar-gray-wrapper,
  footer .pages-2 .div,
  footer .pages-2 .div-wrapper,
  footer .pages-2 .text-3,
  footer .pages-2 .text-2,
  footer .pages-2 .text,
  footer .pages-2 .text-navbar-gray-wrapper {
    margin: 0 !important;
    padding: 0 !important;
  }
  
  /* Ссылки в футере */
  .element .pages-2 a,
  footer .pages-2 a,
  .pages-2 a {
    font-size: 16px !important;
    line-height: 1.5 !important;
    color: #101113 !important;
    text-decoration: none !important;
  }
  
  /* Иконки соцсетей */
  .element .icons,
  footer .icons,
  .pages-2 .icons {
    display: flex !important;
    gap: 16px !important;
    justify-content: flex-start !important;
  }
  
  /* Контакты - размер шрифта */
  .element .contacts .text-navbar-primary-3,
  .element .contacts .text-navbar-primary-4,
  .element .contacts .text-navbar-primary-5,
  .element .contacts .text-navbar-primary-6,
  footer .contacts .text-navbar-primary-3,
  footer .contacts .text-navbar-primary-4,
  footer .contacts .text-navbar-primary-5,
  footer .contacts .text-navbar-primary-6 {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #101113 !important;
  }
  
  .element .privacy-policy,
  footer .privacy-policy,
  .privacy-policy,
  #footer-container .privacy-policy,
  #footer-container footer .privacy-policy {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    order: 3 !important;
    visibility: visible !important;
    opacity: 1 !important;
    padding: 24px 16px !important;
    border-radius: 16px !important;
    margin: 0 !important;
  }

  .element .email-box .text-wrapper-37,
  footer .email-box .text-wrapper-37 {
    font-size: 18px !important;
    line-height: 1.3 !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
  }

  .element .email-box .div-3,
  footer .email-box .div-3,
  .email-box form {
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .element .email-box .input-unstyled,
  footer .email-box .input-unstyled {
    margin: 0 !important;
    padding: 0 !important;
    min-height: auto !important;
    height: auto !important;
  }

  .element .email-box .container,
  footer .email-box .container {
    min-height: auto !important;
    height: auto !important;
    padding: 0 !important;
  }

  .element .email-box .left-container,
  footer .email-box .left-container {
    min-height: auto !important;
    height: auto !important;
    padding: 8px 12px !important;
  }

  .element .email-box .custom-checkbox,
  footer .email-box .custom-checkbox,
  .email-box label {
    margin: 0 !important;
    padding: 4px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .element .email-box .custom-checkbox:last-child,
  footer .email-box .custom-checkbox:last-child,
  .email-box label:last-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .element .email-box .label-text,
  footer .email-box .label-text {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
    flex: 1 !important;
  }
}

/* Очень маленькие экраны */
@media (max-width: 360px) {
  .element .footer {
    gap: 12px;
    padding: 0px 8px;
  }
  
  .element .email-box {
    padding: 8px;
    gap: 12px;
  }
  
  .element .pages-2 {
    padding: 8px;
    gap: 16px;
  }
  
  .element .text-wrapper-37 {
    font-size: 14px;
    line-height: 1.4;
  }
  
  .element .icons {
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
  }
  
  .element .contacts {
    gap: 8px;
  }
  
  .element .privacy-policy {
    padding: 8px;
  }
  
  .element .div-14 {
    font-size: 12px;
    line-height: 1.4;
  }
  
  .element .text-wrapper-41 {
    font-size: 14px;
  }
  
  .element .text-navbar-gray-5,
  .element .text-navbar-gray-6,
  .element .text-navbar-gray-7,
  .element .text-navbar-gray-8,
  .element .text-navbar-gray-9 {
    font-size: 14px;
    line-height: 1.6;
    padding: 8px 0;
  }
  
  .element .text-navbar-primary-3,
  .element .text-navbar-primary-4,
  .element .text-navbar-primary-5,
  .element .text-navbar-primary-6 {
    font-size: 12px;
    line-height: 1.6;
  }
}

/* Горизонтальная ориентация на планшетах - исправлено */
@media (max-width: 1024px) and (orientation: landscape) and (min-height: 500px) {
  .element .footer {
    flex-direction: row !important;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 24px;
    align-items: flex-start;
  }

  .element .email-box {
    flex: 0 0 380px;
    min-width: 280px;
    max-width: 280px;
    margin: 0;
  }

  .element .pages-2 {
    flex: 1;
    min-width: 500px;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    text-align: left;
    gap: 20px 5px;
  }

  .element .div-13 {
    text-align: left;
    align-items: flex-start;
    flex: 1;
    min-width: 180px;
  }

  .element .media,
  .element .contacts {
    text-align: left;
    align-items: flex-start;
  }

  .element .privacy-policy {
    margin-top: 24px;
    width: 100%;
  }
}

/* CRITICAL: Mobile footer fix - must be at the end to override everything */
@media (max-width: 860px) {
  /* Force display all footer sections */
  footer.footer .info-box,
  footer .info-box,
  .footer .info-box,
  #footer-container .info-box,
  #footer-container footer .info-box {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  footer.footer .pages-2,
  footer .pages-2,
  .footer .pages-2,
  #footer-container .pages-2,
  #footer-container footer .pages-2 {
    display: flex !important;

    width: 100% !important;
    max-width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  footer.footer .privacy-policy,
  footer .privacy-policy,
  .footer .privacy-policy,
  #footer-container .privacy-policy,
  #footer-container footer .privacy-policy {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  /* Ensure email-box doesn't take all space */
  footer.footer .email-box,
  footer .email-box,
  .footer .email-box,
  #footer-container .email-box,
  #footer-container footer .email-box {
    flex: none !important;
    align-self: flex-start !important;
    margin-bottom: 16px !important;
  }
}