/* ── global.css ─────────────────────────────────────────
   Shared primitives only: base reset, layout helpers, typography
   scale, buttons, lists, stat callout, eyebrow.
   Components live in nf/css/components/.
   ──────────────────────────────────────────────────────── */

/* ── Base ──────────────────────────────────────────────── */
.node--nf {
    font-family: Poppins, sans-serif;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: clip;
    width: 100vw;
    margin-left: calc(50% - 50vw);
}

.node--nf * {
    font-style: normal;
    --full-width-min-height: 0;
}

/* ── Section backgrounds ──────────────────────────────── */
.node--nf section[data-bg="black"]  { background-color: #0d0d0d; color: var(--white); }
.node--nf section[data-bg="white"]  { background-color: #ffffff; color: #1a1a1a; }
.node--nf section[data-bg="pale"]   { background-color: #f3f3f0; color: #1a1a1a; }
.node--nf section[data-bg="orange"] { background-color: #e65c00; color: #ffffff; }

/* ── Section padding ──────────────────────────────────── */
.node--nf section {
    padding-top: 9.6rem;
    padding-bottom: 9.6rem;
    padding-left: 0;
    padding-right: 0;
}

/* ── Layout wrap + grid helpers ───────────────────────── */
.nf--wrap {
    max-width: 1680px;
    margin: 0 auto;
    padding: 0 var(--grid-outer-margin, var(--spacing8));
    width: 100%;
}

.nf--section-body > * + * {
    margin-top: 4rem;
}

/* Text-heavy modules: narrow by default — caps the layout helpers at 10 of 12 columns and centres them for 2 and 3 col layouts */
.node--nf section:is(
    [data-nf-module-type="content-section"],
    [data-nf-module-type="tabbed-content"]
) > .nf--wrap > :is(.nf--cols-2, .nf--cols-3) {
    max-width: calc(var(--grid-column-width) * 10 + var(--grid-gap) * 9);
    margin-left: auto;
    margin-right: auto;
}

/* Text-heavy modules: narrow by default — caps the layout helpers at 8 of 12 columns and centres them for 1 col layouts */
.node--nf section:is([data-nf-module-type="content-section"]) > .nf--wrap > :is(.nf--section-body),
.node--nf [data-nf-module-type="bottom-cta"] > * {
    max-width: calc(var(--grid-column-width) * 8 + var(--grid-gap) * 7);
    margin-left: auto;
    margin-right: auto;
}

/* opt-out: restore full wrap width */
.node--nf .nf--section-body--full,
.node--nf .nf--cols-2--full,
.node--nf .nf--cols-3--full {
    max-width: none;
}

.nf--grid-row {
    gap: 4rem;
    display: flex;
    flex-wrap: wrap;
}

.nf--cols-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing8);
    align-items: start;
}

.nf--cols-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing4);
}

.nf--cols-2x2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing4);
}

/* 8 of 12 columns, centred — 2 cols indented on each side */
.nf--col-8 {
    max-width: calc(var(--grid-column-width) * 8 + var(--grid-gap) * 7);
    margin-left: auto;
    margin-right: auto;
}

/* ── Typography — body ────────────────────────────────── */
.node--nf p {
    font-size: clamp(1.5rem, 1.1vw, 1.7rem);
    font-weight: 400;
    line-height: 1.7;
    margin: 0 0 2rem;
}

.node--nf p:last-child { margin-bottom: 0; }
.node--nf p + p        { margin-top: 1.4em; }

/* ── Typography — lists ───────────────────────────────── */
.node--nf ul,
.node--nf ol {
    font-size: clamp(1.5rem, 1.1vw, 1.7rem);
    font-weight: 400;
    line-height: 1.8;
    margin: 0 0 2rem;
    padding-left: 2.2rem;
}

.node--nf ul { list-style-type: disc; }
.node--nf ol { list-style-type: decimal; }

