:root{
  --wall:#EDE8DD;
  --wall-deep:#E2DCCC;
  --ink:#1B1815;
  --ink-soft:#4A453D;
  --oxblood:#6E1E2B;
  --oxblood-soft:#8A3340;
  --brass:#9C7B45;
  --stone:#B8B2A2;
  --stone-line:#CFC9BA;
  --card:#F6F3EA;
  --font-display:'Fraunces', serif;
  --font-body:'Work Sans', sans-serif;
  --font-label:'IBM Plex Mono', monospace;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--wall);
  color:var(--ink);
  font-family:var(--font-body);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
img{max-width:100%; display:block;}

/* NAV */
nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:28px 40px; max-width:1180px; margin:0 auto;
  border-bottom:1px solid var(--stone-line);
}
.logo{
  font-family:var(--font-label); font-size:15px; letter-spacing:0.22em;
  color:var(--ink); text-transform:uppercase; font-weight:500; text-decoration:none;
}
.logo span{color:var(--oxblood);}
.nav-links{display:flex; gap:36px; align-items:center;}
.nav-links a{color:var(--ink-soft); text-decoration:none; font-size:14px; font-weight:400;}
.nav-links a.active{color:var(--ink); border-bottom:1px solid var(--oxblood); padding-bottom:4px;}
.nav-cta{
  border:1px solid var(--ink); color:var(--ink); background:none;
  padding:10px 22px; font-size:13px; font-family:var(--font-body);
  letter-spacing:0.03em; cursor:pointer; text-decoration:none; display:inline-block;
}

/* BUTTONS */
.btn-primary{
  background:var(--ink); color:var(--wall); border:none;
  padding:15px 28px; font-size:14px; font-family:var(--font-body); font-weight:500;
  cursor:pointer; letter-spacing:0.02em; text-decoration:none; display:inline-block;
}
.btn-secondary{
  background:none; color:var(--ink); border:1px solid var(--ink);
  padding:15px 28px; font-size:14px; font-family:var(--font-body); font-weight:500;
  cursor:pointer; letter-spacing:0.02em; text-decoration:none; display:inline-block;
}
.btn-primary:disabled, .btn-secondary:disabled{opacity:0.4; cursor:not-allowed;}

/* HERO (home) */
.hero{
  display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px;
  padding:80px 40px 90px; max-width:1180px; margin:0 auto; align-items:center;
}
.eyebrow{
  font-family:var(--font-label); font-size:12px; letter-spacing:0.18em;
  color:var(--oxblood); text-transform:uppercase; margin-bottom:22px;
  display:flex; align-items:center; gap:10px;
}
.eyebrow::before{content:''; width:20px; height:1px; background:var(--oxblood);}
h1{
  font-family:var(--font-display); font-weight:400; font-size:56px;
  line-height:1.05; letter-spacing:-0.01em; margin-bottom:26px;
}
h1 em{font-style:italic; color:var(--oxblood-soft); font-weight:400;}
.hero-sub{font-size:17px; color:var(--ink-soft); max-width:440px; margin-bottom:36px; font-weight:300;}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}

/* PAGE HERO (sous-pages) */
.page-hero{
  max-width:1180px; margin:0 auto; padding:64px 40px 56px; border-bottom:1px solid var(--stone-line);
}
.page-hero h1{font-size:42px; margin-bottom:14px;}
.page-hero p{font-size:16px; color:var(--ink-soft); max-width:560px; font-weight:300;}

