/* =========================================================
   Voctos — GEO: How It Works (4 step cards; mobile carousel)
   ========================================================= */
.voctos-geo-howworks { font-family: 'Unbounded', sans-serif; }
.voctos-geo-howworks .howworks-inner { max-width: 1300px; margin: 0 auto; padding: 0 0 40px; }
@media (min-width: 1024px) { .voctos-geo-howworks .howworks-inner { padding: 0 0 56px; } }

.voctos-geo-howworks .howworks-heading { font-size: 24px; font-weight: 400; line-height: 2rem; color: #0d172d; margin: 0 0 12px; }
@media (min-width: 1024px) { .voctos-geo-howworks .howworks-heading { font-size: 38px; margin: 0 0 16px; } }
.voctos-geo-howworks .howworks-intro { font-size: 14px; font-weight: 400; line-height: 1.625; color: #0d172d; margin: 0 0 28px; }
@media (min-width: 1024px) { .voctos-geo-howworks .howworks-intro { font-size: 16px; margin: 0 0 36px; } }

/* mobile = swipe carousel, sm = 2-col grid, lg = 4-col grid */
.voctos-geo-howworks .howworks-track {
  display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch; padding-bottom: 4px;
}
.voctos-geo-howworks .howworks-track::-webkit-scrollbar { display: none; }
@media (min-width: 640px) {
  .voctos-geo-howworks .howworks-track { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; overflow: visible; }
}
@media (min-width: 1024px) { .voctos-geo-howworks .howworks-track { grid-template-columns: repeat(4, 1fr); } }

.voctos-geo-howworks .howworks-card {
  flex: 0 0 85%; scroll-snap-align: start;
  min-height: 286px; background: #fff; border-radius: 20px;
  padding: 20px 15px; box-shadow: 0 12px 27px 0 rgba(0,0,0,.14);
}
@media (min-width: 640px) {
  .voctos-geo-howworks .howworks-card { flex: none; min-height: 0; border-radius: 21px; padding: 25px 20px 20px; }
}

.voctos-geo-howworks .howworks-head { display: flex; align-items: center; gap: 16px; margin-bottom: 15px; }
@media (min-width: 640px) { .voctos-geo-howworks .howworks-head { margin-bottom: 25px; } }
.voctos-geo-howworks .howworks-num {
  flex-shrink: 0; display: flex; align-items: center; justify-content: center;
  width: 35px; height: 35px; border-radius: 50%; background: #CAD63A;
  color: #0d172d; font-size: 18px; font-weight: 400; line-height: 1;
}
@media (min-width: 640px) { .voctos-geo-howworks .howworks-num { width: 43px; height: 43px; font-size: 20px; } }
.voctos-geo-howworks .howworks-title { font-size: 18px; font-weight: 500; line-height: 1.25; color: #0d172d; margin: 0; }
@media (min-width: 640px) { .voctos-geo-howworks .howworks-title { font-size: 20px; } }

.voctos-geo-howworks .howworks-body { display: flex; flex-direction: column; gap: 20px; }
.voctos-geo-howworks .howworks-desc { font-size: 16px; font-weight: 400; line-height: 1.375; color: #0d172d; margin: 0; }
@media (min-width: 640px) { .voctos-geo-howworks .howworks-desc { line-height: 1.625; } }

.voctos-geo-howworks .howworks-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.voctos-geo-howworks .howworks-list li { display: flex; align-items: center; gap: 14px; font-size: 14px; line-height: 1.25; color: #0d172d; }
.voctos-geo-howworks .howworks-check { width: 11px; height: 9px; flex-shrink: 0; color: #7616f4; }
