/* ==========================================================================
   NEWSLETTER (AskTribe Insights) — long-form edition layout
   Brand palette is defined locally on .nl-page; fonts come from style.css.
   ========================================================================== */

.nl-page {
    /* Brand palette */
    --nl-main: #132956;
    --nl-surface: #F9FAFB;
    --nl-accent: #194FD6;
    --nl-ink: #0D1425;
    --nl-rule: #d8dee8;
    /* Chart pair: accent vs neutral slate (validated for CVD separation) */
    --nl-in: var(--nl-accent);
    --nl-out: #7b8794;
    background: var(--bg);
}

/* style.css sets overflow-x: hidden on html/body, which turns them into scroll
   containers and breaks position: sticky. `clip` hides overflow the same way
   without creating a scroll container. */
html:has(body.nl-page),
body.nl-page {
    overflow-x: clip;
    overflow-y: visible;
}

/* Reading progress */
.nl-progress {
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 100%;
    height: 3px;
    pointer-events: none;
}

.nl-progress span {
    display: block;
    height: 100%;
    width: 0;
    background: var(--nl-accent);
}

/* ── Hero ─────────────────────────────────────────────────────────── */
.nl-hero {
    position: relative;
    background:
        linear-gradient(100deg, rgba(13, 20, 37, 0.96) 0%, rgba(19, 41, 86, 0.9) 55%, rgba(19, 41, 86, 0.7) 100%),
        url('Images/building.jpg') center / cover no-repeat;
    color: #fff;
    padding: 13rem 5% 5.5rem;
}

.nl-hero::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 4px;
    background: var(--nl-accent);
}

.nl-hero-inner {
    max-width: 1200px;
    margin: 0 auto;
}

.nl-eyebrow {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.2rem;
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 1.8rem;
}

.nl-eyebrow a {
    color: #fff;
    text-decoration: none;
}

.nl-eyebrow span::before {
    content: '/';
    margin-right: 1.2rem;
    color: rgba(255, 255, 255, 0.35);
}

.nl-hero-title {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: clamp(2.2rem, 4.6vw, 4rem);
    line-height: 1.08;
    letter-spacing: -0.015em;
    color: #fff;
    max-width: 15em;
    text-wrap: balance;
    margin-bottom: 1.8rem;
}

.nl-hero-dek {
    font-size: clamp(1.05rem, 1.5vw, 1.3rem);
    font-weight: 300;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.85);
    max-width: 720px;
    margin-bottom: 2.2rem;
}

.nl-byline {
    font-size: 0.88rem;
    color: rgba(255, 255, 255, 0.65);
}

.nl-byline span {
    margin: 0 0.6rem;
}

/* ── Layout with sticky chapter nav ───────────────────────────────── */
.nl-layout {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 5% 6rem;          /* room between the sticky sidebar / last section and the footer */
    display: grid;
    grid-template-columns: 210px minmax(0, 760px);
    gap: 5rem;
}

.nl-toc {
    position: sticky;
    top: 150px;
    align-self: start;
    padding-top: 4.5rem;
}

.nl-toc-label {
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 1rem;
}

.nl-toc ol {
    list-style: none;
    border-left: 1px solid var(--nl-rule);
}

.nl-toc li a {
    display: block;
    padding: 0.5rem 0 0.5rem 1rem;
    margin-left: -1px;
    border-left: 2px solid transparent;
    color: var(--text-muted);
    text-decoration: none;
    font-size: 0.92rem;
    line-height: 1.35;
    transition: color 0.2s, border-color 0.2s;
}

.nl-toc li a:hover {
    color: var(--nl-main);
}

.nl-toc li a.active {
    color: var(--nl-main);
    font-weight: 500;
    border-left-color: var(--nl-accent);
}

.nl-toc-share {
    margin-top: 2.5rem;
}

