#deroulement.home-process-section {
  padding-top: 76px;
  padding-bottom: 76px;
  overflow: visible;
  background: #f7fbfd;
  color: #0a1628;
}
.home-process-section *, .home-process-section *::before, .home-process-section *::after {
  box-sizing: border-box;
  letter-spacing: 0;
}
.home-process-section .process-timeline-intro { max-width: none; margin: 0 0 28px; }
.home-process-section .process-timeline-intro .kicker { margin-bottom: 16px; color: #37647d; font-size: 12px; opacity: 1; }
.home-process-section .process-timeline-intro h2 { margin: 0; color: #0a1628; font-size: 42px; font-weight: 300; line-height: 1.12; }
.home-process-content { min-width: 0; }
.home-process-story { position: relative; z-index: 4; width: 100%; max-width: 1040px; margin-inline: auto; }
.home-process-sticky { display: none; }
.home-process-section .process-timeline { margin-top: 0; }
.home-process-section .process-track { left: 23px; }
.home-process-section .process-step,
.home-process-section .process-step:first-of-type {
  grid-template-columns: 56px minmax(0, 1fr);
  align-items: center;
  gap: 24px;
  min-height: 0;
  padding: 38px 0;
}
.home-process-section .process-step:first-of-type { padding-top: 12px; }
.home-process-section .process-step .process-marker,
.home-process-section .process-step .process-step-copy { align-self: center; margin-top: 0; }
.home-process-section .process-marker { width: 48px; height: 48px; }
.home-process-section .process-step-copy { max-width: 480px; min-width: 0; }
.home-process-section .process-phase { margin-bottom: 14px; font-size: 12px; }
.home-process-section .process-step h3 { font-size: 30px; line-height: 1.16; }
.home-process-section .process-step p { margin: 16px 0 0; font-size: 17px; line-height: 1.65; }
.home-process-section .process-step-media { grid-column: 2; width: 100%; max-width: 360px; margin: 0 auto; aspect-ratio: 3 / 2; }

@media (min-width: 981px) {
  .site-main { overflow: visible; }
  .home-process-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 420px); gap: 48px; align-items: start; }
  .home-process-section .process-step,
  .home-process-section .process-step:first-of-type { min-height: clamp(290px, 43svh, 400px); padding: 44px 0; }
  .home-process-section .process-step-media { display: none; }
  .home-process-sticky {
    --process-media-width: 420px;
    position: sticky;
    top: max(112px, calc(50svh - var(--process-media-width) / 3));
    align-self: start;
    justify-self: center;
    display: block;
    width: min(100%, var(--process-media-width), calc((100svh - 160px) * 1.5));
    aspect-ratio: 3 / 2;
    margin-top: 32px;
    overflow: hidden;
    border-radius: 8px;
    background: #dce9e8;
    box-shadow: 0 18px 48px rgba(7, 67, 59, .13);
  }
  .home-process-story-image { position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden; transform: scale(1.025); transition: opacity .58s ease, visibility .58s ease, transform .8s cubic-bezier(.16, 1, .3, 1); }
  .home-process-story-image.is-active { z-index: 2; opacity: 1; visibility: visible; transform: scale(1); }
  .home-process-story-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .home-process-story-image::after { content: ""; position: absolute; inset: auto 0 0; height: 42%; background: linear-gradient(180deg, rgba(5, 24, 30, 0), rgba(5, 24, 30, .74)); pointer-events: none; }
  .home-process-story-image figcaption { position: absolute; z-index: 2; left: 22px; right: 22px; bottom: 22px; display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 12px; color: #fff; }
  .home-process-story-image figcaption span { font-size: 11px; font-weight: 600; text-transform: uppercase; }
  .home-process-story-image figcaption strong { font-size: 24px; line-height: 1.1; font-weight: 400; }
}
@media (max-width: 1100px) {
  .home-process-section .process-timeline-intro h2 { font-size: 36px; }
  .home-process-section .process-step h3 { font-size: 28px; }
}
@media (min-width: 981px) and (max-width: 1100px) {
  .home-process-story { grid-template-columns: minmax(0, 1fr) minmax(260px, 340px); gap: 34px; }
  .home-process-sticky { --process-media-width: 340px; }
}
@media (max-width: 820px) {
  #deroulement.home-process-section { padding-top: 58px; padding-bottom: 58px; }
  .home-process-section .process-step p { font-size: 16px; }
}
@media (max-width: 560px) {
  .home-process-section .process-timeline-intro h2 { font-size: 32px; }
  .home-process-section .process-step,
  .home-process-section .process-step:first-of-type { grid-template-columns: 40px minmax(0, 1fr); gap: 14px; padding: 30px 0; }
  .home-process-section .process-step:first-of-type { padding-top: 10px; }
  .home-process-section .process-track { left: 18px; }
  .home-process-section .process-marker { width: 38px; height: 38px; }
  .home-process-section .process-step h3 { font-size: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-process-story-image { transform: none; transition: none; }
}
