/* ==========================================================
   BANNER DE FINANCIACIÓN DEL KIT DIGITAL

   Hoja del distintivo que el plugin imprime al cerrar el pie
   del sitio. Es editable desde «Kit Digital» en el panel y se
   puede restaurar en cualquier momento, así que aquí no hay
   nada que el plugin necesite para funcionar: solo el aspecto.

   El banner es un logotipo institucional y se publica como
   viene: **con su fondo blanco**. Aunque el pie sea oscuro y
   el rectángulo cante, no se recorta, no se recolorea, no se
   le baja la opacidad y no se le monta ningún marco. Es la
   versión que vale para justificar la ayuda.

   Es muy apaisado (1024 × 92), así que en pantallas estrechas
   se le deja ocupar todo el ancho antes que encogerlo hasta
   que no se lea.

   El ancho lo pone el panel como variable en el propio banner,
   así que se usa en lugar de escribir una medida fija:

     --h2e-kit-digital-max-width   ancho del logotipo

   El valor de respaldo del `var()` es lo que se ve si la hoja
   se usa fuera del banner, no lo que manda: el panel siempre
   la declara.

   Todo cuelga de `.h2e-kit-digital`, que es la raíz del
   componente, de modo que la hoja no puede afectar a nada más
   del sitio.
   ========================================================== */

.h2e-kit-digital {
    /* Medidas propias del componente, agrupadas para que
       ajustar el hueco sea tocar estas dos líneas. */
    --h2e-kit-digital-spacing: 32px;
    --h2e-kit-digital-radius: 8px;

    display: flex;
    justify-content: center;
    padding-block: var(--h2e-kit-digital-spacing);
    padding-inline: 20px;
}

.h2e-kit-digital__logo {
    border-radius: var(--h2e-kit-digital-radius);
    display: block;
    height: auto;
    width: min(100%, var(--h2e-kit-digital-max-width));
}

@media (max-width: 767px) {
    .h2e-kit-digital {
        --h2e-kit-digital-spacing: 24px;

        padding-inline: 16px;
    }
}