.nl-toc-share a,
.nl-toc-share button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--nl-rule);
    background: #fff;
    color: var(--nl-main);
    font-size: 1rem;
    margin-right: 0.4rem;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}

.nl-toc-share a:hover,
.nl-toc-share button:hover {
    background: var(--nl-main);
    color: #fff;
}

.nl-toc-share button.copied {
    background: var(--nl-accent);
    color: #fff;
    border-color: var(--nl-accent);
}

.nl-main {
    padding: 4.5rem 0 5rem;
    min-width: 0;
}

.nl-section {
    margin-bottom: 5rem;
    scroll-margin-top: 140px;
}

/* ── Typography ───────────────────────────────────────────────────── */
.nl-kicker {
    font-family: var(--font-sans);
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--nl-main);
    padding-bottom: 0.9rem;
    border-bottom: 2px solid var(--nl-main);
    margin-bottom: 2rem;
}

.nl-chapter {
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--nl-accent);
    margin-bottom: 0.6rem;
}

.nl-h2 {
    font-weight: 400;
    font-size: clamp(2rem, 3.4vw, 2.7rem);
    line-height: 1.12;
    color: var(--nl-main);
    margin-bottom: 2.5rem;
}

.nl-h3 {
    font-weight: 700;
    font-size: 1.35rem;
    color: var(--text-main);
}

.nl-main p {
    font-size: 1.05rem;
    line-height: 1.75;
    color: #1e293b;
}

.nl-main p + p {
    margin-top: 1.1rem;
}

.nl-main a {
    color: var(--nl-main);
}

.nl-lede {
    font-family: var(--font-heading);
    font-size: 1.5rem !important;
    line-height: 1.5 !important;
    color: var(--nl-main) !important;
    margin-bottom: 1.5rem;
}

/* ── At a glance ──────────────────────────────────────────────────── */
.nl-stats {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1.5rem;
    margin-bottom: 2.5rem;
}

.nl-stat {
    border-top: 1px solid var(--nl-rule);
    padding-top: 1rem;
}

.nl-stat-num {
    display: block;
    font-family: var(--font-heading);
    font-size: 3.4rem;
    line-height: 1;
    color: var(--nl-main);
    margin-bottom: 0.6rem;
}

.nl-stat-label {
    display: block;
    font-size: 0.9rem;
    line-height: 1.4;
    color: var(--text-muted);
}

.nl-takeaways {
    list-style: none;
    background: var(--nl-surface);
    padding: 1.8rem 2rem;
    border-left: 4px solid var(--nl-accent);
}

.nl-takeaways li {
    position: relative;
    padding-left: 1.4rem;
    font-size: 1rem;
    line-height: 1.65;
    color: #1e293b;
}

.nl-takeaways li + li {
    margin-top: 0.9rem;
}

.nl-takeaways li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.62em;
    width: 7px;
    height: 7px;
    background: var(--nl-main);
}

.nl-takeaways strong {
    color: var(--nl-main);
}

/* ── Exhibit ──────────────────────────────────────────────────────── */
.nl-exhibit {
    position: relative;
    border-top: 2px solid var(--nl-main);
    padding-top: 1.4rem;
}

.nl-exhibit figcaption {
    margin-bottom: 1.6rem;
}

.nl-exhibit-num {
    display: block;
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--nl-accent);
    margin-bottom: 0.5rem;
}

.nl-exhibit-title {
    display: block;
    font-family: var(--font-heading);
    font-size: 1.55rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--text-main);
    margin-bottom: 0.4rem;
}

.nl-exhibit-sub {
    display: block;
    font-size: 0.92rem;
    color: var(--text-muted);
}

.nl-legend {
    display: flex;
    justify-content: center;
    gap: 1.8rem;
    font-size: 0.85rem;
    color: var(--text-muted);
    margin-bottom: 1rem;
}

