/* Escudo en SVG, seis ramales. Sin tarjetas alrededor. */
#seguridad .seguridad__cabecera { margin-bottom: clamp(64px, 7vw, 96px); text-align: center; }
#seguridad .eyebrow { justify-content: center; }
#seguridad .seguridad__sistema { position: relative; isolation: isolate; }
#seguridad .seguridad__conexiones { position: absolute; z-index: -1; inset: 0; width: 100%; height: 100%; overflow: visible; }
#seguridad .seguridad__entrada, #seguridad .seguridad__interior, #seguridad .seguridad__conexion, #seguridad .seguridad__salida, #seguridad .seguridad__palomita { stroke: var(--oro); }
#seguridad .seguridad__entrada, #seguridad .seguridad__mitad, #seguridad .seguridad__interior, #seguridad .seguridad__conexion, #seguridad .seguridad__salida, #seguridad .seguridad__palomita { stroke-dasharray: 1; stroke-dashoffset: 0; }
#seguridad .seguridad__entrada, #seguridad .seguridad__conexion, #seguridad .seguridad__salida { stroke-width: 1; }
#seguridad .seguridad__cuerpo { fill: var(--blanco-calido); }
/* El trazo trae el degradado #seguridad-oro como atributo: url() en esta hoja no lo encontraría. */
#seguridad .seguridad__mitad { stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
#seguridad .seguridad__palomita { stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
#seguridad .seguridad__interior { stroke-width: .75; opacity: .45; }
#seguridad .seguridad__nodo { fill: var(--oro); stroke: var(--marfil-2); stroke-width: 1.5; }
#seguridad .seguridad__centro { position: absolute; z-index: -1; top: 50%; left: 50%; width: 33%; aspect-ratio: 1; transform: translate(-50%, -50%); }
#seguridad .seguridad__capas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 36%; row-gap: 38px; }
#seguridad .seguridad__capa { position: relative; display: grid; grid-template-columns: 28px minmax(0, 1fr); align-content: start; gap: 16px; min-height: 132px; }
#seguridad .seguridad__emblema { display: flex; justify-content: center; align-items: center; width: 28px; height: 32px; background: var(--marfil-2); }
/* Las dos columnas se reflejan alrededor del escudo. */
@media (min-width: 900px) {
  #seguridad .seguridad__capa:nth-child(odd) { grid-template-columns: minmax(0, 1fr) 28px; text-align: right; }
  #seguridad .seguridad__capa:nth-child(odd) .seguridad__emblema { order: 2; }
  #seguridad .seguridad__capa:nth-child(odd) .seguridad__texto p { margin-left: auto; text-wrap: balance; }
}
#seguridad .seguridad__emblema .icono { color: var(--oro-texto); width: var(--ico-m, 24px); height: var(--ico-m, 24px); }
#seguridad .seguridad__texto h3 { margin: 3px 0 12px; color: var(--tinta); font-size: var(--t-h4, 1.125rem); line-height: 1.25; font-weight: 600; letter-spacing: -.015em; }
#seguridad .seguridad__texto p { color: var(--texto-2); font-size: var(--t-desc, 1.0625rem); line-height: var(--lh-desc, 1.47); max-width: 29ch; text-wrap: pretty; }
@media (min-width: 900px) and (max-width: 1099px) {
  #seguridad .seguridad__capas { column-gap: 28%; }
  #seguridad .seguridad__centro { width: 29%; }
  #seguridad .seguridad__capa { gap: 12px; }
}
@media (max-width: 899px) {
  #seguridad .wrap { padding-inline: 16px; }
  #seguridad .seguridad__cabecera { text-align: left; margin-bottom: 32px; }
  #seguridad .eyebrow { justify-content: flex-start; }
  #seguridad .seguridad__centro { position: relative; z-index: 0; inset: auto; width: 100%; height: 212px; aspect-ratio: auto; margin: 0 auto 44px; transform: none; }
  #seguridad .seguridad__capas { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  #seguridad .seguridad__capa { min-height: 0; gap: 20px; }
  #seguridad .seguridad__texto h3 { margin-top: 2px; margin-bottom: 10px; }
  #seguridad .seguridad__texto p { max-width: 48ch; }
  #seguridad .seguridad__emblema { position: relative; z-index: 1; }
}
