/* =====================================================================
   BAS FOOTER — clean BEM rewrite
   Theme: bas (child theme of Blocksy)
   ---------------------------------------------------------------
   Loaded globally (every page). Depends on: bas.css
   ---------------------------------------------------------------
   ⚠️ 所有 footer 相关样式都在这个文件里管理。
      不要在 functions.php、HTML 内联 style、或其他 CSS 文件中再写 footer 样式。
   ---------------------------------------------------------------
   Class naming:
     .bas-footer                   root
     .bas-footer__main             top grid (brand + 3 link cols)
     .bas-footer__brand            left brand block
     .bas-footer__logo
     .bas-footer__logo-img
     .bas-footer__desc             paragraph under logo
     .bas-footer__contact          contact ul (phone / email / whatsapp)
     .bas-footer__contact-item     li
     .bas-footer__contact-icon     svg
     .bas-footer__contact-link     a
     .bas-footer__social           social icon row
     .bas-footer__social-link      single icon (a)
     .bas-footer__col              right link column
     .bas-footer__col-title        h3 in column
     .bas-footer__links            ul
     .bas-footer__link             a
     .bas-footer__legal            bottom legal bar
     .bas-footer__copyright
     .bas-footer__legal-links
     .bas-footer__legal-link
   ===================================================================== */

/* ---------------------------------------------------------------
   ENVIRONMENT GUARD —— 防止外层环境(Blocksy / WC / 全局 CTA 选择器)
   通过 div[style*="background:#111"] 之类的广义选择器误命中 footer
   或 trust-bar，污染它们的布局
---------------------------------------------------------------- */
.bas-footer,
.bas-footer__main,
.bas-footer__legal,
.bas-trust-bar,
.bas-trust-bar__inner{
  /* 禁止外层环境注入横向边距 */
  margin-left:auto !important;
  margin-right:auto !important;
}



/* ---------------------------------------------------------------
   ROOT
---------------------------------------------------------------- */
.bas-footer{
  background:var(--bas-white);
  color:var(--bas-black);
  border-top:1px solid var(--bas-gray-border);
  font-family:var(--bas-font-body);
}

/* ---------------------------------------------------------------
   MAIN GRID — desktop 4 columns
---------------------------------------------------------------- */
.bas-footer__main{
  max-width:1280px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:48px;
  padding:64px 48px 56px;
  border-bottom:1px solid var(--bas-gray-border);
}

/* ---------------------------------------------------------------
   BRAND COLUMN
---------------------------------------------------------------- */
.bas-footer__brand{
  padding-right:48px;
  border-right:1px solid var(--bas-gray-border);
}
.bas-footer__logo{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:20px;
}
.bas-footer__logo-img{
  height:26px;
  width:auto;
  object-fit:contain;
  display:block;
  filter:brightness(0);
}

.bas-footer__desc{
  font-size:13px;
  font-weight:300;
  color:var(--bas-gray-text);
  line-height:1.7;
  margin:0 0 24px 0;
}

