.home-category-tabs {
  position: relative;
  z-index: 1;
  background: var(--color-white);
}

.home-category-tabs__list {
  display: flex;
  align-items: end;
  gap: 6px;
  padding: 20px 0 0;
}

.home-category-tabs__tab {
  position: relative;
  min-width: min(44vw, 180px);
  min-height: 50px;
  padding: 10px 24px;
  border: 1px solid transparent;
  border-bottom: 0;
  border-radius: 14px 14px 0 0;
  background: #f6f6f6;
  color: var(--color-muted);
  font: 500 1.1rem/1.2 "Kanit", "Open Sans", sans-serif;
  cursor: pointer;
}

.home-category-tabs__tab:focus-visible {
  outline: 3px solid #1b6ca8;
  outline-offset: 3px;
}

.home-category-tabs__tab--programs {
  border-color: #eab4c9;
  background: #f9dbdb;
  color: #9f3f68;
}
.home-category-tabs__tab--courses {
  border-color: #a4a4a4;
  background: #e0e0e0;
  color: #4a4a4a;
} 

.home-category-tabs__tab--programs[aria-selected="true"] {
  z-index: 2;
  margin-bottom: -1px;
  background: #f9dbdb;
  color: #9f3f68;
}

.home-category-tabs__tab--courses[aria-selected="true"] {
  z-index: 2;
  margin-bottom: -1px;
  background: #e0e0e0;
  color: #4a4a4a;
}

.home-category-panel[hidden] { display: none; }
.home-category-panel--courses { background: #eeeeee; }

.home-category-panel--courses .section-panel--pink {
  border-color: #8a8a8a;
  background: #ececec;
}

.home-category-panel--courses .section-panel--gray {
  border-color: #6b6b6b;
  background: #e0e0e0;
}

.home-category-panel--courses h2,
.home-category-panel--courses .subheading { color: #4a4a4a; }

.home-category-panel--courses .button {
  border-color: #6b6b6b;
  background: linear-gradient(#777777, #5a5a5a);
}

.home-category-panel--courses .button--ghost {
  background: transparent;
  color: #4a4a4a;
}

@media (max-width: 760px) {
  .home-category-tabs__list {
    gap: 4px;
    padding-top: 14px;
  }

  .home-category-tabs__tab {
    min-width: 0;
    flex: 1;
    min-height: 48px;
    padding-inline: 12px;
  }
}