/* nx-msp.css — MSP/agency repositioning (2026-10): homepage, scanner results,
 * remediation tabs, sample report, trust center, pricing cards and landing pages.
 * Uses the existing design tokens from style.css; no new colours are introduced
 * except via those tokens. Loaded after nx-future.css. */

/* ---------- shared ---------- */
.msp-wrap{max-width:var(--maxw,1180px);margin:0 auto}
.msp-section{margin:56px 0}
.msp-section > h2{font-size:clamp(1.3rem,2.4vw,1.75rem);margin:0 0 8px}
.msp-section > .msp-lead{color:var(--muted);max-width:68ch;margin:0 0 22px}
.msp-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.msp-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg,14px);padding:20px}
.msp-card h3{font-size:1.05rem;margin:0 0 6px}
.msp-card p{color:var(--muted);margin:0}
.msp-tag{display:inline-block;font-size:.75rem;letter-spacing:.02em;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted);vertical-align:middle}
.msp-tag.is-planned{border-color:var(--warn);color:var(--warn)}
.msp-tag.is-live{border-color:var(--ok);color:var(--ok)}
.msp-demo-label{display:inline-block;font-size:.78rem;padding:4px 10px;border-radius:var(--r-sm,6px);border:1px dashed var(--warn);color:var(--warn);margin:0 0 12px}
.msp-skip:focus{position:static}
a:focus-visible,button:focus-visible,summary:focus-visible,[role="tab"]:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- homepage hero ---------- */
.msp-hero{display:grid;gap:32px;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;padding:48px 0 24px}
.msp-hero .eyebrow{margin:0 0 10px}
.msp-hero h1{font-size:clamp(1.9rem,4.2vw,3rem);line-height:1.12;margin:0 0 14px}
.msp-hero .msp-sub{font-size:1.08rem;color:var(--muted);max-width:60ch;margin:0 0 22px}
.msp-ctas{display:flex;gap:12px;flex-wrap:wrap}
.msp-trustline{margin:16px 0 0;font-size:.88rem;color:var(--muted)}
.msp-preview{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg,14px);padding:18px;box-shadow:var(--sh-2,none)}
.msp-preview-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 0 12px}
.msp-score{display:flex;align-items:baseline;gap:8px}
.msp-score b{font-size:2.2rem;line-height:1}
.msp-preview ul{list-style:none;margin:0;padding:0}
.msp-preview li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:.92rem}
.msp-sev{font-size:.75rem;font-weight:600;padding:2px 8px;border-radius:999px;white-space:nowrap}
.msp-sev.s-critical,.msp-sev.s-high{background:rgba(248,113,113,.14);color:var(--crit)}
.msp-sev.s-medium{background:rgba(251,191,36,.14);color:var(--warn)}
.msp-sev.s-low,.msp-sev.s-info{background:rgba(96,165,250,.14);color:var(--accent)}
.msp-state{font-size:.75rem;color:var(--muted)}
.msp-state.is-fixed{color:var(--ok)}
.msp-steps{counter-reset:s;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));list-style:none;padding:0;margin:0}
.msp-steps li{counter-increment:s;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg,14px);padding:18px}
.msp-steps li::before{content:counter(s);display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--accent);color:var(--accent);font-weight:700;margin:0 0 10px}
.msp-steps h3{margin:0 0 6px;font-size:1.02rem}
.msp-steps p{margin:0;color:var(--muted)}
.msp-links{display:flex;flex-wrap:wrap;gap:8px 18px;padding:0;margin:0;list-style:none}
.msp-faq details{border-top:1px solid var(--line);padding:12px 0}
.msp-faq summary{cursor:pointer;font-weight:600}
.msp-faq details p{color:var(--muted);margin:8px 0 0}
.msp-final{text-align:center;padding:32px 20px}
@media (max-width:860px){.msp-hero{grid-template-columns:1fr;padding-top:28px}}

