.education-header { min-width: 0; }
.education-categories { min-width: 0; margin-block: 1rem 1.25rem; }
.education-categories__list {
  display: flex;
  flex-wrap: nowrap;
  gap: .5rem;
  margin: 0;
  padding: 5px 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  list-style: none;
}
.education-categories__list::-webkit-scrollbar { display: none; }
.education-categories__item { display: flex; flex: 0 0 auto; min-width: 0; max-width: 100%; scroll-snap-align: start; }
.education-categories__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  min-height: 44px;
  max-width: 100%;
  padding: .5rem .875rem;
  border: 2px solid transparent;
  border-radius: 999px;
  background: var(--education-category-color, #e0edf8);
  color: #181818;
  font-size: .8125rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
}
.education-categories__pill--color-0 { --education-category-color: #e0edf8; }
.education-categories__pill--color-1 { --education-category-color: #e8e0f5; }
.education-categories__pill--color-2 { --education-category-color: #dcefdc; }
.education-categories__pill--color-3 { --education-category-color: #fae4ce; }
.education-categories__pill--color-4 { --education-category-color: #f6dfe6; }
.education-categories__pill--color-5 { --education-category-color: #f5edc8; }
.education-categories__pill:hover { border-color: #000000b3; color: #000000; text-decoration: none; }
.education-categories__pill.is-active { border-color: currentColor; }
.education-categories__pill:focus-visible { outline: 2px solid #263441; outline-offset: 3px; }
.education-categories__check { display: none; flex: 0 0 .8rem; font-size: .9rem; }
.education-categories__pill.is-active .education-categories__check { display: inline-block; }
.education-categories__name { min-width: 0;}
.education-slider { position: relative; width: 100vw; min-width: 0; margin-block: 1rem 1.5rem; margin-inline: calc(50% - 50vw); }
.education-slider__viewport {
  display: flex;
  align-items: flex-start;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  border-radius: 0;
}
.education-slider__viewport::-webkit-scrollbar { display: none; }
.education-slider__slide { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; scroll-snap-stop: always; }
.education-slider__media { position: relative; }
.education-slider__image-link { display: block; }
.education-slider__image { display: block; width: 100%; height: auto; }
.education-slider__controls:not([hidden]) {
  position: absolute;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: space-between;
  padding-inline: .75rem;
  pointer-events: none;
}
.education-slider__arrow {
  pointer-events: auto;
  flex: 0 0 44px;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid #e4e2df;
  border-radius: 5px 16px;
  background: #fff;
  color: #1b1b1b;
  font-size: 1.35rem;
  cursor: pointer;
}
.education-slider__pointer span {
    bottom: 2px;
    position: relative;
}
.education-slider__arrow:disabled { opacity: .35; cursor: default; }
.education-slider__pointer {
    position: absolute;
    display: grid;
    place-items: center;
    width: 35px;
    height: 35px;
    transform: translate(-50%, -50%);
    /* border: 1px solid rgb(255 255 255 / 53%); */
    border-radius: 50%;
    backdrop-filter: blur(2px);
    color: #ffffff;
    text-shadow: 1px 1px 5px black;
    background: rgb(255 255 255 / 26%);
    box-shadow: 0 2px 12px rgba(0, 0, 0, .15);
    font-size: 1.5rem;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}
.education-slider__pointer:hover,
.education-slider__pointer[aria-expanded='true'] { color: #fff; background: var(--webglobe-accent, #9d6547); }
.education-slider__viewport:focus-visible,
.education-slider__pointer:focus-visible,
.education-slider__arrow:focus-visible,
.education-product__close:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.education-product {
    position: fixed;
    z-index: 1030;
    width: min(320px, calc(100vw - 24px));
    max-height: calc(100dvh - 24px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 2rem 1rem 1rem;
    border: 1px solid #e4e2df;
    border-radius: 6px 20px;
    background: #ffffffa6;
    backdrop-filter: blur(6px);
    color: #1b1b1b;
    box-shadow: 5px 5px 0px rgb(0 0 0 / 20%);
}
.education-product__close { position: absolute; top: 0; right: 0; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: inherit; font-size: 1.6rem; cursor: pointer; }
.education-product__link { display: flex; align-items: center; gap: .75rem; color: inherit; text-decoration: none; }
.education-product__image { flex: 0 0 88px; width: 88px; height: 88px; object-fit: contain; }
.education-product__details { display: grid; gap: .5rem; min-width: 0; font-size: .875rem; overflow-wrap: anywhere; }
.education-product__details strong { font-weight: 600; line-height: 1.4; }
.education-product__price { font-weight: 600; }
.education-product__actions { display: grid; gap: .5rem; margin-top: 1rem; }
.education-product__actions .btn { white-space: normal; }
.education-product__error { margin: .75rem 0 0; color: #a82020; font-size: .875rem; }

@media (min-width: 768px) {
  .education-categories { margin-block: 1.25rem 1.5rem; }
  .education-categories__list { flex-wrap: wrap; gap: .625rem; padding: 0; overflow: visible; scroll-snap-type: none; }
  .education-categories__item { flex: 0 1 auto; }
  .education-categories__pill { padding-inline: 1rem; font-size: .875rem; }
  .education-slider { width: auto; margin-block: 1.25rem 2rem; margin-inline: 0; }
  .education-slider__viewport { border-radius: 8px 32px; }
  .education-slider__controls:not([hidden]) { display: flex; }
}

@media (hover: hover) and (pointer: fine) {
  .education-slider__controls { opacity: 0; visibility: hidden; }
  .education-slider:hover .education-slider__controls,
  .education-slider:focus-within .education-slider__controls { opacity: 1; visibility: visible; }
}