/* Home page (/) — port of Prestige index sections. Scoped to qh-* classes. */
.q-tpl-index main { background: #efefef; }
.qh-h1, .qh-h2, .qh-eyebrow, .qh-marquee__item { font-weight: 700; text-transform: uppercase; letter-spacing: .18em; line-height: 1.2; margin: 0; }
.qh-h1 { font-size: 22px; }
.qh-h2 { font-size: 20px; }
@media (min-width: 700px) { .qh-h1 { font-size: 32px; } .qh-h2 { font-size: 28px; } }
.qh-center { text-align: center; }

.qh-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 28px; border: 0; border-radius: var(--radius-btn); font: inherit; font-size: 13px; font-weight: 400; line-height: 1.6; letter-spacing: .18em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: opacity .2s; }
.qh-btn:hover { opacity: .85; }
.qh-btn--light { background: #fff; color: #1c1c1c; }
.qh-btn--dark { background: #1c1c1c; color: #fff; }

/* 1. Slideshow (one slide on live, so no autoplay) */
.qh-hero { position: relative; display: grid; height: calc(100svh - var(--header-h) - 32px); min-height: 420px; max-height: 1100px; background: #000; color: #fff; }
@media (min-width: 700px) { .qh-hero { min-height: 520px; } }
.qh-hero picture, .qh-hero img { position: absolute; inset: 0; width: 100%; height: 100%; }
.qh-hero img { object-fit: cover; }
.qh-hero::after { content: ''; position: absolute; inset: 0; background: var(--qh-overlay); pointer-events: none; }
.qh-hero__content { position: relative; z-index: 1; place-self: end center; display: grid; justify-items: center; gap: 24px; padding: 0 var(--gutter) 64px; text-align: center; max-width: 1200px; }
.qh-eyebrow { font-size: 12px; }
@media (min-width: 1000px) { .qh-hero__content { padding-bottom: 80px; } }
.qh-hero__next { position: absolute; z-index: 2; left: 50%; bottom: -25px; translate: -50% 0; width: 50px; height: 50px; border-radius: 50%; border: 0; background: #fff; color: #1c1c1c; display: grid; place-items: center; cursor: pointer; box-shadow: 0 2px 10px rgba(0,0,0,.08); }

/* 2. Best Sellers carousel */
.qh-section { background: #efefef; padding: 65px 0 40px; }
@media (min-width: 1000px) { .qh-section { padding: 89px 0 64px; } }
.qh-featured .qh-h2 { text-align: center; color: #1c1c1c; margin-bottom: 32px; }
.qh-featured .qh-center { margin-top: 32px; }
.qh-carousel { position: relative; }
.qh-carousel__track { display: grid; grid-auto-flow: column; grid-auto-columns: 74vw; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin: 0 calc(var(--gutter) * -1); padding: 0 var(--gutter); scroll-padding: 0 var(--gutter); overscroll-behavior-x: contain; }
.qh-carousel__track::-webkit-scrollbar { display: none; }
.qh-carousel__cell { scroll-snap-align: start; min-width: 0; }
@media (min-width: 700px) { .qh-carousel__track { grid-auto-columns: calc((100% - 2 * var(--gutter) - 2 * 24px) / 2.6); gap: 24px; } }
@media (min-width: 1000px) {
  .qh-carousel__track { grid-auto-columns: calc((100% - 3 * 24px) / 4); margin: 0; padding: 0; scroll-padding: 0; }
}
.qh-featured .q-card__media { border-radius: 0; background: #fff; }
.qh-featured .q-card__title { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .18em; line-height: 1.5; color: #1c1c1c; }
.qh-featured .q-price { font-size: 13px; }
.qh-featured .q-price__now { color: #1c1c1c; font-weight: 400; }
.qh-featured .q-price__now--sale { color: #e32c2b; }
.qh-featured .q-price__was { color: rgba(28,28,28,.65); }
.qh-carousel__btn { display: none; }
@media (min-width: 1000px) and (hover: hover) {
  .qh-carousel__btn { display: grid; place-items: center; position: absolute; z-index: 2; top: calc((100% - 70px) / 2); width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(28,28,28,.15); background: #fff; color: #1c1c1c; cursor: pointer; opacity: 0; transition: opacity .2s; translate: 0 -50%; }
  .qh-carousel__btn--prev { left: -22px; } .qh-carousel__btn--next { right: -22px; }
  .qh-carousel:hover .qh-carousel__btn:not([disabled]) { opacity: 1; }
  .qh-carousel__btn[disabled] { pointer-events: none; }
}

/* 3. Rich text */
.qh-rich { border-top: 1px solid #cfcfcf; padding: 40px 0; text-align: center; }
@media (min-width: 1000px) { .qh-rich { padding: 64px 0; } }
.qh-rich .qh-h1 { color: #1c1c1c; max-width: 1000px; margin: 0 auto; }

/* 4–5. Image with text (scheme-3: dark) */
.qh-iwt { display: grid; background: #1c1c1c; color: #fff; }
.qh-iwt__media img { display: block; width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; }
.qh-iwt__content { display: grid; justify-items: center; align-content: center; gap: 24px; padding: 40px 20px 48px; text-align: center; }
.qh-iwt__text p { margin: 0; font-size: 14px; line-height: 1.65; }
@media (min-width: 700px) {
  .qh-iwt { grid-template-columns: 1fr 1fr; }
  .qh-iwt--reverse .qh-iwt__media { order: 2; }
  .qh-iwt__content { justify-items: start; text-align: start; padding: 48px 48px; max-width: 526px; box-sizing: border-box; }
}
@media (min-width: 1000px) { .qh-iwt__content { padding: 48px 0 48px 96px; } .qh-iwt--reverse .qh-iwt__content { padding: 48px 0 48px 96px; } }

/* 6, 8. Scrolling text */
.qh-marquee { background: #efefef; overflow: hidden; padding: 20px 0; }
.qh-marquee--border { border-top: 1px solid rgba(179,179,179,.15); }
.qh-marquee + .qh-mgrid { padding-top: 0; }
.qh-mgrid + .qh-marquee { padding-top: 0; }
@media (min-width: 1000px) { .qh-marquee { padding: 40px 0; } .qh-mgrid + .qh-marquee { padding-top: 0; } }
.qh-marquee__track { display: flex; width: max-content; animation: qh-marquee 60s linear infinite; }
.qh-marquee--right .qh-marquee__track { animation-direction: reverse; }
.qh-marquee__item { flex: none; font-size: 32px; color: #b3b3b3; padding-right: 25px; white-space: nowrap; }
@media (min-width: 1000px) { .qh-marquee__item { font-size: 64px; padding-right: 50px; } }
@keyframes qh-marquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .qh-marquee__track { animation: none; } }

/* 7. Media grid */
.qh-mgrid { background: #efefef; padding: 0 var(--gutter) 30px; }
.qh-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 180px; grid-auto-flow: dense; gap: 24px; }
.qh-grid__item { overflow: hidden; grid-row: span var(--r); }
.qh-grid__item:first-child { grid-column: span 2; }
.qh-grid__item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
@media (hover: hover) { .qh-grid__item:hover img { transform: scale(1.05); } }
@media (min-width: 700px) {
  .qh-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 290px; gap: 30px; }
  .qh-grid__item, .qh-grid__item:first-child { grid-column: span var(--c); }
}
@media (min-width: 1000px) { .qh-mgrid { padding: 0 30px 30px; } }
.qh-iwt .qh-h1 { color: #fff; }