.footer-content{
    display: flex;
    flex-direction: column;
    background-color: rgb(255, 255, 255);
    border-top: rgba(86, 0, 136, 1) solid 0.2vw;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);;
}

.footer-content table{
    display: inline;
    margin-left: 1vw;
}

.footer-content__table-table{
    display: flex;
    gap: 1vw;
}

.footer-content__primary table tr td{
    display: flex;
    flex-direction: column;
}

.footer-content__title {
    font-size: larger;
    margin-left: 1vw;
    margin-block-start: 1;
    margin-block-end: 1em;
    display: block;
    font-weight: bold;
    unicode-bidi: isolate;
    margin-bottom: 0;
    margin-top: 20px;
}

.footer-content__secondary{
    margin-left: 1%;
    margin-top: 1%;
    margin-bottom: 2%;
}

.footer-content__line{
  width: 98%;
  align-self: center;
  height: 2px;
  background-color: rgba(235, 235, 235, 1);
  margin-top: 20px;   /* sedikit ruang */
  margin-bottom: 0;
  display: block;
}

@media (max-width: 900px) {

  .footer-content__table-table {
    flex-wrap: wrap;            /* Supaya tabel turun ke bawah */
    gap: 2vw;                   /* Jarak sedikit lebih besar */
  }

  .footer-content table {
    width: 45%;                 /* 2 tabel dalam 1 baris */
  }
}

@media (max-width: 600px) {

  .footer-content__table-table {
    flex-direction: column;     /* Semua jadi vertical */
    flex-wrap: nowrap;
    gap: 1rem;
  }

  .footer-content table {
    width: 100%;                /* Supaya aman dan tidak keluar */
    margin-left: 0;
  }

  .footer-content__primary table tr td {
    flex-direction: row;        /* Kembalikan perilaku sel tabel */
  }
}