/* Contact list */
.bas-footer__contact{
  list-style:none;
  padding:0;
  margin:0 0 24px 0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.bas-footer__contact-item{
  display:flex;
  align-items:center;
  gap:10px;
}
.bas-footer__contact-icon{
  flex-shrink:0;
  width:13px;
  height:13px;
  stroke:var(--bas-gray-text);
  stroke-width:1.5;
  fill:none;
}
.bas-footer__contact-icon path,
.bas-footer__contact-icon polyline,
.bas-footer__contact-icon line,
.bas-footer__contact-icon circle,
.bas-footer__contact-icon rect{
  stroke:var(--bas-gray-text);
  fill:none;
}
.bas-footer__contact-link{
  font-size:13px;
  font-weight:300;
  color:var(--bas-gray-text);
  text-decoration:none;
  transition:color 0.15s;
}
.bas-footer__contact-link:hover{
  color:var(--bas-black);
}

/* Social icons row */
.bas-footer__social{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:4px;
}
.bas-footer__social-link{
  width:32px;
  height:32px;
  border-radius:50%;
  border:1px solid var(--bas-gray-border);
  display:flex;
  align-items:center;
  justify-content:center;
  background:transparent;
  color:var(--bas-black);
  text-decoration:none;
  transition:background 0.15s, border-color 0.15s, color 0.15s;
}
.bas-footer__social-link:hover{
  background:var(--bas-black);
  border-color:var(--bas-black);
  color:var(--bas-white);
}
.bas-footer__social-link svg{
  display:block;
  stroke:currentColor;
}

/* ---------------------------------------------------------------
   LINK COLUMNS
---------------------------------------------------------------- */
.bas-footer__col-title{
  font-size:13px;
  font-weight:700;
  color:var(--bas-black);
  margin:0 0 20px 0;
  letter-spacing:0.01em;
}
.bas-footer__links{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.bas-footer__link{
  font-size:13px;
  font-weight:300;
  color:var(--bas-gray-text);
  text-decoration:none;
  transition:color 0.15s;
}
.bas-footer__link:hover{
  color:var(--bas-black);
  text-decoration:underline;
  text-underline-offset:2px;
}

/* ---------------------------------------------------------------
   LEGAL BAR
---------------------------------------------------------------- */
.bas-footer__legal{
  max-width:1280px;
  margin:0 auto;
  padding:20px 48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
}
.bas-footer__copyright{
  font-size:12px;
  color:var(--bas-gray-text);
}
.bas-footer__legal-links{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}
.bas-footer__legal-link{
  font-size:11px;
  color:var(--bas-gray-text);
  text-decoration:none;
  transition:color 0.15s;
}
.bas-footer__legal-link:hover{
  color:var(--bas-black);
}

/* =====================================================================
   RESPONSIVE — TABLET (≤1024px)
===================================================================== */
@media(max-width:1024px){
  .bas-footer__main{
    grid-template-columns:1fr 1fr;
    gap:40px 32px;
    padding:48px 32px 40px;
  }
  .bas-footer__brand{
    grid-column:1 / -1;
    padding-right:0;
    border-right:none;
    padding-bottom:32px;
    border-bottom:1px solid var(--bas-gray-border);
  }
}

/* =====================================================================
   RESPONSIVE — MOBILE (≤768px)  — 优化放大版
   字号 / 间距 / 图标全面放大，提升可读性 + 点击区域
===================================================================== */
@media(max-width:768px){
  .bas-footer__main{
    display:block;          /* 弃用 grid，单列堆叠最稳 */
    padding:40px 24px 32px;
    gap:0;
  }
  .bas-footer__brand{
    grid-column:auto;
    padding:0 0 32px 0;
    border-right:none;
    border-bottom:1px solid var(--bas-gray-border);
    margin-bottom:32px;
  }

  /* Logo 放大 */
  .bas-footer__logo{
    margin-bottom:24px;
  }
  .bas-footer__logo-img{
    height:32px;
  }

  /* 描述文字放大 */
  .bas-footer__desc{
    font-size:15px;
    line-height:1.7;
    margin-bottom:28px;
  }

  /* 联系方式放大 */
  .bas-footer__contact{
    gap:14px;
    margin-bottom:28px;
  }
  .bas-footer__contact-icon{
    width:16px;
    height:16px;
  }
  .bas-footer__contact-link{
    font-size:15px;
  }

  /* 社交图标圆圈放大 */
  .bas-footer__social{
    gap:10px;
  }
  .bas-footer__social-link{
    width:44px;
    height:44px;
  }
  .bas-footer__social-link svg{
    width:18px;
    height:18px;
  }

  /* 链接列 */
  .bas-footer__col{
    padding:24px 0;
    border-bottom:1px solid var(--bas-gray-border);
  }
  .bas-footer__col:last-child{
    border-bottom:none;
    padding-bottom:0;
  }
  .bas-footer__col-title{
    font-size:15px;
    margin-bottom:18px;
  }
  .bas-footer__links{
    gap:14px;
  }
  .bas-footer__link{
    font-size:15px;
    line-height:1.4;
    /* 增加点击区域 */
    display:inline-block;
    padding:2px 0;
  }

  /* 底部 legal bar */
  .bas-footer__legal{
    flex-direction:column;
    align-items:flex-start;
    padding:24px;
    gap:14px;
  }
  .bas-footer__copyright{
    font-size:13px;
  }
  .bas-footer__legal-link{
    font-size:13px;
  }
}

/* =====================================================================
   LEGACY CLASS COMPAT — 旧类名保留兼容（防 functions.php / 其他文件引用）
===================================================================== */
.bas-footer-logo-wrap{display:flex;align-items:center;gap:10px;margin-bottom:20px;}
.bas-footer-logo-img{height:26px;width:auto;object-fit:contain;filter:brightness(0);display:block;}
.bas-footer-logo-text{font-family:var(--bas-font-display);font-size:22px;font-weight:900;color:var(--bas-black);text-transform:uppercase;letter-spacing:0.1em;}
.bas-footer-social{display:flex;align-items:center;gap:8px;margin-top:4px;}
.bas-footer-social__icon{
  width:32px;height:32px;border-radius:50%;border:1px solid var(--bas-gray-border);
  display:flex;align-items:center;justify-content:center;
  background:transparent;color:var(--bas-black);text-decoration:none;
  transition:background 0.15s, border-color 0.15s, color 0.15s;
}
.bas-footer-social__icon:hover{background:var(--bas-black);border-color:var(--bas-black);color:var(--bas-white);}
.bas-footer-social__icon svg{display:block;stroke:currentColor;}

/* =====================================================================
   TRUST BAR — 5-column reassurance strip above the footer
   Mirrors the Chinese trust bar style from the client's original design
   ===================================================================== */
.bas-trust-bar {
  background: var(--bas-gray-bg);
  border-top: 1px solid var(--bas-gray-border);
  border-bottom: 1px solid var(--bas-gray-border);
  font-family: var(--bas-font-body);
}

.bas-trust-bar__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 20px 48px;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
}

.bas-trust-bar__item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 4px 20px;
  border-right: 1px solid var(--bas-gray-border);
}
.bas-trust-bar__item:last-child {
  border-right: none;
}
.bas-trust-bar__item:first-child {
  padding-left: 0;
}

.bas-trust-bar__icon {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  background: var(--bas-black);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--bas-white);
}
.bas-trust-bar__icon svg {
  width: 20px;
  height: 20px;
  display: block;
}

.bas-trust-bar__title {
  font-size: 14px;
  font-weight: 700;
  color: var(--bas-black);
  line-height: 1.3;
  margin-bottom: 4px;
}
.bas-trust-bar__desc {
  font-size: 12px;
  font-weight: 300;
  color: var(--bas-gray-text);
  line-height: 1.5;
}

/* Responsive: 5 columns on desktop → 1 column everywhere else
   (5 items stack cleanly as a vertical list on narrow screens) */
@media (max-width: 1200px) {
  .bas-trust-bar__inner {
    grid-template-columns: 1fr;
    gap: 0;
    padding: 16px 20px;
  }
  .bas-trust-bar__item {
    padding: 14px 0;
    border-right: none;
    border-bottom: 1px solid var(--bas-gray-border);
  }
  .bas-trust-bar__item:last-child {
    border-bottom: none;
  }
  .bas-trust-bar__item:first-child {
    padding-left: 0;
    padding-top: 4px;
  }
}

