/* =========================================================
   BLH FOOTER - CLEAN VERSION
========================================================= */

:root{
  --blh-footer-bg:#1f1f1f;
  --blh-green:#0a8a4b;
  --blh-container:1200px;
  --blh-pad:18px;
}

/* =========================================================
   1) FOOTER WRAPPER
========================================================= */
.blh-footer{
  background: var(--blh-footer-bg);
  color:#e9e9e9;
  padding-top:0;
  min-height:auto !important;
  position:relative;
  overflow:visible;
}

/* =========================================================
   2) MAIN AREA
========================================================= */
.blh-footer-main{
  padding:48px var(--blh-pad) 56px;
}

.blh-footer-grid{
  width:min(var(--blh-container), 92%);
  margin:0 auto;
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr 1.2fr;
  gap:40px;
}

.footer-col h4{
  margin:0 0 18px;
  font-size:18px;
  font-weight:700;
  color:#fff;
}

/* =========================================================
   3) BRAND COLUMN
   logo 在三个社交 icon 正中间上方
========================================================= */
.footer-col.brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

.footer-logo{
  display:flex;
  justify-content:center;
  align-items:center;
  margin-bottom:18px;
}

.footer-logo .custom-logo-link{
  display:inline-block;
}

.footer-logo img.custom-logo{
  width:120px;
  height:120px;
  object-fit:cover;
  border-radius:50%;
  background:#fff;
  padding:6px;
  display:block;
}

.footer-logo .logo-text{
  font-size:32px;
  font-weight:700;
  color:#fff;
  display:block;
}

/* =========================================================
   4) SOCIAL ICONS
========================================================= */
.socials{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  margin-top:0;
}

.socials a{
  width:40px;
  height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#2b2b2b;
  color:#fff;
  text-decoration:none;
  font-size:16px;
  transition:all .3s ease;
}

.socials a:hover{
  background:rgba(255,255,255,.14);
  color:#fff;
  transform:translateY(-2px);
}

.socials a i{
  line-height:1;
}

/* =========================================================
   5) MENUS
========================================================= */
.footer-menu{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:10px;
}

.footer-menu li{
  margin:0;
}

.footer-menu a{
  color:#d7d7d7;
  text-decoration:none;
  transition:color .2s ease;
}

.footer-menu a:hover{
  color:#fff;
}

/* =========================================================
   6) CONTACT
========================================================= */
.footer-contact{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:10px;
  line-height:1.7;
}

.footer-contact li{
  margin:0;
}

.footer-contact span{
  color:#9aa3ad;
  margin-right:8px;
}

.footer-contact a{
  color:#d7d7d7;
  text-decoration:none !important;
  border:0 !important;
  transition:color .2s ease;
}

.footer-contact a:hover{
  color:#fff;
  text-decoration:none !important;
  border:0 !important;
}

/* =========================================================
   7) BOTTOM BAR
========================================================= */
.blh-footer-bottom{
  width:min(var(--blh-container), 92%);
  margin:18px auto 0;
  padding:18px 0 24px;
  border-top:1px solid rgba(255,255,255,.10);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.blh-footer-bottom .copy{
  margin:0;
  color:#cfcfcf;
  font-size:14px;
}

.blh-footer-bottom .copy span{
  color:#25c06d;
  font-weight:700;
}

.footer-legal{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  gap:18px;
}

.footer-legal a{
  color:#d7d7d7;
  text-decoration:none;
  font-size:14px;
  opacity:.85;
}

.footer-legal a:hover{
  opacity:1;
  color:#fff;
}

/* =========================================================
   8) RESPONSIVE
========================================================= */
@media (max-width: 980px){
  .blh-footer-grid{
    grid-template-columns:1fr 1fr;
    gap:28px;
  }

  .footer-col.brand{
    align-items:flex-start;
    text-align:left;
  }

  .footer-logo{
    justify-content:flex-start;
  }

  .socials{
    justify-content:flex-start;
  }
}

@media (max-width: 640px){
  .blh-footer-main{
    padding:40px var(--blh-pad) 44px;
  }

  .blh-footer-grid{
    grid-template-columns:1fr;
  }

  .footer-col.brand{
    align-items:center;
    text-align:center;
  }

  .footer-logo{
    justify-content:center;
  }

  .socials{
    justify-content:center;
  }

  .blh-footer-bottom{
    flex-direction:column;
    align-items:flex-start;
  }
}