/* ---------- scanner ---------- */
.vs-field-err{color:var(--crit);font-size:.85rem;margin:6px 0 0}
.vs-progress{margin-top:14px;border:1px solid var(--line);border-radius:var(--r,10px);padding:12px 14px;background:var(--panel-2,transparent)}
.vs-progress ul{margin:6px 0 6px 18px;padding:0;color:var(--muted);font-size:.88rem}
.vs-progress p{margin:0}
.nss-fail p{margin:0 0 6px}.nss-fail p:last-child{margin:0}
.vs-actions .vs-action-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.vs-actions .vs-action-row .btn{min-height:40px}
.vs-verify{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.vs-facts{display:grid;grid-template-columns:max-content 1fr;gap:6px 14px;margin:10px 0 0;font-size:.9rem}
.vs-facts dt{color:var(--muted);font-weight:600}
.vs-facts dd{margin:0;overflow-wrap:anywhere}
.vs-fix{margin-top:10px}
.vs-fix summary{cursor:pointer;font-weight:600;color:var(--accent)}
@media (max-width:560px){.vs-facts{grid-template-columns:1fr}.vs-facts dt{margin-top:6px}}

/* ---------- remediation panel ---------- */
.nss-remediation{margin-top:10px}
.nss-why{margin:0 0 10px}
.nss-why dt{font-weight:600;margin-top:8px}
.nss-why dd{margin:2px 0 0;color:var(--muted)}
.nss-tabs-label{font-weight:600;margin:10px 0 6px}
.nss-tablist{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--line);margin:0 0 8px}
.nss-tablist [role="tab"]{background:none;border:1px solid transparent;border-bottom:none;border-radius:var(--r-sm,6px) var(--r-sm,6px) 0 0;color:var(--muted);padding:7px 11px;cursor:pointer;font:inherit;font-size:.85rem;min-height:36px}
.nss-tablist [role="tab"][aria-selected="true"]{color:var(--ink);border-color:var(--line);background:var(--panel-2,transparent);font-weight:600}
.nss-tabs.is-enhanced .nss-tabpanel-h{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nss-tabpanel-h{font-size:.9rem;margin:10px 0 4px}
.nss-code-wrap{position:relative}
.nss-code{margin:0;padding:12px 14px;padding-right:76px;border-radius:var(--r,10px);border:1px solid var(--line);background:rgba(0,0,0,.28);overflow-x:auto;font-family:var(--mono);font-size:.8rem;line-height:1.5;white-space:pre}
.nss-copy{position:absolute;top:8px;right:8px;padding:4px 10px!important;min-height:30px;font-size:.78rem}
.nss-note{font-size:.8rem;margin:6px 0 0}
.nss-warn{margin:10px 0 0;font-size:.84rem;padding:8px 12px;border-left:3px solid var(--warn);background:rgba(251,191,36,.08);border-radius:0 var(--r-sm,6px) var(--r-sm,6px) 0}
.nss-refs{font-size:.84rem;margin:10px 0 0}

/* ---------- sample report ---------- */
.sr-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.sr-kv{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;font-size:.9rem;margin:0}
.sr-kv dt{color:var(--muted)}.sr-kv dd{margin:0}
.sr-dist{display:flex;gap:4px;height:14px;border-radius:999px;overflow:hidden;margin:10px 0 6px;background:var(--line)}
.sr-dist span{display:block;height:100%}
.sr-dist .d-high{background:var(--crit)}.sr-dist .d-medium{background:var(--warn)}.sr-dist .d-low{background:var(--accent)}
.sr-finding{border-top:1px solid var(--line);padding:16px 0}
.sr-finding h3{margin:0 0 6px;font-size:1.02rem}
.sr-table{width:100%;border-collapse:collapse;font-size:.9rem}
.sr-table th,.sr-table td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}

