Outiref

Code source de l'URL : https://kentucodia.com

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Studio de Design, Animations & Dev</title>
    <link rel="stylesheet" href="css/style.css">
	<link rel="icon" type="image/png" href="img/logoicon.jpg">
	<script src="https://www.google.com/recaptcha/api.js?onload=initRecaptchas&render=explicit" async defer></script>
</head>
<body>

	<header>
        <!--div class="logo-placeholder" data-i18n="footer-logo">LOGO</div-->
		<a href="index.html" class="logo-container"><img src="img/logoktnn.png" alt="Logo Kentucodia"></a>

        <div class="menu-toggle" id="mobile-menu-btn">
            <span class="bar"></span>
            <span class="bar"></span>
            <span class="bar"></span>
        </div>

        <nav class="main-menu" id="main-nav">
            <ul>
                <li><a href="#a-propos" data-i18n="menu-about">À PROPOS</a></li>
                <li><a href="#produits" data-i18n="menu-products">PRODUITS</a></li>
                <!--li><a href="#realisations" data-i18n="menu-projects">RÉALISATIONS</a></li-->
                <li><a href="javascript:void(0)" onclick="showRealisationsSection()" data-i18n="menu-projects">RÉALISATIONS</a></li>
                <li><a href="#contact" data-i18n="menu-contact">CONTACT</a></li>
                <!--<li><a href="#" class="btn-subscribe" id="open-login-btn" data-i18n="menu-subscribe">S'ABONNER</a></li>-->
            </ul>
            <div class="lang-selector">
                <button onclick="changeLang('fr')" class="active">FR</button>
                <button onclick="changeLang('en')">EN</button>
                <button onclick="changeLang('es')">ES</button>
            </div>
        </nav>
    </header>

    <main>
	<section id="accueil-intro">
		<div class="intro-container">
			<div class="intro-image">
				<img src="img/accueil/3dstudio.webp" alt="Présentation Kentucodia">
			</div>
			<div class="intro-text">
				<h2 data-i18n="intro-title">L'Excellence du Design ! C’est un équilibre fragile.</h2>
				<p data-i18n="intro-p1">Imaginez la 3D non pas comme un assemblage de polygones froids, mais comme une argile invisible que l'on pétrit pour donner corps à un récit.</p>
				<p data-i18n="intro-p2">Chaque texture, chaque oscillation d’une courbe d’animation est une main tendue.</p>
				<p data-i18n="intro-p3">Nous ne cherchons pas à produire des images "époustouflantes" pour la gloire du pixel, mais à bâtir des espaces où l’utilisateur se sent compris et respecté.</p>
				<p data-i18n="intro-p4">L'excellence, c'est cette capacité à anticiper le besoin de clarté tout en offrant une profondeur qui nourrit l'imaginaire.</p>                    
			</div>  
		</div>
	</section>	
	<section id="accueil-intro">
		<div class="intro-container">
			
			<div class="intro-text">
				<h2 data-i18n="intro2-title">Développement Web, mobile & IA</h2>
				<p data-i18n="intro2-p1">Un site qui rame, une appli qui bug, une IA qui devine mal : c'est l'utilisateur qui paie la note.</p>
				<p data-i18n="intro2-p2">Nous, on pense l'inverse. Chaque ligne de code est écrite pour disparaître - au profit d'un geste qui répond du premier coup, d'une page qui charge avant même qu'on y pense, d'un modèle qui comprend sans qu'on ait à insister.</p>
				<p data-i18n="intro2-p3">La technique n'est jamais le sujet. Elle est ce qui rend le sujet - vous, votre usage, votre quotidien - plus simple à vivre.</p>
				<p data-i18n="intro2-p4">C'est ça, notre définition de l'excellence : tout ce travail invisible, pour un résultat qui, lui, ne se remarque même pas. Il fonctionne, c'est tout.</p>                    
			</div>  
			<div class="intro-image">
				<img src="img/webdev.jpg" alt="Présentation Kentucodia">
			</div>
		</div>
	</section>		
        <section id="a-propos">
        <div class="content">
            <h1 data-i18n="about-title">À PROPOS</h1>
            <p data-i18n="about-p1">Kentucodia fait partie d’un écosystème multiculturel et international de créatifs et d’agences, tous spécialisés dans le numérique, le développement web & mobile, le design immobilier, l’animation et les nouvelles technologies comme l'intelligence artificielle.</p>
            <p data-i18n="about-p2">Des méthodes techniques et créatives éprouvées, une solide connaissance de l’art contemporain, une expertise en communication visuelle et une maîtrise des technologies (3D, réalité virtuelle, développement d'applications, IA, gaming, …), alliées au talent de nos équipes, sont les atouts qui font de Kentucodia un partenaire de choix.</p>
            <p data-i18n="about-p3">Nous imaginons et réalisons des plateformes web et mobiles sur mesure, des solutions intégrant l'IA, des récits visuels, des événements virtuels, des films d’animation 3D, des décors virtuels, des visites immersives ou des jeux vidéo qui plongent vos clients au cœur de votre univers.</p>
        </div>
        </section>

        <section id="produits">
            <div class="content">
                <h1 data-i18n="products-main-title">Nos Solutions de Visualisation 3D & Design</h1>
                
                <div class="products-grid">
                    <div class="product-block">
                        <h2 data-i18n="prod-c1-title">Visualisation Photoréaliste (Perspectives)</h2>
                        <div>
                            <h3 data-i18n="prod-c1-h1">Perspectives Architecturales (In/Ex) : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod-c1-l1">Rendu haute définition pour magnifier vos projets immobiliers : de l'aménagement extérieur et écrin végétal à l'architecture des façades et du design d'intérieur.</li>
                            </ul>
                            <h3 data-i18n="prod-c1-h2">Axonométries Éclatées : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod-c1-l2">Une vue didactique et esthétique pour comprendre l’organisation spatiale et les volumes d'un étage ou d'un bâtiment complet.</li>
                            </ul>
                            <h3 data-i18n="prod-c1-h3">Plans Masse Illustrés : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod-c1-l3">Mise en valeur paysagère et insertion urbaine pour une vision globale de l'implantation.</li>
                            </ul>
                        </div>
                    </div>

                    <div class="product-block">
                        <h2 data-i18n="prod-c2-title">Expériences Immersives & Interactives</h2>
                        <div>
                            <h3 data-i18n="prod-c2-h1">Visites Virtuelles 360° :</h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod-c2-l1">Navigation fluide au cœur du projet pour une immersion totale avant même le premier coup de pioche.</li>
                            </ul>
                            <h3 data-i18n="prod-c2-h2">Maquettes Orbitales 360° : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod-c2-l2">Manipulation interactive du bâtiment sous tous les angles, avec option de découpe horizontale pour explorer les niveaux intérieurs.</li>
                            </ul>
                            <h3 data-i18n="prod-c2-h3">Configurateur de Matériaux : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod-c2-l3">Possibilité de changer les revêtements ou les ambiances en temps réel lors de la visite.</li>
                            </ul>
                        </div>
                    </div>
                </div>

                <div class="products-grid">
                    <div class="product-block">
                        <h2 data-i18n="prod-c3-title">Animation & Motion Design</h2>
                        <div>
                            <h3 data-i18n="prod-c3-h1">Films d’Animation Architecturale : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod-c3-l1">Travelling vidéo fluide et scénarisé pour raconter l’histoire d’un projet et susciter l’émotion.</li>
                            </ul>
                            <h3 data-i18n="prod-c3-h2">Montages Vidéo avec Drone : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod-c3-l2">Insertion de votre projet 3D dans un environnement réel filmé.</li>
                            </ul>
                        </div>
                    </div>

                    <div class="product-block">
                        <h2 data-i18n="prod-c4-title">Architecture d'Intérieur & Design d'Espace</h2>
                        <div>
                            <h3 data-i18n="prod-c4-h1">Conception d’Aménagements sur Mesure : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod-c4-l1">Études ergonomiques et esthétiques pour optimiser les espaces de vie ou de travail.</li>
                            </ul>
                            <h3 data-i18n="prod-c4-h2">Moodboards & Sélection de Mobilier : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod-c4-l2">Accompagnement sur le choix des textures, des couleurs et du mobilier pour une cohérence parfaite. </li>
                            </ul>                    
                        </div>
                    </div>
                </div>
            </div>
        </section>
		<section id="produits">
            <div class="content">
                <h1 data-i18n="products2-main-title">Nos Solutions de Développement Web, Mobile & IA</h1>
                
                <div class="products-grid">
                    <div class="product-block">
                        <h2 data-i18n="prod2-c1-title">Applications Web & Plateformes sur Mesure</h2>
                        <div>
                            <h3 data-i18n="prod2-c1-h1">Sites Web & Plateformes Immersives : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod2-c1-l1">Développement sur mesure (SaaS, sites vitrines, portails) alliant haute performance, design moderne et sécurité.</li>
                            </ul>
                            <h3 data-i18n="prod2-c1-h2">Tableaux de Bord & Outils Métiers : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod2-c1-l2">Interfaces de gestion intuitives pour centraliser vos données, optimiser vos processus et piloter votre activité.</li>
                            </ul>
                            
                        </div>
                    </div>

                    <div class="product-block">
                        <h2 data-i18n="prod2-c2-title">Développement Mobile Intuitif</h2>
                        <div>
                            <h3 data-i18n="prod2-c2-h1">Applications iOS & Android Natifs / Cross-Platform :</h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod2-c2-l1">Applications mobiles fluides, réactives et performantes conçues pour offrir une expérience utilisateur exceptionnelle.</li>
                            </ul>
                            <h3 data-i18n="prod2-c2-h2">Fonctionnalités Avancées & Hors-Ligne : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod2-c2-l2">Intégration de géolocalisation, notifications push, paiement sécurisé et synchronisation des données en temps réel.</li>
                            </ul>
                          </div>  
                    </div>
                </div>
				
                <div class="products-grid">
                    <div class="product-block">
                        <h2 data-i18n="prod2-c3-title">Intelligence Artificielle & Automatisation</h2>
                        <div>
                            <h3 data-i18n="prod2-c3-h1">Intégration de Modèles d'IA sur Mesure : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod2-c3-l1">Agents virtuels, assistants intelligents et génération de contenus automatisés adaptés à votre secteur.</li>
                            </ul>
                            <h3 data-i18n="prod2-c3-h2">Analyse de Données & Prédiction : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod2-c3-l2">Algorithmes intelligents pour automatiser vos tâches répétitives, analyser vos métriques et anticiper les tendances.</li>
                            </ul>
                        </div>
                    </div>

                    <div class="product-block">
                        <h2 data-i18n="prod2-c4-title">Architecture Software & API</h2>
                        <div>
                            <h3 data-i18n="prod2-c4-h1">Conception d'APIs & Intégration : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod2-c4-l1">Connexion transparente entre vos systèmes, outils 3D, bases de données et services tiers.</li>
                            </ul>
                            <h3 data-i18n="prod2-c4-h2">Maintenance & Scalabilité : </h3>
                            <ul class="liste-retrait">
                                <li data-i18n="prod2-c4-l2">Infrastructure robuste et optimisée pour accompagner la croissance de vos projets en toute sécurité.</li>
                            </ul>                    
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <section id="contact">
            <div class="content-contact">
                <h1 data-i18n="contact-title">CONTACT</h1>
                <form class="contact-form" id="contactForm" action="backend/contact.php" method="POST">
                    <input type="text" name="nom" id="contactNom" placeholder="Nom" required data-i18n="contact-name-ph">
                    <input type="email" name="email" id="contactEmail" placeholder="Email" required>
                    <textarea name="message" id="contactMessage" placeholder="Votre message..." rows="5" required data-i18n="contact-msg-ph"></textarea>
                    
					<div id="recaptcha-contact" class="captcha-box"></div>
                    
                    <button type="submit" data-i18n="contact-btn">Envoyer</button>
                </form>
            </div>
        </section>

        <section id="realisations">
            <div class="content-contact">
                <h1 data-i18n="projects-title">RÉALISATIONS</h1>
                
                <ul class="sub-menu">
                    <li onclick="showTab('orbitale')" class="active" data-i18n="tab-orbital">Maquette orbitale</li>
                    <li onclick="showTab('maq360')" data-i18n="tab-maq360">Maquette 360</li>
					<li onclick="showTab('vv')" data-i18n="tab-vv">Visite virtuelle</li>
					<li onclick="showTab('anim')" data-i18n="tab-anim">Animation</li>
                    <li onclick="showTab('ext')" data-i18n="tab-ext">Perspectives extérieures</li>
                    <li onclick="showTab('int')" data-i18n="tab-int">Perspectives intérieures</li>
                    <li onclick="showTab('plans')" data-i18n="tab-plans">Plans 3D / Axonométries</li>
                    <li onclick="showTab('staging')" data-i18n="tab-staging">Home staging</li>
                </ul>

                <div class="tab-content-container">
                    
					<div id="orbitale" class="tab-pane active">
						<!--a href="page_orbitale.html" class="btn-voir-plus"><span data-i18n="btn-see-more">Voir plus</span> &#10140;</a-->
						<div class="slider" id="slider-orbitale"></div>
					</div>

					<div id="maq360" class="tab-pane">
						<!--a href="page_maq360.html" class="btn-voir-plus"><span data-i18n="btn-see-more">Voir plus</span> &#10140;</a-->

						<div class="slider" id="slider-maq360"></div>
					</div>	
					
					<div id="vv" class="tab-pane">
						<!--a href="page_visite.html" class="btn-voir-plus"><span data-i18n="btn-see-more">Voir plus</span> &#10140;</a-->

						<div class="slider" id="slider-vv"></div>
					</div>				
					
					<div id="anim" class="tab-pane">
						<!--a href="page_animation.html" class="btn-voir-plus"><span data-i18n="btn-see-more">Voir plus</span> &#10140;</a-->

						<div class="slider" id="slider-anim"></div>
					</div>
					
					<div id="ext" class="tab-pane">
						<!--a href="page_ext.html" class="btn-voir-plus"><span data-i18n="btn-see-more">Voir plus</span> &#10140;</a-->

						<div class="slider" id="slider-ext"></div>
					</div>

					<div id="int" class="tab-pane">
						<!--a href="page_int.html" class="btn-voir-plus"><span data-i18n="btn-see-more">Voir plus</span> &#10140;</a-->

						<div class="slider" id="slider-int"></div>
					</div>

					<div id="plans" class="tab-pane">
						<!--a href="page_plans.html" class="btn-voir-plus"><span data-i18n="btn-see-more">Voir plus</span> &#10140;</a-->
						<div class="slider" id="slider-plans"></div>
					</div>
					
                    <div id="staging" class="tab-pane">
                        <!--a href="page_staging.html" class="btn-voir-plus"><span data-i18n="btn-see-more">Voir plus</span> &#10140;</a-->
                        
                        <div class="slider" id="slider-staging"></div>
                    </div>

                </div>
            </div>
        </section>
    </main>

    <footer>
        <div class="footer-left">
            <!--div class="logo-placeholder" data-i18n="footer-logo">[ VOTRE LOGO ICI ]</div-->
			<a href="index.html" class="logo-container"><img src="img/logoktnn.png" alt="Logo Kentucodia"></a>
        </div>
        <div class="footer-center">
            <a href="javascript:void(0)" onclick="openCGU()" data-i18n="footer-cgu">Conditions Générales d'Utilisation (CGU)</a>
        </div>
        <div class="footer-right">
            <p data-i18n="footer-info">© 2024 Kentucodia SASU<br>47 Rue Vivienne, 75002 Paris<br>commercial@kentucodia.com<br> (+33) 6 51 38 41 30 <br> <!--<a href='https://wa.me/261321808260' target='_blank' style='color: #FF0000; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; margin-top: 8px; font-weight: bold; font-size: 1.1rem;'><svg width='22' height='22' viewBox='0 0 24 24' fill='currentColor'><path d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51a12.8 12.8 0 0 0-.57-.01c-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 0 0-3.48-8.413Z'/></svg> (+261) 32 18 082 60</a>!--></p>
        </div>
    </footer>

    <script src="js/script.js"></script>
	
	<div id="auth-modal" class="modal">
        <div class="modal-content">
            <span class="close-btn" id="close-modal-btn">&times;</span>

            <div id="login-form-container">
                <h2 data-i18n="auth-login-title">CONNEXION</h2>
                <form action="backend/login.php" method="POST">
                    <input type="email" name="email" placeholder="Email" required>
                    <input type="password" name="password" placeholder="Mot de passe" required data-i18n="auth-pwd-ph">
                    
					<div id="recaptcha-login" class="captcha-box"></div>
                    
					<button type="submit" class="btn-submit" data-i18n="auth-login-btn">Se connecter</button>
                </form>
                <p class="switch-form" data-i18n="auth-switch-reg">Pas encore membre ? <a href="#" id="show-register">S'inscrire ici</a></p>
            </div>

            <div id="register-form-container" style="display: none;">
                <h2 data-i18n="auth-register-title">INSCRIPTION</h2>
                <form action="backend/register.php" method="POST">
                    <input type="text" name="nom" placeholder="Nom complet" required data-i18n="auth-name-ph">
                    <input type="email" name="email" placeholder="Email" required>
                    <input type="password" name="password" placeholder="Mot de passe" required data-i18n="auth-pwd-ph">
					
					<div id="recaptcha-register" class="captcha-box"></div>
					
                    <button type="submit" class="btn-submit" data-i18n="auth-register-btn">Créer un compte</button>
                </form>
                <p class="switch-form" data-i18n="auth-switch-log">Déjà membre ? <a href="#" id="show-login">Se connecter</a></p>
            </div>
        </div>
    </div>

	
	<div id="cgu-modal" class="modal">
		<div class="modal-content" style="max-width: 1000px; text-align: left; padding: 40px 20px 40px 40px; position: relative;">

			<span class="close-btn" onclick="closeCGU()" style="position: absolute; top: 5px; right: 20px; z-index: 10;">&times;</span>

			<div id="cgu-content-area" style="max-height: 75vh; overflow-y: auto; padding-right: 20px;">
				<p style="text-align:center;">Chargement des conditions...</p>
			</div>
		</div>
	</div>	
	
	<script>
		// Désactiver le clic droit
		/*document.addEventListener('contextmenu', event => event.preventDefault());

		// Désactiver les raccourcis clavier développeur (F12, Ctrl+Shift+I, Ctrl+U)
		document.onkeydown = function(e) {
			if (e.keyCode == 123 || 
			   (e.ctrlKey && e.shiftKey && (e.keyCode == 'I'.charCodeAt(0) || e.keyCode == 'C'.charCodeAt(0) || e.keyCode == 'J'.charCodeAt(0))) || 
			   (e.ctrlKey && e.keyCode == 'U'.charCodeAt(0))) {
				return false;
			}
		}*/
	</script>	
</body>
</html>