.brand-overview{--line-color: var(--secondary-200);padding-block:var(--spacing-8)}@media(max-width:55rem){.brand-overview{padding-block:var(--spacing-6)}}.brand-overview [class*=container]{display:flex;flex-direction:column;gap:var(--spacing-6)}.brand-overview__heading{display:flex;align-items:center;gap:var(--spacing-6);justify-content:space-between}@media(max-width:55rem){.brand-overview__heading{flex-direction:column;align-items:flex-start;gap:var(--spacing-5)}}.brand-overview__heading [class*=button]{flex-shrink:0}.brand-overview__heading .dropdown{position:relative}.brand-overview__heading .dropdown select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:var(--spacing-4);border-color:var(--neutral-black);padding-right:var(--spacing-6);background-color:var(--neutral-white);display:inline-block;position:relative;background-image:url(../../../svg/caret-down.svg);background-repeat:no-repeat;background-position:right var(--spacing-4) center;background-size:1rem;background-color:var(--form-input-background, var(--neutral-white))}.brand-overview__heading .dropdown ul:not([class]) li:before{content:none}.brand-overview .brands{display:grid;gap:var(--spacing-3);align-items:flex-start;grid-template-columns:repeat(var(--columns),minmax(0,1fr))}@media(max-width:55rem){.brand-overview .brands{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:30rem){.brand-overview .brands{grid-template-columns:repeat(1,minmax(0,1fr))}}.brand-overview .brands .brand{display:flex;flex-direction:column;align-items:flex-start;position:relative;height:100%;padding-block:var(--spacing-5);padding-inline:var(--spacing-5);border:1px solid var(--line-color);gap:var(--spacing-4);transition:border var(--animation-speed-slow) var(--cubic-bezier),translate var(--animation-speed-slow) var(--cubic-bezier);translate:0 0}@media(hover:hover){.brand-overview .brands .brand:hover,.brand-overview .brands .brand:focus-visible{border-color:var(--primary-300);translate:0 calc(var(--spacing-1) * -1)}.brand-overview .brands .brand:hover svg,.brand-overview .brands .brand:focus-visible svg{translate:var(--spacing-2) 0}}.brand-overview .brands .brand p{color:var(--neutral-black)}@media(max-width:30rem){.brand-overview .brands .brand{padding-block:var(--spacing-6);padding-inline:var(--spacing-6)}}.brand-overview .brands .brand img{-o-object-fit:contain;object-fit:contain;-o-object-position:left;object-position:left;max-width:170px;height:50px;transition:scale .3s ease,width .3s ease}.brand-overview .brands .brand svg{position:absolute;bottom:var(--spacing-4);right:var(--spacing-4);color:var(--primary-300);translate:0 0;transition:translate var(--animation-speed-slow) var(--cubic-bezier)}.brand-overview .brands .brand svg line{stroke-width:2px}