/* SJK / Restored premium side-by-side PC showcase + intentional entrance motion.
   This is an additive recovery layer. It does not change the Saturn hero. */

/* The missing positioning rules are essential: the video is atmospheric media,
   NOT a full-width content block ahead of the actual PC feature. */
#pc-showcase.sjk-pc-showcase {
  position: relative;
  display: flex;
  align-items: center;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  min-height: clamp(580px, 49vw, 785px);
  padding-block: clamp(72px, 7vw, 112px) !important;
  background: #030b0b !important;
}
#pc-showcase .sjk-pc-showcase-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
  display: block;
}
#pc-showcase .sjk-pc-showcase-bg video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: .23 !important;
  filter: contrast(1.16) saturate(1.04) brightness(.79) !important;
}
#pc-showcase .sjk-pc-showcase-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(1, 10, 10, .97) 0%, rgba(2, 15, 14, .82) 43%, rgba(2, 14, 11, .53) 100%),
    linear-gradient(0deg, rgba(0, 6, 5, .58), transparent 50%) !important;
}
#pc-showcase .sjk-pc-showcase-body {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  align-items: center;
  column-gap: clamp(24px, 3.6vw, 66px);
  row-gap: 22px;
  min-height: 460px;
  width: min(1220px, calc(100% - 40px));
  margin-inline: auto;
}
#pc-showcase .sjk-pc-showcase-content {
  position: relative;
  z-index: 2;
  min-width: 0;
  max-width: 580px;
}
#pc-showcase .sjk-pc-showcase-content h2 {
  font-size: clamp(39px, 4.55vw, 68px);
  font-weight: 850;
  letter-spacing: -.029em !important;
  line-height: 1.085 !important;
  text-wrap: balance;
}
#pc-showcase .sjk-pc-showcase-content p:not(.eyebrow) {
  max-width: 505px !important;
  line-height: 1.65;
}
#pc-showcase .sjk-pc-showcase-ctas {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 30px;
}
#pc-showcase .sjk-pc-showcase-ctas .btn {
  min-height: 48px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  line-height: 1.35;
  white-space: normal;
}
#pc-showcase .sjk-pc-showcase-visual {
  position: relative;
  z-index: 2;
  min-width: 0;
  min-height: 390px;
  display: grid;
  place-items: center;
  isolation: isolate;
}
#pc-showcase .sjk-pc-showcase-visual::before {
  content: "";
  position: absolute;
  inset: 5%;
  z-index: -1;
  background: radial-gradient(ellipse, rgba(0, 241, 103, .29), rgba(0, 95, 79, .08) 48%, transparent 75%);
  filter: blur(26px);
  pointer-events: none;
}
#pc-showcase .sjk-pc-showcase-visual img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: clamp(340px, 38vw, 550px);
  object-fit: contain;
  mix-blend-mode: screen;
  filter: contrast(1.09) brightness(1.13) saturate(1.04);
}
#pc-showcase .sjk-pc-showcase-caption {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 3;
  text-align: right;
  display: grid;
  gap: 5px;
  pointer-events: none;
}
/* Off-screen entrance transforms must never create a horizontal page scrollbar. */
.sjk-editorial-services { overflow-x: clip; }

/* Keep the three pale editorial service pairs in their natural alternating order. */
.sjk-editorial-services .sjk-editorial-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
}
.sjk-editorial-services .sjk-editorial-row > * { min-width: 0; }
.sjk-editorial-services .sjk-editorial-art { margin: 0; min-width: 0; }
.sjk-editorial-services .sjk-editorial-copy { overflow-wrap: break-word; }

/* Interaction starts only after the observer is confirmed available. Without JS,
   content is always visible and readable. */
