{"id":2304,"date":"2026-09-28T16:04:28","date_gmt":"2026-09-28T16:04:28","guid":{"rendered":"https:\/\/agencewebrusek.com\/?page_id=2304"},"modified":"2026-09-28T16:16:10","modified_gmt":"2026-09-28T16:16:10","slug":"creation-site-internet-architecte","status":"publish","type":"page","link":"https:\/\/agencewebrusek.com\/en\/creation-site-internet-architecte\/","title":{"rendered":"Architect"},"content":{"rendered":"\n<!-- =========================================================\nAWR \u2014 PAGE M\u00c9TIER ARCHITECTE \u2014 V1 (fichier complet)\nURL : \/creation-site-internet-architecte\/\nHTML + CSS + JS + JSON-LD dans un seul bloc HTML personnalis\u00e9\nForminator ID : 1637\n========================================================= -->\n\n<style>\n\n\/* ==========================================================\n   VARIABLES \/ BASE\n========================================================== *\/\n\n.awr-m-page {\n  --awr-bg:#06163a;\n  --awr-bg-dark:#020a20;\n  --awr-bg-alt:#071940;\n  --awr-bg-light:#081c4b;\n  --awr-blue:#3b82f6;\n  --awr-blue-hover:#4b8df8;\n  --awr-accent:#60a5fa;\n  --awr-pale:#a9c8ff;\n  --awr-text:#ffffff;\n  --awr-muted:rgba(255,255,255,.74);\n  --awr-discreet:rgba(255,255,255,.60);\n  --awr-line:rgba(255,255,255,.10);\n  --awr-border:rgba(96,165,250,.25);\n  --awr-radius:28px;\n\n  position:relative;\n  left:50%;\n  width:100vw !important;\n  max-width:none !important;\n  margin-left:-50vw !important;\n  margin-right:-50vw !important;\n  padding:0 !important;\n  overflow:hidden;\n  background:var(--awr-bg);\n  color:var(--awr-text);\n  font-family:inherit;\n}\n\n.awr-m-page *,\n.awr-m-page *::before,\n.awr-m-page *::after {\n  box-sizing:border-box;\n}\n\n.awr-m-page h1,\n.awr-m-page h2,\n.awr-m-page h3,\n.awr-m-page p,\n.awr-m-page blockquote {\n  margin-top:0;\n}\n\n.awr-m-page a { color:inherit; }\n\n.awr-m-page #devis,\n.awr-m-page #exemples {\n  scroll-margin-top:120px;\n}\n\n\n\/* ==========================================================\n   LAYOUT\n========================================================== *\/\n\n.awr-m-section {\n  position:relative;\n  width:100%;\n  padding:100px 32px;\n  background:var(--awr-bg);\n}\n\n.awr-m-section--alt {\n  background:var(--awr-bg-alt);\n}\n\n.awr-m-grid-bg {\n  background:\n    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),\n    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),\n    var(--awr-bg-alt);\n  background-size:90px 90px,90px 90px,auto;\n}\n\n.awr-m-inner {\n  position:relative;\n  z-index:2;\n  width:100%;\n  max-width:1320px;\n  margin:0 auto;\n}\n\n\n\/* ==========================================================\n   TYPOGRAPHIE\n========================================================== *\/\n\n.awr-m-h1 {\n  max-width:760px;\n  margin:0 0 28px;\n  color:#fff;\n  font-size:clamp(44px,4.5vw,68px);\n  line-height:1;\n  letter-spacing:-.05em;\n  font-weight:900;\n}\n\n.awr-m-h1 span,\n.awr-m-h1 strong {\n  display:block;\n}\n\n.awr-m-h1 strong {\n  color:var(--awr-accent);\n}\n\n.awr-m-h2 {\n  margin:0 0 24px;\n  color:#fff;\n  font-size:clamp(38px,4vw,60px);\n  line-height:1;\n  letter-spacing:-.045em;\n  font-weight:900;\n}\n\n.awr-m-h2 span,\n.awr-m-h2 strong {\n  display:block;\n}\n\n.awr-m-h2 strong {\n  color:var(--awr-accent);\n}\n\n.awr-m-intro {\n  max-width:760px;\n  margin:0;\n  color:var(--awr-muted);\n  font-size:18px;\n  line-height:1.7;\n}\n\n.awr-m-section-head {\n  margin-bottom:58px;\n}\n\n.awr-m-section-head--wide {\n  max-width:930px;\n}\n\n.awr-m-section-head--center {\n  max-width:900px;\n  margin-left:auto;\n  margin-right:auto;\n  text-align:center;\n}\n\n.awr-m-section-head--center .awr-m-intro {\n  margin-left:auto;\n  margin-right:auto;\n}\n\n\n\/* ==========================================================\n   FADE IN\n========================================================== *\/\n\n.awr-m-reveal {\n  opacity:0;\n  transform:translateY(26px);\n  transition:\n    opacity .7s cubic-bezier(.2,.65,.3,1),\n    transform .7s cubic-bezier(.2,.65,.3,1);\n}\n\n.awr-m-reveal.is-visible {\n  opacity:1;\n  transform:translateY(0);\n}\n\n.awr-m-reveal-delay-1 { transition-delay:.08s; }\n.awr-m-reveal-delay-2 { transition-delay:.16s; }\n.awr-m-reveal-delay-3 { transition-delay:.24s; }\n\n\n\/* ==========================================================\n   ANIMATIONS\n========================================================== *\/\n\n@keyframes awrHeroGlow {\n  0%,100% {\n    opacity:.42;\n    transform:scale(1);\n  }\n  50% {\n    opacity:.72;\n    transform:scale(1.08);\n  }\n}\n\n@keyframes awrPulse {\n  0%,100% {\n    box-shadow:\n      0 0 0 0 rgba(59,130,246,.25),\n      0 12px 30px rgba(59,130,246,.22);\n  }\n  50% {\n    box-shadow:\n      0 0 0 9px rgba(59,130,246,0),\n      0 16px 38px rgba(59,130,246,.30);\n  }\n}\n\n\n\/* ==========================================================\n   BOUTONS\n========================================================== *\/\n\n.awr-m-btn {\n  position:relative;\n  display:inline-flex;\n  min-height:58px;\n  gap:12px;\n  padding:0 30px;\n  align-items:center;\n  justify-content:center;\n  overflow:hidden;\n  border:1px solid rgba(255,255,255,.12);\n  border-radius:999px;\n  background:linear-gradient(135deg,#3b82f6,#2563eb);\n  color:#fff !important;\n  font-size:16px;\n  font-weight:850;\n  text-decoration:none !important;\n  box-shadow:0 12px 30px rgba(59,130,246,.22);\n  transition:\n    transform .2s ease,\n    box-shadow .2s ease,\n    background .2s ease;\n}\n\n.awr-m-btn::before {\n  content:\"\";\n  position:absolute;\n  top:-50%;\n  left:-80%;\n  width:55%;\n  height:200%;\n  background:linear-gradient(\n    90deg,\n    transparent,\n    rgba(255,255,255,.20),\n    transparent\n  );\n  transform:rotate(20deg);\n  transition:left .55s ease;\n}\n\n.awr-m-btn::after {\n  content:\"\u2192\";\n  position:relative;\n  font-size:19px;\n  transition:transform .2s ease;\n}\n\n.awr-m-btn:hover {\n  transform:translateY(-3px);\n  box-shadow:0 18px 42px rgba(59,130,246,.34);\n}\n\n.awr-m-btn:hover::before { left:135%; }\n.awr-m-btn:hover::after { transform:translateX(4px); }\n\n.awr-m-btn--pulse {\n  animation:awrPulse 3s ease-in-out infinite;\n}\n\n.awr-m-center {\n  margin-top:42px;\n  text-align:center;\n}\n\n\n\/* ==========================================================\n   ACCESSIBILIT\u00c9\n========================================================== *\/\n\n.awr-m-page a:focus-visible,\n.awr-m-page summary:focus-visible {\n  outline:3px solid var(--awr-accent);\n  outline-offset:5px;\n  border-radius:8px;\n}\n\n\n\/* ==========================================================\n   01 HERO\n========================================================== *\/\n\n.awr-m-hero {\n  min-height:650px;\n  padding-top:90px;\n  padding-bottom:90px;\n  background:\n    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),\n    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),\n    linear-gradient(135deg,var(--awr-bg-dark),var(--awr-bg-light));\n  background-size:90px 90px,90px 90px,auto;\n}\n\n.awr-m-hero::after {\n  content:\"\";\n  position:absolute;\n  top:4%;\n  right:-8%;\n  width:480px;\n  height:480px;\n  pointer-events:none;\n  border-radius:50%;\n  background:radial-gradient(\n    circle,\n    rgba(59,130,246,.17),\n    transparent 67%\n  );\n  animation:awrHeroGlow 7s ease-in-out infinite;\n}\n\n.awr-m-hero__grid {\n  position:relative;\n  z-index:2;\n  display:grid;\n  grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr);\n  gap:clamp(50px,6vw,90px);\n  align-items:stretch;\n}\n\n.awr-m-hero__content {\n  min-width:0;\n  padding-top:0;\n  display:flex;\n  flex-direction:column;\n}\n\n.awr-m-badge {\n  display:inline-flex;\n  align-self:flex-start;\n  width:max-content;\n  max-width:100%;\n  margin-bottom:28px;\n  padding:9px 17px;\n  align-items:center;\n  border:1px solid rgba(96,165,250,.25);\n  border-radius:999px;\n  background:rgba(59,130,246,.08);\n  color:var(--awr-pale);\n  font-size:13px;\n  font-weight:800;\n}\n\n.awr-m-hero__lead {\n  max-width:680px;\n  margin-bottom:24px;\n  color:var(--awr-muted);\n  font-size:clamp(17px,1.5vw,20px);\n  line-height:1.65;\n}\n\n.awr-m-phone-link {\n  display:inline-flex;\n  gap:8px;\n  margin-bottom:24px;\n  align-items:center;\n  color:var(--awr-pale) !important;\n  font-size:15px;\n  text-decoration:none !important;\n  transition:color .2s ease,transform .2s ease;\n}\n\n.awr-m-phone-link:hover {\n  color:#fff !important;\n  transform:translateX(3px);\n}\n\n.awr-m-reassurance {\n  max-width:650px;\n  margin:0;\n  padding-top:22px;\n  border-top:1px solid var(--awr-line);\n  color:var(--awr-discreet);\n  font-size:13px;\n  line-height:1.6;\n}\n\n.awr-m-hero__mockup {\n  width:112%;\n  max-width:840px;\n  margin:auto 0 -4px -6%;\n}\n\n.awr-m-hero__mockup img {\n  display:block;\n  width:100%;\n  height:auto;\n  object-fit:contain;\n  filter:drop-shadow(0 28px 45px rgba(0,0,0,.28));\n  transform:translateZ(0);\n}\n\n.awr-m-depart-intro {\n  max-width:820px;\n  margin:-4px 0 42px;\n  color:var(--awr-muted);\n  font-size:clamp(17px,1.5vw,20px);\n  line-height:1.65;\n  text-align:left;\n}\n\n\n\/* ==========================================================\n   FORM\n========================================================== *\/\n\n.awr-m-form-card {\n  width:100%;\n  padding:clamp(28px,3vw,42px);\n  border:1px solid var(--awr-border);\n  border-radius:var(--awr-radius);\n  background:rgba(2,10,32,.76);\n  box-shadow:0 30px 80px rgba(0,0,0,.25);\n  backdrop-filter:blur(12px);\n  transition:\n    transform .25s ease,\n    border-color .25s ease,\n    box-shadow .25s ease;\n}\n\n.awr-m-form-card:hover {\n  transform:translateY(-3px);\n  border-color:rgba(96,165,250,.45);\n  box-shadow:0 34px 90px rgba(0,0,0,.32);\n}\n\n.awr-m-form-card__head {\n  margin-bottom:28px;\n}\n\n.awr-m-eyebrow {\n  display:block;\n  margin-bottom:10px;\n  color:var(--awr-accent);\n  font-size:12px;\n  font-weight:850;\n  letter-spacing:.12em;\n  text-transform:uppercase;\n}\n\n.awr-m-form-card h2 {\n  margin:0 0 12px;\n  color:#fff;\n  font-size:clamp(28px,2.5vw,38px);\n  line-height:1.05;\n  letter-spacing:-.035em;\n  font-weight:900;\n}\n\n.awr-m-form-card__head p {\n  margin:0;\n  color:var(--awr-muted);\n  font-size:15px;\n  line-height:1.65;\n}\n\n\n\/* ==========================================================\n   02 DEUX SITUATIONS\n========================================================== *\/\n\n.awr-m-depart__grid {\n  display:grid;\n  grid-template-columns:repeat(2,minmax(0,1fr));\n  gap:26px;\n}\n\n.awr-m-card {\n  position:relative;\n  display:flex;\n  min-height:440px;\n  padding:42px;\n  flex-direction:column;\n  overflow:hidden;\n  border:1px solid var(--awr-border);\n  border-radius:var(--awr-radius);\n  background:rgba(2,10,32,.72);\n  box-shadow:0 22px 55px rgba(0,0,0,.10);\n  transition:\n    transform .25s ease,\n    border-color .25s ease,\n    box-shadow .25s ease;\n}\n\n.awr-m-card:hover {\n  transform:translateY(-6px);\n  border-color:rgba(96,165,250,.48);\n  box-shadow:0 24px 60px rgba(0,0,0,.18);\n}\n\n.awr-m-card--featured {\n  border-color:rgba(96,165,250,.46);\n  background:linear-gradient(\n    145deg,\n    rgba(59,130,246,.18),\n    rgba(2,10,32,.82)\n  );\n}\n\n.awr-m-card__number {\n  margin-bottom:44px;\n  color:var(--awr-accent);\n  font-size:14px;\n  font-weight:900;\n}\n\n.awr-m-card h3 {\n  margin:0 0 20px;\n  color:#fff;\n  font-size:clamp(25px,2.4vw,34px);\n  line-height:1.08;\n  letter-spacing:-.03em;\n  font-weight:900;\n}\n\n.awr-m-card p {\n  color:var(--awr-muted);\n  font-size:16px;\n  line-height:1.7;\n}\n\n.awr-m-card__note {\n  margin:10px 0 28px;\n  padding:18px 20px;\n  border-left:2px solid var(--awr-accent);\n  background:rgba(96,165,250,.07);\n  color:var(--awr-muted);\n  font-size:14px;\n  line-height:1.65;\n}\n\n.awr-m-arrow-link {\n  display:inline-flex;\n  gap:9px;\n  margin-top:auto;\n  align-items:center;\n  color:var(--awr-accent) !important;\n  font-weight:850;\n  text-decoration:none !important;\n}\n\n.awr-m-arrow-link span {\n  transition:transform .18s ease;\n}\n\n.awr-m-arrow-link:hover span {\n  transform:translateX(6px);\n}\n\n\n\/* ==========================================================\n   03 CONSTATS\n========================================================== *\/\n\n.awr-m-findings {\n  display:grid;\n  grid-template-columns:repeat(2,minmax(0,1fr));\n  gap:20px;\n  margin-bottom:58px;\n}\n\n.awr-m-finding {\n  display:grid;\n  grid-template-columns:52px 1fr;\n  gap:20px;\n  min-height:200px;\n  padding:30px;\n  border:1px solid rgba(96,165,250,.18);\n  border-radius:22px;\n  background:linear-gradient(\n    145deg,\n    rgba(255,255,255,.045),\n    rgba(255,255,255,.015)\n  );\n  transition:\n    transform .22s ease,\n    border-color .22s ease,\n    background .22s ease,\n    box-shadow .22s ease;\n}\n\n.awr-m-finding:last-child {\n  grid-column:1 \/ -1;\n  max-width:calc(50% - 10px);\n}\n\n.awr-m-finding:hover {\n  transform:translateY(-5px);\n  border-color:rgba(96,165,250,.40);\n  background:linear-gradient(\n    145deg,\n    rgba(59,130,246,.09),\n    rgba(255,255,255,.02)\n  );\n  box-shadow:0 20px 50px rgba(0,0,0,.12);\n}\n\n.awr-m-finding__emoji {\n  display:flex;\n  width:48px;\n  height:48px;\n  align-items:center;\n  justify-content:center;\n  border:1px solid rgba(96,165,250,.18);\n  border-radius:14px;\n  background:rgba(59,130,246,.08);\n  font-size:23px;\n  transition:transform .2s ease,background .2s ease;\n}\n\n.awr-m-finding:hover .awr-m-finding__emoji {\n  transform:translateY(-3px) rotate(-3deg);\n  background:rgba(59,130,246,.15);\n}\n\n.awr-m-finding h3 {\n  margin:3px 0 10px;\n  color:#fff;\n  font-size:21px;\n  line-height:1.2;\n  font-weight:850;\n}\n\n.awr-m-finding p {\n  margin:0;\n  color:var(--awr-muted);\n  font-size:15px;\n  line-height:1.65;\n}\n\n.awr-m-keyquote {\n  max-width:1050px;\n  margin:0;\n  padding:10px 0 10px 30px;\n  border-left:3px solid var(--awr-accent);\n  color:#fff;\n  font-size:clamp(20px,2.1vw,29px);\n  line-height:1.5;\n  font-weight:700;\n}\n\n.awr-m-source {\n  margin:26px 0 0;\n  color:var(--awr-discreet);\n  font-size:12px;\n}\n\n\n\/* ==========================================================\n   04 SITE ID\u00c9AL\n========================================================== *\/\n\n.awr-m-ideal-head {\n  display:grid;\n  grid-template-columns:minmax(0,.9fr) minmax(300px,.65fr);\n  gap:70px;\n  margin-bottom:50px;\n  align-items:end;\n}\n\n.awr-m-ideal-head .awr-m-h2,\n.awr-m-ideal-head .awr-m-intro {\n  margin-bottom:0;\n}\n\n.awr-m-ideal-grid {\n  display:grid;\n  grid-template-columns:repeat(3,minmax(0,1fr));\n  gap:18px;\n}\n\n.awr-m-ideal-card {\n  position:relative;\n  min-height:285px;\n  padding:28px;\n  overflow:hidden;\n  border:1px solid var(--awr-line);\n  border-radius:22px;\n  background:linear-gradient(\n    145deg,\n    rgba(255,255,255,.045),\n    rgba(255,255,255,.015)\n  );\n  transition:\n    transform .25s ease,\n    border-color .25s ease,\n    background .25s ease;\n}\n\n.awr-m-ideal-card::after {\n  content:\"\";\n  position:absolute;\n  right:-50px;\n  bottom:-60px;\n  width:150px;\n  height:150px;\n  border-radius:50%;\n  background:radial-gradient(\n    circle,\n    rgba(59,130,246,.15),\n    transparent 70%\n  );\n  transition:transform .3s ease;\n}\n\n.awr-m-ideal-card:hover {\n  transform:translateY(-6px);\n  border-color:rgba(96,165,250,.40);\n  background:linear-gradient(\n    145deg,\n    rgba(59,130,246,.10),\n    rgba(255,255,255,.02)\n  );\n}\n\n.awr-m-ideal-card:hover::after {\n  transform:scale(1.35);\n}\n\n.awr-m-ideal-top {\n  display:flex;\n  margin-bottom:30px;\n  align-items:center;\n  justify-content:space-between;\n}\n\n.awr-m-ideal-icon {\n  display:flex;\n  width:50px;\n  height:50px;\n  align-items:center;\n  justify-content:center;\n  border:1px solid rgba(96,165,250,.20);\n  border-radius:15px;\n  background:rgba(59,130,246,.10);\n  font-size:23px;\n}\n\n.awr-m-ideal-number {\n  color:rgba(255,255,255,.18);\n  font-size:30px;\n  line-height:1;\n  font-weight:900;\n}\n\n.awr-m-ideal-card h3 {\n  position:relative;\n  z-index:2;\n  margin:0 0 12px;\n  color:#fff;\n  font-size:21px;\n  line-height:1.18;\n  font-weight:850;\n}\n\n.awr-m-ideal-card p {\n  position:relative;\n  z-index:2;\n  margin:0;\n  color:var(--awr-muted);\n  font-size:14px;\n  line-height:1.62;\n}\n\n\n\/* ==========================================================\n   05 AVANT \/ APR\u00c8S MOBILE\n   Les deux images contiennent d\u00e9j\u00e0 le cadre de l'iPhone.\n   L'image \"apr\u00e8s\" est dans le flux et donne la hauteur ;\n   l'image \"avant\" est pos\u00e9e par-dessus et d\u00e9coup\u00e9e\n   selon la position du curseur.\n   Les deux PNG doivent avoir exactement les m\u00eames dimensions.\n========================================================== *\/\n\n.awr-m-compare-wrap {\n  width:min(100%,340px);\n  margin:0 auto;\n}\n\n.awr-m-phone-mockup {\n  position:relative;\n  width:100%;\n  margin:0 auto;\n  filter:drop-shadow(0 28px 60px rgba(0,0,0,.32));\n}\n\n.awr-m-compare {\n  --pos:50%;\n  position:relative;\n  width:100%;\n  user-select:none;\n  touch-action:pan-y;\n}\n\n.awr-m-compare__after {\n  position:relative;\n  z-index:1;\n  display:block;\n  width:100% !important;\n  max-width:none !important;\n  height:auto !important;\n  margin:0 !important;\n  padding:0 !important;\n  border:0 !important;\n  border-radius:0 !important;\n  outline:0 !important;\n  box-shadow:none !important;\n}\n\n.awr-m-compare__before {\n  position:absolute;\n  z-index:2;\n  inset:0;\n  display:block;\n  width:100% !important;\n  max-width:none !important;\n  height:100% !important;\n  margin:0 !important;\n  padding:0 !important;\n  border:0 !important;\n  border-radius:0 !important;\n  outline:0 !important;\n  box-shadow:none !important;\n  object-fit:contain;\n  clip-path:inset(0 calc(100% - var(--pos)) 0 0);\n}\n\n.awr-m-compare__divider {\n  position:absolute;\n  z-index:5;\n  top:0;\n  bottom:0;\n  left:var(--pos);\n  width:2px;\n  background:#fff;\n  box-shadow:0 0 16px rgba(255,255,255,.35);\n  transform:translateX(-50%);\n  pointer-events:none;\n}\n\n.awr-m-compare__handle {\n  position:absolute;\n  top:50%;\n  left:50%;\n  display:flex;\n  width:42px;\n  height:42px;\n  align-items:center;\n  justify-content:center;\n  border:3px solid #fff;\n  border-radius:50%;\n  background:var(--awr-blue);\n  color:#fff;\n  font-size:17px;\n  font-weight:900;\n  box-shadow:0 10px 24px rgba(0,0,0,.3);\n  transform:translate(-50%,-50%);\n}\n\n.awr-m-compare-stage {\n  display:grid;\n  grid-template-columns:\n    minmax(120px,1fr)\n    minmax(280px,340px)\n    minmax(120px,1fr);\n  align-items:center;\n  gap:28px;\n  width:min(100%,900px);\n  margin:0 auto;\n}\n\n.awr-m-compare-side {\n  display:flex;\n  align-items:center;\n  gap:12px;\n  color:#fff;\n  font-size:18px;\n  font-weight:850;\n  white-space:nowrap;\n}\n\n.awr-m-compare-side--before {\n  justify-content:flex-end;\n}\n\n.awr-m-compare-side--after {\n  justify-content:flex-start;\n}\n\n.awr-m-compare-side__arrow {\n  display:inline-flex;\n  align-items:center;\n  justify-content:center;\n  width:42px;\n  height:42px;\n  border:1px solid rgba(96,165,250,.35);\n  border-radius:50%;\n  background:rgba(59,130,246,.12);\n  color:var(--awr-accent);\n  font-size:22px;\n  line-height:1;\n}\n\n.awr-m-compare__range {\n  position:absolute;\n  z-index:20;\n  inset:0;\n  width:100%;\n  height:100%;\n  margin:0;\n  opacity:0;\n  cursor:ew-resize;\n}\n\n.awr-m-compare__range:focus-visible\n+ .awr-m-compare__divider\n.awr-m-compare__handle {\n  outline:3px solid var(--awr-accent);\n  outline-offset:5px;\n}\n\n.awr-m-compare-help {\n  margin:12px 0 0;\n  color:var(--awr-muted);\n  font-size:13px;\n  line-height:1.5;\n  text-align:center;\n}\n\n\n\/* ==========================================================\n   06 PROCESS\n========================================================== *\/\n\n.awr-m-process {\n  display:grid;\n  grid-template-columns:repeat(3,minmax(0,1fr));\n  gap:22px;\n}\n\n.awr-m-process-card {\n  position:relative;\n  min-height:355px;\n  padding:30px;\n  overflow:hidden;\n  border:1px solid var(--awr-line);\n  border-radius:24px;\n  background:linear-gradient(\n    145deg,\n    rgba(255,255,255,.05),\n    rgba(2,10,32,.20)\n  );\n  transition:\n    transform .25s ease,\n    border-color .25s ease,\n    box-shadow .25s ease;\n}\n\n.awr-m-process-card:hover {\n  transform:translateY(-7px);\n  border-color:rgba(96,165,250,.40);\n  box-shadow:0 25px 60px rgba(0,0,0,.18);\n}\n\n.awr-m-process-top {\n  display:flex;\n  margin-bottom:48px;\n  align-items:center;\n  justify-content:space-between;\n}\n\n.awr-m-process-icon {\n  display:flex;\n  width:58px;\n  height:58px;\n  align-items:center;\n  justify-content:center;\n  border:1px solid rgba(96,165,250,.25);\n  border-radius:18px;\n  background:linear-gradient(\n    145deg,\n    rgba(59,130,246,.22),\n    rgba(59,130,246,.07)\n  );\n  font-size:25px;\n}\n\n.awr-m-process-number {\n  color:rgba(96,165,250,.23);\n  font-size:58px;\n  line-height:.8;\n  font-weight:950;\n  letter-spacing:-.06em;\n}\n\n.awr-m-process-card h3 {\n  margin:0 0 16px;\n  color:#fff;\n  font-size:26px;\n  line-height:1.12;\n  letter-spacing:-.025em;\n  font-weight:900;\n}\n\n.awr-m-process-card p {\n  margin:0;\n  color:var(--awr-muted);\n  font-size:15px;\n  line-height:1.7;\n}\n\n.awr-m-process-tag {\n  display:inline-flex;\n  margin-top:25px;\n  padding:7px 11px;\n  border:1px solid rgba(96,165,250,.17);\n  border-radius:999px;\n  background:rgba(59,130,246,.07);\n  color:var(--awr-pale);\n  font-size:11px;\n  font-weight:750;\n}\n\n\n\/* ==========================================================\n   07 FAQ\n========================================================== *\/\n\n.awr-m-faq__inner {\n  max-width:1050px;\n}\n\n.awr-m-faq__list {\n  border-top:1px solid var(--awr-line);\n}\n\n.awr-m-faq-item {\n  border-bottom:1px solid var(--awr-line);\n}\n\n.awr-m-faq-item summary {\n  position:relative;\n  padding:27px 54px 27px 0;\n  color:#fff;\n  font-size:clamp(17px,1.8vw,21px);\n  line-height:1.35;\n  font-weight:800;\n  cursor:pointer;\n  list-style:none;\n  transition:color .2s ease,padding-left .2s ease;\n}\n\n.awr-m-faq-item summary:hover {\n  padding-left:8px;\n  color:var(--awr-accent);\n}\n\n.awr-m-faq-item summary::-webkit-details-marker {\n  display:none;\n}\n\n.awr-m-faq-item summary::after {\n  content:\"+\";\n  position:absolute;\n  top:50%;\n  right:4px;\n  color:var(--awr-accent);\n  font-size:27px;\n  transform:translateY(-50%);\n  transition:transform .18s ease;\n}\n\n.awr-m-faq-item[open] summary::after {\n  transform:translateY(-50%) rotate(45deg);\n}\n\n.awr-m-faq-item > div {\n  padding:0 60px 27px 0;\n}\n\n.awr-m-faq-item p {\n  max-width:850px;\n  margin:0;\n  color:var(--awr-muted);\n  font-size:15px;\n  line-height:1.75;\n}\n\n\n\/* ==========================================================\n   08 CTA FINAL\n========================================================== *\/\n\n.awr-m-section--final {\n  padding-top:70px;\n  padding-bottom:110px;\n}\n\n.awr-m-final {\n  position:relative;\n  display:grid;\n  grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);\n  gap:70px;\n  padding:clamp(35px,5vw,64px);\n  align-items:center;\n  overflow:hidden;\n  border:1px solid var(--awr-border);\n  border-radius:var(--awr-radius);\n  background:\n    radial-gradient(\n      circle at 90% 20%,\n      rgba(59,130,246,.20),\n      transparent 32%\n    ),\n    rgba(2,10,32,.46);\n}\n\n.awr-m-final::before {\n  content:\"\";\n  position:absolute;\n  top:-150px;\n  right:-100px;\n  width:350px;\n  height:350px;\n  border-radius:50%;\n  background:radial-gradient(\n    circle,\n    rgba(59,130,246,.13),\n    transparent 65%\n  );\n  animation:awrHeroGlow 6s ease-in-out infinite;\n}\n\n.awr-m-h2--final {\n  position:relative;\n  z-index:2;\n  margin:0;\n  font-size:clamp(35px,4vw,58px);\n}\n\n.awr-m-final__actions {\n  position:relative;\n  z-index:2;\n  display:flex;\n  flex-direction:column;\n  align-items:flex-start;\n  gap:14px;\n}\n\n.awr-m-final__link {\n  color:var(--awr-pale) !important;\n  font-size:13px;\n  text-decoration:none !important;\n  transition:transform .2s ease,color .2s ease;\n}\n\n.awr-m-final__link:hover {\n  color:#fff !important;\n  transform:translateX(4px);\n}\n\n\n\/* ==========================================================\n   RESPONSIVE\n========================================================== *\/\n\n@media(max-width:1000px) {\n\n  .awr-m-section {\n    padding-top:85px;\n    padding-bottom:85px;\n  }\n\n  .awr-m-hero {\n    min-height:0;\n    padding-top:70px;\n    padding-bottom:80px;\n  }\n\n  .awr-m-hero__grid {\n    grid-template-columns:1fr;\n    gap:52px;\n  }\n\n  .awr-m-form-card {\n    max-width:720px;\n  }\n\n  .awr-m-ideal-head {\n    grid-template-columns:1fr;\n    gap:20px;\n  }\n\n  .awr-m-ideal-grid {\n    grid-template-columns:repeat(2,minmax(0,1fr));\n  }\n\n  .awr-m-hero__content {\n    display:block;\n  }\n\n  .awr-m-hero__mockup {\n    width:min(100%,760px);\n    margin:28px auto 0;\n  }\n\n}\n\n@media(max-width:760px) {\n\n  .awr-m-section {\n    padding-left:22px;\n    padding-right:22px;\n  }\n\n  .awr-m-depart__grid,\n  .awr-m-findings,\n  .awr-m-process {\n    grid-template-columns:1fr;\n  }\n\n  .awr-m-finding:last-child {\n    grid-column:auto;\n    max-width:none;\n  }\n\n  .awr-m-card {\n    min-height:auto;\n  }\n\n  .awr-m-card__number {\n    margin-bottom:34px;\n  }\n\n  .awr-m-arrow-link {\n    margin-top:25px;\n  }\n\n  .awr-m-ideal-grid {\n    grid-template-columns:1fr;\n  }\n\n  .awr-m-ideal-card,\n  .awr-m-process-card {\n    min-height:auto;\n  }\n\n  .awr-m-process {\n    gap:16px;\n  }\n\n  .awr-m-process-top {\n    margin-bottom:30px;\n  }\n\n  .awr-m-final {\n    grid-template-columns:1fr;\n    gap:35px;\n  }\n\n}\n\n@media(max-width:600px) {\n\n  .awr-m-section {\n    padding:70px 18px;\n  }\n\n  .awr-m-grid-bg {\n    background-size:60px 60px,60px 60px,auto;\n  }\n\n  .awr-m-hero {\n    padding-top:55px;\n    background-size:60px 60px,60px 60px,auto;\n  }\n\n  .awr-m-h1 {\n    font-size:clamp(38px,10.5vw,52px);\n  }\n\n  .awr-m-h2 {\n    font-size:clamp(34px,9.5vw,46px);\n  }\n\n  .awr-m-section-head {\n    margin-bottom:44px;\n  }\n\n  .awr-m-form-card,\n  .awr-m-card {\n    padding:26px 22px;\n    border-radius:22px;\n  }\n\n  .awr-m-btn {\n    width:100%;\n  }\n\n  .awr-m-finding {\n    grid-template-columns:46px 1fr;\n    gap:13px;\n    min-height:0;\n    padding:23px;\n  }\n\n  .awr-m-finding__emoji {\n    width:42px;\n    height:42px;\n    font-size:20px;\n  }\n\n  .awr-m-ideal-card,\n  .awr-m-process-card {\n    padding:23px;\n  }\n\n  .awr-m-process-number {\n    font-size:47px;\n  }\n\n  .awr-m-hero__mockup {\n    width:115%;\n    margin:28px 0 0 -7.5%;\n  }\n\n  .awr-m-compare-wrap {\n    width:min(100%,300px);\n  }\n\n  .awr-m-compare-stage {\n    grid-template-columns:1fr;\n    gap:16px;\n  }\n\n  .awr-m-compare-stage .awr-m-compare-wrap {\n    grid-row:1;\n  }\n\n  .awr-m-compare-side {\n    display:none;\n  }\n\n  .awr-m-compare__handle {\n    width:44px;\n    height:44px;\n    font-size:17px;\n  }\n\n  .awr-m-faq-item summary {\n    padding-top:23px;\n    padding-bottom:23px;\n  }\n\n  .awr-m-faq-item > div {\n    padding-right:15px;\n  }\n\n  .awr-m-final {\n    padding:28px 22px;\n    border-radius:22px;\n  }\n\n  .awr-m-final__actions,\n  .awr-m-final__link {\n    width:100%;\n  }\n\n  .awr-m-depart-intro {\n    margin:-4px 0 30px;\n    text-align:left;\n  }\n\n}\n\n\n\/* ==========================================================\n   REDUCED MOTION\n========================================================== *\/\n\n@media(prefers-reduced-motion:reduce) {\n\n  .awr-m-page *,\n  .awr-m-page *::before,\n  .awr-m-page *::after {\n    animation:none !important;\n    transition:none !important;\n  }\n\n  .awr-m-reveal {\n    opacity:1 !important;\n    transform:none !important;\n  }\n\n}\n\n<\/style>\n\n<main class=\"awr-m-page awr-m-page--architecte\">\n\n\n<!-- =========================================================\n01 HERO\n========================================================= -->\n\n<section class=\"awr-m-section awr-m-hero\">\n\n  <div class=\"awr-m-inner awr-m-hero__grid\">\n\n    <div class=\"awr-m-hero__content\">\n\n      <div class=\"awr-m-badge awr-m-reveal\">\n        Pour les architectes et architectes d&rsquo;int\u00e9rieur\n      <\/div>\n\n      <h1 class=\"awr-m-h1 awr-m-reveal awr-m-reveal-delay-1\">\n        <span>Cr\u00e9ation de site internet<\/span>\n        <span>pour architecte<\/span>\n        <strong>\u00e0 la hauteur de vos projets.<\/strong>\n      <\/h1>\n\n      <div class=\"awr-m-hero__mockup awr-m-reveal awr-m-reveal-delay-3\">\n        <img src=\"https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-laptop.png\" alt=\"Exemple de site internet d'architecte pr\u00e9sent\u00e9 sur ordinateur portable\" decoding=\"async\" fetchpriority=\"high\" title=\"Architecte\">\n      <\/div>\n\n    <\/div>\n\n\n    <div id=\"devis\" class=\"awr-m-form-card awr-contact-right awr-m-reveal awr-m-reveal-delay-1\">\n\n      <div class=\"awr-m-form-card__head\">\n\n        <span class=\"awr-m-eyebrow\">\n          Votre projet\n        <\/span>\n\n        <h2>\n          Parlons de votre site\n        <\/h2>\n\n        <p>\n          Laissez vos coordonn\u00e9es,\n          je vous rappelle pour faire le point.\n          Pas besoin de savoir exactement ce que vous voulez.\n        <\/p>\n\n      <\/div>\n\n      <div class=\"forminator-ui forminator-custom-form forminator-custom-form-1637 forminator-design--default  forminator_ajax\" data-forminator-render=\"0\" data-form=\"forminator-module-1637\" data-uid=\"6ac0dfc38a9af\"><br\/><\/div><form\n\t\t\t\tid=\"forminator-module-1637\"\n\t\t\t\tclass=\"forminator-ui forminator-custom-form forminator-custom-form-1637 forminator-design--default  forminator_ajax\"\n\t\t\t\tmethod=\"post\"\n\t\t\t\tdata-forminator-render=\"0\"\n\t\t\t\tdata-form-id=\"1637\"\n\t\t\t\t data-color-option=\"theme\" data-design=\"default\" data-grid=\"open\" style=\"display: none;\"\n\t\t\t\tdata-uid=\"6ac0dfc38a9af\"\n\t\t\t><div role=\"alert\" aria-live=\"polite\" class=\"forminator-response-message forminator-error\" aria-hidden=\"true\"><\/div><div class=\"forminator-row\"><div id=\"name-2\" class=\"forminator-field-name forminator-col forminator-col-12 \"><div class=\"forminator-field\"><label for=\"forminator-field-name-2_6ac0dfc38a9af\" id=\"forminator-field-name-2_6ac0dfc38a9af-label\" class=\"forminator-label\">Nom <span class=\"forminator-required\">*<\/span><\/label><input type=\"text\" name=\"name-2\" value=\"\" placeholder=\"\" id=\"forminator-field-name-2_6ac0dfc38a9af\" class=\"forminator-input forminator-name--field\" aria-required=\"true\" autocomplete=\"name\" \/><\/div><\/div><\/div><div class=\"forminator-row\"><div id=\"name-1\" class=\"forminator-field-name forminator-col forminator-col-12 \"><div class=\"forminator-field\"><label for=\"forminator-field-name-1_6ac0dfc38a9af\" id=\"forminator-field-name-1_6ac0dfc38a9af-label\" class=\"forminator-label\">Pr\u00e9nom <span class=\"forminator-required\">*<\/span><\/label><input type=\"text\" name=\"name-1\" value=\"\" placeholder=\"\" id=\"forminator-field-name-1_6ac0dfc38a9af\" class=\"forminator-input forminator-name--field\" aria-required=\"true\" autocomplete=\"name\" \/><\/div><\/div><\/div><div class=\"forminator-row\"><div id=\"email-1\" class=\"forminator-field-email forminator-col forminator-col-12 \"><div class=\"forminator-field\"><label for=\"forminator-field-email-1_6ac0dfc38a9af\" id=\"forminator-field-email-1_6ac0dfc38a9af-label\" class=\"forminator-label\">E-mail <span class=\"forminator-required\">*<\/span><\/label><input type=\"email\" name=\"email-1\" value=\"\" placeholder=\"\" id=\"forminator-field-email-1_6ac0dfc38a9af\" class=\"forminator-input forminator-email--field\" data-required=\"true\" aria-required=\"true\" autocomplete=\"email\" \/><\/div><\/div><\/div><div class=\"forminator-row\"><div id=\"phone-1\" class=\"forminator-field-phone forminator-col forminator-col-12 \"><div class=\"forminator-field\"><label for=\"forminator-field-phone-1_6ac0dfc38a9af\" id=\"forminator-field-phone-1_6ac0dfc38a9af-label\" class=\"forminator-label\">T\u00e9l\u00e9phone<\/label><input type=\"text\" name=\"phone-1\" value=\"\" placeholder=\"\" id=\"forminator-field-phone-1_6ac0dfc38a9af\" class=\"forminator-input forminator-field--phone\" data-required=\"\" aria-required=\"false\" autocomplete=\"off\" \/><\/div><\/div><\/div><div class=\"forminator-row\"><div id=\"textarea-1\" class=\"forminator-field-textarea forminator-col forminator-col-12 \"><div class=\"forminator-field\"><label for=\"forminator-field-textarea-1_6ac0dfc38a9af\" id=\"forminator-field-textarea-1_6ac0dfc38a9af-label\" class=\"forminator-label\">Message<\/label><span id=\"forminator-field-textarea-1_6ac0dfc38a9af-description\" class=\"forminator-description\"><span data-limit=\"180\" data-type=\"characters\" data-editor=\"\">0 \/ 180<\/span><\/span><textarea name=\"textarea-1\" placeholder=\"\" id=\"forminator-field-textarea-1_6ac0dfc38a9af\" class=\"forminator-textarea\" style=\"--forminator-textarea-min-height:140px;\" maxlength=\"180\" ><\/textarea><\/div><\/div><\/div><div class=\"forminator-row\"><div id=\"consent-1\" class=\"forminator-field-consent forminator-col forminator-col-12 \"><div class=\"forminator-field\"><label for=\"forminator-field-consent-1_6ac0dfc38a9af\" id=\"forminator-field-consent-1_6ac0dfc38a9af-label\" class=\"forminator-label\">Consent <span class=\"forminator-required\">*<\/span><\/label><div class=\"forminator-checkbox__wrapper\"><label id=\"forminator-field-consent-1_6ac0dfc38a9af__label\" class=\"forminator-checkbox forminator-consent\"><input type=\"checkbox\" name=\"consent-1\" id=\"forminator-field-consent-1_6ac0dfc38a9af\" value=\"checked\" aria-labelledby=\"forminator-field-consent-1_6ac0dfc38a9af-label\" aria-describedby=\"forminator-field-consent-1_6ac0dfc38a9af__description\" data-required=\"true\" aria-required=\"true\" \/><span class=\"forminator-checkbox-box\" aria-hidden=\"true\"><\/span><\/label><div id=\"forminator-field-consent-1_6ac0dfc38a9af__description\" class=\"forminator-checkbox__label forminator-consent__label\"><p>J&rsquo;accepte que mes informations soient utilis\u00e9es afin d&rsquo;\u00eatre recontact\u00e9 dans le cadre de ma demande.<\/p><\/div><\/div><\/div><\/div><\/div><div class=\"forminator-row forminator-hidden\"><div id=\"hidden-1\" class=\"forminator-field-hidden  forminator-col-12 \"><input type=\"hidden\" id=\"hidden-1_6ac0dfc38a9af\" name=\"hidden-1\" value=\"https:\/\/agencewebrusek.com\/en\/creation-site-internet-architecte\/\" \/><\/div><\/div><input type=\"hidden\" name=\"referer_url\" value=\"\" \/><div class=\"forminator-row forminator-row-last\"><div class=\"forminator-col\"><div class=\"forminator-field\"><button class=\"forminator-button forminator-button-submit\">Envoyer<\/button><\/div><\/div><\/div><input type=\"hidden\" id=\"forminator_nonce\" name=\"forminator_nonce\" value=\"427f0dac69\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/en\/wp-json\/wp\/v2\/pages\/2304\" \/><input type=\"hidden\" name=\"form_id\" value=\"1637\"><input type=\"hidden\" name=\"page_id\" value=\"2304\"><input type=\"hidden\" name=\"form_type\" value=\"default\"><input type=\"hidden\" name=\"current_url\" value=\"https:\/\/agencewebrusek.com\/en\/creation-site-internet-architecte\/\"><input type=\"hidden\" name=\"render_id\" value=\"0\"><input type=\"hidden\" name=\"action\" value=\"forminator_submit_form_custom-forms\"><\/form>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- =========================================================\n02 DEUX SITUATIONS\n========================================================= -->\n\n<section class=\"awr-m-section awr-m-grid-bg\">\n\n  <div class=\"awr-m-inner\">\n\n    <header class=\"awr-m-section-head\">\n\n      <h2 class=\"awr-m-h2 awr-m-reveal\">\n        <span>Avec ou sans site,<\/span>\n        <strong>on part de l\u00e0 o\u00f9 vous \u00eates.<\/strong>\n      <\/h2>\n\n    <\/header>\n\n\n    <p class=\"awr-m-depart-intro awr-m-reveal awr-m-reveal-delay-1\">\n      Un projet d&rsquo;architecture engage un budget important.\n      Avant de vous contacter, un client \u00e9tudie vos r\u00e9alisations,\n      votre d\u00e9marche et votre fa\u00e7on de travailler.\n      Votre site est votre premier rendez-vous.\n    <\/p>\n\n\n    <div class=\"awr-m-depart__grid\">\n\n\n      <article class=\"awr-m-card awr-m-card--featured\">\n\n        <div class=\"awr-m-card__number\">\n          01 \u2014 CR\u00c9ATION\n        <\/div>\n\n        <h3>\n          Vous n&rsquo;avez pas encore de site\n        <\/h3>\n\n        <p>\n          Je m&rsquo;occupe de tout :\n          nom de domaine, h\u00e9bergement,\n          textes, mise en page\n          et lien avec votre fiche Google.\n          Vous obtenez un site \u00e0 votre nom,\n          pr\u00eat \u00e0 recevoir des demandes de projet.\n        <\/p>\n\n        <p>\n          <strong>De votre c\u00f4t\u00e9 :<\/strong>\n          vos r\u00e9alisations,\n          vos photos,\n          votre d\u00e9marche\n          et les types de projets que vous menez.\n          Le reste, je le pr\u00e9pare.\n        <\/p>\n\n        <div class=\"awr-m-card__note\">\n          \ud83d\udca1 Vous avez des plans, des perspectives 3D\n          ou des photos de chantier ?\n          Ils racontent votre travail\n          autant que les photos finales.\n        <\/div>\n\n        <a href=\"#devis\" class=\"awr-m-arrow-link\">\n          Cr\u00e9er mon site\n          <span>\u2192<\/span>\n        <\/a>\n\n      <\/article>\n\n\n      <article class=\"awr-m-card\">\n\n        <div class=\"awr-m-card__number\">\n          02 \u2014 REFONTE\n        <\/div>\n\n        <h3>\n          Vous avez d\u00e9j\u00e0 un site\n        <\/h3>\n\n        <p>\n          Envoyez-moi son adresse.\n          Je le regarde sur ordinateur et t\u00e9l\u00e9phone\n          et je vous dis ce qui bloque en priorit\u00e9.\n        <\/p>\n\n        <p>\n          Chez les architectes,\n          le d\u00e9faut le plus courant,\n          c&rsquo;est un site qui montre de belles r\u00e9alisations\n          mais n&rsquo;invite jamais \u00e0 parler d&rsquo;un projet :\n          aucun bouton, aucun chemin vers le contact.\n        <\/p>\n\n        <a href=\"#devis\" class=\"awr-m-arrow-link\">\n          Faire analyser mon site\n          <span>\u2192<\/span>\n        <\/a>\n\n      <\/article>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- =========================================================\n03 CONSTATS\n========================================================= -->\n\n<section class=\"awr-m-section\">\n\n  <div class=\"awr-m-inner\">\n\n    <header class=\"awr-m-section-head awr-m-section-head--wide\">\n\n      <h2 class=\"awr-m-h2 awr-m-reveal\">\n        <span>Ce que vos clients trouvent<\/span>\n        <strong>quand ils cherchent un architecte.<\/strong>\n      <\/h2>\n\n      <p class=\"awr-m-intro\">\n        J&rsquo;ai pass\u00e9 en revue des sites d&rsquo;architectes\n        et d&rsquo;architectes d&rsquo;int\u00e9rieur qui apparaissent sur Google,\n        avec une seule question :\n        qu&rsquo;est-ce qu&rsquo;un client voit en premier ?\n        Voici ce qui revient le plus souvent.\n      <\/p>\n\n    <\/header>\n\n\n    <div class=\"awr-m-findings\">\n\n\n      <article class=\"awr-m-finding\">\n        <span class=\"awr-m-finding__emoji\">\ud83e\udded<\/span>\n        <div>\n          <h3>Aucune invitation \u00e0 parler de son projet<\/h3>\n          <p>\n            De superbes r\u00e9alisations,\n            mais aucun bouton pour prendre contact.\n            Le visiteur convaincu doit chercher lui-m\u00eame\n            comment vous joindre.\n          <\/p>\n        <\/div>\n      <\/article>\n\n\n      <article class=\"awr-m-finding\">\n        <span class=\"awr-m-finding__emoji\">\ud83d\udc53<\/span>\n        <div>\n          <h3>Des textes illisibles sur les photos<\/h3>\n          <p>\n            Titre clair sur une fa\u00e7ade claire,\n            menu pos\u00e9 sur une image charg\u00e9e :\n            l&rsquo;information essentielle\n            se perd dans le visuel.\n          <\/p>\n        <\/div>\n      <\/article>\n\n\n      <article class=\"awr-m-finding\">\n        <span class=\"awr-m-finding__emoji\">\ud83d\uddc2\ufe0f<\/span>\n        <div>\n          <h3>Une navigation confuse<\/h3>\n          <p>\n            Menus qui se chevauchent,\n            rubriques sans hi\u00e9rarchie :\n            on ne sait pas o\u00f9 trouver les projets,\n            ni comment vous travaillez.\n          <\/p>\n        <\/div>\n      <\/article>\n\n\n      <article class=\"awr-m-finding\">\n        <span class=\"awr-m-finding__emoji\">\ud83d\uddbc\ufe0f<\/span>\n        <div>\n          <h3>Des portfolios vides ou sans contexte<\/h3>\n          <p>\n            Des pages projets presque vides,\n            ou des photos qui s&rsquo;encha\u00eenent sans l\u00e9gende :\n            ni le type de projet, ni la surface,\n            ni le point de d\u00e9part.\n          <\/p>\n        <\/div>\n      <\/article>\n\n\n      <article class=\"awr-m-finding\">\n        <span class=\"awr-m-finding__emoji\">\ud83e\udde9<\/span>\n        <div>\n          <h3>Une mise en page d\u00e9s\u00e9quilibr\u00e9e<\/h3>\n          <p>\n            Blocs mal align\u00e9s, espaces vides,\n            images qui \u00e9crasent le texte :\n            le site ne refl\u00e8te pas\n            la rigueur de votre travail.\n          <\/p>\n        <\/div>\n      <\/article>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- =========================================================\n04 SITE ID\u00c9AL\n========================================================= -->\n\n<section class=\"awr-m-section awr-m-section--alt\">\n\n  <div class=\"awr-m-inner\">\n\n    <div class=\"awr-m-ideal-head\">\n\n      <h2 class=\"awr-m-h2 awr-m-reveal\">\n        <span>Ce que doit faire<\/span>\n        <strong>un site d&rsquo;architecte.<\/strong>\n      <\/h2>\n\n      <p class=\"awr-m-intro\">\n        Un bon site d&rsquo;architecte montre la qualit\u00e9 de vos r\u00e9alisations,\n        mais aussi la rigueur de votre d\u00e9marche.\n        C&rsquo;est ce qui d\u00e9cide un client\n        \u00e0 vous confier son projet.\n      <\/p>\n\n    <\/div>\n\n\n    <div class=\"awr-m-ideal-grid\">\n\n\n      <article class=\"awr-m-ideal-card\">\n        <div class=\"awr-m-ideal-top\">\n          <span class=\"awr-m-ideal-icon\">\ud83d\uddc2\ufe0f<\/span>\n          <span class=\"awr-m-ideal-number\">01<\/span>\n        <\/div>\n        <h3>Classer vos projets par type<\/h3>\n        <p>\n          Maison, r\u00e9novation d&rsquo;appartement,\n          bureaux, commerce :\n          le visiteur trouve directement\n          les r\u00e9alisations qui ressemblent \u00e0 son projet.\n        <\/p>\n      <\/article>\n\n\n      <article class=\"awr-m-ideal-card\">\n        <div class=\"awr-m-ideal-top\">\n          <span class=\"awr-m-ideal-icon\">\ud83d\udcd0<\/span>\n          <span class=\"awr-m-ideal-number\">02<\/span>\n        <\/div>\n        <h3>Donner le contexte de chaque projet<\/h3>\n        <p>\n          Surface, programme, d\u00e9lai,\n          point de d\u00e9part, avant et apr\u00e8s :\n          chaque r\u00e9alisation devient une \u00e9tude de cas,\n          pas une simple galerie.\n        <\/p>\n      <\/article>\n\n\n      <article class=\"awr-m-ideal-card\">\n        <div class=\"awr-m-ideal-top\">\n          <span class=\"awr-m-ideal-icon\">\ud83e\udded<\/span>\n          <span class=\"awr-m-ideal-number\">03<\/span>\n        <\/div>\n        <h3>Expliquer votre d\u00e9marche<\/h3>\n        <p>\n          Esquisse, conception, autorisations,\n          suivi de chantier :\n          vos \u00e9tapes sont expliqu\u00e9es clairement.\n          Le client sait \u00e0 quoi s&rsquo;attendre.\n        <\/p>\n      <\/article>\n\n\n      <article class=\"awr-m-ideal-card\">\n        <div class=\"awr-m-ideal-top\">\n          <span class=\"awr-m-ideal-icon\">\ud83d\udcc5<\/span>\n          <span class=\"awr-m-ideal-number\">04<\/span>\n        <\/div>\n        <h3>Inviter \u00e0 parler du projet<\/h3>\n        <p>\n          Un bouton clair, pr\u00e9sent sur chaque r\u00e9alisation,\n          qui m\u00e8ne \u00e0 une prise de contact simple.\n          L&rsquo;int\u00e9r\u00eat se transforme en demande.\n        <\/p>\n      <\/article>\n\n\n      <article class=\"awr-m-ideal-card\">\n        <div class=\"awr-m-ideal-top\">\n          <span class=\"awr-m-ideal-icon\">\ud83d\udcf0<\/span>\n          <span class=\"awr-m-ideal-number\">05<\/span>\n        <\/div>\n        <h3>Montrer votre reconnaissance<\/h3>\n        <p>\n          Publications, prix, presse, partenaires :\n          ce qui prouve votre s\u00e9rieux\n          est mis en avant,\n          sans pr\u00e9tention.\n        <\/p>\n      <\/article>\n\n\n      <article class=\"awr-m-ideal-card\">\n        <div class=\"awr-m-ideal-top\">\n          <span class=\"awr-m-ideal-icon\">\u2728<\/span>\n          <span class=\"awr-m-ideal-number\">06<\/span>\n        <\/div>\n        <h3>Un site aussi rigoureux que vos plans<\/h3>\n        <p>\n          Des textes lisibles, une grille \u00e9quilibr\u00e9e,\n          un site impeccable sur tous les \u00e9crans.\n          La forme de votre site dit d\u00e9j\u00e0\n          quelque chose de votre travail.\n        <\/p>\n      <\/article>\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- =========================================================\n05 AVANT \/ APR\u00c8S\n========================================================= -->\n\n<section id=\"exemples\" class=\"awr-m-section\">\n\n  <div class=\"awr-m-inner\">\n\n\n    <header class=\"awr-m-section-head awr-m-section-head--center\">\n\n      <h2 class=\"awr-m-h2 awr-m-reveal\">\n        <span>Avant \/ apr\u00e8s :<\/span>\n        <strong>vos projets, enfin mis en sc\u00e8ne.<\/strong>\n      <\/h2>\n\n      <p class=\"awr-m-intro\">\n        Un seul \u00e9cran, deux lectures.\n        Faites glisser le curseur dans le t\u00e9l\u00e9phone\n        pour passer d&rsquo;une galerie muette\n        \u00e0 un site qui pr\u00e9sente vos projets\n        et invite \u00e0 en parler.\n      <\/p>\n\n    <\/header>\n\n\n    <div class=\"awr-m-compare-stage awr-m-reveal\">\n\n\n      <div class=\"awr-m-compare-side awr-m-compare-side--before\" aria-hidden=\"true\">\n        <span class=\"awr-m-compare-side__arrow\">\u2190<\/span>\n        <span>Avant<\/span>\n      <\/div>\n\n\n      <div class=\"awr-m-compare-wrap\">\n\n        <div class=\"awr-m-phone-mockup\">\n\n          <!--\n          COMPARATEUR\n          Les deux images contiennent d\u00e9j\u00e0 le cadre de l'iPhone.\n          \"Apr\u00e8s\" est dessous et donne la hauteur,\n          \"Avant\" est dessus et se d\u00e9coupe avec le curseur.\n          -->\n\n          <div class=\"awr-m-compare\" data-awr-compare=\"\" style=\"--pos:50%;\">\n\n            <img class=\"awr-m-compare__after\" src=\"https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-mobile-apres-.png\" alt=\"Apr\u00e8s : exemple de site mobile d'architecte pr\u00e9sentant un projet avec son contexte et un bouton de contact\" loading=\"lazy\" decoding=\"async\" title=\"Architecte\">\n\n            <img class=\"awr-m-compare__before\" src=\"https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-mobile-avant.png\" alt=\"Avant : exemple de site mobile d'architecte avec une galerie de photos sans texte ni bouton\" loading=\"lazy\" decoding=\"async\" title=\"Architecte\">\n\n            <input class=\"awr-m-compare__range\" type=\"range\" min=\"0\" max=\"100\" value=\"50\" aria-label=\"Comparer le site avant et apr\u00e8s la refonte\">\n\n            <div class=\"awr-m-compare__divider\" aria-hidden=\"true\">\n              <span class=\"awr-m-compare__handle\">\u2194<\/span>\n            <\/div>\n\n          <\/div>\n\n        <\/div>\n\n        <p class=\"awr-m-compare-help\">\n          \u2190 Faites glisser pour comparer \u2192\n        <\/p>\n\n      <\/div>\n\n\n      <div class=\"awr-m-compare-side awr-m-compare-side--after\" aria-hidden=\"true\">\n        <span>Apr\u00e8s<\/span>\n        <span class=\"awr-m-compare-side__arrow\">\u2192<\/span>\n      <\/div>\n\n\n    <\/div>\n\n\n    <div class=\"awr-m-center\">\n      <a href=\"#devis\" class=\"awr-m-btn awr-m-btn--pulse\">\n        Demander un devis\n      <\/a>\n    <\/div>\n\n\n  <\/div>\n\n<\/section>\n\n\n<!-- =========================================================\n06 M\u00c9THODE\n========================================================= -->\n\n<section class=\"awr-m-section awr-m-section--alt\">\n\n  <div class=\"awr-m-inner\">\n\n\n    <header class=\"awr-m-section-head\">\n\n      <h2 class=\"awr-m-h2 awr-m-reveal\">\n        <span>Trois \u00e9tapes,<\/span>\n        <strong>sans ralentir vos projets.<\/strong>\n      <\/h2>\n\n      <p class=\"awr-m-intro\">\n        Entre les rendez-vous clients, les plans\n        et les visites de chantier, votre temps est compt\u00e9.\n        Le projet avance simplement,\n        par t\u00e9l\u00e9phone ou WhatsApp.\n      <\/p>\n\n    <\/header>\n\n\n    <div class=\"awr-m-process\">\n\n\n      <article class=\"awr-m-process-card\">\n        <div class=\"awr-m-process-top\">\n          <span class=\"awr-m-process-icon\">\ud83d\udcac<\/span>\n          <span class=\"awr-m-process-number\">01<\/span>\n        <\/div>\n        <h3>On fait le point<\/h3>\n        <p>\n          Un appel pour comprendre votre pratique,\n          vos types de projets et vos clients.\n          Si vous partez de z\u00e9ro, on s\u00e9lectionne ensemble\n          vos r\u00e9alisations.\n          Si vous avez d\u00e9j\u00e0 un site,\n          je l&rsquo;analyse avant de vous proposer la suite.\n        <\/p>\n        <span class=\"awr-m-process-tag\">T\u00e9l\u00e9phone ou WhatsApp<\/span>\n      <\/article>\n\n\n      <article class=\"awr-m-process-card\">\n        <div class=\"awr-m-process-top\">\n          <span class=\"awr-m-process-icon\">\ud83d\udee0\ufe0f<\/span>\n          <span class=\"awr-m-process-number\">02<\/span>\n        <\/div>\n        <h3>Je construis<\/h3>\n        <p>\n          Je r\u00e9dige les textes,\n          structure les pages\n          et construis le site.\n          Vous recevez l&rsquo;avancement\n          et validez directement depuis votre t\u00e9l\u00e9phone.\n        <\/p>\n        <span class=\"awr-m-process-tag\">Vous gardez le contr\u00f4le<\/span>\n      <\/article>\n\n\n      <article class=\"awr-m-process-card\">\n        <div class=\"awr-m-process-top\">\n          <span class=\"awr-m-process-icon\">\ud83d\ude80<\/span>\n          <span class=\"awr-m-process-number\">03<\/span>\n        <\/div>\n        <h3>On met en ligne<\/h3>\n        <p>\n          Une fois valid\u00e9,\n          le site est publi\u00e9\n          et reli\u00e9 \u00e0 votre pr\u00e9sence Google.\n          Vous r\u00e9glez le solde \u00e0 la livraison.\n        <\/p>\n        <span class=\"awr-m-process-tag\">Votre site est \u00e0 vous<\/span>\n      <\/article>\n\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- =========================================================\n07 FAQ\n========================================================= -->\n\n<section class=\"awr-m-section\">\n\n  <div class=\"awr-m-inner awr-m-faq__inner\">\n\n\n    <header class=\"awr-m-section-head\">\n\n      <h2 class=\"awr-m-h2 awr-m-reveal\">\n        <span>Les questions<\/span>\n        <strong>que vous vous posez.<\/strong>\n      <\/h2>\n\n    <\/header>\n\n\n    <div class=\"awr-m-faq__list\">\n\n\n      <details class=\"awr-m-faq-item\">\n        <summary>Combien de temps faut-il pour avoir mon site ?<\/summary>\n        <div>\n          <p>\n            Comptez une semaine en moyenne\n            entre notre premier \u00e9change\n            et la mise en ligne.\n            Le d\u00e9lai d\u00e9pend surtout des validations :\n            je vous envoie l&rsquo;avancement au fil de l&rsquo;eau\n            et vous r\u00e9pondez quand vous avez quelques minutes.\n          <\/p>\n        <\/div>\n      <\/details>\n\n\n      <details class=\"awr-m-faq-item\">\n        <summary>Combien co\u00fbte un site ?<\/summary>\n        <div>\n          <p>\n            Le prix d\u00e9pend surtout du nombre de pages\n            et de ce que vous avez d\u00e9j\u00e0 :\n            logo, photos et textes.\n            Apr\u00e8s notre premier \u00e9change,\n            vous recevez un devis d\u00e9taill\u00e9 sans engagement.\n          <\/p>\n        <\/div>\n      <\/details>\n\n\n      <details class=\"awr-m-faq-item\">\n        <summary>Je n&rsquo;y connais rien et je n&rsquo;ai pas le temps. C&rsquo;est un probl\u00e8me ?<\/summary>\n        <div>\n          <p>\n            Non.\n            Je r\u00e9dige les textes,\n            choisis la structure\n            et m&rsquo;occupe de la mise en ligne.\n            De votre c\u00f4t\u00e9,\n            quelques \u00e9changes et validations suffisent.\n          <\/p>\n        <\/div>\n      <\/details>\n\n\n      <details class=\"awr-m-faq-item\">\n        <summary>Je n&rsquo;ai ni logo ni photos. C&rsquo;est un probl\u00e8me ?<\/summary>\n        <div>\n          <p>\n            Non.\n            Je peux vous accompagner pour le logo,\n            et vos plans, perspectives\n            ou photos de chantier\n            suffisent souvent pour commencer.\n          <\/p>\n        <\/div>\n      <\/details>\n\n\n      <details class=\"awr-m-faq-item\">\n        <summary>J&rsquo;ai d\u00e9j\u00e0 un site. Faut-il tout refaire ?<\/summary>\n        <div>\n          <p>\n            Pas forc\u00e9ment.\n            Je commence par regarder votre site actuel\n            et je vous indique ce qui bloque en priorit\u00e9.\n            Si quelques corrections suffisent,\n            inutile de tout reconstruire.\n          <\/p>\n        <\/div>\n      <\/details>\n\n\n      <details class=\"awr-m-faq-item\">\n        <summary>Mes projets sont confidentiels. Comment les montrer ?<\/summary>\n        <div>\n          <p>\n            Plusieurs solutions existent :\n            ne pas nommer le lieu ni le client,\n            ne montrer que certaines pi\u00e8ces,\n            ou pr\u00e9senter des plans et des perspectives\n            plut\u00f4t que des photos.\n            On choisit ensemble ce qui peut \u00eatre publi\u00e9,\n            avec l&rsquo;accord de vos clients si n\u00e9cessaire.\n          <\/p>\n        <\/div>\n      <\/details>\n\n\n      <details class=\"awr-m-faq-item\">\n        <summary>Je travaille pour des particuliers et des professionnels. Faut-il deux sites ?<\/summary>\n        <div>\n          <p>\n            Non.\n            Un seul site suffit, avec des parcours s\u00e9par\u00e9s :\n            vos projets r\u00e9sidentiels d&rsquo;un c\u00f4t\u00e9,\n            vos bureaux et commerces de l&rsquo;autre.\n            Chaque client trouve rapidement\n            les r\u00e9alisations qui le concernent.\n          <\/p>\n        <\/div>\n      <\/details>\n\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<!-- =========================================================\n08 CTA FINAL\n========================================================= -->\n\n<section class=\"awr-m-section awr-m-section--final\">\n\n  <div class=\"awr-m-inner\">\n\n\n    <div class=\"awr-m-final\">\n\n\n      <div>\n        <h2 class=\"awr-m-h2 awr-m-h2--final awr-m-reveal\">\n          <span>Votre prochain client<\/span>\n          <strong>cherche un architecte en ce moment.<\/strong>\n        <\/h2>\n      <\/div>\n\n\n      <div class=\"awr-m-final__actions\">\n\n        <a href=\"#devis\" class=\"awr-m-btn awr-m-btn--pulse\">\n          Demander un devis\n        <\/a>\n\n        <a href=\"tel:+33637201491\" class=\"awr-m-final__link\">\n          \ud83d\udcde 06 37 20 14 91\n        <\/a>\n\n        <a href=\"https:\/\/wa.me\/33637201491\" class=\"awr-m-final__link\" target=\"_blank\" rel=\"noopener noreferrer\">\n          \ud83d\udcac Me contacter sur WhatsApp \u2192\n        <\/a>\n\n      <\/div>\n\n\n    <\/div>\n\n  <\/div>\n\n<\/section>\n\n\n<\/main>\n\n\n<!-- =========================================================\nJS \u2014 FADE + COMPARATEUR\n========================================================= -->\n\n<script>\n\ndocument.addEventListener(\"DOMContentLoaded\", function () {\n\n  const revealElements =\n    document.querySelectorAll(\".awr-m-reveal\");\n\n\n  if (!(\"IntersectionObserver\" in window)) {\n\n    revealElements.forEach(function (element) {\n      element.classList.add(\"is-visible\");\n    });\n\n  } else {\n\n    const observer =\n      new IntersectionObserver(\n        function (entries, observerInstance) {\n\n          entries.forEach(function (entry) {\n\n            if (entry.isIntersecting) {\n\n              entry.target.classList.add(\"is-visible\");\n\n              observerInstance.unobserve(\n                entry.target\n              );\n\n            }\n\n          });\n\n        },\n        {\n          threshold:0.12,\n          rootMargin:\"0px 0px -40px 0px\"\n        }\n      );\n\n\n    revealElements.forEach(function (element) {\n      observer.observe(element);\n    });\n\n  }\n\n\n  \/*\n  ==========================================\n  COMPARATEUR AVANT \/ APR\u00c8S\n  ==========================================\n  *\/\n\n  document\n    .querySelectorAll(\"[data-awr-compare]\")\n    .forEach(function (compare) {\n\n      const range =\n        compare.querySelector(\n          \".awr-m-compare__range\"\n        );\n\n      if (!range) return;\n\n\n      const updateCompare = function () {\n\n        compare.style.setProperty(\n          \"--pos\",\n          range.value + \"%\"\n        );\n\n      };\n\n\n      range.addEventListener(\n        \"input\",\n        updateCompare\n      );\n\n      range.addEventListener(\n        \"change\",\n        updateCompare\n      );\n\n\n      updateCompare();\n\n    });\n\n});\n\n<\/script>\n\n\n<!-- =========================================================\nJSON-LD\n========================================================= -->\n\n<script type=\"application\/ld+json\">\n{\n  \"@context\": \"https:\/\/schema.org\",\n  \"@graph\": [\n    {\n      \"@type\": \"ProfessionalService\",\n      \"@id\": \"https:\/\/agencewebrusek.com\/#business\",\n      \"name\": \"Agence Web Rusek\",\n      \"alternateName\": \"AWR\",\n      \"url\": \"https:\/\/agencewebrusek.com\/\",\n      \"telephone\": \"+33637201491\",\n      \"founder\": {\n        \"@type\": \"Person\",\n        \"name\": \"Thomas Rusek\"\n      },\n      \"areaServed\": [\n        {\n          \"@type\": \"City\",\n          \"name\": \"Paris\"\n        },\n        {\n          \"@type\": \"AdministrativeArea\",\n          \"name\": \"\u00cele-de-France\"\n        }\n      ]\n    },\n    {\n      \"@type\": \"Service\",\n      \"@id\": \"https:\/\/agencewebrusek.com\/creation-site-internet-architecte\/#service\",\n      \"name\": \"Cr\u00e9ation de site internet pour architecte\",\n      \"url\": \"https:\/\/agencewebrusek.com\/creation-site-internet-architecte\/\",\n      \"provider\": {\n        \"@id\": \"https:\/\/agencewebrusek.com\/#business\"\n      },\n      \"areaServed\": [\n        {\n          \"@type\": \"City\",\n          \"name\": \"Paris\"\n        },\n        {\n          \"@type\": \"AdministrativeArea\",\n          \"name\": \"\u00cele-de-France\"\n        }\n      ],\n      \"audience\": {\n        \"@type\": \"Audience\",\n        \"audienceType\": \"Architectes et architectes d'int\u00e9rieur\"\n      }\n    },\n    {\n      \"@type\": \"BreadcrumbList\",\n      \"@id\": \"https:\/\/agencewebrusek.com\/creation-site-internet-architecte\/#breadcrumb\",\n      \"itemListElement\": [\n        {\n          \"@type\": \"ListItem\",\n          \"position\": 1,\n          \"name\": \"Accueil\",\n          \"item\": \"https:\/\/agencewebrusek.com\/\"\n        },\n        {\n          \"@type\": \"ListItem\",\n          \"position\": 2,\n          \"name\": \"Cr\u00e9ation de site internet pour architecte\",\n          \"item\": \"https:\/\/agencewebrusek.com\/creation-site-internet-architecte\/\"\n        }\n      ]\n    },\n    {\n      \"@type\": \"FAQPage\",\n      \"@id\": \"https:\/\/agencewebrusek.com\/creation-site-internet-architecte\/#faq\",\n      \"mainEntity\": [\n        {\n          \"@type\": \"Question\",\n          \"name\": \"Combien de temps faut-il pour avoir mon site ?\",\n          \"acceptedAnswer\": {\n            \"@type\": \"Answer\",\n            \"text\": \"Comptez une semaine en moyenne entre notre premier \u00e9change et la mise en ligne. Le d\u00e9lai d\u00e9pend surtout des validations : je vous envoie l'avancement au fil de l'eau et vous r\u00e9pondez quand vous avez quelques minutes.\"\n          }\n        },\n        {\n          \"@type\": \"Question\",\n          \"name\": \"Combien co\u00fbte un site ?\",\n          \"acceptedAnswer\": {\n            \"@type\": \"Answer\",\n            \"text\": \"Le prix d\u00e9pend surtout du nombre de pages et de ce que vous avez d\u00e9j\u00e0 : logo, photos et textes. Apr\u00e8s notre premier \u00e9change, vous recevez un devis d\u00e9taill\u00e9 sans engagement.\"\n          }\n        },\n        {\n          \"@type\": \"Question\",\n          \"name\": \"Je n'y connais rien et je n'ai pas le temps. C'est un probl\u00e8me ?\",\n          \"acceptedAnswer\": {\n            \"@type\": \"Answer\",\n            \"text\": \"Non. Je r\u00e9dige les textes, choisis la structure et m'occupe de la mise en ligne. De votre c\u00f4t\u00e9, quelques \u00e9changes et validations suffisent.\"\n          }\n        },\n        {\n          \"@type\": \"Question\",\n          \"name\": \"Je n'ai ni logo ni photos. C'est un probl\u00e8me ?\",\n          \"acceptedAnswer\": {\n            \"@type\": \"Answer\",\n            \"text\": \"Non. Je peux vous accompagner pour le logo, et vos plans, perspectives ou photos de chantier suffisent souvent pour commencer.\"\n          }\n        },\n        {\n          \"@type\": \"Question\",\n          \"name\": \"J'ai d\u00e9j\u00e0 un site. Faut-il tout refaire ?\",\n          \"acceptedAnswer\": {\n            \"@type\": \"Answer\",\n            \"text\": \"Pas forc\u00e9ment. Je commence par regarder votre site actuel et je vous indique ce qui bloque en priorit\u00e9. Si quelques corrections suffisent, inutile de tout reconstruire.\"\n          }\n        },\n        {\n          \"@type\": \"Question\",\n          \"name\": \"Mes projets sont confidentiels. Comment les montrer ?\",\n          \"acceptedAnswer\": {\n            \"@type\": \"Answer\",\n            \"text\": \"Plusieurs solutions existent : ne pas nommer le lieu ni le client, ne montrer que certaines pi\u00e8ces, ou pr\u00e9senter des plans et des perspectives plut\u00f4t que des photos. On choisit ensemble ce qui peut \u00eatre publi\u00e9, avec l'accord de vos clients si n\u00e9cessaire.\"\n          }\n        },\n        {\n          \"@type\": \"Question\",\n          \"name\": \"Je travaille pour des particuliers et des professionnels. Faut-il deux sites ?\",\n          \"acceptedAnswer\": {\n            \"@type\": \"Answer\",\n            \"text\": \"Non. Un seul site suffit, avec des parcours s\u00e9par\u00e9s : vos projets r\u00e9sidentiels d'un c\u00f4t\u00e9, vos bureaux et commerces de l'autre. Chaque client trouve rapidement les r\u00e9alisations qui le concernent.\"\n          }\n        }\n      ]\n    }\n  ]\n}\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Pour les architectes et architectes d&rsquo;int\u00e9rieur Cr\u00e9ation de site internet pour architecte \u00e0 la hauteur de vos projets. Votre projet Parlons de votre site Laissez vos coordonn\u00e9es, je vous rappelle pour faire le point. Pas besoin de savoir exactement ce que vous voulez. Avec ou sans site, on part de l\u00e0 o\u00f9 vous \u00eates. Un [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":2302,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","footnotes":""},"class_list":["post-2304","page","type-page","status-publish","has-post-thumbnail","hentry"],"uagb_featured_image_src":{"full":["https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-laptop.png",1536,1024,false],"thumbnail":["https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-laptop-150x150.png",150,150,true],"medium":["https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-laptop-300x200.png",300,200,true],"medium_large":["https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-laptop-768x512.png",768,512,true],"large":["https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-laptop-1024x683.png",800,534,true],"1536x1536":["https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-laptop.png",1536,1024,false],"2048x2048":["https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-laptop.png",1536,1024,false],"trp-custom-language-flag":["https:\/\/agencewebrusek.com\/wp-content\/uploads\/2026\/09\/Mock-up-architecte-laptop-18x12.png",18,12,true]},"uagb_author_info":{"display_name":"thomas.rusek.chamant@gmail.com","author_link":"https:\/\/agencewebrusek.com\/en\/author\/thomas-rusek-chamantgmail-com\/"},"uagb_comment_info":0,"uagb_excerpt":"Pour les architectes et architectes d&rsquo;int\u00e9rieur Cr\u00e9ation de site internet pour architecte \u00e0 la hauteur de vos projets. Votre projet Parlons de votre site Laissez vos coordonn\u00e9es, je vous rappelle pour faire le point. Pas besoin de savoir exactement ce que vous voulez. Avec ou sans site, on part de l\u00e0 o\u00f9 vous \u00eates. Un&hellip;","_links":{"self":[{"href":"https:\/\/agencewebrusek.com\/en\/wp-json\/wp\/v2\/pages\/2304","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/agencewebrusek.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/agencewebrusek.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/agencewebrusek.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/agencewebrusek.com\/en\/wp-json\/wp\/v2\/comments?post=2304"}],"version-history":[{"count":2,"href":"https:\/\/agencewebrusek.com\/en\/wp-json\/wp\/v2\/pages\/2304\/revisions"}],"predecessor-version":[{"id":2306,"href":"https:\/\/agencewebrusek.com\/en\/wp-json\/wp\/v2\/pages\/2304\/revisions\/2306"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/agencewebrusek.com\/en\/wp-json\/wp\/v2\/media\/2302"}],"wp:attachment":[{"href":"https:\/\/agencewebrusek.com\/en\/wp-json\/wp\/v2\/media?parent=2304"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}