/* Ateliers — papier et photo. Scoped to the introduction only. */
.ateliers-intro {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #f6f0e6;
  padding: clamp(52px, 6vw, 100px) 4.3vw clamp(56px, 6vw, 100px);
}
.ateliers-art {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
.ateliers-art-photo {
  position: absolute;
  right: 0;
  top: 0;
  width: 48%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 0% 50%;
  filter: saturate(.78) contrast(.94);
}
.ateliers-art-paper {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
}
.ateliers-intro > .kicker,
.ateliers-intro > h1,
.ateliers-intro > .ateliers-lead {
  width: 58%;
  max-width: 890px;
}
.ateliers-intro h1 {
  font-size: clamp(60px, 7.5vw, 126px);
  line-height: 1.02;
  letter-spacing: -.055em;
  margin: 18px 0 26px;
}
.ateliers-intro .ateliers-lead {
  font-size: clamp(18px, 1.45vw, 24px);
  line-height: 1.55;
}
.ateliers-intro .ateliers-lead p { margin: 0 0 24px; }
.ateliers-intro .kicker { font-size: clamp(12px, .9vw, 15px); }
.ateliers-intro .btn { margin-top: 5px; padding: 16px 25px; font-size: clamp(14px, 1.2vw, 20px); }
.ateliers-intro .btn:focus-visible { outline: 3px solid #101820; outline-offset: 5px; }
@media (min-width: 1800px) {
  .ateliers-intro { padding-left: max(4.3vw, calc((100vw - 1720px) / 2)); }
}
@media (max-width: 1000px) {
  .ateliers-intro {
    padding: 44px 24px 240px;
    background: #f6f0e6 url('/assets/ateliers-papier-20261024.png') left top / 240% auto repeat-y;
  }
  .ateliers-intro > .kicker,
  .ateliers-intro > h1,
  .ateliers-intro > .ateliers-lead { width: 100%; max-width: 720px; }
  .ateliers-intro h1 { font-size: clamp(48px, 8.8vw, 76px); margin: 18px 0 25px; }
  .ateliers-intro .ateliers-lead { font-size: 18px; line-height: 1.6; }
  .ateliers-art { top: auto; height: 420px; }
  .ateliers-art-photo { width: 100%; height: 210px; top: auto; bottom: 0; object-position: 50% 30%; }
  .ateliers-art-paper {
    inset: auto;
    left: 100%;
    top: 0;
    width: 420px;
    height: 100vw;
    transform: rotate(90deg);
    transform-origin: top left;
  }
}
@media (max-width: 480px) {
  .ateliers-intro { padding: 38px 22px 230px; }
  .ateliers-intro .kicker { font-size: 10px; letter-spacing: .09em; }
  .ateliers-intro .ateliers-lead { font-size: 17px; line-height: 1.6; }
  .ateliers-intro .ateliers-lead p { margin-bottom: 20px; }
}
