.marcas-az{
	--marcas-border:#e6e6e6;
	--marcas-radius:8px;
	--marcas-accent:#000;
	--marcas-accent-text:#fff;
	--marcas-bg-title:#f3f3f3;
	--marcas-letra-size:38px;
	--marcas-gap:14px;
	width:100%;
	font-family:inherit;
}
.marcas-az *{box-sizing:border-box}

/* Barra de letras */
.marcas-az__letras{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;padding:0 0 22px;margin-bottom:22px;border-bottom:1px solid var(--marcas-border);scrollbar-width:none}
.marcas-az__letras::-webkit-scrollbar{display:none}
.marcas-az__letra{flex:0 0 auto;min-width:var(--marcas-letra-size);height:var(--marcas-letra-size);padding:0 10px;border:1px solid var(--marcas-border);border-radius:6px;background:#fff;color:#111;font-size:14px;line-height:1;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.marcas-az__letra:hover:not(:disabled){border-color:var(--marcas-accent)}
.marcas-az__letra.is-active{background:var(--marcas-accent);border-color:var(--marcas-accent);color:var(--marcas-accent-text)}
.marcas-az__letra:disabled{opacity:.35;cursor:default;background:#fff;color:#111}

/* Grupos */
.marcas-az__grupo{margin-bottom:22px}
.marcas-az__grupo[hidden]{display:none}
.marcas-az__titulo{margin:0 0 var(--marcas-gap);padding:7px 14px;background:var(--marcas-bg-title);border-radius:6px;font-size:14px;line-height:1.6;font-weight:400;color:#777}

/* Grid de tarjetas */
.marcas-az__grid{display:grid;grid-template-columns:repeat(var(--marcas-cols,4),minmax(0,1fr));gap:var(--marcas-gap)}
.marcas-az__marca{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;aspect-ratio:3.5/1;min-height:72px;padding:22px 16px 10px;border:1px solid var(--marcas-border);border-radius:var(--marcas-radius);background:#fff;color:#111;text-decoration:none;overflow:hidden;transition:box-shadow .2s,transform .2s}
.marcas-az__marca:hover{box-shadow:0 4px 14px rgba(0,0,0,.08);transform:translateY(-1px)}
.marcas-az__logo{display:flex;align-items:center;justify-content:center;max-width:100%}
.marcas-az__logo img{display:block;max-width:100%;max-height:40px;width:auto;height:auto;object-fit:contain}
.marcas-az__nombre{font-size:12px;text-align:center}
.marcas-az__nombre--solo{font-size:17px;font-weight:600;letter-spacing:.03em}

/* Tarjetas con etiqueta: fondo y borde tintados */
.marcas-az__marca--popular{background:linear-gradient(135deg,#fff 30%,#fdeeee 100%);border-color:#f6d3d3}
.marcas-az__marca--new{background:linear-gradient(135deg,#fff 30%,#eef0ff 100%);border-color:#d9deff}
.marcas-az__marca--premium{background:linear-gradient(135deg,#fff 30%,#f5ecfd 100%);border-color:#e6d5f7}

/* Insignias */
.marcas-az__badge{position:absolute;top:7px;left:8px;padding:2px 8px;border-radius:5px;font-size:10px;line-height:1.5;font-weight:500;background:#eea4a4;color:#fff}
.marcas-az__badge--new{background:#7d8cf2}
.marcas-az__badge--premium{background:#c08fe9}

@media (max-width:1024px){.marcas-az__grid{grid-template-columns:repeat(min(var(--marcas-cols,4),3),minmax(0,1fr))}}
@media (max-width:768px){
	.marcas-az{--marcas-letra-size:34px;--marcas-gap:10px}
	.marcas-az__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.marcas-az__marca{aspect-ratio:auto;min-height:84px;padding:24px 10px 12px}
}