/* ADR 025 — Page éditoriale Le Carton. */
.material-page { background: #f1ede5; color: #24221f; }
.material-page::before { display: none; }
html[data-active-page="carton"] .material-page .site-header { --site-header-color: #24221f; --site-header-muted: #625c54; --site-header-panel: #f1ede5; background: rgba(241,237,229,.97); }
.material-main { --material-gutter: clamp(1.5rem, 5vw, 6rem); }
.material-breadcrumb { display: flex; align-items: center; gap: 1.5rem; padding: 7.5rem var(--material-gutter) 1.5rem; font-size: .875rem; }
.material-breadcrumb a { text-decoration: none; color: #625c54; padding-block: .5rem; }
.material-breadcrumb a:hover { text-decoration: underline; }
.material-breadcrumb span { border-left: 1px solid #24221f33; padding-left: 1.5rem; }
.material-hero { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); min-height: 36rem; }
.material-hero__copy { align-self: center; padding: 3.5rem var(--material-gutter) 4rem; }
.material-eyebrow { margin: 0 0 2rem; color: #6b6258; font: 400 .875rem/1.5 var(--font-sans-stack); }
.material-page h1, .material-page h2, .material-page h3 { font-family: var(--font-sans-stack); font-weight: 400; }
.material-page h1 { margin: 0; font-size: clamp(3.5rem, 6.3vw, 7rem); line-height: 1.03; letter-spacing: -.05em; }
.material-hero__statement { margin: 2rem 0 1rem; font-size: clamp(1.375rem, 2vw, 2rem); line-height: 1.3; letter-spacing: -.02em; }
.material-hero__copy > p:not([class]) { max-width: 29rem; color: #625c54; font-size: 1.0625rem; line-height: 1.75; }
.material-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 44px; text-decoration: none; font-size: .9375rem; }
.material-link:hover { text-decoration: underline; text-underline-offset: .25em; }
.material-hero__copy > .material-link { margin-top: 1.5rem; }
.material-hero__visual { position: relative; margin: 0; overflow: hidden; background: #e6dfd5; }
.material-hero__visual img { position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; }
.material-section { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(2rem, 6vw, 7rem); padding: clamp(4rem, 8vw, 8rem) var(--material-gutter); scroll-margin-top: 6rem; }
.material-page h2 { margin: 0; font-size: clamp(2.25rem, 3.6vw, 4rem); line-height: 1.08; letter-spacing: -.04em; }
.material-process { background: #faf8f3; }
.material-process__steps { display: grid; gap: 2.5rem; }
.material-process__steps article { display: grid; grid-template-columns: 2rem minmax(0,1fr); gap: 1rem; }
.material-step-number { padding-top: .35rem; font-size: .8125rem; color: #8c8072; }
.material-page h3 { margin: 0 0 .75rem; font-size: 1.375rem; letter-spacing: -.02em; }
.material-process__steps p, .material-facts dd { margin: 0; max-width: 34rem; font-size: 1rem; line-height: 1.75; color: #625c54; }
.material-facts { display: grid; gap: 2.5rem; margin: 0; }
.material-facts dt { margin-bottom: .75rem; font-size: 1.375rem; letter-spacing: -.02em; }
.material-invitation { padding: clamp(4rem, 7vw, 7rem) var(--material-gutter); background: #e1d8ca; text-align: center; }
.material-invitation__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1rem 2.5rem; margin-top: 2.5rem; }
.material-button { display: inline-flex; gap: 2rem; align-items: center; justify-content: center; padding: 1rem 1.5rem; min-height: 48px; background: #24221f; color: #faf8f3; text-decoration: none; font-size: .9375rem; }
.material-button:hover { background: #494138; }
.material-footer { display: flex; justify-content: space-between; gap: 2rem; padding: 2rem clamp(1.5rem, 5vw, 6rem); font-size: .875rem; }
.material-footer a { text-decoration: none; }
@media (max-width: 800px) {
  .material-breadcrumb { padding-top: 6rem; gap: 1rem; }
  .material-breadcrumb span { padding-left: 1rem; }
  .material-hero { grid-template-columns: 1fr; min-height: 0; }
  .material-hero__copy { padding-block: 2.5rem 3rem; }
  .material-hero__visual { aspect-ratio: 4 / 3; }
  .material-section { grid-template-columns: 1fr; gap: 3rem; }
  .material-invitation__actions { flex-direction: column; }
}