body {
     background: #f5f5f5;
 }

 /* Barra superior tipo celular */
 .mobile-header {
     height: 60px;
     background: #0d6efd;
     color: white;
     display: flex;
     align-items: center;
     justify-content: center;
     /* centra contenido */
 }


 .menu-btn {
     font-size: 24px;
     cursor: pointer;
 }

 /* Menú lateral derecho */
 .offcanvas-end {
     width: 250px;
 }

 .menu-item {
     padding: 12px 15px;
     border-bottom: 1px solid #eee;
     cursor: pointer;
 }

 .menu-item:hover {
     background: #f1f1f1;
 }

 .bottom-menu {
     position: fixed;
     bottom: 0;
     left: 0;
     width: 100%;
     height: 60px;
     background: white;
     border-top: 1px solid #ddd;
     display: flex;
     justify-content: space-around;
     align-items: center;
     z-index: 1000;
 }

 .bottom-menu a {
     text-decoration: none;
     color: #555;
     font-size: 14px;
     text-align: center;
 }

 .bottom-menu a:hover {
     color: #0d6efd;
 }

 .titulo-centrado {
     position: absolute;
     left: 50%;
     transform: translateX(-50%);
 }

 .div_titulo {
     text-align: center;
 }

 .div_logo {
     text-align: center;
 }

 .logo_opcion {
     width: 50px;
 }