@extends('layouts.app')
@section('content')
<div class="top">
  <div class="py-5">
    <div class="container h-100 d-flex align-items-center">
      <div class="row">
        <div class="col-lg-7">
          <div class="light-bg shadow-lg">
            <h3 class="md-title text-pry">You’re a simple rubber band away from long-lasting hemorrhoid treatment.</h3>
            <!-- <h3 class="md-title text-pry">Non-surgical. Painless. Return to work immediately.</h3> -->
            <!-- <p class="mb-3">You’re a simple rubber band away from <b>long-lasting hemorrhoid treatment.</b></p> -->
            <p class="mb-3">Non-surgical. Painless. Return to work immediately.</p>
            <p class="mb-3">Just a simple, medical-grade rubber band that takes a doctor <b>less than 60 seconds</b> to apply at the base of your hemorrhoid.</p>
            <p class="mb-3">The hemorrhoid shrinks and falls off, typically within 24 hours.</p>
            <div class="d-flex align-items-center my-4">
              <a href="#" class="btn btn-pry">Find a Clinic</a>
              <a href="#" class="btn btn-outline-pry ms-4">How it Works</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="container pt-md-5 pt-4">

  <div class="row">
    <div class="col-lg-6">
      <h5 class="subtitle">Meet the HemBand Applicator.</h5>
      <div class="mt-5 mb-4 text-center">
        <img src="{{asset('img/snyder.png')}}" class="w-75" alt="">
      </div>
      <p>
        It takes less than 60 seconds to use the HemBand applicator to place a rubber band at the base of the hemorrhoid.
        Banding is the gold-standard of care because instead of treating symptoms, it safely and gently removes hemorrhoids themselves.
      </p>

    <div>

      </div>
    </div>
    <div class="col-lg-5 offset-lg-1 mt-lg-0 mt-4">
      <div class="bg-dark text-white p-4">
        <h4>Hemorrhoids are common.</h4>
        <p>Hemorrhoids are very prevalent in both men and women. About half of all people will have hemorrhoids by age 50.</p>
        <p>Symptoms include:</p>
        <ul>
          <li>Bleeding</li>
          <li>Itching</li>
          <li>Swelling</li>
          <li>Soiling</li>
          <li>Pain</li>
          <li>Bulging</li>
        </ul>
        <!-- <a href="#" class="btn btn-light rounded-0 px-5 py-2 mt-3">Find a Clinic</a> -->
      </div>
    </div>
  </div>
</div>

<div class="container py-5">
  <div class="row">
    <div class="col-xl-6 pe-xl-0">
      <div class="box-1">
        <div class="d-flex flex-column">
          <h4 class="subtitle mb-5">
            Why HemBand?
          </h4>
          <h4 class="mb-3">1. It's fast, safe, and effective.</h4>
          <p class="border-bottom pb-4">Banding is the "gold-standard" for treating hemorrhoids, with a greater than 95% success rate. It takes less than a minute.</p>

          <h4 class="mb-3">2. It's available near you!</h4>
          <p class="border-bottom pb-4">With thousands of physicians across the United States are trained in how to use the HemBand, there's a clinic near you!</p>

          <h4 class="mb-3">3. It's covered by insurance.</h4>
          <p class="border-bottom pb-4">HemBand treatment is covered by most insurance plans, including Medicare, Medicaid, and TriCare.</p>
        </div>
      </div>
    </div>
    <div class="col-xl-6 p-xl-0">
      <div class="box-2">
        <div class="d-flex flex-column">
          <h5 class="header mb-4">Hemorrhoids</h5>
          <p class="mb-4">
            Hemorrhoids emerge when the veins around your anus or your lower rectum get swollen and inflamed.
            They can be internal or external. Hemorrhoids are extremely common. About half all people will have hemorrhoids by age 50.</p>
          <a href="#" class="text-white d-block mt-auto text-end">Learn more <i class="ms-1 fal fa-angle-right"></i> </a>
        </div>
      </div>
    <div class="row m-xl-0 box-container">
      <div class="col-xl-6 p-xl-0">
        <div class="box-3">
          <div class="d-flex flex-column">
            <h5 class="header mb-4">Post-Care</h5>
            <p>Learn how to prevent future hemorrhoids after your banding.</p>
            <a href="#" class="text-white d-block mt-auto text-end">Learn more <i class="ms-1 fal fa-angle-right"></i> </a>
          </div>
        </div>
      </div>
      <div class="col-xl-6 p-xl-0">
        <div class="box-4">
          <div class="d-flex flex-column">
            <h5 class="header mb-4">Comparision</h5>
            <p>There are multiple options available for treating hemorrhoids. Learn why rubber banding is the leading method.</p>
            <a href="#" class="text-dark d-block mt-auto text-end">Learn more <i class="ms-1 fal fa-angle-right"></i> </a>
          </div>
        </div>
      </div>
    </div>
    </div>
  </div>
</div>

