/* Home only. Natural mobile flow; the existing desktop composition is retained. */
@media (max-width:782px) {
  html:has(body.an-home-mobile-flow),
  html body.an-home-mobile-flow {
    scroll-snap-type:none!important;
    scroll-behavior:auto!important;
    scroll-padding-top:0!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-site-blocks,
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-post-content,
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-post-content > .wp-block-cover,
  body.an-home-mobile-flow footer.wp-block-template-part {
    scroll-snap-type:none!important;
    scroll-snap-align:none!important;
    scroll-snap-stop:normal!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover > .an-home-scroll-cue,
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover > .an-home-slide-brand,
  body.an-home-mobile-flow:is(.home,.front-page) .an-home-final-action a > span[aria-hidden="true"] {
    display:none!important;
  }

  /* One continuous backdrop for the story, rather than restarting the same
     texture at the boundary between necklace and watch-ring sections. The
     opaque hero keeps its own original artwork; the backdrop fades to the
     existing page colour before the footer. */
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-post-content:has(> .story-form):has(.time-open) {
    position:relative;isolation:isolate;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-post-content:has(> .story-form):has(.time-open)::before {
    content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:linear-gradient(135deg,rgba(8,7,10,.5),rgba(43,18,56,.5)),
      url('/wp-content/uploads/2026/08/ChatGPT-Image-Aug-21-2026-03_35_23-PM.png') center / cover no-repeat;
    -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 120px),transparent 100%);
    mask-image:linear-gradient(to bottom,#000 calc(100% - 120px),transparent 100%);
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.jewelry-mobile-fit {
    background:transparent!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.jewelry-mobile-fit > :is(.wp-block-cover__image-background,.wp-block-cover__background) {
    display:none!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.jewelry-mobile-fit:has(.time-open) .wp-block-columns > .wp-block-column:has(> h2) {
    order:-1!important;
  }

  /* Release the two story sections from fixed-height slide positioning. */
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.jewelry-mobile-fit {
    display:block!important;
    position:relative!important;
    width:100%!important;max-width:none!important;
    height:auto!important;min-height:0!important;max-height:none!important;
    margin:0!important;padding:40px 24px!important;
    box-sizing:border-box!important;overflow:clip!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .jewelry-mobile-fit > .wp-block-cover__inner-container {
    position:relative!important;inset:auto!important;transform:none!important;
    width:100%!important;max-width:none!important;
    height:auto!important;min-height:0!important;
    margin:0!important;padding:0!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .jewelry-mobile-fit > .wp-block-cover__inner-container > p:empty {
    display:none!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .jewelry-mobile-fit .wp-block-columns {
    display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;
    align-items:center!important;justify-content:flex-start!important;gap:28px!important;
    width:100%!important;max-width:none!important;
    height:auto!important;min-height:0!important;
    margin:0!important;padding:0!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.jewelry-mobile-fit .wp-block-column,
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.jewelry-mobile-fit .wp-block-column > .wp-block-group {
    display:block!important;position:static!important;inset:auto!important;transform:none!important;
    flex:0 0 auto!important;width:100%!important;max-width:none!important;
    height:auto!important;min-height:0!important;
    margin:0!important;padding:0!important;box-sizing:border-box!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.jewelry-mobile-fit h2.wp-block-heading {
    position:static!important;inset:auto!important;transform:none!important;
    width:100%!important;max-width:none!important;margin:0!important;padding:0!important;
    font-size:18px!important;line-height:1.4!important;letter-spacing:.02em!important;
    font-weight:400!important;text-align:center!important;white-space:normal!important;
    text-wrap:balance;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.story-form .wp-block-group p {
    position:static!important;inset:auto!important;transform:none!important;
    width:100%!important;max-width:none!important;margin:10px 0 0!important;padding:0!important;
    font-size:14px!important;line-height:1.5!important;text-align:center!important;
    white-space:normal!important;text-wrap:balance;
  }

  /* Original transparent images fit their full width, without a viewport-height cap. */
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.jewelry-mobile-fit .wp-block-image {
    display:block!important;position:relative!important;inset:auto!important;transform:none!important;
    width:100%!important;max-width:600px!important;
    height:auto!important;min-height:0!important;max-height:none!important;
    margin:0 auto!important;padding:0!important;box-sizing:border-box!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.jewelry-mobile-fit .wp-block-image img {
    display:block!important;position:static!important;inset:auto!important;transform:none!important;
    width:100%!important;max-width:100%!important;
    height:auto!important;min-height:0!important;max-height:none!important;
    object-fit:contain!important;margin:0!important;padding:0!important;
  }
  /* Image 150 places the necklace on the right of a 1536 x 1024 canvas.
     Frame its spare transparent margin, keeping the complete necklace plus
     breathing room. No artwork bytes are changed; other images use contain. */
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.story-form .story-jewel:has(img.wp-image-150) {
    max-width:480px!important;aspect-ratio:837 / 992;overflow:hidden!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover.story-form .story-jewel img.wp-image-150 {
    position:absolute!important;left:-76.583035%!important;top:0!important;
    right:auto!important;bottom:auto!important;
    width:183.512545%!important;max-width:none!important;height:auto!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .wp-block-cover > .an-home-final-action {
    position:relative!important;inset:auto!important;transform:none!important;
    width:100%!important;max-width:none!important;
    margin:28px 0 0!important;padding:0!important;
  }
  body.an-home-mobile-flow:is(.home,.front-page) .an-home-final-action a {
    min-height:44px;font-size:14px;line-height:1.4;
  }
}
