@font-face {
    font-family: 'Source Serif 4';
    font-style: normal;
    font-weight: 200 900;
    font-display: swap;
    src: url('../fonts/source-serif-4-latin-var.woff2') format('woff2');
}

@font-face {
    font-family: 'IBM Plex Mono';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/ibm-plex-mono-600-latin.woff2') format('woff2');
}

:root {

    --primary: #7A6345;
    --primary-dark: #6B5640;
    --link: #6B5640;
    --site-ink: #1A1614;
    --site-gray: #6B6762;
    --hairline: #E5DFD6;
    --site-tint: #F1EDE7;
    --btn: #7A6345;
    --btn-hover: #6B5640;

    --site-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
    --site-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --site-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    --site-title: clamp(2rem, 1.5rem + 1.25vw, 2.625rem);
    --site-title-weight: 330;
    --site-title-tracking: -0.02em;
    --site-heading: 1.5rem;
    --site-heading-weight: 360;
    --site-body: 1.0625rem;
    --site-small: 0.875rem;

    --nav-height: 72px;
    --site-measure: 42rem;
    --site-gutter: 2rem;
}

html { font-synthesis: none; }

nav { border-bottom: 0; }
.logo { font-family: var(--site-sans); color: var(--primary); }
.nav-links > a.btn,
.nav-links > a.btn:hover { color: #FFFFFF; background: var(--btn); transform: none; box-shadow: none; }
.nav-links > a.btn:hover { background: var(--btn-hover); }
.nav-links > a.btn:focus-visible { outline: 2px solid var(--btn); outline-offset: 3px; }

@media (min-width: 981px) {
    .nav-links { gap: 1.75rem; }
    .nav-links > a { font-size: 0.9375rem; font-weight: 400; }
    .nav-links > a.btn { font-size: 0.875rem; font-weight: 500; padding: 0.4375rem 0.875rem; border-radius: 6px; }
}
@media (max-width: 980px) {
    .nav-links { box-shadow: none; }
}

.btn-primary, .btn-large, .follow-cta .cta-links a.cta-primary,
main.tp-container .tp-actions a {
    background: var(--btn);
    color: #FFFFFF;
    border: 0;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 500;
    padding: 0.6875rem 1.25rem;
    text-decoration: none;
    transform: none;
    box-shadow: none;
}
.btn-primary:hover, .btn-large:hover, .follow-cta .cta-links a.cta-primary:hover,
main.tp-container .tp-actions a:hover {
    background: var(--btn-hover);
    color: #FFFFFF;
    border-color: transparent;
    transform: none;
    box-shadow: none;
}
.btn-primary:focus-visible, .btn-large:focus-visible, .follow-cta .cta-links a:focus-visible,
main.tp-container .tp-actions a:focus-visible {
    outline: 2px solid var(--btn);
    outline-offset: 3px;
}

.follow-cta .cta-links a.cta-secondary {
    background: transparent;
    border: 0;
    padding: 0.6875rem 0.25rem;
    color: var(--link);
    font-size: 0.9375rem;
    font-weight: 500;
}
.follow-cta .cta-links a.cta-secondary:hover { text-decoration: underline; border: 0; }

footer.rv-footer {
    text-align: left;
    margin-top: 5rem;
    padding: 3rem 0 2.5rem;
    border-top: 1px solid var(--hairline);
    background: transparent;
    font-size: var(--site-small);
    line-height: 1.6;
    color: var(--site-gray);
}
.rv-footer .wrap { max-width: 1120px; margin: 0 auto; padding: 0 var(--site-gutter); }
.rv-footer .groups {
    display: grid;
    grid-template-columns: 1.4fr repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}
.rv-footer .brand strong {
    font-family: var(--site-sans);
    font-size: var(--site-small);
    font-weight: 600;
    color: var(--site-ink);
    display: block;
    margin-bottom: 0.25rem;
}
.rv-footer h2, .rv-footer h3 {

    font-family: var(--site-mono);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.5;
    color: var(--site-ink);
    margin: 0 0 0.5rem;
}
.rv-footer ul { list-style: none; margin: 0; padding: 0; }
.rv-footer li { margin-bottom: 0.25rem; }
.rv-footer a { color: var(--site-gray); text-decoration: none; }
.rv-footer a:hover { color: var(--site-ink); text-decoration: underline; }
.rv-footer a:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 2px; }
.rv-footer .legal { border-top: 0; padding-top: 0; font-size: var(--site-small); color: var(--site-gray); line-height: 1.6; }
.rv-footer .legal p { margin: 0; }
@media (max-width: 980px) {
    .rv-footer .groups { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .rv-footer .brand { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    footer.rv-footer { margin-top: 3.5rem; }
    .rv-footer .wrap { padding: 0 1.25rem; }
    .rv-footer .groups { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.post-container, .blog-container, main.tp-container {
    max-width: calc(var(--site-measure) + 2 * var(--site-gutter));
    margin: 0 auto;
    padding: calc(var(--nav-height) + 4.5rem) var(--site-gutter) 0;
}

.post-header h1, .blog-header h1, main.tp-container .tp-header h1 {
    font-family: var(--site-serif);
    font-optical-sizing: auto;
    font-size: var(--site-title);
    font-weight: var(--site-title-weight);
    letter-spacing: var(--site-title-tracking);
    line-height: 1.1;
    color: var(--site-ink);
    text-wrap: balance;
    margin: 0;
}
.post-header, .blog-header, main.tp-container .tp-header {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 2.5rem;
}
.blog-header p, .post-header time, .post-header .post-meta, .post-header p {
    color: var(--site-gray);
}
.blog-header p { font-size: var(--site-body); line-height: 1.6; margin-top: 1rem; }
.post-header time, .post-meta, .post-card time { font-size: var(--site-small); color: var(--site-gray); }
.post-header time { margin-bottom: 0.75rem; }
.post-header .post-meta { margin-top: 1rem; }

.post-card time, .post-meta, .post-meta time, .post-tag, .post-byline {
    font-family: var(--site-mono);
    font-size: var(--site-small);
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    font-variant-numeric: tabular-nums;
    color: var(--site-gray);
}

.post-header .post-meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 0.5rem; margin-top: 1.25rem; }
.post-header .post-meta time { margin: 0; }
.post-header .post-meta > * + *::before { content: "\00B7"; margin-right: 0.5rem; color: var(--site-gray); }

.blog-posts .post-card { display: grid; grid-template-columns: 6.25rem minmax(0, 1fr); column-gap: 1.5rem; align-items: baseline; }
.blog-posts .post-card > * { grid-column: 2; }
.blog-posts .post-card > time { grid-column: 1; grid-row: 1; margin: 0; }
.blog-posts .post-card > h2 { grid-row: 1; margin-top: 0; }
@media (max-width: 640px) {
    .blog-posts .post-card { grid-template-columns: minmax(0, 1fr); }
    .blog-posts .post-card > *, .blog-posts .post-card > time { grid-column: 1; grid-row: auto; }
    .blog-posts .post-card > h2 { grid-row: auto; margin-top: 0.375rem; }
}

.post-content h2, main.tp-container .tp-section h2, main.tp-container .tp-cite summary,
main.tp-container .tp-index-stage h2, .follow-cta h3, .post-card h2 {
    font-family: var(--site-serif);
    font-optical-sizing: auto;
    font-size: var(--site-heading);
    font-weight: var(--site-heading-weight);
    letter-spacing: -0.01em;
    line-height: 1.25;
    color: var(--site-ink);
}
.post-content h2 { margin: 3rem 0 1rem; }
.post-content h3 { font-family: var(--site-sans); font-size: var(--site-body); font-weight: 600; margin: 2rem 0 0.5rem; color: var(--site-ink); }

.post-content, main.tp-container .tp-description {
    font-size: var(--site-body);
    line-height: 1.65;
    color: var(--site-ink);
    max-width: none;
}
.post-content p, .post-content li { font-size: var(--site-body); color: var(--site-ink); }
.post-content p { margin-bottom: 1.25rem; }

.blog-post .post-content p, .blog-post .post-content li { line-height: 1.5; }
.post-content a { color: var(--link); text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
.post-content a:hover { color: var(--site-ink); }
.post-content a:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 2px; }
.post-content ul, .post-content ol { padding-left: 1.25rem; }

.post-content code { background: transparent; padding: 0; border-radius: 0; font-size: var(--site-small); }
.post-content blockquote {
    background: transparent;
    border: 0;
    border-left: 1px solid var(--primary);
    border-radius: 0;
    padding: 0 0 0 1.25rem;
    margin: 1.5rem 0;
    font-style: normal;
    font-weight: 400;
    color: var(--site-gray);
}
.post-tag, main.tp-container .tp-tag {
    background: transparent;
    padding: 0;
    border-radius: 0;
    font-size: var(--site-small);
    font-weight: 400;
    color: var(--site-gray);
}
.post-meta, main.tp-container .tp-tags { gap: 0 0.5rem; }
.post-tag + .post-tag::before, main.tp-container .tp-tag + .tp-tag::before { content: "·"; margin-right: 0.5rem; color: var(--site-gray); }

.post-content h2[id] { scroll-margin-top: calc(var(--nav-height) + 1.5rem); }

.post-content pre, main.tp-container .tp-cite pre {
    background: var(--site-tint);
    color: var(--site-ink);
    border: 0;
    border-radius: 6px;
    padding: 1rem 1.25rem;
    font-size: var(--site-small);
    line-height: 1.6;
    overflow-x: auto;
}
.post-content pre code { font-size: inherit; color: inherit; }

.post-content pre, main.tp-container .tp-cite pre { white-space: pre-wrap; overflow-wrap: anywhere; overflow-x: visible; }

.post-content th, .post-content td { border: 0; border-bottom: 1px solid var(--hairline); padding: 0.625rem 0.75rem 0.625rem 0; }
.post-content th { background: transparent; font-weight: 600; }

.blog-posts { gap: 0; border-bottom: 1px solid var(--hairline); }
.post-card {
    background: transparent;
    border: 0;
    border-top: 1px solid var(--hairline);
    border-radius: 0;
    padding: 1.75rem 0;
    transition: none;
}
.post-card:hover { border-color: var(--hairline); box-shadow: none; }
.post-card h2 { margin: 0.375rem 0 0.5rem; }
.post-card h2 a { color: var(--site-ink); }
.post-card h2 a:hover { color: var(--site-ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.15em; }
.post-card p { font-size: var(--site-body); color: var(--site-gray); line-height: 1.6; margin-bottom: 0.75rem; }

ul.site-list { list-style: none; padding: 0; margin: 1.25rem 0 1.75rem; border-bottom: 1px solid var(--hairline); }
ul.site-list > li { margin: 0; padding: 0.875rem 0; border-top: 1px solid var(--hairline); }

main.tp-container .tp-sublist { border-bottom: 1px solid var(--hairline); }
main.tp-container .tp-sublist li { padding: 0.875rem 0; border-bottom: 0; border-top: 1px solid var(--hairline); }
main.tp-container .tp-sublist .tp-subdesc { font-size: var(--site-body); color: var(--site-gray); }
main.tp-container .tp-index-list { border-bottom: 1px solid var(--hairline); }
main.tp-container .tp-index-list li { padding: 0.625rem 0; border-top: 1px solid var(--hairline); }

.follow-cta {
    background: transparent;
    border: 0;
    border-top: 1px solid var(--hairline);
    border-radius: 0;
    padding: 2.5rem 0 0;
    margin-top: 3.5rem;
    text-align: left;
}
.blog-posts + .follow-cta { border-top: 0; padding-top: 0; }
.follow-cta h3 { margin-bottom: 0.5rem; }
.follow-cta p { font-size: var(--site-body); color: var(--site-gray); margin-bottom: 1.25rem; }
.follow-cta .cta-links { justify-content: flex-start; gap: 1rem; }

.post-footer { background: transparent; border-top: 1px solid var(--hairline); padding: 2rem 0 0; margin-top: 3rem; text-align: left; }

.post-footer .post-nav { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: start; column-gap: 2rem; }
.post-footer .post-nav a.post-nav-prev { grid-column: 1; justify-self: start; }
.post-footer .post-nav a.post-nav-next { grid-column: 3; justify-self: end; margin-left: 0; align-items: flex-end; text-align: right; }
.post-footer .post-nav .post-nav-label, .post-footer .post-all { line-height: 1.4; }
.post-footer .post-all { grid-column: 2; grid-row: 1; justify-self: center; font-size: var(--site-small); color: var(--link);text-decoration: none; white-space: nowrap; }
.post-footer .post-all:hover { color: var(--site-ink); text-decoration: underline; text-underline-offset: 0.2em; }
.post-footer .post-all:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 2px; }
.post-footer .post-nav-empty { display: block; }
@media (max-width: 640px) {
    .post-footer .post-nav { grid-template-columns: minmax(0, 1fr); row-gap: 1.25rem; }
    .post-footer .post-all { grid-column: 1; grid-row: 1; justify-self: start; }
    .post-footer .post-nav a.post-nav-prev, .post-footer .post-nav a.post-nav-next { grid-column: 1; grid-row: auto; max-width: none; width: 100%; }
    .post-footer .post-nav a.post-nav-next { justify-self: stretch; align-items: flex-end; text-align: right; }
    .post-footer .post-nav-empty { display: none; }
}
.post-content p.site-note { font-size: var(--site-small); color: var(--site-gray); margin-top: 1.5rem; }
.post-nav .post-nav-label { font-size: var(--site-small); font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--site-gray); }
.post-nav a { color: var(--site-ink); }
.post-nav .post-nav-title { font-size: var(--site-body); }
.back-link { font-size: var(--site-small); color: var(--site-gray); }
.back-link:hover { color: var(--site-ink); }

.form-group label { font-size: var(--site-small); font-weight: 500; color: var(--site-ink); }
.form-group input, .form-group textarea, .form-group select, .form-row input[type="email"] {
    font-size: var(--site-body);
    border: 1px solid var(--hairline);
    border-radius: 6px;
    background-color: #FFFFFF;
    box-shadow: none;
}
.form-group input:focus, .form-group textarea:focus, .form-group select:focus, .form-row input[type="email"]:focus,
.contact-form .form-group input:focus, .contact-form .form-group textarea:focus, .contact-form .form-group select:focus {
    outline: 2px solid var(--btn);
    outline-offset: 1px;
    border-color: var(--btn);
    box-shadow: none;
}
.form-note, .form-fallback { font-size: var(--site-small); color: var(--site-gray); }

main.tp-container .tp-breadcrumb, main.tp-container .tp-breadcrumb a, main.tp-container .tp-meta,
main.tp-container .tp-kicker, main.tp-container .tp-pagenav .tp-navlbl, main.tp-container .tp-jumpnav,
main.tp-container .tp-index-stage p.tp-stagedesc, main.tp-container .tp-cite p {
    font-size: var(--site-small);
    color: var(--site-gray);
}
main.tp-container .tp-pagenav .tp-navlbl { font-weight: 400; letter-spacing: 0; text-transform: none; }
main.tp-container .tp-kicker { margin-top: 1rem; }
main.tp-container .tp-section { margin-top: 3rem; }
main.tp-container .tp-actions { margin-top: 2.5rem; }
main.tp-container .tp-pagenav { border-top: 1px solid var(--hairline); margin-top: 3.5rem; }
main.tp-container .tp-jump span { font-size: var(--site-small); }

@media (max-width: 768px) {
    .post-container, .blog-container, main.tp-container { padding: calc(var(--nav-height) + 2.5rem) 1.25rem 0; }
    .post-content, .post-content p, .post-content li { font-size: var(--site-body); }
}
@media (max-width: 640px) {
    :root { --site-heading: 1.375rem; }
}

.explorer-header { border-bottom: 0; box-shadow: none; background: var(--bg-main); }
.explorer-header .logo-text { font-family: var(--site-sans); color: var(--primary); }
.explorer-header .version-badge { background: transparent; border: 0; padding: 0; color: var(--site-gray); font-size: var(--site-small); font-weight: 400; }
.explorer-header .header-nav { display: flex; align-items: center; gap: 1.75rem; margin-left: auto; padding-left: 2rem; }
.explorer-header .header-nav > a { font-size: 0.9375rem; color: var(--site-gray); text-decoration: none; white-space: nowrap; }
.explorer-header .header-nav > a:hover { color: var(--primary); }
.explorer-header .header-nav > a:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; border-radius: 2px; }
.explorer-header .header-nav > a.btn { color: #FFFFFF; font-size: 0.875rem; font-weight: 500; padding: 0.4375rem 0.875rem; border-radius: 6px; }
@media (max-width: 1024px) { .explorer-header .header-nav { display: none; } }

.content-title {
    font-family: var(--site-serif);
    font-size: var(--site-title);
    font-weight: var(--site-title-weight);
    letter-spacing: var(--site-title-tracking);
    line-height: 1.1;
}
.content-description { font-size: var(--site-body); color: var(--site-gray); max-width: var(--site-measure); }
.search-result-heading { font-family: var(--site-serif); font-weight: var(--site-heading-weight); font-size: var(--site-heading); }
.technique-name { font-family: var(--site-serif); font-weight: 450; }

.sidebar { background: var(--bg-main); border-right: 0; }
.sidebar-title { color: var(--site-gray); }
.stage-btn { border: 0; border-radius: 6px; background: transparent; color: var(--site-gray); font-weight: 400; }
.stage-btn:hover { background: var(--site-tint); color: var(--site-ink); }
.stage-btn.active { background: var(--site-tint); color: var(--site-ink); font-weight: 500; border: 0; box-shadow: none; }
.sidebar-links { gap: 0.25rem 1rem; }
.sidebar-links a { font-size: var(--site-small); font-weight: 400; color: var(--site-gray); border: 0; border-radius: 0; padding: 0; background: transparent; }
.sidebar-links a:hover { border: 0; background: transparent; color: var(--site-ink); text-decoration: underline; }

.sidebar-legal p { font-size: var(--site-small); line-height: 1.6; color: var(--site-gray); margin: 0 0 0.5rem; }
@media (max-width: 1024px) {
    .sidebar { border-right: 1px solid var(--hairline); }
}
@media (max-width: 768px) {
    .content-title { font-size: var(--site-title); }
}