/* All rules are scoped to this component. The theme remains in charge. */
.uol-contextual {
  font-family: inherit;
  font-size: inherit;
  line-height: 1.5;
  color: inherit;
  box-sizing: border-box;
  margin-block: 1.75em;
  padding: clamp(1rem, 2.4vw, 1.6rem);
  border: 1px solid currentColor;
  border-color: color-mix(in srgb, currentColor 16%, transparent);
  border-radius: 6px;
  background: transparent;
}
.uol-contextual *, .uol-contextual *::before, .uol-contextual *::after { box-sizing: border-box; }
.uol-contextual .uol-contextual__eyebrow { font: inherit; font-size: .72em; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 1.1em; opacity: .65; }
.uol-contextual .uol-contextual__heading { font: inherit; font-weight: 600; font-size: 1.05em; margin: 0 0 .6em; }
.uol-contextual .uol-contextual__group + .uol-contextual__group { margin-block-start: 1.25em; padding-block-start: 1.25em; border-top: 1px solid currentColor; border-color: color-mix(in srgb, currentColor 12%, transparent); }
.uol-contextual .uol-contextual__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); align-items: start; gap: .25em 1.5em; list-style: none; margin: 0; padding: 0; }
.uol-contextual .uol-contextual__list--nested { display: block; padding-inline-start: 1.7em; margin-block-end: .5em; }
.uol-contextual .uol-contextual__item { margin: 0; padding: 0; min-width: 0; list-style: none; }
.uol-contextual .uol-contextual__item::marker { content: ''; }
.uol-contextual .uol-contextual__link { display: flex; align-items: baseline; gap: .6em; font: inherit; color: inherit; text-decoration: none; padding-block: .4em; min-height: 2.75em; overflow-wrap: anywhere; }
.uol-contextual a.uol-contextual__link:hover { text-decoration: underline; text-underline-offset: .2em; }
.uol-contextual a.uol-contextual__link:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 2px; }
.uol-contextual .is-current > .uol-contextual__link { font-weight: 600; text-decoration: underline; text-underline-offset: .25em; }
.uol-contextual .uol-contextual__icon { width: 1em; height: 1em; flex: 0 0 1em; align-self: flex-start; margin-top: .22em; opacity: .65; }
.uol-contextual .uol-contextual__bullet { width: .55em; flex: 0 0 .55em; opacity: .45; }
@media (max-width: 600px) { .uol-contextual .uol-contextual__list { grid-template-columns: 1fr; } }
