/* FRAME: Baza Wiedzy index and article system. */

.kb-page {
    --kb-rule: 1px solid var(--frame-ink);
    --kb-reading-inset: clamp(1.5rem, 5vw, 6rem);
    --warmth-primary: var(--frame-violet);
    --warmth-charcoal: var(--frame-ink);
    --warmth-cream: color-mix(in oklch, var(--frame-violet) 8%, var(--frame-canvas));
    --warmth-accent: color-mix(in oklch, var(--frame-ink) 72%, transparent);
    --index-charcoal: var(--frame-ink);
    --index-charcoal-80: color-mix(in oklch, var(--frame-ink) 80%, transparent);
}

.kb-page .serif-accent {
    font: inherit;
}

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

.kb-container,
.kb-article-page {
    width: min(100%, var(--frame-shell));
    margin-inline: auto;
    border-inline: var(--kb-rule);
}

.kb-container {
    padding-inline: var(--frame-gutter);
}

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

.kb-shell-home .kb-hero .kb-container {
    padding-block: clamp(4rem, 10vw, 9rem);
}

.kb-hero-title {
    max-width: none;
    margin: 0;
    font-size: clamp(2.6rem, 5.6vw, 5rem);
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 1.02;
    text-wrap: pretty;
}

.kb-hero-line {
    display: block;
}

.kb-hero-brand {
    white-space: nowrap;
}

.kb-hero-subtitle {
    max-width: 68rem;
    margin: clamp(1.75rem, 4vw, 3rem) 0 0;
    font-size: clamp(1.2rem, 2.5vw, 2rem);
    line-height: 1.15;
    text-wrap: pretty;
}

.kb-section > .kb-container {
    padding-block: clamp(3.5rem, 8vw, 7rem);
}

.kb-intro-grid {
    display: grid;
    margin-inline: calc(-1 * var(--frame-gutter));
    border-block: var(--kb-rule);
}

.kb-intro-panel {
    min-width: 0;
    padding: clamp(1.5rem, 4vw, 3rem) var(--frame-gutter);
}

.kb-intro-panel + .kb-intro-panel {
    border-top: var(--kb-rule);
}

.kb-intro-panel--accent {
    background: color-mix(in oklch, var(--frame-violet) 10%, var(--frame-canvas));
    border: 1px solid var(--frame-ink);
}

.kb-eyebrow {
    display: block;
    margin-bottom: 1rem;
    font-size: 0.75rem;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.kb-intro-panel p {
    max-width: none;
    margin: 0;
    font-size: clamp(1.05rem, 1.9vw, 1.4rem);
    line-height: 1.35;
    text-wrap: pretty;
}

.kb-inline-cta {
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
    margin-top: 1.5rem;
    border-bottom: var(--kb-rule);
    font-weight: 700;
    text-decoration: none;
}

.kb-topic-nav {
    display: grid;
    margin: clamp(3rem, 7vw, 6rem) calc(-1 * var(--frame-gutter)) 0;
    border-top: var(--kb-rule);
}

.kb-topic-nav a {
    min-height: 4.25rem;
    display: flex;
    align-items: center;
    padding: 1rem var(--frame-gutter);
    border-bottom: var(--kb-rule);
    font-weight: 700;
    text-decoration: none;
}

.kb-section-title {
    max-width: none;
    margin: clamp(4rem, 9vw, 8rem) 0 clamp(1.5rem, 3vw, 2.5rem);
    font-size: clamp(2rem, 3.5vw, 3.2rem);
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 0.95;
    text-wrap: wrap;
}

.kb-quick-grid,
.kb-articles-grid {
    display: grid;
    margin-inline: calc(-1 * var(--frame-gutter));
    border-top: var(--kb-rule);
}

.kb-quick-grid a {
    min-height: 5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.2rem var(--frame-gutter);
    border-bottom: var(--kb-rule);
    font-size: clamp(1rem, 1.5vw, 1.15rem);
    font-weight: 700;
    text-decoration: none;
}

.kb-quick-grid a::after {
    flex: 0 0 auto;
    content: '→';
}

.kb-article-card {
    min-width: 0;
    padding: clamp(1.35rem, 3vw, 2.25rem) var(--frame-gutter);
    border-bottom: var(--kb-rule);
}

.kb-article-card h3 {
    margin: 0;
    font-size: clamp(1.15rem, 1.8vw, 1.45rem);
    line-height: 1.12;
    text-wrap: pretty;
}

.kb-article-card h3 a {
    text-decoration: none;
}

.kb-article-card p {
    max-width: none;
    margin: 0.85rem 0 0;
    color: color-mix(in oklch, var(--frame-ink) 72%, transparent);
    line-height: 1.45;
    text-wrap: pretty;
}

.kb-article-page {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    padding: clamp(2rem, 4vw, 4rem) var(--frame-gutter) 0;
}

.kb-article-page > *,
.kb-article-content,
.kb-article-content section {
    min-width: 0;
}

.kb-breadcrumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.75rem;
    font-size: 0.78rem;
    font-weight: 650;
    text-transform: uppercase;
}