.nl-legend span {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.nl-swatch {
    width: 12px;
    height: 12px;
    border-radius: 2px;
}

.nl-swatch-in { background: var(--nl-in); }
.nl-swatch-out { background: var(--nl-out); }

.nl-flow-row {
    display: grid;
    grid-template-columns: 1fr 150px 1fr;
    align-items: center;
    padding: 0.35rem 0;
    cursor: default;
    outline: none;
}

.nl-flow-row:hover,
.nl-flow-row:focus-visible {
    background: var(--nl-surface);
}

.nl-flow-side {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    height: 20px;
}

.nl-flow-out {
    justify-content: flex-end;
    border-right: 1px solid #94a3b8;
    padding-right: 0;
}

.nl-flow-in {
    border-left: 1px solid #94a3b8;
}

.nl-bar {
    display: block;
    height: 18px;
    max-width: calc(100% - 1.8rem);
}

/* Rounded data-end, square at the baseline */
.nl-bar-in {
    background: var(--nl-in);
    border-radius: 0 4px 4px 0;
}

.nl-bar-out {
    background: var(--nl-out);
    border-radius: 4px 0 0 4px;
}

.nl-flow-val {
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}

.nl-flow-firm {
    text-align: center;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-main);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
}

.nl-flow-net {
    font-size: 0.72rem;
    font-weight: 500;
    padding: 0.05rem 0.35rem;
    background: #eef1f5;
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}

.nl-flow-net.pos { color: var(--nl-main); }
.nl-flow-net.neg { color: #475569; }

.nl-tooltip {
    position: absolute;
    z-index: 20;
    min-width: 220px;
    max-width: 300px;
    background: var(--nl-ink);
    color: #fff;
    padding: 0.85rem 1rem;
    font-size: 0.82rem;
    line-height: 1.45;
    box-shadow: 0 10px 30px rgba(10, 23, 51, 0.25);
    pointer-events: none;
}

.nl-tooltip strong {
    display: block;
    font-family: var(--font-heading);
    font-size: 1rem;
    margin-bottom: 0.4rem;
}

.nl-tooltip .tt-label {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.45rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.nl-tooltip .tt-label i {
    width: 9px;
    height: 9px;
    border-radius: 2px;
}

.nl-tooltip ul {
    list-style: none;
}

.nl-table-toggle {
    margin-top: 1.4rem;
    font-size: 0.88rem;
}

.nl-table-toggle summary {
    cursor: pointer;
    color: var(--nl-main);
    font-weight: 500;
}

.nl-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 0.8rem;
    font-variant-numeric: tabular-nums;
}

.nl-table th,
.nl-table td {
    text-align: left;
    padding: 0.45rem 0.6rem;
    border-bottom: 1px solid var(--nl-rule);
}

.nl-table th {
    font-weight: 500;
    color: var(--text-muted);
    font-size: 0.8rem;
}

.nl-source {
    margin-top: 1.2rem;
    font-size: 0.8rem !important;
    line-height: 1.55 !important;
    color: var(--text-muted) !important;
}

/* ── Groups & people ──────────────────────────────────────────────── */
.nl-group {
    margin-bottom: 3.5rem;
}

.nl-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2px solid var(--nl-main);
    padding-bottom: 0.8rem;
    margin-bottom: 1rem;
}

.nl-count {
    min-width: 32px;
    height: 32px;
    padding: 0 0.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--nl-main);
    color: #fff;
    font-family: var(--font-heading);
    font-size: 1.05rem;
}

.nl-group-intro {
    font-size: 1rem !important;
    color: var(--text-muted) !important;
    margin-bottom: 0.4rem;
}

.nl-people {
    list-style: none;
}

.nl-person {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 1.2rem;
    align-items: start;
    padding: 1.4rem 0;
    border-bottom: 1px solid var(--nl-rule);
}

.nl-person-name {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 0.2rem;
}

.nl-person-name a {
    color: var(--text-main) !important;
    text-decoration: none;
}

