/* Features-page animation loops (converted from the approved Concept A comp). */
@keyframes fl{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.fl1{animation:fl 7s ease-in-out infinite}.fl2{animation:fl 8s ease-in-out -2s infinite}.fl3{animation:fl 6s ease-in-out -4s infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.6)}}
.pulse{animation:pulse 1.8s ease-in-out infinite}
@keyframes pop{0%,35%{transform:scale(.94)}45%{transform:scale(1.07)}55%,100%{transform:scale(1)}}
.pop{animation:pop 5s ease-in-out infinite}
@keyframes strike{0%{width:0}30%,100%{width:100%}}
.strike{position:absolute;left:0;top:52%;height:3px;width:100%;background:#813C8E;border-radius:2px;animation:strike 5s ease-in-out infinite}
@keyframes chipin{0%{transform:translateX(-36px)}25%,100%{transform:translateX(0)}}
.ci1{animation:chipin 6s ease-out infinite}.ci2{animation:chipin 6s ease-out .4s infinite}.ci3{animation:chipin 6s ease-out .8s infinite}.ci4{animation:chipin 6s ease-out 1.2s infinite}
@keyframes grow{0%{transform:scaleX(.15)}35%,100%{transform:scaleX(1)}}
.grow{transform-origin:left center;animation:grow 6s ease-out infinite}
@keyframes pace{0%{width:92%}55%,100%{width:44%}}
.pace{animation:pace 6s ease-in-out infinite}
@keyframes travel{0%{left:0}100%{left:calc(100% - 10px)}}
.trav{position:absolute;top:-4px;width:10px;height:10px;border-radius:50%;background:#87C9AB;animation:travel 2.4s linear infinite}
@keyframes dash{to{stroke-dashoffset:-40}}
.dash{stroke-dasharray:6 4;animation:dash 1.6s linear infinite}
@keyframes lvA{0%{height:94%}50%,100%{height:58%}}@keyframes lvB{0%{height:22%}50%,100%{height:58%}}@keyframes lvC{0%{height:78%}50%,100%{height:58%}}@keyframes lvD{0%{height:36%}50%,100%{height:58%}}
@keyframes kq{0%,22%{transform:translateY(0)}25%,47%{transform:translateY(-22px)}50%,72%{transform:translateY(-44px)}75%,97%{transform:translateY(-66px)}100%{transform:translateY(0)}}.kq{animation:kq 10s ease-in-out infinite}@media (prefers-reduced-motion: reduce){.kq{animation:none}}
.lvA{animation:lvA 5s ease-in-out infinite}.lvB{animation:lvB 5s ease-in-out infinite}.lvC{animation:lvC 5s ease-in-out infinite}.lvD{animation:lvD 5s ease-in-out infinite}
@keyframes knob{0%,35%{transform:translateX(0)}45%,85%{transform:translateX(26px)}95%,100%{transform:translateX(0)}}
.knob{animation:knob 6s ease-in-out infinite}
/* Always-On Audio: each path lights in turn (blocked, blocked, blocked), then Path 4 goes live and holds.
   Rows animate themselves, so the highlight always lines up at every screen width. 6 s cycle. */
.ao-row{box-shadow:inset 0 0 0 2px #1F201A}
.ao-live{box-shadow:inset 0 0 0 2px #87C9AB}
@keyframes aoBlk{0%,1%{box-shadow:inset 0 0 0 2px #1F201A}4%,15%{box-shadow:inset 0 0 0 2px #87C9AB}18%,100%{box-shadow:inset 0 0 0 2px #1F201A}}
@keyframes aoLive{0%,52%{box-shadow:inset 0 0 0 2px #26271F}56%,97%{box-shadow:inset 0 0 0 2px #87C9AB}100%{box-shadow:inset 0 0 0 2px #26271F}}
.ao-b1{animation:aoBlk 6s ease-in-out infinite}
.ao-b2{animation:aoBlk 6s ease-in-out 1.02s infinite}
.ao-b3{animation:aoBlk 6s ease-in-out 2.04s infinite}
.ao-live{animation:aoLive 6s ease-in-out infinite}
@keyframes shim{0%,100%{color:#12130F}50%{color:#813C8E}}
.hl{animation:shim 4s ease-in-out infinite}.hl2{animation:shim 4s ease-in-out -1.3s infinite}.hl3{animation:shim 4s ease-in-out -2.6s infinite}
@keyframes wv{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
.wv{transform-origin:center;animation:wv 1.1s ease-in-out infinite}
@keyframes spinx{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.08)}}
.mer{transform-box:fill-box;transform-origin:center;animation:spinx 8s ease-in-out infinite}
@keyframes rot{to{transform:rotate(360deg)}}
.rot{transform-origin:150px 150px;animation:rot 40s linear infinite}
@keyframes ringd{0%{stroke-dashoffset:0}100%{stroke-dashoffset:61}}
.ringd{animation:ringd 8s ease-in-out infinite alternate}
@keyframes caret{50%{border-right-color:transparent}}
.caret{border-right:2px solid #87C9AB;padding-right:2px;animation:caret 1s steps(1) infinite}
/* "What only Intravo does": each row lights in reading order, 1 s apart, 12 s cycle. */
.only-list li{margin:0 -12px;padding:0 12px;border-radius:10px;background:#813C8E;animation:onlyRow 12s ease-in-out infinite}
@keyframes onlyRow{0%,1%{background:#813C8E}3%,8%{background:#693276}10%,100%{background:#813C8E}}

@media (max-width: 1100px) {
  .hero-collage { margin: 24px auto 0; }
  .globe-box { min-height: 320px; }
}
@media (max-width: 720px) {
  .hero-collage { display: none !important; }
  .globe-box { min-height: 320px; }
}
.only-list li:nth-child(1){animation-delay:0s}.only-list li:nth-child(2){animation-delay:1s}.only-list li:nth-child(3){animation-delay:2s}.only-list li:nth-child(4){animation-delay:3s}.only-list li:nth-child(5){animation-delay:4s}.only-list li:nth-child(6){animation-delay:5s}.only-list li:nth-child(7){animation-delay:6s}.only-list li:nth-child(8){animation-delay:7s}.only-list li:nth-child(9){animation-delay:8s}.only-list li:nth-child(10){animation-delay:9s}.only-list li:nth-child(11){animation-delay:10s}.only-list li:nth-child(12){animation-delay:11s}