/* Espacios publicitarios: el lugar se reserva desde el principio para que la página no «brinque» al cargar el banner */
.dnp { position: relative; margin: 24px auto; width: 100%; max-width: var(--dnp-w); text-align: center; }
.dnp__label { display: block; margin-bottom: 4px; font: 600 10px/1.2 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: #8a919c; }
.dnp__box { position: relative; width: 100%; aspect-ratio: var(--dnp-ar); background: #f4f6f9; border-radius: 6px; overflow: hidden; }
.dnp--ready .dnp__box { background: transparent; aspect-ratio: auto; }
.dnp--backup .dnp__box { aspect-ratio: auto; min-height: 90px; background: transparent; }
.dnp__box img { display: block; width: 100%; height: auto; margin: 0 auto; border-radius: 6px; }
.dnp__box a { display: block; }
@media (max-width: 767px) {
	.dnp { max-width: var(--dnp-mw); }
	.dnp__box { aspect-ratio: var(--dnp-mar); }
	.dnp--lateral { display: none; } /* en celular no hay barra lateral a la par */
}

/* Cabecera: pegada al menú */
.dnp--cabecera { margin: 14px auto 6px; }

/* Lateral: dentro de la barra lateral fija */
.dnp--lateral { margin: 0 auto; }

/* Barra fija abajo: solo en celular */
.dnp--barra-movil { display: none; }
@media (max-width: 767px) {
	.dnp--barra-movil { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; margin: 0; max-width: none; padding: 4px 36px 6px; background: rgba(255, 255, 255, .97); box-shadow: 0 -2px 10px rgba(0, 0, 0, .12); }
	.dnp--barra-movil .dnp__label { display: none; }
	.dnp--barra-movil .dnp__box { max-width: 320px; margin: 0 auto; }
	.dnp__close { position: absolute; top: 50%; right: 6px; transform: translateY(-50%); width: 26px; height: 26px; border: 0; border-radius: 50%; background: #e4e7ec; color: #04295a; font: 700 16px/26px system-ui, sans-serif; cursor: pointer; }
	body.has-dnp-bar { padding-bottom: 64px; }
}
@media print { .dnp { display: none !important; } }
