/* ===========================================================
   Spacivo Highlight Strip — centered title above a continuously
   auto-scrolling row of white tiles (image + text). Same seamless-loop
   technique as spacivo-marquee: .spacivo-hs-viewport clips the overflow,
   .spacivo-hs-track is printed with two identical .spacivo-hs-set groups
   and animated by exactly -50% so the loop has no visible seam or JS
   scroll logic. Self-contained plugin CSS (no theme dependency beyond the
   theme's own .container wrapper). Title and tile text font/size/color
   come from inline styles (admin-configurable); this file only handles
   layout.
   =========================================================== */

.spacivo-hs-section { padding: 3rem 0; background: #FAF7F1; }
.spacivo-hs-heading { margin: 0 0 1.75rem; text-align: center; }

.spacivo-hs-viewport { overflow: hidden; padding: .5rem 0 1rem; }
.spacivo-hs-track {
  display: flex; width: max-content;
  animation-name: spacivo-hs-scroll;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.spacivo-hs-viewport:hover .spacivo-hs-track { animation-play-state: paused; }

@keyframes spacivo-hs-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.spacivo-hs-set { display: flex; gap: 1.25rem; flex-shrink: 0; padding: 0 .625rem; }

.spacivo-hs-tile {
  flex: 0 0 190px; background: #fff; border-radius: 10px; padding: 1.5rem 1rem;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
.spacivo-hs-tile__image {
  width: 84px; height: 84px; margin-bottom: 1rem;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.spacivo-hs-tile__image img { width: 100%; height: 100%; object-fit: contain; }
.spacivo-hs-tile__text { margin: 0; line-height: 1.4; font-weight: 600; }

.spacivo-hs-unconfigured-notice {
  font-size: .85rem; color: #a22022; background: #fff3f3; border: 1px dashed #a22022;
  padding: .75rem 1rem; margin: 1rem auto; max-width: 1280px;
}

@media (max-width: 600px) {
  .spacivo-hs-tile { flex-basis: 150px; padding: 1.25rem .85rem; }
  .spacivo-hs-tile__image { width: 64px; height: 64px; }
}

@media (prefers-reduced-motion: reduce) {
  .spacivo-hs-track { animation: none; }
}