Promo Section with CTA

<div class="promo-section bg-gray-50 py-20">
  <style>@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700&display=swap'); .btn-secondary{position:relative;display:inline-flex;align-items:center;padding:12px;color:white;font-family:'DM Sans',sans-serif;cursor:pointer;transition:all 0.3s ease} .btn-secondary-bg{position:absolute;inset:0;background:#BD2E01;border-radius:10px;transition:all 0.5s ease} .btn-sec-inner{display:flex;align-items:center;gap:12px;position:relative;z-index:2} .btn-sec-icon{width:32px;height:32px;background:white;border-radius:6px;display:flex;align-items:center;justify-content:center} .btn-sec-icon img{width:60%;height:60%;object-fit:contain} .btn-secondary:hover .btn-secondary-bg{transform:scale(1.05)}</style>
  <section class="max-w-4xl mx-auto px-6 text-center">
    <p class="text-lg md:text-xl text-gray-600 font-light mb-8">Chase horizons, not routines</p>
    <h2 class="text-3xl md:text-5xl font-medium text-gray-900 mb-6 leading-tight">Find beauty beyond the map</h2>
    <p class="text-lg md:text-xl text-gray-600 font-light mb-12 max-w-2xl mx-auto leading-relaxed">Every journey holds a story waiting to be told. Escape the ordinary, explore the unknown, and let the open road inspire your next adventure.</p>
    <div class="btn-secondary">
      <div class="btn-secondary-bg"></div>
      <div class="btn-sec-inner">
        <p class="font-medium">Start Exploring</p>
        <div class="btn-sec-icon">
          <svg class="w-4 h-4 text-gray-900" fill="currentColor" viewBox="0 0 448 512">
            <path d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"></path>
          </svg>
        </div>
      </div>
    </div>
  </section>
</div>