/* The About page: the shared 3D stages (css/jyrex-paleo.css), the three products side by side, and the hourglass
   that closes the page. */
.jyo--hero { height: 160svh; }
.sb__title { margin: 0 0 22px; color: #fff; font-size: clamp(48px, 6.4vw, 96px); font-weight: 300; letter-spacing: -.04em; line-height: .95; }
.jyo--hero .jyo__text > * { max-width: 28rem; }

/* what we make: three columns between thin upright lines, each product with its app icon */
.sb-what { background: #000; padding: clamp(110px, 14vw, 200px) 0; }
.sb-what__title { margin: 0 0 clamp(48px, 6vw, 80px); color: #fff; font-size: clamp(36px, 4.4vw, 66px); font-weight: 300; letter-spacing: -.04em; line-height: 1; text-align: center; }
.sb-what__list { list-style: none; margin: 0 auto; padding: 0; max-width: 1180px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sb-what__list li { display: flex; flex-direction: column; align-items: flex-start; padding: 8px clamp(24px, 3.4vw, 52px); }
.sb-what__list li + li { border-left: 1px solid rgb(234 241 244 / .16); }
.sb-what__icon { width: 64px; height: 64px; border-radius: 15px; }
.sb-what__icon--px { image-rendering: pixelated; border-radius: 0; }
.sb-what__name { margin: 28px 0 12px; color: #fff; font-size: clamp(24px, 2.1vw, 32px); font-weight: 300; letter-spacing: -.03em; line-height: 1.1; }
.sb-what__line { flex: 1; margin: 0 0 22px; max-width: 22em; color: rgb(255 255 255 / .66); font-size: clamp(15px, 1.1vw, 16.5px); line-height: 1.65; }
.sb-what__list .dyn__link { margin-top: 22px; }
@media (max-width: 860px) {
  .sb-what__list { grid-template-columns: 1fr; max-width: 32rem; }
  .sb-what__list li { padding: 36px 0; }
  .sb-what__list li + li { border-left: 0; border-top: 1px solid rgb(234 241 244 / .16); }
}

/* the close: the hourglass on the left, the words on the right */
.jyo--fim { height: 220svh; --flip-col: 38rem; }
.jyo--fim .jyo__text > * { max-width: 38rem; }
.jyo--fim .jyo__title { font-size: clamp(34px, 3.9vw, 58px); }
.sbf__now { font-variant-numeric: tabular-nums; }
.sbf__now [data-year-pct] { color: #3be3a6; }