/* Webs informativas (27-10-2026): piezas propias de las calculadoras y del calendario. Se carga DESPUÉS de estilos.css
   y solo en las webs de montar.ESTATICOS_COMPARTIDOS. Sin recursos externos. */
.portada.informativa { padding: 2.4rem 0 2.6rem; background: linear-gradient(180deg, #fff, var(--acento-claro)); }
.portada.informativa h1 { font-size: clamp(2rem, 6vw, 3.1rem); }
.grupo-tarjetas { font-size: 1.3rem; margin: 2.2rem 0 1rem; }
.grupo-tarjetas:first-child { margin-top: 0; }
@media (min-width: 700px) { .rejilla.tres { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1040px) { .rejilla.tres { grid-template-columns: repeat(3, 1fr); } }
.calculadora output, .calculadora .salida-larga { display: block; font-weight: 650; color: var(--tinta); }
.calculadora textarea { width: 100%; min-height: 6rem; font: inherit; padding: .7rem .8rem; border: 1px solid var(--borde);
  border-radius: 12px; }
.calculadora input[type=date], .calculadora input[type=number] { width: 100%; font: inherit; padding: .7rem .8rem;
  border: 1px solid var(--borde); border-radius: 12px; background: #fff; min-height: 46px; }
.calculadora .boton { width: auto; }
.veredicto { margin-top: 1rem; padding: .9rem 1rem; border-radius: 12px; background: var(--suave); border-left: 4px solid var(--gris); }
.veredicto h3 { margin: 0 0 .3rem; font-size: 1.02rem; }
.veredicto p { margin: 0; font-size: .95rem; }
.veredicto[data-tono="si"], .veredicto[data-tono="ok"] { border-left-color: var(--acento); background: var(--acento-claro); }
.veredicto[data-tono="no"] { border-left-color: var(--gris); }
.veredicto[data-tono="error"] { border-left-color: #b42318; background: #fef3f2; }
.lista-validacion { list-style: none; padding: 0; margin: 1rem 0 0; }
.lista-validacion li { padding: .55rem .8rem; border-radius: 10px; margin-top: .4rem; background: var(--suave); }
.lista-validacion li[data-tono="ok"] { background: var(--acento-claro); }
.lista-validacion li[data-tono="error"] { background: #fef3f2; color: #7a271a; }
.qr-caja { margin-top: 1.1rem; text-align: center; }
.qr-caja svg { width: 180px; height: 180px; max-width: 100%; background: #fff; padding: 10px; border: 1px solid var(--borde);
  border-radius: 10px; }
.qr-leyenda { font-weight: 700; color: var(--tinta); margin: .4rem 0 0; }
.qr-muestra { display: inline-block; margin-top: .5rem; font-size: .8rem; font-weight: 750; letter-spacing: .06em;
  text-transform: uppercase; color: #7a271a; background: #fef3f2; padding: .2rem .6rem; border-radius: 6px; }
.url-qr { word-break: break-all; font-size: .82rem; background: var(--suave); padding: .5rem .7rem; border-radius: 8px; }
/* Banners propios (publicidad.py). Caja con los colores del ANUNCIANTE (no los de la web) y rótulo «Publicidad» encima,
   para que no se confundan con el contenido. Sin imágenes ni JavaScript: la marca es su inicial en su color. */
.anuncio { --anunciante: #1f6fe5; --anunciante-oscuro: #1f4e79; --anunciante-claro: #f1f6fd; margin: 2rem 0; font-size: .92rem; }
.anuncio[data-anunciante="nomiblio"] { --anunciante: #5b4be0; --anunciante-oscuro: #3a2f8c; --anunciante-claro: #f4f2fe; }
.anuncio[data-anunciante="legablio"] { --anunciante: #c03a4e; --anunciante-oscuro: #6a1d2c; --anunciante-claro: #fcf1f3; }
.anuncio p { margin: 0; }
.anuncio .anuncio-rotulo { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; margin-bottom: .45rem;
  font-size: .74rem; color: var(--gris); }
.anuncio-pastilla { font-weight: 750; text-transform: uppercase; letter-spacing: .07em; color: var(--tinta); background: #fff;
  border: 1px solid var(--borde); border-radius: 5px; padding: .05rem .45rem; }
.anuncio-rotulo a { color: var(--gris); text-decoration: underline dotted; text-underline-offset: 2px; }
.anuncio-cuerpo { display: grid; grid-template-columns: auto 1fr auto; gap: .9rem 1.1rem; align-items: center;
  padding: 1rem 1.1rem; background: var(--anunciante-claro); border: 1px solid color-mix(in srgb, var(--anunciante) 20%, #fff);
  border-left: 4px solid var(--anunciante); border-radius: 14px; }
.anuncio-inicial { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; background: var(--anunciante);
  color: #fff; font-weight: 800; font-size: 1.15rem; line-height: 1; }
.anuncio-titular { color: var(--tinta); line-height: 1.45; }
.anuncio-marca { color: var(--anunciante-oscuro); margin-right: .1rem; }
.anuncio .anuncio-detalle { margin-top: .25rem; font-size: .85rem; color: var(--texto); }
.anuncio-detalle b { color: var(--tinta); font-weight: 650; }
.anuncio a.anuncio-cta { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .55rem 1rem;
  border-radius: 10px; background: var(--anunciante-oscuro); color: #fff; font-weight: 700; text-decoration: none;
  text-align: center; line-height: 1.25; }
.anuncio a.anuncio-cta:hover { background: color-mix(in srgb, var(--anunciante-oscuro) 85%, #000); }
.anuncio a.anuncio-cta:focus-visible { outline: 3px solid var(--anunciante); outline-offset: 2px; }
@media (min-width: 640px) { .anuncio-horizontal a.anuncio-cta { max-width: 15rem; } }
/* Tarjeta en el móvil: la marca y el texto arriba, el botón a todo el ancho debajo */
@media (max-width: 639px) {
  .anuncio-cuerpo { grid-template-columns: auto 1fr; align-items: start; }
  .anuncio a.anuncio-cta { grid-column: 1 / -1; width: 100%; }
}
/* Lateral: solo en pantallas anchas, en el margen derecho de la columna de texto (52rem), sin quitarle ancho al texto
   (el margen negativo deja su caja fuera de la columna). En pantallas más estrechas no se muestra. */
.anuncio-lateral { display: none; }
@media (min-width: 1380px) {
  .anuncio-lateral { display: block; float: right; clear: right; width: 14rem; margin: .4rem -16.6rem 1rem 0; }
  .anuncio-lateral .anuncio-cuerpo { grid-template-columns: 1fr; gap: .7rem; border-left-width: 1px;
    border-top: 4px solid var(--anunciante); }
  .anuncio-lateral .anuncio-inicial { width: 34px; height: 34px; font-size: 1rem; }
}
@media print { .anuncio { display: none; } }
.fuentes-oficiales { font-size: .88rem; color: var(--gris); border-top: 1px solid var(--borde); margin-top: 1.6rem; padding-top: .9rem; }
.fuentes-oficiales ul { padding-left: 1.1rem; margin: .3rem 0 0; }
.mes-calendario { margin-top: 2rem; }
.mes-calendario h2 { font-size: 1.35rem; }
.plazos td:first-child { white-space: nowrap; font-weight: 600; color: var(--tinta); }
.plazos tr.proxima td { background: var(--acento-claro); }
.descargas-ics { display: grid; gap: .8rem; grid-template-columns: 1fr; }
@media (min-width: 760px) { .descargas-ics { grid-template-columns: repeat(2, 1fr); } }
.descargas-ics .tarjeta { display: flex; flex-direction: column; gap: .6rem; }
.descargas-ics .acciones { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: auto; }
.pendiente { display: inline-block; font-size: .78rem; font-weight: 700; color: #7a4b00; background: #fff4e0; border-radius: 6px;
  padding: .1rem .5rem; }
.pasos-howto { padding-left: 1.3rem; }
.pasos-howto li { margin: .35rem 0; }