/* ---------- trust center ---------- */
.trust-toc{columns:2;column-gap:28px;padding-left:18px}
@media (max-width:640px){.trust-toc{columns:1}}
.trust-sec{border-top:1px solid var(--line);padding:22px 0}
.trust-sec h2{font-size:1.15rem;margin:0 0 8px}
.trust-sec dl{display:grid;grid-template-columns:minmax(150px,max-content) 1fr;gap:6px 16px;margin:8px 0 0}
.trust-sec dt{color:var(--muted)}.trust-sec dd{margin:0}
@media (max-width:560px){.trust-sec dl{grid-template-columns:1fr}}
.trust-status{font-size:.75rem;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.trust-status.is-available{border-color:var(--ok);color:var(--ok)}
.trust-status.is-pending{border-color:var(--warn);color:var(--warn)}

/* ---------- pricing ---------- */
.msp-plans{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));align-items:stretch}
.msp-plan{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg,14px);padding:22px}
.msp-plan.is-featured{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.msp-plan h3{margin:0;font-size:1.2rem}
.msp-plan .msp-for{color:var(--muted);margin:4px 0 14px;font-size:.9rem}
.msp-plan .msp-price{font-size:1.9rem;font-weight:700;margin:0}
.msp-plan .msp-period{color:var(--muted);font-size:.86rem;margin:2px 0 14px}
.msp-plan ul{list-style:none;padding:0;margin:0 0 16px;flex:1}
.msp-plan li{padding:6px 0 6px 22px;position:relative;font-size:.92rem}
.msp-plan li::before{content:"\2713";position:absolute;left:0;color:var(--ok)}
.msp-plan li.is-no::before{content:"\2013";color:var(--faint)}
.msp-plan li.is-no{color:var(--muted)}
.msp-plan .msp-limits{font-size:.82rem;color:var(--muted);margin:0 0 14px}
.msp-plan form{margin:0}
.msp-plan .btn{width:100%;justify-content:center;margin-top:6px}
.msp-billing{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:14px}
.msp-disclose{font-size:.86rem;color:var(--muted)}
.msp-disclose dt{font-weight:600;color:var(--ink);margin-top:8px}
.msp-disclose dd{margin:2px 0 0}

/* ---------- landing pages ---------- */
.lp-hero{padding:40px 0 10px;max-width:780px}
.lp-hero h1{font-size:clamp(1.7rem,3.6vw,2.5rem);margin:0 0 12px;line-height:1.15}
.lp-hero p{color:var(--muted);font-size:1.04rem}
.lp-body h2{font-size:1.25rem;margin:32px 0 8px}
.lp-body p,.lp-body li{color:var(--muted);max-width:72ch}

@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.vs-verify label.row{display:flex;flex-wrap:nowrap!important;flex:1 1 260px;flex-direction:row!important}
.vs-verify label.row input{flex:0 0 auto;width:auto}

/* ---------- nav: mobile "Scan Free" stays visible outside the drawer ---------- */
.topbar .nav-cta-mobile{display:none}
@media (max-width:980px){
  .topbar .nav-cta-mobile{display:inline-flex;align-items:center;margin-left:auto;margin-right:8px;padding:8px 14px;min-height:40px;font-size:.88rem;white-space:nowrap}
  .topbar .nav .nav-cta{display:none}
}
@media (max-width:980px){.topbar .brand{min-width:0;max-width:calc(100% - 156px)}.topbar .brand span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}}
@media (max-width:480px){.topbar .brand span{font-size:.8rem}.topbar .nav-cta-mobile{padding:7px 10px;font-size:.82rem;margin-right:6px;min-height:40px}.topbar .brand img{width:26px;height:26px}}
@media (max-width:360px){.topbar .brand span b{display:none}}
/* preview card: keep the score and status on one line; figure has UA margins */
figure.msp-preview{margin:0}
.msp-preview-head > div:first-child{min-width:0}
.msp-score{flex:0 0 auto;white-space:nowrap}
.msp-preview li > span:first-child{min-width:0}
.msp-state{flex:0 0 auto;white-space:nowrap}
.msp-preview figcaption b{overflow-wrap:anywhere}

