<style>
  /* ===== Logistics & Services Banner ===== */
  .bt-banner {
    position: relative;
    min-height: 260px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url("YOUR_BG_IMAGE_URL_HERE.jpg");
    /* ← 배경이미지 교체 */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
  }

  /* 전체 톤 살짝 어둡게(원본 느낌) */
  .bt-banner::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .10);
    z-index: 1;
  }

  /* 가운데 검정 박스 */
  .bt-banner .bt-box {
    position: relative;
    z-index: 2;
    width: min(780px, 86vw);
    padding: 52px 24px;
    background: rgba(0, 0, 0, .92);
    text-align: center;
  }

  .bt-banner .bt-title {
    color: #fff;
    font-weight: 300;
    font-size: clamp(28px, 2.6vw, 44px);
    letter-spacing: .2px;
    margin: 0 0 14px 0;
  }

  .bt-banner .bt-sub {
    color: rgba(255, 255, 255, .85);
    font-size: 11px;
    letter-spacing: .2px;
    margin: 0;
  }

  /* 하단 얇은 라인 */
  .bt-banner .bt-bottom-line {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: rgba(255, 255, 255, .22);
    z-index: 3;
  }
</style>

<section class="bt-banner" id="logistics">
  <div class="bt-box">
    <h2 class="bt-title">Logistics &amp; Services</h2>
    <p class="bt-sub">End-to-End Logistics and Services Designed for Global Metal Supply.</p>
  </div>
  <div class="bt-bottom-line"></div>
</section>