.h5-hero-extras {
  --h5-nav-cyan: var(--h5-theme-colour);
  --h5-nav-ink: var(--h5-theme-light);
  --h5-nav-border: var(--h5-theme-outline-border);
  --h5-stats-border: var(--h5-theme-stats-border);
  --h5-stats-background: var(--h5-theme-stats-background);
  width: calc(100% - var(--space-6)); max-width: var(--h5-extras-width);
  margin-inline: auto; padding-block: var(--space-6);
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4);
  color: var(--h5-nav-ink);
}
.h5-stats {
  grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0; padding: var(--space-4) 0; min-height: var(--h5-stats-height);
  position: relative;
}
.h5-stats::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: var(--h5-stats-background); border-block: var(--h5-stats-border);
  -webkit-backdrop-filter: var(--h5-stats-backdrop-filter);
  backdrop-filter: var(--h5-stats-backdrop-filter);
  -webkit-mask-image: var(--h5-stats-edge-mask);
  mask-image: var(--h5-stats-edge-mask);
}
.h5-stat { position: relative; display: grid; grid-template-columns: var(--h5-stats-icon) auto; column-gap: var(--space-3); align-content: center; justify-content: center; padding-inline: var(--space-4); }
.h5-stat + .h5-stat { border-left: var(--h5-stats-border); }
.h5-stat__icon { grid-row: 1 / 3; align-self: center; display: grid; place-items: center; width: var(--h5-stats-icon); height: var(--h5-stats-icon); padding: var(--space-2); color: var(--h5-nav-cyan); background: var(--h5-stats-icon-background); border: var(--h5-nav-border); border-radius: var(--radius-pill); }
.h5-stat__icon > .h5-icon { display: block; width: var(--h5-stats-glyph-size); height: var(--h5-stats-glyph-size); padding: 0; border: 0; border-radius: 0; overflow: visible; }
.h5-stat dt { grid-column: 2; grid-row: 2; font: var(--h5-card-copy); }
.h5-stat dd { grid-column: 2; grid-row: 1; margin: 0; font: var(--h5-stats-number); color: var(--h5-nav-cyan); }
.h5-stat__value { font-variant-numeric: tabular-nums; }
.h5-after-hero { position: relative; margin-top: calc(var(--h6-proof-overlap, 0px) * -1); }
.h5-after-hero:empty { display: none; }
.h5-hero-extras.is-in-scene { padding-top: 0; }

@media (max-width: 768px) {
  .h5-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--space-5); }
  .h5-stat:nth-child(3) { border-left: 0; }
}
@media (max-width: 560px) {
  .h5-hero-extras { grid-template-columns: minmax(0, 1fr); }
  .h5-stat { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; padding-inline: var(--space-3); }
  .h5-stat__icon { grid-column: 1; grid-row: 1; margin-bottom: var(--space-2); }
  .h5-stat dd { grid-column: 1; grid-row: 2; }
  .h5-stat dt { grid-column: 1; grid-row: 3; }
}

/* Seamless opposing rows, using the supplied client logos without white tiles. */
.h6-clients { grid-column: 1 / -1; min-width: 0; position: relative; isolation: isolate; }
.h6-clients__filters { position: absolute; width: 0; height: 0; }
.h6-clients::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: var(--h6-client-surface); border-top: var(--h5-stats-border);
  -webkit-backdrop-filter: var(--h5-stats-backdrop-filter);
  backdrop-filter: var(--h5-stats-backdrop-filter);
  -webkit-mask-image: var(--h5-stats-edge-mask); mask-image: var(--h5-stats-edge-mask);
}
.h6-clients__head {
  display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  position: relative; align-items: center; min-height: var(--h6-client-header-height);
  gap: var(--space-2); padding-inline: var(--space-4);
}
.h6-clients__head h2 { grid-column: 2; text-align: center; margin: 0; font: var(--h6-client-heading); color: var(--h5-theme-light); }
.h6-clients__rows {
  display: grid; gap: var(--h6-client-row-gap);
  overflow: hidden;
  -webkit-mask-image: var(--h5-stats-edge-mask); mask-image: var(--h5-stats-edge-mask);
}
.h6-clients__row { overflow: hidden; }
.h6-clients__track {
  display: flex; width: max-content;
  animation: h6-clients-right var(--h6-client-duration) var(--h6-client-easing) infinite;
}
.h6-clients__row--2 .h6-clients__track { animation-name: h6-clients-left; }
.h6-clients__group {
  display: flex; flex: none; align-items: center; gap: var(--h6-client-gap);
  padding-right: var(--h6-client-gap);
}
.h6-clients__group img {
  display: block; flex: none; width: var(--h6-client-width); height: var(--h6-client-height);
  object-fit: contain; filter: var(--h6-client-filter);
}
@keyframes h6-clients-right { from { transform: translateX(var(--h6-client-start)); } to { transform: translateX(0); } }
@keyframes h6-clients-left { from { transform: translateX(0); } to { transform: translateX(var(--h6-client-start)); } }
.h6-clients:hover .h6-clients__track,
.h6-clients:focus-within .h6-clients__track,
.h6-clients.is-paused .h6-clients__track,
.h6-clients.is-hidden .h6-clients__track { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .h6-clients__rows { mask-image: none; -webkit-mask-image: none; }
  .h6-clients__row { overflow: visible; }
  .h6-clients .h6-clients__track { animation: none; width: 100%; }
  .h6-clients__group { width: 100%; flex-wrap: wrap; justify-content: center; padding: 0; gap: var(--h6-client-gap); }
  .h6-clients__group[aria-hidden] { display: none; }
}

/* Keep both logo rows and the numbers inside a desktop viewport. */
.h6-fit-screen .h5-hero-extras {
  --h5-stats-height: var(--h6-stats-height-compact);
  gap: 0; padding-block: 0;
}
.h6-fit-screen .h5-stats { padding-block: var(--space-2); }

@media (max-width: 900px) {
  .h6-clients {
    --h6-client-height: var(--h6-client-height-mobile);
    --h6-client-gap: var(--h6-client-gap-mobile);
  }
}