/* footer.css — Figma 4037:1384 */

/* ⚠ overflow: hidden é necessário — a assinatura transborda de propósito nos quatro lados. */
.site-footer {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: var(--dm-space-64);
  min-height: clamp(560px, 50.208vw, 964px);
  overflow: hidden;
  background-color: var(--dm-grey-10);
  color: var(--dm-white);
}

/* Assinatura de fundo */

.signature {
  position: absolute;
  top: -22.822%;
  left: 59.614%;
  z-index: 0;
  width: 109.437%;
  /* ⚠ max-width: none é obrigatório — o reset do style.css aplica max-width: 100% a img/svg. */
  max-width: none;
  height: auto;
  aspect-ratio: 2101.19 / 753;
  translate: -50% 0;
  pointer-events: none;
  opacity: 0.32;
}

/* ⚠ --dm-sig-x/y vêm do frontend.js em unidades do viewBox, não em % — ver template-parts/signature.php. */
.signature__paint {
  transform: translate(var(--dm-sig-x, 0px), var(--dm-sig-y, 0px));
  transition: transform 2600ms var(--dm-ease);
}

.signature__paint.is-live {
  will-change: transform;
}

@media (prefers-reduced-motion: reduce) {
  .signature__paint {
    transition: none;
  }
}

/* Conteúdo */

.site-footer__inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--dm-space-64);
}

.site-footer__identity {
  display: flex;
  flex-direction: column;
  gap: var(--dm-space-48);
}

.site-footer__brand {
  display: flex;
  flex-direction: column;
  gap: var(--dm-space-8);
}

.site-footer__eyebrow {
  display: flex;
  align-items: center;
  gap: var(--dm-space-12);
  color: var(--dm-primary);
  text-transform: uppercase;
}

.site-footer__eyebrow svg {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}

.site-footer__name {
  color: var(--dm-white);
}

.site-footer__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--dm-space-56);
}

.site-footer__cta {
  display: flex;
  align-items: center;
  gap: var(--dm-space-16);
}

.site-footer__cta picture {
  display: contents;
}

.site-footer__avatar {
  flex-shrink: 0;
  width: 55px;
  height: 55px;
  border-radius: 50%;
  object-fit: cover;
}

.site-footer__social {
  display: flex;
  align-items: center;
  gap: var(--dm-space-16);
  color: var(--dm-primary);
  text-decoration: none;
  text-transform: uppercase;
  transition: color 200ms var(--dm-ease);
}

.site-footer__social:hover,
.site-footer__social:focus-visible {
  color: var(--dm-white);
}

.site-footer__social svg {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
}

/* Contato e clínica */

.site-footer__info {
  display: flex;
  gap: var(--dm-space-80);
}

.site-footer__block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--dm-space-32);
}

.site-footer__block-text {
  display: flex;
  flex-direction: column;
  gap: var(--dm-space-16);
}

.site-footer__block-title {
  font-weight: 700;
  color: var(--dm-white);
}

.site-footer__block-detail {
  color: var(--dm-primary);
  text-transform: uppercase;
}

/* Barra inferior — componente curtain reusado, sobrescritas por custom property */

/* ⚠ rgba(...,0) com matiz definida, não transparent — muda a interpolação (ver armadilha do gradiente no CLAUDE.md). */
.site-footer__bar {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--dm-space-24);
  min-height: 40px;
  overflow: hidden;

  --dm-gradient-slat: linear-gradient(116.461deg,
      rgb(170, 147, 103) 16.617%,
      rgba(70, 99, 138, 0) 34.681%,
      rgb(19, 19, 19) 65.787%);
  --dm-gradient-glow: radial-gradient(45.276% 89.067% at 57.578% 90.830%,
      rgb(170, 147, 103) 42.788%,
      rgb(120, 123, 121) 48.798%,
      rgb(70, 99, 138) 54.808%,
      rgb(53, 74, 104) 66.106%,
      rgb(35, 49, 69) 77.404%,
      rgb(26, 37, 52) 83.053%,
      rgb(18, 25, 35) 88.702%,
      rgb(9, 12, 17) 94.351%,
      rgb(4, 6, 9) 97.175%,
      rgb(0, 0, 0) 100%);
  --dm-gradient-vignette: radial-gradient(55.249% 108.686% at 61.432% 41.957%,
      rgba(0, 0, 0, 0) 3.537%,
      rgba(0, 0, 0, 1) 100%);
  --dm-gradient-backdrop: linear-gradient(175.948deg,
      rgba(0, 0, 0, 0.46) 43.877%,
      rgba(0, 0, 0, 0.8) 85.434%);
}

.site-footer__bar .curtain {
  inset: -24.5px 0;
}

.site-footer__bar-content {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: var(--dm-space-24);
  text-align: center;
}

.site-footer__bar-content .nav-link,
.site-footer__copyright {
  color: var(--dm-white);
  text-transform: uppercase;
}

/* Mobile */

@media (max-width: 1024px) {

  .site-footer {
    padding-top: var(--dm-space-320);
  }

  .site-footer__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--dm-space-120);
  }

  .site-footer__info {
    gap: var(--dm-space-48);
  }

}

@media (max-width: 680px) {
  .signature {
    width: 190%;
    top: -8%;
  }

  .site-footer__info {
    flex-direction: column;
  }

  .site-footer__actions {
    gap: var(--dm-space-32);
  }

  .site-footer__bar-content {
    flex-direction: column;
    gap: var(--dm-space-8);
  }
}