.nl-person-name a:hover {
    color: var(--nl-main) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.nl-person-name i {
    font-size: 0.85rem;
    color: #94a3b8;
    margin-left: 0.5rem;
    vertical-align: 2px;
}

.nl-main .nl-person-role {
    font-size: 0.95rem;
    line-height: 1.5;
    color: #334155;
    margin: 0 0 0.5rem;
}

.nl-main .nl-route {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.88rem;
    line-height: 1.4;
    margin: 0;
}

.nl-from {
    color: var(--text-muted);
}

.nl-arrow {
    color: var(--nl-accent);
    font-weight: 700;
}

.nl-to {
    color: var(--nl-main);
    font-weight: 500;
}

.nl-main .nl-person-note {
    font-size: 0.88rem;
    color: var(--text-muted);
    margin-top: 0.4rem;
}

.nl-date {
    font-size: 0.78rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-muted);
    white-space: nowrap;
    padding-top: 0.3rem;
}

/* Compact list (AP promotions) */





.nl-main .nl-note {
    font-size: 0.9rem;
    color: var(--text-muted);
    margin-top: 1rem;
}

/* Sidebar */
.nl-sidebar {
    background: var(--nl-main);
    color: #fff;
    padding: 2.2rem 2.4rem;
    margin-bottom: 3.5rem;
    position: relative;
}

.nl-sidebar-label {
    font-size: 0.72rem !important;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #9db6f5 !important;
    margin-bottom: 0.6rem;
}

.nl-sidebar-title {
    font-weight: 400;
    font-size: 1.7rem;
    line-height: 1.2;
    color: #fff;
    margin-bottom: 1rem;
}

.nl-sidebar p {
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 1rem !important;
}

.nl-sidebar-list {
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 2rem;
    margin-top: 1.6rem;
}

.nl-sidebar-list li {
    padding: 0.85rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
}

.nl-sidebar-list a {
    display: block;
    color: #fff !important;
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 1.05rem;
    text-decoration: none;
}

.nl-sidebar-list a:hover {
    text-decoration: underline;
}

.nl-sidebar-list span {
    display: block;
    font-size: 0.85rem;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.7);
    margin-top: 0.15rem;
}

/* ── Insights ─────────────────────────────────────────────────────── */
.nl-insights {
    list-style: none;
    counter-reset: insight;
}

.nl-insights li {
    counter-increment: insight;
    display: grid;
    grid-template-columns: 64px 1fr;
    column-gap: 1.2rem;
    padding: 1.8rem 0;
    border-top: 1px solid var(--nl-rule);
}

.nl-insights li::before {
    content: counter(insight, decimal-leading-zero);
    grid-row: span 2;
    font-family: var(--font-heading);
    font-size: 2.4rem;
    line-height: 1;
    color: var(--nl-accent);
}

.nl-insights h3 {
    font-size: 1.35rem;
    line-height: 1.3;
    color: var(--nl-main);
    margin-bottom: 0.6rem;
}

.nl-insights p {
    margin: 0;
}

/* ── CTA ──────────────────────────────────────────────────────────── */
.nl-cta {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2rem;
    align-items: center;
    background: var(--nl-surface);
    border: 1px solid var(--nl-rule);
    border-top: 4px solid var(--nl-accent);
    padding: 2.4rem;
}

.nl-cta h2 {
    font-weight: 400;
    font-size: 1.9rem;
    color: var(--nl-main);
    margin-bottom: 0.5rem;
}

.nl-cta p {
    font-size: 1rem !important;
    margin: 0;
}

.nl-cta-actions {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.nl-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.85rem 1.5rem;
    font-size: 0.92rem;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.2s, color 0.2s;
}

.nl-btn-primary {
    background: var(--nl-main);
    color: #fff !important;
}

.nl-btn-primary:hover {
    background: var(--primary-light);
}

.nl-btn-ghost {
    border: 1px solid var(--nl-main);
    color: var(--nl-main) !important;
}

