/* ==========================================================================
   UTILITIES
   Small, single-purpose helper classes. Unlike components, these carry
   no identity of their own — they only ever modify or wrap something
   else, and are meant to be combined freely (e.g. class="button wide").
   ========================================================================== */

/* Stretches any .button to fill its container's width. */
.button.wide {
  width: 100%;
}

/* Standalone styled inline link (yellow, underlined) used outside of
   buttons and cards — e.g. "Saber más", "Solicitar propuesta". */
.text-link {
  display: inline-flex;
  margin-top: 14px;
  color: var(--yellow);
  font-weight: 900;
  border-bottom: 2px solid var(--yellow);
}

/* Wraps any wide content (tables today; diagrams tomorrow) so it scrolls
   horizontally on narrow screens instead of breaking page layout. */
.table-scroll {
  overflow-x: auto;
}