{{ template "headersMenu.html" . }}


<section class="relative pt-28 min-h-screen" id="home">

    <div class="container relative">
        <div class="relative animate-[spin_30s_linear_infinite] -z-1">
            <span class="relative after:absolute ltr:after:left-0 rtl:after:right-0 after:bottom-1/2 after:translate-y-1/2 after:h-2 after:w-8 after:rounded-md after:bg-indigo-600/20 after:z-10"></span>
            <span class="relative after:absolute ltr:after:left-0 rtl:after:right-0 after:bottom-1/2 after:translate-y-1/2 after:rotate-90 after:h-2 after:w-8 after:rounded-md after:bg-indigo-600/20 after:z-10"></span>
		</div>
        <div class="grid relative grid-cols-1 items-center mb-24 md:grid-cols-2 min-h-screen-250">
            <div class="px-2">
				<div>
					<h4 class="mb-2 text-3xl font-bold text-black md:text-3xl lg:text-4xl dark:text-white">
					<span class="block text-sm font-semibold uppercase">{{ "Nouveau" | t }}</span>
					{{ "Découvrez 'RING'" | t }}</h4>
					<p class="mb-0 text-3xl font-bold text-indigo-600">{{ "Votre sonnette connectée à vos couleurs !" | t }}</p>
                    <div class="relative py-3">
                        <p class="text-xl">{{ "Une sonnette intelligente qui envoie une notification sur votre smartphone quand un visiteur sonne à votre porte." | t }}</p>
                        <ul class="mb-6" style="list-style:square;list-style-position: outside;list-style-type: disclosure-closed;margin: 0 0 0 16px;">
                            <li>{{ "Sans fil, sans pile, sans batterie, sans WiFi" | t }}</li>
                            <li>{{ "Un adhésif puissant au verso pour une installation rapide" | t }}</li>
                            <li>{{ "Une puce NFC verrouillée en écriture et un QR code" | t }}</li>
                            <li class="mt-2 text-xl">{{ "Plusieurs matières et formats possibles sur demande" | t }}</li>
                            <li class="mt-2 text-xl"><a href="#" class="text-blue-600 hover:underline">{{ "'RING' en vidéo cliquez ici" | t }}</a></li>
                        </ul>
                        <div class="mb-12">
                            <label for="feedCount" class="block mb-2 text-lg">{{ "Combien de sonnettes ?" | t }}</label>
                            <input type="number" id="feedCount" name="feedCount" min="1" value="1" class="p-2 text-lg text-center text-black bg-white rounded-md border-2 border-gray-300 dark:bg-black dark:text-white">
                            <button class="px-6 py-2 font-semibold text-white bg-red-600 rounded-full transition hover:bg-red-700">{{ "Commandez votre sonnette" | t }}</button>
                            <p class="my-4 text-2xl font-bold text-red-600">{{ "À partir de 19.90€ - Sans abonnement" | t }}</p>
                        </div>
				</div>
            </div>

			</div>
				<div class="relative pb-12">
                    <img src="/cdn/apps/scan/images/illus-ring-black.png" class="hidden mx-auto dark:inline-block" alt="" />
                    <img src="/cdn/apps/scan/images/illus-ring-white.png" class="inline-block mx-auto dark:hidden" alt="" />
				</div>
        </div>
        
    </div>
    
</section>