/* SALON WALL */
.salon{position:relative; height:480px;}
.frame{position:absolute; background:var(--card); border:10px solid #2A2622; box-shadow:0 18px 34px rgba(27,24,21,0.16);}
.canvas{width:100%; height:100%; display:block;}
.canvas svg{width:100%; height:100%; display:block;}
.f1{top:0; left:40px; width:220px; height:280px; transform:rotate(-2deg); z-index:2;}
.f2{top:60px; left:290px; width:180px; height:230px; transform:rotate(2deg); z-index:3;}
.f3{top:320px; left:70px; width:150px; height:150px; transform:rotate(1.5deg); z-index:1;}
.label{
  position:absolute; background:var(--wall); border:1px solid var(--stone-line);
  padding:8px 12px; font-family:var(--font-label); font-size:10px; z-index:5;
  width:170px; line-height:1.5;
}
.l1{top:288px; left:40px;}
.l2{top:298px; left:290px; width:150px;}
.l3{top:478px; left:70px; width:150px;}
.label .artist{font-weight:500; text-transform:uppercase; letter-spacing:0.04em;}
.label .status{margin-top:3px;}
.status.avail{color:#3B6D11;}
.status.onloan{color:var(--oxblood);}
.status.reserved{color:var(--brass);}
.status.dot::before{content:'●'; font-size:8px; margin-right:5px;}

/* STAT STRIP */
.stats{
  border-top:1px solid var(--stone-line); border-bottom:1px solid var(--stone-line);
  padding:44px 40px; display:grid; grid-template-columns:repeat(4,1fr);
  max-width:1180px; margin:0 auto; gap:20px;
}
.stat-num{font-family:var(--font-display); font-size:38px; color:var(--ink); font-weight:400;}
.stat-label{font-size:13px; color:var(--ink-soft); margin-top:6px; max-width:190px;}

/* SECTION */
.section{padding:96px 40px; max-width:1180px; margin:0 auto;}
.section-head{max-width:560px; margin-bottom:56px;}
.section-eyebrow{
  font-family:var(--font-label); font-size:12px; letter-spacing:0.16em;
  color:var(--brass); text-transform:uppercase; margin-bottom:14px;
}
h2{font-family:var(--font-display); font-size:36px; font-weight:400; line-height:1.15;}
h3{font-family:var(--font-display); font-weight:400;}

/* STEPS */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:44px;}
.step-num{
  font-family:var(--font-label); font-size:13px; color:var(--brass);
  border-bottom:1px solid var(--brass); display:inline-block; padding-bottom:6px; margin-bottom:20px;
}
.step h3{font-size:22px; margin-bottom:10px;}
.step p{font-size:14.5px; color:var(--ink-soft); font-weight:300;}

/* CATALOGUE GRID */
.catalogue{background:var(--wall-deep); padding:96px 40px;}
.cat-grid{
  max-width:1180px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:2px;
  background:var(--stone-line); border:1px solid var(--stone-line);
}
.cat-item{background:var(--wall-deep); text-decoration:none; color:inherit; display:block;}
.cat-canvas{height:220px; overflow:hidden;}
.cat-canvas svg{width:100%; height:100%; display:block;}
.cat-plate{padding:16px 18px; font-family:var(--font-label); font-size:11px;}
.cat-plate .artist{font-weight:500; text-transform:uppercase; letter-spacing:0.03em; font-size:11.5px;}
.cat-plate .title{font-style:italic; color:var(--ink-soft); margin-top:3px; font-family:var(--font-body); font-size:13px;}
.cat-plate .meta{display:flex; justify-content:space-between; margin-top:10px; color:var(--ink-soft);}
.avail{color:#3B6D11;}
.onloan{color:var(--oxblood);}
.reserved{color:var(--brass);}

/* FILTER BAR (catalogue page) */
.filters{
  display:flex; gap:10px; flex-wrap:wrap; padding:0 40px 40px; max-width:1180px; margin:0 auto;
}
.filter-chip{
  font-family:var(--font-label); font-size:12px; padding:8px 16px; border:1px solid var(--stone-line);
  background:var(--wall); color:var(--ink-soft); text-decoration:none;
}
.filter-chip.active{background:var(--ink); color:var(--wall); border-color:var(--ink);}

/* TRUST */
.trust{display:grid; grid-template-columns:repeat(3,1fr); gap:44px;}
.trust-item{border-left:2px solid var(--brass); padding-left:20px;}
.trust-item h3{font-size:19px; margin-bottom:8px;}
.trust-item p{font-size:14px; color:var(--ink-soft); font-weight:300;}

/* CTA SPLIT */
.cta-split{display:grid; grid-template-columns:1fr 1fr; max-width:1180px; margin:0 auto; border-top:1px solid var(--stone-line);}
.cta-panel{padding:70px 50px;}
.cta-panel:first-child{border-right:1px solid var(--stone-line);}
.cta-panel .section-eyebrow{margin-bottom:14px;}
.cta-panel h3{font-size:28px; margin-bottom:14px;}
.cta-panel p{font-size:14.5px; color:var(--ink-soft); margin-bottom:26px; font-weight:300; max-width:340px;}

/* CONTACT */
.contact{
  border-top:1px solid var(--stone-line); padding:80px 40px; max-width:1180px; margin:0 auto;
  display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px;
}
.contact-card{background:var(--card); border:1px solid var(--stone-line); padding:32px 34px;}
.contact-card .artist{font-family:var(--font-label); font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--brass); margin-bottom:6px;}
.contact-card h3{font-size:24px; margin-bottom:22px;}
.contact-row{display:flex; gap:14px; padding:12px 0; border-top:1px solid var(--stone-line); font-size:14px;}
.contact-row:first-of-type{border-top:none;}
.contact-row .k{font-family:var(--font-label); font-size:11px; color:var(--stone); text-transform:uppercase; width:80px; flex-shrink:0; padding-top:2px;}
.contact-row a{text-decoration:none;}

/* FORMS */
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.field{display:flex; flex-direction:column; gap:8px; margin-bottom:20px;}
.field.full{grid-column:1 / -1;}
.field label{font-family:var(--font-label); font-size:11px; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-soft);}
.field input, .field select, .field textarea{
  border:1px solid var(--stone-line); background:var(--card); padding:12px 14px;
  font-family:var(--font-body); font-size:14px; color:var(--ink);
}
.field textarea{resize:vertical; min-height:110px;}
.field input:focus, .field select:focus, .field textarea:focus{outline:1px solid var(--ink);}
form .btn-primary{border:none; cursor:pointer; margin-top:6px;}

