:root {
    --ground:#e4eae3;
    --surface:#d5dcd4;
    --surface-2:#c2cac1;
    --line:#a0a79f;
    --ink-soft:#4a4f49;
    --ink:#272a27;
    --accent:#a86515;
    --accent-ink:#fff;


    --depi-354:'Barlow Condensed', 'Barlow Condensed Fallback', 'Arial Narrow', sans-serif;
    --depi-cf1:'Archivo', 'Archivo Fallback', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --depi-678:'IBM Plex Mono', 'IBM Plex Mono Fallback', 'SFMono-Regular', Consolas, monospace;


    --fs-root:16px;
    --fs-xs:clamp(0.72rem, 0.68rem + 0.2vw, 0.8rem);
    --fs-sm:clamp(0.84rem, 0.8rem + 0.25vw, 0.92rem);
    --fs-base:clamp(0.96rem, 0.92rem + 0.3vw, 1.05rem);
    --fs-md:clamp(1.12rem, 1.05rem + 0.4vw, 1.25rem);
    --fs-lg:clamp(1.35rem, 1.22rem + 0.75vw, 1.65rem);
    --fs-xl:clamp(1.75rem, 1.5rem + 1.35vw, 2.35rem);
    --fs-xxl:clamp(2.2rem, 1.85rem + 2vw, 3.25rem);
    --fs-display:clamp(2.65rem, 2.15rem + 3.2vw, 4.75rem);


    --lh-tight:1.08;
    --lh-snug:1.24;
    --lh-base:1.62;
    --lh-relaxed:1.78;


    --tracking-tight:-0.025em;
    --tracking-snug:-0.01em;
    --tracking-normal:0;
    --tracking-wide:0.05em;
    --tracking-caps:0.08em;


    --measure-prose:65ch;
    --measure-caption:58ch;
    --measure-headline:24ch;


    --space-2xs:clamp(0.2rem, 0.18rem + 0.1vw, 0.3rem);
    --space-xs:clamp(0.45rem, 0.4rem + 0.25vw, 0.6rem);
    --space-sm:clamp(0.75rem, 0.65rem + 0.5vw, 1rem);
    --space-md:clamp(1.2rem, 1rem + 0.9vw, 1.75rem);
    --space-lg:clamp(1.85rem, 1.5rem + 1.5vw, 2.75rem);
    --space-xl:clamp(2.8rem, 2.2rem + 2.5vw, 4.25rem);
    --space-2xl:clamp(3.8rem, 3rem + 3.8vw, 6.5rem);


    --grid-max:1360px;
    --gutter:clamp(1rem, 0.75rem + 1.8vw, 2.5rem);
    --radius:2px;
    --border-rule:1px solid var(--line);


    --ease-ledger:cubic-bezier(0.16, 1, 0.3, 1);
    --ease-settle:cubic-bezier(0.22, 1, 0.36, 1);
    --dur-fast:140ms;
    --dur-base:220ms;
    --dur-slow:420ms;


    --dock-height:64px;
}


*,
*::before,
*::after {
    box-sizing:border-box;
    margin:0;
    padding:0;
}


html {
    font-size:var(--fs-root);
    background-color:var(--ground);
    color:var(--ink);
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    scroll-behavior:smooth;
    scroll-padding-top:var(--space-md);
}


body {
    min-height:100vh;
    font-family:var(--depi-cf1);
    font-size:var(--fs-base);
    line-height:var(--lh-base);
    color:var(--ink);
    background-color:var(--ground);
    display:flex;
    flex-direction:column;
    padding-bottom:var(--dock-height);
    position:relative;
    overflow-x:hidden;
}


@media (min-width: 1024px) {
    body {
        padding-bottom:0;
    }
}


img,
picture,
svg {
    display:block;
    max-width:100%;
}


img {
    height:auto;
    font-style:italic;
    shape-margin:1rem;
}


button,
input,
optgroup,
select,
textarea {
    font:inherit;
    color:inherit;
}


button {
    cursor:pointer;
    background:none;
    border:none;
}


a {
    color:inherit;
    text-decoration:none;
}


table {
    border-collapse:collapse;
    width:100%;
}


ul,
ol {
    list-style:none;
}