.kb-breadcrumbs a {
    text-underline-offset: 0.2rem;
}

.kb-article-header {
    padding: clamp(2rem, 4vw, 3.75rem) 0 clamp(2.5rem, 5vw, 4.5rem);
}

.kb-article-title {
    max-width: none;
    margin: 0;
    font-size: clamp(2.6rem, 5.6vw, 5rem);
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 1.04;
    overflow-wrap: break-word;
    text-wrap: pretty;
}

.kb-header {
    padding: clamp(2rem, 4vw, 3.75rem) 0 clamp(2.5rem, 5vw, 4.5rem);
}

.kb-header h1 {
    max-width: none;
    margin: 0;
    font-size: clamp(2.6rem, 5.6vw, 5rem);
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 1.04;
    overflow-wrap: break-word;
    text-wrap: pretty;
}

.kb-header p {
    margin: 2rem 0 0;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
}

.kb-article-info {
    margin-top: 2rem;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
}

.kb-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
}

.kb-article-cover {
    grid-column: 1 / -1;
    display: block;
    width: 100%;
    height: auto;
    border: var(--kb-rule);
}

.kb-article-content > :not(h2) + h2 {
    margin-top: clamp(2.5rem, 4vw, 3.5rem);
}

.kb-shell-article > .kb-article-page > .kb-hero {
    display: none;
}

.kb-toc,
.kb-takeaways {
    min-width: 0;
    margin-inline: calc(-1 * var(--frame-gutter));
    padding: clamp(1.5rem, 4vw, 3rem) var(--frame-gutter);
    border-top: var(--kb-rule);
}

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

.kb-takeaways {
    border-top: 0;
    border-bottom: var(--kb-rule);
    background: color-mix(in oklch, var(--frame-violet) 10%, var(--frame-canvas));
    border: 1px solid var(--frame-ink);
}

.kb-toc h2,
.kb-takeaways h2 {
    margin: 0 0 1.25rem;
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    letter-spacing: -0.03em;
    line-height: 1;
}

.kb-toc ol,
.kb-takeaways ul {
    margin: 0;
    padding-left: 1.25rem;
}

.kb-toc li + li,
.kb-takeaways li + li {
    margin-top: 0.65rem;
}

.kb-toc a {
    text-underline-offset: 0.2rem;
}

.kb-article-content {
    width: 100%;
    padding-block: clamp(2.5rem, 5vw, 5rem);
}

.kb-article-content section + section {
    margin-top: clamp(2.5rem, 4vw, 3.5rem);
    padding-top: clamp(2.5rem, 4vw, 3.5rem);
    border-top: var(--kb-rule);
}

.kb-article-content h2,
.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) h2 {
    max-width: none;
    margin: 0 0 1.5rem;
    font-size: clamp(1.85rem, 3.5vw, 3.5rem);
    font-weight: 720;
    letter-spacing: -0.04em;
    line-height: 1;
    text-wrap: pretty;
}

.kb-article-content h3,
.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) h3 {
    max-width: none;
    margin: 2.25rem 0 0.85rem;
    font-size: clamp(1.25rem, 1.8vw, 1.75rem);
    letter-spacing: -0.025em;
    line-height: 1.08;
}