/* client report form (scanner results) */
.vs-client-report{margin-top:14px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r,10px);background:var(--panel-2,transparent)}
.vs-client-report summary{cursor:pointer}
.vs-cr-form{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));align-items:end;margin-top:10px}
.vs-cr-form label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--muted)}
.vs-cr-form input,.vs-cr-form select{min-height:40px}
.vs-cr-form .btn{min-height:40px}
.msp-plan li.is-head{padding-left:0}
.msp-plan li.is-head::before{content:none}
.msp-plan ul.msp-extras{flex:0 0 auto;margin-bottom:10px}
.msp-plan ul.msp-extras li{font-size:.86rem;color:var(--muted)}

/* finding lifecycle */
.lc-badge{display:inline-block;font-size:.75rem;font-weight:600;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.lc-badge.lc-new,.lc-badge.lc-reopened,.lc-badge.lc-still_present{border-color:var(--crit);color:var(--crit)}
.lc-badge.lc-open,.lc-badge.lc-acknowledged,.lc-badge.lc-in_remediation,.lc-badge.lc-partially_resolved{border-color:var(--warn);color:var(--warn)}
.lc-badge.lc-ready_for_verification,.lc-badge.lc-verifying{border-color:var(--accent);color:var(--accent)}
.lc-badge.lc-resolved,.lc-badge.lc-verified_resolved{border-color:var(--ok);color:var(--ok)}
.lc-form{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin-top:10px;font-size:.85rem}
.lc-form label{display:flex;flex-direction:column;gap:3px;color:var(--muted)}
.lc-form select,.lc-form input{min-height:36px}
.vs-vr-list{list-style:none;margin:0;padding:0}
.vs-vr-list li{padding:6px 0;border-top:1px solid var(--line)}

/* PRIV-2026-10: cookie consent banner and settings panel (consent_lib.php).
   Fixed to the bottom on small screens, never covering the footer links that
   reopen it. Buttons share one style so no choice is visually favoured. */
.nss-consent{position:fixed;left:12px;right:12px;bottom:12px;z-index:9000;max-width:720px;margin:0 auto;
  background:var(--panel,#111827);color:var(--text,#e6edf3);border:1px solid var(--line,#2b3442);
  border-radius:12px;padding:14px 16px;box-shadow:0 8px 30px rgba(0,0,0,.35);font-size:.9rem;line-height:1.5}
.nss-consent .btn{min-height:40px}
.nss-consent-form label{cursor:pointer}
.nss-consent a{text-decoration:underline;text-underline-offset:2px}
@media print{.nss-consent{display:none}}

/* LEGAL-2026-10: legal pages print as plain documents (black on white, no
   navigation, consent banner or buttons; external link targets spelled out). */
@media print{
  .legal-page{max-width:none!important;background:#fff!important;color:#000!important;border:0!important;box-shadow:none!important;padding:0!important}
  .legal-page a{color:#000!important;text-decoration:underline}
  .legal-page a[href^="http"]::after{content:" (" attr(href) ")";font-size:.85em;word-break:break-all}
  .legal-page .btn,.nss-consent,.breadcrumbs{display:none!important}
  .legal-page h2{page-break-after:avoid}
  .legal-page table{page-break-inside:auto}
  .legal-page tr{page-break-inside:avoid}
}

/* WEDGE-2026-10: WCAG 2.2 target size (24px) for links in Trust Center tables and lists. */
.trust-sec td a, .trust-sec li a { display: inline-block; min-height: 24px; line-height: 24px; }

/* WEDGE-2026-10: the pricing documents row inherited a dimmed link colour (3.1:1). */
.pricing-docs a { color: #6CB6FF; }
.pricing-docs a:hover { color: #9CCBFF; }