.archive-main, .single-main { padding-block-start: var(--space-10); }
.archive-header {
    margin-block-end: var(--space-4);
    padding: clamp(34px, 5vw, 64px);
    border: 1px solid var(--line);
    border-radius: var(--radius-xl);
    background: var(--paper);
}
.archive-header h1, .single-header h1, .error-main h1 { margin: var(--space-3) 0 0; font-size: var(--type-page); line-height: 1.08; }
.archive-header > p, .archive-description { max-inline-size: 720px; margin: var(--space-4) 0 0; color: var(--ink-soft); }
.archive-search { max-inline-size: 760px; margin-block-start: var(--space-8); }
.archive-paths { margin-block-end: var(--space-4); padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-md); display: flex; gap: var(--space-2); overflow-x: auto; background: var(--paper); }
.archive-paths a { min-block-size: 52px; padding: 8px var(--space-4); border-radius: var(--radius-sm); display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; background: var(--paper-muted); text-decoration: none; font-size: var(--text-md); font-weight: 750; white-space: nowrap; }
.archive-paths a small { color: var(--ink-soft); font-size: var(--text-2xs); font-weight: 650; }
.archive-paths a:hover { color: var(--paper); background: var(--leaf); }
.archive-paths a:hover small { color: inherit; }
.archive-main > .post-card-grid { padding: clamp(28px, 4vw, 48px); border: 1px solid var(--line); border-radius: var(--radius-xl); background: var(--paper); }
.guide-library > .post-card-grid, .archive-main > .post-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.topic-shortcuts--centered { justify-content: center; }
.pagination { margin-block-start: var(--space-8); }
.pagination .nav-links { display: flex; justify-content: center; gap: var(--space-2); }
.pagination .page-numbers { min-inline-size: 44px; min-block-size: 44px; border: 1px solid var(--line); border-radius: var(--radius-sm); display: grid; place-items: center; background: var(--paper); text-decoration: none; }
.pagination .current { color: var(--paper); border-color: var(--ink); background: var(--ink); }

