/* =========================================================
   NÚMEROS FINOS · Novedades (noticias + embudo)
   Reutiliza los tokens de styles.css.
   ========================================================= */

/* encabezado de página (mismo patrón que trámites) */
.page-head { padding: 3.2rem 0 1rem; position: relative; overflow: hidden; background: #fff; }
.page-head .section__sub { margin-top: 1.1rem; text-wrap: balance; }

/* ---- Novedad destacada ---- */
.novedad--feat {
  display: block;
  background: var(--gris-claro);
  border: 1px solid var(--gris-claro);
  border-left: 5px solid var(--azul);
  border-radius: var(--radius);
  padding: 1.8rem;
  margin-bottom: 2rem;
}
.novedad--feat .novedad__body { display: flex; flex-direction: column; gap: .7rem; }
.novedad--feat .novedad__title { font-size: 1.7rem; line-height: 1.15; }
.novedad--feat .novedad__excerpt { max-width: 68ch; }
.novedad--feat .btn { align-self: flex-start; margin-top: .6rem; }

/* ---- Grilla de novedades ---- */
.novedades-grid { display: grid; gap: 1.2rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .novedades-grid { grid-template-columns: repeat(2, 1fr); } }

/* tarjeta de novedad */
.novedad {
  display: flex; flex-direction: column; gap: .7rem;
  background: #fff; border: 1px solid var(--gris-claro); border-radius: var(--radius);
  padding: 1.5rem; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.novedades-grid .novedad:hover { border-color: var(--azul); box-shadow: 0 8px 26px rgba(2, 2, 1, .07); transform: translateY(-2px); }

.novedad__meta { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.novedad__tag {
  font-family: var(--ff-mono); text-transform: uppercase; letter-spacing: .08em;
  font-size: .68rem; color: var(--azul);
  background: rgba(21, 13, 247, .09); padding: .28rem .6rem; border-radius: 999px;
}
.novedad__tag--urg { color: #fff; background: var(--azul); }
.novedad__meta time { font-family: var(--ff-mono); font-size: .74rem; color: var(--gris); }

.novedad__title { font-family: var(--ff-tit); font-weight: 700; font-size: 1.2rem; line-height: 1.2; margin: 0; }
.novedad__excerpt { font-family: var(--ff-txt); font-size: .93rem; line-height: 1.6; color: var(--gris); margin: 0; }
.novedad__excerpt a { color: var(--azul); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.novedad__excerpt a:hover { text-decoration: none; }
.novedad__link {
  margin-top: auto; align-self: flex-start;
  font-family: var(--ff-txt); font-weight: 700; font-size: .9rem; color: var(--azul);
  text-decoration: none; border-bottom: 2px solid transparent; padding-bottom: 2px;
  transition: border-color .15s ease;
}
.novedad__link:hover { border-color: var(--azul); }
.novedad__link:focus-visible { outline: 3px solid var(--azul); outline-offset: 3px; }

.novedades-note { font-family: var(--ff-txt); font-size: .92rem; color: var(--gris); max-width: 66ch; margin: 2.4rem auto 0; text-align: center; line-height: 1.6; }
.novedades-note a { color: var(--azul); font-weight: 700; }

/* ---- Embudo / suscripción ---- */
.sub-box { display: grid; gap: 1.6rem; align-items: center; }
@media (min-width: 860px) { .sub-box { grid-template-columns: 1.1fr .9fr; gap: 3rem; } }
.sub-box .section__title { margin-top: .3rem; }
.sub-box .section__sub { margin-top: .9rem; }

.sub-form { display: flex; flex-direction: column; gap: .8rem; }
.sub-form__input {
  font-family: var(--ff-txt); font-size: 1rem; color: var(--negro);
  padding: .9rem 1.1rem; border: 2px solid var(--gris-claro); border-radius: 10px;
  background: #fff; transition: border-color .15s ease;
}
.sub-form__input::placeholder { color: #9a9a9a; }
.sub-form__input:focus { outline: none; border-color: var(--azul); }
.sub-form .btn { width: 100%; justify-content: center; }
.sub-form__msg { font-family: var(--ff-txt); font-size: .9rem; margin: .2rem 0 0; min-height: 1.2em; }
.sub-form__msg.is-ok { color: #0a7a3d; font-weight: 700; }
.sub-form__msg.is-err { color: #c02626; font-weight: 700; }
.sub-form__legal { font-family: var(--ff-mono); font-size: .68rem; line-height: 1.5; color: var(--gris); margin: .3rem 0 0; }

/* accesibilidad: etiqueta oculta visualmente */
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}