/* A quiet, continuous toolbelt for the close of section 01. */
#hacemos .toolbelt-marquee {
  position: relative;
  width: calc(100% + 12vw);
  margin: 64px -6vw -104px;
  overflow: hidden;
  border-top: 1px solid #d8d2ca;
  border-bottom: 1px solid #d8d2ca;
  background: #fff;
  color: #161412;
}

#hacemos .toolbelt-marquee::before,
#hacemos .toolbelt-marquee::after {
  content: '';
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  width: min(11vw, 150px);
  pointer-events: none;
}

#hacemos .toolbelt-marquee::before { left: 0; background: linear-gradient(90deg, #fff 15%, transparent); }
#hacemos .toolbelt-marquee::after { right: 0; background: linear-gradient(270deg, #fff 15%, transparent); }

#hacemos .toolbelt-track {
  display: flex;
  width: max-content;
  will-change: transform;
  animation: pulso-toolbelt-scroll 38s linear infinite;
}

#hacemos .toolbelt-group {
  display: flex;
  align-items: center;
  gap: clamp(38px, 5vw, 88px);
  flex: 0 0 auto;
  min-width: max-content;
  padding: 25px clamp(22px, 3vw, 48px);
}

#hacemos .toolbelt-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #171512;
  font-family: Aileron, Arial, sans-serif;
  font-size: clamp(16px, 1.45vw, 23px);
  font-weight: 700;
  letter-spacing: -.045em;
  line-height: 1;
  white-space: nowrap;
  opacity: .9;
  transition: color .25s ease, opacity .25s ease;
}

#hacemos .toolbelt-brand::before {
  content: '';
  width: 5px;
  height: 5px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #c63d2d;
  opacity: 0;
  transform: scale(.5);
  transition: opacity .25s ease, transform .25s ease;
}

#hacemos .toolbelt-brand.brand-n8n { font-weight: 800; letter-spacing: -.08em; }
#hacemos .toolbelt-brand.brand-make { letter-spacing: -.065em; }

#hacemos .toolbelt-marquee:hover .toolbelt-track,
#hacemos .toolbelt-marquee:focus-within .toolbelt-track { animation-play-state: paused; }

#hacemos .toolbelt-marquee:hover .toolbelt-brand { opacity: .55; }
#hacemos .toolbelt-marquee:hover .toolbelt-brand:hover { color: #c63d2d; opacity: 1; }
#hacemos .toolbelt-marquee:hover .toolbelt-brand:hover::before { opacity: 1; transform: scale(1); }

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

@media (max-width: 850px) {
  #hacemos .toolbelt-marquee { width: calc(100% + 44px); margin: 48px -22px -70px; }
  #hacemos .toolbelt-group { gap: 38px; padding: 21px 22px; }
  #hacemos .toolbelt-track { animation-duration: 30s; }
}

@media (prefers-reduced-motion: reduce) {
  #hacemos .toolbelt-track { animation: none; transform: none; }
  #hacemos .toolbelt-group:nth-child(2) { display: none; }
}