.qm-pds{
  position:relative;
  height:var(--qm-section-vh,260vh);
  width:100%;
  overflow:clip;
}
.qm-pds__sticky{
  position:sticky;
  top:0;
  height:100vh;
  overflow:hidden;
}
.qm-pds__stage{
  position:relative;
  height:100%;
  max-width:1440px;
  margin:0 auto;
}
.qm-pds__center{
  position:absolute;
  inset:0;
  z-index:5;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  pointer-events:none;
  padding:var(--qm-center-top,200px) 24px 32px;
}
.qm-pds__center-inner{
  width:100%;
  max-width:560px;
  pointer-events:auto;
}
.qm-pds__eyebrow{margin:0 0 18px;font-size:13px;letter-spacing:.12em;text-transform:uppercase}
.qm-pds__title{margin:0 0 24px;line-height:1.03;font-size:clamp(38px,4.2vw,72px);font-weight:400}
.qm-pds__body{font-size:16px;line-height:1.65}
.qm-pds__button{display:inline-flex;margin-top:22px;text-decoration:none;border:1px solid currentColor;border-radius:999px;padding:12px 22px}
.qm-pds__track{
  position:absolute;
  top:0;
  bottom:0;
  width:31%;
  z-index:3;
  display:flex;
  flex-direction:column;
  gap:var(--qm-gap,170px);
  will-change:transform;
  padding-top:92vh;
}
.qm-pds__track--left{left:0;align-items:flex-start;padding-left:2.5vw}
.qm-pds__track--right{right:0;align-items:flex-end;padding-right:2.5vw;padding-top:110vh}
.qm-pds__item{
  width:var(--qm-w,300px);
  height:var(--qm-h,380px);
  max-width:92%;
  flex:0 0 auto;
  transform:translateX(var(--qm-x,0px));
}
.qm-pds__mask{width:100%;height:100%;overflow:hidden;clip-path:inset(100% 0 0 0);will-change:clip-path}
.qm-pds[data-qm-reveal="0"] .qm-pds__mask{clip-path:inset(0)}
.qm-pds__mask img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.06);will-change:transform}

@media (max-width:1024px){
  .qm-pds__track{width:34%;}
  .qm-pds__center-inner{max-width:440px}
  .qm-pds__item{max-width:86%}
}
@media (max-width:767px){
  .qm-pds{height:auto;overflow:visible}
  .qm-pds__sticky{position:relative;height:auto;overflow:visible}
  .qm-pds__stage{display:flex;flex-direction:column;gap:28px;padding:70px 20px}
  .qm-pds__center{position:relative;order:1;padding:0}
  .qm-pds__track{position:relative;inset:auto;width:100%;transform:none!important;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .qm-pds__track--left{order:2;padding:0}
  .qm-pds__track--right{order:3;padding:0}
  .qm-pds__item{width:100%!important;height:auto!important;aspect-ratio:4/5;max-width:none;transform:none!important}
  .qm-pds__mask{clip-path:inset(0)!important}
}

/* Service title attached to each scrolling image */
.qm-pds__item-title{
  width:100%;
  margin:0;
  font-size:18px;
  line-height:1.2;
  font-weight:500;
}
.qm-pds__item-title a{
  color:inherit;
  text-decoration:none;
}
.qm-pds__item-title a:hover{
  text-decoration:underline;
  text-underline-offset:.18em;
}
.qm-pds__item--title-above .qm-pds__item-title{margin-bottom:var(--qm-title-gap,14px)}
.qm-pds__item--title-below .qm-pds__item-title{margin-top:var(--qm-title-gap,14px)}

@media (max-width:767px){
  .qm-pds__item-title{font-size:16px}
}

/* Decorative side palms inspired by Mariven.
   Uses a horizontal transparent PNG, clipped by the section edges. */
.qm-pds{
  --qm-palm-opacity:.28;
  --qm-palm-blur:10px;
  --qm-palm-width:650px;
  --qm-palm-offset:285px;
  --qm-palm-left-top:18%;
  --qm-palm-right-top:58%;
  --qm-palm-shift:0px;
}
.qm-pds__palm{
  position:absolute;
  z-index:1;
  pointer-events:none;
  width:var(--qm-palm-width);
  max-width:none;
  opacity:var(--qm-palm-opacity);
  filter:blur(var(--qm-palm-blur));
  will-change:transform;
  line-height:0;
}
.qm-pds[data-qm-palms="0"] .qm-pds__palm{display:none}
.qm-pds__palm img{
  display:block;
  width:100%;
  height:auto;
  max-width:none;
  user-select:none;
  -webkit-user-drag:none;
}
.qm-pds__palm--left{
  left:calc(var(--qm-palm-offset) * -1);
  top:var(--qm-palm-left-top);
  transform:translate3d(0,var(--qm-palm-shift),0);
  transform-origin:left center;
}
.qm-pds__palm--right{
  right:calc(var(--qm-palm-offset) * -1);
  top:var(--qm-palm-right-top);
  transform:translate3d(0,calc(var(--qm-palm-shift) * -0.72),0) scaleX(-1);
  transform-origin:right center;
}
@media (max-width:1024px){
  .qm-pds{
    --qm-palm-width:500px;
    --qm-palm-offset:230px;
  }
}
@media (max-width:767px){
  .qm-pds__palm{display:none!important}
}

/* =========================================================
   0.2.3 · Mobile/tablet responsive refinement
   ========================================================= */
@media (max-width:767px){
  .qm-pds{height:auto!important;overflow:visible}
  .qm-pds__sticky{position:relative;height:auto;overflow:visible}
  .qm-pds__stage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:52px 18px 30px;max-width:100%}
  .qm-pds__center{position:relative;inset:auto;grid-column:1/-1;order:1;padding:0 0 20px;display:block}
  .qm-pds__center-inner{max-width:none!important;width:100%}
  .qm-pds__track{display:contents!important;position:static!important;width:auto!important;transform:none!important;padding:0!important}
  .qm-pds__item{position:relative;width:100%!important;height:auto!important;aspect-ratio:4/5;max-width:none!important;transform:none!important;min-width:0}
  .qm-pds__mask{height:100%;clip-path:inset(0)!important}
  .qm-pds__mask img{transform:none!important}
  .qm-pds__item-title{font-size:14px;line-height:1.15;margin-top:8px!important;margin-bottom:8px!important}
  .qm-pds__eyebrow{font-size:10px;margin-bottom:10px}
  .qm-pds__title{font-size:clamp(30px,9vw,42px);line-height:1.02;margin-bottom:14px}
  .qm-pds__body{font-size:14px;line-height:1.5}
}