.kb-article-content p,
.kb-article-content li,
.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) p,
.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) li {
    max-width: none;
    font-size: clamp(1.05rem, 1.45vw, 1.18rem);
    line-height: 1.7;
    text-wrap: pretty;
}

.kb-article-content p,
.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) p {
    margin: 0 0 1.25rem;
}

.kb-article-content img,
.kb-article-content video,
.kb-article-content iframe {
    max-width: 100%;
}

.kb-article-content iframe {
    width: 100%;
    border: var(--kb-rule);
}

.kb-article-page table {
    width: 100%;
    margin: 2rem 0;
    border: var(--kb-rule);
    border-collapse: collapse;
}

.kb-article-page th,
.kb-article-page td {
    padding: clamp(0.75rem, 2vw, 1rem);
    border: var(--kb-rule);
    text-align: left;
    vertical-align: top;
}

.kb-article-page th {
    background: var(--frame-ink);
    color: var(--frame-canvas);
}

.kb-article-page table tbody tr:last-child > td {
    border-bottom: var(--kb-rule);
}

.kb-article-page :is(.kb-table-scroll, .is-89a1df4b, .is-b8a49228) {
    width: 100%;
    margin: 2rem 0;
    overflow-x: auto;
}

.kb-article-page :is(.kb-table-scroll, .is-89a1df4b, .is-b8a49228) > table {
    min-width: 42rem;
    margin: 0;
}

.kb-highlight,
.kb-note,
.kb-checklist,
.kb-article-content blockquote {
    margin: 2rem 0;
    padding: clamp(1.25rem, 3vw, 2rem);
    border: var(--kb-rule);
    border-radius: 0;
    background: color-mix(in oklch, var(--frame-violet) 10%, var(--frame-canvas));
    box-shadow: none;
}

.kb-checklist-item {
    padding-block: 0.75rem;
    border-bottom: var(--kb-rule);
}

.kb-checklist-item:last-child {
    border-bottom: 0;
}

.kb-article-content [class^="is-"],
.kb-article-content [class*=" is-"] {
    border-radius: 0 !important;
    border-color: var(--frame-ink) !important;
    background-image: none !important;
    box-shadow: none !important;
}

.is-12b3c4c6 {
    grid-template-columns: minmax(0, 1fr) !important;
}

.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) {
    min-width: 0;
    padding-block: clamp(2.5rem, 5vw, 4rem);
}

.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) + section:not(.kb-author-bio):not(.kb-newsletter) {
    border-top: var(--kb-rule);
}

.kb-article-content ol,
.kb-article-content ul,
.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) ol,
.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) ul {
    max-width: none;
    margin: 0 0 1.5rem;
    padding-left: clamp(1.3rem, 3vw, 2rem);
}

.kb-article-content li + li,
.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) li + li {
    margin-top: 0.5rem;
}

.kb-feature-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    margin-top: clamp(1.75rem, 3vw, 2.5rem);
    border-top: var(--kb-rule);
    border-left: var(--kb-rule);
}

.kb-feature-group {
    min-width: 0;
    padding: clamp(1.5rem, 3vw, 2.25rem);
    border-right: var(--kb-rule);
    border-bottom: var(--kb-rule);
}

.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) .kb-feature-group h3 {
    margin: 0 0 1rem;
}

.kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter) .kb-feature-group ul {
    margin-bottom: 0;
}

.is-b6febaf9 {
    display: grid;
    margin: 2rem 0;
    border-top: var(--kb-rule);
}

.is-2edb8af6,
.is-7f7a322c,
.is-e9a326cd,
.is-af10086c,
.is-87a771b6 {
    min-width: 0;
    padding: 1.25rem;
    border-bottom: var(--kb-rule);
}

.is-7f7a322c { background: color-mix(in oklch, var(--frame-success) 14%, var(--frame-canvas)); }
.is-e9a326cd { background: color-mix(in oklch, var(--frame-violet) 18%, var(--frame-canvas)); }
.is-af10086c,
.is-87a771b6 { background: color-mix(in oklch, var(--frame-error) 10%, var(--frame-canvas)); }

