.brand-index{--brand-index-columns: 5;--brand-index-mobile-columns: 1;--brand-index-column-gap: 32px;--brand-index-row-gap: 16px;--brand-index-search-max-width: 100%;--brand-index-search-height: 52px;--brand-index-search-radius: 0px;--brand-index-search-background: rgb(var(--color-foreground-rgb) / var(--opacity-5));--brand-index-letter-size: 16px;--brand-index-letter-gap: 18px;--brand-index-letter-color: rgb(var(--color-foreground-rgb) / var(--opacity-50));--brand-index-letter-active-color: var(--color-foreground);--brand-index-heading-size: 24px;--brand-index-link-size: 15px;--brand-index-link-color: var(--color-foreground);--brand-index-link-hover-color: var(--color-foreground);--brand-index-link-transform: none;--brand-index-list-max-height: none;--brand-index-group-row-gap: 56px;--brand-index-group-letter-gap: 20px;display:flex;flex-direction:column;width:100%}.brand-index__search{position:relative;width:min(100%,var(--brand-index-search-max-width));margin-bottom:2.4rem}.brand-index__search-input{-webkit-appearance:none;appearance:none;width:100%;height:var(--brand-index-search-height);padding:0 5.2rem 0 1.8rem;border:1px solid transparent;border-radius:var(--brand-index-search-radius);background:var(--brand-index-search-background);color:var(--color-foreground);font-size:var(--brand-index-link-size);font-family:inherit}.brand-index__search-input::placeholder{color:rgb(var(--color-foreground-rgb) / var(--opacity-50))}.brand-index__search-input:focus,.brand-index__search-input:focus-visible{outline:none;border-color:var(--color-foreground)}.brand-index__search-input::-webkit-search-cancel-button{cursor:pointer}.brand-index__search-icon{position:absolute;top:50%;right:1.8rem;transform:translateY(-50%);display:inline-flex;pointer-events:none;color:var(--color-foreground)}.brand-index__search-icon svg{width:2rem;height:2rem}.brand-index__letters{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem var(--brand-index-letter-gap);margin-bottom:2.4rem}.brand-index__letter{-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;font-family:inherit;font-size:var(--brand-index-letter-size);line-height:1.2;color:var(--brand-index-letter-color);cursor:pointer;transition:color var(--animation-speed, .15s) var(--animation-easing, ease)}.brand-index__letter:hover{color:var(--brand-index-letter-active-color)}.brand-index__letter.is-active{color:var(--brand-index-letter-active-color);font-weight:700}.brand-index__letter--empty{cursor:default;opacity:.35}.brand-index__letter:focus-visible{outline:var(--focus-outline-width, 2px) solid currentcolor;outline-offset:2px}.brand-index__heading{margin:0 0 1.6rem;font-size:var(--brand-index-heading-size);line-height:1.2;color:var(--color-foreground)}.brand-index__list-scroll{max-height:var(--brand-index-list-max-height);overflow-y:auto}.brand-index__list{display:grid;grid-template-columns:repeat(var(--brand-index-mobile-columns),minmax(0,1fr));column-gap:var(--brand-index-column-gap);row-gap:var(--brand-index-row-gap);margin:0;padding:0;list-style:none}@media screen and (min-width:750px){.brand-index__list{grid-template-columns:repeat(var(--brand-index-columns),minmax(0,1fr))}}.brand-index__item[hidden]{display:none}.brand-index--flow-column .brand-index__list{display:block;columns:var(--brand-index-mobile-columns);column-gap:var(--brand-index-column-gap);margin-bottom:calc(-1 * var(--brand-index-item-gap, var(--brand-index-row-gap)))}@media screen and (min-width:750px){.brand-index--flow-column .brand-index__list{columns:var(--brand-index-columns)}}.brand-index--flow-column .brand-index__item{break-inside:avoid;padding-bottom:var(--brand-index-item-gap, var(--brand-index-row-gap))}.brand-index__groups{display:grid;grid-template-columns:repeat(var(--brand-index-mobile-columns),minmax(0,1fr));column-gap:var(--brand-index-column-gap);row-gap:var(--brand-index-group-row-gap);align-items:start}@media screen and (min-width:750px){.brand-index__groups{grid-template-columns:repeat(var(--brand-index-columns),minmax(0,1fr))}}.brand-index--flow-column .brand-index__groups{display:block;columns:var(--brand-index-mobile-columns);column-gap:var(--brand-index-column-gap);margin-bottom:calc(-1 * var(--brand-index-group-row-gap))}@media screen and (min-width:750px){.brand-index--flow-column .brand-index__groups{columns:var(--brand-index-columns)}}.brand-index--flow-column .brand-index__group{break-inside:avoid;padding-bottom:var(--brand-index-group-row-gap)}.brand-index__group-letter{margin:0 0 var(--brand-index-group-letter-gap);font-size:var(--brand-index-heading-size);line-height:1.2;color:var(--color-foreground)}.brand-index__group-list{display:flex;flex-direction:column;gap:var(--brand-index-row-gap);margin:0;padding:0;list-style:none}.brand-index__link{display:inline-block;font-size:var(--brand-index-link-size);line-height:1.4;color:var(--brand-index-link-color);text-transform:var(--brand-index-link-transform);text-decoration:none;transition:color var(--animation-speed, .15s) var(--animation-easing, ease)}.brand-index__link:hover{color:var(--brand-index-link-hover-color);text-decoration:underline}.brand-index__empty{margin:1.6rem 0 0;color:rgb(var(--color-foreground-rgb) / var(--opacity-50))}.brand-index__empty[hidden]{display:none}.brand-index--drawer{--brand-index-columns: 2;--brand-index-list-max-height: none}.brand-index--drawer .brand-index__search,.brand-index--drawer .brand-index__letters{margin-bottom:1.6rem}.brand-index--drawer .brand-index__list{--brand-index-item-gap: var(--brand-index-row-gap-mobile, var(--brand-index-row-gap));row-gap:var(--brand-index-row-gap-mobile, var(--brand-index-row-gap))}.brand-index--drawer .brand-index__group-list{gap:var(--brand-index-row-gap-mobile, var(--brand-index-row-gap))}.brand-index--drawer .brand-index__link,.brand-index--drawer .brand-index__search-input{font-size:var(--brand-index-link-size-mobile, var(--brand-index-link-size))}.brand-index--drawer .brand-index__letter{font-size:var(--brand-index-letter-size-mobile, var(--brand-index-letter-size))}.brand-index--drawer .brand-index__heading,.brand-index--drawer .brand-index__group-letter{font-size:var(--brand-index-heading-size-mobile, var(--brand-index-heading-size))}
/*# sourceMappingURL=/cdn/shop/t/4/assets/brand-index.css.map */
