/* MR-LIGHTING mobile product-line reference catalogue — 2026-08-18.
   This layer is loaded only below 901px. Desktop geometry remains untouched. */

@media (max-width: 900px) {
  :root {
    --mr-mobile-line-family-green: #093d3f;
  }

  html.mr-family-luxhero-prep,
  html.mr-family-luxhero-page-bg-root,
  html.mr-static-warm-bg-root {
    background: var(--mr-mobile-line-family-green) !important;
    background-color: var(--mr-mobile-line-family-green) !important;
    background-image: none !important;
  }

  html.mr-static-warm-bg-root body.product-list-body,
  html.mr-static-warm-bg-root body.product-list-body.mr-static-warm-bg,
  html.mr-family-luxhero-page-bg-root body.product-list-body,
  html.mr-static-warm-bg-root body.product-list-body > section.featured.products-page.products-page,
  body.product-list-body,
  body.product-list-body.mr-family-luxhero-page-bg,
  body.product-list-body .products-page,
  body.product-list-body .mr-family-luxhero-list {
    background: var(--mr-mobile-line-family-green) !important;
    background-color: var(--mr-mobile-line-family-green) !important;
    background-image: none !important;
    background-attachment: scroll !important;
  }

  html.mr-static-warm-bg-root body.product-list-body::before,
  html.mr-static-warm-bg-root body.product-list-body::after,
  body.product-list-body .products-page::before,
  body.product-list-body .products-page::after {
    content: none !important;
    display: none !important;
    background: none !important;
  }

  body.product-list-body .luxhero-global-backgrounds,
  body.product-list-body .luxhero__backgrounds,
  body.product-list-body .luxhero-category-heading {
    display: none !important;
  }

  body.product-list-body .mr-family-luxhero-list {
    display: block !important;
    margin: 16px 0 34px !important;
    overflow: visible !important;
  }

  body.product-list-body .mr-family-luxhero-list .mr-family-luxhero {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 0 34px !important;
    overflow: visible !important;
    contain: none !important;
    content-visibility: visible !important;
    background: transparent !important;
    color: #f7f1e4 !important;
    touch-action: pan-y !important;
  }

  .mr-mobile-line-family-intro {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .mr-mobile-line-family-intro__copy {
    box-sizing: border-box !important;
    width: 100% !important;
    padding: 24px 20px 16px !important;
    text-align: center !important;
  }

  .mr-mobile-line-family-intro__copy > span {
    display: block !important;
    color: rgba(225, 202, 151, .9) !important;
    -webkit-text-fill-color: rgba(225, 202, 151, .9) !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
    letter-spacing: .08em !important;
  }

  .mr-mobile-line-family-intro__copy h2 {
    margin: 5px 0 0 !important;
    color: #fff9ee !important;
    -webkit-text-fill-color: #fff9ee !important;
    font-family: "MR Goodspace", "Vazirmatn", sans-serif !important;
    font-size: clamp(24px, 7.4vw, 34px) !important;
    font-weight: 700 !important;
    line-height: 1.08 !important;
    overflow-wrap: anywhere !important;
  }

  .mr-mobile-line-family-intro__copy p {
    width: min(88%, 410px) !important;
    margin: 9px auto 0 !important;
    color: rgba(244, 238, 222, .76) !important;
    -webkit-text-fill-color: rgba(244, 238, 222, .76) !important;
    font-family: "Vazirmatn", sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.75 !important;
  }

  .mr-mobile-line-family-hero {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    box-sizing: border-box !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: clamp(250px, 72vw, 390px) !important;
    margin: 0 calc(50% - 50vw) !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: var(--mr-mobile-line-family-green) !important;
  }

  .mr-mobile-line-family-hero::after {
    content: "" !important;
    position: absolute !important;
    inset: auto 0 0 !important;
    height: 42% !important;
    background: linear-gradient(180deg, transparent, rgba(1, 20, 24, .34)) !important;
    pointer-events: none !important;
  }

  .mr-mobile-line-family-hero img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: fill !important;
    object-position: center !important;
    filter: none !important;
  }

  .mr-mobile-line-family-hero figcaption {
    position: absolute !important;
    right: 18px !important;
    bottom: 14px !important;
    z-index: 2 !important;
    padding: 5px 9px !important;
    border: 1px solid rgba(244, 230, 197, .28) !important;
    border-radius: 999px !important;
    background: rgba(2, 22, 27, .44) !important;
    color: rgba(255, 248, 232, .88) !important;
    -webkit-text-fill-color: rgba(255, 248, 232, .88) !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
  }

  body.product-list-body .mr-family-luxhero-list .luxhero__stage {
    position: relative !important;
    inset: auto !important;
    z-index: 2 !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    perspective: none !important;
    user-select: auto !important;
    touch-action: pan-y !important;
  }

  body.product-list-body .mr-family-luxhero-list .luxhero__track {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: clamp(24px, 7vw, 34px) clamp(9px, 3vw, 16px) !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 28px 16px 20px !important;
  }

  body.product-list-body .mr-family-luxhero .luxhero__slide,
  body.product-list-body .mr-family-luxhero .luxhero__slide[data-pos],
  body.product-list-body .mr-family-luxhero .luxhero__slide[style] {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    top: auto !important;
    z-index: 1 !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
    pointer-events: auto !important;
  }

  body.product-list-body .mr-family-luxhero .luxhero__frame {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    cursor: default !important;
    touch-action: manipulation !important;
  }

  body.product-list-body .mr-family-luxhero .luxhero__card,
  body.product-list-body .mr-family-luxhero .luxhero__slide--halo .luxhero__card,
  body.product-list-body .mr-family-luxhero .luxhero__slide--aurelia .luxhero__card,
  body.product-list-body .mr-family-luxhero .luxhero__slide--vanta .luxhero__card,
  body.product-list-body .mr-family-luxhero .luxhero__slide--celestia .luxhero__card,
  body.product-list-body .mr-family-luxhero .luxhero__slide--eclat .luxhero__card {
    position: relative !important;
    display: grid !important;
    grid-template-rows: auto auto !important;
    gap: 10px !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #f8f1e3 !important;
    text-align: center !important;
    container-type: normal !important;
  }

  body.product-list-body .mr-family-luxhero .luxhero__card::before,
  body.product-list-body .mr-family-luxhero .luxhero__card-brand,
  body.product-list-body .mr-family-luxhero .luxhero__card-nav,
  body.product-list-body .mr-family-luxhero .luxhero__card-copy {
    display: none !important;
  }

  body.product-list-body .mr-family-luxhero .luxhero__product-visual {
    position: relative !important;
    inset: auto !important;
    z-index: 1 !important;
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1 / 1.08 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    isolation: isolate !important;
  }

  body.product-list-body .mr-family-luxhero .luxhero__product-visual::before {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    z-index: -1 !important;
    width: 148% !important;
    height: 118% !important;
    border-radius: 50% !important;
    background: radial-gradient(ellipse at center,
      rgba(255, 246, 218, .34) 0%,
      rgba(220, 198, 150, .20) 28%,
      rgba(78, 145, 132, .10) 52%,
      rgba(9, 61, 63, 0) 76%) !important;
    filter: blur(5px) !important;
    transform: translate(-50%, -50%) !important;
    pointer-events: none !important;
  }

  body.product-list-body .mr-family-luxhero .luxhero__product-visual img {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    filter: none !important;
    transform: none !important;
  }

  .mr-mobile-line-product-copy {
    display: grid !important;
    gap: 4px !important;
    min-width: 0 !important;
    text-align: center !important;
    pointer-events: none !important;
  }

  .mr-mobile-line-product-copy strong {
    display: block !important;
    min-width: 0 !important;
    overflow: hidden !important;
    color: #fff8ea !important;
    -webkit-text-fill-color: #fff8ea !important;
    font-family: "MR Goodspace", "Vazirmatn", sans-serif !important;
    font-size: clamp(10px, 2.9vw, 13px) !important;
    font-weight: 750 !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  .mr-mobile-line-product-copy span {
    display: block !important;
    min-height: 2.7em !important;
    overflow: hidden !important;
    color: rgba(226, 203, 151, .92) !important;
    -webkit-text-fill-color: rgba(226, 203, 151, .92) !important;
    font-family: "Vazirmatn", sans-serif !important;
    font-size: clamp(9px, 2.55vw, 11px) !important;
    font-weight: 650 !important;
    line-height: 1.35 !important;
  }

  .mr-mobile-line-product-open {
    position: absolute !important;
    inset: 0 !important;
    z-index: 8 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: transparent !important;
    -webkit-tap-highlight-color: transparent !important;
    touch-action: manipulation !important;
  }

  body.product-list-body .mr-family-luxhero .luxhero__controls,
  body.product-list-body .mr-family-luxhero .luxhero__progress {
    display: none !important;
  }

  /* Mobile Quick View intentionally contains only the selected product image
     and its technical-specification table. Desktop Quick View is unchanged. */
  body.product-list-body .mr-line-qv-shell {
    --mr-line-qv-product-card-w: calc(100% - 20px) !important;
    --mr-line-qv-family-card-w: calc(100% - 20px) !important;
    --mr-line-qv-frame-h: clamp(360px, 58vh, 560px) !important;
    display: grid !important;
    grid-template-rows: var(--mr-line-qv-frame-h) auto !important;
    align-content: start !important;
    gap: 12px !important;
    padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
  }

  body.product-list-body .mr-line-qv-frame--product {
    width: var(--mr-line-qv-product-card-w) !important;
    height: var(--mr-line-qv-frame-h) !important;
    min-height: var(--mr-line-qv-frame-h) !important;
    max-height: var(--mr-line-qv-frame-h) !important;
  }

  body.product-list-body .mr-line-qv-frame--family {
    width: var(--mr-line-qv-family-card-w) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    border: 1px solid rgba(220, 184, 112, .42) !important;
    border-radius: 24px !important;
    background: #030504 !important;
  }

  body.product-list-body .mr-line-qv-side-content {
    display: block !important;
    position: relative !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: auto !important;
    padding: 14px !important;
    overflow: hidden !important;
  }

  body.product-list-body .mr-line-qv-family-grid,
  body.product-list-body .mr-line-qv-price,
  body.product-list-body .mr-line-qv-buy {
    display: none !important;
  }

  body.product-list-body .mr-line-qv-specs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  body.product-list-body .mr-line-qv-specs__item {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 62px !important;
    overflow: hidden !important;
    background: rgba(255, 255, 255, .035) !important;
  }

  body.product-list-body .mr-line-qv-specs__item strong {
    max-width: 100% !important;
    overflow: hidden !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  body.product-list-body .luxhero-family-note {
    width: calc(100% - 40px) !important;
    margin: -12px auto 30px !important;
  }
}

@media (max-width: 329px) {
  body.product-list-body .mr-family-luxhero-list .luxhero__track {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    padding-inline: 18px !important;
  }
}

@media (prefers-reduced-motion: reduce) and (max-width: 900px) {
  body.product-list-body .mr-family-luxhero-list *,
  body.product-list-body .mr-family-luxhero-list *::before,
  body.product-list-body .mr-family-luxhero-list *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}