<section class="container pb-44 mx-auto">
	<main class="my-12">

        <section class="mb-12">
            <div class="flex justify-center">
                <div class="flex-1">
                    <img src="/cdn/apps/scan/images/01.gif" alt="Quick installation" class="mx-auto mb-4 w-64 rounded-full" style="filter:grayscale(1) contrast(2)">
                    <h4 class="font-semibold text-center">{{ "Installation rapide" | t }}</h4>
                    <p class="text-sm text-center">{{ "Sans fils. Sans perçage. Par simple collage." | t }}</p>
                </div>
                <div class="flex-1">
                    <img src="/cdn/apps/scan/images/02.gif" alt="Visitor ringing" class="mx-auto mb-4 w-64 rounded-full" style="filter:grayscale(1) contrast(2)">
                    <h4 class="font-semibold text-center">{{ "Le visiteur sonne" | t }}</h4>
                    <p class="text-sm text-center">{{ "Approche son smartphone ou scanne le QR code" | t }}</p>
                </div>
                <div class="flex-1">
                    <img src="/cdn/apps/scan/images/03.gif" alt="You respond" class="mx-auto mb-4 w-64 rounded-full" style="filter:grayscale(1) contrast(2)">
                    <h4 class="font-semibold text-center">{{ "Vous répondez" | t }}</h4>
                    <p class="text-sm text-center">{{ "Alerte avec sonnerie sur Smartphone" | t }}</p>
                </div>
                <div class="flex-1">
                    <img src="/cdn/apps/scan/images/04.gif" alt="You chat" class="mx-auto mb-4 w-64 rounded-full" style="filter:grayscale(1) contrast(2)">
                    <h4 class="font-semibold text-center">{{ "Vous tchatez" | t }}</h4>
                    <p class="text-sm text-center">{{ "La photo du visiteur apparaît et vous pouvez tchater" | t }}</p>
                </div>
            </div>
            <p class="mt-8 font-semibold text-center">{{ "Avec RING par SCAN.PM, ne manquez plus un visiteur ou une livraison" | t }}</p>
        </section>

        <section class="text-center">
            <a href="#" class="font-semibold text-blue-600 hover:text-blue-800">{{ "FAQ" | t }}</a>
        </section>
    </main>
