{#
    Feature: Customer Sign-In Kiosk
    PRD: Feature 2 (lines 125-133)
    SDD: PRD Mapping (lines 286-296)
#}
<article class="modern-feature modern-feature--left" data-posthog-section="kiosk">
    <div class="modern-feature__content">
        <h3 class="modern-feature__title">Customer Sign-In Kiosk</h3>
        <p class="modern-feature__description">
            Self-service tablet kiosk that captures customer information in seconds. Eliminate paperwork and reduce wait times with fast phone/name lookup.
        </p>
        <ul class="modern-feature__list">
            <li>
                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
                Self-service check-in via tablet
            </li>
            <li>
                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
                Phone/name lookup for returning customers
            </li>
            <li>
                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
                Automated wait time estimates
            </li>
            <li>
                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
                SMS notifications when ready
            </li>
        </ul>
    </div>
    <div class="modern-feature__image">
        <a href="/images/front/features/check-in.png" onclick="window.featureLightbox(this.href, 'Customer Sign-In Kiosk'); return false;" class="modern-lightbox-trigger" data-lightbox-caption="Customer Sign-In Kiosk">
            <img src="/images/front/features/check-in.png" alt="Customer using BuyerKiosk sign-in tablet" loading="lazy" width="400" height="280">
            <span class="modern-feature__zoom-hint">
                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" width="20" height="20">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0zM10 7v3m0 0v3m0-3h3m-3 0H7"/>
                </svg>
                Click to enlarge
            </span>
        </a>
    </div>
</article>