.node--nf li {
    margin-bottom: 1em;
    padding-left: 0.4rem;
    line-height: 1.7;
}

.node--nf li:last-child       { margin-bottom: 0; }
.node--nf ul ul li,
.node--nf ol ol li             { margin-bottom: 0.5em; }

/* ── Typography — inline ──────────────────────────────── */
.node--nf strong { font-weight: 700; }

.node--nf li strong:first-child {
    display: block;
    font-size: 1.7rem;
    font-weight: 700;
    margin-bottom: 0.35em;
    letter-spacing: 0.01em;
}

.node--nf a {
    color: #ff7700;
    font-weight: 500;
    text-decoration: none;
    transition: opacity 200ms ease-out;
}

.node--nf a:hover {
    opacity: 0.7;
    text-decoration: underline;
}

.node--nf section[data-bg="black"] a  { color: #ff7700; }
.node--nf section[data-bg="orange"] a { color: #ffffff; text-decoration: underline; }

/* ── Heading scale ────────────────────────────────────── */
.node--nf .nf--heading--biggest {
    font-size: clamp(3.5rem, 5.2vw, 7rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -0.035em;
    margin: 0 0 2.4rem;
}

.node--nf .nf--heading--big {
    font-size: clamp(2.4rem, 2.8vw, 3.8rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.025em;
    margin: 0 0 2rem;
}

.node--nf .nf--heading--medium {
    font-size: clamp(1.8rem, 1.75vw, 2.4rem);
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.015em;
    margin: 0 0 1.2rem;
}

.node--nf .nf--heading--small {
    font-size: clamp(1.6rem, 1.25vw, 1.8rem);
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: -0.01em;
    margin: 0 0 0.8rem;
}

.node--nf .nf--heading--medium,
.node--nf h2 {
    margin-bottom: 2rem;
}

/* Sibling spacing after headings */
.node--nf p + .nf--heading--medium,
.node--nf ul + .nf--heading--medium,
.node--nf ol + .nf--heading--medium,
.node--nf p + .nf--heading--small,
.node--nf ul + .nf--heading--small,
.node--nf ol + .nf--heading--small {
    margin-top: 3.2rem;
}

.node--nf ul + p,
.node--nf ol + p {
    margin-top: 2rem;
}

/* ── Eyebrow ──────────────────────────────────────────── */
.nf--eyebrow {
    display: block;
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--orange);
    margin: 0 0 2rem;
}

/* ── Buttons ──────────────────────────────────────────── */
.nf--cta {
    display: inline-block;
    background-color: var(--orange);
    color: var(--white) !important;
    font-family: Poppins, sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    padding: 1rem 2rem;
    text-decoration: none !important;
    transition: background-color 200ms ease-out;
}

.nf--cta:hover {
    background-color: #bf4d00;
    opacity: 1 !important;
    text-decoration: none !important;
}

.nf--cta-ghost {
    display: inline-block;
    background: transparent;
    color: var(--white) !important;
    font-family: Poppins, sans-serif;
    font-size: 1.3rem;
    font-weight: 600;
    padding: 1rem 2rem;
    border: 1px solid rgba(255, 255, 255, 0.4);
    text-decoration: none !important;
    transition: background-color 200ms ease-out;
}

.nf--cta-ghost:hover {
    background: rgba(255, 255, 255, 0.1);
    text-decoration: none !important;
    opacity: 1 !important;
}

.nf--cta-ghost--onwhite {
    color: var(--black) !important;
    border-color: rgba(29, 29, 27, 0.4);
}

.nf--cta-ghost--onwhite:hover {
    background: rgba(0, 0, 0, 0.05);
}

/* ── Stat callout ─────────────────────────────────────── */
.nf--stats-row {
    display: flex;
    gap: var(--spacing6);
    margin-bottom: var(--spacing6);
    flex-wrap: wrap;
}

.nf--stat__num {
    font-family: Poppins, sans-serif;
    font-size: 5.6rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.03em;
    color: var(--orange);
    font-variant-numeric: tabular-nums;
    display: block;
}

.nf--stat__pct {
    font-size: 2.8rem;
}

.nf--stat__label {
    font-size: 1.4rem;
    color: var(--slate);
    line-height: 1.4;
    max-width: 22ch;
    display: block;
    margin-top: 0.6rem;
}

/* ── Check list ───────────────────────────────────────── */
.nf--check-list {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--spacing4);
}

.nf--check-list li {
    position: relative;
    padding-left: 2.4rem;
    margin-bottom: 1rem;
    font-size: 1.5rem;
    line-height: 1.5;
    color: var(--shark);
    font-weight: 500;
}

.nf--check-list li:last-child { margin-bottom: 0; }

.nf--check-list li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: var(--orange);
    font-weight: 700;
    font-size: 1.3rem;
    line-height: 1.5;
}

.nf--check-list--light li        { color: rgba(255, 255, 255, 1); }
.nf--check-list--dark-text li    { color: var(--slate); font-weight: 400; }

.node--nf section[data-bg="white"] .nf--check-list li {
    color: var(--slate);
    font-weight: 400;
}

/* ── Error list ───────────────────────────────────────── */
.nf--error-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.nf--error-list li {
    position: relative;
    padding-left: 2rem;
    margin-bottom: 1.4rem;
    font-size: 1.5rem;
    color: var(--slate);
    font-weight: 500;
    line-height: 1.5;
}

.node--nf section[data-bg="black"] .nf--error-list li {
    color: var(--white);
}

.nf--error-list li:last-child { margin-bottom: 0; }

.nf--error-list li::before {
    content: '–';
    position: absolute;
    left: 0;
    color: var(--red);
    font-weight: 600;
}

/* ── Plain list ───────────────────────────────────────── */
.nf--plain-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.nf--plain-list li {
    position: relative;
    padding-left: 2rem;
    margin-bottom: 1.2rem;
    font-size: 1.5rem;
    color: var(--black);
    line-height: 1.5;
    font-weight: 500;
}

.nf--plain-list li:last-child { margin-bottom: 0; }

.nf--plain-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.58em;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    background: var(--orange);
}