.is-9121f123,
.is-b5616bbe,
.is-1c244e6b {
    margin: 0 !important;
}

.is-5ebbddce,
.is-dcdc7ec8 {
    margin-bottom: 0.75rem;
    font-weight: 750;
}

.is-448f7b5c {
    margin: 0 !important;
}

.is-b8a49228 {
    width: 100%;
    margin: 2rem 0;
    overflow-x: auto;
    border: 0;
}

.is-6f9c320a {
    width: 100%;
    min-width: 42rem;
    border-collapse: collapse;
    font-size: 0.95rem;
}

.is-8c3b2540,
.is-3ad8ca79 {
    padding: 1rem;
    border-right: var(--kb-rule);
    border-bottom: var(--kb-rule);
    text-align: left;
}

.is-8c3b2540:last-child,
.is-3ad8ca79:last-child {
    border-right: 0;
}

.is-8c3b2540 {
    background: var(--frame-ink) !important;
    color: var(--frame-canvas) !important;
}

.is-b401d610 {
    background: color-mix(in oklch, var(--frame-ink) 5%, var(--frame-canvas));
}

.is-c687f5d5,
.is-5867218c {
    margin: 2rem 0;
    padding: clamp(1.25rem, 3vw, 2rem);
    border: var(--kb-rule);
}

.is-c687f5d5 {
    background: var(--frame-violet);
}

.is-5867218c {
    overflow-x: auto;
    background: var(--frame-ink);
    color: var(--frame-canvas);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.92rem;
}

.kb-author-bio {
    display: grid;
    margin-inline: calc(-1 * var(--frame-gutter));
    border-top: var(--kb-rule);
}

.kb-author-photo {
    display: block;
    width: 100%;
    aspect-ratio: 2 / 1;
    object-fit: cover;
    object-position: 50% 20%;
    border-bottom: var(--kb-rule);
}

.kb-author-info {
    align-self: center;
    padding: clamp(1.5rem, 4vw, 2.5rem) var(--frame-gutter);
}

.kb-author-info h4 {
    margin: 0 0 0.65rem;
    font-size: clamp(1.4rem, 2.2vw, 1.85rem);
}

.kb-author-info p {
    max-width: none;
    margin: 0;
    line-height: 1.6;
    text-wrap: pretty;
}

.kb-newsletter {
    margin-inline: calc(-1 * var(--frame-gutter));
    border-top: var(--kb-rule);
}

.kb-newsletter-card {
    padding: clamp(2rem, 6vw, 5rem) var(--frame-gutter);
    background: color-mix(in oklch, var(--frame-violet) 10%, var(--frame-canvas));
    border-top: 1px solid var(--frame-ink);
}

.kb-newsletter-body {
    max-width: none;
}

.kb-nl-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    font-weight: 750;
    letter-spacing: 0.05em;
}

.kb-nl-badge svg {
    width: 1rem;
    height: 1rem;
}

.kb-newsletter h2 {
    max-width: none;
    margin: 1.25rem 0;
    font-size: clamp(2rem, 3.5vw, 3.2rem);
    font-weight: 600;
    letter-spacing: -0.035em;
    line-height: 1.08;
    text-wrap: pretty;
}

.kb-nl-desc,
.kb-nl-subdesc {
    max-width: none;
    margin: 0.5rem 0;
    font-size: clamp(1rem, 1.6vw, 1.2rem);
}

.kb-nl-highlight {
    font-weight: 750;
}

.kb-nl-cta {
    min-height: 3.25rem;
    display: inline-flex;
    align-items: center;
    margin-top: 1.5rem;
    padding: 0.85rem 1rem;
    border: var(--kb-rule);
    background: var(--frame-ink);
    color: var(--frame-canvas) !important;
    font-weight: 750;
    text-decoration: none;
}

.kb-newsletter-mascot {
    display: none;
}

@media (hover: hover) {
    .kb-topic-nav a:hover,
    .kb-quick-grid a:hover,
    .kb-article-card:hover {
        background: var(--frame-violet);
    }
}