.single-article { min-inline-size: 0; }
.single-header {
    padding: clamp(34px, 6vw, 76px);
    border: 1px solid var(--line);
    border-radius: var(--radius-xl);
    background: var(--paper);
}
.article-breadcrumb { margin: 0 0 var(--space-8); display: flex; gap: var(--space-2); color: var(--ink-soft); font-size: var(--text-sm); }
.article-breadcrumb a { text-underline-offset: 3px; }
.single-header__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 320px); gap: clamp(30px, 6vw, 80px); align-items: end; }
.single-header h1 { max-inline-size: 860px; font-size: var(--type-single); }
.single-deck { max-inline-size: 760px; margin: var(--space-5) 0 0; color: var(--ink-soft); font-size: var(--text-body-lg); }
.guide-scope { padding: var(--space-5); border-radius: var(--radius-md); background: var(--wheat); }
.guide-scope > span { font-size: var(--text-sm); font-weight: 850; }
.guide-scope ul { margin: var(--space-3) 0 0; padding-inline-start: 19px; font-size: var(--text-md); }
.article-meta { margin-block-start: var(--space-8); padding-block-start: var(--space-4); border-block-start: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: var(--space-5); color: var(--ink-soft); font-size: var(--text-sm); }
.single-thumbnail { max-inline-size: 1040px; margin: var(--space-10) auto; }
.single-thumbnail img { inline-size: 100%; border-radius: var(--radius-lg); display: block; }
.article-layout { max-inline-size: 1040px; margin: var(--space-12) auto 0; display: grid; grid-template-columns: 210px minmax(0, 760px); gap: clamp(32px, 6vw, 72px); align-items: start; }
.article-toc { position: sticky; inset-block-start: 112px; padding: var(--space-5); border-inline-start: 2px solid var(--ink); font-size: var(--text-sm); }
.article-toc > span { font-weight: 850; }
.article-toc ol { margin: var(--space-4) 0 0; padding: 0; display: grid; gap: var(--space-3); list-style: none; counter-reset: toc; }
.article-toc li { counter-increment: toc; }
.article-toc a { color: var(--ink-soft); text-decoration: none; }
.article-toc li a::before { content: counter(toc, decimal-leading-zero) " "; margin-inline-end: 4px; color: var(--signal-dark); font-family: var(--font-mono); }
.article-toc a:hover { color: var(--signal-dark); text-decoration: underline; text-underline-offset: 3px; }
.article-toc__shop { margin-block-start: var(--space-5); padding-block-start: var(--space-4); border-block-start: 1px solid var(--line); display: flex; justify-content: space-between; color: var(--signal-dark) !important; font-weight: 800; }
.article-content { min-inline-size: 0; font-size: var(--text-lead); line-height: 1.78; counter-reset: product; }
.article-content > :first-child { margin-block-start: 0; font-size: var(--text-lead-lg); color: var(--article-lead); }
.article-content h2 { scroll-margin-block-start: 120px; margin: 2.5em 0 0.75em; padding-block-start: var(--space-4); border-block-start: 2px solid var(--ink); font-size: var(--text-article-h2); line-height: 1.25; }
.article-content h3 { margin: 1.8em 0 0.6em; font-size: var(--text-article-h3); line-height: 1.35; }
.article-content h4 { margin: var(--space-5) 0 var(--space-2); color: var(--ink-soft); font-size: var(--text-base); letter-spacing: -0.02em; }
.article-content p, .article-content li { color: var(--article-copy); }
.article-content a { color: var(--signal-dark); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.article-content blockquote { margin: var(--space-8) 0; padding: var(--space-5); border-inline-start: 4px solid var(--signal); background: var(--signal-soft); }
.article-content table { inline-size: 100%; border-collapse: collapse; font-size: var(--text-base); }
.article-content th, .article-content td { padding: var(--space-3); border: 1px solid var(--line); text-align: start; }
.article-content th { background: var(--paper-muted); }
.article-content details { margin-block: var(--space-3); padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--paper); }
.article-content summary { cursor: pointer; font-weight: 780; }
.article-content .cartbom-product {
    position: relative;
    margin-block: var(--space-8);
    padding: var(--space-8);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    background: var(--paper);
    box-shadow: var(--shadow-card);
    counter-increment: product;
}
.article-content .cartbom-product::before { content: "PICK " counter(product, decimal-leading-zero); display: block; color: var(--signal-dark); font-family: var(--font-mono); font-size: var(--text-xs); font-weight: 850; letter-spacing: 0.08em; }
.article-content .cartbom-product h3 { margin-block-start: var(--space-3); font-size: var(--text-product-title); }
.article-content .cartbom-product-media {
    max-inline-size: 280px;
    margin: var(--space-4) 0 var(--space-5);
    background: var(--paper-muted);
    border-radius: var(--radius-md);
}
.article-content .cartbom-product-media img {
    inline-size: 100%;
    block-size: auto;
    border-radius: var(--radius-md);
    display: block;
}
.article-content .cartbom-product-meta {
    margin: 0 0 var(--space-4);
    color: var(--ink-soft);
    font-size: var(--text-sm);
    font-weight: 700;
}
.article-content .cartbom-product h4 { display: inline-flex; margin-inline-end: var(--space-2); padding: 4px 8px; border-radius: 999px; background: var(--leaf-soft); color: var(--leaf-dark); }
.article-content .cartbom-product > p:last-child { margin: var(--space-6) 0 0; padding-block-start: var(--space-5); border-block-start: 1px solid var(--line); }
.article-content .cartbom-product > p:last-child a { min-block-size: 48px; padding: 11px var(--space-5); border-radius: var(--radius-sm); display: inline-flex; align-items: center; color: var(--paper); background: var(--signal); text-decoration: none; font-size: var(--text-base); font-weight: 800; }
.article-content .cartbom-product > p:last-child a:hover { background: var(--signal-dark); }
.article-shop-cta { max-inline-size: 1040px; margin: var(--space-12) auto 0; padding: clamp(28px, 5vw, 52px); border-radius: var(--radius-xl); display: flex; align-items: center; justify-content: space-between; gap: var(--space-8); background: var(--leaf-soft); }
.article-shop-cta > div { max-inline-size: 650px; }
.article-shop-cta > div > span { color: var(--leaf); font-family: var(--font-mono); font-size: var(--text-2xs); font-weight: 850; letter-spacing: 0.08em; }
.article-shop-cta h2 { margin: var(--space-2) 0 0; font-size: var(--type-article-cta); line-height: 1.2; }
.article-shop-cta p { margin: var(--space-3) 0 0; color: var(--ink-soft); }
.single-header--page { max-inline-size: 980px; margin-inline: auto; }
.error-main { min-block-size: 620px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.error-main p { margin: var(--space-4) 0 var(--space-6); color: var(--ink-soft); }
