.gh2 {
    --gh2-navy: #0a2459;
    --gh2-blue: #246bfe;
    --gh2-copy: #52627b;
    --gh2-border: #dfe6f0;
    --gh2-pale: #f5f8fd;
    color: #263750;
}

.gh2 [hidden] {
    display: none !important;
}

.gh2-breadcrumb-wrap {
    background: #f7faff;
}

.gh2-breadcrumb {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding-top: 1.15rem;
    color: #687892;
    font-size: .85rem;
}

.gh2-breadcrumb a {
    color: #2461c9;
    text-decoration: none;
}

.gh2-breadcrumb a:hover {
    text-decoration: underline;
}

.gh2-hero {
    padding: clamp(2.7rem, 5.5vw, 5rem) 0 clamp(3.4rem, 6vw, 5.6rem);
    overflow: hidden;
    border-bottom: 1px solid #e5ebf4;
    background:
        radial-gradient(circle at 86% 8%, rgba(96, 144, 255, .17), transparent 24rem),
        linear-gradient(135deg, #f7faff 0%, #fff 62%, #f7f9ff 100%);
}

.gh2-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.34fr) minmax(390px, 1fr);
    align-items: center;
    gap: clamp(1.8rem, 3.5vw, 3.4rem);
}

.gh2-eyebrow,
.gh2-card-eyebrow {
    margin: 0 0 .65rem;
    color: #315ed2;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.gh2-hero h1 {
    max-width: 680px;
    margin: 0;
    color: var(--gh2-navy);
    font-size: clamp(2.45rem, 5vw, 4.35rem);
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: 1.03;
}

.gh2-nowrap {
    white-space: nowrap;
}

.gh2-hero-intro {
    max-width: 660px;
    margin: 1.15rem 0 0;
    color: var(--gh2-copy);
    font-size: clamp(1rem, 1.45vw, 1.13rem);
    line-height: 1.72;
}

.gh2-search-wrap {
    max-width: 620px;
    margin-top: 1.55rem;
}

.gh2-search-wrap > label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.gh2-search-field {
    position: relative;
}

.gh2-search-field i {
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: 1.05rem;
    color: #5270a4;
    font-size: 1rem;
    transform: translateY(-50%);
    pointer-events: none;
}

.gh2-search-field input {
    width: 100%;
    min-height: 56px;
    padding: .85rem 1rem .85rem 3rem;
    border: 1px solid #bccbe1;
    border-radius: .9rem;
    background: #fff;
    box-shadow: 0 10px 28px rgba(31, 66, 119, .08);
    color: #182e54;
    font: inherit;
}

.gh2-search-field input::placeholder {
    color: #6c7b91;
}

.gh2-search-field input:focus {
    border-color: #4380ec;
    outline: 3px solid rgba(36, 107, 254, .16);
}

.gh2-search-wrap > p {
    margin: .5rem 0 0;
    color: #718097;
    font-size: .79rem;
}

.gh2-filter-strip {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: 1.05rem;
    padding: .15rem .1rem .45rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    scroll-snap-type: inline proximity;
}

.gh2-filter-strip button {
    min-height: 36px;
    flex: 0 0 auto;
    padding: .42rem .85rem;
    border: 1px solid #c9d5e7;
    border-radius: 999px;
    background: #fff;
    color: #345071;
    font-size: .79rem;
    font-weight: 700;
    scroll-snap-align: start;
}

.gh2-filter-strip button:hover {
    border-color: #80a9ed;
    background: #f5f9ff;
}

.gh2-filter-strip button[aria-pressed="true"] {
    border-color: var(--gh2-blue);
    background: var(--gh2-blue);
    color: #fff;
}

.gh2-filter-strip button:focus-visible,
.gh2-category-card a:focus-visible,
.gh2-feature-card a:focus-visible,
.gh2-tool-cluster a:focus-visible,
.gh2-tool-cluster button:focus-visible,
.gh2-directory-toolbar button:focus-visible {
    outline: 3px solid rgba(36, 107, 254, .25);
    outline-offset: 3px;
}

.gh2-hero-visual {
    position: relative;
    width: 112%;
    margin-inline-start: -7%;
}

.gh2-hero-visual::before {
    position: absolute;
    inset: 10% 6% -8%;
    z-index: 0;
    border-radius: 50%;
    background: rgba(42, 106, 239, .14);
    filter: blur(38px);
    content: "";
}

.gh2-hero-visual img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: auto;
}

.gh2-section {
    padding: clamp(3.8rem, 7vw, 6.5rem) 0;
}

.gh2-section-heading {
    max-width: 760px;
}

.gh2-section-heading h2 {
    margin: 0;
    color: var(--gh2-navy);
    font-size: clamp(1.85rem, 3.3vw, 2.65rem);
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1.15;
}

.gh2-section-heading p {
    margin: .7rem 0 0;
    color: var(--gh2-copy);
    line-height: 1.65;
}