@media (min-width:768px) and (max-width:1024px){
  .qm-pds__stage{max-width:100%;padding:0 20px}
  .qm-pds__center{padding-left:18px;padding-right:18px}
  .qm-pds__center-inner{max-width:390px}
  .qm-pds__track{width:32%}
  .qm-pds__item{max-width:82%}
}


/* =========================================================
   0.3.5 · MOBILE NARRATIVE — dedicated mobile image source
   Dedicated server-rendered mobile markup. No cloned nodes,
   no absolute card positioning and no JS-driven card travel.
   Desktop/tablet behavior above remains unchanged.
   ========================================================= */
.qm-pds__mobile-narrative{display:none}

@media (max-width:767px){
  .qm-pds[data-qm-mobile-narrative="1"]{
    height:auto!important;
    overflow:visible!important;
  }

  /* Hide only the desktop animation structure. */
  .qm-pds[data-qm-mobile-narrative="1"] > .qm-pds__sticky{
    display:none!important;
  }

  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-narrative{
    display:block!important;
    position:relative;
    width:100%;
    overflow:visible;
    background:inherit;
  }

  /* One viewport of intro. It stays pinned while the first cards enter. */
  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-intro-sticky{
    position:sticky;
    top:0;
    z-index:2;
    height:100svh;
    min-height:100vh;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    padding:0 var(--qm-mobile-side-padding,18px);
    pointer-events:none;
  }

  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-intro{
    width:100%;
    max-width:none!important;
    margin-top:var(--qm-mobile-intro-y,42%);
    transform:translateY(-50%);
    will-change:opacity,transform;
    pointer-events:auto;
  }

  /* Normal document flow: this is the key reliability change. */
  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-flow{
    position:relative;
    z-index:4;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:var(--qm-mobile-column-gap,14px);
    row-gap:var(--qm-mobile-row-gap,34px);
    padding:
      calc(var(--qm-mobile-images-start,16) * 1vh)
      var(--qm-mobile-side-padding,18px)
      max(48px,env(safe-area-inset-bottom));
    margin-top:-100svh;
    padding-top:calc(100svh + (var(--qm-mobile-images-start,16) * 1vh));
  }

  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-card{
    position:relative;
    min-width:0;
    width:100%;
    opacity:1;
    visibility:visible!important;
    transform:none;
    transform-origin:50% 50%;
    will-change:transform,opacity;
  }

  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-card:nth-child(even){
    margin-top:var(--qm-mobile-stagger,72px);
  }

  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-card .qm-pds__mask{
    width:100%;
    height:var(--qm-mobile-card-height,190px)!important;
    overflow:hidden;
    clip-path:none!important;
  }

  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-card .qm-pds__mask img{
    display:block!important;
    position:static!important;
    width:100%!important;
    max-width:none!important;
    height:100%!important;
    opacity:1!important;
    visibility:visible!important;
    object-fit:cover;
    transform:none!important;
  }

  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-card .qm-pds__item-title{
    font-size:14px;
    line-height:1.15;
    margin-top:8px!important;
    margin-bottom:8px!important;
  }

  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-card--last-center{
    grid-column:1 / -1;
    width:calc((100% - var(--qm-mobile-column-gap,14px)) / 2);
    justify-self:center;
    margin-top:0!important;
  }

  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-card--last-full{
    grid-column:1 / -1;
    width:100%;
    justify-self:stretch;
    margin-top:0!important;
  }

  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__palm{display:none!important}
}

@media (prefers-reduced-motion:reduce) and (max-width:767px){
  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-card{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
  .qm-pds[data-qm-mobile-narrative="1"] .qm-pds__mobile-intro{
    transform:translateY(-50%)!important;
  }
}