.hero {
    border: 1px solid var(--color-background-border);
    border-radius: 18px;
    padding: 2.2rem;
    margin: 0 0 2rem 0;
    background:
        radial-gradient(circle at top left, rgba(12, 123, 147, 0.18), transparent 34%),
        linear-gradient(135deg, rgba(10, 147, 150, 0.10), rgba(238, 155, 0, 0.08));
}

.hero h1 {
    margin-top: 0;
    font-size: clamp(2.2rem, 6vw, 4.6rem);
    line-height: 0.95;
    letter-spacing: -0.06em;
}

.hero p {
    max-width: 64rem;
    font-size: 1.12rem;
}

.overview-hero-image {
    border-radius: 18px;
    display: block;
    margin: 0.25rem 0 2.25rem 0;
    overflow: hidden;
}

.card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 1rem;
    margin: 1.25rem 0 2rem 0;
}

.doc-card {
    border: 1px solid var(--color-background-border);
    border-radius: 14px;
    padding: 1.1rem 1.2rem;
    background: var(--color-background-secondary);
    min-height: 8.5rem;
}

.doc-card strong {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 1.08rem;
}

.doc-card a {
    text-decoration: none;
}

.doc-card p {
    margin-bottom: 0;
}

.workflow-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: 0.75rem;
    margin: 1rem 0 2rem 0;
}

.workflow-step {
    border-left: 4px solid var(--color-brand-primary);
    padding: 0.8rem 1rem;
    background: var(--color-background-secondary);
}

.workflow-step strong {
    display: block;
    margin-bottom: 0.25rem;
}

.sidebar-brand img {
    border-radius: 12px;
    filter: drop-shadow(0 0.55rem 1.1rem rgba(0, 0, 0, 0.16));
    max-height: 4.5rem;
}

.sidebar-project-links {
    align-items: center;
    display: flex;
    gap: 0.45rem;
    justify-content: center;
    margin: 0.15rem 0 0.4rem;
}

.sidebar-version-label {
    color: var(--hrtfpykit-sidebar-link) !important;
    font-size: 0.94rem;
    font-weight: 500;
    letter-spacing: 0.03em;
    opacity: 0.9;
    text-decoration: none;
}

.sidebar-project-separator {
    color: var(--color-foreground-muted);
    font-size: 0.78rem;
    opacity: 0.72;
}

.sidebar-project-link,
.sidebar-project-link:visited {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    height: 1.75rem;
    justify-content: center;
    opacity: 0.82;
    text-decoration: none;
    width: 1.75rem;
}

.sidebar-project-link:hover,
.sidebar-project-link:focus {
    background: var(--color-background-secondary);
    opacity: 1;
    text-decoration: none;
}

.sidebar-project-link img {
    border-radius: 0;
    display: block;
    filter: none;
    height: 1rem;
    max-height: 1rem;
    width: 1rem;
}

.toc-title {
    font-weight: 800;
}

.toc-tree {
    font-size: 0.9rem;
}

:root {
    --hrtfpykit-content-link: #872ee0;
    --hrtfpykit-content-link-hover: #6d23b6;
    --hrtfpykit-sidebar-link: #5f8f8e;
    --hrtfpykit-sidebar-link-active: #005f73;
}

body[data-theme="dark"] {
    --hrtfpykit-content-link: #b27aeb;
    --hrtfpykit-content-link-hover: #d8b4fe;
    --hrtfpykit-sidebar-link: #8fb8ad;
    --hrtfpykit-sidebar-link-active: #2dd4bf;
}

@media (prefers-color-scheme: dark) {
    body:not([data-theme="light"]) {
        --hrtfpykit-content-link: #b27aeb;
        --hrtfpykit-content-link-hover: #d8b4fe;
        --hrtfpykit-sidebar-link: #8fb8ad;
        --hrtfpykit-sidebar-link-active: #2dd4bf;
    }
}

.content a,
.content a:visited,
.content a.reference,
.content a.reference:visited,
.content a.internal,
.content a.internal:visited,
.content a.external,
.content a.external:visited {
    color: var(--hrtfpykit-content-link) !important;
}

.content a:hover,
.content a.reference:hover,
.content a.internal:hover,
.content a.external:hover {
    color: var(--hrtfpykit-content-link-hover) !important;
}

