/* ==========================================================================
   DIFERENCIACIÓN — "IA con contexto empresarial."
   Three editorial rows on dark: number · statement · explanation.
   A yellow rule draws across each row on hover.
   ========================================================================== */

.trust__list {
  grid-column: 1 / -1;
  border-bottom: 1px solid var(--line);
}

.trust__item {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: var(--grid-column-gap);
  align-items: baseline;
  padding-block: var(--space-7);
  border-top: 1px solid var(--line);
}

.trust__item::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  width: 100%;
  height: 2px;
  background: var(--color-accent);
  transform: scaleX(.06);
  transform-origin: left;
  transition: transform .7s var(--ease-out-quart);
}

@media (hover: hover) {
  .trust__item:hover::before {
    transform: scaleX(1);
  }
}

.trust__num {
  grid-column: 1 / span 1;
  color: var(--accent-ink);
}

.trust__title {
  grid-column: 2 / span 6;
}

.trust__text {
  grid-column: 9 / span 4;
  color: var(--muted);
  font-size: var(--text-body-lg);
  line-height: 1.4;
}

.trust__more {
  grid-column: 1 / -1;
  margin-top: var(--space-6);
}

@media (max-width: 1023px) {
  .trust__title { grid-column: 2 / span 11; }

  .trust__text {
    grid-column: 2 / span 10;
    margin-top: var(--space-4);
  }
}

@media (max-width: 767px) {
  .trust__item {
    grid-template-columns: 1fr;
    padding-block: var(--space-6);
  }

  .trust__num,
  .trust__title,
  .trust__text { grid-column: 1; }

  .trust__title { margin-top: var(--space-3); }

  .trust__text {
    margin-top: var(--space-3);
    font-size: var(--text-body);
  }
}