/* ATREZZO — McBride Home mobile: quieter hero, full-bleed service chapters.
   Desktop and tablet styles are intentionally untouched.
   Preserves the existing natural vertical sticky progression and imagery. */
@media (max-width:640px) {
  /* The next section already tells the family story. Keep heritage/CTA visible. */
  .hero .hero-story > .hero-description {
    display:none;
  }

  /* Remove the card frame: use the entire available viewport width. */
  .services .services-story {
    display:block;
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
    overflow:visible;
    isolation:isolate;
  }

  /* Keep every frame between the sticky header and the fixed call bar. */
  .services .services-story > .service-scene {
    display:block;
    position:-webkit-sticky;
    position:sticky;
    top:71px;
    width:100%;
    max-width:none;
    height:clamp(350px,calc(100svh - 145px - env(safe-area-inset-bottom,0px)),850px);
    min-height:0;
    margin:0 0 clamp(80px,17svh,155px);
    border-radius:0;
    box-shadow:none;
    overflow:hidden;
    scroll-margin-top:71px;
    outline-offset:-4px;
  }
  .services .services-story > .service-scene:nth-child(6) {
    margin-bottom:0;
  }

  .services .service-scene-photo {
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:var(--scene-mobile-position,var(--scene-position,center));
  }
  .services .service-scene-body {
    padding:clamp(20px,5vw,32px) clamp(22px,6vw,32px) clamp(27px,7vw,38px);
  }
  .services .service-scene-top {
    inset:20px clamp(22px,6vw,32px) auto;
  }
  .services .service-scene-shade {
    background:linear-gradient(180deg,
      rgba(9,16,13,.40) 0%,
      rgba(9,20,15,.04) 25%,
      rgba(7,21,16,.34) 52%,
      rgba(5,18,13,.92) 100%);
  }

  /* Unframed presentation; keyboard focus stays clearly visible. */
  .services .services-story > .service-scene:focus-visible {
    outline:3px solid #bde7c9;
    outline-offset:-4px;
  }
}

/* Short-height mobile viewports: do not let a sticky image trap/cover content. */
@media (max-width:640px) and (max-height:540px) {
  .services .services-story > .service-scene {
    position:relative;
    top:auto;
    height:clamp(350px,100svh,530px);
    margin-bottom:16px;
  }
  .services .services-story > .service-scene:nth-child(6) {
    margin-bottom:0;
  }
}

/* Honor reduced-motion preferences: photographs remain fully readable. */
@media (max-width:640px) and (prefers-reduced-motion:reduce) {
  .services .services-story > .service-scene {
    position:relative;
    top:auto;
    margin-bottom:16px;
  }
  .services .services-story > .service-scene:nth-child(6) {
    margin-bottom:0;
  }
  .services .service-scene-photo,
  .services .service-scene-action {
    transform:none!important;
    transition:none!important;
  }
}