{"id":9,"date":"2026-08-11T16:42:23","date_gmt":"2026-08-11T14:42:23","guid":{"rendered":"https:\/\/demo.jouglet-web.fr\/peintre\/?page_id=9"},"modified":"2026-09-16T14:24:57","modified_gmt":"2026-09-16T12:24:57","slug":"accueil","status":"publish","type":"page","link":"https:\/\/demo.jouglet-web.fr\/peintre\/","title":{"rendered":"Accueil"},"content":{"rendered":"\n<div class=\"wp-block-group alignfull is-layout-flow wp-block-group-is-layout-flow\">\n<!--\nMAISON CHROMATIQUE \u2014 ACCUEIL \/ VERSION WORDPRESS + BLOCKSY\n\u00c0 coller dans UN SEUL bloc Gutenberg \u00ab HTML personnalis\u00e9 \u00bb.\nAucun menu, header ou footer n'est inclus.\nLe contenu reste visible m\u00eame si WordPress\/une extension bloque le JavaScript.\n-->\n\n<style>\n\/* =========================================================\n   VARIABLES + ISOLATION BLOCKSY\n   ========================================================= *\/\n#mc-home {\n  --mc-bg: #f5f1e9;\n  --mc-bg-soft: #ebe4d9;\n  --mc-card: #fffdf8;\n  --mc-ink: #1c211e;\n  --mc-text: #59605b;\n  --mc-accent: #b55d3a;\n  --mc-accent-dark: #91462e;\n  --mc-sage: #55675c;\n  --mc-line: rgba(28, 33, 30, .13);\n  --mc-radius: 28px;\n  --mc-radius-sm: 18px;\n  --mc-shadow: 0 22px 60px rgba(28, 33, 30, .10);\n  --mc-max: 1180px;\n  --mc-serif: Georgia, \"Times New Roman\", serif;\n  --mc-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Arial, sans-serif;\n\n  position: relative !important;\n  display: block !important;\n  visibility: visible !important;\n  opacity: 1 !important;\n  width: 100vw !important;\n  max-width: 100vw !important;\n  left: 50% !important;\n  margin-left: -50vw !important;\n  margin-right: -50vw !important;\n  overflow: hidden !important;\n  background: var(--mc-bg) !important;\n  color: var(--mc-ink) !important;\n  font-family: var(--mc-sans) !important;\n  line-height: 1.55 !important;\n}\n\n#mc-home,\n#mc-home *,\n#mc-home *::before,\n#mc-home *::after { box-sizing: border-box !important; }\n\n#mc-home section,\n#mc-home div,\n#mc-home article,\n#mc-home aside,\n#mc-home figure { min-width: 0; }\n\n#mc-home img {\n  display: block !important;\n  width: 100%;\n  max-width: 100% !important;\n  height: auto;\n  border: 0 !important;\n  box-shadow: none;\n}\n\n#mc-home a {\n  color: inherit;\n  text-decoration: none !important;\n}\n\n#mc-home p,\n#mc-home h1,\n#mc-home h2,\n#mc-home h3,\n#mc-home blockquote,\n#mc-home figure { margin-top: 0; }\n\n#mc-home :focus-visible {\n  outline: 3px solid rgba(181, 93, 58, .42) !important;\n  outline-offset: 4px;\n}\n\n#mc-home .mc-wrap {\n  width: min(calc(100% - 40px), var(--mc-max)) !important;\n  max-width: var(--mc-max) !important;\n  margin: 0 auto !important;\n}\n\n#mc-home .mc-section { padding: 92px 0; position: relative; }\n#mc-home .mc-section--tight { padding: 66px 0; }\n\n#mc-home .mc-kicker {\n  display: inline-flex;\n  align-items: center;\n  gap: 9px;\n  color: var(--mc-accent) !important;\n  font-size: 12px !important;\n  font-weight: 800 !important;\n  letter-spacing: .13em;\n  line-height: 1.2;\n  text-transform: uppercase;\n}\n\n#mc-home .mc-kicker::before {\n  content: \"\";\n  display: block;\n  width: 28px;\n  height: 1px;\n  background: currentColor;\n}\n\n#mc-home .mc-title {\n  color: var(--mc-ink) !important;\n  font-family: var(--mc-serif) !important;\n  font-size: clamp(2.35rem, 5vw, 4.85rem) !important;\n  font-weight: 500 !important;\n  letter-spacing: -.04em !important;\n  line-height: .98 !important;\n  margin: 10px 0 16px !important;\n  text-transform: none !important;\n}\n\n#mc-home .mc-title--m { font-size: clamp(2.1rem, 4vw, 3.65rem) !important; }\n\n#mc-home .mc-lead {\n  color: var(--mc-text) !important;\n  font-size: clamp(1rem, 1.4vw, 1.12rem) !important;\n  line-height: 1.65 !important;\n  max-width: 650px;\n  margin-bottom: 0 !important;\n}\n\n\/* =========================================================\n   EFFETS PREMIUM AU SCROLL \u2014 PROGRESSIVE ENHANCEMENT\n   Le contenu reste visible si WordPress retire le JavaScript.\n   Sur navigateurs modernes, CSS Scroll-Driven Animations prend le relais.\n   Si le JS V4 est pr\u00e9sent, IntersectionObserver assure le fallback pr\u00e9cis.\n   ========================================================= *\/\n#mc-home .mc-reveal {\n  opacity: 1;\n  visibility: visible;\n  transform: none;\n}\n\n\/* Le JS ajoute .mc-motion-ready uniquement s'il s'ex\u00e9cute r\u00e9ellement. *\/\n#mc-home.mc-motion-ready .mc-reveal,\n#mc-home.mc-motion-ready .mc-scroll-card {\n  opacity: 0;\n  transform: translate3d(0, 28px, 0) scale(.985);\n  transition:\n    opacity .72s cubic-bezier(.2,.72,.2,1),\n    transform .82s cubic-bezier(.2,.72,.2,1),\n    box-shadow .35s ease,\n    border-color .35s ease;\n  transition-delay: var(--mc-delay, 0ms);\n  will-change: transform, opacity;\n}\n#mc-home.mc-motion-ready .mc-reveal[data-mc-reveal=\"left\"] { transform: translate3d(-34px, 0, 0) scale(.99); }\n#mc-home.mc-motion-ready .mc-reveal[data-mc-reveal=\"right\"] { transform: translate3d(34px, 0, 0) scale(.99); }\n#mc-home.mc-motion-ready .mc-reveal[data-mc-reveal=\"scale\"] { transform: scale(.955); }\n#mc-home.mc-motion-ready .mc-reveal.is-visible,\n#mc-home.mc-motion-ready .mc-scroll-card.is-visible {\n  opacity: 1;\n  transform: none;\n}\n\n\/* Fallback SANS JS : Edge\/Chrome\/Safari r\u00e9cents animent au scroll uniquement en CSS. *\/\n@supports (animation-timeline: view()) {\n  #mc-home:not(.mc-motion-ready) .mc-reveal,\n  #mc-home:not(.mc-motion-ready) .mc-scroll-card {\n    animation: mc-view-reveal linear both;\n    animation-timeline: view();\n    animation-range: entry 6% cover 30%;\n  }\n\n  #mc-home:not(.mc-motion-ready) .mc-galleryitem {\n    animation: mc-view-gallery linear both;\n    animation-timeline: view();\n    animation-range: entry 5% cover 34%;\n  }\n\n  #mc-home:not(.mc-motion-ready) .mc-step {\n    animation: mc-view-step linear both;\n    animation-timeline: view();\n    animation-range: entry 10% cover 42%;\n  }\n\n  #mc-home:not(.mc-motion-ready) .mc-step__dot {\n    animation: mc-view-dot linear both;\n    animation-timeline: view();\n    animation-range: entry 18% cover 45%;\n  }\n\n  #mc-home:not(.mc-motion-ready) .mc-process__fill {\n    transform-origin: top;\n    animation: mc-view-track linear both;\n    animation-timeline: view();\n    animation-range: entry 0% exit 100%;\n  }\n}\n\n@keyframes mc-view-reveal {\n  from { opacity: .18; transform: translate3d(0, 28px, 0) scale(.985); }\n  to { opacity: 1; transform: none; }\n}\n@keyframes mc-view-gallery {\n  from { opacity: .22; clip-path: inset(10% 8% 10% 8% round 22px); transform: scale(.965); }\n  to { opacity: 1; clip-path: inset(0 round 22px); transform: scale(1); }\n}\n@keyframes mc-view-step {\n  from { opacity: .35; transform: translate3d(20px,0,0); }\n  to { opacity: 1; transform: none; }\n}\n@keyframes mc-view-dot {\n  0%, 25% { background: var(--mc-bg); color: var(--mc-text); border-color: var(--mc-line); transform: scale(.9); }\n  65%, 100% { background: var(--mc-accent); color: #fff; border-color: var(--mc-accent); transform: scale(1.05); }\n}\n@keyframes mc-view-track {\n  from { transform: scaleY(0); }\n  to { transform: scaleY(1); }\n}\n\n\/* =========================================================\n   BOUTONS\n   ========================================================= *\/\n#mc-home .mc-btn {\n  display: inline-flex !important;\n  align-items: center !important;\n  justify-content: center !important;\n  gap: 9px;\n  min-height: 52px;\n  padding: 15px 22px !important;\n  border: 1px solid transparent !important;\n  border-radius: 999px !important;\n  font-family: var(--mc-sans) !important;\n  font-size: 15px !important;\n  font-weight: 800 !important;\n  line-height: 1 !important;\n  letter-spacing: 0 !important;\n  text-transform: none !important;\n  box-shadow: none !important;\n  cursor: pointer;\n  transition: transform .2s ease, background-color .2s ease, border-color .2s ease !important;\n}\n\n#mc-home .mc-btn:hover { transform: translateY(-2px); }\n#mc-home .mc-btn--accent { background: var(--mc-accent) !important; color: #fff !important; border-color: var(--mc-accent) !important; }\n#mc-home .mc-btn--accent:hover { background: var(--mc-accent-dark) !important; border-color: var(--mc-accent-dark) !important; }\n#mc-home .mc-btn--dark { background: var(--mc-ink) !important; color: #fff !important; border-color: var(--mc-ink) !important; }\n#mc-home .mc-btn--lightline { background: rgba(18, 22, 19, .28) !important; color: #fff !important; border-color: rgba(255, 255, 255, .68) !important; }\n#mc-home .mc-btn--lightline:hover { background: rgba(255, 255, 255, .10) !important; border-color: #fff !important; }\n\n\/* =========================================================\n   HERO\n   ========================================================= *\/\n#mc-home .mc-hero {\n  position: relative !important;\n  display: grid !important;\n  align-items: end !important;\n  min-height: 670px !important;\n  overflow: hidden !important;\n  isolation: isolate;\n  background: #20251f !important;\n  color: #fff !important;\n}\n\n#mc-home .mc-hero__media {\n  position: absolute !important;\n  inset: 0 !important;\n  z-index: -3;\n  background: linear-gradient(135deg, #35413a, #1e2521) !important;\n}\n\n#mc-home .mc-hero__media img {\n  position: absolute !important;\n  inset: 0 !important;\n  width: 100% !important;\n  height: 100% !important;\n  object-fit: cover !important;\n  object-position: center 54% !important;\n}\n\n#mc-home .mc-hero__overlay {\n  position: absolute;\n  inset: 0;\n  z-index: -2;\n  background: linear-gradient(90deg, rgba(12,15,13,.92) 0%, rgba(12,15,13,.76) 37%, rgba(12,15,13,.34) 70%, rgba(12,15,13,.16) 100%);\n}\n\n#mc-home .mc-hero__inner {\n  display: grid !important;\n  grid-template-columns: minmax(0, 760px) minmax(250px, 1fr) !important;\n  gap: 54px;\n  align-items: end;\n  padding: 72px 0 48px !important;\n}\n\n#mc-home .mc-hero__eyebrow {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  color: #edd8cc !important;\n  font-size: 12px !important;\n  font-weight: 800 !important;\n  letter-spacing: .14em;\n  line-height: 1.3;\n  text-transform: uppercase;\n  margin-bottom: 18px;\n}\n\n#mc-home .mc-hero__eyebrow::before { content: \"\"; width: 34px; height: 1px; background: currentColor; }\n\n#mc-home .mc-hero h1 {\n  color: #fff !important;\n  font-family: var(--mc-serif) !important;\n  font-size: clamp(3.6rem, 7vw, 6.65rem) !important;\n  font-weight: 500 !important;\n  letter-spacing: -.05em !important;\n  line-height: .9 !important;\n  max-width: 860px !important;\n  margin: 0 0 24px !important;\n  text-transform: none !important;\n}\n\n#mc-home .mc-hero h1 em { color: #efd2c1 !important; font-weight: 500; }\n\n#mc-home .mc-hero__copy {\n  color: rgba(255,255,255,.84) !important;\n  font-size: clamp(1rem, 1.55vw, 1.18rem) !important;\n  line-height: 1.55 !important;\n  max-width: 670px;\n  margin: 0 0 28px !important;\n}\n\n#mc-home .mc-hero__actions { display: flex; flex-wrap: wrap; gap: 11px; }\n\n#mc-home .mc-hero__proof {\n  width: min(100%, 315px);\n  justify-self: end;\n  padding: 20px 22px;\n  border: 1px solid rgba(255,255,255,.20);\n  border-radius: 24px;\n  background: rgba(26, 31, 27, .52);\n  box-shadow: 0 20px 55px rgba(0,0,0,.18);\n}\n\n#mc-home .mc-proofrow {\n  display: grid;\n  grid-template-columns: 40px 1fr;\n  gap: 12px;\n  align-items: center;\n  padding: 11px 0;\n  border-bottom: 1px solid rgba(255,255,255,.14);\n}\n#mc-home .mc-proofrow:last-child { border-bottom: 0; }\n#mc-home .mc-prooficon {\n  display: grid;\n  place-items: center;\n  width: 40px;\n  height: 40px;\n  border-radius: 50%;\n  background: rgba(255,255,255,.10);\n  color: #efd2c1;\n  font-size: 17px;\n  font-weight: 900;\n}\n#mc-home .mc-proofrow strong { display: block; color: #fff !important; font-size: 14px !important; line-height: 1.25; }\n#mc-home .mc-proofrow small { display: block; color: rgba(255,255,255,.62) !important; font-size: 12px !important; line-height: 1.35; margin-top: 3px; }\n\n\/* =========================================================\n   PREUVE VISUELLE\n   ========================================================= *\/\n#mc-home .mc-proofvisual { background: var(--mc-bg) !important; }\n#mc-home .mc-proofvisual__grid { display: grid; grid-template-columns: 1.12fr .88fr; gap: 24px; }\n#mc-home .mc-photo-card,\n#mc-home .mc-mini-photo { position: relative; overflow: hidden; background: #d7d1c7; }\n#mc-home .mc-photo-card { min-height: 500px; border-radius: var(--mc-radius); box-shadow: var(--mc-shadow); }\n#mc-home .mc-mini-photo { min-height: 255px; border-radius: var(--mc-radius); }\n#mc-home .mc-photo-card img,\n#mc-home .mc-mini-photo img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }\n#mc-home .mc-photo-card__label {\n  position: absolute;\n  left: 20px;\n  bottom: 20px;\n  z-index: 2;\n  max-width: 300px;\n  padding: 15px 17px;\n  border-radius: 16px;\n  background: rgba(255,253,248,.94);\n  box-shadow: 0 12px 35px rgba(0,0,0,.10);\n}\n#mc-home .mc-photo-card__label strong { display: block; color: var(--mc-ink) !important; font-family: var(--mc-serif); font-size: 1.35rem !important; font-weight: 500; line-height: 1.05; }\n#mc-home .mc-photo-card__label span { display: block; color: var(--mc-text) !important; font-size: 12px !important; margin-top: 6px; }\n#mc-home .mc-proofvisual__aside { display: grid; grid-template-rows: auto 1fr; gap: 24px; }\n#mc-home .mc-note { min-height: 220px; padding: 32px; border-radius: var(--mc-radius); background: var(--mc-ink) !important; color: #fff !important; }\n#mc-home .mc-note p { color: #fff !important; font-family: var(--mc-serif); font-size: clamp(1.7rem, 3vw, 2.45rem) !important; line-height: 1.04 !important; margin-bottom: 24px !important; }\n#mc-home .mc-note small { color: rgba(255,255,255,.60) !important; }\n\n\/* =========================================================\n   SERVICES\n   ========================================================= *\/\n#mc-home .mc-services__head { display: flex; justify-content: space-between; align-items: end; gap: 34px; margin-bottom: 34px; }\n#mc-home .mc-services__head .mc-lead { max-width: 480px; }\n#mc-home .mc-servicegrid { display: grid; grid-template-columns: 1.25fr .75fr .75fr; grid-template-rows: repeat(2, 230px); gap: 14px; }\n#mc-home .mc-service {\n  position: relative;\n  display: flex !important;\n  flex-direction: column;\n  justify-content: space-between;\n  overflow: hidden;\n  isolation: isolate;\n  padding: 24px;\n  border: 1px solid var(--mc-line) !important;\n  border-radius: 24px;\n  background: var(--mc-card) !important;\n  color: var(--mc-ink) !important;\n}\n#mc-home .mc-service--feature { grid-row: 1 \/ 3; padding: 30px; color: #fff !important; background: #303b35 !important; }\n#mc-home .mc-service--feature img { position: absolute !important; inset: 0 !important; z-index: -2; width: 100% !important; height: 100% !important; object-fit: cover !important; }\n#mc-home .mc-service--feature::after { content: \"\"; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(16,19,17,.88), rgba(16,19,17,.12) 72%); }\n#mc-home .mc-service__num { color: var(--mc-accent) !important; font-size: 12px !important; font-weight: 850 !important; }\n#mc-home .mc-service--feature .mc-service__num { color: #efd2c1 !important; }\n#mc-home .mc-service h3 { color: inherit !important; font-family: var(--mc-serif) !important; font-size: clamp(1.5rem, 2.3vw, 2.25rem) !important; font-weight: 500 !important; line-height: 1 !important; margin: 7px 0 8px !important; }\n#mc-home .mc-service p { color: var(--mc-text) !important; font-size: 14px !important; line-height: 1.5 !important; margin-bottom: 0 !important; }\n#mc-home .mc-service--feature p { color: rgba(255,255,255,.76) !important; }\n#mc-home .mc-service__arrow { align-self: flex-end; display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--mc-line); border-radius: 50%; font-size: 18px; }\n#mc-home .mc-service--feature .mc-service__arrow { border-color: rgba(255,255,255,.34); }\n\n\/* =========================================================\n   METHODE\n   ========================================================= *\/\n#mc-home .mc-craft { background: var(--mc-ink) !important; color: #fff !important; }\n#mc-home .mc-craft__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; }\n#mc-home .mc-craft__image { position: relative; min-height: 560px; overflow: hidden; border-radius: 30px; background: #39423d; }\n#mc-home .mc-craft__image img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }\n#mc-home .mc-craft .mc-title { color: #fff !important; }\n#mc-home .mc-craft .mc-kicker { color: #efd2c1 !important; }\n#mc-home .mc-craft .mc-lead { color: rgba(255,255,255,.68) !important; }\n#mc-home .mc-principles { margin-top: 30px; }\n#mc-home .mc-principle { display: grid; grid-template-columns: 48px 1fr; gap: 16px; padding: 17px 0; border-top: 1px solid rgba(255,255,255,.13); }\n#mc-home .mc-principle:last-child { border-bottom: 1px solid rgba(255,255,255,.13); }\n#mc-home .mc-principle b { color: #efd2c1 !important; font-family: var(--mc-serif); font-size: 1.35rem; font-weight: 500; }\n#mc-home .mc-principle strong { display: block; color: #fff !important; font-size: 15px !important; margin-bottom: 3px; }\n#mc-home .mc-principle p { color: rgba(255,255,255,.60) !important; font-size: 13px !important; margin-bottom: 0 !important; }\n\n\/* =========================================================\n   PROCESSUS \/ TIMELINE ACTIVE AU SCROLL\n   ========================================================= *\/\n#mc-home .mc-process__layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: 72px; align-items: start; }\n#mc-home .mc-process__intro { position: sticky; top: 28px; }\n#mc-home .mc-process { position: relative; padding-left: 78px; --mc-progress: 0; }\n#mc-home .mc-process__track {\n  position: absolute; left: 21px; top: 40px; bottom: 52px; width: 2px;\n  background: rgba(28,33,30,.11); overflow: hidden; border-radius: 999px;\n}\n#mc-home .mc-process__fill {\n  position: absolute; inset: 0 0 auto; width: 100%; height: 100%;\n  background: linear-gradient(to bottom, var(--mc-accent), #d19070);\n  transform: scaleY(var(--mc-progress)); transform-origin: top;\n  transition: transform .12s linear; will-change: transform;\n}\n#mc-home .mc-step {\n  position: relative; min-height: 132px; padding: 18px 18px 30px 0;\n  opacity: .46; transform: translate3d(12px,0,0);\n  transition: opacity .42s ease, transform .48s cubic-bezier(.2,.72,.2,1), background-color .35s ease, border-color .35s ease;\n  border-radius: 18px;\n}\n#mc-home .mc-step__dot {\n  position: absolute; left: -78px; top: 14px; z-index: 3;\n  display: grid; place-items: center; width: 44px; height: 44px;\n  border: 1px solid var(--mc-line); border-radius: 50%;\n  background: var(--mc-bg); color: var(--mc-text);\n  font-size: 12px; font-weight: 850; line-height: 1;\n  box-shadow: 0 0 0 7px var(--mc-bg);\n  transition: background-color .32s ease, color .32s ease, border-color .32s ease, transform .42s cubic-bezier(.2,.72,.2,1), box-shadow .32s ease;\n}\n#mc-home .mc-step.is-past { opacity: .72; transform: none; }\n#mc-home .mc-step.is-past .mc-step__dot { background: var(--mc-accent); color: #fff; border-color: var(--mc-accent); transform: scale(.96); }\n#mc-home .mc-step.is-current {\n  opacity: 1; transform: translate3d(8px,0,0);\n  padding-left: 18px;\n  background: linear-gradient(90deg, rgba(181,93,58,.105), rgba(181,93,58,0));\n}\n#mc-home .mc-step.is-current .mc-step__dot {\n  background: var(--mc-accent); color: #fff; border-color: var(--mc-accent);\n  transform: scale(1.12);\n  box-shadow: 0 0 0 7px var(--mc-bg), 0 10px 26px rgba(181,93,58,.28);\n}\n#mc-home .mc-step h3 { color: var(--mc-ink) !important; font-family: var(--mc-serif) !important; font-size: 2rem !important; font-weight: 500 !important; line-height: 1 !important; margin: 0 0 7px !important; transition: color .3s ease, transform .3s ease; }\n#mc-home .mc-step.is-current h3 { color: var(--mc-accent-dark) !important; transform: translateX(3px); }\n#mc-home .mc-step p { color: var(--mc-text) !important; font-size: 14px !important; margin-bottom: 0 !important; max-width: 54ch; transition: color .3s ease; }\n#mc-home .mc-step.is-current p { color: #3f4742 !important; }\n\n\/* =========================================================\n   REALISATIONS\n   ========================================================= *\/\n#mc-home .mc-gallery__head { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 30px; }\n#mc-home .mc-gallerygrid { display: grid; grid-template-columns: 1.1fr .9fr .9fr; grid-template-rows: 285px 285px; gap: 12px; }\n#mc-home .mc-galleryitem { position: relative; overflow: hidden; border-radius: 22px; background: #d9d2c7; margin: 0 !important; }\n#mc-home .mc-galleryitem:first-child { grid-row: 1 \/ 3; }\n#mc-home .mc-galleryitem:nth-child(4) { grid-column: 2 \/ 4; }\n#mc-home .mc-galleryitem img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; transition: transform .45s ease; }\n#mc-home .mc-galleryitem:hover img { transform: scale(1.025); }\n#mc-home .mc-galleryitem::after { content: \"\"; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgba(15,18,16,.70)); }\n#mc-home .mc-galleryitem span { position: absolute; left: 14px; bottom: 14px; z-index: 2; padding: 7px 10px; border-radius: 999px; background: rgba(255,255,255,.92); color: var(--mc-ink) !important; font-size: 12px !important; font-weight: 750 !important; }\n\n\/* =========================================================\n   AVANT APRES\n   ========================================================= *\/\n#mc-home .mc-beforeafter__grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 58px; align-items: center; }\n#mc-home .mc-ba { --pos: 52%; position: relative; overflow: hidden; aspect-ratio: 4 \/ 3; border-radius: 28px; background: #d6d0c6; box-shadow: var(--mc-shadow); }\n#mc-home .mc-ba > img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }\n#mc-home .mc-ba__after { clip-path: inset(0 0 0 var(--pos)); }\n#mc-home .mc-ba__line { position: absolute; top: 0; bottom: 0; left: var(--pos); width: 2px; background: #fff; transform: translateX(-1px); pointer-events: none; }\n#mc-home .mc-ba__handle { position: absolute; top: 50%; left: var(--pos); transform: translate(-50%,-50%); display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: #fff; color: var(--mc-ink); font-size: 17px; font-weight: 850; box-shadow: 0 8px 28px rgba(0,0,0,.18); pointer-events: none; }\n#mc-home .mc-ba__range { position: absolute !important; inset: 0 !important; z-index: 5; width: 100% !important; height: 100% !important; opacity: 0 !important; cursor: ew-resize; }\n#mc-home .mc-ba__tag { position: absolute; top: 14px; z-index: 3; padding: 7px 10px; border-radius: 999px; background: rgba(255,255,255,.92); color: var(--mc-ink) !important; font-size: 11px !important; font-weight: 800 !important; }\n#mc-home .mc-ba__tag--before { left: 14px; }\n#mc-home .mc-ba__tag--after { right: 14px; }\n#mc-home .mc-checklist { display: grid; gap: 11px; margin: 26px 0 28px; }\n#mc-home .mc-check { display: grid; grid-template-columns: 34px 1fr; gap: 12px; }\n#mc-home .mc-check i { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(181,93,58,.11); color: var(--mc-accent); font-style: normal; font-weight: 900; }\n#mc-home .mc-check strong { display: block; color: var(--mc-ink) !important; font-size: 14px !important; }\n#mc-home .mc-check p { color: var(--mc-text) !important; font-size: 13px !important; margin: 2px 0 0 !important; }\n\n\/* =========================================================\n   AVIS + ZONE\n   ========================================================= *\/\n#mc-home .mc-trustgrid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 18px; }\n#mc-home .mc-testimonials { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }\n#mc-home .mc-quote { padding: 28px; border-radius: 24px; background: var(--mc-card); border: 1px solid var(--mc-line); }\n#mc-home .mc-stars { color: var(--mc-accent) !important; letter-spacing: 3px; font-size: 14px !important; }\n#mc-home .mc-quote blockquote { color: var(--mc-ink) !important; font-family: var(--mc-serif); font-size: 1.45rem !important; line-height: 1.14 !important; margin: 18px 0 22px !important; }\n#mc-home .mc-quote cite { color: var(--mc-text) !important; font-size: 12px !important; font-style: normal; }\n#mc-home .mc-zone { padding: 30px; border-radius: 24px; background: var(--mc-sage) !important; color: #fff !important; }\n#mc-home .mc-zone h3 { color: #fff !important; font-family: var(--mc-serif) !important; font-size: 2.4rem !important; font-weight: 500 !important; line-height: 1 !important; margin: 0 0 14px !important; }\n#mc-home .mc-zone p { color: rgba(255,255,255,.72) !important; font-size: 14px !important; }\n#mc-home .mc-zone__chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 20px; }\n#mc-home .mc-zone__chips span { padding: 7px 10px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; color: #fff !important; font-size: 11px !important; }\n\n\/* =========================================================\n   FAQ\n   ========================================================= *\/\n#mc-home .mc-faq__grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 68px; }\n#mc-home .mc-faqdetails details { border-top: 1px solid var(--mc-line); }\n#mc-home .mc-faqdetails details:last-child { border-bottom: 1px solid var(--mc-line); }\n#mc-home .mc-faqdetails summary { position: relative; list-style: none; cursor: pointer; padding: 21px 45px 21px 0; color: var(--mc-ink) !important; font-size: 15px !important; font-weight: 800 !important; }\n#mc-home .mc-faqdetails summary::-webkit-details-marker { display: none; }\n#mc-home .mc-faqdetails summary::after { content: \"+\"; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); color: var(--mc-accent); font-size: 26px; font-weight: 400; }\n#mc-home .mc-faqdetails details[open] summary::after { content: \"\u2212\"; }\n#mc-home .mc-faqdetails p { color: var(--mc-text) !important; font-size: 14px !important; margin: -6px 40px 20px 0 !important; }\n\n\/* =========================================================\n   CTA FINAL\n   ========================================================= *\/\n#mc-home .mc-final { padding: 0 0 34px; }\n#mc-home .mc-final__box { position: relative; display: grid; align-items: end; min-height: 440px; overflow: hidden; padding: 50px; border-radius: 32px; isolation: isolate; background: #26302a; color: #fff !important; }\n#mc-home .mc-final__box > img { position: absolute !important; inset: 0 !important; z-index: -2; width: 100% !important; height: 100% !important; object-fit: cover !important; }\n#mc-home .mc-final__box::after { content: \"\"; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(17,20,18,.92), rgba(17,20,18,.42) 72%, rgba(17,20,18,.18)); }\n#mc-home .mc-final__content { max-width: 760px; }\n#mc-home .mc-final .mc-title { color: #fff !important; }\n#mc-home .mc-final p { color: rgba(255,255,255,.74) !important; max-width: 580px; }\n#mc-home .mc-final__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }\n\n\/* =========================================================\n   RESPONSIVE\n   ========================================================= *\/\n@media (max-width: 980px) {\n  #mc-home .mc-section { padding: 76px 0; }\n  #mc-home .mc-hero { min-height: 640px !important; }\n  #mc-home .mc-hero__inner { grid-template-columns: 1fr !important; gap: 22px; padding: 58px 0 28px !important; }\n  #mc-home .mc-hero__proof { justify-self: start; width: 100%; display: grid; grid-template-columns: repeat(3,1fr); padding: 10px 14px; }\n  #mc-home .mc-proofrow { grid-template-columns: 34px 1fr; border-bottom: 0; border-right: 1px solid rgba(255,255,255,.14); padding: 8px 11px; }\n  #mc-home .mc-proofrow:last-child { border-right: 0; }\n  #mc-home .mc-prooficon { width: 34px; height: 34px; }\n  #mc-home .mc-proofvisual__grid,\n  #mc-home .mc-craft__grid,\n  #mc-home .mc-process__layout,\n  #mc-home .mc-beforeafter__grid,\n  #mc-home .mc-faq__grid { grid-template-columns: 1fr; gap: 34px; }\n  #mc-home .mc-proofvisual__aside { grid-template-columns: 1fr 1fr; grid-template-rows: none; }\n  #mc-home .mc-servicegrid { grid-template-columns: 1fr 1fr; grid-template-rows: 320px repeat(2, 185px); }\n  #mc-home .mc-service--feature { grid-column: 1 \/ 3; grid-row: auto; }\n  #mc-home .mc-craft__image { min-height: 450px; }\n  #mc-home .mc-process__intro { position: static; }\n  #mc-home .mc-gallerygrid { grid-template-columns: 1fr 1fr; grid-template-rows: 330px 220px 220px; }\n  #mc-home .mc-galleryitem:first-child { grid-column: 1 \/ 3; grid-row: auto; }\n  #mc-home .mc-galleryitem:nth-child(4) { grid-column: 1 \/ 3; }\n  #mc-home .mc-trustgrid { grid-template-columns: 1fr; }\n}\n\n@media (max-width: 640px) {\n  #mc-home .mc-wrap { width: min(calc(100% - 24px), var(--mc-max)) !important; }\n  #mc-home .mc-section { padding: 52px 0; }\n  #mc-home .mc-section--tight { padding: 42px 0; }\n  #mc-home .mc-title { font-size: clamp(2.15rem, 11vw, 3.4rem) !important; }\n  #mc-home .mc-title--m { font-size: clamp(2rem, 10vw, 2.9rem) !important; }\n  #mc-home .mc-lead { font-size: .95rem !important; }\n\n  #mc-home .mc-hero { min-height: 610px !important; }\n  #mc-home .mc-hero__overlay { background: linear-gradient(to top, rgba(12,15,13,.96) 0%, rgba(12,15,13,.76) 61%, rgba(12,15,13,.25) 100%); }\n  #mc-home .mc-hero__media img { object-position: 63% center !important; }\n  #mc-home .mc-hero__inner { padding: 34px 0 20px !important; gap: 18px; }\n  #mc-home .mc-hero h1 { font-size: clamp(3rem, 14.5vw, 4.35rem) !important; max-width: 9ch !important; margin-bottom: 18px !important; }\n  #mc-home .mc-hero__copy { font-size: .94rem !important; margin-bottom: 19px !important; }\n  #mc-home .mc-btn { min-height: 45px; padding: 13px 16px !important; font-size: 13px !important; }\n  #mc-home .mc-hero__proof { grid-template-columns: repeat(3,1fr); padding: 6px 4px; border-radius: 18px; }\n  #mc-home .mc-proofrow { display: block; text-align: center; padding: 8px 5px; }\n  #mc-home .mc-prooficon, #mc-home .mc-proofrow small { display: none; }\n  #mc-home .mc-proofrow strong { font-size: 11px !important; }\n\n  #mc-home .mc-proofvisual__grid { gap: 12px; }\n  #mc-home .mc-photo-card { min-height: 340px; border-radius: 21px; }\n  #mc-home .mc-proofvisual__aside { grid-template-columns: 1fr 1fr; gap: 12px; }\n  #mc-home .mc-note { min-height: 170px; padding: 18px; border-radius: 20px; }\n  #mc-home .mc-note p { font-size: 1.35rem !important; }\n  #mc-home .mc-mini-photo { min-height: 170px; border-radius: 20px; }\n\n  #mc-home .mc-services__head, #mc-home .mc-gallery__head { display: block; margin-bottom: 22px; }\n  #mc-home .mc-services__head .mc-lead, #mc-home .mc-gallery__head .mc-lead { margin-top: 10px !important; }\n  #mc-home .mc-servicegrid { grid-template-columns: 1fr 1fr; grid-template-rows: 270px repeat(2, 160px); gap: 10px; }\n  #mc-home .mc-service--feature { grid-column: 1 \/ 3; padding: 20px; }\n  #mc-home .mc-service { padding: 17px; border-radius: 18px; }\n  #mc-home .mc-service h3 { font-size: 1.4rem !important; }\n  #mc-home .mc-service p { display: none; }\n  #mc-home .mc-service__arrow { width: 34px; height: 34px; }\n\n  #mc-home .mc-craft__grid { gap: 25px; }\n  #mc-home .mc-craft__image { min-height: 330px; border-radius: 21px; }\n  #mc-home .mc-principle { padding: 13px 0; }\n\n  #mc-home .mc-process { padding-left: 44px; }\n  #mc-home .mc-process__track { left: 13px; top: 22px; bottom: 22px; }\n  #mc-home .mc-step { min-height: 0; padding: 14px 0 17px; }\n  #mc-home .mc-step::before { left: -44px; top: 13px; width: 28px; height: 28px; }\n  #mc-home .mc-step h3 { font-size: 1.5rem !important; }\n  #mc-home .mc-step p { font-size: .82rem !important; }\n\n  #mc-home .mc-gallerygrid { grid-template-columns: 1.1fr .9fr; grid-template-rows: 245px 165px; gap: 9px; }\n  #mc-home .mc-galleryitem:first-child { grid-column: auto; grid-row: 1 \/ 3; }\n  #mc-home .mc-galleryitem:nth-child(2) { grid-column: 2; grid-row: 1; }\n  #mc-home .mc-galleryitem:nth-child(3) { grid-column: 2; grid-row: 2; }\n  #mc-home .mc-galleryitem:nth-child(4) { display: none; }\n\n  #mc-home .mc-ba { border-radius: 20px; }\n  #mc-home .mc-checklist { margin: 18px 0 22px; gap: 8px; }\n  #mc-home .mc-check p { display: none; }\n\n  #mc-home .mc-testimonials { grid-template-columns: 1fr 1fr; gap: 9px; }\n  #mc-home .mc-quote { padding: 18px; border-radius: 18px; }\n  #mc-home .mc-quote blockquote { font-size: 1.08rem !important; margin: 12px 0 14px !important; }\n  #mc-home .mc-zone { padding: 22px; border-radius: 20px; }\n  #mc-home .mc-zone h3 { font-size: 2rem !important; }\n\n  #mc-home .mc-faqdetails summary { padding: 18px 34px 18px 0; font-size: 13px !important; }\n  #mc-home .mc-faqdetails p { font-size: 12px !important; margin-right: 18px !important; }\n\n  #mc-home .mc-final { padding-bottom: 18px; }\n  #mc-home .mc-final__box { min-height: 390px; padding: 28px 22px; border-radius: 23px; }\n  #mc-home .mc-final__box::after { background: linear-gradient(to top, rgba(17,20,18,.94), rgba(17,20,18,.42)); }\n}\n\n@media (max-width: 360px) {\n  #mc-home .mc-wrap { width: min(calc(100% - 18px), var(--mc-max)) !important; }\n  #mc-home .mc-hero h1 { font-size: 2.8rem !important; }\n  #mc-home .mc-btn { font-size: 12px !important; padding: 12px 13px !important; }\n  #mc-home .mc-servicegrid { grid-template-rows: 250px repeat(2, 150px); }\n  #mc-home .mc-service h3 { font-size: 1.25rem !important; }\n  #mc-home .mc-testimonials { grid-template-columns: 1fr; }\n  #mc-home .mc-quote:nth-child(2) { display: none; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  #mc-home *, #mc-home *::before, #mc-home *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }\n}\n<\/style>\n\n<div id=\"mc-home\">\n\n  <!-- HERO -->\n  <section class=\"mc-hero\" aria-labelledby=\"mc-hero-title\">\n    <div class=\"mc-hero__media\" aria-hidden=\"true\">\n      <img src=\"https:\/\/images.unsplash.com\/photo-1618221195710-dd6b41faaea6?auto=format&amp;fit=crop&amp;w=1800&amp;q=82\"\n           width=\"1800\" height=\"1200\"\n           alt=\"\"\n           fetchpriority=\"high\" decoding=\"async\">\n    <\/div>\n    <div class=\"mc-hero__overlay\" aria-hidden=\"true\"><\/div>\n\n    <div class=\"mc-wrap mc-hero__inner\">\n      <div>\n        <div class=\"mc-hero__eyebrow\">Peinture \u2022 d\u00e9coration \u2022 r\u00e9novation<\/div>\n        <h1 id=\"mc-hero-title\">Des finitions qui <em>changent<\/em> votre int\u00e9rieur.<\/h1>\n        <p class=\"mc-hero__copy\">Peinture int\u00e9rieure et ext\u00e9rieure, r\u00e9novation, pl\u00e2trerie et rev\u00eatements. Une pr\u00e9paration rigoureuse, un chantier propre et un r\u00e9sultat durable.<\/p>\n        <div class=\"mc-hero__actions\">\n          <a class=\"mc-btn mc-btn--accent\" href=\"\/peintre\/contact\/\">Demander un devis <span aria-hidden=\"true\">\u2192<\/span><\/a>\n          <a class=\"mc-btn mc-btn--lightline\" href=\"#realisations\">Voir les r\u00e9alisations<\/a>\n        <\/div>\n      <\/div>\n\n      <div class=\"mc-hero__proof\" aria-label=\"Points de confiance\">\n        <div class=\"mc-proofrow\"><span class=\"mc-prooficon\" aria-hidden=\"true\">\u2713<\/span><div><strong>Devis gratuit<\/strong><small>Clair et d\u00e9taill\u00e9<\/small><\/div><\/div>\n        <div class=\"mc-proofrow\"><span class=\"mc-prooficon\" aria-hidden=\"true\">\u2726<\/span><div><strong>Finitions soign\u00e9es<\/strong><small>Du support au dernier d\u00e9tail<\/small><\/div><\/div>\n        <div class=\"mc-proofrow\"><span class=\"mc-prooficon\" aria-hidden=\"true\">\u2197<\/span><div><strong>Int\u00e9rieur &#038; ext\u00e9rieur<\/strong><small>Un interlocuteur unique<\/small><\/div><\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- PREUVE VISUELLE -->\n  <section class=\"mc-section mc-section--tight mc-proofvisual\" aria-label=\"Preuve visuelle\">\n    <div class=\"mc-wrap mc-proofvisual__grid\">\n      <article class=\"mc-photo-card mc-reveal\" data-mc-reveal=\"left\">\n        <img src=\"https:\/\/images.unsplash.com\/photo-1600607687939-ce8a6c25118c?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" width=\"1200\" height=\"900\" loading=\"lazy\" decoding=\"async\" alt=\"Salon r\u00e9nov\u00e9 avec murs clairs et finition mate\">\n        <div class=\"mc-photo-card__label\"><strong>La qualit\u00e9 se voit avant m\u00eame d&rsquo;\u00eatre expliqu\u00e9e.<\/strong><span>Pr\u00e9paration nette \u2022 teinte juste \u2022 finition r\u00e9guli\u00e8re<\/span><\/div>\n      <\/article>\n      <div class=\"mc-proofvisual__aside\">\n        <article class=\"mc-note mc-reveal\" data-mc-reveal=\"right\"><p>\u00ab Un beau r\u00e9sultat commence bien avant la premi\u00e8re couche. \u00bb<\/p><small>Maison Chromatique \u2014 exigence de pr\u00e9paration<\/small><\/article>\n        <div class=\"mc-mini-photo mc-reveal\" data-mc-reveal=\"right\"><img src=\"https:\/\/images.unsplash.com\/photo-1562259949-e8e7689d7828?auto=format&amp;fit=crop&amp;w=900&amp;q=78\" width=\"900\" height=\"700\" loading=\"lazy\" decoding=\"async\" alt=\"Application de peinture par un professionnel\"><\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SERVICES -->\n  <section class=\"mc-section\" id=\"services\" aria-labelledby=\"mc-services-title\">\n    <div class=\"mc-wrap\">\n      <div class=\"mc-services__head mc-reveal\">\n        <div><span class=\"mc-kicker\">Nos savoir-faire<\/span><h2 class=\"mc-title mc-title--m\" id=\"mc-services-title\">Un seul niveau d&rsquo;exigence,<br>six fa\u00e7ons de transformer.<\/h2><\/div>\n        <p class=\"mc-lead\">Du rafra\u00eechissement d&rsquo;une pi\u00e8ce \u00e0 une r\u00e9novation compl\u00e8te, chaque intervention est pens\u00e9e pour \u00eatre propre, lisible et durable.<\/p>\n      <\/div>\n\n      <div class=\"mc-servicegrid\">\n        <a class=\"mc-service mc-service--feature mc-reveal\" href=\"\/peintre\/peinture-interieure\/\" style=\"--mc-delay:0ms\">\n          <img src=\"https:\/\/images.unsplash.com\/photo-1600210492486-724fe5c67fb0?auto=format&amp;fit=crop&amp;w=1200&amp;q=80\" width=\"1200\" height=\"1000\" loading=\"lazy\" decoding=\"async\" alt=\"Int\u00e9rieur contemporain peint dans des tons chaleureux\">\n          <span class=\"mc-service__num\">01 \u2014 Int\u00e9rieur<\/span>\n          <div><h3>Peinture int\u00e9rieure<\/h3><p>Couleurs, finitions et mati\u00e8res choisies pour r\u00e9v\u00e9ler chaque pi\u00e8ce.<\/p><\/div>\n          <span class=\"mc-service__arrow\" aria-hidden=\"true\">\u2197<\/span>\n        <\/a>\n        <a class=\"mc-service mc-reveal\" href=\"\/peintre\/peinture-exterieure\/\" style=\"--mc-delay:90ms\"><span class=\"mc-service__num\">02<\/span><div><h3>Peinture ext\u00e9rieure<\/h3><p>Fa\u00e7ades, boiseries et supports expos\u00e9s, pr\u00e9par\u00e9s pour durer.<\/p><\/div><span class=\"mc-service__arrow\">\u2197<\/span><\/a>\n        <a class=\"mc-service mc-reveal\" href=\"\/peintre\/renovation\/\" style=\"--mc-delay:180ms\"><span class=\"mc-service__num\">03<\/span><div><h3>R\u00e9novation<\/h3><p>Remise en \u00e9tat, modernisation et finitions coordonn\u00e9es.<\/p><\/div><span class=\"mc-service__arrow\">\u2197<\/span><\/a>\n        <a class=\"mc-service mc-reveal\" href=\"\/peintre\/platrerie\/\" style=\"--mc-delay:270ms\"><span class=\"mc-service__num\">04<\/span><div><h3>Pl\u00e2trerie<\/h3><p>Murs lisses, r\u00e9parations et pr\u00e9paration pr\u00e9cise des supports.<\/p><\/div><span class=\"mc-service__arrow\">\u2197<\/span><\/a>\n        <a class=\"mc-service mc-reveal\" href=\"\/peintre\/revetements\/\" style=\"--mc-delay:360ms\"><span class=\"mc-service__num\">05 \/ 06<\/span><div><h3>Rev\u00eatements<\/h3><p>Murs et sols : textures, d\u00e9cors et solutions adapt\u00e9es \u00e0 l&rsquo;usage.<\/p><\/div><span class=\"mc-service__arrow\">\u2197<\/span><\/a>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- METHODE -->\n  <section class=\"mc-section mc-craft\" aria-labelledby=\"mc-craft-title\">\n    <div class=\"mc-wrap mc-craft__grid\">\n      <div class=\"mc-craft__image mc-reveal\" data-mc-reveal=\"scale\"><img src=\"https:\/\/images.unsplash.com\/photo-1589939705384-5185137a7f0f?auto=format&amp;fit=crop&amp;w=1000&amp;q=80\" width=\"1000\" height=\"1200\" loading=\"lazy\" decoding=\"async\" alt=\"Travail minutieux de pr\u00e9paration avant peinture\"><\/div>\n      <div class=\"mc-reveal\">\n        <span class=\"mc-kicker\">Ce qui fait la diff\u00e9rence<\/span>\n        <h2 class=\"mc-title mc-title--m\" id=\"mc-craft-title\">Le beau r\u00e9sultat commence avant la couleur.<\/h2>\n        <p class=\"mc-lead\">La peinture ne corrige pas un support mal pr\u00e9par\u00e9. Notre m\u00e9thode commence par les protections, les reprises et la pr\u00e9paration avant de parler finition.<\/p>\n        <div class=\"mc-principles\">\n          <div class=\"mc-principle mc-scroll-card\"><b>01<\/b><div><strong>Prot\u00e9ger<\/strong><p>Sol, mobilier, menuiseries et zones de passage sont s\u00e9curis\u00e9s avant le chantier.<\/p><\/div><\/div>\n          <div class=\"mc-principle mc-scroll-card\"><b>02<\/b><div><strong>Pr\u00e9parer<\/strong><p>Nettoyage, pon\u00e7age, enduit et primaire adapt\u00e9s \u00e0 l&rsquo;\u00e9tat du support.<\/p><\/div><\/div>\n          <div class=\"mc-principle mc-scroll-card\"><b>03<\/b><div><strong>Finir<\/strong><p>Application r\u00e9guli\u00e8re, contr\u00f4le des d\u00e9tails et nettoyage avant r\u00e9ception.<\/p><\/div><\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- TIMELINE -->\n  <section class=\"mc-section\" aria-labelledby=\"mc-process-title\">\n    <div class=\"mc-wrap mc-process__layout\">\n      <div class=\"mc-process__intro mc-reveal\">\n        <span class=\"mc-kicker\">Votre projet<\/span>\n        <h2 class=\"mc-title mc-title--m\" id=\"mc-process-title\">Simple \u00e0 suivre, du premier \u00e9change \u00e0 la derni\u00e8re finition.<\/h2>\n        <p class=\"mc-lead\">Une organisation claire \u00e9vite les surprises : chaque \u00e9tape a son objectif avant la suivante.<\/p>\n      <\/div>\n\n      <div class=\"mc-process\" data-mc-process>\n        <div class=\"mc-process__track\" aria-hidden=\"true\"><div class=\"mc-process__fill\"><\/div><\/div>\n        <article class=\"mc-step\"><span class=\"mc-step__dot\" aria-hidden=\"true\">01<\/span><h3>\u00c9change<\/h3><p>Votre projet, vos attentes, les pi\u00e8ces concern\u00e9es et le niveau de finition recherch\u00e9.<\/p><\/article>\n        <article class=\"mc-step\"><span class=\"mc-step__dot\" aria-hidden=\"true\">02<\/span><h3>Visite<\/h3><p>Analyse des supports, contraintes, m\u00e9tr\u00e9s et choix des solutions adapt\u00e9es.<\/p><\/article>\n        <article class=\"mc-step\"><span class=\"mc-step__dot\" aria-hidden=\"true\">03<\/span><h3>Pr\u00e9paration<\/h3><p>Protection du chantier, reprises, pon\u00e7age et traitement des supports.<\/p><\/article>\n        <article class=\"mc-step\"><span class=\"mc-step__dot\" aria-hidden=\"true\">04<\/span><h3>Application<\/h3><p>Sous-couche si n\u00e9cessaire, peinture et respect des temps de s\u00e9chage.<\/p><\/article>\n        <article class=\"mc-step\"><span class=\"mc-step__dot\" aria-hidden=\"true\">05<\/span><h3>Finitions<\/h3><p>Contr\u00f4le des raccords, angles, d\u00e9tails et retouches finales.<\/p><\/article>\n        <article class=\"mc-step\"><span class=\"mc-step__dot\" aria-hidden=\"true\">06<\/span><h3>R\u00e9ception<\/h3><p>Nettoyage et validation du r\u00e9sultat avec le client.<\/p><\/article>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- REALISATIONS -->\n  <section class=\"mc-section mc-section--tight\" id=\"realisations\" aria-labelledby=\"mc-gallery-title\">\n    <div class=\"mc-wrap\">\n      <div class=\"mc-gallery__head mc-reveal\">\n        <div><span class=\"mc-kicker\">R\u00e9alisations<\/span><h2 class=\"mc-title mc-title--m\" id=\"mc-gallery-title\">Des ambiances diff\u00e9rentes. La m\u00eame exigence.<\/h2><\/div>\n        <p class=\"mc-lead\">Une s\u00e9lection visuelle de d\u00e9monstration qui sera remplac\u00e9e par les vraies r\u00e9alisations du futur client.<\/p>\n      <\/div>\n      <div class=\"mc-gallerygrid\">\n        <figure class=\"mc-galleryitem mc-scroll-card\"><img src=\"https:\/\/images.unsplash.com\/photo-1600585154340-be6161a56a0c?auto=format&amp;fit=crop&amp;w=1000&amp;q=80\" width=\"1000\" height=\"1200\" loading=\"lazy\" decoding=\"async\" alt=\"S\u00e9jour r\u00e9nov\u00e9 aux tons neutres\"><span>R\u00e9novation compl\u00e8te<\/span><\/figure>\n        <figure class=\"mc-galleryitem mc-scroll-card\"><img src=\"https:\/\/images.unsplash.com\/photo-1616486338812-3dadae4b4ace?auto=format&amp;fit=crop&amp;w=800&amp;q=78\" width=\"800\" height=\"700\" loading=\"lazy\" decoding=\"async\" alt=\"Mur d\u00e9coratif dans une chambre\"><span>D\u00e9coration int\u00e9rieure<\/span><\/figure>\n        <figure class=\"mc-galleryitem mc-scroll-card\"><img src=\"https:\/\/images.unsplash.com\/photo-1600566753086-00f18fb6b3ea?auto=format&amp;fit=crop&amp;w=800&amp;q=78\" width=\"800\" height=\"700\" loading=\"lazy\" decoding=\"async\" alt=\"Salon lumineux r\u00e9nov\u00e9\"><span>Peinture mate<\/span><\/figure>\n        <figure class=\"mc-galleryitem mc-scroll-card\"><img src=\"https:\/\/images.unsplash.com\/photo-1600566753190-17f0baa2a6c3?auto=format&amp;fit=crop&amp;w=1000&amp;q=78\" width=\"1000\" height=\"700\" loading=\"lazy\" decoding=\"async\" alt=\"Int\u00e9rieur contemporain apr\u00e8s r\u00e9novation\"><span>Finitions &#038; volumes<\/span><\/figure>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- AVANT \/ APRES -->\n  <section class=\"mc-section\" aria-labelledby=\"mc-ba-title\">\n    <div class=\"mc-wrap mc-beforeafter__grid\">\n      <div class=\"mc-ba\" data-mc-ba>\n        <img src=\"https:\/\/images.unsplash.com\/photo-1584622650111-993a426fbf0a?auto=format&amp;fit=crop&amp;w=1100&amp;q=80\" width=\"1100\" height=\"760\" loading=\"lazy\" decoding=\"async\" alt=\"Pi\u00e8ce avant r\u00e9novation\">\n        <img class=\"mc-ba__after\" src=\"https:\/\/images.unsplash.com\/photo-1600210492486-724fe5c67fb0?auto=format&amp;fit=crop&amp;w=1100&amp;q=80\" width=\"1100\" height=\"760\" loading=\"lazy\" decoding=\"async\" alt=\"Pi\u00e8ce apr\u00e8s r\u00e9novation\">\n        <span class=\"mc-ba__tag mc-ba__tag--before\">Avant<\/span><span class=\"mc-ba__tag mc-ba__tag--after\">Apr\u00e8s<\/span>\n        <span class=\"mc-ba__line\" aria-hidden=\"true\"><\/span><span class=\"mc-ba__handle\" aria-hidden=\"true\">\u2194<\/span>\n        <input class=\"mc-ba__range\" type=\"range\" min=\"0\" max=\"100\" value=\"52\" aria-label=\"Comparer l'avant et l'apr\u00e8s\">\n      <\/div>\n      <div>\n        <span class=\"mc-kicker\">Avant \/ apr\u00e8s<\/span>\n        <h2 class=\"mc-title mc-title--m\" id=\"mc-ba-title\">On ne masque pas un support. On le transforme.<\/h2>\n        <p class=\"mc-lead\">Le vrai changement vient souvent de la pr\u00e9paration : reprises, correction des d\u00e9fauts et choix de finition avant la couleur.<\/p>\n        <div class=\"mc-checklist\">\n          <div class=\"mc-check mc-scroll-card\"><i>\u2713<\/i><div><strong>Diagnostic du support<\/strong><p>Identifier les d\u00e9fauts avant qu&rsquo;ils ne r\u00e9apparaissent sous la peinture.<\/p><\/div><\/div>\n          <div class=\"mc-check mc-scroll-card\"><i>\u2713<\/i><div><strong>Pr\u00e9paration adapt\u00e9e<\/strong><p>Pon\u00e7age, enduit, primaire ou sous-couche selon l&rsquo;\u00e9tat r\u00e9el.<\/p><\/div><\/div>\n          <div class=\"mc-check mc-scroll-card\"><i>\u2713<\/i><div><strong>Finition choisie pour l&rsquo;usage<\/strong><p>Mate, velours ou satin\u00e9e selon la pi\u00e8ce, la lumi\u00e8re et l&rsquo;entretien.<\/p><\/div><\/div>\n        <\/div>\n        <a class=\"mc-btn mc-btn--dark\" href=\"\/peintre\/contact\/\">Parler de mon projet<\/a>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- AVIS + ZONE -->\n  <section class=\"mc-section mc-section--tight\" aria-labelledby=\"mc-trust-title\">\n    <div class=\"mc-wrap\">\n      <div style=\"margin-bottom:26px\"><span class=\"mc-kicker\">Confiance<\/span><h2 class=\"mc-title mc-title--m\" id=\"mc-trust-title\">Un chantier propre. Un r\u00e9sultat qui tient.<\/h2><\/div>\n      <div class=\"mc-trustgrid\">\n        <div class=\"mc-testimonials\">\n          <article class=\"mc-quote mc-scroll-card\"><div class=\"mc-stars\" aria-label=\"5 \u00e9toiles\">\u2605\u2605\u2605\u2605\u2605<\/div><blockquote>\u00ab Travail tr\u00e8s propre, conseils utiles et finitions vraiment nettes. \u00bb<\/blockquote><cite>Camille R. \u2014 avis de d\u00e9monstration<\/cite><\/article>\n          <article class=\"mc-quote mc-scroll-card\"><div class=\"mc-stars\" aria-label=\"5 \u00e9toiles\">\u2605\u2605\u2605\u2605\u2605<\/div><blockquote>\u00ab Le chantier a \u00e9t\u00e9 organis\u00e9 simplement, sans mauvaise surprise. \u00bb<\/blockquote><cite>Thomas M. \u2014 avis de d\u00e9monstration<\/cite><\/article>\n        <\/div>\n        <aside class=\"mc-zone mc-scroll-card\"><h3>Nous intervenons pr\u00e8s de chez vous.<\/h3><p>Zone fictive pour cette d\u00e9monstration. Elle sera remplac\u00e9e par les villes r\u00e9elles du futur client et optimis\u00e9e pour le r\u00e9f\u00e9rencement local.<\/p><div class=\"mc-zone__chips\"><span>Centre-ville<\/span><span>Nord<\/span><span>Sud<\/span><span>Est<\/span><span>Ouest<\/span><span>+ 30 km<\/span><\/div><\/aside>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- FAQ -->\n  <section class=\"mc-section\" aria-labelledby=\"mc-faq-title\">\n    <div class=\"mc-wrap mc-faq__grid\">\n      <div><span class=\"mc-kicker\">FAQ<\/span><h2 class=\"mc-title mc-title--m\" id=\"mc-faq-title\">Les questions qu&rsquo;on nous pose avant de commencer.<\/h2><p class=\"mc-lead\">Des r\u00e9ponses courtes pour savoir rapidement comment votre projet peut se d\u00e9rouler.<\/p><\/div>\n      <div class=\"mc-faqdetails\">\n        <details class=\"mc-scroll-card\"><summary>Le devis est-il gratuit ?<\/summary><p>Oui. Le devis de d\u00e9monstration pr\u00e9voit une premi\u00e8re estimation puis, si n\u00e9cessaire, une visite pour confirmer les travaux et les supports.<\/p><\/details>\n        <details class=\"mc-scroll-card\"><summary>Combien de temps dure un chantier ?<\/summary><p>La dur\u00e9e d\u00e9pend de la surface, de l&rsquo;\u00e9tat des supports et des temps de s\u00e9chage. Le planning est pr\u00e9cis\u00e9 avant le d\u00e9marrage.<\/p><\/details>\n        <details class=\"mc-scroll-card\"><summary>Faut-il vider compl\u00e8tement la pi\u00e8ce ?<\/summary><p>Pas toujours. Les petits meubles et objets fragiles doivent \u00eatre retir\u00e9s ; le reste peut \u00eatre regroup\u00e9 et prot\u00e9g\u00e9 selon la configuration.<\/p><\/details>\n        <details class=\"mc-scroll-card\"><summary>Intervenez-vous pour les petits travaux ?<\/summary><p>Oui, selon le type d&rsquo;intervention et la zone. Une demande rapide permet de v\u00e9rifier la faisabilit\u00e9.<\/p><\/details>\n        <details class=\"mc-scroll-card\"><summary>Travaillez-vous aussi en ext\u00e9rieur ?<\/summary><p>Oui : fa\u00e7ades, boiseries, murs et autres supports compatibles, avec une pr\u00e9paration adapt\u00e9e \u00e0 l&rsquo;exposition et au mat\u00e9riau.<\/p><\/details>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- CTA FINAL -->\n  <section class=\"mc-final\" aria-labelledby=\"mc-final-title\">\n    <div class=\"mc-wrap mc-final__box\">\n      <img src=\"https:\/\/images.unsplash.com\/photo-1600585152915-d208bec867a1?auto=format&amp;fit=crop&amp;w=1600&amp;q=80\" width=\"1600\" height=\"900\" loading=\"lazy\" decoding=\"async\" alt=\"Int\u00e9rieur r\u00e9nov\u00e9 avec ambiance chaleureuse\">\n      <div class=\"mc-final__content\">\n        <span class=\"mc-kicker\" style=\"color:#efd2c1!important\">Votre projet m\u00e9rite mieux qu&rsquo;un simple coup de peinture<\/span>\n        <h2 class=\"mc-title\" id=\"mc-final-title\">Parlons du r\u00e9sultat que vous voulez vraiment.<\/h2>\n        <p>Expliquez-nous la pi\u00e8ce, la surface ou le chantier. Nous vous r\u00e9pondons avec une premi\u00e8re orientation claire et un devis adapt\u00e9.<\/p>\n        <div class=\"mc-final__actions\"><a class=\"mc-btn mc-btn--accent\" href=\"\/peintre\/contact\/\">Demander un devis<\/a><a class=\"mc-btn mc-btn--lightline\" href=\"tel:+33184000000\">01 84 00 00 00<\/a><\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n<\/div>\n\n<script>\n\/* MAISON CHROMATIQUE V4 \u2014 effets premium au scroll.\n   IMPORTANT WORDPRESS MULTISITE : si WordPress retire ce <script> du bloc HTML,\n   copiez le contenu du fichier JS V4 dans WPCode > JavaScript Snippet > Footer. *\/\n(function () {\n  'use strict';\n\n  function boot() {\n    var root = document.getElementById('mc-home');\n    if (!root || root.dataset.mcBooted === '1') return;\n    root.dataset.mcBooted = '1';\n\n    var reduceMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    if (!reduceMotion) root.classList.add('mc-motion-ready');\n\n    \/* 1) Apparitions premium : cartes, images, t\u00e9moignages, FAQ\u2026 *\/\n    var items = root.querySelectorAll('.mc-reveal, .mc-scroll-card');\n    if (!reduceMotion && 'IntersectionObserver' in window) {\n      var observer = new IntersectionObserver(function (entries, obs) {\n        entries.forEach(function (entry) {\n          if (entry.isIntersecting) {\n            entry.target.classList.add('is-visible');\n            obs.unobserve(entry.target);\n          }\n        });\n      }, { root: null, threshold: 0.12, rootMargin: '0px 0px -7% 0px' });\n\n      items.forEach(function (el, i) {\n        if (!el.style.getPropertyValue('--mc-delay')) {\n          el.style.setProperty('--mc-delay', ((i % 4) * 70) + 'ms');\n        }\n        observer.observe(el);\n      });\n    } else {\n      items.forEach(function (el) { el.classList.add('is-visible'); });\n    }\n\n    \/* 2) Timeline : ligne qui se remplit + \u00e9tape courante clairement active. *\/\n    var process = root.querySelector('[data-mc-process]');\n    var steps = process ? Array.prototype.slice.call(process.querySelectorAll('.mc-step')) : [];\n    var raf = 0;\n\n    function clamp(n, min, max) { return Math.max(min, Math.min(max, n)); }\n\n    function updateProcess() {\n      raf = 0;\n      if (!process || !steps.length) return;\n\n      var rect = process.getBoundingClientRect();\n      var anchor = window.innerHeight * (window.innerWidth <= 700 ? 0.58 : 0.52);\n      var centers = steps.map(function (step) {\n        var r = step.getBoundingClientRect();\n        return r.top + Math.min(36, r.height * .28);\n      });\n\n      var first = centers[0];\n      var last = centers[centers.length - 1];\n      var progress = clamp((anchor - first) \/ Math.max(1, last - first), 0, 1);\n      process.style.setProperty('--mc-progress', progress.toFixed(4));\n\n      var current = -1;\n      for (var i = 0; i < centers.length; i++) {\n        if (centers[i] <= anchor) current = i;\n      }\n      if (rect.top > anchor) current = -1;\n      if (rect.bottom < anchor) current = steps.length - 1;\n\n      steps.forEach(function (step, i) {\n        step.classList.toggle('is-past', current >= 0 && i < current);\n        step.classList.toggle('is-current', i === current);\n      });\n    }\n\n    function scheduleProcess() {\n      if (!raf) raf = window.requestAnimationFrame(updateProcess);\n    }\n\n    if (process) {\n      updateProcess();\n      window.addEventListener('scroll', scheduleProcess, { passive: true });\n      window.addEventListener('resize', scheduleProcess, { passive: true });\n    }\n\n    \/* 3) Avant \/ apr\u00e8s *\/\n    root.querySelectorAll('[data-mc-ba]').forEach(function (component) {\n      var range = component.querySelector('.mc-ba__range');\n      if (!range) return;\n      function updateBA() { component.style.setProperty('--pos', range.value + '%'); }\n      range.addEventListener('input', updateBA, { passive: true });\n      updateBA();\n    });\n\n    \/* 4) Micro-parallaxe tr\u00e8s l\u00e9g\u00e8re sur 2 grandes images, transform uniquement. *\/\n    if (!reduceMotion) {\n      var parallax = Array.prototype.slice.call(root.querySelectorAll('.mc-craft__image img, .mc-final__box > img'));\n      var paraRaf = 0;\n      function updateParallax() {\n        paraRaf = 0;\n        parallax.forEach(function (img) {\n          var r = img.parentElement.getBoundingClientRect();\n          if (r.bottom < 0 || r.top > window.innerHeight) return;\n          var center = r.top + r.height \/ 2 - window.innerHeight \/ 2;\n          var y = clamp(-center * .025, -12, 12);\n          img.style.transform = 'scale(1.035) translate3d(0,' + y.toFixed(2) + 'px,0)';\n        });\n      }\n      function schedulePara() { if (!paraRaf) paraRaf = requestAnimationFrame(updateParallax); }\n      updateParallax();\n      window.addEventListener('scroll', schedulePara, { passive: true });\n      window.addEventListener('resize', schedulePara, { passive: true });\n    }\n  }\n\n  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', boot, { once: true });\n  else boot();\n})();\n<\/script>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Peinture \u2022 d\u00e9coration \u2022 r\u00e9novation Des finitions qui changent votre int\u00e9rieur. Peinture int\u00e9rieure et ext\u00e9rieure, r\u00e9novation, pl\u00e2trerie et rev\u00eatements. Une pr\u00e9paration rigoureuse, un chantier propre et un r\u00e9sultat durable. Demander un devis \u2192 Voir les r\u00e9alisations \u2713 Devis gratuitClair et d\u00e9taill\u00e9 \u2726 Finitions soign\u00e9esDu support au dernier d\u00e9tail \u2197 Int\u00e9rieur &#038; ext\u00e9rieurUn interlocuteur unique La [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-9","page","type-page","status-publish","hentry"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":7}},"_links":{"self":[{"href":"https:\/\/demo.jouglet-web.fr\/peintre\/wp-json\/wp\/v2\/pages\/9","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/demo.jouglet-web.fr\/peintre\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/demo.jouglet-web.fr\/peintre\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/demo.jouglet-web.fr\/peintre\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/demo.jouglet-web.fr\/peintre\/wp-json\/wp\/v2\/comments?post=9"}],"version-history":[{"count":9,"href":"https:\/\/demo.jouglet-web.fr\/peintre\/wp-json\/wp\/v2\/pages\/9\/revisions"}],"predecessor-version":[{"id":94,"href":"https:\/\/demo.jouglet-web.fr\/peintre\/wp-json\/wp\/v2\/pages\/9\/revisions\/94"}],"wp:attachment":[{"href":"https:\/\/demo.jouglet-web.fr\/peintre\/wp-json\/wp\/v2\/media?parent=9"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}