@layer components{.c-glossary-index{--glossary-letter-color:var(--brand-black);--glossary-letter-color-active:#fff;--glossary-letter-bg:transparent;--glossary-letter-bg-active:var(--brand-blue);--glossary-letter-size:46px;align-items:center;-moz-column-gap:clamp(.81rem,.66rem + .75vw,1.25rem);column-gap:clamp(.81rem,.66rem + .75vw,1.25rem);display:flex;margin:0;max-width:calc(100% - var(--grid-browser-gutter) - 17rem - (100% - var(--grid-browser-gutter))/12*1.25);overflow-x:auto;overflow-y:clip;padding:.63rem calc(var(--glossary-letter-size)/2);position:relative;z-index:1}.c-glossary-index__item{margin:0}.c-glossary-index__letter{align-items:center;color:var(--glossary-letter-color);display:inline-flex;font-size:clamp(1rem,.84rem + .79vw,1.44rem);font-weight:var(--font-weight-bold);height:var(--glossary-letter-size);justify-content:center;line-height:1.3;position:relative;text-decoration:none;transition:color .25s ease-in-out}.c-glossary-index__letter--disabled{cursor:not-allowed;opacity:.5}.c-glossary-index__letter--active{cursor:pointer;opacity:1}.c-glossary-index__letter--active:before{background:var(--glossary-letter-bg,var(--brand-blue));border-radius:50%;content:"";display:block;height:100%;inset:50% 0 0 50%;position:absolute;transform:translate(-50%,-50%);transition:background .25s ease-in-out;width:var(--glossary-letter-size);z-index:-1}.c-glossary-index__letter--active:focus,.c-glossary-index__letter--active:hover,.is-active.c-glossary-index__letter{--glossary-letter-bg:var(--brand-blue);--glossary-letter-color:#fff;text-decoration:none}@media (max-width:800px){.c-glossary-index{--glossary-letter-size:30px;max-width:100%;width:100%}}}