/* Homepage product showcase; isolated from the shared homepage theme. */
#product-pages.products-editorial {
  --awaken-bg: #f7f3ec;
  --awaken-navy: #071a2d;
  --awaken-taupe: #a48665;
  --awaken-text: #5f6870;
  --awaken-border: rgba(130,110,80,.16);
  padding: 100px 0 120px;
  background: var(--awaken-bg);
  color: var(--awaken-navy);
  scroll-margin-top: 90px;
}
#product-pages.products-editorial .products-heading { width: min(92%, 1100px); margin: 0 auto 90px; text-align: center; }
#product-pages.products-editorial .products-eyebrow { margin: 0 0 24px; color: #8c6b43; font-size: 13px; font-weight: 600; letter-spacing: .3em; }
.products-eyebrow::before { content: ""; display: block; width: 44px; height: 1px; margin: 0 auto 22px; background: #b89458; }
#product-pages.products-editorial h2 { margin: 0; color: var(--awaken-navy); font-size: clamp(56px,5vw,84px); font-weight: 650; line-height: 1; letter-spacing: -.04em; }
#product-pages.products-editorial h2 span, #product-pages.products-editorial h3 span { color: #94734f; }
#product-pages.products-editorial .products-intro { max-width: 860px; margin: 24px auto 0; font-size: 20px; line-height: 1.5; color: var(--awaken-text); }
.products-stack { display: grid; gap: 34px; width: min(92%,1500px); margin-inline: auto; }
.products-item { display: grid; grid-template-columns: 44% 56%; position: relative; height: 70vh; min-height: 0; overflow: hidden; border: 1px solid var(--awaken-border); border-radius: 42px; background: linear-gradient(120deg,#fcfaf6,#f3ece2); box-shadow: 0 20px 60px rgba(20,30,40,.06); }
.products-copy { position: relative; z-index: 1; align-self: center; padding: clamp(50px,5vw,80px); padding-right: 12px; }
#product-pages.products-editorial .products-number { display: flex; align-items: center; gap: 14px; margin-bottom: 25px; font-size: 17px; font-weight: 600; color: #8c6b43; }
.products-number::after { content: ""; width: 42px; height: 1px; background: #b49a7b; }
#product-pages.products-editorial h3 { margin: 0; font-size: clamp(48px,4.5vw,68px); font-weight: 650; line-height: 1.04; letter-spacing: -.045em; color: var(--awaken-navy); }
#product-pages.products-editorial .products-copy > p { max-width: 480px; margin: 26px 0 30px; font-size: 20px; line-height: 1.5; color: var(--awaken-text); }
.ai-feature { color: var(--awaken-gold, #a7805a); font-weight: 700; white-space: nowrap; }
.products-link { display: inline-flex; gap: 17px; align-items: center; color: var(--awaken-navy); text-decoration: none; font-size: 14px; font-weight: 600; border-radius: 32px; transition: transform 300ms; }
.products-arrow { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(135deg,#c6a57d,#805f39); color: white; font-size: 27px; font-weight: 400; transition: background 300ms, transform 300ms; }
.products-link:hover { transform: translateY(-1px); }
.products-link:hover .products-arrow { transform: translateX(3px); background: #896741; }
.products-link:focus-visible { outline: 3px solid var(--awaken-navy); outline-offset: 7px; }
.products-art { display: flex; align-items: center; min-width: 0; min-height: 0; mask-image: linear-gradient(to right,transparent,#000 14%); }
.products-art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; mix-blend-mode: multiply; transition: transform 350ms; }
.products-item:hover .products-art img { transform: translateY(-4px); }
.products-item:nth-child(even) { grid-template-columns: 56% 44%; }
.products-item:nth-child(even) .products-copy { grid-column: 2; grid-row: 1; padding-left: 24px; padding-right: clamp(50px,5vw,80px); }
.products-item:nth-child(even) .products-art { grid-column: 1; grid-row: 1; mask-image: linear-gradient(to left,transparent,#000 14%); }
/* Shared containing block lets each following card cover the preceding card.
   clip preserves horizontal clipping without creating a sticky scroll container. */
@media (min-width: 1181px) {
  html:has(.products-editorial), body:has(.products-editorial) { overflow-x: clip !important; }
  #product-pages.products-editorial { overflow: visible; }
  .products-stack { position: relative; isolation: isolate; }
  .products-item { position: sticky; top: calc(var(--header-height, 87px) + 24px); z-index: 1; }
  .products-item:nth-child(2) { z-index: 2; }
  .products-item:nth-child(3) { z-index: 3; }
  .products-item:nth-child(4) { z-index: 4; }
  .products-item:nth-child(5) { z-index: 5; }
}
@media (min-width: 1440px) {
  /* Existing large-desktop header: 82px navigation plus its 1px border. */
  .products-stack { --header-height: 83px; }
}
@media (max-width: 1100px) {
  .products-copy { padding: 42px 16px 42px 40px; }
  .products-item:nth-child(even) .products-copy { padding: 42px 40px 42px 16px; }
  #product-pages.products-editorial h3 { font-size: 46px; }
  #product-pages.products-editorial .products-copy > p { font-size: 18px; }
}
@media (max-width: 800px) {
  #product-pages.products-editorial { padding: 70px 0 80px; }
  #product-pages.products-editorial .products-heading { margin-bottom: 48px; }
  #product-pages.products-editorial h2 { font-size: clamp(40px,8vw,56px); }
  #product-pages.products-editorial .products-intro { font-size: 17px; }
  .products-stack { gap: 24px; }
  .products-item, .products-item:nth-child(even) { grid-template-columns: 1fr; height: auto; min-height: 0; border-radius: 28px; }
  .products-copy, .products-item:nth-child(even) .products-copy { grid-column: 1; grid-row: 1; padding: 32px 28px 12px; }
  #product-pages.products-editorial h3 { font-size: clamp(34px,9vw,46px); }
  #product-pages.products-editorial .products-number { margin-bottom: 20px; font-size: 16px; }
  #product-pages.products-editorial .products-copy > p { margin: 22px 0 24px; font-size: 17px; }
  .products-arrow { width: 50px; height: 50px; }
  .products-art, .products-item:nth-child(even) .products-art { grid-column: 1; grid-row: 2; mask-image: linear-gradient(to bottom,transparent,#000 14%); }
  .products-art img { height: auto; aspect-ratio: 1; max-height: 560px; object-fit: contain; }
}
@media (prefers-reduced-motion: reduce) {
  #product-pages.products-editorial *, #product-pages.products-editorial *::before { transition: none; }
  .products-item:hover .products-art img, .products-link:hover, .products-link:hover .products-arrow { transform: none; }
}