.nl-btn-ghost:hover {
    background: var(--nl-main);
    color: #fff !important;
}

.nl-method p {
    font-size: 0.92rem !important;
    color: var(--text-muted) !important;
}

/* ── Archive page ─────────────────────────────────────────────────── */
.nl-archive {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4.5rem 5% 6rem;
}

.nl-feature {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    border: 1px solid var(--nl-rule);
    text-decoration: none;
    color: inherit;
    margin-bottom: 4rem;
    transition: box-shadow 0.25s;
}

.nl-feature:hover {
    box-shadow: 0 18px 40px rgba(19, 41, 86, 0.12);
}

.nl-feature-visual {
    background: var(--nl-main);
    color: #fff;
    padding: 2.6rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 320px;
    position: relative;
}

.nl-feature-visual::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    width: 100%;
    background: var(--nl-accent);
}

.nl-feature-issue {
    font-family: var(--font-heading);
    font-size: 6rem;
    line-height: 1;
    color: rgba(255, 255, 255, 0.95);
}

.nl-feature-stats {
    display: flex;
    gap: 2rem;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.72);
}

.nl-feature-stats b {
    display: block;
    font-family: var(--font-heading);
    font-size: 1.9rem;
    font-weight: 400;
    color: #fff;
}

.nl-feature-body {
    padding: 2.6rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nl-feature-body h2 {
    font-weight: 400;
    font-size: 2rem;
    line-height: 1.15;
    color: var(--nl-main);
    margin: 0.4rem 0 1rem;
}

.nl-feature-body p {
    color: #334155;
    line-height: 1.65;
    margin-bottom: 1.4rem;
}

.nl-readmore {
    color: var(--nl-main);
    font-weight: 500;
    font-size: 0.92rem;
}

.nl-about {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
    border-top: 2px solid var(--nl-main);
    padding-top: 2rem;
}

.nl-about h3 {
    font-size: 1.2rem;
    color: var(--nl-main);
    margin-bottom: 0.6rem;
}

.nl-about p {
    color: var(--text-muted);
    line-height: 1.65;
    font-size: 0.95rem;
}

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .nl-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
        max-width: 800px;
    }

    .nl-toc {
        display: none;
    }

    .nl-stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .nl-stats .nl-stat-total {
        grid-column: 1 / -1;
    }

    .nl-feature {
        grid-template-columns: 1fr;
    }

    .nl-about {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .nl-hero {
        padding: 10rem 16px 3.5rem;
    }

    .nl-layout,
    .nl-archive {
        padding-left: 16px;
        padding-right: 16px;
    }

    .nl-main {
        padding-top: 3rem;
    }

    .nl-stat-num {
        font-size: 2.6rem;
    }

    .nl-takeaways {
        padding: 1.4rem 1.2rem;
    }

    .nl-flow-row {
        grid-template-columns: 1fr 96px 1fr;
    }

    .nl-flow-firm {
        font-size: 0.8rem;
        flex-direction: column;
        gap: 0.1rem;
    }

    .nl-person {
        grid-template-columns: 1fr;
        gap: 0.4rem;
    }

    .nl-person .nl-date {
        grid-column: 1;
        padding-top: 0;
    }



    .nl-sidebar {
        padding: 1.8rem 1.3rem;
    }

    .nl-sidebar-list {
        grid-template-columns: 1fr;
    }

    .nl-insights li {
        grid-template-columns: 44px 1fr;
    }

    .nl-insights li::before {
        font-size: 1.8rem;
    }

    .nl-cta {
        grid-template-columns: 1fr;
        padding: 1.8rem 1.3rem;
    }

    .nl-feature-visual,
    .nl-feature-body {
        padding: 1.8rem 1.3rem;
    }

    .nl-feature-issue {
        font-size: 4.2rem;
    }
}

.nl-btn-light {
    background: #fff;
    color: var(--nl-main) !important;
}

.nl-btn-light:hover {
    background: var(--nl-surface);
}