.content a.reference code,
.content a.reference span.pre,
.content a.internal code,
.content a.internal span.pre,
.content a.external code,
.content a.external span.pre {
    color: inherit !important;
}

.content .doc-card a,
.content .doc-card a:link,
.content .doc-card a:visited {
    color: var(--hrtfpykit-sidebar-link) !important;
    text-decoration: none !important;
    text-decoration-color: transparent !important;
    text-decoration-line: none !important;
}

.content .doc-card a:hover,
.content .doc-card a:focus {
    color: var(--hrtfpykit-sidebar-link-active) !important;
    text-decoration: none !important;
    text-decoration-color: transparent !important;
    text-decoration-line: none !important;
}

.content .toctree-wrapper a.reference,
.content .toctree-wrapper a.reference:visited {
    color: var(--hrtfpykit-sidebar-link) !important;
    text-decoration: none !important;
}

.content .toctree-wrapper a.reference:hover {
    color: var(--hrtfpykit-sidebar-link-active) !important;
    text-decoration: none !important;
}

.content .toctree-wrapper li li a.reference,
.content .toctree-wrapper li li a.reference:visited {
    color: var(--hrtfpykit-sidebar-link) !important;
}

.content .toctree-wrapper li li a.reference:hover,
.content .toctree-wrapper li li a.reference:focus {
    color: var(--hrtfpykit-sidebar-link-active) !important;
}

.content .toctree-wrapper > ul {
    list-style-type: disc;
    padding-left: 1.2rem;
}

.content .toctree-wrapper > ul > li::marker {
    color: var(--hrtfpykit-sidebar-link);
    font-size: 1.18rem;
}

.content .toctree-wrapper > ul > li:hover::marker,
.content .toctree-wrapper > ul > li:focus-within::marker {
    color: var(--hrtfpykit-sidebar-link-active);
}

.content .toctree-wrapper ul ul {
    list-style: none;
    padding-left: 1rem;
}

.content .toctree-wrapper li li::before {
    color: var(--hrtfpykit-sidebar-link);
    content: ">";
    font-size: 1rem;
    font-weight: 700;
    left: -1rem;
    position: absolute;
}

.content .toctree-wrapper li li {
    position: relative;
}

.content .toctree-wrapper li li:hover::before,
.content .toctree-wrapper li li:focus-within::before {
    color: var(--hrtfpykit-sidebar-link-active);
}

.content .toctree-wrapper li li li::before {
    font-size: 0.85rem;
}

.content dl.py dt.sig .sig-prename,
.content dl.py dt.sig .sig-prename span.pre,
.content dl.py dt.sig .sig-name,
.content dl.py dt.sig .sig-name span.pre,
.content dl.py dt.sig .descclassname,
.content dl.py dt.sig .descclassname span.pre,
.content dl.py dt.sig .descname,
.content dl.py dt.sig .descname span.pre {
    color: var(--hrtfpykit-sidebar-link-active) !important;
}

.toc-tree a.reference,
.toc-tree a.reference:visited {
    color: var(--color-toc-item-text) !important;
}

.toc-tree a.reference:hover {
    color: var(--color-foreground-primary) !important;
}

.toc-tree li.scroll-current > a.reference,
.toc-tree li.scroll-current > a.reference:visited {
    color: var(--hrtfpykit-sidebar-link-active) !important;
    font-weight: 700 !important;
}

.sidebar-tree a.reference,
.sidebar-tree a.reference:visited {
    color: var(--hrtfpykit-sidebar-link) !important;
}

.sidebar-tree a.reference:hover {
    color: var(--hrtfpykit-sidebar-link-active) !important;
}

.sidebar-tree li.current > a.reference {
    color: var(--hrtfpykit-sidebar-link-active) !important;
    font-weight: 700 !important;
}

.sidebar-tree li.current-page > a.reference,
.sidebar-tree a.current.reference {
    color: var(--hrtfpykit-sidebar-link-active) !important;
    display: block !important;
    font-weight: 800 !important;
    position: relative !important;
}

