/* Logos de colaboradores (elemento «Logos TANTAK»): mismo alto por categoría, el logo se ajusta dentro sin deformarse. */
.tk-logos{--alto:72px;--alto-movil:56px;--hueco:40px;text-align:center;padding-bottom:56px}
/* --alto es el lado de un cuadrado con el área de tinta del logo; cada categoría, menor que la anterior. Referencia: tinta visible en producción a 1440 / 390. */
.tk-logos--principal{--alto:170px;--alto-movil:96px;--hueco:56px}
.tk-logos--mar{--alto:115px;--alto-movil:66px;--hueco:48px}
.tk-logos--gota{--alto:85px;--alto-movil:54px;--hueco:44px}
.tk-logos--agua{--alto:58px;--alto-movil:44px}
.tk-logos--otros{--alto:56px;--alto-movil:44px;--hueco:32px}
.tk-logos .tk-logos__titulo{margin:0 0 24px}
.tk-logos .tk-logos__lista{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:calc(var(--hueco) * .6) var(--hueco)}
.tk-logos .tk-logos__lista li{margin:0;padding:0;list-style:none}
.tk-logos .tk-logos__lista a{display:block}
.tk-logos .tk-logos__lista .tk-logo{display:block;position:relative;overflow:hidden;width:calc(var(--alto) * var(--w));height:calc(var(--alto) * var(--h))}
/* La caja es la tinta: la imagen se amplía y se desplaza para dejar fuera su margen. */
.tk-logos .tk-logos__lista li .tk-logo img{position:absolute;display:block;width:calc(100% * var(--iw));max-width:none;height:auto;left:calc(-100% * var(--ix));top:calc(-100% * var(--iy));margin:0}
@media (max-width:690px){.tk-logos{padding-bottom:40px}.tk-logos .tk-logos__lista .tk-logo{width:calc(var(--alto-movil) * var(--w));height:calc(var(--alto-movil) * var(--h))}}