{"id":556,"date":"2025-10-27T17:02:26","date_gmt":"2025-10-27T16:02:26","guid":{"rendered":"https:\/\/refonte.sowebconcept.com\/?page_id=556"},"modified":"2025-11-07T20:00:20","modified_gmt":"2025-11-07T19:00:20","slug":"accueil","status":"publish","type":"page","link":"https:\/\/refonte.sowebconcept.com\/","title":{"rendered":"Accueil"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"556\" class=\"elementor elementor-556\">\n\t\t\t\t<div class=\"elementor-element elementor-element-99a7b66 e-flex e-con-boxed e-con e-parent\" data-id=\"99a7b66\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-3cdde68 e-con-full e-flex e-con e-child\" data-id=\"3cdde68\" data-element_type=\"container\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bb7a6a3 e-con-full e-flex e-con e-child\" data-id=\"bb7a6a3\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e251940 elementor-widget elementor-widget-image\" data-id=\"e251940\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"800\" height=\"534\" src=\"https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/envato-labs-image-edit-1024x683.webp\" class=\"attachment-large size-large wp-image-599\" alt=\"\" srcset=\"https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/envato-labs-image-edit-1024x683.webp 1024w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/envato-labs-image-edit-300x200.webp 300w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/envato-labs-image-edit-768x512.webp 768w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/envato-labs-image-edit.webp 1248w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5b896a6 e-flex e-con-boxed e-con e-parent\" data-id=\"5b896a6\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-7c2e3d7 e-con-full e-flex e-con e-child\" data-id=\"7c2e3d7\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-59365a2 elementor-widget elementor-widget-image\" data-id=\"59365a2\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"700\" height=\"700\" src=\"https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/11zon_cropped.png\" class=\"attachment-large size-large wp-image-626\" alt=\"Mains tapant sur un ordinateur portable argent\u00e9, avec une montre noire, une bague, une plante verte, deux crayons noirs et un carnet sur fond blanc.\" srcset=\"https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/11zon_cropped.png 700w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/11zon_cropped-300x300.png 300w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/11zon_cropped-150x150.png 150w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ea0e32a elementor-absolute elementor-widget elementor-widget-image\" data-id=\"ea0e32a\" data-element_type=\"widget\" data-settings=\"{&quot;_position&quot;:&quot;absolute&quot;}\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"512\" height=\"512\" src=\"https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/icone_SO_Web_Concept_512x512.png\" class=\"attachment-large size-large wp-image-470\" alt=\"\" srcset=\"https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/icone_SO_Web_Concept_512x512.png 512w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/icone_SO_Web_Concept_512x512-300x300.png 300w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/icone_SO_Web_Concept_512x512-150x150.png 150w\" sizes=\"(max-width: 512px) 100vw, 512px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6f79989 e-con-full e-flex e-con e-child\" data-id=\"6f79989\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4812702 elementor-widget elementor-widget-heading\" data-id=\"4812702\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Je t'accompagne dans la r\u00e9ussite de ton projet<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5d11172 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"5d11172\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ac7c94b elementor-widget elementor-widget-text-editor\" data-id=\"ac7c94b\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p data-start=\"177\" data-end=\"371\">Je m\u2019appelle <strong data-start=\"190\" data-end=\"199\">Sa\u00efda<\/strong>, fondatrice de <strong data-start=\"215\" data-end=\"233\">SO Web Concept<\/strong>, une micro-entreprise sp\u00e9cialis\u00e9e dans la cr\u00e9ation de sites web sur mesure pour les ind\u00e9pendants, entrepreneurs et petites entreprises.<\/p><p data-start=\"373\" data-end=\"723\">Passionn\u00e9e par le digital et le design, j\u2019ai \u00e0 c\u0153ur d\u2019aider chaque client \u00e0 <strong data-start=\"449\" data-end=\"476\">donner vie \u00e0 son projet<\/strong> \u00e0 travers un site \u00e0 la fois <strong data-start=\"505\" data-end=\"547\">esth\u00e9tique, clair et accessible \u00e0 tous<\/strong>.<br data-start=\"548\" data-end=\"551\" \/>Mon approche repose sur <strong data-start=\"575\" data-end=\"621\">l\u2019\u00e9coute, la simplicit\u00e9 et la transparence<\/strong> : je prends le temps de comprendre vos besoins pour cr\u00e9er une solution qui vous ressemble vraiment.<\/p><p data-start=\"725\" data-end=\"858\">Mon objectif ?<br data-start=\"739\" data-end=\"742\" \/>\ud83d\udc49 Vous accompagner pas \u00e0 pas vers une pr\u00e9sence en ligne <strong data-start=\"799\" data-end=\"857\">coh\u00e9rente, professionnelle et align\u00e9e avec vos valeurs<\/strong>.<\/p><p data-start=\"725\" data-end=\"858\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone  wp-image-629\" src=\"https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/signature-300x300.png\" alt=\"\" width=\"113\" height=\"113\" srcset=\"https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/signature-300x300.png 300w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/signature-1024x1024.png 1024w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/signature-150x150.png 150w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/signature-768x768.png 768w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/signature-1536x1536.png 1536w, https:\/\/refonte.sowebconcept.com\/wp-content\/uploads\/2025\/10\/signature-2048x2048.png 2048w\" sizes=\"(max-width: 113px) 100vw, 113px\" \/><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-29e54be e-flex e-con-boxed e-con e-parent\" data-id=\"29e54be\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-fb66fa8 elementor-widget elementor-widget-html\" data-id=\"fb66fa8\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n  :root{\r\n    --brand:#ff4d6d;         \/* rose primaire *\/\r\n    --brand-soft:#fff5f7;    \/* fond doux rose *\/\r\n    --blue:#1a2e85;          \/* bleu titres *\/\r\n    --ink:#0f172a;           \/* texte principal *\/\r\n    --muted:#64748b;         \/* texte secondaire *\/\r\n    --line:#e5e7eb;          \/* bordures *\/\r\n    --radius:18px;\r\n    --shadow:0 10px 30px rgba(15,23,42,.08);\r\n  }\r\n  .svc{max-width:1200px;margin:0 auto;padding:80px 20px 0px}\r\n  .svc h2{margin:0 0 6px;font-size:clamp(28px,3.6vw,36px);color:var(--blue);text-align:center}\r\n.svc .eyebrow {\r\n  display: inline-block;\r\n  margin: 0 auto 8px;\r\n  padding: .10rem .90rem;\r\n  background: var(--brand-soft);\r\n  color: var(--brand);\r\n  border-radius: 999px;\r\n  font-weight: 600;\r\n  font-size: .85rem;\r\n  text-align: center;\r\n  \/* Ajout pour centrage *\/\r\n  display: block;\r\n  width: fit-content;\r\n}\r\n\r\n  .svc .sep{width:40%;height:3px;background:var(--brand);margin:12px auto 18px;border-radius:2px}\r\n  .svc .lead{max-width:760px;margin:0 auto 26px;color:var(--muted);text-align:center;line-height:1.7}\r\n  .svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}\r\n  @media (max-width: 980px){.svc-grid{grid-template-columns:repeat(2,1fr)}}\r\n  @media (max-width: 560px){.svc-grid{grid-template-columns:1fr}}\r\n  .svc-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px;transition:transform .22s ease, box-shadow .22s ease, background-color .22s ease}\r\n  .svc-card:hover{transform:translateY(-6px);box-shadow:0 14px 36px rgba(15,23,42,.10);background-color:var(--brand-soft)}\r\n  .svc-icon{width:56px;height:56px;border-radius:14px;background:var(--brand-soft);display:grid;place-items:center;margin-bottom:10px}\r\n  .svc-icon svg{width:26px;height:26px;fill:var(--blue)}\r\n  .svc-title{margin:6px 0 8px;font-size:18px;color:var(--blue);font-weight:700}\r\n  .svc-text{color:var(--muted);margin:0 0 14px;line-height:1.7}\r\n  .svc-link{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--blue);text-decoration:none}\r\n  .svc-link:hover{color:var(--brand)}\r\n  .svc-link .arrow{transition:transform .2s ease}\r\n  .svc-link:hover .arrow{transform:translateX(3px)}\r\n    \r\n.divider-soft {\r\n  width:100vw; height:120px;\r\n  margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw);\r\n  background: linear-gradient(180deg,#ffffff 0%, #fff5f7 100%);\r\n}\r\n<\/style>\r\n\r\n<section class=\"svc\" aria-labelledby=\"services-title\">\r\n  <div class=\"eyebrow\">\u2022 Mes Services Web \u2022<\/div>\r\n  <h2 id=\"services-title\">Des solutions adapt\u00e9es \u00e0 ton activit\u00e9<\/h2>\r\n  <div class=\"sep\"><\/div>\r\n  <p class=\"lead\">\r\n    Tu veux une pr\u00e9sence en ligne professionnelle, claire et adapt\u00e9e \u00e0 ton activit\u00e9 ? \r\n    Je t\u2019accompagne avec des solutions sur mesure : conception, refonte, e-commerce, r\u00e9f\u00e9rencement et maintenance.\r\n  <\/p>\r\n\r\n  <div class=\"svc-grid\">\r\n    <!-- Site Vitrine -->\r\n    <article class=\"svc-card\">\r\n      <div class=\"svc-icon\" aria-hidden=\"true\">\r\n        <!-- Desktop icon -->\r\n        <svg viewBox=\"0 0 24 24\"><path d=\"M4 5h16a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1h-6v2h3a1 1 0 1 1 0 2H7a1 1 0 1 1 0-2h3v-2H4a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1zm1 2v7h14V7H5z\"\/><\/svg>\r\n      <\/div>\r\n      <h3 class=\"svc-title\">Site Vitrine<\/h3>\r\n      <p class=\"svc-text\">Un site clair et professionnel pour pr\u00e9senter ton activit\u00e9 et capter de nouveaux clients. Design sur mesure, rapide, responsive et administrable.<\/p>\r\n      <a class=\"svc-link\" href=\"#contact\" aria-label=\"En savoir plus sur le site vitrine\">\r\n        En savoir plus <svg class=\"arrow\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\"><path fill=\"currentColor\" d=\"M13.172 12 9.88 8.707l1.414-1.414L16 12l-4.707 4.707-1.414-1.414z\"\/><\/svg>\r\n      <\/a>\r\n    <\/article>\r\n\r\n    <!-- E-Commerce -->\r\n    <article class=\"svc-card\">\r\n      <div class=\"svc-icon\" aria-hidden=\"true\">\r\n        <!-- Bag icon -->\r\n        <svg viewBox=\"0 0 24 24\"><path d=\"M7 7V6a5 5 0 0 1 10 0v1h2a1 1 0 0 1 .99 1.141l-1.6 11.2A2 2 0 0 1 16.41 22H7.59a2 2 0 0 1-1.98-1.659L4.01 8.141A1 1 0 0 1 5 7h2zm2 0h6V6a3 3 0 0 0-6 0v1z\"\/><\/svg>\r\n      <\/div>\r\n      <h3 class=\"svc-title\">Site E-Commerce<\/h3>\r\n      <p class=\"svc-text\">Vends tes produits avec une boutique WooCommerce performante et s\u00e9curis\u00e9e. Gestion simple, paiements fiables et exp\u00e9rience fluide.<\/p>\r\n      <a class=\"svc-link\" href=\"#contact\">En savoir plus <svg class=\"arrow\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\"><path fill=\"currentColor\" d=\"M13.172 12 9.88 8.707l1.414-1.414L16 12l-4.707 4.707-1.414-1.414z\"\/><\/svg><\/a>\r\n    <\/article>\r\n\r\n    <!-- Refonte -->\r\n    <article class=\"svc-card\">\r\n      <div class=\"svc-icon\" aria-hidden=\"true\">\r\n        <!-- Refresh icon -->\r\n        <svg viewBox=\"0 0 24 24\"><path d=\"M12 6V3l5 4-5 4V8a4 4 0 1 0 4 4h2a6 6 0 1 1-6-6z\"\/><\/svg>\r\n      <\/div>\r\n      <h3 class=\"svc-title\">Refonte<\/h3>\r\n      <p class=\"svc-text\">Modernise ton site : nouveau design, meilleures performances et r\u00e9f\u00e9rencement renforc\u00e9. Id\u00e9al pour remettre ton image au go\u00fbt du jour.<\/p>\r\n      <a class=\"svc-link\" href=\"#contact\">En savoir plus <svg class=\"arrow\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\"><path fill=\"currentColor\" d=\"M13.172 12 9.88 8.707l1.414-1.414L16 12l-4.707 4.707-1.414-1.414z\"\/><\/svg><\/a>\r\n    <\/article>\r\n\r\n    <!-- SEO & Performance -->\r\n    <article class=\"svc-card\">\r\n      <div class=\"svc-icon\" aria-hidden=\"true\">\r\n        <!-- Chart icon -->\r\n        <svg viewBox=\"0 0 24 24\"><path d=\"M4 19a1 1 0 1 1 0-2h14.586l-2.293-2.293 1.414-1.414L22 17.586 17.707 22l-1.414-1.414L18.586 19H4zM4 5h2v8H4V5zm6 3h2v5h-2V8zm6-2h2v7h-2V6z\"\/><\/svg>\r\n      <\/div>\r\n      <h3 class=\"svc-title\">SEO & Performance<\/h3>\r\n      <p class=\"svc-text\">Am\u00e9liore ta visibilit\u00e9 sur Google gr\u00e2ce \u00e0 une structure claire, des pages optimis\u00e9es et des contenus pertinents.<\/p>\r\n      <a class=\"svc-link\" href=\"#contact\">En savoir plus <svg class=\"arrow\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\"><path fill=\"currentColor\" d=\"M13.172 12 9.88 8.707l1.414-1.414L16 12l-4.707 4.707-1.414-1.414z\"\/><\/svg><\/a>\r\n    <\/article>\r\n\r\n    <!-- Maintenance -->\r\n    <article class=\"svc-card\">\r\n      <div class=\"svc-icon\" aria-hidden=\"true\">\r\n        <!-- Tools icon -->\r\n        <svg viewBox=\"0 0 24 24\"><path d=\"M7 2l2 2-2.5 2.5 3 3L12 7l2 2-5.5 5.5a2 2 0 0 1-2.828 0l-2.172-2.17a2 2 0 0 1 0-2.83L7 2zm9.586 8.414 1 1L13 16l-1-1 4.586-4.586zM15 18h5v2h-5z\"\/><\/svg>\r\n      <\/div>\r\n      <h3 class=\"svc-title\">Maintenance & Assistance<\/h3>\r\n      <p class=\"svc-text\">Mises \u00e0 jour, sauvegardes, s\u00e9curit\u00e9 et support r\u00e9actif. Ton site reste entre de bonnes mains.<\/p>\r\n      <a class=\"svc-link\" href=\"#contact\">En savoir plus <svg class=\"arrow\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\"><path fill=\"currentColor\" d=\"M13.172 12 9.88 8.707l1.414-1.414L16 12l-4.707 4.707-1.414-1.414z\"\/><\/svg><\/a>\r\n    <\/article>\r\n\r\n    <!-- Optionnel : Accompagnement \/ Audit -->\r\n    <article class=\"svc-card\">\r\n      <div class=\"svc-icon\" aria-hidden=\"true\">\r\n        <!-- Search icon -->\r\n        <svg viewBox=\"0 0 24 24\"><path d=\"M10 2a8 8 0 1 1 0 16 8 8 0 0 1 0-16zm11 18-4.35-4.35A9.96 9.96 0 0 1 10 20a10 10 0 1 1 10-10c0 2.53-.94 4.85-2.5 6.65L22 20z\"\/><\/svg>\r\n      <\/div>\r\n      <h3 class=\"svc-title\">Audit & Conseils<\/h3>\r\n      <p class=\"svc-text\">Analyse de ton site, recommandations concr\u00e8tes et plan d\u2019action prioris\u00e9 pour progresser vite.<\/p>\r\n      <a class=\"svc-link\" href=\"#contact\">En savoir plus <svg class=\"arrow\" viewBox=\"0 0 24 24\" width=\"16\" height=\"16\"><path fill=\"currentColor\" d=\"M13.172 12 9.88 8.707l1.414-1.414L16 12l-4.707 4.707-1.414-1.414z\"\/><\/svg><\/a>\r\n    <\/article>\r\n  <\/div>\r\n<div class=\"divider-soft\" aria-hidden=\"true\"><\/div>\r\n\r\n<\/section>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-db79d3e e-con-full e-flex e-con e-parent\" data-id=\"db79d3e\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8f1ebba elementor-widget elementor-widget-html\" data-id=\"8f1ebba\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- SECTION \u00c9TAPES \u2014 FOND CLAIR -->\r\n<style>\r\n  .steps-light {\r\n    --brand:#ff4d6d;          \/* rose primaire *\/\r\n    --brand-soft:#fff5f7;     \/* fond rose doux *\/\r\n    --blue:#1a2e85;           \/* bleu titres *\/\r\n    --ink:#0f172a;            \/* texte principal *\/\r\n    --muted:#64748b;          \/* texte secondaire *\/\r\n    --line:#e5e7eb;\r\n    --radius:18px;\r\n    --shadow:0 10px 30px rgba(15,23,42,.08);\r\n  }\r\n\r\n  .steps-light {\r\n    background: var(--brand-soft);\r\n    color: var(--ink);\r\n    padding: 80px 20px;\r\n  }\r\n  \/*.steps-light .wrap { max-width:1200px; margin:0 auto; position:relative; }*\/\r\n\r\n  .steps-light .eyebrow {\r\n    display:block; width:fit-content; margin:0 auto 10px;\r\n    background: var(--brand-soft);\r\n    color: var(--brand);\r\n    border:1px solid var(--brand);\r\n    border-radius:999px;\r\n    font-weight:600; font-size:12px; padding:4px 10px;\r\n  }\r\n\r\n  .steps-light h2 {\r\n    text-align:center;\r\n    color:var(--blue);\r\n    font-size:clamp(26px,3.4vw,36px);\r\n    font-weight:800;\r\n    margin:0;\r\n  }\r\n\r\n  .steps-light .sep {\r\n    width:40%; height:3px;\r\n    background: var(--brand);\r\n    border-radius:2px;\r\n    margin:14px auto 18px;\r\n  }\r\n\r\n  .steps-light .lead, .steps-light .sublead {\r\n    text-align:center;\r\n    max-width:900px;\r\n    margin:0 auto;\r\n    line-height:1.7;\r\n    color:var(--muted);\r\n  }\r\n  .steps-light .sublead {\r\n    margin-top:14px;\r\n    font-weight:600;\r\n    color:var(--blue);\r\n  }\r\n\r\n  \/* Grille *\/\r\n  .steps-grid {\r\n    display:grid;\r\n    gap:24px;\r\n    margin-top:34px;\r\n    grid-template-columns:repeat(4,1fr);\r\n  }\r\n  @media (max-width: 1024px) { .steps-grid{grid-template-columns:repeat(2,1fr);} }\r\n  @media (max-width: 560px) { .steps-grid{grid-template-columns:1fr;} }\r\n\r\n  .step-card {\r\n    background:#fff;\r\n    border:1px solid var(--line);\r\n    border-radius:var(--radius);\r\n    box-shadow:var(--shadow);\r\n    padding:32px 26px;\r\n    text-align:center;\r\n    transition:transform .25s ease, box-shadow .25s ease;\r\n  }\r\n  .step-card:hover {\r\n    transform:translateY(-6px);\r\n    box-shadow:0 16px 38px rgba(15,23,42,.12);\r\n  }\r\n\r\n  .step-icon {\r\n    width:56px; height:56px;\r\n    border-radius:14px;\r\n    background:var(--brand-soft);\r\n    display:grid; place-items:center;\r\n    margin:0 auto 14px;\r\n  }\r\n  .step-icon svg {\r\n    width:26px; height:26px;\r\n    fill:var(--brand);\r\n  }\r\n\r\n  .step-num {\r\n    font-size:clamp(44px,6vw,64px);\r\n    font-weight:800;\r\n    color:var(--blue);\r\n    line-height:1;\r\n    margin:0 0 6px;\r\n  }\r\n\r\n  .step-title {\r\n    margin:8px 0 10px;\r\n    color:var(--blue);\r\n    font-size:18px;\r\n    font-weight:700;\r\n  }\r\n\r\n  .step-text {\r\n    margin:0;\r\n    color:var(--muted);\r\n    line-height:1.8;\r\n    font-size:15px;\r\n  }\r\n<\/style>\r\n\r\n<section class=\"steps-light\" aria-labelledby=\"steps-title\">\r\n  <div class=\"wrap\">\r\n    <span class=\"eyebrow\">\u2022 Processus \u2022<\/span>\r\n    <h2 id=\"steps-title\">Les \u00e9tapes de la cr\u00e9ation d\u2019un site<\/h2>\r\n    <div class=\"sep\"><\/div>\r\n    <p class=\"lead\">\r\n      De la planification \u00e0 la mise en ligne, je t\u2019accompagne \u00e0 chaque \u00e9tape pour construire un site moderne,\r\n      performant et align\u00e9 avec ton image.\r\n    <\/p>\r\n    <p class=\"sublead\">Ensemble, donnons vie \u00e0 ta pr\u00e9sence en ligne !<\/p>\r\n\r\n    <div class=\"steps-grid\" role=\"list\">\r\n      <!-- \u00c9tape 1 -->\r\n      <article class=\"step-card\" role=\"listitem\">\r\n        <div class=\"step-icon\" aria-hidden=\"true\">\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M7 2h2v2h6V2h2v2h2a1 1 0 0 1 1 1v15a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h2V2h2v2zm13 6H4v10h16V8zM9.5 16.5 6 13l1.4-1.4 2.1 2.1 4.1-4.1 1.4 1.4-5.5 5.5z\"\/><\/svg>\r\n        <\/div>\r\n        <div class=\"step-num\">01<\/div>\r\n        <h3 class=\"step-title\">Planification<\/h3>\r\n        <p class=\"step-text\">On d\u00e9finit tes objectifs, ton public et les fonctionnalit\u00e9s cl\u00e9s avant de poser l\u2019arborescence et le planning.<\/p>\r\n      <\/article>\r\n\r\n      <!-- \u00c9tape 2 -->\r\n      <article class=\"step-card\" role=\"listitem\">\r\n        <div class=\"step-icon\" aria-hidden=\"true\">\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M4 3h16a1 1 0 0 1 1 1v5H3V4a1 1 0 0 1 1-1zm0 8h7v10H4a1 1 0 0 1-1-1V11zm9 0h7v9a1 1 0 0 1-1 1h-6V11zM6 5v3h4V5H6z\"\/><\/svg>\r\n        <\/div>\r\n        <div class=\"step-num\">02<\/div>\r\n        <h3 class=\"step-title\">Conception<\/h3>\r\n        <p class=\"step-text\">Cr\u00e9ation des maquettes et choix graphiques. Chaque \u00e9tape est valid\u00e9e ensemble avant l\u2019int\u00e9gration.<\/p>\r\n      <\/article>\r\n\r\n      <!-- \u00c9tape 3 -->\r\n      <article class=\"step-card\" role=\"listitem\">\r\n        <div class=\"step-icon\" aria-hidden=\"true\">\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 2c4.97 0 9 4.03 9 9 0 2.7-1.19 5.12-3.07 6.77l-.93.8-1.77-1.77-1.41 1.41 1.77 1.77-.8.93C14.12 21.81 11.7 23 9 23c-1.02 0-2.01-.18-2.92-.5l2.7-2.7a3 3 0 0 0 .88-2.12V16h1a3 3 0 0 0 2.12-.88l5.3-5.3A7 7 0 0 0 12 2z\"\/><\/svg>\r\n        <\/div>\r\n        <div class=\"step-num\">03<\/div>\r\n        <h3 class=\"step-title\">Mise en ligne<\/h3>\r\n        <p class=\"step-text\">Int\u00e9gration sur WordPress, tests multi-\u00e9crans et optimisation avant publication du site.<\/p>\r\n      <\/article>\r\n\r\n      <!-- \u00c9tape 4 -->\r\n      <article class=\"step-card\" role=\"listitem\">\r\n        <div class=\"step-icon\" aria-hidden=\"true\">\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 2a8 8 0 0 1 8 8v7a3 3 0 0 1-3 3h-2v-2h2a1 1 0 0 0 1-1v-7a6 6 0 1 0-12 0v7a1 1 0 0 0 1 1h2v2H8a3 3 0 0 1-3-3v-7a8 8 0 0 1 8-8zm-1 9h2v5h-2v-5zm0-4h2v2h-2V7z\"\/><\/svg>\r\n        <\/div>\r\n        <div class=\"step-num\">04<\/div>\r\n        <h3 class=\"step-title\">Suivi<\/h3>\r\n        <p class=\"step-text\">Formation, maintenance, s\u00e9curit\u00e9 et am\u00e9liorations continues pour faire \u00e9voluer ton site.<\/p>\r\n      <\/article>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-832e9ae e-flex e-con-boxed e-con e-parent\" data-id=\"832e9ae\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e13db57 elementor-widget elementor-widget-html\" data-id=\"e13db57\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- SECTION \u2014 MES R\u00c9ALISATIONS (Mockups) -->\r\n<style>\r\n  .works {\r\n    --brand:#ff4d6d; --brand-soft:#fff5f7; --blue:#1a2e85;\r\n    --ink:#0f172a; --muted:#64748b; --line:#e5e7eb;\r\n    --radius:18px; --shadow:0 10px 30px rgba(15,23,42,.08);\r\n    padding: 80px 20px; color: var(--ink); background:#fff;\r\n  }\r\n  .works .wrap{max-width:1200px;margin:0 auto}\r\n  .works .eyebrow{display:block;width:fit-content;margin:0 auto 10px;padding:4px 10px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font-weight:600;font-size:12px}\r\n  .works h2{margin:0;text-align:center;color:var(--blue);font-size:clamp(28px,3.6vw,36px);font-weight:800}\r\n  .works .sep{width:40%;height:3px;background:var(--brand);border-radius:2px;margin:14px auto 26px}\r\n  .works .lead{max-width:760px;margin:0 auto 28px;text-align:center;color:var(--muted);line-height:1.7}\r\n\r\n  .work-grid{display:grid;gap:28px;grid-template-columns:repeat(3,1fr)}\r\n  @media (max-width:1024px){.work-grid{grid-template-columns:repeat(2,1fr)}}\r\n  @media (max-width:560px){.work-grid{grid-template-columns:1fr}}\r\n\r\n  .work-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;transition:transform .22s ease, box-shadow .22s ease}\r\n  .work-card:hover{transform:translateY(-6px);box-shadow:0 16px 38px rgba(15,23,42,.12)}\r\n\r\n  \/* Mockup Laptop *\/\r\n  .mock-laptop{position:relative;background:#0b1220;padding:14px 14px 10px;border-top-left-radius:14px;border-top-right-radius:14px}\r\n  .mock-laptop:before{content:\"\";position:absolute;top:8px;left:50%;transform:translateX(-50%);width:54px;height:6px;border-radius:999px;background:#1f2b46;opacity:.8}\r\n  .mock-laptop .screen{aspect-ratio:16\/10;background:#000;border-radius:10px;overflow:hidden}\r\n  .mock-laptop img{width:100%;height:100%;object-fit:cover;display:block}\r\n\r\n  \/* Mockup Mobile (optionnel, \u00e0 droite du laptop) *\/\r\n  .mock-stack{position:relative}\r\n  .mock-phone{position:absolute;right:14px;bottom:-26px;width:32%;min-width:140px;background:#0b1220;padding:8px;border-radius:16px;box-shadow:0 12px 30px rgba(0,0,0,.18)}\r\n  .mock-phone:before{content:\"\";display:block;width:36%;height:4px;margin:6px auto 8px;border-radius:999px;background:#203057;opacity:.8}\r\n  .mock-phone .screen{aspect-ratio:9\/16;background:#000;border-radius:10px;overflow:hidden}\r\n  .mock-phone img{width:100%;height:100%;object-fit:cover;display:block}\r\n\r\n  .work-body{padding:18px 18px 20px}\r\n  .work-title{margin:6px 0 6px;color:var(--blue);font-size:18px;font-weight:700}\r\n  .work-text{color:var(--muted);margin:0 0 14px;line-height:1.8}\r\n  .work-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}\r\n  .tag{background:var(--brand-soft);color:var(--brand);border:1px solid var(--brand);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:600}\r\n\r\n  .btn{display:inline-flex;align-items:center;gap:.5rem;background:var(--brand);color:#fff;padding:12px 18px;border-radius:999px;font-weight:600;border:0;cursor:pointer;box-shadow:var(--shadow);text-decoration:none}\r\n  .btn:hover{opacity:.95;transform:translateY(-1px)}\r\n  .btn-outline{background:transparent;border:2px solid var(--brand);color:var(--blue);box-shadow:none}\r\n  .btns{display:flex;gap:10px;flex-wrap:wrap}\r\n  \/* Carrousel mobile pour .work-grid *\/\r\n@media (max-width: 560px){\r\n  .work-grid{\r\n    display:flex;\r\n    overflow-x:auto;\r\n    gap:16px;\r\n    padding: 8px 8px 14px;\r\n    scroll-snap-type:x mandatory;\r\n    -webkit-overflow-scrolling: touch;\r\n  }\r\n  .work-grid::-webkit-scrollbar{display:none}\r\n  .work-card{\r\n    scroll-snap-align:center;\r\n    min-width: 85vw;          \/* largeur de la \u201cslide\u201d *\/\r\n    flex: 0 0 auto;\r\n  }\r\n  \/* l\u00e9ger fondu sur les bords pour indiquer qu'on peut swiper *\/\r\n  .works .wrap{position:relative}\r\n  .works .wrap::before,\r\n  .works .wrap::after{\r\n    content:\"\"; position:absolute; top:0; bottom:0; width:24px; pointer-events:none;\r\n    background:linear-gradient(to right,#fff,transparent);\r\n  }\r\n  .works .wrap::after{\r\n    right:0; background:linear-gradient(to left,#fff,transparent);\r\n  }\r\n\r\n  \/* Boutons nav (mob only) *\/\r\n  .work-nav{display:flex; justify-content:center; gap:12px; margin-top:10px}\r\n  .work-nav button{\r\n    appearance:none; border:1px solid var(--line); background:#fff;\r\n    color:var(--blue); border-radius:999px; padding:10px 14px; font-weight:600;\r\n    box-shadow: var(--shadow); cursor:pointer;\r\n  }\r\n  .work-nav button:active{transform:translateY(1px)}\r\n  .work-nav .is-disabled{opacity:.45; pointer-events:none}\r\n}\r\n\r\n\/* Option: l\u00e9g\u00e8re hausse du contraste des boutons au survol (desktop aussi) *\/\r\n.work-nav button:hover{background:var(--brand-soft); border-color:#ffd1db}\r\n\r\n<\/style>\r\n<!-- Utilisation\r\n\r\nRemplace les images par tes captures (id\u00e9alement 1600\u00d71000 pour laptop, 800\u00d71400 pour mobile).\r\n\r\nRenseigne les liens \u201cVoir le site\u201d \/ \u201c\u00c9tude de cas\u201d.\r\n\r\nTu peux dupliquer .work-card pour ajouter d\u2019autres projets. -->\r\n\r\n<section class=\"works\" aria-labelledby=\"works-title\">\r\n  <div class=\"wrap\">\r\n    <span class=\"eyebrow\">\u2022 Portfolio \u2022<\/span>\r\n    <h2 id=\"works-title\">Mes r\u00e9alisations<\/h2>\r\n    <div class=\"sep\"><\/div>\r\n    <p class=\"lead\">Quelques projets con\u00e7us avec soin : design sur mesure, performance et clart\u00e9, pour des entrepreneuses et TPE.<\/p>\r\n\r\n    <div class=\"work-grid\">\r\n      <!-- Projet 1 -->\r\n      <article class=\"work-card\">\r\n        <div class=\"mock-stack\">\r\n          <div class=\"mock-laptop\" aria-hidden=\"true\">\r\n            <div class=\"screen\">\r\n              <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1522199755839-a2bacb67c546?w=1200&q=80&auto=format&fit=crop\" alt=\"Aper\u00e7u du site - Boutique bien-\u00eatre\" \/>\r\n            <\/div>\r\n          <\/div>\r\n          <div class=\"mock-phone\" aria-hidden=\"true\">\r\n            <div class=\"screen\">\r\n              <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1516321318423-f06f85e504b3?w=800&q=80&auto=format&fit=crop\" alt=\"\">\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"work-body\">\r\n          <h3 class=\"work-title\">Boutique bien-\u00eatre<\/h3>\r\n          <div class=\"work-tags\">\r\n            <span class=\"tag\">WooCommerce<\/span><span class=\"tag\">SEO<\/span><span class=\"tag\">Performance<\/span>\r\n          <\/div>\r\n          <p class=\"work-text\">Refonte compl\u00e8te d\u2019une boutique : identit\u00e9 visuelle, tunnel de conversion, optimisation mobile et paiement s\u00e9curis\u00e9.<\/p>\r\n          <div class=\"btns\">\r\n            <a class=\"btn\" href=\"#\" target=\"_blank\" rel=\"noopener\">Voir le site<\/a>\r\n            <a class=\"btn btn-outline\" href=\"#\" target=\"_blank\" rel=\"noopener\">\u00c9tude de cas<\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/article>\r\n\r\n      <!-- Projet 2 -->\r\n      <article class=\"work-card\">\r\n        <div class=\"mock-stack\">\r\n          <div class=\"mock-laptop\" aria-hidden=\"true\">\r\n            <div class=\"screen\">\r\n              <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1498050108023-c5249f4df085?w=1200&q=80&auto=format&fit=crop\" alt=\"Aper\u00e7u du site - Cabinet de services\" \/>\r\n            <\/div>\r\n          <\/div>\r\n          <div class=\"mock-phone\" aria-hidden=\"true\">\r\n            <div class=\"screen\">\r\n              <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1529336953121-a0fc9a96e7f8?w=800&q=80&auto=format&fit=crop\" alt=\"\">\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"work-body\">\r\n          <h3 class=\"work-title\">Cabinet de services<\/h3>\r\n          <div class=\"work-tags\">\r\n            <span class=\"tag\">Site vitrine<\/span><span class=\"tag\">Accessibilit\u00e9<\/span>\r\n          <\/div>\r\n          <p class=\"work-text\">Site clair et accessible pour pr\u00e9senter l\u2019offre, les engagements et capter des prises de contact qualifi\u00e9es.<\/p>\r\n          <div class=\"btns\">\r\n            <a class=\"btn\" href=\"#\" target=\"_blank\" rel=\"noopener\">Voir le site<\/a>\r\n            <a class=\"btn btn-outline\" href=\"#\" target=\"_blank\" rel=\"noopener\">\u00c9tude de cas<\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/article>\r\n\r\n      <!-- Projet 3 -->\r\n      <article class=\"work-card\">\r\n        <div class=\"mock-stack\">\r\n          <div class=\"mock-laptop\" aria-hidden=\"true\">\r\n            <div class=\"screen\">\r\n              <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1524995997946-a1c2e315a42f?w=1200&q=80&auto=format&fit=crop\" alt=\"Aper\u00e7u du site - Artisane cr\u00e9ative\" \/>\r\n            <\/div>\r\n          <\/div>\r\n          <div class=\"mock-phone\" aria-hidden=\"true\">\r\n            <div class=\"screen\">\r\n              <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1544005313-94ddf0286df2?w=800&q=80&auto=format&fit=crop\" alt=\"\">\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"work-body\">\r\n          <h3 class=\"work-title\">Artisane cr\u00e9ative<\/h3>\r\n          <div class=\"work-tags\">\r\n            <span class=\"tag\">Refonte<\/span><span class=\"tag\">Branding<\/span>\r\n          <\/div>\r\n          <p class=\"work-text\">Mise \u00e0 jour de l\u2019image, structure de contenu repens\u00e9e et optimisation des performances Core Web Vitals.<\/p>\r\n          <div class=\"btns\">\r\n            <a class=\"btn\" href=\"#\" target=\"_blank\" rel=\"noopener\">Voir le site<\/a>\r\n            <a class=\"btn btn-outline\" href=\"#\" target=\"_blank\" rel=\"noopener\">\u00c9tude de cas<\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/article>\r\n    <\/div>\r\n            <!-- Nav mobile (visible \u2264 560px) -->\r\n<div class=\"work-nav\" aria-hidden=\"false\" role=\"group\" aria-label=\"Navigation carrousel\">\r\n  <button type=\"button\" class=\"work-prev\" aria-label=\"Projet pr\u00e9c\u00e9dent\">\u2190 Pr\u00e9c\u00e9dent<\/button>\r\n  <button type=\"button\" class=\"work-next\" aria-label=\"Projet suivant\">Suivant \u2192<\/button>\r\n<\/div>\r\n  <\/div>\r\n  <script>\r\n(function(){\r\n  const grid = document.querySelector('.work-grid');\r\n  if(!grid) return;\r\n\r\n  const prevBtn = document.querySelector('.work-prev');\r\n  const nextBtn = document.querySelector('.work-next');\r\n\r\n  \/\/ calcule la largeur d\u2019une \u201cslide\u201d (carte + gap)\r\n  function slideWidth(){\r\n    const card = grid.querySelector('.work-card');\r\n    if(!card) return 0;\r\n    const cardRect = card.getBoundingClientRect();\r\n    \/\/ On ajoute le gap (16px en mobile)\r\n    return cardRect.width + 16;\r\n  }\r\n\r\n  function updateDisabled(){\r\n    \/\/ d\u00e9sactive les boutons en d\u00e9but\/fin\r\n    const maxScroll = grid.scrollWidth - grid.clientWidth - 2; \/\/ marge\r\n    if(prevBtn) prevBtn.classList.toggle('is-disabled', grid.scrollLeft <= 2);\r\n    if(nextBtn) nextBtn.classList.toggle('is-disabled', grid.scrollLeft >= maxScroll);\r\n  }\r\n\r\n  function scrollBySlide(dir){\r\n    grid.scrollBy({ left: dir * slideWidth(), behavior: 'smooth' });\r\n    setTimeout(updateDisabled, 350);\r\n  }\r\n\r\n  \/\/ \u00c9couteurs\r\n  if(prevBtn) prevBtn.addEventListener('click', ()=>scrollBySlide(-1));\r\n  if(nextBtn) nextBtn.addEventListener('click', ()=>scrollBySlide(1));\r\n  grid.addEventListener('scroll', updateDisabled, {passive:true});\r\n\r\n  \/\/ init\r\n  updateDisabled();\r\n\r\n  \/\/ Touch helper: fl\u00e8ches cach\u00e9es au-del\u00e0 de 560px\r\n  const mq = window.matchMedia('(max-width: 560px)');\r\n  function toggleNav(e){\r\n    if(!prevBtn || !nextBtn) return;\r\n    const show = e.matches;\r\n    prevBtn.style.display = show ? '' : 'none';\r\n    nextBtn.style.display = show ? '' : 'none';\r\n  }\r\n  toggleNav(mq);\r\n  mq.addEventListener ? mq.addEventListener('change', toggleNav) : mq.addListener(toggleNav);\r\n})();\r\n<\/script>\r\n\r\n<\/section>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-10e2972 e-con-full e-flex e-con e-parent\" data-id=\"10e2972\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bb54d0f elementor-widget elementor-widget-html\" data-id=\"bb54d0f\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- SECTION \u2014 AVIS & T\u00c9MOIGNAGES -->\r\n<style>\r\n  .testi {\r\n    --brand:#ff4d6d; --brand-soft:#fff5f7; --blue:#1a2e85;\r\n    --ink:#0f172a; --muted:#64748b; --line:#e5e7eb;\r\n    --radius:18px; --shadow:0 10px 30px rgba(15,23,42,.08);\r\n    background: var(--brand-soft);\r\n    color: var(--ink);\r\n    padding: 90px 20px;\r\n    width: 1400px;\r\n  }\r\n  .testi .wrap { max-width:1200px; margin:0 auto; }\r\n  .testi .eyebrow{\/*display:block;width:fit-content;margin:0 auto 10px;padding:4px 10px;border-radius:999px;background:var(--blue);color:var(--brand);font-weight:600;font-size:12px*\/\r\n    display: inline-block;\r\n  margin: 0 auto 8px;\r\n  padding: .10rem .90rem;\r\n  background: var(--blue);\r\n  color: var(--brand);\r\n  border-radius: 999px;\r\n  font-weight: 600;\r\n  font-size: .85rem;\r\n  text-align: center;\r\n  \/* Ajout pour centrage *\/\r\n  display: block;\r\n  width: fit-content;\r\n  }\r\n  .testi h2{margin:0;text-align:center;color:var(--blue);font-size:clamp(28px,3.6vw,36px);font-weight:800}\r\n  .testi .sep{width:64px;height:3px;background:var(--brand);border-radius:2px;margin:14px auto 24px}\r\n  .testi .lead{max-width:760px;margin:0 auto 30px;text-align:center;color:var(--muted);line-height:1.7}\r\n\r\n  .testi-grid{display:grid;gap:24px;grid-template-columns:repeat(3,1fr)}\r\n  @media (max-width:1024px){ .testi-grid{grid-template-columns:repeat(2,1fr)} }\r\n  @media (max-width:560px){ .testi-grid{grid-template-columns:1fr} }\r\n\r\n  .t-card{\r\n    background:#fff;border:1px solid var(--line);border-radius:var(--radius);\r\n    box-shadow:var(--shadow);padding:24px;display:flex;flex-direction:column;gap:14px;\r\n    transition:transform .22s ease, box-shadow .22s ease;\r\n  }\r\n  .t-card:hover{ transform:translateY(-6px); box-shadow:0 16px 38px rgba(15,23,42,.12); }\r\n\r\n  .t-head{display:flex;align-items:center;gap:12px}\r\n  .t-avatar{width:56px;height:56px;border-radius:50%;object-fit:cover}\r\n  .t-id{display:flex;flex-direction:column}\r\n  .t-name{font-weight:700;color:var(--blue);margin:0}\r\n  .t-role{color:var(--muted);font-size:14px;margin:0}\r\n\r\n  .t-stars{display:flex;gap:4px}\r\n  .t-stars svg{width:18px;height:18px;fill:#f59e0b}\r\n\r\n  .t-quote{margin:0;color:var(--ink);line-height:1.8}\r\n  .t-meta{color:var(--muted);font-size:13px}\r\n\r\n  \/* Bande full-bleed optionnel au-dessus ou en dessous\r\n     <div class=\"divider-soft\"><\/div> d\u00e9j\u00e0 d\u00e9fini dans ta feuille globale *\/\r\n<\/style>\r\n\r\n<section class=\"testi\" aria-labelledby=\"testi-title\">\r\n  <div class=\"wrap\">\r\n    <span class=\"eyebrow\">\u2022 Avis \u2022<\/span>\r\n    <h2 id=\"testi-title\">Ils me font confiance<\/h2>\r\n    <div class=\"sep\"><\/div>\r\n    <p class=\"lead\">Des retours de clientes et clients accompagn\u00e9s sur la cr\u00e9ation ou la refonte de leur site \u2014 performance, clart\u00e9 et accompagnement humain.<\/p>\r\n\r\n    <div class=\"testi-grid\">\r\n      <!-- Avis 1 -->\r\n      <article class=\"t-card\" itemscope itemtype=\"https:\/\/schema.org\/Review\">\r\n        <div class=\"t-head\">\r\n          <img decoding=\"async\" class=\"t-avatar\" src=\"https:\/\/images.unsplash.com\/photo-1502685104226-ee32379fefbe?w=160&q=80&auto=format&fit=crop\" alt=\"Portrait d'Amine B.\">\r\n          <div class=\"t-id\">\r\n            <p class=\"t-name\" itemprop=\"author\" itemscope itemtype=\"https:\/\/schema.org\/Person\">\r\n              <span itemprop=\"name\">Amine B.<\/span>\r\n            <\/p>\r\n            <p class=\"t-role\">E-commerce<\/p>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"t-stars\" aria-label=\"Note 5 sur 5\">\r\n          <!-- 5 stars -->\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n        <\/div>\r\n        <p class=\"t-quote\" itemprop=\"reviewBody\">\u201cPrestation impeccable de bout en bout. Le site est rapide et nos demandes ont \u00e9t\u00e9 comprises imm\u00e9diatement.\u201d<\/p>\r\n        <meta itemprop=\"reviewRating\" content=\"5\">\r\n        <p class=\"t-meta\">Projet : refonte WooCommerce \u2022 D\u00e9lai : 4 semaines<\/p>\r\n      <\/article>\r\n\r\n      <!-- Avis 2 -->\r\n      <article class=\"t-card\" itemscope itemtype=\"https:\/\/schema.org\/Review\">\r\n        <div class=\"t-head\">\r\n          <img decoding=\"async\" class=\"t-avatar\" src=\"https:\/\/images.unsplash.com\/photo-1547425260-76bcadfb4f2c?w=160&q=80&auto=format&fit=crop\" alt=\"Portrait de Sarah K.\">\r\n          <div class=\"t-id\">\r\n            <p class=\"t-name\" itemprop=\"author\" itemscope itemtype=\"https:\/\/schema.org\/Person\">\r\n              <span itemprop=\"name\">Sarah K.<\/span>\r\n            <\/p>\r\n            <p class=\"t-role\">Services<\/p>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"t-stars\" aria-label=\"Note 5 sur 5\">\r\n          <!-- 5 stars -->\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n        <\/div>\r\n        <p class=\"t-quote\" itemprop=\"reviewBody\">\u201cUne approche p\u00e9dagogique et un design qui nous ressemble. On re\u00e7oit plus de demandes qu\u2019avant.\u201d<\/p>\r\n        <meta itemprop=\"reviewRating\" content=\"5\">\r\n        <p class=\"t-meta\">Projet : site vitrine \u2022 D\u00e9lai : 3 semaines<\/p>\r\n      <\/article>\r\n\r\n      <!-- Avis 3 -->\r\n      <article class=\"t-card\" itemscope itemtype=\"https:\/\/schema.org\/Review\">\r\n        <div class=\"t-head\">\r\n          <img decoding=\"async\" class=\"t-avatar\" src=\"https:\/\/images.unsplash.com\/photo-1544005313-94ddf0286df2?w=160&q=80&auto=format&fit=crop\" alt=\"Portrait de Hajar L.\">\r\n          <div class=\"t-id\">\r\n            <p class=\"t-name\" itemprop=\"author\" itemscope itemtype=\"https:\/\/schema.org\/Person\">\r\n              <span itemprop=\"name\">Hajar L.<\/span>\r\n            <\/p>\r\n            <p class=\"t-role\">R\u00e9daction & SEO<\/p>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"t-stars\" aria-label=\"Note 5 sur 5\">\r\n          <!-- 5 stars -->\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n          <svg viewBox=\"0 0 24 24\"><path d=\"M12 17.3l-6.18 3.7 1.64-7.03L2 9.24l7.19-.62L12 2l2.81 6.62 7.19.62-5.46 4.73 1.64 7.03z\"\/><\/svg>\r\n        <\/div>\r\n        <p class=\"t-quote\" itemprop=\"reviewBody\">\u201cR\u00e9active, claire, bienveillante : la collaboration a \u00e9t\u00e9 fluide et le r\u00e9sultat tr\u00e8s pro. Je recommande !\u201d<\/p>\r\n        <meta itemprop=\"reviewRating\" content=\"5\">\r\n        <p class=\"t-meta\">Projet : refonte + SEO \u2022 D\u00e9lai : 5 semaines<\/p>\r\n      <\/article>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- JSON-LD Review (SEO) : adapte le nom & url -->\r\n<script type=\"application\/ld+json\">\r\n{\r\n  \"@context\":\"https:\/\/schema.org\",\r\n  \"@type\":\"ItemList\",\r\n  \"itemListElement\": [\r\n    {\r\n      \"@type\":\"Review\",\r\n      \"author\":{\"@type\":\"Person\",\"name\":\"Amine B.\"},\r\n      \"reviewBody\":\"Prestation impeccable de bout en bout. Le site est rapide et nos demandes ont \u00e9t\u00e9 comprises imm\u00e9diatement.\",\r\n      \"reviewRating\":{\"@type\":\"Rating\",\"ratingValue\":\"5\",\"bestRating\":\"5\"},\r\n      \"itemReviewed\":{\"@type\":\"LocalBusiness\",\"name\":\"SO Web Concept\",\"url\":\"https:\/\/sowebconcept.com\"}\r\n    },\r\n    {\r\n      \"@type\":\"Review\",\r\n      \"author\":{\"@type\":\"Person\",\"name\":\"Sarah K.\"},\r\n      \"reviewBody\":\"Une approche p\u00e9dagogique et un design qui nous ressemble. On re\u00e7oit plus de demandes qu\u2019avant.\",\r\n      \"reviewRating\":{\"@type\":\"Rating\",\"ratingValue\":\"5\",\"bestRating\":\"5\"},\r\n      \"itemReviewed\":{\"@type\":\"LocalBusiness\",\"name\":\"SO Web Concept\",\"url\":\"https:\/\/sowebconcept.com\"}\r\n    },\r\n    {\r\n      \"@type\":\"Review\",\r\n      \"author\":{\"@type\":\"Person\",\"name\":\"Hajar L.\"},\r\n      \"reviewBody\":\"R\u00e9active, claire, bienveillante : la collaboration a \u00e9t\u00e9 fluide et le r\u00e9sultat tr\u00e8s pro. Je recommande !\",\r\n      \"reviewRating\":{\"@type\":\"Rating\",\"ratingValue\":\"5\",\"bestRating\":\"5\"},\r\n      \"itemReviewed\":{\"@type\":\"LocalBusiness\",\"name\":\"SO Web Concept\",\"url\":\"https:\/\/sowebconcept.com\"}\r\n    }\r\n  ]\r\n}\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c0a764b e-flex e-con-boxed e-con e-parent\" data-id=\"c0a764b\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ec20b83 elementor-widget elementor-widget-html\" data-id=\"ec20b83\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- SECTION \u2014 TARIFS (avec paiement en plusieurs fois) -->\r\n<style>\r\n  .pricing {\r\n    --brand:#ff4d6d; --brand-soft:#fff5f7; --blue:#1a2e85;\r\n    --ink:#0f172a; --muted:#64748b; --line:#e5e7eb;\r\n    --radius:18px; --shadow:0 10px 30px rgba(15,23,42,.08);\r\n    padding: 70px 20px; background:#fff; color:var(--ink);\r\n  }\r\n  .pricing .wrap{max-width:1400px;margin:0 auto}\r\n  .pricing .eyebrow{display:block;width:fit-content;margin:0 auto 10px;padding:4px 10px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font-weight:600;font-size:12px}\r\n  .pricing h2{margin:0;text-align:center;color:var(--blue);font-size:clamp(28px,3.6vw,36px);font-weight:800}\r\n  .pricing .sep{width:64px;height:3px;background:var(--brand);border-radius:2px;margin:14px auto 24px}\r\n  .pricing .lead{max-width:760px;margin:0 auto 28px;text-align:center;color:var(--muted);line-height:1.7}\r\n\r\n  \/* S\u00e9lecteur de paiement *\/\r\n  .pay-switch{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:22px}\r\n  .pay-switch button{\r\n    appearance:none;border:1px solid var(--line);background:#fff;color:var(--blue);\r\n    border-radius:999px;padding:10px 14px;font-weight:600;cursor:pointer;box-shadow:var(--shadow);\r\n  }\r\n  .pay-switch button.is-active{background:var(--brand); color:#fff; border-color:transparent}\r\n  .grid-price{display:grid;gap:24px;grid-template-columns:repeat(3,1fr)}\r\n  @media (max-width:1024px){ .grid-price{grid-template-columns:1fr} }\r\n\r\n  .plan{\r\n    background:#fff;border:1px solid var(--line);border-radius:var(--radius);\r\n    box-shadow:var(--shadow);padding:26px;display:flex;flex-direction:column;gap:14px;position:relative;\r\n    transition:transform .22s ease, box-shadow .22s ease;\r\n  }\r\n  .plan:hover{transform:translateY(-6px);box-shadow:0 16px 38px rgba(15,23,42,.12)}\r\n  .badge-pop{\r\n    position:absolute;top:-12px;right:16px;background:var(--brand);color:#fff;\r\n    font-size:12px;font-weight:700;padding:6px 10px;border-radius:999px;\r\n  }\r\n  .plan h3{margin:0;color:var(--blue);font-size:20px;font-weight:800}\r\n  .price{display:flex;align-items-baseline;gap:8px}\r\n  .price .main{font-size:28px;font-weight:800;color:var(--ink)}\r\n  .price .from{color:var(--muted);font-size:14px}\r\n  .split{color:var(--blue);font-weight:700}\r\n  .desc{color:var(--muted);margin-top:-4px}\r\n  .plan ul{margin:0;padding:0;list-style:none;display:grid;gap:8px;color:var(--muted)}\r\n  .plan li{position:relative;padding-left:22px}\r\n  .plan li::before{content:\"\u2713\";position:absolute;left:0;top:0;color:var(--brand);font-weight:900}\r\n  .cta{display:flex;gap:10px;flex-wrap:wrap}\r\n  .btn{\r\n    display:inline-flex;align-items:center;gap:.5rem;background:var(--brand);color:#fff;\r\n    padding:12px 18px;border-radius:999px;font-weight:600;border:0;cursor:pointer;box-shadow:var(--shadow);text-decoration:none\r\n  }\r\n  .btn:hover{opacity:.95;transform:translateY(-1px)}\r\n  .btn-outline{background:transparent;border:2px solid var(--brand);color:var(--blue);box-shadow:none}\r\n  .note{font-size:13px;color:var(--muted);text-align:center;margin-top:8px}\r\n<\/style>\r\n\r\n<section class=\"pricing\" aria-labelledby=\"pricing-title\">\r\n  <div class=\"wrap\">\r\n    <span class=\"eyebrow\">\u2022 Tarifs \u2022<\/span>\r\n    <h2 id=\"pricing-title\">Des offres claires et abordables<\/h2>\r\n    <div class=\"sep\"><\/div>\r\n    <p class=\"lead\">Paiement possible en plusieurs fois. Chaque projet est unique \u2014 ces tarifs sont \u201c\u00e0 partir de\u201d et ajust\u00e9s selon tes besoins.<\/p>\r\n\r\n    <!-- S\u00e9lecteur de paiement -->\r\n    <div class=\"pay-switch\" role=\"tablist\" aria-label=\"Options de paiement\">\r\n      <button type=\"button\" class=\"pay-opt is-active\" data-mode=\"1x\" role=\"tab\" aria-selected=\"true\">Comptant<\/button>\r\n      <button type=\"button\" class=\"pay-opt\" data-mode=\"3x\" role=\"tab\" aria-selected=\"false\">3\u00d7 sans frais<\/button>\r\n      <button type=\"button\" class=\"pay-opt\" data-mode=\"6x\" role=\"tab\" aria-selected=\"false\">6\u00d7 (sur demande)<\/button>\r\n    <\/div>\r\n\r\n    <div class=\"grid-price\">\r\n      <!-- Starter -->\r\n      <article class=\"plan\" data-base=\"690\">\r\n        <h3>Starter<\/h3>\r\n        <div class=\"price\">\r\n          <div class=\"main\"><span class=\"from\">\u00e0 partir de<\/span> <span class=\"amount\">690\u20ac<\/span><\/div>\r\n        <\/div>\r\n        <div class=\"desc\">One-page rapide et efficace pour lancer ta pr\u00e9sence en ligne.<\/div>\r\n        <div class=\"split\" aria-live=\"polite\"><!-- Montant fractionn\u00e9 inject\u00e9 par JS --><\/div>\r\n        <ul>\r\n          <li>Page unique (One-page)<\/li>\r\n          <li>Design personnalis\u00e9 & responsive<\/li>\r\n          <li>Optimisation de base (SEO & vitesse)<\/li>\r\n        <\/ul>\r\n        <div class=\"cta\">\r\n          <a class=\"btn\" href=\"#contact\">Demander un devis<\/a>\r\n          <a class=\"btn btn-outline\" href=\"#portfolio\">Voir des exemples<\/a>\r\n        <\/div>\r\n      <\/article>\r\n\r\n      <!-- Essentiel (Populaire) -->\r\n      <article class=\"plan\" data-base=\"1290\">\r\n        <span class=\"badge-pop\">Populaire<\/span>\r\n        <h3>Essentiel<\/h3>\r\n        <div class=\"price\">\r\n          <div class=\"main\"><span class=\"from\">\u00e0 partir de<\/span> <span class=\"amount\">1 290\u20ac<\/span><\/div>\r\n        <\/div>\r\n        <div class=\"desc\">Le pack id\u00e9al pour une petite entreprise qui veut convertir.<\/div>\r\n        <div class=\"split\" aria-live=\"polite\"><\/div>\r\n        <ul>\r\n          <li>Jusqu\u2019\u00e0 6 pages<\/li>\r\n          <li>Formation 1h incluse<\/li>\r\n          <li>SEO technique & performance<\/li>\r\n          <li>Formulaire de contact \/ prise de RDV<\/li>\r\n        <\/ul>\r\n        <div class=\"cta\">\r\n          <a class=\"btn\" href=\"#contact\">C\u2019est pour moi<\/a>\r\n          <a class=\"btn btn-outline\" href=\"#services\">D\u00e9tails de l\u2019offre<\/a>\r\n        <\/div>\r\n      <\/article>\r\n\r\n      <!-- Boutique -->\r\n      <article class=\"plan\" data-base=\"0\">\r\n        <h3>Boutique<\/h3>\r\n        <div class=\"price\">\r\n          <div class=\"main\"><span class=\"from\">sur devis<\/span><\/div>\r\n        <\/div>\r\n        <div class=\"desc\">Boutique WooCommerce compl\u00e8te et \u00e9volutive.<\/div>\r\n        <div class=\"split\" aria-live=\"polite\"><\/div>\r\n        <ul>\r\n          <li>Produits, cat\u00e9gories, filtres<\/li>\r\n          <li>Paiements & livraisons<\/li>\r\n          <li>Fiches produits optimis\u00e9es<\/li>\r\n          <li>Accompagnement au lancement<\/li>\r\n        <\/ul>\r\n        <div class=\"cta\">\r\n          <a class=\"btn\" href=\"#contact\">Obtenir un devis<\/a>\r\n          <a class=\"btn btn-outline\" href=\"#portfolio\">Voir des boutiques<\/a>\r\n        <\/div>\r\n      <\/article>\r\n    <\/div>\r\n\r\n    <div class=\"note\">Exemples indicatifs. Facilit\u00e9s de paiement : 3\u00d7 sans frais \u2014 6\u00d7 possible sur demande (conditions \u00e0 d\u00e9finir ensemble).<\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n\/* Mini script : affiche le montant en 3x\/6x \u00e0 partir du prix de base *\/\r\n(function(){\r\n  const fmt = (n)=> n.toLocaleString('fr-FR', {minimumFractionDigits:0, maximumFractionDigits:0});\r\n  const opts = document.querySelectorAll('.pay-opt');\r\n  const plans = document.querySelectorAll('.plan');\r\n\r\n  function update(mode){\r\n    opts.forEach(b=> b.classList.toggle('is-active', b.dataset.mode===mode));\r\n    plans.forEach(plan=>{\r\n      const base = parseFloat(plan.dataset.base || '0');\r\n      const splitEl = plan.querySelector('.split');\r\n      if(!splitEl) return;\r\n      if(!base){ splitEl.textContent = \"\"; return; }\r\n\r\n      if(mode==='1x'){\r\n        splitEl.textContent = \"Paiement comptant.\";\r\n      } else if(mode==='3x'){\r\n        const part = Math.round(base \/ 3);\r\n        splitEl.textContent = `Exemple : ${3}\u00d7 ${fmt(part)}\u20ac (sans frais)`;\r\n      } else if(mode==='6x'){\r\n        const part = Math.round(base \/ 6);\r\n        splitEl.textContent = `Exemple : ${6}\u00d7 ${fmt(part)}\u20ac (estimation)`;\r\n      }\r\n    });\r\n  }\r\n\r\n  opts.forEach(b=> b.addEventListener('click', ()=> update(b.dataset.mode)));\r\n  update('1x'); \/\/ \u00e9tat initial\r\n})();\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-9b17311 e-flex e-con-boxed e-con e-parent\" data-id=\"9b17311\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ea22690 elementor-widget elementor-widget-html\" data-id=\"ea22690\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- SECTION \u2014 CONTACT (version corrig\u00e9e et isol\u00e9e) -->\r\n<style>\r\n  .contact {\r\n    --brand:#ff4d6d; --brand-soft:#fff5f7; --blue:#1a2e85;\r\n    --ink:#0f172a; --muted:#64748b; --line:#e5e7eb;\r\n    --radius:18px; --shadow:0 10px 30px rgba(15,23,42,.08);\r\n    padding: 96px 20px; background:#fff; color:var(--ink);\r\n  }\r\n  .contact .wrap{max-width:1200px;margin:0 auto}\r\n  .contact .eyebrow{display:block;width:fit-content;margin:0 auto 10px;padding:4px 10px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font-weight:600;font-size:12px}\r\n  .contact h2{margin:0;text-align:center;color:var(--blue);font-size:clamp(28px,3.6vw,36px);font-weight:800}\r\n  .contact .sep{width:64px;height:3px;background:var(--brand);border-radius:2px;margin:14px auto 22px}\r\n  .contact .lead{max-width:820px;margin:0 auto 36px;text-align:center;color:var(--muted);line-height:1.7}\r\n\r\n  .contact-grid{display:grid;gap:28px;grid-template-columns:1fr 1.2fr}\r\n  @media (max-width:1024px){.contact-grid{grid-template-columns:1fr}}\r\n\r\n  \/* Colonne gauche (infos) *\/\r\n  .c-info{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px}\r\n  .info-block{display:flex;gap:14px;align-items:flex-start;border-bottom:1px dashed var(--line);padding:16px 0}\r\n  .info-block:last-child{border-bottom:0}\r\n  .i-badge{width:48px;height:48px;border-radius:14px;background:var(--brand-soft);display:grid;place-items:center;flex:0 0 48px}\r\n  .i-badge svg{width:22px;height:22px;fill:var(--brand)}\r\n  .i-title{margin:0;color:var(--blue);font-weight:700}\r\n  .i-text{margin:4px 0 0;color:var(--muted)}\r\n  .c-links a{color:var(--blue);font-weight:600;text-decoration:none}\r\n  .c-links a:hover{color:var(--brand)}\r\n\r\n  \/* Formulaire *\/\r\n  .c-form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px}\r\n  .c-row{display:grid;gap:14px;grid-template-columns:repeat(2,1fr)}\r\n  @media (max-width:560px){.c-row{grid-template-columns:1fr}}\r\n  .field{display:flex;flex-direction:column;gap:6px}\r\n  .label{font-weight:600;color:var(--blue);font-size:14px}\r\n  .req{color:var(--brand)}\r\n  .contact input,\r\n  .contact textarea,\r\n  .contact select{\r\n    width:100%;padding:12px 14px;border:1px solid var(--line);\r\n    border-radius:12px;background:#fff;font:inherit;color:var(--ink)\r\n  }\r\n  .contact textarea{min-height:140px;resize:vertical}\r\n  .hint{font-size:12px;color:var(--muted)}\r\n  .consent{display:flex;gap:10px;align-items:flex-start;margin-top:6px;color:var(--muted);font-size:14px}\r\n  .actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}\r\n  .c-btn{display:inline-flex;align-items:center;gap:.5rem;background:var(--brand);color:#fff;padding:12px 18px;border-radius:999px;font-weight:600;border:0;cursor:pointer;box-shadow:var(--shadow)}\r\n  .c-btn:hover{opacity:.95;transform:translateY(-1px)}\r\n  .c-btn-outline{background:transparent;border:2px solid var(--brand);color:var(--blue);box-shadow:none}\r\n  .notice{display:none;margin-top:12px;padding:10px 12px;border-radius:12px;background:#ecfeff;color:#065f46;border:1px solid #99f6e4}\r\n<\/style>\r\n\r\n<section id=\"contact\" class=\"contact\" aria-labelledby=\"contact-title\">\r\n  <div class=\"wrap\">\r\n    <span class=\"eyebrow\">Contact<\/span>\r\n    <h2 id=\"contact-title\">Parlons de ton projet \u2709\ufe0f<\/h2>\r\n    <div class=\"sep\"><\/div>\r\n    <p class=\"lead\">R\u00e9ponse sous 24\u201348h ouvr\u00e9es. Tu peux m\u2019\u00e9crire, m\u2019appeler ou remplir le formulaire. Paiement possible en <strong>3\u00d7 sans frais<\/strong>, 6\u00d7 sur demande.<\/p>\r\n\r\n    <div class=\"contact-grid\">\r\n      <!-- Infos -->\r\n      <aside class=\"c-info\" aria-labelledby=\"infos-title\">\r\n        <h3 id=\"infos-title\" class=\"i-title\" style=\"margin-bottom:8px;\">Informations de contact<\/h3>\r\n\r\n        <div class=\"info-block\">\r\n          <div class=\"i-badge\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.8-.4 1.2-.2 1.3.5 2.7.8 4.2.8.7 0 1.2.6 1.2 1.3v3.7c0 .7-.5 1.3-1.2 1.3C9.8 22.1 1.9 14.2 1.9 3.2c0-.7.6-1.2 1.3-1.2H7c.7 0 1.3.5 1.3 1.2 0 1.5.3 2.9.8 4.2.1.4 0 .9-.3 1.2l-2.2 2.2z\"\/><\/svg>\r\n          <\/div>\r\n          <div>\r\n            <p class=\"i-title\">Appelle-moi<\/p>\r\n            <p class=\"i-text c-links\"><a href=\"tel:+33623068918\">+33 6 62 05 28 98<\/a><\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"info-block\">\r\n          <div class=\"i-badge\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M4 4h16a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2zm8 7L4.5 6.5h15L12 11z\"\/><\/svg>\r\n          <\/div>\r\n          <div>\r\n            <p class=\"i-title\">\u00c9cris-moi<\/p>\r\n            <p class=\"i-text c-links\"><a href=\"mailto:contact@sowebconcept.com\">contact@sowebconcept.com<\/a><\/p>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"info-block\">\r\n          <div class=\"i-badge\" aria-hidden=\"true\">\r\n            <svg viewBox=\"0 0 24 24\"><path d=\"M6 2h12v2H6V2zm14 5H4a1 1 0 0 0-1 1v12a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V8a1 1 0 0 0-1-1zm-2 12H6v-8h12v8z\"\/><\/svg>\r\n          <\/div>\r\n          <div>\r\n            <p class=\"i-title\">Horaires<\/p>\r\n            <p class=\"i-text\">Lun\u2013Ven : 9h\u201317h<\/p>\r\n          <\/div>\r\n        <\/div>\r\n      <\/aside>\r\n\r\n      <!-- Formulaire -->\r\n      <form class=\"c-form\" aria-labelledby=\"form-title\" onsubmit=\"event.preventDefault();this.querySelector('.notice').style.display='block';this.reset();\">\r\n        <h3 id=\"form-title\" class=\"i-title\" style=\"margin-bottom:8px;\">Contactez SO Web Concept<\/h3>\r\n\r\n        <div class=\"c-row\">\r\n          <div class=\"field\">\r\n            <label class=\"label\" for=\"fname\">Pr\u00e9nom <span class=\"req\">*<\/span><\/label>\r\n            <input id=\"fname\" name=\"prenom\" required placeholder=\"Votre pr\u00e9nom\">\r\n          <\/div>\r\n          <div class=\"field\">\r\n            <label class=\"label\" for=\"lname\">Nom <span class=\"req\">*<\/span><\/label>\r\n            <input id=\"lname\" name=\"nom\" required placeholder=\"Votre nom\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"c-row\">\r\n          <div class=\"field\">\r\n            <label class=\"label\" for=\"email\">Email <span class=\"req\">*<\/span><\/label>\r\n            <input id=\"email\" type=\"email\" name=\"email\" required placeholder=\"vous@exemple.com\">\r\n            <div class=\"hint\">Je ne partage jamais ton email.<\/div>\r\n          <\/div>\r\n          <div class=\"field\">\r\n            <label class=\"label\" for=\"tel\">T\u00e9l\u00e9phone<\/label>\r\n            <input id=\"tel\" type=\"tel\" name=\"tel\" placeholder=\"06\u2026\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"c-row\">\r\n          <div class=\"field\">\r\n            <label class=\"label\" for=\"type\">Type de projet<\/label>\r\n            <select id=\"type\" name=\"type\">\r\n              <option value=\"\">Choisir\u2026<\/option>\r\n              <option>Site vitrine<\/option>\r\n              <option>Refonte<\/option>\r\n              <option>E-commerce<\/option>\r\n              <option>Autre<\/option>\r\n            <\/select>\r\n          <\/div>\r\n          <div class=\"field\">\r\n            <label class=\"label\" for=\"paiement\">Paiement<\/label>\r\n            <select id=\"paiement\" name=\"paiement\">\r\n              <option value=\"\">Pr\u00e9f\u00e9rence\u2026<\/option>\r\n              <option>Comptant<\/option>\r\n              <option>3\u00d7 sans frais<\/option>\r\n              <option>6\u00d7 (sur demande)<\/option>\r\n            <\/select>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"field\">\r\n          <label class=\"label\" for=\"message\">Message<\/label>\r\n          <textarea id=\"message\" name=\"message\" placeholder=\"Parle-moi de ton projet, objectifs, d\u00e9lais\u2026\"><\/textarea>\r\n        <\/div>\r\n\r\n        <label class=\"consent\">\r\n          <input type=\"checkbox\" required>\r\n          <span>J\u2019accepte que mes donn\u00e9es soient utilis\u00e9es pour r\u00e9pondre \u00e0 ma demande (RGPD).<\/span>\r\n        <\/label>\r\n\r\n        <div class=\"actions\">\r\n          <button class=\"c-btn\" type=\"submit\">Envoyer le message<\/button>\r\n          <a class=\"c-btn c-btn-outline\" href=\"tel:+33623068918\">Appeler maintenant<\/a>\r\n        <\/div>\r\n\r\n        <div class=\"notice\" role=\"status\">Merci ! Ton message a bien \u00e9t\u00e9 envoy\u00e9. Je reviens vers toi rapidement.<\/div>\r\n\r\n        <input type=\"text\" name=\"company\" style=\"position:absolute;left:-5000px\" tabindex=\"-1\" autocomplete=\"off\">\r\n      <\/form>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3700681 e-con-full e-flex e-con e-parent\" data-id=\"3700681\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-896ada2 elementor-widget elementor-widget-html\" data-id=\"896ada2\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- SECTION \u2014 FAQ -->\r\n<style>\r\n  .faq {\r\n    --brand:#ff4d6d; --brand-soft:#fff5f7; --blue:#1a2e85;\r\n    --ink:#0f172a; --muted:#64748b; --line:#e5e7eb;\r\n    --radius:18px; --shadow:0 10px 30px rgba(15,23,42,.08);\r\n    padding: 90px 20px; background:#fff; color:var(--ink);\r\n  }\r\n  .faq .wrap{max-width:1200px;margin:0 auto}\r\n  .faq .eyebrow{display:block;width:fit-content;margin:0 auto 10px;padding:4px 10px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font-weight:600;font-size:12px}\r\n  .faq h2{margin:0;text-align:center;color:var(--blue);font-size:clamp(28px,3.6vw,36px);font-weight:800}\r\n  .faq .sep{width:64px;height:3px;background:var(--brand);border-radius:2px;margin:14px auto 24px}\r\n  .faq .lead{max-width:760px;margin:0 auto 28px;text-align:center;color:var(--muted);line-height:1.7}\r\n\r\n  .faq-list{display:grid;gap:14px;grid-template-columns:1fr 1fr}\r\n  @media (max-width:1024px){ .faq-list{grid-template-columns:1fr} }\r\n\r\n  .faq details{\r\n    background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);\r\n    padding:0; overflow:hidden\r\n  }\r\n  .faq summary{\r\n    list-style:none; cursor:pointer; padding:18px 20px; position:relative; color:var(--blue); font-weight:700\r\n  }\r\n  .faq summary::-webkit-details-marker{display:none}\r\n  .faq summary:after{\r\n    content:\"+\"; position:absolute; right:16px; top:50%; transform:translateY(-50%); \r\n    width:28px; height:28px; border-radius:999px; background:var(--brand-soft); color:var(--brand);\r\n    display:grid; place-items:center; font-weight:800;\r\n  }\r\n  .faq details[open] summary:after{ content:\"\u2013\"; }\r\n  .faq .answer{padding:0 20px 18px; color:var(--ink); line-height:1.8}\r\n  .faq .answer p{margin:10px 0 0}\r\n  .faq .answer ul{margin:10px 0 0 18px; color:var(--muted)}\r\n<\/style>\r\n\r\n<section class=\"faq\" aria-labelledby=\"faq-title\">\r\n  <div class=\"wrap\">\r\n    <span class=\"eyebrow\">FAQ<\/span>\r\n    <h2 id=\"faq-title\">Questions fr\u00e9quentes<\/h2>\r\n    <div class=\"sep\"><\/div>\r\n    <p class=\"lead\">Quelques r\u00e9ponses rapides sur les d\u00e9lais, ce qui est inclus, et les modalit\u00e9s de paiement. Si tu ne trouves pas ta r\u00e9ponse, <a href=\"#contact\" style=\"color:#ff4d6d\">\u00e9cris-moi<\/a> \ud83d\ude42<\/p>\r\n\r\n    <div class=\"faq-list\">\r\n      <details>\r\n        <summary>Quels sont les d\u00e9lais pour cr\u00e9er un site&nbsp;?<\/summary>\r\n        <div class=\"answer\">\r\n          <p>Un site vitrine <strong>Starter<\/strong> prend en moyenne <strong>2 \u00e0 3&nbsp;semaines<\/strong>. L\u2019offre <strong>Essentiel<\/strong> (jusqu\u2019\u00e0 6 pages) n\u00e9cessite <strong>3 \u00e0 5&nbsp;semaines<\/strong>. Les boutiques e-commerce varient selon le catalogue (souvent <strong>4 \u00e0 8&nbsp;semaines<\/strong>).<\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n      <details>\r\n        <summary>Qu\u2019est-ce qui est inclus dans les offres&nbsp;?<\/summary>\r\n        <div class=\"answer\">\r\n          <ul>\r\n            <li>Design personnalis\u00e9 et responsive<\/li>\r\n            <li>Int\u00e9gration WordPress + pages configur\u00e9es<\/li>\r\n            <li>SEO technique de base et optimisation des images<\/li>\r\n            <li>Formation 1h \u00e0 la prise en main (offre Essentiel)<\/li>\r\n          <\/ul>\r\n          <p>Tout est livr\u00e9 <strong>cl\u00e9 en main<\/strong>, pr\u00eat \u00e0 \u00eatre utilis\u00e9.<\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n      <details>\r\n        <summary>Proposes-tu le paiement en plusieurs fois&nbsp;?<\/summary>\r\n        <div class=\"answer\">\r\n          <p>Oui, je propose le <strong>3\u00d7 sans frais<\/strong>. Le <strong>6\u00d7<\/strong> est possible <em>sur demande<\/em> selon le projet. Les modalit\u00e9s exactes sont pr\u00e9cis\u00e9es dans le devis et l\u2019accord.<\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n      <details>\r\n        <summary>Ce qui n\u2019est pas inclus par d\u00e9faut<\/summary>\r\n        <div class=\"answer\">\r\n          <p>R\u00e9daction de contenus, photos\/vid\u00e9os, h\u00e9bergement et nom de domaine, textes l\u00e9gaux (RGPD). Je peux t\u2019orienter vers des partenaires si besoin.<\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n      <details>\r\n        <summary>Y a-t-il une maintenance apr\u00e8s la mise en ligne&nbsp;?<\/summary>\r\n        <div class=\"answer\">\r\n          <p>Oui, je propose une <strong>maintenance<\/strong> (mises \u00e0 jour, sauvegardes, petites \u00e9volutions). Tu peux aussi rester en autonomie, avec un <strong>guide d\u2019utilisation<\/strong> fourni.<\/p>\r\n        <\/div>\r\n      <\/details>\r\n\r\n      <details>\r\n        <summary>Comment se d\u00e9roule le projet, \u00e9tape par \u00e9tape&nbsp;?<\/summary>\r\n        <div class=\"answer\">\r\n          <p>Brief & objectifs \u2192 conception & maquettes \u2192 int\u00e9gration \u2192 tests \u2192 mise en ligne \u2192 suivi. Voir la section <a href=\"#process\" style=\"color:#ff4d6d\">\u201c\u00c9tapes\u201d<\/a> pour le d\u00e9tail.<\/p>\r\n        <\/div>\r\n      <\/details>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- JSON-LD FAQPage (SEO) -->\r\n<script type=\"application\/ld+json\">\r\n{\r\n  \"@context\": \"https:\/\/schema.org\",\r\n  \"@type\": \"FAQPage\",\r\n  \"mainEntity\": [\r\n    {\r\n      \"@type\": \"Question\",\r\n      \"name\": \"Quels sont les d\u00e9lais pour cr\u00e9er un site ?\",\r\n      \"acceptedAnswer\": {\r\n        \"@type\": \"Answer\",\r\n        \"text\": \"Un site vitrine Starter prend 2 \u00e0 3 semaines. L\u2019offre Essentiel (jusqu\u2019\u00e0 6 pages) n\u00e9cessite 3 \u00e0 5 semaines. Les boutiques e-commerce varient selon le catalogue (souvent 4 \u00e0 8 semaines).\"\r\n      }\r\n    },\r\n    {\r\n      \"@type\": \"Question\",\r\n      \"name\": \"Qu\u2019est-ce qui est inclus dans les offres ?\",\r\n      \"acceptedAnswer\": {\r\n        \"@type\": \"Answer\",\r\n        \"text\": \"Design personnalis\u00e9 et responsive, int\u00e9gration WordPress, SEO technique de base, optimisation des images et formation 1h (offre Essentiel).\"\r\n      }\r\n    },\r\n    {\r\n      \"@type\": \"Question\",\r\n      \"name\": \"Proposes-tu le paiement en plusieurs fois ?\",\r\n      \"acceptedAnswer\": {\r\n        \"@type\": \"Answer\",\r\n        \"text\": \"Oui, 3\u00d7 sans frais. Le 6\u00d7 est possible sur demande selon le projet. Les modalit\u00e9s exactes sont pr\u00e9cis\u00e9es dans le devis.\"\r\n      }\r\n    },\r\n    {\r\n      \"@type\": \"Question\",\r\n      \"name\": \"Ce qui n\u2019est pas inclus par d\u00e9faut\",\r\n      \"acceptedAnswer\": {\r\n        \"@type\": \"Answer\",\r\n        \"text\": \"R\u00e9daction de contenus, photos\/vid\u00e9os, h\u00e9bergement et nom de domaine, textes l\u00e9gaux. Des partenaires peuvent \u00eatre propos\u00e9s.\"\r\n      }\r\n    },\r\n    {\r\n      \"@type\": \"Question\",\r\n      \"name\": \"Y a-t-il une maintenance apr\u00e8s la mise en ligne ?\",\r\n      \"acceptedAnswer\": {\r\n        \"@type\": \"Answer\",\r\n        \"text\": \"Oui, une maintenance (mises \u00e0 jour, sauvegardes, petites \u00e9volutions) est propos\u00e9e. Un guide d\u2019utilisation est fourni pour rester autonome.\"\r\n      }\r\n    },\r\n    {\r\n      \"@type\": \"Question\",\r\n      \"name\": \"Comment se d\u00e9roule le projet, \u00e9tape par \u00e9tape ?\",\r\n      \"acceptedAnswer\": {\r\n        \"@type\": \"Answer\",\r\n        \"text\": \"Brief & objectifs \u2192 conception & maquettes \u2192 int\u00e9gration \u2192 tests \u2192 mise en ligne \u2192 suivi.\"\r\n      }\r\n    }\r\n  ]\r\n}\r\n<\/script>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Je t&rsquo;accompagne dans la r\u00e9ussite de ton projet Je m\u2019appelle Sa\u00efda, fondatrice de SO Web Concept, une micro-entreprise sp\u00e9cialis\u00e9e dans la cr\u00e9ation de sites web sur mesure pour les ind\u00e9pendants, entrepreneurs et petites entreprises. Passionn\u00e9e par le digital et le design, j\u2019ai \u00e0 c\u0153ur d\u2019aider chaque client \u00e0 donner vie \u00e0 son projet \u00e0 travers [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-556","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/refonte.sowebconcept.com\/index.php\/wp-json\/wp\/v2\/pages\/556","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/refonte.sowebconcept.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/refonte.sowebconcept.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/refonte.sowebconcept.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/refonte.sowebconcept.com\/index.php\/wp-json\/wp\/v2\/comments?post=556"}],"version-history":[{"count":211,"href":"https:\/\/refonte.sowebconcept.com\/index.php\/wp-json\/wp\/v2\/pages\/556\/revisions"}],"predecessor-version":[{"id":829,"href":"https:\/\/refonte.sowebconcept.com\/index.php\/wp-json\/wp\/v2\/pages\/556\/revisions\/829"}],"wp:attachment":[{"href":"https:\/\/refonte.sowebconcept.com\/index.php\/wp-json\/wp\/v2\/media?parent=556"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}