/* MindKits homepage V6.1 targeted fixes
   Loads after mk-theme60-home-v6.css. No other page or V6 section is restyled. */

/* Softer pointer spotlight. */
body.Default .mk-home-v6 .mk-tilt::before {
  background: radial-gradient(440px circle at var(--mk-x) var(--mk-y), rgba(255, 255, 255, .055), transparent 48%);
}
body.Default .mk-home-v6 .mk-tilt:hover::before {
  opacity: .55;
}

/* Keep comparison data readable when the host theme sets strong text to white. */
body.Default .mk-home-v6 .mk-spec strong {
  color: var(--mk-ink);
}

/* Blend transparent machine cutouts into a restrained stage instead of a visible square on a circle. */
body.Default .mk-home-v6 .mk-compare-stage {
  background:
    radial-gradient(76% 62% at 50% 44%, rgba(255,255,255,.98) 0%, rgba(245,243,239,.92) 58%, rgba(232,228,222,.94) 100%);
}
body.Default .mk-home-v6 .mk-stage-ring {
  width: 72%;
  border-color: rgba(11, 98, 227, .07);
  box-shadow: 0 0 0 58px rgba(11, 98, 227, .018);
  opacity: .58;
}
body.Default .mk-home-v6 .mk-compare-stage::after {
  right: 20%;
  left: 20%;
  bottom: 13%;
  height: 6%;
  background: rgba(20, 20, 22, .18);
  filter: blur(20px);
}
body.Default .mk-home-v6 .mk-compare-stage img {
  width: 82%;
  height: 82%;
  max-height: 390px;
  filter: drop-shadow(0 26px 24px rgba(0, 0, 0, .24));
}

/* Five selectors remain one component and scroll cleanly when space is limited. */
@media (max-width: 1060px) {
  body.Default .mk-home-v6 .mk-picker {
    grid-template-columns: repeat(5, minmax(178px, 1fr));
    overflow-x: auto;
    padding-bottom: 7px;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
  }
  body.Default .mk-home-v6 .mk-picker button {
    scroll-snap-align: start;
  }
}

@media (max-width: 760px) {
  body.Default .mk-home-v6 .mk-picker {
    grid-template-columns: repeat(5, 82%);
  }
  body.Default .mk-home-v6 .mk-compare-stage img {
    width: 86%;
    height: 86%;
    max-height: 275px;
  }
}

/* V6.2: the H2C now uses Cart's original full-resolution image URL.
   Its white catalogue background is blended into the existing light stage. */
body.Default .mk-home-v6 .mk-compare-stage.is-photo-source img {
  width: 94%;
  height: 94%;
  max-height: 430px;
  mix-blend-mode: multiply;
  filter: contrast(1.025) saturate(.98);
}

@media (max-width: 760px) {
  body.Default .mk-home-v6 .mk-compare-stage.is-photo-source img {
    width: 96%;
    height: 96%;
    max-height: 292px;
  }
}
