.ask-clients-grid {
width: 100%;
box-sizing: border-box;
--ask-columns: 6;
--ask-tablet: 3;
--ask-mobile: 2;
--ask-logo-height: 100px;
--ask-gap: 20px;
--ask-filter-bg: #FFC428;
--ask-filter-text: #ffffff;
--ask-active-bg: #000000;
--ask-active-text: #ffffff;
--ask-card-bg: #ffffff;
--ask-card-border: #dddddd;
}
.ask-client-filter {
border: 1px solid #FFC428 !important;
box-shadow: none !important;
background: transparent !important;
margin: 0 5px 10px;
}
.ask-client-filter.is-active {
background: #FFC428 !important;
color: #241705 !important;
}
.ask-clients-grid,
.ask-clients-grid * { box-sizing: border-box; }
.ask-clients-filters {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 4px;
width: 100%;
padding: 20px;
margin: 0 0 12px;
}
.ask-client-filter-buttons {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 4px;
width: 100%;
}
.ask-client-filter-select-wrap {
display: none;
width: 100%;
}
.ask-client-filter-select {
width: 100%;
min-height: 44px;
padding: 9px 14px;
border: 1px solid rgba(255,255,255,.95);
border-radius: 6px;
background: var(--ask-filter-bg);
color: var(--ask-filter-text);
font: inherit;
font-size: 14px;
line-height: 1.2;
cursor: pointer;
}
.ask-client-filter-select:focus {
outline: 2px solid var(--ask-active-bg);
outline-offset: 2px;
}
.ask-client-filter {
appearance: none;
-webkit-appearance: none;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
min-height: 44px;
padding: 9px 28px;
border: 1px solid rgba(255,255,255,.95);
border-radius: 0;
outline: none;
background: transparent;
color: var(--ask-filter-text);
font: inherit;
font-size: 14px;
line-height: 1.2;
white-space: nowrap;
cursor: pointer;
transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.ask-client-filter:hover,
.ask-client-filter:focus-visible,
.ask-client-filter.is-active,
.ask-client-filter[aria-selected="true"] {
background: var(--ask-active-bg);
color: var(--ask-active-text);
border-color: var(--ask-active-bg);
} .ask-clients-items {
display: flex;
flex-wrap: wrap;
align-items: stretch;
justify-content: center;
gap: var(--ask-gap);
width: 100%;
}
.ask-client-item {
flex: 0 0 calc((100% - (var(--ask-gap) * (var(--ask-columns) - 1))) / var(--ask-columns));
min-width: 0;
max-width: calc((100% - (var(--ask-gap) * (var(--ask-columns) - 1))) / var(--ask-columns));
}
.ask-client-card {
width: 100%;  display: flex;
align-items: center;
justify-content: center;
padding: 10px 18px;
background: var(--ask-card-bg);
border: 1px solid var(--ask-card-border);
border-radius: 7px;
overflow: hidden;
text-decoration: none;
}
.ask-client-logo {
display: block;
width: auto;
height: auto;
max-width: 90%;
max-height: 76%;
object-fit: contain;
}
.ask-client-name {
display: block;
max-width: 95%;
text-align: center;
font-weight: 600;
line-height: 1.3;
}
.ask-client-item.is-hidden { display: none !important; }
.ask-clients-empty {
flex: 1 1 100%;
padding: 30px;
text-align: center;
border: 1px solid var(--ask-card-border);
}
@media (max-width: 1024px) {
.ask-client-item {
flex-basis: calc((100% - (var(--ask-gap) * (var(--ask-tablet) - 1))) / var(--ask-tablet));
max-width: calc((100% - (var(--ask-gap) * (var(--ask-tablet) - 1))) / var(--ask-tablet));
}
}
@media (max-width: 767px) {
.ask-clients-filters { padding: 12px 10px; }
.ask-client-filter-buttons { display: none; }
.ask-client-filter-select-wrap { display: block; }
.ask-client-item {
flex-basis: calc((100% - (var(--ask-gap) * (var(--ask-mobile) - 1))) / var(--ask-mobile));
max-width: calc((100% - (var(--ask-gap) * (var(--ask-mobile) - 1))) / var(--ask-mobile));
}
.ask-client-card { padding: 8px; }
.ask-client-logo { max-width: 90%; max-height: 72%; }
}
@media (max-width: 380px) {
.ask-client-filter-select { min-height: 40px; font-size: 13px; }
}