/* Original artwork, original pairings. A cream canvas keeps each composition clear. */
.home-art-scene {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 650px;
  gap: 70px;
  padding-bottom: 60px;
}
.original-hero-art {
  height: 550px;
  background: transparent;
  border-radius: 0;
  overflow: hidden;
}
.original-hero-art::before {
  display: none;
}
.original-hero-art > .original-hero-art__bust {
  inset: 0;
  margin: auto;
  width: 100%;
  max-width: 420px;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
}
.original-hero-gesture {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -10px;
  height: 170px;
  z-index: -1;
  opacity: 0.12;
  pointer-events: none;
}
.original-hero-gesture img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.original-hero-art > .original-hero-art__single {
  inset: 0;
  margin: auto;
  width: 86%;
  height: 100%;
  object-fit: contain;
  object-position: bottom;
}
.original-hero-art--iris > .original-hero-art__single {
  width: 100%;
  height: 94%;
  object-position: center;
}
.original-hero-art--recovery {
  background: #eeebe2;
}
.original-hero-art--recovery > .original-hero-art__single {
  width: 100%;
}
.art-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 1.35fr) minmax(0, 1fr);
  min-height: 560px;
  border-block: 1px solid var(--line);
  margin-block: 70px;
}
.art-gallery__figure {
  position: relative;
  min-width: 0;
  overflow: hidden;
  display: flex;
  align-items: end;
  justify-content: center;
}
.art-gallery__figure:first-child {
  border-right: 1px solid var(--line);
}
.art-gallery__figure:last-child {
  border-left: 1px solid var(--line);
}
.art-gallery__figure img {
  height: 510px;
  width: 100%;
  max-width: none;
  object-fit: contain;
  object-position: center bottom;
  mix-blend-mode: multiply;
}
.art-gallery__copy {
  padding: 64px 25px;
  align-self: center;
  text-align: center;
}
.art-gallery__copy .eyebrow {
  font-size: 10px;
  margin-bottom: 30px;
}
.art-gallery__copy .eyebrow::before {
  display: none;
}
.art-gallery__copy h2 {
  font: 400 clamp(42px, 4.4vw, 64px) / 1.02 var(--serif);
  letter-spacing: -0.025em;
}
.art-gallery__copy p {
  margin-top: 24px;
  font-size: 14px;
  line-height: 1.8;
}
.page-art-heading {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-right: 32%;
}
.page-art-heading > .page-art {
  position: absolute;
  right: 0;
  top: 32px;
  bottom: 0;
  width: 28%;
  pointer-events: none;
}
.page-art img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  mix-blend-mode: multiply;
}
@media (max-width: 900px) {
  .home-art-scene {
    min-height: 0;
    gap: 30px;
  }
  .original-hero-art {
    height: 450px;
  }
  .art-gallery {
    grid-template-columns: minmax(0, 1fr) minmax(250px, 1.4fr) minmax(0, 1fr);
    min-height: 430px;
  }
  .art-gallery__figure img {
    height: 400px;
    width: 130%;
  }
  .art-gallery__copy {
    padding: 40px 20px;
  }
  .art-gallery__copy h2 {
    font-size: 42px;
  }
}
@media (max-width: 600px) {
  .home-art-scene {
    padding-bottom: 0;
  }
  .original-hero-art {
    height: 360px;
  }
  .original-hero-art > .original-hero-art__bust {
    width: 100%;
    max-width: 340px;
    left: 0;
  }
  /* At phone widths the ghosted hands land across the bust's chin as a grey smear. */
  .original-hero-gesture {
    display: none;
  }
  .original-hero-art--iris {
    height: 310px;
  }
  .original-hero-art--iris > .original-hero-art__single {
    width: 88%;
  }
  .art-gallery {
    grid-template-columns: 1fr 1fr;
    margin-block: 42px;
  }
  .art-gallery__copy {
    grid-column: 1 / -1;
    grid-row: 1;
    border-bottom: 1px solid var(--line);
    padding: 38px 16px;
  }
  .art-gallery__copy .eyebrow {
    margin-bottom: 20px;
  }
  .art-gallery__copy p {
    margin-top: 18px;
  }
  .art-gallery__figure {
    padding-top: 20px;
  }
  .art-gallery__figure img {
    width: 100%;
    height: 260px;
  }
  .art-gallery__figure:last-child {
    border-left: 0;
  }
  .page-art-heading {
    padding-right: 0;
  }
  .page-art-heading > .page-art {
    position: relative;
    width: 100%;
    height: 230px;
    top: auto;
    margin-top: 18px;
  }
  .page-art img {
    width: 75%;
    display: block;
    margin-inline: auto;
  }
}

