/* A continuous scene with separate viewports rather than a shrinking desktop illustration. */
.hero-scene {
  width: 100%;
  margin: 24px 0 0;
  line-height: 0;
  pointer-events: none;
}

.hero-scene__art {
  display: block;
  width: 100%;
  height: 170px;
  overflow: visible;
}

.hero-scene__art > svg {
  overflow: visible;
}

@media (max-width: 900px) {
  .hero-scene__art {
    height: 155px;
  }
}

@media (max-width: 560px) {
  .hero-scene__art {
    height: 145px;
  }

  .hero-scene__audience {
    x: -1%;
    width: 32%;
  }

  .hero-scene__product {
    x: 27%;
    width: 53%;
  }

  .hero-scene__return {
    x: 78%;
    width: 23%;
  }
}

.hero-value-first{padding-bottom:24px}
@media(prefers-reduced-motion:no-preference){
 .hero-scene__thread path{stroke-dasharray:1500;animation:hero-trace 2s cubic-bezier(.2,.6,.2,1) both}
 .hero-scene__conversation{transform-box:fill-box;transform-origin:center;animation:hero-conversation .8s .3s cubic-bezier(.2,.6,.2,1) both}
 @keyframes hero-trace{from{stroke-dashoffset:1500}to{stroke-dashoffset:0}}
 @keyframes hero-conversation{from{transform:translateY(12px) scale(.94)}to{transform:none}}
}

.notes-teaser-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-top:48px}
.notes-teaser-grid article{min-width:0}.notes-teaser-image{display:block;overflow:hidden;border-radius:5px}
.notes-teaser-image img{display:block;width:100%;aspect-ratio:5/3;object-fit:cover;object-position:center 47%;transition:transform .5s}
.notes-teaser-image:hover img{transform:scale(1.025)}
.notes-teaser h3{font:400 clamp(25px,2.7vw,38px)/1.45 var(--serif);letter-spacing:-.8px;margin-top:24px}
.notes-teaser h3 a:hover{text-decoration:underline;text-underline-offset:.2em}
.notes-teaser>.inline-link{margin-top:34px}
@media(max-width:800px){.notes-teaser-grid{gap:32px}.notes-teaser h3{font-size:26px}}
@media(max-width:560px){.notes-teaser-grid{grid-template-columns:1fr;gap:38px;margin-top:30px}.notes-teaser h3{font-size:27px;margin-top:18px}.header nav{gap:11px}.header nav a{padding-inline:1px}}
@media(max-width:360px){.header nav{gap:9px;font-size:10px}}
