/* Acier brossé : textures légères sans image ni téléchargement supplémentaire. */
:root {
  --ink: #191e22;
  --paper: #e8edf0;
  --sand: #ddb181;
  --cream: #c4cbd1;
  --muted: #38434d;
  --line: #9da8b1;
  --wood: #683b1e;
  --focus: #683b1e;
  --steel: #242c32;
  --warm-panel: #b9c2c9;
  --muted-on-dark: #c5cdd3;
  --border-strong: #52606b;
  --steel-grain: repeating-linear-gradient(0deg, #f2f5f60c 0, #f2f5f60c 1px, #26333d0a 1px, #26333d0a 3px);
  --steel-sheen: linear-gradient(112deg, #bac3cb 0%, #d4dade 23%, #c5cdd4 45%, #dce1e5 67%, #b8c1c9 86%, #cdd4da 100%);
  --steel-dark-sheen: linear-gradient(115deg, #171d21 0%, #303a42 54%, #1b2227 100%);
}

body {
  background-color: #c5cdd4;
  background-image: var(--steel-grain), var(--steel-sheen);
}

.header,
.mobile-nav,
.footer-logo-panel,
.stair-emblem-panel {
  background-color: #c5cdd4;
  background-image: var(--steel-grain), var(--steel-sheen);
  isolation: isolate;
}

.brand-logo,
.stair-emblem {
  mix-blend-mode: multiply;
}

.service-ribbon,
.collection,
.audiences,
.devis-panel,
.preferences-summary {
  background-color: var(--cream);
  background-image: var(--steel-grain), linear-gradient(115deg, #b9c2c9, #d0d7dc 52%, #bec7cf);
}

.reference-card,
.quote-form,
dialog {
  background-color: #d0d7dd;
  background-image: var(--steel-grain), linear-gradient(115deg, #c4ccd3, #dce1e5 58%, #cad2d9);
}

.reference-card {
  box-shadow: inset 0 1px 0 #eef2f4bb, 0 2px 5px #171d2112;
}

.reference-card .product-photo,
.product-dialog-image-frame {
  background-color: #ccd4da;
  background-image: var(--steel-grain), var(--steel-sheen);
  isolation: isolate;
}

.product-photo img,
.product-dialog-image-frame img {
  mix-blend-mode: multiply;
}

.hero,
.contact,
.footer {
  background-color: var(--ink);
  background-image: var(--steel-grain), var(--steel-dark-sheen);
}

.hero-brief {
  background-color: var(--steel);
  background-image: var(--steel-grain), linear-gradient(115deg, #242c32, #303a42 55%, #20282e);
}

.hero .eyebrow {
  color: var(--sand);
}

.hero :focus-visible,
.contact :focus-visible,
.footer :focus-visible {
  outline-color: var(--sand);
}

.quote-form :focus-visible {
  outline-color: var(--focus);
}

.step-number {
  color: var(--wood);
}