{"id":52,"date":"2025-10-09T21:34:31","date_gmt":"2025-10-09T19:34:31","guid":{"rendered":"https:\/\/solidaire.webgraphisteabs.com\/?page_id=52"},"modified":"2025-10-12T13:22:14","modified_gmt":"2025-10-12T11:22:14","slug":"solidarite","status":"publish","type":"page","link":"https:\/\/solidaire.webgraphisteabs.com\/","title":{"rendered":"Solidarit\u00e9"},"content":{"rendered":"
\r\n \n\n\n \n \n Ensemble Solidaire<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <style>\n body {\n box-sizing: border-box;\n }\n .hero-gradient {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n }\n .card-hover {\n transition: transform 0.3s ease, box-shadow 0.3s ease;\n }\n .card-hover:hover {\n transform: translateY(-5px);\n box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);\n }\n .fade-in {\n opacity: 0;\n transform: translateY(20px);\n transition: opacity 0.6s ease, transform 0.6s ease;\n }\n .fade-in.visible {\n opacity: 1;\n transform: translateY(0);\n }\n <\/style>\n<\/head>\n<body class=\"font-sans\">\n <!-- Navigation -->\n <nav class=\"bg-white shadow-lg fixed w-full top-0 z-50\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n <div class=\"flex justify-between items-center h-16\">\n <div class=\"flex items-center\">\n <svg class=\"w-8 h-8 text-blue-600 mr-3\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"\/>\n <\/svg>\n <span class=\"text-xl font-bold text-gray-800\">Ensemble Solidaire<\/span>\n <\/div>\n <div class=\"hidden md:block\">\n <div class=\"ml-10 flex items-baseline space-x-4\">\n <a href=\"#\" onclick=\"showPage('accueil')\" class=\"nav-link text-blue-600 hover:text-blue-800 px-3 py-2 rounded-md text-sm font-medium transition-colors\">Accueil<\/a>\n <a href=\"#\" onclick=\"showPage('apropos')\" class=\"nav-link text-gray-700 hover:text-blue-600 px-3 py-2 rounded-md text-sm font-medium transition-colors\">\u00c0 propos<\/a>\n <a href=\"#\" onclick=\"showPage('contact')\" class=\"nav-link text-gray-700 hover:text-blue-600 px-3 py-2 rounded-md text-sm font-medium transition-colors\">Contact<\/a>\n <\/div>\n <\/div>\n <div class=\"md:hidden\">\n <button onclick=\"toggleMobileMenu()\" class=\"text-gray-700 hover:text-blue-600\">\n <svg class=\"w-6 h-6\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 6h16M4 12h16M4 18h16\"><\/path>\n <\/svg>\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n <div id=\"mobile-menu\" class=\"md:hidden hidden bg-white border-t\">\n <div class=\"px-2 pt-2 pb-3 space-y-1\">\n <a href=\"#\" onclick=\"showPage('accueil'); toggleMobileMenu()\" class=\"block px-3 py-2 text-blue-600 font-medium\">Accueil<\/a>\n <a href=\"#\" onclick=\"showPage('apropos'); toggleMobileMenu()\" class=\"block px-3 py-2 text-gray-700 hover:text-blue-600\">\u00c0 propos<\/a>\n <a href=\"#\" onclick=\"showPage('contact'); toggleMobileMenu()\" class=\"block px-3 py-2 text-gray-700 hover:text-blue-600\">Contact<\/a>\n <\/div>\n <\/div>\n <div class=\"pub\">\n <style>\n body {\n font-family: var(--wp--preset--font-family--source-serif-pro);\n line-height: 1.5;\n background-color: #754EA6;\n font-size: 30px;\n background-color: #f7f7f7;\n }\n\n .marquee {\n box-shadow: 0 1px 3px rgba(0, 0, 0, .1);\n border: 1px solid rgba(0, 0, 0, .15);\n background-color: red;\n overflow: hidden;\n position: relative;\n height: 50px;\n width: 100%;\n \/* Full width of its parent *\/\n white-space: nowrap;\n }\n\n .marquee p {\n position: absolute;\n width: auto;\n height: 100%;\n margin: 0;\n line-height: 50px;\n text-align: center;\n\t\t\tcolor:white;\n \/* Start off the right edge *\/\n transform: translateX(100%);\n \/* Animate to the left *\/\n animation: scroll-left 40s linear infinite;\n }\n\n @keyframes scroll-left {\n 0% {\n transform: translateX(100%);\n }\n\n 100% {\n transform: translateX(-100%);\n }\n }\n <\/style>\n<\/head>\n\n<body>\n <div class=\"marquee\">\n <p>Le site solidaire.webgraphisteabs.com constitue un exemple de publicit\u00e9 affili\u00e9e au site principal <a href='https:\/\/www.webgraphisteabs.com\/' style='text-decoration: none; color:white;'>www.webgraphisteabs.com<\/a><\/p>\n <\/div>\n\n<\/body>\n <\/div>\n <\/nav>\n\n <!-- Page d'accueil -->\n <div id=\"page-accueil\" class=\"page-content\">\n <!-- Hero Section -->\n <section class=\"hero-gradient text-white pt-20\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20\">\n <div class=\"text-center\">\n <h1 class=\"text-4xl md:text-6xl font-bold mb-6 fade-in\">Ensemble pour un monde meilleur<\/h1>\n <p class=\"text-xl md:text-2xl mb-8 max-w-3xl mx-auto fade-in\">Notre association \u0153uvre chaque jour pour cr\u00e9er des liens solidaires et apporter une aide concr\u00e8te aux plus d\u00e9munis.<\/p>\n <div class=\"flex flex-col sm:flex-row gap-4 justify-center fade-in\">\n <button onclick=\"showPage('apropos')\" class=\"bg-white text-blue-600 px-8 py-3 rounded-full font-semibold hover:bg-gray-100 transition-colors\">D\u00e9couvrir nos actions<\/button>\n <button onclick=\"showPage('contact')\" class=\"border-2 border-white text-white px-8 py-3 rounded-full font-semibold hover:bg-white hover:text-blue-600 transition-colors\">Nous rejoindre<\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Nos valeurs -->\n <section class=\"py-20 bg-gray-50\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n <div class=\"text-center mb-16\">\n <h2 class=\"text-3xl md:text-4xl font-bold text-gray-800 mb-4\">Nos valeurs<\/h2>\n <p class=\"text-lg text-gray-600 max-w-2xl mx-auto\">Des principes qui guident chacune de nos actions<\/p>\n <\/div>\n <div class=\"grid md:grid-cols-3 gap-8\">\n <div class=\"card-hover bg-white p-8 rounded-xl shadow-md text-center\">\n <div class=\"w-16 h-16 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-6\">\n <svg class=\"w-8 h-8 text-blue-600\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z\"\/>\n <\/svg>\n <\/div>\n <h3 class=\"text-xl font-semibold text-gray-800 mb-4\">Solidarit\u00e9<\/h3>\n <p class=\"text-gray-600\">Nous croyons en la force du collectif et en l’importance de tendre la main \u00e0 ceux qui en ont besoin.<\/p>\n <\/div>\n <div class=\"card-hover bg-white p-8 rounded-xl shadow-md text-center\">\n <div class=\"w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-6\">\n <svg class=\"w-8 h-8 text-green-600\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M16 4c0-1.11.89-2 2-2s2 .89 2 2-.89 2-2 2-2-.89-2-2zm4 18v-6h2.5l-2.54-7.63A1.5 1.5 0 0 0 18.54 8H16c-.8 0-1.54.37-2.01.99l-2.54 3.38c-.74.99-.74 2.31 0 3.3l1.04 1.38c.27.36.43.81.43 1.28V22h2v-4.67c0-.22-.04-.44-.11-.65L13.77 14l1.33-1.78L16.82 16H20z\"\/>\n <\/svg>\n <\/div>\n <h3 class=\"text-xl font-semibold text-gray-800 mb-4\">Respect<\/h3>\n <p class=\"text-gray-600\">Chaque personne m\u00e9rite dignit\u00e9 et respect, quelles que soient ses origines ou sa situation.<\/p>\n <\/div>\n <div class=\"card-hover bg-white p-8 rounded-xl shadow-md text-center\">\n <div class=\"w-16 h-16 bg-purple-100 rounded-full flex items-center justify-center mx-auto mb-6\">\n <svg class=\"w-8 h-8 text-purple-600\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\/>\n <\/svg>\n <\/div>\n <h3 class=\"text-xl font-semibold text-gray-800 mb-4\">Engagement<\/h3>\n <p class=\"text-gray-600\">Notre d\u00e9termination nous pousse \u00e0 agir concr\u00e8tement pour cr\u00e9er un impact positif durable.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Nos actions -->\n <section class=\"py-20\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n <div class=\"text-center mb-16\">\n <h2 class=\"text-3xl md:text-4xl font-bold text-gray-800 mb-4\">Nos actions<\/h2>\n <p class=\"text-lg text-gray-600 max-w-2xl mx-auto\">Des initiatives concr\u00e8tes pour un impact r\u00e9el<\/p>\n <\/div>\n <div class=\"grid md:grid-cols-2 lg:grid-cols-3 gap-8\">\n <div class=\"card-hover bg-white rounded-xl shadow-lg overflow-hidden\">\n <div class=\"h-48 bg-gradient-to-br from-orange-400 to-red-500 flex items-center justify-center\">\n <svg class=\"w-20 h-20 text-white\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M11 9h2V6h3V4h-3V1h-2v3H8v2h3v3zm-4 9c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2zm-9.83-3.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03L21.7 4H5.21l-.94-2H1v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.13 0-.25-.11-.25-.25z\"\/>\n <\/svg>\n <\/div>\n <div class=\"p-6\">\n <h3 class=\"text-xl font-semibold text-gray-800 mb-3\">Distribution alimentaire<\/h3>\n <p class=\"text-gray-600\">Nous organisons des distributions de repas et de produits de premi\u00e8re n\u00e9cessit\u00e9 pour les familles en difficult\u00e9.<\/p>\n <\/div>\n <\/div>\n <div class=\"card-hover bg-white rounded-xl shadow-lg overflow-hidden\">\n <div class=\"h-48 bg-gradient-to-br from-blue-400 to-indigo-500 flex items-center justify-center\">\n <svg class=\"w-20 h-20 text-white\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M5 13.18v4L12 21l7-3.82v-4L12 17l-7-3.82zM12 3L1 9l11 6 9-4.91V17h2V9L12 3z\"\/>\n <\/svg>\n <\/div>\n <div class=\"p-6\">\n <h3 class=\"text-xl font-semibold text-gray-800 mb-3\">Soutien scolaire<\/h3>\n <p class=\"text-gray-600\">Accompagnement \u00e9ducatif et aide aux devoirs pour favoriser la r\u00e9ussite scolaire des enfants.<\/p>\n <\/div>\n <\/div>\n <div class=\"card-hover bg-white rounded-xl shadow-lg overflow-hidden\">\n <div class=\"h-48 bg-gradient-to-br from-green-400 to-teal-500 flex items-center justify-center\">\n <svg class=\"w-20 h-20 text-white\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"\/>\n <\/svg>\n <\/div>\n <div class=\"p-6\">\n <h3 class=\"text-xl font-semibold text-gray-800 mb-3\">Insertion sociale<\/h3>\n <p class=\"text-gray-600\">Programmes d’accompagnement pour favoriser l’insertion professionnelle et sociale.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Call to action -->\n <section class=\"bg-blue-600 text-white py-16\">\n <div class=\"max-w-4xl mx-auto text-center px-4 sm:px-6 lg:px-8\">\n <h2 class=\"text-3xl md:text-4xl font-bold mb-6\">Rejoignez notre mission<\/h2>\n <p class=\"text-xl mb-8\">Ensemble, nous pouvons faire la diff\u00e9rence. Votre engagement compte.<\/p>\n <div class=\"flex flex-col sm:flex-row gap-4 justify-center\">\n <button onclick=\"showPage('contact')\" class=\"bg-white text-blue-600 px-8 py-3 rounded-full font-semibold hover:bg-gray-100 transition-colors\">Devenir b\u00e9n\u00e9vole<\/button>\n <button onclick=\"showPage('contact')\" class=\"border-2 border-white text-white px-8 py-3 rounded-full font-semibold hover:bg-white hover:text-blue-600 transition-colors\">Faire un don<\/button>\n <\/div>\n <\/div>\n <\/section>\n <\/div>\n\n <!-- Page \u00c0 propos -->\n <div id=\"page-apropos\" class=\"page-content hidden\">\n <section class=\"pt-20 pb-16 bg-gradient-to-r from-blue-50 to-indigo-100\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n <div class=\"text-center mb-12\">\n <h1 class=\"text-4xl md:text-5xl font-bold text-gray-800 mb-6\">\u00c0 propos de nous<\/h1>\n <p class=\"text-xl text-gray-600 max-w-3xl mx-auto\">D\u00e9couvrez notre histoire, notre mission et les valeurs qui nous animent depuis notre cr\u00e9ation.<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Notre histoire -->\n <section class=\"py-16\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n <div class=\"grid lg:grid-cols-2 gap-12 items-center\">\n <div>\n <h2 class=\"text-3xl font-bold text-gray-800 mb-6\">Notre histoire<\/h2>\n <p class=\"text-lg text-gray-600 mb-6\">Fond\u00e9e en 2015 par un groupe de citoyens engag\u00e9s, Ensemble Solidaire est n\u00e9e de la volont\u00e9 de cr\u00e9er des liens durables entre les communaut\u00e9s et d’apporter une aide concr\u00e8te aux personnes en situation de pr\u00e9carit\u00e9.<\/p>\n <p class=\"text-lg text-gray-600 mb-6\">Depuis nos d\u00e9buts, nous avons accompagn\u00e9 plus de 2 000 familles et mobilis\u00e9 une communaut\u00e9 de 150 b\u00e9n\u00e9voles actifs. Notre approche se base sur l’\u00e9coute, le respect et l’accompagnement personnalis\u00e9.<\/p>\n <p class=\"text-lg text-gray-600\">Aujourd’hui, nous sommes fiers d’\u00eatre reconnus comme un acteur majeur de la solidarit\u00e9 locale, tout en gardant notre dimension humaine et notre proximit\u00e9 avec le terrain.<\/p>\n <\/div>\n <div class=\"bg-gradient-to-br from-purple-400 to-pink-500 rounded-2xl p-12 text-white text-center\">\n <div class=\"grid grid-cols-2 gap-8\">\n <div>\n <div class=\"text-4xl font-bold mb-2\">2000+<\/div>\n <div class=\"text-sm opacity-90\">Familles aid\u00e9es<\/div>\n <\/div>\n <div>\n <div class=\"text-4xl font-bold mb-2\">150<\/div>\n <div class=\"text-sm opacity-90\">B\u00e9n\u00e9voles actifs<\/div>\n <\/div>\n <div>\n <div class=\"text-4xl font-bold mb-2\">8<\/div>\n <div class=\"text-sm opacity-90\">Ann\u00e9es d’exp\u00e9rience<\/div>\n <\/div>\n <div>\n <div class=\"text-4xl font-bold mb-2\">25<\/div>\n <div class=\"text-sm opacity-90\">Actions par mois<\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Notre \u00e9quipe -->\n <section class=\"py-16 bg-gray-50\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n <div class=\"text-center mb-16\">\n <h2 class=\"text-3xl md:text-4xl font-bold text-gray-800 mb-4\">Notre \u00e9quipe<\/h2>\n <p class=\"text-lg text-gray-600 max-w-2xl mx-auto\">Des personnes passionn\u00e9es qui donnent de leur temps pour faire la diff\u00e9rence<\/p>\n <\/div>\n <div class=\"grid md:grid-cols-3 gap-8\">\n <div class=\"bg-white rounded-xl shadow-lg p-8 text-center\">\n <div class=\"w-24 h-24 bg-gradient-to-br from-blue-400 to-blue-600 rounded-full mx-auto mb-6 flex items-center justify-center\">\n <svg class=\"w-12 h-12 text-white\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"\/>\n <\/svg>\n <\/div>\n <h3 class=\"text-xl font-semibold text-gray-800 mb-2\">Marie Dubois<\/h3>\n <p class=\"text-blue-600 font-medium mb-4\">Pr\u00e9sidente<\/p>\n <p class=\"text-gray-600\">Ancienne travailleuse sociale, Marie coordonne nos actions et d\u00e9veloppe nos partenariats locaux.<\/p>\n <\/div>\n <div class=\"bg-white rounded-xl shadow-lg p-8 text-center\">\n <div class=\"w-24 h-24 bg-gradient-to-br from-green-400 to-green-600 rounded-full mx-auto mb-6 flex items-center justify-center\">\n <svg class=\"w-12 h-12 text-white\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"\/>\n <\/svg>\n <\/div>\n <h3 class=\"text-xl font-semibold text-gray-800 mb-2\">Pierre Martin<\/h3>\n <p class=\"text-green-600 font-medium mb-4\">Coordinateur<\/p>\n <p class=\"text-gray-600\">Responsable de l’organisation des \u00e9v\u00e9nements et de la coordination des \u00e9quipes de b\u00e9n\u00e9voles.<\/p>\n <\/div>\n <div class=\"bg-white rounded-xl shadow-lg p-8 text-center\">\n <div class=\"w-24 h-24 bg-gradient-to-br from-purple-400 to-purple-600 rounded-full mx-auto mb-6 flex items-center justify-center\">\n <svg class=\"w-12 h-12 text-white\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"\/>\n <\/svg>\n <\/div>\n <h3 class=\"text-xl font-semibold text-gray-800 mb-2\">Sophie Leroy<\/h3>\n <p class=\"text-purple-600 font-medium mb-4\">Tr\u00e9sori\u00e8re<\/p>\n <p class=\"text-gray-600\">G\u00e8re les finances de l’association et supervise les demandes de subventions.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Nos partenaires -->\n <section class=\"py-16\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n <div class=\"text-center mb-16\">\n <h2 class=\"text-3xl md:text-4xl font-bold text-gray-800 mb-4\">Nos partenaires<\/h2>\n <p class=\"text-lg text-gray-600 max-w-2xl mx-auto\">Ils nous font confiance et nous soutiennent dans nos missions<\/p>\n <\/div>\n <div class=\"grid grid-cols-2 md:grid-cols-4 gap-8\">\n <div class=\"bg-white p-6 rounded-lg shadow-md flex items-center justify-center h-24\">\n <span class=\"text-gray-600 font-semibold\">Mairie Locale<\/span>\n <\/div>\n <div class=\"bg-white p-6 rounded-lg shadow-md flex items-center justify-center h-24\">\n <span class=\"text-gray-600 font-semibold\">CAF<\/span>\n <\/div>\n <div class=\"bg-white p-6 rounded-lg shadow-md flex items-center justify-center h-24\">\n <span class=\"text-gray-600 font-semibold\">Banque Alimentaire<\/span>\n <\/div>\n <div class=\"bg-white p-6 rounded-lg shadow-md flex items-center justify-center h-24\">\n <span class=\"text-gray-600 font-semibold\">Fondation Solidarit\u00e9<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/div>\n\n <!-- Page Contact -->\n <div id=\"page-contact\" class=\"page-content hidden\">\n <section class=\"pt-20 pb-16 bg-gradient-to-r from-green-50 to-blue-100\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n <div class=\"text-center mb-12\">\n <h1 class=\"text-4xl md:text-5xl font-bold text-gray-800 mb-6\">Contactez-nous<\/h1>\n <p class=\"text-xl text-gray-600 max-w-3xl mx-auto\">Vous souhaitez nous rejoindre, faire un don ou simplement en savoir plus ? N’h\u00e9sitez pas \u00e0 nous contacter !<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- Formulaire de contact -->\n <section class=\"py-16\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n <div class=\"grid lg:grid-cols-2 gap-16\">\n <div>\n <h2 class=\"text-3xl font-bold text-gray-800 mb-8\">Envoyez-nous un message<\/h2>\n <form id=\"contact-form\" class=\"space-y-6\">\n <div class=\"grid md:grid-cols-2 gap-6\">\n <div>\n <label for=\"prenom\" class=\"block text-sm font-medium text-gray-700 mb-2\">Pr\u00e9nom *<\/label>\n <input type=\"text\" id=\"prenom\" name=\"prenom\" required class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent\">\n <\/div>\n <div>\n <label for=\"nom\" class=\"block text-sm font-medium text-gray-700 mb-2\">Nom *<\/label>\n <input type=\"text\" id=\"nom\" name=\"nom\" required class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent\">\n <\/div>\n <\/div>\n <div>\n <label for=\"email\" class=\"block text-sm font-medium text-gray-700 mb-2\">Email *<\/label>\n <input type=\"email\" id=\"email\" name=\"email\" required class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent\">\n <\/div>\n <div>\n <label for=\"telephone\" class=\"block text-sm font-medium text-gray-700 mb-2\">T\u00e9l\u00e9phone<\/label>\n <input type=\"tel\" id=\"telephone\" name=\"telephone\" class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent\">\n <\/div>\n <div>\n <label for=\"sujet\" class=\"block text-sm font-medium text-gray-700 mb-2\">Sujet *<\/label>\n <select id=\"sujet\" name=\"sujet\" required class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent\">\n <option value=\"\">Choisissez un sujet<\/option>\n <option value=\"benevolat\">Devenir b\u00e9n\u00e9vole<\/option>\n <option value=\"don\">Faire un don<\/option>\n <option value=\"partenariat\">Partenariat<\/option>\n <option value=\"information\">Demande d’information<\/option>\n <option value=\"autre\">Autre<\/option>\n <\/select>\n <\/div>\n <div>\n <label for=\"message\" class=\"block text-sm font-medium text-gray-700 mb-2\">Message *<\/label>\n <textarea id=\"message\" name=\"message\" rows=\"6\" required class=\"w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent\" placeholder=\"D\u00e9crivez votre demande...\"><\/textarea>\n <\/div>\n <button type=\"submit\" class=\"w-full bg-blue-600 text-white py-3 px-6 rounded-lg font-semibold hover:bg-blue-700 transition-colors\">\n Envoyer le message\n <\/button>\n <\/form>\n <div id=\"form-success\" class=\"hidden mt-6 p-4 bg-green-100 border border-green-400 text-green-700 rounded-lg\">\n <div class=\"flex items-center\">\n <svg class=\"w-5 h-5 mr-2\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path fill-rule=\"evenodd\" d=\"M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z\" clip-rule=\"evenodd\"><\/path>\n <\/svg>\n Merci ! Votre message a \u00e9t\u00e9 envoy\u00e9 avec succ\u00e8s. Nous vous r\u00e9pondrons dans les plus brefs d\u00e9lais.\n <\/div>\n <\/div>\n <\/div>\n\n <!-- Informations de contact -->\n <div>\n <h2 class=\"text-3xl font-bold text-gray-800 mb-8\">Nos coordonn\u00e9es<\/h2>\n <div class=\"space-y-8\">\n <div class=\"flex items-start\">\n <div class=\"w-12 h-12 bg-blue-100 rounded-lg flex items-center justify-center mr-4 flex-shrink-0\">\n <svg class=\"w-6 h-6 text-blue-600\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z\"><\/path>\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 11a3 3 0 11-6 0 3 3 0 016 0z\"><\/path>\n <\/svg>\n <\/div>\n <div>\n <h3 class=\"text-lg font-semibold text-gray-800 mb-2\">Adresse<\/h3>\n <p class=\"text-gray-600\">15 rue webgraphisteabs<br>75001 Paris, France<\/p>\n <\/div>\n <\/div>\n <div class=\"flex items-start\">\n <div class=\"w-12 h-12 bg-green-100 rounded-lg flex items-center justify-center mr-4 flex-shrink-0\">\n <svg class=\"w-6 h-6 text-green-600\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z\"><\/path>\n <\/svg>\n <\/div>\n <div>\n <h3 class=\"text-lg font-semibold text-gray-800 mb-2\">T\u00e9l\u00e9phone<\/h3>\n <p class=\"text-gray-600\">01 00 00 00 00<\/p>\n <\/div>\n <\/div>\n <div class=\"flex items-start\">\n <div class=\"w-12 h-12 bg-purple-100 rounded-lg flex items-center justify-center mr-4 flex-shrink-0\">\n <svg class=\"w-6 h-6 text-purple-600\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"><\/path>\n <\/svg>\n <\/div>\n <div>\n <h3 class=\"text-lg font-semibold text-gray-800 mb-2\">Email<\/h3>\n <p class=\"text-gray-600\">contact@ensemble-solidaire.fr<\/p>\n <\/div>\n <\/div>\n <div class=\"flex items-start\">\n <div class=\"w-12 h-12 bg-orange-100 rounded-lg flex items-center justify-center mr-4 flex-shrink-0\">\n <svg class=\"w-6 h-6 text-orange-600\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z\"><\/path>\n <\/svg>\n <\/div>\n <div>\n <h3 class=\"text-lg font-semibold text-gray-800 mb-2\">Horaires<\/h3>\n <p class=\"text-gray-600\">Lundi – Vendredi : 9h – 18h<br>Samedi : 9h – 12h<\/p>\n <\/div>\n <\/div>\n <\/div>\n\n <!-- R\u00e9seaux sociaux -->\n <div class=\"mt-12\">\n <h3 class=\"text-lg font-semibold text-gray-800 mb-4\">Suivez-nous<\/h3>\n <div class=\"flex space-x-4\">\n <a href=\"#\" class=\"w-10 h-10 bg-blue-600 text-white rounded-full flex items-center justify-center hover:bg-blue-700 transition-colors\">\n <svg class=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z\"\/>\n <\/svg>\n <\/a>\n <a href=\"#\" class=\"w-10 h-10 bg-blue-800 text-white rounded-full flex items-center justify-center hover:bg-blue-900 transition-colors\">\n <svg class=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M22.46 6c-.77.35-1.6.58-2.46.69.88-.53 1.56-1.37 1.88-2.38-.83.5-1.75.85-2.72 1.05C18.37 4.5 17.26 4 16 4c-2.35 0-4.27 1.92-4.27 4.29 0 .34.04.67.11.98C8.28 9.09 5.11 7.38 3 4.79c-.37.63-.58 1.37-.58 2.15 0 1.49.75 2.81 1.91 3.56-.71 0-1.37-.2-1.95-.5v.03c0 2.08 1.48 3.82 3.44 4.21a4.22 4.22 0 0 1-1.93.07 4.28 4.28 0 0 0 4 2.98 8.521 8.521 0 0 1-5.33 1.84c-.34 0-.68-.02-1.02-.06C3.44 20.29 5.7 21 8.12 21 16 21 20.33 14.46 20.33 8.79c0-.19 0-.37-.01-.56.84-.6 1.56-1.36 2.14-2.23z\"\/>\n <\/svg>\n <\/a>\n <a href=\"#\" class=\"w-10 h-10 bg-pink-600 text-white rounded-full flex items-center justify-center hover:bg-pink-700 transition-colors\">\n <svg class=\"w-5 h-5\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12.017 0C5.396 0 .029 5.367.029 11.987c0 5.079 3.158 9.417 7.618 11.174-.105-.949-.199-2.403.041-3.439.219-.937 1.406-5.957 1.406-5.957s-.359-.72-.359-1.781c0-1.663.967-2.911 2.168-2.911 1.024 0 1.518.769 1.518 1.688 0 1.029-.653 2.567-.992 3.992-.285 1.193.6 2.165 1.775 2.165 2.128 0 3.768-2.245 3.768-5.487 0-2.861-2.063-4.869-5.008-4.869-3.41 0-5.409 2.562-5.409 5.199 0 1.033.394 2.143.889 2.741.099.12.112.225.085.345-.09.375-.293 1.199-.334 1.363-.053.225-.172.271-.402.165-1.495-.69-2.433-2.878-2.433-4.646 0-3.776 2.748-7.252 7.92-7.252 4.158 0 7.392 2.967 7.392 6.923 0 4.135-2.607 7.462-6.233 7.462-1.214 0-2.357-.629-2.75-1.378l-.748 2.853c-.271 1.043-1.002 2.35-1.492 3.146C9.57 23.812 10.763 24.009 12.017 24.009c6.624 0 11.99-5.367 11.99-11.988C24.007 5.367 18.641.001 12.017.001z\"\/>\n <\/svg>\n <\/a>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/div>\n\n <!-- Footer -->\n <footer class=\"bg-gray-800 text-white py-12\">\n <div class=\"max-w-7xl mx-auto px-4 sm:px-6 lg:px-8\">\n <div class=\"grid md:grid-cols-4 gap-8\">\n <div class=\"md:col-span-2\">\n <div class=\"flex items-center mb-4\">\n <svg class=\"w-8 h-8 text-blue-400 mr-3\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"\/>\n <\/svg>\n <span class=\"text-xl font-bold\">Ensemble Solidaire<\/span>\n <\/div>\n <p class=\"text-gray-300 mb-4\">Association humanitaire d\u00e9di\u00e9e \u00e0 la solidarit\u00e9 et \u00e0 l’aide aux plus d\u00e9munis. Ensemble, construisons un monde plus juste et plus humain.<\/p>\n <p class=\"text-sm text-gray-400\">\u00a9 2023 Ensemble Solidaire. Tous droits r\u00e9serv\u00e9s.<\/p>\n <\/div>\n <div>\n <h3 class=\"text-lg font-semibold mb-4\">Liens rapides<\/h3>\n <ul class=\"space-y-2\">\n <li><a href=\"#\" onclick=\"showPage('accueil')\" class=\"text-gray-300 hover:text-white transition-colors\">Accueil<\/a><\/li>\n <li><a href=\"#\" onclick=\"showPage('apropos')\" class=\"text-gray-300 hover:text-white transition-colors\">\u00c0 propos<\/a><\/li>\n <li><a href=\"#\" onclick=\"showPage('contact')\" class=\"text-gray-300 hover:text-white transition-colors\">Contact<\/a><\/li>\n <\/ul>\n <\/div>\n <div>\n <h3 class=\"text-lg font-semibold mb-4\">Contact<\/h3>\n <ul class=\"space-y-2 text-gray-300\">\n <li>15 rue webgraphisteabs<\/li>\n <li>75001 Paris, France<\/li>\n <li>01 00 00 00 00<\/li>\n <li>contact@ensemble-solidaire.fr<\/li>\n <\/ul>\n <\/div>\n <\/div>\n <\/div>\n <\/footer>\n\n <script>\n \/\/ Navigation entre les pages\n function showPage(pageId) {\n \/\/ Masquer toutes les pages\n const pages = document.querySelectorAll('.page-content');\n pages.forEach(page => page.classList.add('hidden'));\n \n \/\/ Afficher la page demand\u00e9e\n document.getElementById('page-' + pageId).classList.remove('hidden');\n \n \/\/ Mettre \u00e0 jour la navigation\n const navLinks = document.querySelectorAll('.nav-link');\n navLinks.forEach(link => {\n link.classList.remove('text-blue-600');\n link.classList.add('text-gray-700');\n });\n \n \/\/ Marquer le lien actif\n event.target.classList.remove('text-gray-700');\n event.target.classList.add('text-blue-600');\n \n \/\/ Fermer le menu mobile si ouvert\n document.getElementById('mobile-menu').classList.add('hidden');\n \n \/\/ Scroll vers le haut\n window.scrollTo(0, 0);\n }\n\n \/\/ Menu mobile\n function toggleMobileMenu() {\n const mobileMenu = document.getElementById('mobile-menu');\n mobileMenu.classList.toggle('hidden');\n }\n\n \/\/ Gestion du formulaire de contact\n document.getElementById('contact-form').addEventListener('submit', function(e) {\n e.preventDefault();\n \n \/\/ Simulation d'envoi\n const formData = new FormData(this);\n const data = Object.fromEntries(formData);\n \n \/\/ Validation simple\n if (!data.prenom || !data.nom || !data.email || !data.sujet || !data.message) {\n alert('Veuillez remplir tous les champs obligatoires.');\n return;\n }\n \n \/\/ Simulation d'envoi r\u00e9ussi\n setTimeout(() => {\n document.getElementById('form-success').classList.remove('hidden');\n this.reset();\n \n \/\/ Masquer le message apr\u00e8s 5 secondes\n setTimeout(() => {\n document.getElementById('form-success').classList.add('hidden');\n }, 5000);\n }, 1000);\n });\n\n \/\/ Animation au scroll\n function animateOnScroll() {\n const elements = document.querySelectorAll('.fade-in');\n elements.forEach(element => {\n const elementTop = element.getBoundingClientRect().top;\n const elementVisible = 150;\n \n if (elementTop < window.innerHeight - elementVisible) {\n element.classList.add('visible');\n }\n });\n }\n\n \/\/ Initialisation\n window.addEventListener('scroll', animateOnScroll);\n window.addEventListener('load', animateOnScroll);\n \n \/\/ Afficher la page d'accueil par d\u00e9faut\n document.addEventListener('DOMContentLoaded', function() {\n animateOnScroll();\n });\n <\/script>\n<script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML=\"window.__CF$cv$params={r:'98a68a46d08fdcfc',t:'MTc1OTc2ODE5My4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='\/cdn-cgi\/challenge-platform\/scripts\/jsd\/main.js';document.getElementsByTagName('head')[0].appendChild(a);\";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();<\/script><\/body>\n<\/html> <\/div>\r\n \n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"blank","meta":{"footnotes":""},"class_list":["post-52","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/solidaire.webgraphisteabs.com\/index.php\/wp-json\/wp\/v2\/pages\/52","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/solidaire.webgraphisteabs.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/solidaire.webgraphisteabs.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/solidaire.webgraphisteabs.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/solidaire.webgraphisteabs.com\/index.php\/wp-json\/wp\/v2\/comments?post=52"}],"version-history":[{"count":19,"href":"https:\/\/solidaire.webgraphisteabs.com\/index.php\/wp-json\/wp\/v2\/pages\/52\/revisions"}],"predecessor-version":[{"id":83,"href":"https:\/\/solidaire.webgraphisteabs.com\/index.php\/wp-json\/wp\/v2\/pages\/52\/revisions\/83"}],"wp:attachment":[{"href":"https:\/\/solidaire.webgraphisteabs.com\/index.php\/wp-json\/wp\/v2\/media?parent=52"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}