@media (min-width: 48rem) {
    .kb-intro-grid,
    .kb-topic-nav,
    .kb-quick-grid,
    .kb-articles-grid,
    .kb-toc,
    .kb-takeaways,
    .kb-author-bio,
    .kb-newsletter {
        margin-inline: 0;
    }

    .kb-intro-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-inline: var(--kb-rule);
    }

    .kb-intro-panel + .kb-intro-panel {
        border-top: 0;
        border-left: var(--kb-rule);
    }

    .kb-topic-nav {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        border-left: var(--kb-rule);
    }

    .kb-topic-nav a {
        border-right: var(--kb-rule);
    }

    .kb-quick-grid,
    .kb-articles-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-left: var(--kb-rule);
    }

    .kb-quick-grid a,
    .kb-article-card {
        border-right: var(--kb-rule);
    }

    .kb-toc,
    .kb-takeaways {
        border-inline: var(--kb-rule);
    }

    .kb-toc:not(:has(+ .kb-takeaways)) :is(ol, ul) {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: clamp(2rem, 5vw, 5rem);
        row-gap: 0.65rem;
    }

    .kb-toc:not(:has(+ .kb-takeaways)) li + li {
        margin-top: 0;
    }

    .kb-author-bio {
        grid-template-columns: clamp(12rem, 25vw, 15rem) minmax(0, 1fr);
        align-items: stretch;
        border-inline: 0;
    }

    .kb-author-photo {
        height: 100%;
        min-height: 13.5rem;
        aspect-ratio: auto;
        border-right: var(--kb-rule);
        border-bottom: 0;
    }

    .kb-author-info {
        padding-inline: clamp(2rem, 4vw, 4rem);
    }

    .kb-newsletter {
        border-inline: var(--kb-rule);
    }

    .is-b6febaf9 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-left: var(--kb-rule);
    }

    .kb-feature-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .is-12b3c4c6 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    #co-delegowac .is-b6febaf9 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .is-2edb8af6,
    .is-7f7a322c,
    .is-e9a326cd,
    .is-af10086c,
    .is-87a771b6 {
        border-right: var(--kb-rule);
    }
}

@media (min-width: 68rem) {
    .kb-articles-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .kb-article-page {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        column-gap: clamp(1.5rem, 3vw, 3rem);
    }

    .kb-breadcrumbs,
    .kb-article-header,
    .kb-header,
    .kb-article-content,
    .kb-article-page > section:not(.kb-author-bio):not(.kb-newsletter),
    .kb-author-bio,
    .kb-newsletter {
        grid-column: 1 / -1;
    }

    .kb-toc {
        grid-column: 1 / -1;
    }

    .kb-toc:has(+ .kb-takeaways) {
        grid-column: 1 / 7;
    }

    .kb-takeaways {
        grid-column: 7 / -1;
        border-top: var(--kb-rule);
        border-left: 0;
    }

    nav.kb-toc,
    nav.kb-toc ~ .kb-takeaways {
        grid-column: 1 / -1;
    }

    nav.kb-toc ~ .kb-takeaways {
        border-left: var(--kb-rule);
    }

    .kb-article-page:has(.kb-article-content) .kb-toc:not(:has(+ .kb-takeaways)),
    .kb-article-content {
        padding-inline: var(--kb-reading-inset);
    }
}

@media (min-width: 80rem) {
    .kb-topic-nav {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}

/* Czytaj dalej: linki do wpisów z tego samego klastra (plan SEO 14.09.2026). */
.kb-related {
    border-top: var(--kb-rule);
    padding-block: clamp(1.5rem, 3vw, 2.5rem);
    padding-inline: var(--kb-reading-inset);
}

.kb-related h2 {
    margin: 0 0 0.75rem;
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.kb-related ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.kb-related li {
    padding: 0.35rem 0 0.35rem 0; /* WHY: .kb-article-page li dziedziczy wcięcie listy, tu lista bez wypunktowania */
    text-wrap: pretty;
}

.kb-article-date {
    display: block;
    margin-top: 0.25rem;
}