h1,
h2,
h3,
h4,
h5,
h6 {
    font-family:var(--depi-354);
    font-weight:700;
    line-height:var(--lh-tight);
    letter-spacing:var(--tracking-snug);
    color:var(--ink);
    text-wrap:balance;
    overflow-wrap:break-word;
}


h1 {
    font-size:var(--fs-display);
    font-weight:800;
    letter-spacing:var(--tracking-tight);
    max-width:var(--measure-headline);
}


h2 {
    font-size:var(--fs-xxl);
    font-weight:700;
    letter-spacing:var(--tracking-tight);
}


h3 {
    font-size:var(--fs-xl);
    font-weight:700;
}


h4 {
    font-size:var(--fs-lg);
    font-weight:600;
}


p {
    max-width:var(--measure-prose);
    color:var(--ink);
    text-wrap:pretty;
}


p + p {
    margin-top:var(--space-sm);
}


small {
    font-size:var(--fs-xs);
    line-height:var(--lh-snug);
    color:var(--ink-soft);
}


strong,
b {
    font-weight:700;
    color:var(--ink);
}


em {
    font-style:italic;
}


hr {
    border:0;
    height:1px;
    background-color:var(--line);
    margin:var(--space-md) 0;
}


.tabular {
    font-family:var(--depi-678);
    font-variant-numeric:tabular-nums;
    letter-spacing:-0.01em;
}


.skip-link {
    position:absolute;
    top:-120px;
    left:var(--gutter);
    background-color:var(--accent);
    color:var(--accent-ink);
    padding:0.65rem 1.25rem;
    font-family:var(--depi-678);
    font-size:var(--fs-sm);
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:var(--tracking-caps);
    border-radius:var(--radius);
    z-index:1000;
    transition:top var(--dur-fast) var(--ease-ledger);
}


.skip-link:focus-visible {
    top:var(--space-sm);

    outline:2px solid var(--ink);
    outline-offset:2px;
}


.shell-container {
    width:100%;
    max-width:var(--grid-max);
    margin-left:auto;
    margin-right:auto;
    padding-left:var(--gutter);
    padding-right:var(--gutter);
}


.site-main {
    flex:1 0 auto;
    width:100%;
    min-width:0;
}


.icon {
    width:1.25rem;
    height:1.25rem;
    display:inline-block;
    vertical-align:middle;
    flex-shrink:0;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}


.ledger-rule {
    width:100%;
    height:1px;
    background-color:var(--line);
    margin:0;
    border:0;
}


.visually-hidden {
    position:absolute !important;
    width:1px !important;

    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0, 0, 0, 0) !important;
    white-space:nowrap !important;
    border:0 !important;
}


.ledger-grid {
    display:grid;

    grid-template-columns:repeat(12, minmax(0, 1fr));
    gap:0;
    border:var(--border-rule);
    background-color:var(--line);
}


.ledger-cell {
    background-color:var(--ground);
    padding:var(--space-md);
    min-width:0;
}


.flow > * + * {
    margin-top:var(--space-md);
}


.flow-sm > * + * {
    margin-top:var(--space-sm);
}


.flow-lg > * + * {
    margin-top:var(--space-lg);
}


.cluster {
    display:flex;
    flex-wrap:wrap;
    gap:var(--space-sm);
    align-items:center;
}


.stack {
    display:flex;
    flex-direction:column;
}


.text-meta {
    font-family:var(--depi-678);
    font-size:var(--fs-xs);
    letter-spacing:var(--tracking-wide);
    color:var(--ink);
    text-transform:uppercase;
}


.text-lead {
    font-size:var(--fs-md);
    line-height:var(--lh-snug);
    color:var(--ink);
    font-weight:500;
    max-width:var(--measure-prose);
}


.text-caption-lead {
    font-weight:700;
    color:var(--ink);
}


.text-soft {
    color:var(--ink-soft);
}


.bg-surface {
    background-color:var(--surface);
}


.bg-surface-2 {
    background-color:var(--surface-2);
}


.bg-ground {
    background-color:var(--ground);
}


.border-top {
    border-top:var(--border-rule);
}


.border-bottom {
    border-bottom:var(--border-rule);
}


.border-left {
    border-left:var(--border-rule);
}


.border-right {
    border-right:var(--border-rule);
}


@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration:0.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:0.01ms !important;
        scroll-behavior:auto !important;
    }
}