@media (prefers-reduced-motion: no-preference) {
  html.sjk-scroll-reveal-ready #pc-showcase .sjk-pc-showcase-content,
  html.sjk-scroll-reveal-ready #pc-showcase .sjk-pc-showcase-visual,
  html.sjk-scroll-reveal-ready .sjk-editorial-row .sjk-editorial-copy,
  html.sjk-scroll-reveal-ready .sjk-editorial-row .sjk-editorial-art {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
    transition:
      opacity .86s cubic-bezier(.15, .7, .23, 1),
      transform 1.08s cubic-bezier(.16, 1, .3, 1),
      filter .86s ease;
  }
  html.sjk-scroll-reveal-ready #pc-showcase:not(.sjk-in-view) .sjk-pc-showcase-content,
  html.sjk-scroll-reveal-ready .sjk-editorial-row:not(.sjk-in-view) .sjk-editorial-copy {
    opacity: .07;
    transform: translate3d(-80px, 0, 0);
    filter: blur(4px);
  }
  html.sjk-scroll-reveal-ready #pc-showcase:not(.sjk-in-view) .sjk-pc-showcase-visual,
  html.sjk-scroll-reveal-ready .sjk-editorial-row:not(.sjk-in-view) .sjk-editorial-art {
    opacity: .07;
    transform: translate3d(90px, 0, 0);
    filter: blur(4px);
  }
  html.sjk-scroll-reveal-ready .sjk-editorial-row-reverse:not(.sjk-in-view) .sjk-editorial-copy {
    transform: translate3d(80px, 0, 0);
  }
  html.sjk-scroll-reveal-ready .sjk-editorial-row-reverse:not(.sjk-in-view) .sjk-editorial-art {
    transform: translate3d(-90px, 0, 0);
  }
  #pc-showcase .sjk-pc-showcase-visual,
  .sjk-editorial-row .sjk-editorial-art { transition-delay: .10s !important; }
}

/* Preserve two columns on tablet and smaller laptop widths; the previous
   860px breakpoint accidentally forced the composition into a column. */
@media (min-width: 740px) and (max-width: 1000px) {
  #pc-showcase .sjk-pc-showcase-body {
    grid-template-columns: minmax(0, 1fr) minmax(0, .94fr);
    column-gap: 24px;
    min-height: 430px;
  }
  #pc-showcase .sjk-pc-showcase-content h2 { font-size: clamp(37px, 4.25vw, 48px); }
  #pc-showcase .sjk-pc-showcase-content p:not(.eyebrow) { font-size: 15px; }
  #pc-showcase .sjk-pc-showcase-visual { min-height: 330px; }
  #pc-showcase .sjk-pc-showcase-visual img { max-height: 425px; }
  #pc-showcase .sjk-pc-showcase-ctas .btn { padding: 12px 13px; font-size: 10px; }
}
@media (max-width: 739px) {
  #pc-showcase.sjk-pc-showcase { min-height: 0; padding-block: 76px !important; }
  #pc-showcase .sjk-pc-showcase-body {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
    row-gap: 18px;
  }
  #pc-showcase .sjk-pc-showcase-content { max-width: 100%; }
  #pc-showcase .sjk-pc-showcase-content h2 { font-size: clamp(38px, 10.5vw, 58px); }
  #pc-showcase .sjk-pc-showcase-visual { min-height: 265px; }
  #pc-showcase .sjk-pc-showcase-visual img { max-height: 355px; }
  #pc-showcase .sjk-pc-showcase-caption { right: 8px; bottom: 0; }
  .sjk-editorial-services .sjk-editorial-row { grid-template-columns: minmax(0, 1fr); }
  @media (prefers-reduced-motion: no-preference) {
    html.sjk-scroll-reveal-ready #pc-showcase:not(.sjk-in-view) .sjk-pc-showcase-content,
    html.sjk-scroll-reveal-ready .sjk-editorial-row:not(.sjk-in-view) .sjk-editorial-copy,
    html.sjk-scroll-reveal-ready .sjk-editorial-row-reverse:not(.sjk-in-view) .sjk-editorial-copy {
      transform: translate3d(0, 22px, 0);
    }
    html.sjk-scroll-reveal-ready #pc-showcase:not(.sjk-in-view) .sjk-pc-showcase-visual,
    html.sjk-scroll-reveal-ready .sjk-editorial-row:not(.sjk-in-view) .sjk-editorial-art,
    html.sjk-scroll-reveal-ready .sjk-editorial-row-reverse:not(.sjk-in-view) .sjk-editorial-art {
      transform: translate3d(0, 30px, 0);
    }
  }
}
@media (max-width: 390px) {
  #pc-showcase.sjk-pc-showcase { padding-block: 65px !important; }
  #pc-showcase .sjk-pc-showcase-content h2 { font-size: clamp(36px, 10.2vw, 41px); }
  #pc-showcase .sjk-pc-showcase-visual img { max-height: 305px; }
  #pc-showcase .sjk-pc-showcase-ctas .btn { width: 100%; }
  #pc-showcase .sjk-pc-showcase-caption span { font-size: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  #pc-showcase .sjk-pc-showcase-content,
  #pc-showcase .sjk-pc-showcase-visual,
  .sjk-editorial-row .sjk-editorial-copy,
  .sjk-editorial-row .sjk-editorial-art {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
  #pc-showcase .sjk-pc-showcase-bg video { display: none !important; }
}