/* Scoped styles for A iVOOX, after the shared typography rules. */
body.about-page .about-youtube .lead { color:#13162A; }
.about-page .about-youtube-content {
  display:flex;
  flex-direction:column;
  align-items:center;
  max-width:760px;
  margin:0 auto;
  text-align:center;
}
.about-page .about-youtube-icon {
  display:grid;
  place-items:center;
  width:84px;
  height:84px;
  margin-bottom:24px;
  border-radius:50%;
  background:#FF6B00;
  color:#fff;
}
.about-page .about-youtube-icon svg { width:42px; height:42px; }
.about-page .about-youtube h2 { margin:0 0 22px; }
.about-page .about-youtube .btn { margin-top:30px; }
.about-page .stats-track { display:contents; }
.about-page .stats-clone { display:none; }

@media (max-width:860px) {
  .about-page .about-logo { order:-1; }
}

@media (max-width:760px) {
  .about-page .about-stats .stats {
    display:block;
    overflow:hidden;
    padding:14px 0 8px;
    border:1px solid #DFE4EE;
    border-radius:20px;
    background:#fff;
  }
  .about-page .stats-track {
    display:flex;
    width:max-content;
    animation:about-stats-carousel 22s linear infinite;
  }
  .about-page .stat {
    flex:0 0 74vw;
    padding:16px 18px;
    border-right:1px solid #DFE4EE;
  }
  .about-page .stats-clone { display:contents; }
  .about-page .stat .num {
    color:#13162A;
    background:none;
    -webkit-text-fill-color:currentColor;
    font-size:clamp(28px,3vw,40px);
    font-weight:700;
  }
  body.about-page .about-stats .stat .lbl {
    margin-top:5px;
    color:#13162A;
    font-size:12px;
    letter-spacing:0;
    text-transform:none;
  }
  .about-page .about-stats .stats:hover .stats-track { animation-play-state:paused; }
}
@media (max-width:480px) {
  .about-page .stat { flex-basis:calc(100vw - 80px); }
}
@keyframes about-stats-carousel {
  from { transform:translateX(0); }
  to { transform:translateX(-50%); }
}
@media (prefers-reduced-motion:reduce) {
  .about-page .stats-track { animation:none; }
  .about-page .about-stats .stats { overflow-x:auto; }
  .about-page .stats-clone { display:none; }
}
