/* Shared NamedFirst sections used on every landing page and the pricing page.
   Each page sets its own colours and fonts through the --nf-* variables. */
:root {
  --nf-ink:#10233F; --nf-pri:#B43C0A; --nf-hi:#F5A524; --nf-muted:#3E4F64; --nf-line:#D5DCE4; --nf-bg:#EEF1F4;
  --nf-dark:#10233F; --nf-on-dark:#C9D3DF; --nf-head:'Barlow Condensed',sans-serif; --nf-head-w:800; --nf-r:10px; --nf-btn-r:8px;
  --nf-good:#1B5E3A; --nf-mid:#8A5A00; --nf-bad:#8A2E07;
}
.nf-sec { max-width:1160px; margin:0 auto; padding:72px 24px; display:flex; flex-direction:column; gap:28px; }
.nf-dark { background:var(--nf-dark); color:#fff; }
.nf-eyebrow { font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--nf-pri); }
.nf-dark .nf-eyebrow { color:var(--nf-hi); }
.nf-h2 { margin:0; font-family:var(--nf-head); font-weight:var(--nf-head-w); font-size:clamp(32px,4.5vw,46px); line-height:1.05; }
.nf-lead { margin:0; color:var(--nf-muted); max-width:44em; font-size:18px; }
.nf-dark .nf-lead { color:var(--nf-on-dark); }
.nf-fine { margin:0; font-size:13px; color:var(--nf-muted); }
.nf-dark .nf-fine { color:var(--nf-on-dark); }
.nf-card { background:#fff; color:var(--nf-ink); border:1px solid var(--nf-line); border-radius:var(--nf-r); padding:24px; display:flex; flex-direction:column; gap:14px; min-width:0; }
.nf-tag { font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; background:var(--nf-bg); color:var(--nf-ink); padding:4px 8px; border-radius:4px; white-space:nowrap; }
.nf-grid2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); gap:32px; align-items:start; }
.nf-btn { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:0 22px; border-radius:var(--nf-btn-r); font-weight:700; text-decoration:none; border:2px solid transparent; cursor:pointer; font:inherit; font-weight:700; }
.nf-btn-pri { background:var(--nf-hi); color:var(--nf-dark); }
.nf-btn-dark { background:var(--nf-dark); color:#fff; }
.nf-btn-line { background:#fff; color:var(--nf-ink); border-color:var(--nf-ink); }

/* Example report */
.nf-rep-top { display:flex; flex-wrap:wrap; gap:20px; align-items:center; }
.nf-rep-top .nf-big { font-family:var(--nf-head); font-weight:var(--nf-head-w); font-size:30px; line-height:1.1; }
.nf-bars { display:flex; flex-direction:column; gap:8px; }
.nf-bar { display:grid; grid-template-columns:minmax(0,150px) 1fr 36px; gap:10px; align-items:center; font-size:14px; }
.nf-bar .t { height:10px; background:var(--nf-bg); border-radius:999px; overflow:hidden; }
.nf-bar .f { height:100%; border-radius:999px; background:var(--nf-pri); }
.nf-bar .v { text-align:right; font-variant-numeric:tabular-nums; font-weight:600; }
.nf-table-wrap { overflow-x:auto; }
.nf-table { width:100%; border-collapse:collapse; font-size:14px; font-variant-numeric:tabular-nums; min-width:420px; }
.nf-table th { text-align:left; font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--nf-muted); padding:8px 6px; border-bottom:2px solid var(--nf-ink); }
.nf-table td { padding:10px 6px; border-bottom:1px solid var(--nf-line); }
.nf-table tr.you td { font-weight:700; background:#FFF8E6; }
.nf-you { font-size:11px; background:var(--nf-hi); color:var(--nf-dark); padding:2px 7px; border-radius:999px; margin-left:6px; font-weight:700; }
.nf-pill { display:inline-block; padding:2px 10px; border-radius:999px; font-size:12px; font-weight:700; }
.nf-pill.good { background:#DDF1E4; color:var(--nf-good); } .nf-pill.mid { background:#FDF1C7; color:var(--nf-mid); } .nf-pill.bad { background:#FBE3D6; color:var(--nf-bad); }
.nf-sub { font-weight:700; font-size:15px; margin:0; }
.nf-fixes { margin:0; padding-left:20px; display:flex; flex-direction:column; gap:4px; }

/* Ask-it-yourself comparison */
.nf-vs { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); gap:20px; }
.nf-vs .nf-card h3 { margin:0; font-size:20px; }
.nf-vs ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.nf-vs li { display:grid; grid-template-columns:22px 1fr; gap:10px; align-items:start; }
.nf-vs .mark { width:22px; height:22px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:13px; font-weight:800; }
.nf-vs .no { background:#FBE3D6; color:var(--nf-bad); } .nf-vs .yes { background:#DDF1E4; color:var(--nf-good); }
.nf-vs .ours { border:2px solid var(--nf-ink); }

/* How we compare */
.nf-cmp { width:100%; border-collapse:collapse; background:#fff; color:var(--nf-ink); font-size:15px; min-width:720px; }
.nf-cmp th, .nf-cmp td { padding:14px 12px; border-bottom:1px solid var(--nf-line); text-align:left; vertical-align:top; }
.nf-cmp thead th { background:var(--nf-dark); color:#fff; font-size:15px; }
.nf-cmp thead th.ours { background:var(--nf-hi); color:var(--nf-dark); }
.nf-cmp td.ours { background:#FFF8E6; font-weight:600; }
.nf-cmp tbody th { font-weight:600; width:24%; }
.nf-cmp .y { color:var(--nf-good); font-weight:700; } .nf-cmp .n { color:var(--nf-bad); font-weight:700; }
.nf-cmp-wrap { overflow-x:auto; border-radius:var(--nf-r); border:1px solid var(--nf-line); }

/* Pricing */
.nf-toggle { display:inline-flex; gap:4px; padding:4px; background:#fff; border:1px solid var(--nf-line); border-radius:999px; align-self:flex-start; }
.nf-toggle button { border:0; background:transparent; color:var(--nf-ink); padding:10px 18px; border-radius:999px; font:inherit; font-weight:600; cursor:pointer; min-height:44px; }
.nf-toggle button.on { background:var(--nf-dark); color:#fff; }
.nf-toggle .save { font-size:12px; font-weight:700; color:var(--nf-good); margin-left:4px; }
.nf-toggle button.on .save { color:var(--nf-hi); }
.nf-plans { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr)); gap:24px; align-items:stretch; }
.nf-plan { background:#fff; color:var(--nf-ink); border:1px solid var(--nf-line); border-radius:var(--nf-r); padding:28px; display:flex; flex-direction:column; gap:14px; }
.nf-plan.feature { background:var(--nf-dark); color:#fff; border-color:var(--nf-dark); }
.nf-plan h3 { margin:0; font-size:22px; }
.nf-price { font-family:var(--nf-head); font-weight:var(--nf-head-w); font-size:52px; line-height:1; }
.nf-price small { font-size:22px; font-weight:600; }
.nf-plan .note { font-size:15px; color:var(--nf-muted); margin:0; }
.nf-plan.feature .note { color:var(--nf-on-dark); }
.nf-plan ul { margin:0; padding-left:20px; display:flex; flex-direction:column; gap:6px; color:var(--nf-muted); }
.nf-plan.feature ul { color:#E4E9EF; }
.nf-plan .nf-btn { margin-top:auto; align-self:flex-start; }
.nf-badge { font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:11px; letter-spacing:.08em; text-transform:uppercase; background:var(--nf-hi); color:var(--nf-dark); padding:4px 8px; border-radius:4px; }

/* FAQ */
.nf-faq details { border-top:1px solid var(--nf-line); padding:18px 0; }
.nf-faq summary { cursor:pointer; font-weight:700; font-size:18px; list-style:none; display:flex; justify-content:space-between; gap:16px; }
.nf-faq summary::-webkit-details-marker { display:none; }
.nf-faq summary::after { content:'+'; font-size:24px; line-height:1; }
.nf-faq details[open] summary::after { content:'–'; }
.nf-faq p { margin:10px 0 0; color:var(--nf-muted); }

/* Footer */
.nf-foot { background:var(--nf-dark); color:var(--nf-on-dark); font-size:15px; }
.nf-foot .in { max-width:1160px; margin:0 auto; padding:48px 24px 28px; display:flex; flex-direction:column; gap:32px; }
.nf-foot .cols { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:28px; }
.nf-foot h4 { margin:0 0 10px; font-family:'IBM Plex Mono',ui-monospace,monospace; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--nf-hi); }
.nf-foot ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.nf-foot a { color:#fff; text-decoration:none; } .nf-foot a:hover { text-decoration:underline; }
.nf-foot .legal { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; border-top:1px solid rgba(255,255,255,.15); padding-top:20px; font-size:13px; }
.nf-logo { display:flex; align-items:center; gap:10px; color:#fff; font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:26px; }
.nf-logo span { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; background:#F5A524; color:#10233F; border-radius:6px; font-size:18px; }

/* Founding-member offer */
.nf-founding { background:#FFF4D6; color:#10233F; border:1px solid #F5D08A; border-radius:var(--nf-r); padding:14px 18px; font-size:16px; max-width:52em; }
.nf-founding[hidden] { display:none; }
.nf-was { font-size:.5em; font-weight:600; opacity:.6; margin-right:4px; }
.nf-was[hidden] { display:none; }

/* Four plans; plan choice note; enquiry form */
@media (min-width: 1100px) { .nf-plans4 { grid-template-columns: repeat(4, 1fr); } }
.nf-plans4 .nf-price { font-size:44px; }
.plan-choice { margin:0 0 12px; background:#FFF4D6; color:#10233F; border:1px solid #F5D08A; border-radius:8px; padding:12px 14px; font-size:15px; }
.enquire-form { display:flex; flex-direction:column; gap:10px; margin-top:auto; }
.enquire-form label { display:flex; flex-direction:column; gap:4px; font-size:13px; font-weight:600; }
.enquire-form input { min-height:44px; border:1.5px solid #8A99AB; border-radius:8px; padding:0 12px; font:inherit; font-weight:400; }
.nf-plan.feature .enquire-form label { color:#fff; }

/* Managed SEO: its own service, separate from the plans */
.nf-managed-wrap { padding-top:0; }
.nf-managed { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:32px; background:var(--nf-dark); color:#fff; border-radius:var(--nf-r); padding:36px; }
.nf-managed .nf-lead { color:var(--nf-on-dark); }
.nf-managed .nf-eyebrow { color:var(--nf-hi); }
.nf-managed-text { display:flex; flex-direction:column; gap:14px; }
.nf-managed-list { margin:0; padding-left:20px; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:6px 24px; color:#E4E9EF; }
.nf-managed-price { display:flex; flex-direction:column; gap:14px; justify-content:center; border-left:1px solid rgba(255,255,255,.15); padding-left:32px; }
.nf-managed-price .note { margin:0; color:var(--nf-on-dark); font-size:15px; }
.nf-managed-price .nf-btn { align-self:flex-start; }
.nf-managed .enquire-form label { color:#fff; }
@media (max-width: 760px) { .nf-managed { grid-template-columns:1fr; padding:24px; } .nf-managed-price { border-left:0; padding-left:0; border-top:1px solid rgba(255,255,255,.15); padding-top:20px; } }

.nf-cur { font-size:.36em; font-weight:700; margin-left:4px; letter-spacing:.04em; vertical-align:baseline; }