:root {
  --brand-orange: var(--so-brand-orange);
  --brand-orange-hover: var(--so-orange-500);
  --link-hover-color: var(--so-black-500);
  --brand-gray: var(--so-black-400);
  --text-primary: var(--so-black-600);
  --text-secondary: var(--so-black-400);
  --text-muted: var(--so-black-300);
  --border-color: var(--so-black-225);
  --bg-light: var(--so-black-150);
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.05);
  --shadow-md: 0 8px 24px rgba(0,0,0,0.08);
  --transition-base: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

body {
    color: var(--text-primary);
    background-color: var(--bg-light);
}

.home-hero {
  background: linear-gradient(180deg, rgba(255,255,255,0.75) 0%, rgba(245,245,244,0) 100%);
  padding: var(--su64) var(--su16);
  margin-bottom: var(--su8);
  border-bottom: none;
  position: relative;
  overflow: hidden;
  box-shadow: none;
}

.home-hero h1 {
    color: var(--so-black-600);
    font-weight: 700;
    margin-bottom: var(--su16);
}

.nav-tabs .nav-link {
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--text-secondary);
    font-weight: 500;
}

.nav-tabs .nav-link.active {
    border-color: var(--text-primary);
    color: var(--text-primary);
    background: transparent;
}

.nav-tabs .nav-link:hover:not(.active) {
    border-color: var(--so-black-225);
    color: var(--link-hover-color);
}

.table thead th {
    border-top: none;
    background-color: var(--so-black-150);
    color: var(--so-black-400);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    font-size: 0.9rem;
}

.code-link {
    color: var(--so-black-600);
    font-size: 14px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.code-link:hover {
    color: var(--brand-orange);
    text-decoration: none;
}

.hs-index-tree {
    background: var(--so-white);
    border: 1px solid rgba(0,0,0,0.06);
    max-height: 640px;
    overflow: auto;
    padding: var(--su12);
}

.hs-index-tree .jqtree-element {
    align-items: center;
}

.hs-index-tree .jqtree-toggler {
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: inherit;
    font-size: 0;
    color: var(--so-black-600);
    position: relative;
}

.hs-index-tree .jqtree-toggler::before {
    content: "";
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 6px solid currentColor;
}

.hs-index-tree .jqtree-toggler.jqtree-closed::before {
    border: 0;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 6px solid currentColor;
}

.hs-index-tree-hint {
    font-size: 0.875rem;
}

@media (max-width: 576px) {
  .home-hero {
    padding: var(--su48) var(--su16);
  }
}
