const Specialties = () => (
  <section className="section section--parchment" id="specialties">
    <div className="container">
      <div className="section__head">
        <span className="eyebrow eyebrow--gold">Specialties</span>
        <h2 className="h-display section__title">The providers we <em>place</em>.</h2>
        <p className="lede">
          A focused network across the four corners of provider-owned medical aesthetics.
          Each candidate is credentialed, references-checked, and personally introduced.
        </p>
      </div>
      <div className="specialties__grid">
        <div className="specialties__cell">
          <i data-lucide="syringe" className="specialties__icon"></i>
          <h3 className="specialties__title">Aesthetic <em>Injectors</em></h3>
          <ul className="specialties__items">
            <li>Nurse Practitioners (FNP, DNP)</li>
            <li>Registered Nurses (RN, BSN)</li>
            <li>Physician Associates</li>
            <li>Cosmetic Dental Providers</li>
          </ul>
          <span className="specialties__cell-meta">VIEW PROVIDERS →</span>
        </div>
        <div className="specialties__cell">
          <i data-lucide="sparkles" className="specialties__icon"></i>
          <h3 className="specialties__title">Master <em>Estheticians</em></h3>
          <ul className="specialties__items">
            <li>Master licensure required</li>
            <li>Laser & device experience</li>
            <li>Medical-grade product expertise</li>
            <li>Skin health protocols</li>
          </ul>
          <span className="specialties__cell-meta">VIEW PROVIDERS →</span>
        </div>
        <div className="specialties__cell">
          <i data-lucide="leaf" className="specialties__icon"></i>
          <h3 className="specialties__title">Functional <em>Wellness</em></h3>
          <ul className="specialties__items">
            <li>Hormone optimization NPs</li>
            <li>Medical weight loss</li>
            <li>Peptide & longevity</li>
            <li>Functional medicine MDs</li>
          </ul>
          <span className="specialties__cell-meta">VIEW PROVIDERS →</span>
        </div>
        <div className="specialties__cell">
          <i data-lucide="user-round" className="specialties__icon"></i>
          <h3 className="specialties__title">Practice <em>Leadership</em></h3>
          <ul className="specialties__items">
            <li>Medical directors</li>
            <li>Spa managers</li>
            <li>Lead estheticians</li>
            <li>Patient coordinators</li>
          </ul>
          <span className="specialties__cell-meta">VIEW PROVIDERS →</span>
        </div>
      </div>
    </div>
  </section>
);

Object.assign(window, { Specialties });