<style>
    /* ===== HERO (BT-Trader look) ===== */
    .bt-hero {
        position: relative;
        min-height: 690px;
        /* 캡처 비율 느낌 */
        overflow: hidden;
        background: #071423;
        /* 이미지 로딩 전 fallback */
    }

    .bt-hero::before {
        /* 배경 이미지 */
        content: "";
        position: absolute;
        inset: 0;
        background: url("https://static.wixstatic.com/media/nsplsh_26ecc44beadd4833a00be99449790b28~mv2.jpg/v1/fill/w_1960,h_1102,al_c,q_85,usm_0.66_1.00_0.01,enc_avif,quality_auto/nsplsh_26ecc44beadd4833a00be99449790b28~mv2.jpg") center/cover no-repeat;
        transform: scale(1.02);
        z-index: 0;
    }

    .bt-hero::after {
        /* 어두운 네이비 오버레이(좌측이 더 진함) */
        content: "";
        position: absolute;
        inset: 0;
        background:
            radial-gradient(1200px 700px at 20% 35%, rgba(5, 18, 40, .78) 0%, rgba(5, 18, 40, .55) 38%, rgba(5, 18, 40, .25) 68%, rgba(5, 18, 40, .12) 100%),
            linear-gradient(90deg, rgba(5, 18, 40, .88) 0%, rgba(5, 18, 40, .55) 42%, rgba(5, 18, 40, .18) 78%, rgba(5, 18, 40, .10) 100%);
        z-index: 1;
    }

    .bt-hero .bt-container {
        position: relative;
        z-index: 2;
        max-width: 1400px;
        /* 큰 화면에서 여백/정렬 */
        padding-left: 88px;
        /* 캡처처럼 왼쪽 여백 큼 */
        padding-right: 24px;
    }

    .bt-hero h1 {
        color: #fff;
        font-weight: 300;
        /* 얇은 느낌 */
        letter-spacing: -0.02em;
        line-height: 1.05;
        font-size: clamp(44px, 5.2vw, 86px);
        /* 큰 타이틀 */
        margin: 0 0 18px 0;
    }

    .bt-hero .lead {
        color: rgba(255, 255, 255, .88);
        font-size: 16px;
        line-height: 1.7;
        max-width: 520px;
        /* 캡처처럼 문장이 좁음 */
        margin-bottom: 32px;
    }

    .bt-hero .btn-hero {
        background: #6D4CFF;
        /* 보라색 버튼 */
        border: 1px solid #6D4CFF;
        color: #fff;
        padding: 14px 46px;
        border-radius: 4px;
        font-weight: 600;
        font-size: 15px;
        box-shadow: none;
    }

    .bt-hero .btn-hero:hover {
        background: #5c3cff;
        border-color: #5c3cff;
        color: #fff;
    }

    @media (max-width: 991.98px) {
        .bt-hero {
            min-height: 560px;
        }

        .bt-hero .bt-container {
            padding-left: 22px;
            padding-right: 22px;
        }

        .bt-hero .lead {
            max-width: 92%;
        }
    }
</style>

<section class="bt-hero d-flex align-items-center">
    <div class="container-fluid p-0">
        <div class="bt-container">
            <div class="row">
                <div class="col-12 col-lg-8">
                    <h1>
                        Titanium &amp; Specialty Metals.<br>
                        Delivered with Precision
                    </h1>

                    <p class="lead">
                        Global sourcing and distribution of high-grade titanium and specialty metals for manufacturers,
                        processors, and international trading partners.
                    </p>

                    <a href="#contact" class="btn btn-hero">Contact Us</a>
                </div>
            </div>
        </div>
    </div>
</section>