/* TIMELINE (comment ça marche, propriétaires) */
.timeline{display:flex; flex-direction:column; gap:0;}
.tl-item{display:grid; grid-template-columns:90px 1fr; gap:24px; padding:28px 0; border-top:1px solid var(--stone-line);}
.tl-item:last-child{border-bottom:1px solid var(--stone-line);}
.tl-num{font-family:var(--font-display); font-size:28px; color:var(--brass);}
.tl-item h3{font-size:19px; margin-bottom:6px;}
.tl-item p{font-size:14.5px; color:var(--ink-soft); font-weight:300; max-width:520px;}

/* DETAIL PAGE (fiche œuvre) */
.detail{display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; max-width:1180px; margin:0 auto; padding:64px 40px 96px;}
.detail-visual{border:10px solid #2A2622; box-shadow:0 18px 34px rgba(27,24,21,0.16);}
.detail-visual svg{width:100%; height:auto; display:block;}
.detail-info .section-eyebrow{margin-bottom:12px;}
.detail-info h1{font-size:34px; margin-bottom:6px;}
.detail-artist{font-family:var(--font-label); font-size:13px; color:var(--ink-soft); text-transform:uppercase; letter-spacing:0.04em; margin-bottom:24px;}
.spec-table{width:100%; margin-bottom:28px;}
.spec-table tr{border-top:1px solid var(--stone-line);}
.spec-table tr:last-child{border-bottom:1px solid var(--stone-line);}
.spec-table td{padding:12px 0; font-size:14px;}
.spec-table td:first-child{font-family:var(--font-label); font-size:11px; text-transform:uppercase; color:var(--stone); width:140px;}
.status-banner{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--font-label); font-size:12px;
  padding:8px 14px; border:1px solid var(--stone-line); margin-bottom:28px;
}
.detail-ctas{display:flex; gap:14px; flex-wrap:wrap;}

/* LEGAL */
.legal{max-width:760px; margin:0 auto; padding:64px 40px 96px;}
.legal h2{font-size:22px; margin:36px 0 12px;}
.legal p, .legal li{font-size:14.5px; color:var(--ink-soft); font-weight:300; margin-bottom:12px;}
.legal ul{padding-left:20px;}

footer{
  border-top:1px solid var(--stone-line); padding:28px 40px; max-width:1180px; margin:0 auto;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px;
  font-family:var(--font-label); font-size:11px; color:var(--stone);
}
footer a{color:var(--stone); text-decoration:none;}
footer .foot-links{display:flex; gap:18px;}

@media (max-width:860px){
  .hero{grid-template-columns:1fr; padding:50px 24px;}
  .salon{display:none;}
  h1{font-size:38px;}
  .stats{grid-template-columns:repeat(2,1fr);}
  .steps, .cat-grid, .trust, .cta-split, .contact, .detail, .form-grid{grid-template-columns:1fr;}
  nav, .section, .catalogue, footer, .contact, .page-hero, .filters{padding-left:24px; padding-right:24px;}
  .cta-panel:first-child{border-right:none; border-bottom:1px solid var(--stone-line);}
  .nav-links{display:none;}
}