/* Carrusel grande (horizontal) */
    .mySwiperGrande { display:block; width:100%; }

    /* Columna derecha: caja de título + marco rígido */
    .avisos-box{ width:100%; max-width:360px; margin-left:auto; }
    .avisos-title{ text-align:center; margin-bottom:12px; }

    /* Marco con altura FIJA y recorte: evita desbordes y “pantallas blancas” */
    .avisos-frame{
      position: relative;
      width: 100%;
      height: 360px;        /* ← ajusta a tu gusto (320–400px) */
      overflow: hidden;
      border-radius: 12px;  /* opcional */
      background: #fff;     /* evita parpadeos */
    }

    /* El web component rellena exactamente el marco */
    .mySwiperAvisos{
      position: absolute; inset: 0;   /* top/right/bottom/left: 0 */
      display: block; width: 100%; height: 100%;
    }

    /* Cada slide ocupa todo el marco, centrado */
    .mySwiperAvisos swiper-slide{
      height: 100%;
      display: flex; align-items: center; justify-content: center;
      overflow: hidden;
    }

    /* Imagen SIN deformar (usa contain). Cambia a cover si prefieres llenar recortando */
    .mySwiperAvisos swiper-slide img{
      max-width: 100%; max-height: 100%;
      width: auto; height: auto;
      object-fit: contain; display: block;
    }