/* DR. KRATOS - mobile product range: one can per product step */
@media (max-width: 880px) {
  .rangeWrap { display:block !important; }

  /* Desktop sticky stage is not used on mobile. */
  .range .stickyCol { display:none !important; }

  .range .steps {
    display:block !important;
    width:100% !important;
  }

  .range .step {
    position:relative !important;
    min-height:0 !important;
    padding:54px 0 76px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-start !important;
    gap:20px !important;
    overflow:visible !important;
  }

  .range .step + .step {
    border-top:1px solid rgba(247,243,232,.08);
  }

  .range-mobile-product {
    position:relative;
    width:100%;
    height:clamp(300px, 54vh, 430px);
    min-height:300px;
    margin:0 0 18px;
    display:grid;
    place-items:center;
    overflow:hidden;
    isolation:isolate;
  }

  .range-mobile-product::after {
    content:"";
    position:absolute;
    inset:14% 8%;
    z-index:0;
    background:radial-gradient(circle, rgba(var(--range-mobile-rgb,201,169,97),.12), transparent 65%);
    pointer-events:none;
  }

  .range-mobile-word {
    position:absolute;
    z-index:0;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    font-size:clamp(58px,22vw,116px);
    font-weight:700;
    letter-spacing:-.055em;
    line-height:.9;
    color:transparent;
    -webkit-text-stroke:1px rgba(247,243,232,.09);
    white-space:nowrap;
    pointer-events:none;
  }

  .range-mobile-product img {
    position:relative !important;
    z-index:1 !important;
    inset:auto !important;
    display:block !important;
    width:auto !important;
    height:auto !important;
    max-width:min(48vw,190px) !important;
    max-height:calc(100% - 28px) !important;
    margin:0 auto !important;
    opacity:1 !important;
    transform:none !important;
    animation:none !important;
    filter:drop-shadow(0 32px 48px rgba(0,0,0,.58)) !important;
  }
}

@media (max-width: 520px) {
  .range .step { padding:42px 0 66px !important; }
  .range-mobile-product {
    height:330px;
    min-height:330px;
    margin-bottom:12px;
  }
  .range-mobile-product img {
    max-width:175px !important;
    max-height:305px !important;
  }
}