.node--nf section[data-bg="white"] .nf--plain-list li {
    color: var(--slate);
    font-weight: 400;
}

/* ── Specificity overrides (beat .node--nf ul/li at 0,1,1) */
.node--nf .nf--check-list,
.node--nf .nf--error-list,
.node--nf .nf--plain-list,
.node--nf .nf--accordion,
.node--nf .nf--faq,
.node--nf .nf--consequence-list {
    list-style: none !important;
    padding-left: 0;
}

.node--nf .nf--check-list li,
.node--nf .nf--plain-list li {
    padding-left: 2.4rem;
    margin-bottom: 1rem;
}

.node--nf .nf--error-list li {
    padding-left: 2rem;
    margin-bottom: 1.4rem;
}

.node--nf .nf--accordion-item,
.node--nf .nf--faq-item,
.node--nf .nf--consequence-item {
    margin-bottom: 0;
    padding-left: 0;
}

/* ── Responsive ───────────────────────────────────────── */
@media (max-width: 900px) {
    .node--nf section {
        padding-top: 4.8rem;
        padding-bottom: 4.8rem;
    }

    .nf--cols-2,
    .nf--cols-3,
    .nf--cols-2x2 {
        grid-template-columns: 1fr;
    }

    .nf--wrap {
        padding: 0 var(--spacing4);
    }

    .nf--col-8,
    .node--nf section:is(
        [data-nf-module-type="content-section"],
        [data-nf-module-type="tabbed-content"]
    ) > .nf--wrap > :is(.nf--section-body, .nf--cols-2, .nf--cols-3) {
        max-width: 100%;
    }

    .nf--stats-row {
        flex-direction: column;
        gap: var(--spacing5);
    }
}
