/* ==========================================================================
   Site footer (.site-footer)
   Source: .global-footer-container (white, 4-col row + branch grid) and the
   body-level copyright <p> that sits below it.
   ========================================================================== */
.site-footer {
  background: var(--color-bg-white);
  color: var(--color-text-primary);
  font-size: var(--text-sm);
}

/* -- Main 4-column row --------------------------------------------------- */
.site-footer__main {
  display: flex;
  flex-wrap: wrap;
  column-gap: var(--space-10);
  row-gap: var(--space-6);
  /* Chỉ padding trên/dưới — không ghi đè padding trái/phải của .container. */
  padding-top: 30px;
  padding-bottom: 30px;
}

.site-footer__col {
  flex: 1 1 0;
  min-width: 0;
}

.site-footer__title {
  margin: 0 0 var(--space-4);
  font-size: var(--text-md);
  font-weight: 700;
  line-height: 20px;
  text-transform: uppercase;
  color: var(--color-text-primary);
}

.site-footer__list {
  font-size: var(--text-sm);
  line-height: 24px;
}

.site-footer__list a,
.site-footer__company,
.site-footer__list > p {
  display: block;
  margin: 0;
  color: #353535;
  text-decoration: none;
}

.site-footer__list a:hover {
  color: var(--color-brand-blue);
}

.site-footer__address {
  font-style: normal;
}

.site-footer__agent-link {
  margin: var(--space-4) 0 0;
}

.site-footer__agent-link a {
  font-size: var(--text-md);
  font-weight: 700;
  color: #007bff;
  text-decoration: none;
}

.site-footer__agent-link a:hover {
  text-decoration: underline;
}

/* -- Social icons + certification badge ----------------------------------- */
.site-footer__social {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 var(--space-2);
}

.site-footer__social-icon {
  width: 41px;
  height: 41px;
  margin: 0 4px 10px 0;
  border-radius: var(--radius-full);
  overflow: hidden;
}

.site-footer__social-icon img {
  display: block;
  width: 100%;
  height: 100%;
}

.site-footer__badge {
  display: inline-block;
}

.site-footer__badge img {
  display: block;
  width: 148px;
  height: auto;
}

/* -- Branch grid ("CHÍNH SÁCH ĐẠI LÝ") ------------------------------------ */
.site-footer__branches {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  padding-bottom: 30px;
}

.site-footer__branch {
  flex: 1 1 0;
  min-width: 0;
}

.site-footer__branch-title {
  display: flex;
  align-items: center;
  margin: 0 0 var(--space-3);
  padding: 4px;
  background: var(--color-brand-blue);
  color: var(--color-text-light);
  font-size: var(--text-md);
  font-weight: 700;
  line-height: 24px;
  border-radius: 50px;
}

.site-footer__branch-number {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  margin-right: 14px;
  border-radius: var(--radius-full);
  background: var(--color-bg-white);
  color: #ff601c;
  font-size: 16px;
  font-weight: 700;
}

.site-footer__branch-info {
  font-style: normal;
  font-size: var(--text-sm);
  line-height: 24px;
}

.site-footer__branch-info a {
  display: block;
  color: var(--color-text-primary);
  text-decoration: none;
}

.site-footer__branch-info a:hover {
  color: var(--color-brand-blue);
}

.site-footer__branch-info strong {
  font-weight: 700;
}

/* -- Copyright bar --------------------------------------------------------- */
.site-footer__copyright {
  background: var(--color-bg-page);
  text-align: center;
  padding: 10px;
}

.site-footer__copyright p {
  margin: 0;
  font-size: var(--text-xs);
  line-height: 24px;
  color: var(--color-text-primary);
}

/* ==========================================================================
   Responsive: 4 cols -> 2 cols (<=900px) -> 1 col (<=560px)
   ========================================================================== */
@media (max-width: 900px) {
  .site-footer__main {
    column-gap: var(--space-6);
  }

  .site-footer__col {
    flex: 1 1 calc(50% - var(--space-6) / 2);
  }

  .site-footer__branch {
    flex: 1 1 calc(50% - var(--space-3) / 2);
  }
}

@media (max-width: 560px) {
  /* Mobile: thông tin công ty + "Kết nối" full-width; "Chính sách" và
     "Tin tức" (danh sách ngắn) đứng cạnh nhau thành 2 cột. */
  .site-footer__main {
    column-gap: var(--space-4);
    row-gap: var(--space-5);
    padding-top: var(--space-6);
    padding-bottom: var(--space-6);
  }

  .site-footer__col {
    flex: 1 1 100%;
  }

  .site-footer__col:nth-child(1) { order: 1; }
  .site-footer__col:nth-child(2) { order: 2; flex: 1 1 calc(50% - var(--space-4) / 2); }
  .site-footer__col:nth-child(4) { order: 3; flex: 1 1 calc(50% - var(--space-4) / 2); }
  .site-footer__col:nth-child(3) { order: 4; }

  .site-footer__col:nth-child(1) {
    padding-bottom: var(--space-5);
    border-bottom: 1px solid var(--color-border);
  }

  .site-footer__title {
    margin-bottom: var(--space-3);
    font-size: 15px;
  }

  .site-footer__list {
    line-height: 26px;
  }

  .site-footer__list a {
    overflow-wrap: anywhere;
  }

  .site-footer__col:nth-child(3) {
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-border);
  }

  .site-footer__social {
    margin-bottom: 0;
  }

  .site-footer__social-icon {
    margin: 0 var(--space-2) 0 0;
  }

  .site-footer__branch {
    flex: 1 1 100%;
  }

  .site-footer__branch-title {
    border-radius: var(--radius-md);
  }

  .site-footer__copyright {
    padding: var(--space-3) var(--container-pad);
  }
}