`
    <div class="container px-4 py-8 mx-auto">
        <div class="text-center">
            <h1 class="mb-4 text-3xl font-semibold">Avec SCAN.PM, ne manquez plus un visiteur ou une livraison</h1>
            <button class="btn-buy">Acheter 19.90€</button>
        </div>
        <div class="mt-8">
            <h2 class="mb-2 text-2xl font-semibold text-red-600">Nouveau ! L'étiquette devient sonnette connectée</h2>
            <p class="mb-4 text-gray-600">QR code et NFC intégrés, dimension de l'étiquette au standard 10cm x 2.5cm<br>compatible avec de nombreux modèles notamment Decayeux, Renz.</p>
            <img src="https://source.unsplash.com/featured/?mailbox" alt="Mailbox with QR code and NFC" class="mx-auto" style="max-width: 400px;">
        </div>
    </div>

	<main class="overflow-hidden flex-1 mx-auto w-full max-w-md bg-white rounded-lg shadow-md">
        <!-- Call Interface -->
        <div class="p-4">
            <div class="flex justify-center mb-4">
                <div class="flex justify-center items-center w-24 h-24 bg-blue-200 rounded-full">
                    <span class="text-6xl text-blue-600 material-icons">phone_in_talk</span>
                </div>
            </div>
            <p class="mb-8 text-center text-gray-600">Appel en cours...</p>
            <div class="flex justify-between px-12">
                <button class="p-4 text-red-500 rounded-full call-action-button">
                    <span class="text-4xl material-icons">call_end</span>
                </button>
                <button class="p-4 text-green-500 rounded-full call-action-button">
                    <span class="text-4xl material-icons">call</span>
                </button>
            </div>
        </div>

        <!-- Chat Interface -->
        <div class="p-4">
            <div class="p-3 mb-2 rounded-lg chat-bubble">
                <p class="text-sm text-gray-700">Bonjour, famille (depuis canton of Tournefeuille)</p>
                <p class="text-xs text-gray-500">ven, 29 décembre 2023 14:30</p>
            </div>
            <div class="self-end p-3 mb-2 rounded-lg chat-bubble-sender">
                <p class="text-sm text-gray-700">Ok</p>
                <p class="text-xs text-gray-500">14:30</p>
            </div>
            <div class="flex justify-between mt-4">
                <button class="px-6 py-2 text-white bg-green-500 rounded-full">Je sors</button>
                <button class="px-6 py-2 ml-2 text-white bg-green-500 rounded-full">J'arrive dans 2 min</button>
                <button class="px-6 py-2 ml-2 text-white bg-green-500 rounded-full">J'arrive</button>
            </div>
        </div>

        <!-- Call History Interface -->
        <div class="p-4">
            <div class="flex justify-between items-center mb-2">
                <div class="flex items-center">
                    <span class="mr-2 text-green-500 material-icons">phone_forwarded</span>
                    <div>
                        <p class="text-sm font-semibold">Famille</p>
                        <p class="text-xs text-gray-500">Canton of Tournefeuille</p>
                    </div>
                </div>
                <p class="text-xs text-gray-500">14:30</p>
            </div>
            <!-- Repeat for each call log entry -->
        </div>
    </main>


    <div class="container px-6 py-12 mx-auto">
        <h1 class="mb-8 text-4xl font-bold text-center">Les AVANTAGES de SCAN.PM</h1>
        <div class="flex flex-col items-center md:flex-row">
            <div class="flex-1 mb-8 md:mb-0">
                <img src="https://source.unsplash.com/featured/?smartphone" alt="Smartphone Visitor" class="mx-auto mb-4" style="max-width: 200px;">
                <img src="https://source.unsplash.com/featured/?smartphone" alt="Smartphone You" class="mx-auto" style="max-width: 200px;">
            </div>
            <div class="flex-1">
                <div class="flex items-center mb-4">
                    <div class="mr-4 feature-number">1</div>
                    <div>
                        <h2 class="text-xl font-semibold">Installation simple</h2>
                        <p>Par simple collage, sans fil, pas de Wi-Fi nécessaire</p>
                    </div>
                </div>
                <div class="flex items-center mb-4">
                    <div class="mr-4 feature-number">2</div>
                    <div>
                        <h2 class="text-xl font-semibold">Rien à faire après l'installation</h2>
                        <p>Pas de batterie à recharger ou de pile à remplacer</p>
                    </div>
                </div>
                <div class="flex items-center mb-4">
                    <div class="mr-4 feature-number">3</div>
                    <div>
                        <h2 class="text-xl font-semibold">Robuste dans le temps</h2>
                        <p>Support plastifié durable, résiste à la pluie, au soleil, au froid et au gel</p>
                    </div>
                </div>
                <div class="flex items-center mb-4">
                    <div class="mr-4 feature-number">4</div>
                    <div>
                        <h2 class="text-xl font-semibold">Vous recevez une alerte où que vous soyez</h2>
                        <p>Tous les smartphones configurés avec un SCAN.PM peuvent répondre</p>
                    </div>
                </div>
                <div class="flex items-center">
                    <div class="mr-4 feature-number">5</div>
                    <div>
                        <h2 class="text-xl font-semibold">Préserve la vie privée</h2>
                        <p>Aucun visiteur n'a accès à votre n° de téléphone ni aucune autre donnée.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="container px-4 py-8 mx-auto">
        <h1 class="mb-6 font-semibold text-gray-800 faq-header">FAQ</h1>
        <div class="space-y-6">
            <div class="p-6 bg-white rounded-lg shadow">
                <h2 class="text-lg font-semibold text-gray-800">Est-ce que le visiteur doit installer une Application sur son Smartphone pour sonner?</h2>
                <p class="mt-2 text-gray-600">Non et c'est justement intérêt de la solution. En effet un simple navigateur web suffit. Dès lors le scan du QR code lance instantanément l'Application permettant de sonner et tchater avec le résident.</p>
            </div>
            <div class="p-6 bg-white rounded-lg shadow">
                <h2 class="text-lg font-semibold text-gray-800">Puis-je connecter plusieurs smartphones à mon SCAN.PM ?</h2>
                <p class="mt-2 text-gray-600">Tous les smartphones configurés avec un "code" SCAN.PM recevront toutes les notifications. Les résident connectés peuvent tous converser par tchat avec le visiteur.</p>
            </div>
            <div class="p-6 bg-white rounded-lg shadow">
                <h2 class="text-lg font-semibold text-gray-800">J'ai deux domiciles que dois-je commander ?</h2>
                <p class="mt-2 text-gray-600">Dans le cas de plusieurs lieux de résidence il faut commander des SCAN.PM séparés pour avoir un code spécifique par SCAN.PM. Si vous avez 2 résidences vous devez sélectionner un SCAN.PM et ensuite ajuster la Quantité (ici 2).</p>
            </div>
            <div class="p-6 bg-white rounded-lg shadow">
                <h2 class="text-lg font-semibold text-gray-800">Si j'ai plusieurs entrées dans ma résidence, comment puis-je faire?</h2>
                <p class="mt-2 text-gray-600">Il existe des packs de 2 ou 3 SCAN.PM qui ont le même "code" de configuration. Les visiteurs peuvent donc sonner à différents endroits et vous recevrez la notification sur votre Smartphone.</p>
            </div>
            <div class="p-6 bg-white rounded-lg shadow">
                <h2 class="text-lg font-semibold text-gray-800">Quelles sont les fonctionnalités de communication de SCAN.PM</h2>
                <ul class="mt-2 list-disc list-inside text-gray-600">
                    <li>Le produit permet aux résidents abonnés au SCAN.PM installé à leur domicile de recevoir des notifications sur sonnerie du visiteur avec le type de visiteur et sa photo (si le visiteur a accepté d'utiliser la caméra de son téléphone)</li>
                    <li>Il permet aux abonnés au SCAN.PM de tchater en direct avec le visiteur (texte)</li>
                    <li>Le visiteur choisit qui il est via une catégorie (famille, livreur, voisin, etc.) et peut s'il le souhaite prendre une photo au moment ou il sonne</li>
                    <li>L'Application résident permet de garder un historique des visites en local sur le Smartphone et de visualiser les discussions qui ont eu lieu</li>
                </ul>
            </div>
            <div class="p-6 bg-white rounded-lg shadow">
                <h2 class="text-lg font-semibold text-gray-800">Existe t'il une communication Audio et Vidéo avec le visiteur?</h2>
                <p class="mt-2 text-gray-600">Actuellement, notre système ne supporte pas l'audio et la vidéo. Ce choix délibéré s'inscrit dans une démarche qualitative et accessible, visant à offrir un produit à la fois simple, économique (pas d'abonnement) et disponible 24h/24, 7j/7. Notre infrastructure assure une réactivité optimale pour une communication fluide et instantanée via notifications.</p>
            </div>
        </div>
    </div>
	<div class="container px-4 py-8 mx-auto">

	<section class="mb-8">
	<h2 class="mb-2 text-xl font-semibold">Dans quel cas le SCAN.PM est LA SOLUTION pour bien recevoir vos visiteurs et ne manquer aucun contact?</h2>
	<ul class="pl-5 space-y-2 list-disc">
		<li>SCAN.PM fonctionne sans fil et n'a pas besoin de WiFi, idéal pour les portails éloignés de la porte d'entrée.</li>
		<li>Un câble coûteux et compliqué n'est pas nécessaire, contrairement aux solutions avec répéteur WiFi.</li>
		<li>La solution est économique comparée aux sonnettes connectées coûteuses.</li>
		<li>La vie privée est protégée, sans enregistrement vidéo extérieur.</li>
		<li>Installation simple et sans frais supplémentaires pour le changement de pile ou batterie.</li>
	</ul>
	</section>

	<section class="mb-8">
	<h2 class="mb-2 text-xl font-semibold">Puis-je configurer mon message d'accueil?</h2>
	<p>Oui, et il est fortement conseillé d'utiliser des EMOJI dans le message d'accueil 😊</p>
	</section>

	<section class="mb-8">
	<h2 class="mb-2 text-xl font-semibold">Est-ce que l'Application Smartphone fonctionne sur tous les produits Apple?</h2>
	<p>SCAN.PM fonctionne sur iPad et iPhone incluant la dernière version publiée par Apple iOS 17.1</p>
	</section>

	<section class="mb-8">
	<h2 class="mb-2 text-xl font-semibold">Est-ce que l'Application Résident fonctionne sur tous les smartphones?</h2>
	<ul class="pl-5 space-y-2 list-disc">
		<li>ANDROID: Compatible avec les smartphones Android où l'app est téléchargée depuis le Play Store Google.</li>
		<li>APPLE: Fonctionne sur iPhone & iPad avec les versions officielles de l'OS. Les versions beta non officielles ne sont pas garanties.</li>
	</ul>
	</section>

	<section>
	<h2 class="mb-2 text-xl font-semibold">Comment installer le SCAN.PM sur une surface en métal?</h2>
	<p>Le "tag NFC" doit être fixé à 1 ou 2 mm de distance du métal. Utilisez du ruban adhésif double face avec une épaisseur de 1,5mm.</p>
	</section>
	</div>

	<div class="faq-header">
		<h2 class="text-xl font-semibold">Comment installer les SCAN.PM sur une surface en métal?</h2>
	</div>
	<div class="faq-body">
		<p>Le "tag NFC" étant une antenne il doit être fixé à 1 ou 2 mm de distance du métal. Pour cela vous pouvez utiliser sur ruban adhésif double face avec une épaisseur de 1,5mm.</p>
	</div>

	<div class="faq-header">
		<h2 class="text-xl font-semibold">Est-ce que l'on peut faire un retour de l'article s'il est endommagé?</h2>
	</div>
	<div class="faq-body">
		<ul class="pl-5 list-disc">
			<li>Généralement nous ne remplaçons pas les SCAN.PM endommagés et nous n'avons pas de retour en ce sens. Aucun vendeur de sonnette ne prendra l'engagement de remplacer une sonnette endommagée par le temps.</li>
			<li>S'il s'agit de façon évidente d'un souci de fabrication et que le souci intervient dans le mois suivant l'achat nous demanderons une photo de votre objet pour expertise et le remplaceront si le souci de production est avéré. Pour l'instant nous avons remplacé un SCAN.PM qui avait été mal réalisé.</li>
		</ul>
	</div>

	<div class="faq-header">
		<h2 class="text-xl font-semibold">Peut-on utiliser le produit SCAN.PM dans une résidence/immeuble?</h2>
	</div>
	<div class="faq-body">
		<p>Oui et c'est un excellent cas d'usage car les interphones peuvent être en panne et un SCAN.PM sur la boite au lettre est un excellent endroit pour être sur de pouvoir être contacté. Dans ce cas le SCAN.PM vous permet que vous soyez de discuter par tchat avec votre visiteur.</p>
	</div>

	<div class="faq-header">
		<h2 class="text-xl font-semibold">Puis faire ajouter mon Nom/Prénom sur mon SCAN.PM?</h2>
	</div>
	<div class="faq-body">
		<p>Absolument, il y a une option de personnalisation du SCAN.PM, cela peut être votre nom/prénom ou un texte libre. La taille de la personnalisation peut aller jusqu'à 20 caractères et nous pouvons aller au delà sur validation du design de votre part.</p>
	</div>

	<div class="faq-header">
		<h2 class="text-xl font-semibold">Puis je mettre en "sourdine" les notifications SCAN.PM?</h2>
	</div>
	<div class="faq-body">
		<ul class="pl-5 list-disc">
			<li>Sur Apple et Android vous pouvez désactiver les notifications nativement dans la configuration de l'Application (fonction standard de iOS et Android)</li>
			<li>Sur Android l'Application .PM elle même possède une fonction d'activation/désactivation d'un SCAN.PM</li>
		</ul>
	</div>

	<div class="faq-header">
		<h2 class="text-xl font-semibold">Quelles sont les futures évolutions du produit SCAN.PM?</h2>
	</div>
	<div class="faq-body">
		<ul class="pl-5 list-disc">
			<li>Configuration plus détaillée de la notification notamment sur iOS (vibreur, sonnerie encore plus longue)</li>
			<li>Gestion de la localisation de la personne qui scanne le SCAN.PM afin d'éviter les fausses alertes</li>
		</ul>
	</div>
</section>


{{ template "footerMenu.html" . }}