/* Language switch is a link to the other language version on these pages */
.nl-page a.lang-btn {
    text-decoration: none;
}

/* Archive list (landing page) */
.nl-archive-list {
    list-style: none;
    margin-bottom: 4rem;
}

.nl-archive-list a {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 1.1rem 0;
    border-bottom: 1px solid var(--nl-rule);
    font-family: var(--font-heading);
    font-size: 1.3rem;
    color: var(--nl-main);
    text-decoration: none;
}

.nl-archive-list a:hover {
    color: var(--nl-accent);
}

.nl-coming-soon {
    font-family: var(--font-heading);
    font-size: 1.6rem;
    color: var(--nl-main);
    padding: 1rem 0 4rem;
}

/* ── Sign-up & downloads ──────────────────────────────────────────── */
.nl-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1rem;
    margin-top: 2rem;
}

.nl-hero-actions .nl-btn {
    cursor: pointer;
    border: 0;
    font-family: var(--font-sans);
}

.nl-hero-join {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: none;
    border: 0;
    padding: 0.5rem 0.25rem;
    color: #fff !important;
    font: 500 0.92rem var(--font-sans);
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-color: rgba(255, 255, 255, 0.45);
    cursor: pointer;
}

.nl-hero-join:hover {
    text-decoration-color: #fff;
}

button.nl-btn {
    cursor: pointer;
    font-family: var(--font-sans);
    border: 0;
}

button.nl-btn-ghost {
    border: 1px solid var(--nl-main);
    background: #fff;
}

.nl-band {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    margin-top: 1.5rem;
    padding: 1.4rem 1.6rem;
    border: 1px solid var(--nl-rule);
    border-left: 4px solid var(--nl-main);
    background: #fff;
}

.nl-main .nl-band p {
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0;
}

.nl-main .nl-band .nl-band-h {
    font-family: var(--font-heading);
    font-size: 1.2rem;
    color: var(--nl-main);
    margin-bottom: 0.2rem;
}

.nl-toc-nl {
    margin-top: 2.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--nl-rule);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.6rem;
}

.nl-toc-nl .nl-btn {
    width: 100%;
    font-size: 0.85rem;
    padding: 0.7rem 1rem;
}

.nl-toc-dl {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: none;
    border: 0;
    padding: 0.2rem 0;
    font: 0.88rem var(--font-sans);
    color: var(--nl-main);
    cursor: pointer;
}

.nl-toc-dl:hover {
    color: var(--nl-accent);
}

.nl-subscribe {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 2.5rem;
    padding: 2.4rem;
    background: var(--nl-main);
    color: #fff;
}

.nl-subscribe h2 {
    font-weight: 400;
    font-size: 1.9rem;
    color: #fff;
    margin-bottom: 0.75rem;
}

.nl-main .nl-subscribe p,
.nl-subscribe .nl-chapter {
    color: rgba(255, 255, 255, 0.82);
    font-size: 1rem;
}

.nl-subscribe .nl-chapter {
    color: #9db6f5;
    font-size: 0.78rem;
}

.nl-subscribe-dl {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 1.5rem;
}

.nl-subscribe-dl .nl-btn-ghost {
    background: transparent;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.5);
}

.nl-subscribe-dl .nl-btn-ghost:hover {
    background: #fff;
    color: var(--nl-main) !important;
}

/* Form (modal + section) */
.nl-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.9rem 1rem;
}

.nl-field {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    font-size: 0.82rem;
    font-weight: 500;
}


.nl-field input {
    width: 100%;
    padding: 0.7rem 0.8rem;
    border: 1px solid var(--nl-rule);
    background: #fff;
    color: var(--nl-ink);
    font: 0.95rem var(--font-sans);
    border-radius: 0;
}

.nl-field input:focus {
    outline: 2px solid var(--nl-accent);
    outline-offset: -1px;
    border-color: var(--nl-accent);
}

