/* GOV-SITIO-11: /modulos/. Se apoya en rubros.css (encabezados de bloque,
   icono, etiqueta, CTA de cierre); aca solo va lo propio de la tarjeta de
   modulo: estados, puntos y rubros recomendados. */

.public-modulos__jump { color: inherit; text-decoration: none; }
.public-modulos__jump:hover { color: var(--public-accent); }

.public-modulos__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: clamp(0.85rem, 1.6vw, 1.25rem); }
.public-modulos__card { display: flex; flex-direction: column; min-height: 0; scroll-margin-top: 6rem; }
.public-modulos__card:target { border-color: rgba(0, 229, 255, 0.6); box-shadow: 0 0 0 1px rgba(0, 229, 255, 0.25); }
.public-modulos__card h3 { margin: 0 0 0.4rem; font: 800 1.18rem/1.2 var(--public-font-title); letter-spacing: -0.02em; }
.public-modulos__card > p { margin: 0; color: var(--public-muted); }

.public-modulos__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.75rem; }
.public-modulos__top .public-rubro__icon { margin-bottom: 0.9rem; }
.public-modulos__badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.35rem; }
.public-modulos__badge { padding: 0.2rem 0.6rem; border: 1px solid var(--public-border); border-radius: 999px; color: var(--public-muted); font-size: 0.72rem; font-weight: 750; white-space: nowrap; }
.public-modulos__badge--beta { border-color: rgba(250, 204, 21, 0.5); background: rgba(250, 204, 21, 0.1); color: #fde68a; }

.public-modulos__points { display: grid; gap: 0.45rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.public-modulos__points li { position: relative; padding-left: 1.1rem; font-size: 0.93rem; line-height: 1.45; }
.public-modulos__points li::before { position: absolute; top: 0.55em; left: 0; width: 0.4rem; height: 0.4rem; border-radius: 50%; background: var(--public-accent); content: ""; }

.public-modulos__rubros { margin-top: auto; padding-top: 1.1rem; }
.public-modulos__rubros .public-rubro__label { margin-bottom: 0.5rem; }
.public-modulos__rubros ul { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0; padding: 0; list-style: none; }
.public-modulos__rubros a { display: inline-block; padding: 0.25rem 0.65rem; border: 1px solid var(--public-border); border-radius: 999px; color: var(--public-text); font-size: 0.8rem; text-decoration: none; }
.public-modulos__card .public-rubro__card-link { margin-top: 1rem; }

.public-modulos__rubros a:focus-visible,
.public-modulos__jump:focus-visible { outline: 2px solid var(--public-focus); outline-offset: 3px; border-radius: var(--public-radius-control); }

@media (hover: hover) and (pointer: fine) {
  .public-modulos__rubros a:hover { border-color: rgba(102, 225, 255, 0.45); color: var(--public-accent); }
}