/* Sample page chrome ------------------------------------------------ */
.aes-bs-page { max-width: 1500px; margin: 0 auto; padding: 10px 20px 80px; }
.aes-bs-sample { margin: 0 0 70px; }
.aes-bs-tag { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin: 0 0 14px; }
.aes-bs-num {
	display: inline-flex; align-items: center; justify-content: center;
	width: 26px; height: 26px; border-radius: 50%; background: #1d1d1b; color: #fff;
	font-size: 13px; font-weight: 600;
}
.aes-bs-title { font-size: 17px; font-weight: 600; color: #1d1d1b; }
.aes-bs-blurb { font-size: 13px; color: #6b6b68; flex: 1 1 320px; }

/* The panel imitates the real mega menu drop -------------------------- */
.aes-bs-panel { background: #fff; border: 1px solid #e6e5e2; padding: 26px 30px 30px; }
.aes-bs-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 0 0 20px; }
.aes-bs-h { margin: 0; font-size: 14px; font-weight: 600; letter-spacing: .02em; color: #1d1d1b; }
.aes-bs-all {
	font-size: 11px; letter-spacing: .09em; text-transform: uppercase; color: #1d1d1b;
	border-bottom: 1px solid #1d1d1b; padding-bottom: 2px; white-space: nowrap;
}
.aes-bs-all:hover { color: #1d1d1b; opacity: .6; }
.aes-bs-eyebrow { margin: 0 0 12px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #9a9a96; }
.aes-bs-item img { display: block; width: 100%; object-fit: contain; object-position: center; }

/* 1. Airy rows -------------------------------------------------------- */
.aes-bs--1 .aes-bs-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.aes-bs--1 .aes-bs-item {
	display: flex; align-items: center; justify-content: center;
	padding: 26px 20px; border-bottom: 1px solid #f0efec;
	transition: opacity .18s ease;
}
.aes-bs--1 .aes-bs-item:nth-last-child(-n+6) { border-bottom: 0; }
.aes-bs--1 .aes-bs-item img { max-width: 150px; height: 40px; }
.aes-bs--1 .aes-bs-item:hover { opacity: .55; }

/* 2. Cards ------------------------------------------------------------ */
.aes-bs--2 { background: #faf9f7; }
.aes-bs--2 .aes-bs-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.aes-bs--2 .aes-bs-item {
	display: flex; align-items: center; justify-content: center;
	background: #fff; border: 1px solid #eae8e4; border-radius: 4px;
	padding: 22px 16px; min-height: 86px;
	transition: border-color .18s ease, box-shadow .18s ease;
}
.aes-bs--2 .aes-bs-item img { max-width: 132px; height: 34px; }
.aes-bs--2 .aes-bs-item:hover { border-color: #1d1d1b; box-shadow: 0 4px 14px rgba(0,0,0,.06); }

/* 3. Logo and name ---------------------------------------------------- */
.aes-bs--3 .aes-bs-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px 10px; }
.aes-bs--3 .aes-bs-item { display: block; text-align: center; padding: 20px 14px 18px; }
.aes-bs--3 .aes-bs-mark { display: block; }
.aes-bs--3 .aes-bs-mark img { display: block; width: 100%; max-width: 150px; height: 38px; object-fit: contain; margin: 0 auto; }
.aes-bs--3 .aes-bs-name {
	display: block; margin-top: 12px; font-size: 11px; letter-spacing: .1em;
	text-transform: uppercase; color: #9a9a96; transition: color .18s ease;
}
.aes-bs--3 .aes-bs-item:hover .aes-bs-name { color: #1d1d1b; }

/* 4. Stocked first ---------------------------------------------------- */
.aes-bs--4 .aes-bs-split { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 36px; }
.aes-bs--4 .aes-bs-split__side { border-left: 1px solid #eeece8; padding-left: 36px; }
.aes-bs--4 .aes-bs-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.aes-bs--4 .aes-bs-item {
	display: flex; align-items: center; justify-content: center;
	background: #faf9f7; padding: 26px 18px; min-height: 104px;
	transition: background .18s ease;
}
.aes-bs--4 .aes-bs-item img { max-width: 160px; height: 46px; mix-blend-mode: multiply; }
.aes-bs--4 .aes-bs-item:hover { background: #f2f0ec; }
.aes-bs--4 .aes-bs-list { columns: 2; column-gap: 26px; }
.aes-bs--4 .aes-bs-list a {
	display: block; font-size: 13px; line-height: 2.05; color: #4a4a47;
	break-inside: avoid; transition: color .18s ease;
}
.aes-bs--4 .aes-bs-list a:hover { color: #1d1d1b; }

/* 5. Trusted-by wall -------------------------------------------------- */
.aes-bs--5 .aes-bs-grid { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); }
.aes-bs--5 .aes-bs-item {
	display: flex; align-items: center; justify-content: center;
	padding: 18px 12px; transition: background .18s ease;
}
.aes-bs--5 .aes-bs-item img { max-width: 108px; height: 28px; }
.aes-bs--5 .aes-bs-item:nth-child(18n+10),
.aes-bs--5 .aes-bs-item:nth-child(18n+11),
.aes-bs--5 .aes-bs-item:nth-child(18n+12),
.aes-bs--5 .aes-bs-item:nth-child(18n+13),
.aes-bs--5 .aes-bs-item:nth-child(18n+14),
.aes-bs--5 .aes-bs-item:nth-child(18n+15),
.aes-bs--5 .aes-bs-item:nth-child(18n+16),
.aes-bs--5 .aes-bs-item:nth-child(18n+17),
.aes-bs--5 .aes-bs-item:nth-child(18n+18) { background: #faf9f7; }
.aes-bs--5 .aes-bs-item:hover { background: #efedea; }

/* Responsive ---------------------------------------------------------- */
@media (max-width: 1200px) {
	.aes-bs--1 .aes-bs-grid,
	.aes-bs--2 .aes-bs-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.aes-bs--1 .aes-bs-item:nth-last-child(-n+6) { border-bottom: 1px solid #f0efec; }
	.aes-bs--3 .aes-bs-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.aes-bs--5 .aes-bs-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
	.aes-bs--4 .aes-bs-split { grid-template-columns: minmax(0, 1fr); }
	.aes-bs--4 .aes-bs-split__side { border-left: 0; padding-left: 0; border-top: 1px solid #eeece8; padding-top: 24px; }
}
@media (max-width: 782px) {
	.aes-bs-panel { padding: 20px 16px 24px; }
	.aes-bs--1 .aes-bs-grid,
	.aes-bs--2 .aes-bs-grid,
	.aes-bs--3 .aes-bs-grid,
	.aes-bs--4 .aes-bs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.aes-bs--5 .aes-bs-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.aes-bs-head { flex-wrap: wrap; gap: 10px; }
}