/* ==========================================================================
   CASA PIETRA — RODAPÉ
   Figma node 6710:1186 (desktop) e 6710:1203 (mobile).
   ========================================================================== */

.footer {
  padding-block: 60px;
  background-color: var(--color-gray-900);
  color: var(--color-gray-400);
}

.footer__inner {
  display: flex;
  flex-direction: column;
  /* Gap do mobile; no desktop cai para 24px */
  gap: 32px;
  /* A divisória é gray-400 a 50% — conferido por amostragem no arquivo */
  border-top: var(--border-width-default) solid rgb(191 193 188 / 0.5);
  padding-top: 32px;
}

.footer__legal {
  margin: 0;
  text-align: justify;
}

/* --------------------------------------------------------------------------
   LOGOS E SELOS
   -------------------------------------------------------------------------- */

.footer__brands {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.footer__logo {
  width: 187px;
  height: 80px;
}

.footer__label img {
  display: block;
  width: 100%;
  height: auto;
}

/* --------------------------------------------------------------------------
   CRÉDITOS
   -------------------------------------------------------------------------- */

.footer__bottom {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer__bottom p {
  margin: 0;
}

.footer__bottom strong {
  font-weight: var(--font-weight-bold);
}

/* ==========================================================================
   LG — 1366px: logo e selos na mesma linha, créditos nas pontas
   ========================================================================== */
@media (min-width: 1366px) {
  .footer__inner {
    gap: 24px;
    padding-top: 24px;
  }

  .footer__brands {
    flex-direction: row;
    align-items: center;
    gap: 32px;
  }

  /* Os selos vão para a direita, como no arquivo */
  .footer__label {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    justify-content: flex-end;
    padding-left: 48px;
  }

  .footer__label img {
    width: 348px;
    max-width: 100%;
  }

  .footer__bottom {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
  }
}