/* HOME / APPROVED SKETCH
   Desktop preserves the approved raster composition and its original materials.
   Only the copy and CTA are HTML. Other screens use their existing styles. */
#home .scene-art::after { background: none; }
#home .screen-copy { width: 37%; max-width: 540px; }
#home .screen-title {
  font-size: clamp(40px, 5.3vw, 82px);
  line-height: 1.08;
  font-weight: 350;
  letter-spacing: -.055em;
}
#home .screen-title .warm { color: #d1bea0; }
#home .screen-lead { max-width: 430px; font-size: clamp(18px, 1.8vw, 28px); line-height: 1.45; }
#home .disciplines { margin-top: 32px; font-size: clamp(11px, 1vw, 15px); }
#home .primary-action { margin-top: 32px; }
.approved-mobile-diagram { display: none; }
.approved-flow-description {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* The original composition remains aligned with the viewport behind the header. */
@media (min-width: 761px) {
  #home { align-items: flex-start; padding-top: clamp(55px, 9.3vh, 125px); }
  #home .section-kicker { margin-bottom: 46px; }
  #home .scene-art img { object-fit: cover; }
}

/* Narrow screens: live copy first, complete approved scene below, natural scroll. */
@media (max-width: 760px) {
  #home { display: flex; flex-direction: column; align-items: stretch; gap: 30px; padding: 35px var(--gutter) 30px; }
  #home .screen-copy { width: 100%; max-width: none; }
  #home .screen-title { font-size: clamp(32px, 9.3vw, 62px); line-height: 1.12; margin-bottom: 24px; }
  #home .section-kicker { margin-bottom: 25px; }
  #home .screen-lead { font-size: 18px; line-height: 1.55; }
  #home .disciplines { margin-top: 22px; font-size: 11px; }
  #home .primary-action { margin-top: 25px; }
  #home .scene-art { height: 100%; }
  #home .scene-art img { visibility: hidden; }
  #home .scene-art { background: #10100f url('../assets/automation-studio-v1.png') center / cover; }
  #home .scene-art::after { background: #10100f55; }
  .approved-mobile-diagram { display: block; margin: 0 -12px; }
  .approved-mobile-diagram img { display: block; width: 100%; height: auto; }
}
