/* footer.css — Figma BASEMENT SECTOR 577:8789 */
.footer {
  --footer-icon-glow: drop-shadow(0 0 17.8px #3a3cdf);
}

.footer__shell {
  background: rgba(2, 2, 26, 0.8);
  border-top: 1px solid #0b0c20;
}

.footer__container {
  max-width: 75rem;
  padding-left: max(2.8125rem, env(safe-area-inset-left, 0px));
  padding-right: max(2.8125rem, env(safe-area-inset-right, 0px));
}

.footer__body {
  padding-top: 3rem;
  padding-bottom: 2.375rem;
}

.footer__grid {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 0;
}

.footer__brand-col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.25rem;
  flex: 0 0 19.625rem;
  max-width: 19.625rem;
}

.footer__brand {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 7px;
}

.footer__brand-icon {
  display: block;
  width: 3rem;
  height: 3rem;
  flex-shrink: 0;
  object-fit: contain;
  object-position: center;
}

.footer__brand-name {
  font-family: var(--font-display);
  font-size: 1.6875rem;
  font-weight: 800;
  line-height: 1.222;
  color: var(--color-text);
  text-align: center;
}

.footer__brand-name-accent {
  color: var(--color-accent);
}

.footer__description {
  margin: 0;
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.726;
  color: var(--color-text-muted);
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.footer__socials {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.875rem;
  width: 13.375rem;
  height: 2.6875rem;
}

.footer__social-link {
  display: block;
  flex-shrink: 0;
  width: 2.6875rem;
  height: 2.6875rem;
  border-radius: 8px;
  transition: transform var(--transition-base), opacity var(--transition-base);
  -webkit-tap-highlight-color: transparent;
}

.footer__social-link:hover {
  transform: translateY(-2px);
  opacity: 0.92;
}

.footer__social-link img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.footer__divider {
  flex-shrink: 0;
  align-self: stretch;
  width: 1px;
  min-height: 15.0625rem;
  margin: 0 1.1875rem;
  background: linear-gradient(
    180deg,
    rgba(10, 10, 34, 0.6) 0%,
    rgba(10, 10, 34, 1) 50%,
    rgba(10, 10, 34, 0.6) 100%
  );
}

.footer__nav-group {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  flex: 1 1 auto;
  min-width: 0;
}

.footer__divider--inner {
  margin: 0 1.28125rem;
  min-height: 12rem;
}

.footer__col {
  flex: 0 0 auto;
}

.footer__col-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.3125rem;
  min-height: 0;
  margin: 0 0 1.125rem;
  overflow: visible;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.125rem;
  color: var(--color-text);
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.footer__col-title > span {
  display: block;
  padding-top: 0.0625rem;
}

.footer__col--contacts .footer__col-title {
  margin-bottom: 2.0625rem;
}

.footer__col-icon {
  flex-shrink: 0;
  display: block;
  object-fit: contain;
  object-position: center;
  filter: var(--footer-icon-glow);
  -webkit-filter: var(--footer-icon-glow);
}

.footer__col-icon--page {
  width: 1.40625rem;
  height: 1.171875rem;
}

.footer__col-icon--platform {
  width: 1.125rem;
  height: 1.40625rem;
}

.footer__col-icon--company {
  width: 1.40625rem;
  height: 1.03125rem;
}

.footer__col-icon--contact {
  width: 1.25rem;
  height: 1.188125rem;
}

.footer__col-list,
.footer__contacts {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer__link {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.726;
  color: var(--color-text-muted);
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  transition: color var(--transition-base);
}

.footer__link--wrap {
  max-width: 6.5rem;
  line-height: 1.45;
}

.footer__link:hover {
  color: var(--color-text);
}

.footer__col--contacts {
  width: 11.875rem;
  max-width: 11.875rem;
}

.footer__contacts {
  gap: 1.1875rem;
  margin-bottom: 0;
}

.footer__contact {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.875rem;
  overflow: visible;
}

.footer__contact-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1.375rem;
  height: 1.375rem;
  overflow: visible;
}

.footer__contact-icon {
  display: block;
  flex-shrink: 0;
  object-fit: contain;
  object-position: center;
  filter: var(--footer-icon-glow);
  -webkit-filter: var(--footer-icon-glow);
}

.footer__contact-icon--phone {
  width: 1.2rem;
  height: 1.2rem;
}

.footer__contact-icon--mail {
  width: 1.3125rem;
  height: 1.03125rem;
}

.footer__contact-icon--chat {
  width: 1.375rem;
  height: 1.3125rem;
}

.footer__contact-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  min-width: 0;
}

.footer__contact-main {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.143;
  color: var(--color-text);
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  transition: color var(--transition-base);
}

.footer__contact-main:hover {
  color: var(--color-accent);
}

