/*
 * Only Upwards — v2 "Ascent" composition.
 * Loaded after hero3d.css. Stepped pedestal + floating stat chips around the
 * hero 3D mark, and the ink editorial ticker band (.ou-ticker).
 * Cream/ink editorial only — no neon, no glows.
 */

/* ------------------------------------------------------------------ */
/* Stepped pedestal — three offset slabs rising left-to-right.        */
/* Sits behind the 3D stack inside #ou-hero3d. Parallax via           */
/* --ou-par-x/--ou-par-y (set by hero3d.js, opposite the cursor).     */
/* ------------------------------------------------------------------ */
/* ------------------------------------------------------------------ */
/* Floating stat chips — cream-light cards at the mark's upper-left    */
/* and lower-right. Numbers use [data-ou-count] (interactions.js).     */
/* ------------------------------------------------------------------ */
/* ------------------------------------------------------------------ */
/* Ticker band — bold editorial ink ribbon after the features section. */
/* interactions.js (.ou-marquee) clones the track set and animates it. */
/* ------------------------------------------------------------------ */
.ou-ticker {
  overflow: hidden;
  background: var(--ou-ink, #0B0B0B);
  color: var(--ou-cream, #F4F0EB);
  padding: 18px 0;
}
.ou-ticker .ou-marquee-track {
  display: flex;
  align-items: center;
  gap: clamp(26px, 3.6vw, 54px);
  width: max-content;
  padding-left: clamp(26px, 3.6vw, 54px);
}
.ou-ticker-item {
  font-family: "Inter Tight", Inter, sans-serif;
  font-size: clamp(18px, 2.2vw, 26px);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}
.ou-ticker-arrow {
  width: 0.8em;
  height: 0.8em;
  flex: none;
  display: block;
}

/* ------------------------------------------------------------------ */
/* Responsive                                                          */
/* ------------------------------------------------------------------ */
@media screen and (max-width: 991px) {
  /* Steps tuck tighter under the smaller mark. */
  }
@media screen and (max-width: 767px) {
  .ou-ticker-item { font-size: 15px; }
  .ou-ticker { padding: 14px 0; }
}

/* Reduced motion: everything static. */
@media (prefers-reduced-motion: reduce) {
  }