.gh2-featured,
.gh2-directory {
    background: #fff;
}

.gh2-featured-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    margin-top: 2rem;
}

.gh2-feature-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--gh2-border);
    border-radius: 1.15rem;
    background: #fff;
    box-shadow: 0 16px 38px rgba(26, 54, 93, .07);
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.gh2-feature-card:hover {
    border-color: #c4d4ea;
    box-shadow: 0 18px 42px rgba(26, 54, 93, .1);
    transform: translateY(-2px);
}

.gh2-feature-image-link {
    display: block;
    overflow: hidden;
    border-bottom: 1px solid #e5ebf4;
    background: #edf3ff;
}

.gh2-feature-image-link img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.gh2-feature-card-body {
    display: flex;
    height: 100%;
    flex-direction: column;
    padding: 1.35rem;
}

.gh2-feature-card h3 {
    margin: 0;
    font-size: 1.17rem;
    line-height: 1.35;
}

.gh2-feature-card h3 a {
    color: #102e64;
    text-decoration: none;
}

.gh2-feature-card h3 a:hover {
    color: #155ed0;
}

.gh2-feature-card-body > p:not(.gh2-card-eyebrow) {
    margin: .75rem 0 1.15rem;
    color: #5d6b80;
    font-size: .91rem;
    line-height: 1.58;
}

.gh2-text-link {
    margin-top: auto;
    color: #155ed0;
    font-size: .88rem;
    font-weight: 750;
    text-decoration: none;
}

.gh2-browse {
    border-block: 1px solid #e7ecf4;
    background: var(--gh2-pale);
}

.gh2-category-grid {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 2rem;
}

.gh2-category-card {
    display: flex;
    min-width: 0;
    min-height: 290px;
    grid-column: span 2;
    flex-direction: column;
    padding: 1.55rem;
    border: 1px solid #dce5f1;
    border-radius: 1rem;
    background: #fff;
}

.gh2-category-card:nth-child(5) {
    grid-column: 2 / span 2;
}

.gh2-category-icon {
    display: inline-grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: .8rem;
    background: #edf3ff;
    color: #246bfe;
    font-size: 1.12rem;
}

.gh2-category-card h3 {
    margin: 1rem 0 0;
    color: #102e64;
    font-size: 1.08rem;
    font-weight: 800;
}

.gh2-category-card > p {
    margin: .65rem 0 1rem;
    color: #5d6b80;
    font-size: .88rem;
    line-height: 1.55;
}

.gh2-category-count {
    margin-top: auto;
    color: #6b7890;
    font-size: .78rem;
    font-weight: 700;
}

.gh2-category-card a {
    margin-top: .65rem;
    color: #155ed0;
    font-size: .87rem;
    font-weight: 750;
    text-decoration: none;
}

.gh2-directory-toolbar {
    display: flex;
    min-height: 64px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.6rem;
    padding: .65rem .75rem;
    border: 1px solid #dde5f0;
    border-radius: .85rem;
    background: rgba(255, 255, 255, .97);
}

.gh2-directory-search {
    position: relative;
    width: min(100%, 520px);
}

.gh2-directory-search label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.gh2-directory-search i {
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: .9rem;
    color: #61738d;
    transform: translateY(-50%);
    pointer-events: none;
}

.gh2-directory-search input {
    width: 100%;
    min-height: 44px;
    padding: .6rem .85rem .6rem 2.55rem;
    border: 1px solid #cbd6e5;
    border-radius: .7rem;
    background: #fff;
    color: #18365f;
    font: inherit;
    font-size: .87rem;
}

.gh2-directory-search input:focus {
    border-color: #4380ec;
    outline: 3px solid rgba(36, 107, 254, .14);
}

.gh2-directory-state {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: .65rem;
    color: #66758a;
    font-size: .8rem;
    font-weight: 700;
}

.gh2-active-category {
    padding: .38rem .65rem;
    border: 1px solid #cbd8eb;
    border-radius: 999px;
    background: #edf4ff;
    color: #285caa;
}

.gh2-directory-toolbar button {
    padding: .35rem .55rem;
    border: 0;
    border-radius: .45rem;
    background: transparent;
    color: #155ed0;
    font-size: .83rem;
    font-weight: 750;
}

.gh2-directory-toolbar button:hover {
    background: #eaf2ff;
}

.gh2-directory-sections {
    margin-top: 1.25rem;
}

.gh2-directory-category {
    scroll-margin-top: 150px;
}

.gh2-directory-category + .gh2-directory-category {
    margin-top: .7rem;
}

.gh2-category-disclosure-heading {
    margin: 0;
}

.gh2-category-disclosure-heading button {
    display: flex;
    width: 100%;
    min-height: 68px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 1rem;
    border: 1px solid #d9e2ef;
    border-radius: .85rem;
    background: #f7f9fc;
    color: var(--gh2-navy);
    text-align: start;
}

.gh2-category-disclosure-heading button:hover {
    border-color: #bfd0e8;
    background: #f2f6fc;
}

