/* ADR 036 — La Maison, dans le système des pages éditoriales. */
html[data-active-page="maison"] .maison-page .site-header { --site-header-color: #24221f; --site-header-muted: #625c54; --site-header-panel: #f1ede5; background: rgba(241, 237, 229, .97); }
.maison-skip { position: fixed; top: -5rem; left: 1rem; z-index: 1000; padding: 1rem; background: #24221f; color: #fff; }
.maison-skip:focus { top: 1rem; }
.maison-page a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.maison-hero { align-items: center; }
.maison-hero__visual { margin: 0; padding: 0 var(--material-gutter) 3rem 0; }
.maison-hero__visual img { display: block; width: 100%; height: auto; max-height: 42rem; object-fit: contain; }
.maison-principles { display: grid; gap: 2.5rem; }
.maison-principles p, .maison-territories p { max-width: 34rem; margin: 0; color: #625c54; font-size: 1rem; line-height: 1.75; }
.maison-atelier { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; padding-block: clamp(3rem, 5vw, 5rem); }
.maison-atelier__visual { margin: 0; }
.maison-atelier__visual img, .maison-atelier__visual video { display: block; width: 100%; height: auto; }
.maison-atelier__copy { padding: 2rem var(--material-gutter); }
.maison-atelier__copy > p:not([class]) { max-width: 30rem; color: #625c54; font-size: 1rem; line-height: 1.75; margin: 1.5rem 0; }
.maison-collections { background: #faf8f3; }
.maison-territories { display: grid; gap: 2rem; }
.maison-territories > a { position: relative; display: block; padding-right: 2rem; text-decoration: none; }
.maison-territories h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem 1rem; }
.maison-territories h3 span { color: #625c54; font-size: .875rem; letter-spacing: 0; }
.maison-territories > a:hover h3 { text-decoration: underline; text-underline-offset: .25em; }
.maison-territories__arrow { position: absolute; right: 0; top: .25rem; }
.maison-page .material-footer { flex-wrap: wrap; }
@media (max-width: 800px) {
  .maison-hero__visual { padding: 0 var(--material-gutter) 3rem; }
  .maison-hero__visual img { max-height: none; }
  .maison-atelier { grid-template-columns: 1fr; padding-block: 0; }
  .maison-atelier__copy { padding-block: 3rem; }
  .maison-page h1 { font-size: clamp(2.7rem, 10vw, 4.5rem); }
}
