:root{--bg:#faf8f2;--bg-alt:#f4f0e6;--surface:#ece6d5;--glass:rgba(255,253,247,.72);--text:#1a1614;--muted:#5c544a;--dim:#6f6859;--border:#e0d8c4;--border-strong:#c8bea4;--accent:#a1471f;--accent-hover:#83391a;--accent-soft:#f3ddd1;--dark:#14110d;--dark-alt:#1f1b15;--dark-surface:#2a251d;--dark-text:#f4f0e6;--dark-muted:#b8ad97;--dark-border:#3a3328;--serif:'Fraunces',Georgia,'Times New Roman',serif;--mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;--ease:cubic-bezier(.2,.8,.2,1);--r:6px;--shell:1240px;--gut:24px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--serif);font-size:17px;line-height:1.55;font-weight:400;font-optical-sizing:auto;-webkit-font-smoothing:antialiased}
img,video,canvas,svg{max-width:100%;display:block}
img{height:auto}
a{color:inherit;text-decoration-color:var(--border-strong);text-underline-offset:3px}
a:hover{text-decoration-color:var(--accent)}
h1,h2,h3,h4{font-weight:500;line-height:1.08;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(40px,6vw,72px);letter-spacing:-.025em}
h2{font-size:clamp(30px,3.6vw,44px);letter-spacing:-.018em}
h3{font-size:24px;letter-spacing:-.01em}
h4{font-size:20px}
p{margin:0 0 1.1em}
.lead{font-size:20px;line-height:1.5;color:var(--muted);max-width:62ch}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:16px}
.eyebrow::before{content:"— ";color:var(--accent)}
.dark .eyebrow{color:var(--dark-muted)}
.shell{max-width:var(--shell);margin:0 auto;padding:0 var(--gut)}
.narrow{max-width:760px}
.prose{max-width:680px}
.prose h2{font-size:32px;margin-top:1.6em}
.prose h3{margin-top:1.4em}
.prose ul,.prose ol{padding-left:1.2em}
.prose li{margin:.35em 0}
.prose blockquote{border-left:2px solid var(--accent);margin:1.5em 0;padding:.2em 0 .2em 1.2em;color:var(--muted);font-style:italic}
section{padding:96px 0}
.tight{padding:64px 0}
.dark{background:var(--dark);color:var(--dark-text)}
.dark a{text-decoration-color:var(--dark-border)}
.alt{background:var(--bg-alt)}
.rule{border:0;border-top:1px solid var(--border-strong);margin:0 0 24px}
.dark .rule{border-color:var(--dark-border)}
.head{margin-bottom:48px;max-width:760px}
.head h2{margin-bottom:.35em}
.head p{color:var(--muted);font-size:19px;margin:0}
.dark .head p{color:var(--dark-muted)}
.grid{display:grid;gap:24px}
.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center}
.split.rev{grid-template-columns:.9fr 1.1fr}
.split.top{align-items:start}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.muted{color:var(--muted)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}
.skip{position:absolute;left:8px;top:-60px;background:var(--accent);color:#fff;padding:10px 14px;border-radius:4px;z-index:100}
.skip:focus{top:8px}
/* boutons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:4px;font:500 16px/1.2 var(--serif);text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background .16s ease-out,color .16s ease-out,border-color .16s ease-out,transform .16s ease-out}
.btn-p{background:var(--accent);color:#fff8f2}
.btn-p:hover{background:var(--accent-hover);transform:translateY(-1px)}
.btn-s{background:transparent;color:var(--text);border-color:var(--border-strong)}
.btn-s:hover{border-color:var(--text)}
.dark .btn-s,.hero .btn-s{color:var(--dark-text);border-color:var(--dark-border)}
.dark .btn-s:hover,.hero .btn-s:hover{border-color:var(--dark-text)}
.btn svg{width:18px;height:18px;flex:none}
.btn-wa{background:#1b7a43;color:#fff}
.btn-wa:hover{background:#176b3b}
.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.note{font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--dim);margin-top:12px}
/* cartes */
.card{background:var(--bg-alt);border:1px solid var(--border);border-radius:var(--r);padding:28px;position:relative;transition:background .16s,border-color .16s;text-decoration:none;display:block;color:inherit}
.card:hover{background:var(--glass);backdrop-filter:blur(12px) saturate(1.1);border-color:var(--border-strong)}
.card .idx{font-family:var(--mono);font-size:12px;letter-spacing:.15em;color:var(--accent);margin-bottom:22px;display:flex;justify-content:space-between}
.card h3{margin-bottom:.4em}
.card p{color:var(--muted);margin:0}
.card .more{margin-top:20px;font:500 15px var(--serif);color:var(--text)}
.card .more svg{display:inline-block}
.dark .card{background:var(--dark-alt);border-color:var(--dark-border);color:var(--dark-text)}
.dark .card p{color:var(--dark-muted)}
.dark .card:hover{background:var(--dark-surface)}
.card-img{padding:0;overflow:hidden}
.card-img img{aspect-ratio:3/2;object-fit:cover;width:100%;transition:transform .9s var(--ease)}
.card-img:hover img{transform:scale(1.03)}
.card-img .body{padding:24px 28px 28px}
.tilt{transform-style:preserve-3d;will-change:transform}

/* header */
.hdr{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,border-color .3s,backdrop-filter .3s;border-bottom:1px solid transparent}
.hdr.on{background:rgba(250,248,242,.86);backdrop-filter:blur(14px) saturate(1.1);border-color:var(--border)}
.hdr.over{color:var(--dark-text)}
.hdr.over.on{color:var(--text)}
.hdr .shell{display:flex;align-items:center;justify-content:space-between;height:74px;gap:24px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;line-height:1.05}
.logo .mark{color:var(--accent);flex:none;transition:transform .6s var(--ease)}
.logo:hover .mark{transform:rotate(90deg)}
.logo span{display:flex;flex-direction:column}
.logo b{font:600 21px var(--serif);letter-spacing:-.01em}
.logo i{font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;opacity:.75;font-style:normal;margin-top:3px}
.nav{display:flex;align-items:center;gap:26px}
.nav a{text-decoration:none;font-size:15px;font-weight:500;opacity:.9}
.nav a:hover{opacity:1;color:var(--accent)}
.hdr.over:not(.on) .nav a:hover{color:#fff}
.nav .btn{padding:10px 16px;font-size:15px}
.burger{display:none;background:none;border:1px solid currentColor;border-radius:4px;color:inherit;padding:8px 10px;font:500 13px var(--mono);letter-spacing:.1em;cursor:pointer}
.mnav{position:fixed;inset:0;background:var(--bg);z-index:60;padding:24px;display:none;flex-direction:column;gap:6px;overflow:auto}
.mnav.open{display:flex}
.mnav a{font:500 26px/1.3 var(--serif);text-decoration:none;padding:10px 0;border-bottom:1px solid var(--border)}
.mnav .close{align-self:flex-end;margin-bottom:12px}
.mnav .btn{margin-top:16px;justify-content:center;font-size:18px}
/* hero */
.hero{position:relative;min-height:100svh;display:grid;align-items:center;padding:130px 0 80px;overflow:hidden;background:var(--dark);color:var(--dark-text)}
.hero .shell{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;position:relative;z-index:2}
.hero h1{margin-bottom:24px;color:#fff}
.hero .lead{color:var(--dark-muted);margin-bottom:32px}
.hero .actions{margin-bottom:32px}
.trust{display:flex;flex-wrap:wrap;gap:8px 28px;font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--dark-muted);text-transform:uppercase}
.trust span::before{content:"◆ ";color:var(--accent)}
.rug{position:relative;aspect-ratio:1/1;max-height:70vh;width:100%}
.rug canvas{position:absolute;inset:0;width:100%;height:100%}
.rug img{position:absolute;inset:8% 6%;width:88%;height:auto;margin:auto;border-radius:2px;box-shadow:0 40px 80px rgba(0,0,0,.5);transform:perspective(900px) rotateX(38deg) rotateZ(-6deg)}
.rug.gl img{display:none}
.rug::after{content:"";position:absolute;left:10%;right:10%;bottom:6%;height:30%;background:radial-gradient(ellipse at center,rgba(0,0,0,.55),transparent 70%);z-index:-1;filter:blur(10px)}
.hero-bg{position:absolute;inset:0;background:radial-gradient(60% 50% at 80% 40%,rgba(161,71,31,.22),transparent 70%),radial-gradient(40% 40% at 10% 90%,rgba(184,173,151,.10),transparent 70%)}
.scroll-cue{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--dark-muted);text-transform:uppercase;animation:cue 2.4s ease-in-out infinite}
@keyframes cue{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,6px)}}
.page-hero{padding:150px 0 64px;position:relative}
.page-hero.dark{padding-bottom:72px}
.page-hero h1{margin-bottom:20px}
.page-hero .lead{margin-bottom:28px}
.crumbs{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--dim);margin-bottom:28px;display:flex;flex-wrap:wrap;gap:8px}
.crumbs a{text-decoration:none;color:inherit}
.crumbs a:hover{color:var(--accent)}
.dark .crumbs{color:var(--dark-muted)}
/* étapes / numéros */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:s}
.step{border-top:1px solid var(--border-strong);padding-top:24px}
.step .n{font:500 56px/1 var(--serif);letter-spacing:-.03em;color:var(--accent);margin-bottom:16px}
.step h3{font-size:22px}
.step p{color:var(--muted);margin:0}
.dark .step{border-color:var(--dark-border)}
.dark .step p{color:var(--dark-muted)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.stat b{display:block;font:500 64px/1 var(--serif);letter-spacing:-.03em;margin-bottom:10px}
.stat > span{color:var(--dark-muted);font-size:15px}
/* listes / faq */
.checks{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.checks li{padding-left:28px;position:relative}
.checks li::before{content:"";position:absolute;left:0;top:9px;width:14px;height:8px;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(-45deg)}
.defs{display:grid;gap:0}
.defs > div{display:grid;grid-template-columns:1fr 2fr;gap:24px;padding:20px 0;border-top:1px solid var(--border)}
.defs > div:last-child{border-bottom:1px solid var(--border)}
.defs b{font-weight:500}
.defs p{margin:0;color:var(--muted)}
.dark .defs p{color:var(--dark-muted)}
.dark .defs > div{border-color:var(--dark-border)}
.faq details{border-top:1px solid var(--border)}
.faq details:last-child{border-bottom:1px solid var(--border)}
.faq summary{cursor:pointer;padding:20px 40px 20px 0;font:500 20px/1.3 var(--serif);list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:16px;font:400 26px var(--serif);color:var(--accent);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--muted);margin:0 0 22px;max-width:70ch}
/* galerie */
.masonry{columns:3;gap:20px}
.masonry a{display:block;break-inside:avoid;margin-bottom:20px;overflow:hidden;border-radius:var(--r);background:var(--surface)}
.masonry img{width:100%;transition:transform .9s var(--ease)}
.masonry a:hover img{transform:scale(1.03)}
.cap{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--dim);margin-top:8px;text-transform:uppercase}
figure{margin:0}
figure img{border-radius:var(--r)}
figure figcaption{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--dim);margin-top:10px;text-transform:uppercase}
.video-wrap{position:relative;border-radius:var(--r);overflow:hidden;background:#000}
.video-wrap video{width:100%;aspect-ratio:16/9;object-fit:cover}
/* kilim : bande décorative */
.kilim{height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 18'%3E%3Cpath d='M0 9l9-7 9 7 9-7 9 7' fill='none' stroke='%23a1471f' stroke-width='1.6'/%3E%3Cpath d='M0 9l9 7 9-7 9 7 9-7' fill='none' stroke='%23c8bea4' stroke-width='1.2'/%3E%3C/svg%3E") repeat-x center/36px 18px}
.dark .kilim,.kilim.on-dark{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 18'%3E%3Cpath d='M0 9l9-7 9 7 9-7 9 7' fill='none' stroke='%23a1471f' stroke-width='1.6'/%3E%3Cpath d='M0 9l9 7 9-7 9 7 9-7' fill='none' stroke='%233a3328' stroke-width='1.2'/%3E%3C/svg%3E")}
.card-illu{padding-top:118px}
.card-illu .illu{position:absolute;right:6px;top:2px;width:124px;height:124px;object-fit:contain;mix-blend-mode:multiply;transition:transform .7s var(--ease);-webkit-mask:radial-gradient(circle at 50% 50%,#000 46%,transparent 68%);mask:radial-gradient(circle at 50% 50%,#000 46%,transparent 68%)}
.card-illu:hover .illu{transform:scale(1.1) rotate(-4deg)}
.rprog{position:fixed;left:0;top:0;height:3px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;z-index:70}
/* villes */
.cities{display:grid;grid-template-columns:repeat(4,1fr);gap:8px 24px;list-style:none;padding:0;margin:0}
.cities a{text-decoration:none;display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border);font-size:16px}
.cities a small{font-family:var(--mono);font-size:11px;color:var(--dim);letter-spacing:.06em}
.cities a:hover{color:var(--accent)}
.tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.tags li{font-family:var(--mono);font-size:12px;letter-spacing:.06em;border:1px solid var(--border-strong);border-radius:999px;padding:6px 12px;color:var(--muted)}
/* formulaire */
form{display:grid;gap:18px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
label{display:grid;gap:8px;font-size:15px;font-weight:500}
label small{font-weight:400;color:var(--dim);font-family:var(--mono);font-size:11px;letter-spacing:.06em}
input,select,textarea{font:400 16px var(--serif);padding:13px 14px;border:1px solid var(--border-strong);border-radius:4px;background:#fffdf8;color:var(--text);width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:2px}
textarea{min-height:130px;resize:vertical}
.fs-step{display:none}.fs-step.on{display:grid;gap:18px}
.fs-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:8px}
.fs-prog{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--dim)}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.msg{padding:14px 16px;border-radius:4px;border:1px solid var(--border-strong);display:none}
.msg.err{display:block;border-color:#b54a3a;color:#8a2f22}
.msg.ok{display:block;border-color:#2f7d57;color:#1f5c3f}
/* pied de page */
.ftr{background:var(--dark);color:var(--dark-text);padding:72px 0 36px;font-size:15px}
.ftr .grid{grid-template-columns:1.4fr 1fr 1fr 1fr}
.ftr h4{font:500 13px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dark-muted);margin-bottom:16px}
.ftr ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.ftr a{text-decoration:none;color:var(--dark-text);opacity:.85}
.ftr a:hover{opacity:1;color:#fff}
.ftr .legal{margin-top:48px;padding-top:24px;border-top:1px solid var(--dark-border);display:flex;flex-wrap:wrap;gap:8px 24px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--dark-muted)}
.ftr address{font-style:normal;color:var(--dark-muted);line-height:1.7}
/* barre mobile + whatsapp */
.mbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--dark);border-top:1px solid var(--dark-border);padding:10px 12px env(safe-area-inset-bottom,10px);grid-template-columns:1fr 1fr 1.4fr;gap:8px}
.mbar a{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 8px;border-radius:4px;font:500 14px var(--serif);text-decoration:none;color:var(--dark-text);border:1px solid var(--dark-border)}
.mbar a.p{background:var(--accent);color:#fff;border-color:var(--accent)}
.mbar svg{width:16px;height:16px}
.wa{position:fixed;right:22px;bottom:22px;z-index:44;width:56px;height:56px;border-radius:50%;background:#1b7a43;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 32px rgba(0,0,0,.25);transition:transform .16s}
.wa:hover{transform:scale(1.06)}
.wa svg{width:28px;height:28px;fill:#fff}
/* cta finale */
.cta-final{position:relative;overflow:hidden}
.cta-final h2{max-width:14ch;font-size:clamp(36px,5vw,64px)}
.cta-final .shell{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:end}
.blog-list article{border-top:1px solid var(--border);padding:32px 0;display:grid;grid-template-columns:200px 1fr;gap:32px;align-items:start}
.blog-list img{border-radius:var(--r);aspect-ratio:3/2;object-fit:cover}
.blog-list h3 a{text-decoration:none}
.blog-list h3 a:hover{color:var(--accent)}
.avis{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.avis .card{font-size:16px}
.stars{color:var(--accent);letter-spacing:2px;font-size:14px;margin-bottom:12px}
.cursor{position:fixed;left:0;top:0;width:34px;height:34px;border:1px solid var(--accent);border-radius:50%;pointer-events:none;z-index:99;transform:translate(-50%,-50%);transition:width .2s,height .2s,opacity .3s;opacity:0;mix-blend-mode:multiply}
.dark .cursor{mix-blend-mode:screen}
.cursor.big{width:64px;height:64px}
.marquee{overflow:hidden;white-space:nowrap;border-top:1px solid var(--dark-border);border-bottom:1px solid var(--dark-border);padding:14px 0;font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--dark-muted)}
.marquee div{display:inline-block;animation:mq 60s linear infinite}
.marquee span{margin:0 28px}
.marquee span::before{content:"◆";color:var(--accent);margin-right:28px}
@keyframes mq{to{transform:translateX(-50%)}}

/* motion */
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}
figure.rv img,.masonry a.rv img{clip-path:inset(0 0 100% 0);transition:clip-path 1.1s var(--ease),transform .9s var(--ease)}
figure.rv.in img,.masonry a.rv.in img{clip-path:inset(0)}
.page-hero figure img,.hero-fig img{animation:kb 18s ease-out both}
@keyframes kb{from{transform:scale(1.07)}to{transform:scale(1)}}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}.rv.d4{transition-delay:.32s}
.px{will-change:transform}
.lines h1 span,.lines h2 span{display:inline-block;opacity:0;transform:translateY(110%);transition:transform .9s var(--ease),opacity .6s}
.lines.in h1 span,.lines.in h2 span{opacity:1;transform:none}
.lines h1 > i,.lines h2 > i{display:inline-block;overflow:hidden;vertical-align:bottom;font-style:normal;padding-bottom:.08em;margin-bottom:-.08em}
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .32s var(--ease) both}
::view-transition-new(root){animation:vt-in .42s var(--ease) both}
@keyframes vt-out{to{opacity:0;transform:translateY(-8px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(10px)}}
@media (prefers-reduced-motion:reduce){
  .rv,.lines h1 span,.lines h2 span{opacity:1!important;transform:none!important;transition:none!important}
  figure.rv img,.masonry a.rv img{clip-path:none!important;animation:none!important}
  .page-hero figure img{animation:none!important}
  .marquee div,.scroll-cue{animation:none!important}
  ::view-transition-old(root),::view-transition-new(root){animation:none!important}
  .cursor{display:none}
  .rug img{transform:none}
  html{scroll-behavior:auto}
}
/* responsive */
@media (max-width:1100px){.g4{grid-template-columns:repeat(2,1fr)}.cities{grid-template-columns:repeat(3,1fr)}.stats{grid-template-columns:repeat(2,1fr)}.ftr .grid{grid-template-columns:1fr 1fr}}
@media (max-width:900px){
  :root{--gut:20px}
  section{padding:64px 0}
  .g3,.g2,.avis{grid-template-columns:1fr}
  .split,.split.rev,.hero .shell,.cta-final .shell{grid-template-columns:1fr;gap:40px}
  .hero{padding:110px 0 90px;min-height:auto}
  .rug{max-height:52vh;aspect-ratio:4/3}
  .steps{grid-template-columns:1fr;gap:32px}
  .nav{display:none}.burger{display:inline-block}
  .masonry{columns:2}
  .defs > div{grid-template-columns:1fr;gap:6px}
  .blog-list article{grid-template-columns:1fr}
  .mbar{display:grid}
  .wa{bottom:86px;right:14px;width:50px;height:50px}
  body{padding-bottom:70px}
  .cursor{display:none}
  .page-hero{padding-top:110px}
}
@media (max-width:560px){
  :root{--gut:16px}
  .masonry{columns:1}.g4{grid-template-columns:1fr}.cities{grid-template-columns:1fr 1fr}.row2{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}
  .stat b{font-size:44px}
  .ftr .grid{grid-template-columns:1fr}
  .hdr .shell{height:64px}
  .btn{width:100%;justify-content:center}
  .actions .btn{width:100%}
}
@media (hover:none){.card:hover img{transform:none}}