.gh2-category-disclosure-heading button[aria-expanded="true"] {
    border-color: #b7cae6;
    background: #eef4fd;
}

.gh2-category-disclosure-heading button:focus-visible {
    outline: 3px solid rgba(36, 107, 254, .22);
    outline-offset: 2px;
}

.gh2-category-disclosure-main,
.gh2-tool-identity {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .75rem;
}

.gh2-category-disclosure-icon {
    display: inline-grid;
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: .7rem;
    background: #fff;
    color: #246bfe;
}

.gh2-category-disclosure-main strong,
.gh2-category-disclosure-main small {
    display: block;
}

.gh2-category-disclosure-main strong {
    font-size: 1rem;
    font-weight: 800;
}

.gh2-category-disclosure-main small {
    margin-top: .15rem;
    color: #6d7a8e;
    font-size: .76rem;
    font-weight: 650;
}

.gh2-category-chevron {
    flex: 0 0 auto;
    color: #55708f;
    transition: transform 160ms ease;
}

.gh2-category-disclosure-heading button[aria-expanded="true"] .gh2-category-chevron {
    transform: rotate(180deg);
}

.gh2-category-panel {
    padding: 1rem .25rem .4rem;
}

.gh2-directory-category-description {
    max-width: 850px;
    margin: 0;
    color: var(--gh2-copy);
    line-height: 1.58;
}

.gh2-tool-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.1rem;
    margin-top: 1.5rem;
}

.gh2-tool-cluster {
    min-width: 0;
    padding: 1rem 1.1rem;
    border: 1px solid var(--gh2-border);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 10px 28px rgba(25, 55, 98, .045);
}

.gh2-tool-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: .72rem;
    border-bottom: 1px solid #e5ebf3;
}

.gh2-tool-header .mini-tool-icon {
    flex: 0 0 auto;
}

.gh2-tool-header h4 {
    margin: 0;
    color: #102e64;
    font-size: 1.02rem;
    font-weight: 800;
}

.gh2-tool-header p {
    margin: .08rem 0 0;
    color: #718096;
    font-size: .72rem;
    font-weight: 650;
}

.gh2-tool-header a {
    flex: 0 0 auto;
    color: #2364ca;
    font-size: .76rem;
    font-weight: 700;
    text-decoration: none;
}

.gh2-guide-list {
    margin: .35rem 0 0;
    padding: 0;
    list-style: none;
}

.gh2-guide-list li + li {
    border-top: 1px solid #edf0f5;
}

.gh2-guide-list a {
    display: block;
    padding: .63rem .15rem;
    color: #2c4265;
    font-size: .87rem;
    font-weight: 650;
    line-height: 1.4;
    text-decoration: none;
}

.gh2-guide-list a:hover {
    color: #155ed0;
}

.gh2-expand-guides {
    width: auto;
    margin-top: .4rem;
    padding: .35rem .15rem;
    border: 0;
    background: transparent;
    color: #155ed0;
    font-size: .8rem;
    font-weight: 750;
}

.gh2-expand-guides:hover {
    color: #0c4daa;
    text-decoration: underline;
}

.gh2-empty {
    margin: 2rem 0 0;
    padding: 1.5rem;
    border: 1px dashed #b9c9df;
    border-radius: .9rem;
    background: #f7f9fc;
    color: #50617b;
    text-align: center;
}

@media (min-width: 992px) {
    .gh2-directory-toolbar {
        position: sticky;
        top: 76px;
        z-index: 20;
        border-bottom-color: #ccd8e8;
    }
}

@media (max-width: 991.98px) {
    .gh2-hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(320px, .8fr);
        gap: 2rem;
    }

    .gh2-featured-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gh2-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gh2-category-card,
    .gh2-category-card:nth-child(5) {
        grid-column: auto;
    }
}

@media (max-width: 767.98px) {
    .gh2-breadcrumb {
        padding-top: .9rem;
    }

    .gh2-hero {
        padding-top: 2.1rem;
    }

    .gh2-hero-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .gh2-filter-strip {
        flex-wrap: nowrap;
    }

    .gh2-hero h1 {
        font-size: clamp(2.15rem, 11vw, 3.15rem);
    }

    .gh2-hero-visual {
        width: 100%;
        margin-top: .3rem;
        margin-inline-start: 0;
    }

    .gh2-featured-grid,
    .gh2-tool-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .gh2-category-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .gh2-category-card,
    .gh2-category-card:nth-child(5) {
        min-height: 245px;
        grid-column: auto;
    }

    .gh2-directory-toolbar {
        flex-direction: column;
        align-items: flex-start;
    }

    .gh2-directory-search {
        width: 100%;
    }

    .gh2-directory-state {
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

@media (max-width: 389.98px) {
    .gh2-search-field input {
        min-height: 54px;
        font-size: .9rem;
    }

    .gh2-category-card {
        min-height: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gh2 {
        scroll-behavior: auto;
    }
}