<div class="container">
  <div class="steps pt-5 pb-5">
    <div class="text-center mb-sm-0 mb-4">
      <img src="{{asset('img/fp/fp-1.svg')}}" height="40">
      <p class="mt-3"><b>Fast & Safe</b></p>
      <p class="px-4">Banding takes less than a minute and is the standard of care, with a greater than 95% success rate.</p>
    </div>
    <div class="text-center mb-sm-0 mb-4">
      <img src="{{asset('img/fp/fp-3.svg')}}" height="40">
      <p class="mt-3"><b>Painless</b></p>
      <p class="px-4">Banding is painless, non-surgical, and requires no medication before or after treatment.</p>
    </div>
    <div class="text-center mb-sm-0 mb-4">
      <img src="{{asset('img/fp/fp-2.svg')}}" height="40">
      <p class="mt-3"><b>Long-Term Effectiveness</b></p>
      <p class="px-4">Instead of treating symptoms, banding gently removes hemorrhoids themselves.</p>
    </div>
    <div class="text-center mb-sm-0 mb-4">
      <img src="{{asset('img/fp/fp-4.svg')}}" height="40">
      <p class="mt-3"><b>Covered by Most Health Plans</b></p>
      <p class="px-4">Banding is covered by most major health plans including Medicare, Medicaid, and TriCare.</p>
    </div>
  </div>
</div>

<div class="container py-xl-5 py-4 d-none">
  <div class="d-md-flex align-items-center justify-content-between mb-4 pb-3 border-bottom">
    <h4 class="subtitle mb-0 mb-2">What physicians have to say</h4>
    <a href="#">For Phycisians <i class="ms-1 fal fa-angle-right"></i> </a>
  </div>
  <div class="row">
    <div class="col-xl-6">
      <div class="border row m-0">
        <div class="col-xl-4 col-lg-3 col-md-4 ps-0 d-md-block d-none doc-bg" style="background-image:url('{{asset('img/ph-1.png')}}')">
        </div>
        <div class="col-xl-8 col-lg-9 col-md-8 p-4">
          <div class="d-md-none d-block">
            <div class="profile-img">
              <img src="{{asset('/img/ph-1.png')}}" alt="">
            </div>
          </div>
          <div class="text-md-start text-center">
            <div class="d-flex mt-3 align-items-center justify-content-md-start justify-content-center">
              <h4 class="m-0 font-weight-bold">Dr. Nayan Shah</h4>
              <a href="#" class="ms-2"><img src="{{asset('img/linkedin_ic.svg')}}" alt=""> </a>
            </div>
            <h6 class="opacity-50 mt-2 mb-3">Maryland, USA</h6>
          </div>
          <p>"Best treatment option with least possible complications compared to other  treatments. This is a placeholder explaining who is our ideal client & stomer and who we prefer to work with such as medical clinics and etc! Best treatment option with least possible!"</p>
          <div class="d-flex justify-content-between pe-4">
            <img src="{{asset('img/ph-1-sign.svg')}}" alt="">
            <img src="{{asset('img/mayo.svg')}}" alt="">
          </div>
        </div>
      </div>
    </div>
    <div class="col-xl-6 mt-xl-0 mt-4">
      <div class="border row m-0">
        <div class="col-xl-4 col-lg-3 col-md-4 ps-0 d-md-block d-none doc-bg" style="background-image:url('{{asset('img/ph-2.png')}}')">
        </div>
        <div class="col-xl-8 col-lg-9 col-md-8 p-4">
          <div class="d-md-none d-block">
            <div class="profile-img">
              <img src="{{asset('/img/ph-2.png')}}" alt="">
            </div>
          </div>
          <div class="text-md-start text-center">
            <div class="d-flex mt-3 align-items-center justify-content-md-start justify-content-center">
              <h4 class="m-0 font-weight-bold">Dr. Nayan Shah</h4>
              <a href="#" class="ms-2"><img src="{{asset('img/linkedin_ic.svg')}}" alt=""> </a>
            </div>
            <h6 class="opacity-50 mt-2 mb-3">Maryland, USA</h6>
          </div>
          <p>"Best treatment option with least possible complications compared to other  treatments. This is a placeholder explaining who is our ideal client & stomer and who we prefer to work with such as medical clinics and etc! Best treatment option with least possible!"</p>
          <div class="d-flex justify-content-between pe-4">
            <img src="{{asset('img/ph-2-sign.svg')}}" alt="">
            <img src="{{asset('img/fl-hosp.svg')}}" alt="">
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="mt-4 bg-grey py-5">
  <div class="container py-lg-4">
    <div class="row align-items-center">
      <div class="col-xl-5 col-lg-6 col-10 offset-lg-0 offset-1">
        <img src="{{asset('img/pc-top.png')}}" class="w-100" alt="">
      </div>
      <div class="col-lg-5 offset-lg-1 mt-lg-0 mt-4">
        <h4 class="subtitle w-100">Don't just treat your symptoms.</h4>
          <hr class="opacity-100">
          <h5>If you are experiencing any of the following:</h5>
          <ul>
            <li>Bleeding</li>
            <li>Itching</li>
            <li>Swelling</li>
            <li>Soiling</li>
            <li>Pain</li>
            <li>Bulging</li>
          </ul>
          <p>Experience long-term relief by solving the root of your problem.</p>
          <div class="d-sm-flex align-items-center my-4">
            <a href="#" class="btn btn-pry">Find a Specialist Today</a>
          </div>
      </div>
    </div>
  </div>
</div>
@endsection