.sidebar-tree li.current-page > a.reference::before,
.sidebar-tree a.current.reference::before {
    background: var(--hrtfpykit-sidebar-link-active);
    border-radius: 999px;
    bottom: 0.2rem;
    content: "";
    left: -0.7rem;
    position: absolute;
    top: 0.2rem;
    width: 4px;
}

@media (min-width: 1024px) {
    .page {
        justify-content: flex-start;
        margin-left: 0;
        margin-right: 0;
        max-width: none;
        width: 100%;
    }

    .main {
        flex: 1 1 auto;
        max-width: none;
        min-width: 0;
    }

    .content {
        box-sizing: border-box;
        flex: 1 1 auto;
        margin-left: 0;
        margin-right: 0;
        min-width: 0;
        max-width: none;
        padding-left: clamp(1.75rem, 2.4vw, 3rem);
        padding-right: clamp(1.75rem, 2.4vw, 3rem);
        width: auto;
    }

    .sidebar-drawer {
        flex: 0 0 16rem;
        min-width: 16rem;
        width: 16rem;
    }

    .sidebar-container {
        width: 16rem;
    }

    .toc-drawer {
        flex: 0 0 16rem;
        width: 16rem;
    }
}

@media (min-width: 120em) {
    .main {
        flex-basis: auto;
    }

    .content {
        max-width: none;
    }
}

@media (max-width: 720px) {
    .hero {
        padding: 1.35rem;
    }

    .doc-card {
        min-height: auto;
    }
}

html body .content a.back-to-top,
html body .content a.back-to-top:link,
html body .content a.back-to-top:visited,
html body .content a.back-to-top.muted-link,
html body .content a.back-to-top.muted-link:visited,
html body .content .bottom-of-page a,
html body .content .bottom-of-page a:link,
html body .content .bottom-of-page a:visited {
    border-bottom: 0 !important;
    box-shadow: none !important;
    color: var(--hrtfpykit-sidebar-link) !important;
    text-decoration: none !important;
    text-decoration-color: transparent !important;
    text-decoration-line: none !important;
}

html body .content a.back-to-top:hover,
html body .content a.back-to-top:focus,
html body .content a.back-to-top.muted-link:hover,
html body .content a.back-to-top.muted-link:hover:visited,
html body .content .bottom-of-page a:hover,
html body .content .bottom-of-page a:focus {
    border-bottom: 0 !important;
    box-shadow: none !important;
    color: var(--hrtfpykit-sidebar-link-active) !important;
    text-decoration: none !important;
    text-decoration-color: transparent !important;
    text-decoration-line: none !important;
}

html body .content a.back-to-top span,
html body .content a.back-to-top svg,
html body .content a.back-to-top:hover span,
html body .content a.back-to-top:hover svg {
    color: inherit !important;
    text-decoration: none !important;
    text-decoration-line: none !important;
}

html body .content .related-pages a,
html body .content .related-pages a:link,
html body .content .related-pages a:visited,
html body .content .related-pages a:hover,
html body .content .related-pages a:focus {
    border-bottom: 0 !important;
    box-shadow: none !important;
    text-decoration: none !important;
    text-decoration-color: transparent !important;
    text-decoration-line: none !important;
}

html body .content .related-pages a .page-info .context,
html body .content .related-pages a:visited .page-info .context,
html body .content .related-pages a:hover .page-info .context,
html body .content .related-pages a:focus .page-info .context {
    color: var(--color-foreground-muted) !important;
    text-decoration: none !important;
    text-decoration-line: none !important;
}

html body .content .related-pages a .page-info .title,
html body .content .related-pages a:link .page-info .title,
html body .content .related-pages a:visited .page-info .title {
    color: var(--hrtfpykit-sidebar-link) !important;
    text-decoration: none !important;
    text-decoration-line: none !important;
}

html body .content .related-pages a:hover .page-info .title,
html body .content .related-pages a:focus .page-info .title {
    color: var(--hrtfpykit-sidebar-link-active) !important;
    text-decoration: none !important;
    text-decoration-line: none !important;
}

html body .content .related-pages a svg.furo-related-icon,
html body .content .related-pages a svg.furo-related-icon > use,
html body .content .related-pages a:hover svg.furo-related-icon,
html body .content .related-pages a:hover svg.furo-related-icon > use {
    color: var(--color-foreground-border) !important;
}