.footer__contact-sub {
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.726;
  color: var(--color-text-muted);
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.footer__write-btn {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0.5625rem;
  width: 100%;
  max-width: 11.875rem;
  min-height: 3.1875rem;
  margin-top: 1.0625rem;
  padding: 0.9375rem 0.875rem;
  border: 1px solid #4c44f5;
  border-radius: 15px;
  background: radial-gradient(206.19% 206.19% at 50% 50%, #100cb8 0%, #4f45e5 100%);
  box-shadow: inset 0 0 13px #6152f2;
  font-family: var(--font-body);
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.167;
  text-align: center;
  color: var(--color-text);
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  transition:
    background var(--transition-base),
    box-shadow var(--transition-base),
    color var(--transition-base),
    transform var(--transition-base);
  -webkit-tap-highlight-color: transparent;
}

.footer__write-btn-label {
  white-space: nowrap;
  flex-shrink: 0;
}

/* Property 1=Variant2 — hover (лише pointer: fine — без sticky hover на iOS) */
@media (hover: hover) and (pointer: fine) {
  .footer__write-btn:hover {
    background: radial-gradient(206.19% 206.19% at 50% 50%, #5a56ff 0%, #1000ff 100%);
    box-shadow: 0 0 40px #2c28d2, inset 0 0 40px #6152f2;
    transform: translateY(-1px);
  }
}

.footer__write-btn:focus-visible {
  background: radial-gradient(206.19% 206.19% at 50% 50%, #5a56ff 0%, #1000ff 100%);
  box-shadow: 0 0 40px #2c28d2, inset 0 0 40px #6152f2;
}

/* Property 1=Variant3 — pressed */
.footer__write-btn:active {
  background: radial-gradient(
    206.19% 206.19% at 50% 50%,
    rgba(90, 86, 255, 0.2) 0%,
    rgba(16, 0, 255, 0.2) 100%
  );
  box-shadow: 0 0 40px #2c28d2;
  color: #7d86b9;
  transform: translateY(0);
}

.footer__write-btn img {
  flex-shrink: 0;
  width: 0.9375rem;
  height: 0.9375rem;
  object-fit: contain;
}

.footer__bar {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 7.125rem;
  min-height: 6.1875rem;
  margin-left: -2.8125rem;
  margin-right: -2.8125rem;
  padding: 1.4375rem 2.8125rem;
  border-top: 1px solid #0e0f24;
  border-bottom: 1px solid #0e0f24;
  background: rgba(2, 2, 26, 0.8);
}

.footer__copy {
  flex: 0 0 22.4375rem;
  width: 22.4375rem;
  margin: 0;
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.726;
  color: var(--color-text-muted);
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.footer__bar-aside {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 3.3125rem;
  flex: 0 1 auto;
  min-width: 0;
}

.footer__payments {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 3.3125rem;
  flex: 0 0 auto;
}

.footer__payments-label {
  flex-shrink: 0;
  width: 5.1875rem;
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.726;
  color: var(--color-text-muted);
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  white-space: nowrap;
}

.footer__pay-badges {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1.0625rem;
  flex: 0 0 12.4375rem;
}

.footer__pay-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.4375rem;
  height: 2.3125rem;
  flex-shrink: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: none;
}

.footer__pay-badge img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
  object-position: center;
}

.footer__credit {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  margin: 0;
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.726;
  color: var(--color-text-muted);
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  white-space: nowrap;
}

.footer__credit-team {
  color: #efb428;
}

.footer__credit-brand {
  font-family: var(--font-display);
  font-size: 0.75rem;
  font-weight: 800;
  line-height: 1.726;
  color: var(--color-text);
}

.footer__heart {
  flex-shrink: 0;
  margin-left: 2px;
}

/* Tablet */
@media (max-width: 1199px) {
  .footer__container {
    padding-left: max(var(--space-6), env(safe-area-inset-left, 0px));
    padding-right: max(var(--space-6), env(safe-area-inset-right, 0px));
  }

  .footer__grid {
    flex-direction: column;
    gap: 2rem;
  }

  .footer__brand-col {
    flex: none;
    max-width: none;
    width: 100%;
  }

  .footer__divider {
    display: none;
  }

  .footer__nav-group {
    flex-wrap: wrap;
    gap: 2rem 2.5rem;
    width: 100%;
  }

  .footer__divider--inner {
    display: none;
  }

  .footer__col--contacts {
    width: 100%;
    max-width: 20rem;
  }

  .footer__bar {
    flex-wrap: wrap;
    gap: 1.5rem 2rem;
    margin-left: calc(-1 * max(var(--space-6), env(safe-area-inset-left, 0px)));
    margin-right: calc(-1 * max(var(--space-6), env(safe-area-inset-right, 0px)));
    padding-left: max(var(--space-6), env(safe-area-inset-left, 0px));
    padding-right: max(var(--space-6), env(safe-area-inset-right, 0px));
  }

  .footer__copy {
    flex: 1 1 100%;
    width: auto;
  }

  .footer__bar-aside {
    flex-wrap: wrap;
    gap: 1.5rem 2rem;
  }
}

/* Mobile — padding in mobile-home.css */

@media (max-width: 374px) {
  .footer__socials {
    gap: 0.625rem;
  }

  .footer__write-btn {
    font-size: 1rem;
    padding: 14px 16px;
  }
}

/* Мінімальний підвал: лише «Публічна оферта» */
.footer--offer-only .footer__container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 1.5rem;
  padding-bottom: max(1.5rem, env(safe-area-inset-bottom, 0px));
}

.footer--offer-only .footer__offer {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.footer--offer-only .footer__link--offer {
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.4;
  color: #b3adae;
  text-align: center;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.footer--offer-only .footer__link--offer:hover {
  color: #e8e8f3;
}

@media (max-width: 767px) {
  .footer--offer-only .footer__container {
    padding-top: 1.25rem;
    padding-bottom: max(1.25rem, env(safe-area-inset-bottom, 0px));
  }

  .footer--offer-only .footer__link--offer {
    font-size: 0.8125rem;
  }
}
