.cbl-brands {
--cbl-ink:#1d1d1f;
	--cbl-muted:#6b6b70;
	--cbl-line:#e4e2dd;
	--cbl-bg:#faf9f6;
	--cbl-red:#b3261e;
	
  max-width:1280px;
	margin:0 auto;
	padding:24px 16px 48px;
	color:var(--cbl-ink);
	font-family:inherit;
}

.cbl-brands * {
	box-sizing:border-box;
}

.cbl-filters {
	display:grid;
	grid-template-columns:2fr repeat(3,1fr) 110px auto auto;
	gap:10px;
	align-items:end;
	margin-bottom:20px;

}

.cbl-filters label {
	display:flex;
	flex-direction:column;
	gap:4px;
	font-size:12px;
	color:var(--cbl-muted);
	
  text-transform:uppercase;
	letter-spacing:.04em;
}

.cbl-filters input[type=search],.cbl-filters select {
	font:inherit;
	font-size:15px;
	color:var(--cbl-ink);
	padding:9px 10px;
	
  border:1px solid var(--cbl-line);
	border-radius:6px;
	background:#fff;
	width:100%;
	min-width:0;
}

.cbl-filters .cbl-check {
	flex-direction:row;
	align-items:center;
	gap:8px;
	padding-bottom:10px;
	text-transform:none;
	
  letter-spacing:0;
	font-size:14px;
	color:var(--cbl-ink);
	white-space:nowrap;
}

.cbl-filters button {
	font:inherit;
	font-size:15px;
	padding:10px 18px;
	border:0;
	border-radius:6px;
	background:var(--cbl-ink);
	
  color:#fff;
	cursor:pointer;
}

.cbl-bar {
	display:flex;
	justify-content:space-between;
	gap:12px;
	margin-bottom:16px;
	font-size:14px;
	color:var(--cbl-muted);
}

.cbl-bar a {
	color:var(--cbl-red);
}

.cbl-grid {
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
	gap:28px 20px;
	list-style:none;
	margin:0;
	padding:0;
}

.cbl-card a {
	display:block;
	color:inherit;
	text-decoration:none;
}

.cbl-photo {
	aspect-ratio:4/3;
	border-radius:6px;
	overflow:hidden;
	background:var(--cbl-bg);
}

.cbl-photo img {
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:transform .3s;
}

.cbl-card a:hover .cbl-photo img {
	transform:scale(1.03);
}

.cbl-mono {
	display:flex;
	height:100%;
	align-items:center;
	justify-content:center;
	font-size:44px;
	font-weight:700;
	
  color:#c9c5bc;
	letter-spacing:.02em;
}

.cbl-name {
	margin:12px 0 2px;
	font-size:17px;
	font-weight:600;
	line-height:1.3;
}

.cbl-sub {
	margin:0;
	font-size:14px;
	color:var(--cbl-muted);
}

.cbl-foot {
	display:flex;
	flex-wrap:wrap;
	gap:6px;
	margin-top:8px;
}

.cbl-pill {
	padding:2px 9px;
	border-radius:999px;
	font-size:12px;
	border:1px solid var(--cbl-line);
	color:var(--cbl-muted);
}

.cbl-pill.cbl-made {
	border-color:transparent;
	background:#fbeceb;
	color:var(--cbl-red);
	font-weight:600;
}

.cbl-pill.cbl-items {
	border-color:transparent;
	background:var(--cbl-ink);
	color:#fff;
}

.cbl-empty,.cbl-error {
	padding:48px 0;
	text-align:center;
	color:var(--cbl-muted);
}

/* Card sizes (Large is the default) */
.cbl-grid.cbl-size-s{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:22px 14px}
.cbl-grid.cbl-size-l{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:36px 24px}
.cbl-size-s .cbl-name{font-size:15px}
.cbl-size-s .cbl-sub{font-size:13px}
.cbl-size-l .cbl-name{font-size:19px}

/* Filter bar on mid-size screens */
@media (max-width:1100px){
  .cbl-filters{grid-template-columns:repeat(3,1fr)}
  .cbl-filters .cbl-search{grid-column:1/-1}
}

@media (max-width:900px) {
.cbl-filters {
	grid-template-columns:1fr 1fr;
}
.cbl-filters .cbl-search,
  .cbl-filters button {
	grid-column:1/-1;
}
.cbl-filters .cbl-check {
	padding-bottom:0;
}
}
@media (max-width:520px){
  .cbl-grid,.cbl-grid.cbl-size-m{grid-template-columns:1fr 1fr;gap:20px 12px}
  .cbl-grid.cbl-size-s{grid-template-columns:repeat(3,1fr);gap:16px 8px}
  .cbl-grid.cbl-size-l{grid-template-columns:1fr;gap:28px}
  .cbl-name{font-size:15px}
  .cbl-size-s .cbl-name{font-size:13px}
  .cbl-size-s .cbl-sub,.cbl-size-s .cbl-foot{display:none}
}