/* Program marks: eyebrow + logo row on one baseline. The two wordmarks have
   very different ink density (bold caps vs lowercase), so their heights are
   tuned to match visual mass rather than box height. */
.programs-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 48px;
  padding-block: 22px;
  border-block: 1px solid var(--line);
}
.programs-eyebrow {
  flex: 0 0 auto;
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  white-space: nowrap;
}
.programs-garden { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 44px; margin: 0; padding: 0; list-style: none; }
.program { display: inline-flex; align-items: center; gap: 12px; min-width: 0; }
.program-mark { display: block; width: auto; object-fit: contain; }
.program-mark--nvidia { height: 22px; }
.program-mark--zendesk { height: 24px; }
.program-name { color: var(--ink); font-size: 13px; line-height: 1; white-space: nowrap; }
.stats-proof { padding-block: 84px 72px; }
.section-heading--center { display: block; max-width: 620px; margin-inline: auto; text-align: center; }
.section-heading--center .eyebrow { margin-bottom: 0; }
.section-heading--center h2 { margin-top: 14px; font: 400 clamp(42px, 5vw, 64px)/1.03 var(--serif); letter-spacing: -.025em; }
.section-heading--center p { margin: 18px auto 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.stats-row { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 46px; border-block: 1px solid var(--line); }
.stats-row > div { padding: 26px 18px; text-align: center; border-right: 1px solid var(--line); }
.stats-row > div:last-child { border-right: 0; }
.stats-row .stat-num { display: block; color: var(--green); font: 400 clamp(32px, 4vw, 52px)/1 var(--serif); font-variant-numeric: tabular-nums; }
.stats-row span { display: block; margin-top: 10px; color: var(--muted); font-size: 11px; line-height: 1.45; letter-spacing: .05em; text-transform: uppercase; text-wrap: balance; }
.stats-method { max-width: 620px; margin: 20px auto 0; color: var(--muted); font-size: 12px; text-align: center; }
.stats-method summary { cursor: pointer; color: var(--ink); }
.stats-method p { margin: 12px 0 0; line-height: 1.6; }
.scan-lock-preview { display: grid; gap: 8px; margin-top: 16px; padding: 14px; border: 1px solid var(--line); background: #eeebe2; }
.scan-lock-preview strong { color: var(--ink); font-size: 13px; }
.scan-lock-preview > span { color: var(--muted); font-size: 12px; }
.scan-lock-preview__rows { display: grid; gap: 6px; margin-top: 4px; }
.scan-lock-preview__rows span { display: block; overflow: hidden; border-radius: 3px; color: transparent; background: linear-gradient(90deg, #d3d0c7 0 64%, #c6c3ba 64% 100%); filter: blur(3px); user-select: none; }
@media (max-width: 960px) {
  .stats-row { grid-template-columns: repeat(2, 1fr); }
  .stats-row > div:nth-child(2) { border-right: 0; }
  .stats-row > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}
@media (max-width: 700px) {
  /* Phones: centred eyebrow, then the two programs side by side as stacked
     lockups (mark above name) so neither wraps onto its own ragged line. */
  .programs-strip { flex-direction: column; align-items: center; gap: 18px; padding-block: 22px; text-align: center; }
  .programs-garden { justify-content: center; gap: 18px 40px; }
  .program { flex-direction: column; gap: 9px; }
  .program-mark--nvidia { height: 24px; }
  .program-mark--zendesk { height: 26px; }
  .program-name { font-size: 12px; color: var(--muted); }
  .stats-proof { padding-block: 58px 48px; }
  .stats-row { margin-top: 32px; }
  .stats-row > div { padding: 22px 12px; }
}