/* Page Démarche artistique. Base commune dans interieur.css. */
.epigraph { margin-top: 28px; }
.epigraph blockquote { font-size: clamp(32px, 3.3vw, 52px); font-style: italic; line-height: 1.08; letter-spacing: -.02em; text-wrap: balance; }
.epigraph figcaption { margin-top: 20px; font-family: var(--sans); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--stone); }
.epigraph figcaption::before { content: ''; display: block; width: 26px; height: 1px; background: currentColor; margin-bottom: 14px; opacity: .6; }
.demarche-opening img { aspect-ratio: 1600 / 1196; }

.demarche-body { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: clamp(32px, 6vw, 110px); padding-block: clamp(24px, 3vw, 48px) clamp(56px, 7vw, 100px); border-top: 1px solid #182b3926; }
.demarche-aside { display: grid; align-content: start; gap: 34px; padding-top: 30px; }
.demarche-aside ul { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; font-size: 19px; }
.palette li { display: flex; align-items: center; gap: 12px; }
.palette i { width: 26px; height: 16px; border-radius: 2px; border: 1px solid #182b3926; transform: rotate(-3deg); }
.gestures li { font-style: italic; }
.demarche-prose { max-width: 64ch; display: grid; gap: 18px; padding-top: 26px; font-size: clamp(19px, 1.4vw, 21px); line-height: 1.5; }
.demarche-lead { font-size: clamp(24px, 2vw, 30px); line-height: 1.3; letter-spacing: -.01em; }

.demarche-band { margin: 0; }
.demarche-band img { width: 100%; height: clamp(320px, 42vw, 620px); object-fit: cover; object-position: center 60%; }

.demarche-closing { display: grid; justify-items: center; gap: 32px; padding-block: clamp(56px, 7vw, 100px); text-align: center; }
.demarche-prose-single { max-width: 60ch; font-size: clamp(19px, 1.4vw, 21px); line-height: 1.5; color: var(--stone); }
.demarche-final { max-width: 30ch; font-size: clamp(30px, 3.1vw, 48px); font-style: italic; line-height: 1.15; letter-spacing: -.02em; color: var(--blue); text-wrap: balance; }
.demarche-signature { font-family: var(--handwritten); font-size: clamp(26px, 2.2vw, 34px); color: var(--rust); transform: rotate(-4deg); }

@media (max-width: 1000px) {
  .demarche-body { grid-template-columns: 1fr; gap: 8px; }
  .demarche-aside { grid-template-columns: 1fr 1fr; order: 2; padding-top: 32px; border-top: 1px solid #182b3926; margin-top: 24px; }
}
@media (max-width: 700px) {
  .demarche-aside { grid-template-columns: 1fr; gap: 26px; }
}