/* ============================================================
   Red de seguridad responsive — Ingeniería, PSC
   Evita que el texto o los campos se desborden en el teléfono
   en vertical. No cambia la lógica ni los datos; solo el acomodo
   visual en pantallas angostas.
   ============================================================ */

/* Permite que los elementos flex/grid encojan y el texto haga wrap
   en vez de salirse del borde. */
*, *::before, *::after { min-width: 0; }

/* Nada empuja el ancho de la página más allá de la pantalla. */
html, body { overflow-x: hidden; }

/* Medios y campos nunca exceden su contenedor. */
img, canvas, video { max-width: 100%; }
input, select, textarea, button { max-width: 100%; }

/* Palabras/URLs largas bajan de línea en vez de desbordar. */
p, span, b, li, td, th, label, div { overflow-wrap: anywhere; }

@media (max-width: 600px){
  /* Filas con varios campos en una línea → se apilan a lo ancho completo. */
  .rowline{ flex-wrap: wrap; }
  .rowline > input:not([type="checkbox"]):not(.chk),
  .rowline > select,
  .rowline > textarea{ flex: 1 1 100% !important; }

  /* Grillas comunes de formularios → una sola columna en el teléfono. */
  .fg, .accs, .grid4{ grid-template-columns: 1fr !important; }
}