.nl-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.nl-consent {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    margin-top: 1rem;
    font-size: 0.78rem;
    line-height: 1.5;
}

.nl-consent span {
    font-weight: 400;
}

.nl-consent input {
    margin-top: 0.2rem;
    flex: none;
    width: 16px;
    height: 16px;
    accent-color: var(--nl-accent);
}

.nl-consent a {
    color: inherit !important;
    text-decoration: underline;
}

.nl-form-msg {
    min-height: 1.2rem;
    margin: 0.8rem 0 !important;
    font-size: 0.88rem !important;
    line-height: 1.45 !important;
}

.nl-form-msg.is-error { color: #b42318 !important; }
.nl-form-msg.is-ok { color: #1f7a4d !important; }
.nl-form-msg.is-info { color: var(--nl-accent) !important; }
.nl-form-msg a { color: inherit !important; font-weight: 500; }

.nl-form-submit {
    width: 100%;
}

.nl-form-submit:disabled {
    opacity: 0.6;
    cursor: progress;
}

.nl-subscribe .nl-field span,
.nl-subscribe .nl-consent {
    color: rgba(255, 255, 255, 0.88);
}

.nl-subscribe .nl-field input {
    border-color: transparent;
}

.nl-subscribe .nl-form-msg.is-error { color: #ffb4ab !important; }
.nl-subscribe .nl-form-msg.is-ok { color: #9be3bf !important; }
.nl-subscribe .nl-form-msg.is-info { color: #cfe0ff !important; }

.nl-subscribe .nl-form-submit {
    background: #fff;
    color: var(--nl-main) !important;
}

.nl-subscribe .nl-form-submit:hover {
    background: var(--nl-surface);
}

/* Modal */
.nl-modal {
    margin: auto;          /* style.css resets margins globally; dialogs centre via auto margins */
    width: min(560px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    border: 0;
    border-top: 4px solid var(--nl-accent);
    padding: 2rem 2rem 1.6rem;
    color: var(--nl-ink);
    box-shadow: 0 30px 80px rgba(13, 20, 37, 0.35);
}

.nl-modal::backdrop {
    background: rgba(13, 20, 37, 0.6);
}

.nl-modal h2 {
    font-weight: 400;
    font-size: 1.7rem;
    color: var(--nl-main);
    margin: 0.2rem 0 0.6rem;
}

.nl-modal-body {
    color: #334155;
    font-size: 0.95rem;
    line-height: 1.55;
    margin-bottom: 1.4rem;
}

.nl-modal-close {
    position: absolute;
    top: 0.8rem;
    right: 0.8rem;
    width: 36px;
    height: 36px;
    border: 0;
    background: none;
    color: var(--text-muted);
    font-size: 1.1rem;
    cursor: pointer;
}

.nl-modal-close:hover {
    color: var(--nl-main);
}

.nl-modal .nl-form-submit {
    background: var(--nl-main);
    color: #fff !important;
}

.nl-print-only {
    display: none;
}

@media (max-width: 1024px) {
    .nl-subscribe {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .nl-band {
        flex-direction: column;
        align-items: stretch;
        padding: 1.2rem;
    }

    .nl-subscribe {
        padding: 1.8rem 1.3rem;
    }

    .nl-form-grid {
        grid-template-columns: 1fr;
    }

    .nl-hero-actions .nl-btn {
        flex: 1 1 auto;
    }

    .nl-modal {
        padding: 1.6rem 1.2rem 1.2rem;
    }
}

/* ── Print (source of the PDF download) ───────────────────────────── */
@page {
    size: A4;
    margin: 14mm 13mm 16mm;
}

@media print {
    /* style.css hides #app when printing (Blind CV print); newsletter pages must print it */
    body.nl-page #app {
        display: block !important;
    }

    html,
    body.nl-page {
        overflow: visible !important;
        background: #fff;
    }

    .nl-page * {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    #navbar,
    .side-panel,
    .side-panel-overlay,
    #global-preloader,
    .nl-toc,
    .nl-progress,
    .nl-hero-actions,
    .nl-band,
    .nl-subscribe,
    .nl-cta,
    .nl-tooltip,
    .nl-table-toggle,
    .nl-modal,
    .site-footer {
        display: none !important;
    }

    .nl-print-only {
        display: block !important;
    }

    .nl-hero {
        padding: 12mm 10mm 10mm;
    }

    .nl-print-head {
        padding: 2mm 10mm 1mm;
        background: #fff;
    }

    .nl-print-logo {
        display: block;
        height: 26mm;
        margin-left: -3mm;
    }

    .nl-hero-title {
        font-size: 30pt;
        max-width: none;
    }

    .nl-layout {
        display: block;
        max-width: none;
        padding: 0;
    }

    .nl-main {
        padding: 8mm 0 0;
    }

    .nl-section {
        margin-bottom: 9mm;
    }

    .nl-person,
    .nl-insights li,
    .nl-exhibit,
    .nl-sidebar,
    .nl-stats,
    .nl-takeaways,
    .nl-flow-row {
        break-inside: avoid;
    }

    .nl-h2,
    .nl-group-head,
    .nl-chapter,
    .nl-kicker {
        break-after: avoid;
    }

    .nl-main a {
        color: inherit;
        text-decoration: none;
    }

    .nl-print-footer {
        margin-top: 6mm;
        padding-top: 4mm;
        border-top: 1px solid var(--nl-rule);
        font-size: 9pt !important;
        color: var(--text-muted) !important;
    }
}

/* ── Chart comment, key events, spotlight inside a promotions block ── */
.nl-main .nl-exhibit-note {
    font-size: 0.98rem;
    line-height: 1.6;
    color: var(--text-main);
    border-left: 3px solid var(--nl-accent);
    padding: 0.2rem 0 0.2rem 1.1rem;
    margin: 1.6rem 0 1rem;
}

.nl-events {
    display: grid;
    gap: 1.2rem;
}

.nl-event {
    border-top: 3px solid var(--nl-main);
    background: #fff;
    padding: 1.6rem 1.8rem 1.7rem;
    box-shadow: 0 1px 0 var(--nl-rule);
    break-inside: avoid;
}

.nl-main .nl-event-date {
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--nl-accent);
    margin-bottom: 0.5rem;
}

.nl-event h3 {
    font-family: var(--font-heading);
    font-size: 1.45rem;
    line-height: 1.25;
    color: var(--nl-main);
    margin-bottom: 0.7rem;
}

.nl-main .nl-event p {
    margin-bottom: 0.9rem;
}

.nl-event-src {
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--nl-accent) !important;
    text-decoration: none;
}

.nl-event-src:hover {
    text-decoration: underline;
}

.nl-event-src i {
    font-size: 0.72rem;
    margin-left: 0.25rem;
}

.nl-group .nl-sidebar {
    margin-bottom: 1.5rem;
}

@media (max-width: 600px) {
    .nl-event {
        padding: 1.3rem 1.2rem 1.4rem;
    }
}

/* Previous role on promotions ("wcześniej: Principal") */
.nl-main .nl-route .nl-prev {
    color: var(--text-muted);
}

.nl-main .nl-route .nl-prev::before {
    content: "·";
    margin-right: 0.5rem;
}

.nl-sidebar-list .nl-sidebar-prev {
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.8rem;
}

.nl-sidebar-list strong {
    display: block;
    color: #fff;
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 1.05rem;
}

.nl-main .nl-event-sources {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.4rem;
    margin-bottom: 0;
}

/* Total in "At a glance": the other four figures add up to it */
.nl-stat-total {
    border-top: 3px solid var(--nl-main);
}

.nl-stat-total .nl-stat-label {
    color: var(--nl-main);
    font-weight: 500;
}