/* MR-LIGHTING desktop product-line catalogue — 2026-08-23.
   The content model matches mobile: family intro, full-width family artwork,
   then every product in normal document flow. */

@media (min-width: 901px) {
  :root { --mr-line-green: #093d3f; }

  html.mr-family-luxhero-prep,
  html.mr-family-luxhero-page-bg-root,
  html.mr-static-warm-bg-root,
  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-line-green) !important;
    background-color: var(--mr-line-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;
  }

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

  body.product-list-body .mr-family-luxhero-list {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: clamp(22px, 2.2vw, 42px) 0 clamp(52px, 5vw, 96px) !important;
    overflow: visible !important;
  }

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

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

  body.product-list-body .mr-mobile-line-family-intro__copy {
    box-sizing: border-box !important;
    width: min(100% - clamp(40px, 5vw, 112px), 1840px) !important;
    margin: 0 auto !important;
    padding: clamp(28px, 3vw, 54px) 0 clamp(20px, 2vw, 34px) !important;
    text-align: center !important;
  }

  body.product-list-body .mr-mobile-line-family-intro__copy > span {
    display: block !important;
    color: rgba(225,202,151,.92) !important;
    -webkit-text-fill-color: rgba(225,202,151,.92) !important;
    font-size: clamp(11px, .75vw, 15px) !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
    letter-spacing: .08em !important;
  }

  body.product-list-body .mr-mobile-line-family-intro__copy h2 {
    margin: 7px 0 0 !important;
    color: #fff9ee !important;
    -webkit-text-fill-color: #fff9ee !important;
    font-family: "MR Goodspace", "Vazirmatn", sans-serif !important;
    font-size: clamp(34px, 3.2vw, 64px) !important;
    font-weight: 700 !important;
    line-height: 1.06 !important;
    overflow-wrap: anywhere !important;
  }

  body.product-list-body .mr-mobile-line-family-hero {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    height: clamp(560px, 65vw, 1065px) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: var(--mr-line-green) !important;
  }

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

  body.product-list-body .mr-mobile-line-family-hero img {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: fill !important;
    object-position: center !important;
    filter: none !important;
    transform: none !important;
  }

  body.product-list-body .mr-mobile-line-family-hero figcaption {
    position: absolute !important;
    right: clamp(24px, 3vw, 58px) !important;
    bottom: clamp(18px, 2vw, 34px) !important;
    z-index: 2 !important;
    padding: 8px 14px !important;
    border: 1px solid rgba(244,230,197,.32) !important;
    border-radius: 999px !important;
    background: rgba(2,22,27,.5) !important;
    color: rgba(255,248,232,.92) !important;
    font-size: clamp(11px, .7vw, 14px) !important;
    font-weight: 800 !important;
    line-height: 1 !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;
    transform: none !important;
    overflow: visible !important;
    perspective: none !important;
    user-select: auto !important;
    touch-action: pan-y !important;
    pointer-events: auto !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(38px, 4vw, 74px) clamp(24px, 2.3vw, 48px) !important;
    box-sizing: border-box !important;
    width: min(100% - clamp(120px, 9vw, 200px), 1760px) !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: clamp(38px, 4vw, 72px) 0 clamp(26px, 3vw, 52px) !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;
    align-self: start !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;
  }

  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: 0 !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: end center !important;
    width: 100% !important;
    height: clamp(300px, 24vw, 440px) !important;
    min-height: clamp(300px, 24vw, 440px) !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    overflow: visible !important;
    isolation: isolate !important;
    cursor: pointer !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;
    display: block !important;
    width: 116% !important;
    height: 92% !important;
    border-radius: 50% !important;
    background: radial-gradient(ellipse at center,
      rgba(255,246,218,.31) 0%,
      rgba(220,198,150,.18) 28%,
      rgba(78,145,132,.08) 48%,
      rgba(9,61,63,0) 70%) !important;
    filter: blur(10px) !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: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    filter: none !important;
    transform: scale(1) !important;
    transform-origin: center !important;
    transition: transform .62s cubic-bezier(.2,.72,.2,1) !important;
    will-change: transform !important;
  }

  body.product-list-body .mr-family-luxhero .luxhero__frame:hover .luxhero__product-visual img,
  body.product-list-body .mr-family-luxhero .luxhero__frame:focus-within .luxhero__product-visual img {
    transform: scale(1.065) !important;
  }

  body.product-list-body .mr-mobile-line-product-copy {
    display: grid !important;
    gap: 5px !important;
    min-width: 0 !important;
    margin-top: clamp(14px, 1.1vw, 22px) !important;
    text-align: center !important;
    pointer-events: none !important;
    cursor: pointer !important;
  }

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

  body.product-list-body .mr-mobile-line-product-copy span {
    display: block !important;
    min-height: 2.7em !important;
    overflow: hidden !important;
    color: rgba(226,203,151,.94) !important;
    font-size: clamp(12px, .9vw, 16px) !important;
    font-weight: 650 !important;
    line-height: 1.35 !important;
  }

  body.product-list-body .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;
    background: transparent !important;
    color: transparent !important;
    cursor: pointer !important;
  }

  body.product-list-body .luxhero-family-note {
    width: min(100% - clamp(40px, 5vw, 112px), 1100px) !important;
    margin: clamp(-28px, -2vw, -12px) auto clamp(38px, 4vw, 72px) !important;
  }
}

@media (min-width: 1200px) {
  body.product-list-body .mr-family-luxhero-list .luxhero__track {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 1600px) {
  body.product-list-body .mr-family-luxhero-list .luxhero__track {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 2200px) {
  body.product-list-body .mr-family-luxhero-list .luxhero__track {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
}

/*
 * Keep every product code on one shared baseline.  The artwork files have
 * very different intrinsic aspect ratios, so the grid row itself (not only
 * the image wrapper) must own the common height.
 */
@media (min-width: 901px) {
  body.product-list-body .mr-family-luxhero-list .luxhero__track {
    align-items: start !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 {
    grid-template-rows: clamp(300px, 24vw, 440px) auto !important;
    align-content: start !important;
  }

  body.product-list-body .mr-family-luxhero .luxhero__product-visual {
    grid-row: 1 !important;
    height: 100% !important;
    min-height: 0 !important;
    align-self: stretch !important;
  }

  body.product-list-body .mr-family-luxhero .mr-mobile-line-product-copy {
    grid-row: 2 !important;
    align-self: start !important;
  }
}

@media (prefers-reduced-motion: reduce) and (min-width: 901px) {
  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 {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}
