/* Novaris AI Corp — shared design system
   Tokens are duplicated in light/dark blocks intentionally: no data-theme
   toggle exists on a plain static site, so prefers-color-scheme is the
   only theme switch these pages need. */

:root{
  --paper:#EDEFF1; --surface:#FFFFFF; --ink:#1A2233; --ink-soft:#4B5567; --ink-faint:#7C8798;
  --line:#D3D8DD; --line-strong:#B7BFC7;
  --accent:#1F5753; --accent-strong:#123B38; --accent-tint:#E3ECEA; --accent-ink:#F4F8F7;
  --risk-minimal:#4E7A5B; --risk-limited:#B8862F; --risk-high:#B45A2E; --risk-unacceptable:#9C3B3B;
  --risk-minimal-tint:#E7EEE8; --risk-limited-tint:#F3E9D6; --risk-high-tint:#F1E0D5; --risk-unacceptable-tint:#EFDBDB;
  --font-display: "Segoe UI", ui-sans-serif, system-ui, Arial, sans-serif;
  --font-body: Georgia, "Iowan Old Style", "Palatino Linotype", "Source Serif Pro", serif;
  --font-mono: ui-monospace, "Cascadia Code", "SFMono-Regular", Consolas, monospace;
  --shadow: 0 1px 2px rgba(20,30,35,.04), 0 8px 24px rgba(20,30,35,.05);
}
@media (prefers-color-scheme: dark){
  :root{
    --paper:#141920; --surface:#1B212A; --ink:#E7EAEE; --ink-soft:#AAB4C2; --ink-faint:#7C8798;
    --line:#2A313B; --line-strong:#3A4350;
    --accent:#5FB3AC; --accent-strong:#8FCFC9; --accent-tint:#1D3230; --accent-ink:#0F1815;
    --risk-minimal:#7FAE8C; --risk-limited:#D3A959; --risk-high:#D08659; --risk-unacceptable:#C46A6A;
    --risk-minimal-tint:#1E2A22; --risk-limited-tint:#2E2718; --risk-high-tint:#2E2016; --risk-unacceptable-tint:#2E1B1B;
    --shadow: 0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.35);
  }
}

*{box-sizing:border-box;}
html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-body); font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; }
::selection{ background:var(--accent-tint); color:var(--accent-strong); }
a{ color:inherit; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, summary:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
img,svg{ display:block; max-width:100%; }
.wrap{ max-width:1160px; margin:0 auto; padding:0 32px; }
.wrap-narrow{ max-width:760px; margin:0 auto; padding:0 32px; }
@media (max-width:600px){ .wrap, .wrap-narrow{ padding:0 20px; } }

@media (prefers-reduced-motion: no-preference){
  .reveal{ animation: rise .6s cubic-bezier(.2,.7,.3,1) both; }
  .reveal.d1{ animation-delay:.08s; } .reveal.d2{ animation-delay:.16s; } .reveal.d3{ animation-delay:.24s; }
  @keyframes rise{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
}

/* ---------------- nav ---------------- */
header.site{ position:sticky; top:0; z-index:20; background:color-mix(in srgb, var(--paper) 88%, transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
.nav-row{ display:flex; align-items:center; justify-content:space-between; padding:16px 0; gap:24px; }
.mark{ display:flex; align-items:center; gap:10px; text-decoration:none; }
.mark .box{ width:30px; height:30px; border:1.5px solid var(--accent); border-radius:6px; display:flex; align-items:center; justify-content:center; font-family:var(--font-mono); font-weight:700; font-size:13px; color:var(--accent-strong); flex:none; }
.mark .word{ font-family:var(--font-display); font-weight:700; font-size:16px; letter-spacing:.01em; color:var(--ink); }
nav.links{ display:flex; gap:28px; }
nav.links a{ font-family:var(--font-display); font-size:14px; color:var(--ink-soft); text-decoration:none; }
nav.links a:hover, nav.links a[aria-current="page"]{ color:var(--accent-strong); }
@media (max-width:820px){ nav.links{ display:none; } }
.btn{ font-family:var(--font-display); font-weight:600; font-size:14px; border-radius:5px; padding:10px 18px; border:1px solid transparent; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:8px; white-space:nowrap; transition:transform .15s ease, background .15s ease, border-color .15s ease; }
.btn-primary{ background:var(--accent); color:var(--accent-ink); }
.btn-primary:hover{ background:var(--accent-strong); }
.btn-ghost{ background:transparent; border-color:var(--line-strong); color:var(--ink); }
.btn-ghost:hover{ border-color:var(--accent); color:var(--accent-strong); }
.btn:active{ transform:scale(.98); }
.btn[disabled]{ opacity:.5; cursor:not-allowed; }

/* ---------------- page header (non-home pages) ---------------- */
.page-head{ padding:56px 0 44px; border-bottom:1px solid var(--line); }
.breadcrumb{ font-family:var(--font-mono); font-size:12px; color:var(--ink-faint); margin:0 0 18px; }
.breadcrumb a{ color:var(--ink-faint); text-decoration:none; }
.breadcrumb a:hover{ color:var(--accent-strong); }
.eyebrow{ font-family:var(--font-mono); font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-strong); margin:0 0 18px; }
.page-head h1{ font-family:var(--font-display); font-weight:700; letter-spacing:-0.02em; font-size:clamp(30px,4.2vw,46px); line-height:1.1; margin:0 0 18px; text-wrap:balance; max-width:20ch; }
.page-head .sub{ font-size:18px; color:var(--ink-soft); max-width:60ch; margin:0; text-wrap:pretty; }

/* ---------------- hero (home) ---------------- */
.hero{ padding:76px 0 64px; }
.hero h1{ font-family:var(--font-display); font-weight:700; letter-spacing:-0.025em; font-size:clamp(32px,4.6vw,54px); line-height:1.08; margin:0 0 22px; text-wrap:balance; max-width:16ch; }
.hero .sub{ font-size:19px; color:var(--ink-soft); max-width:56ch; margin:0 0 32px; text-wrap:pretty; }
.hero .ctas{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:56px; }

.thesis{ background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:26px 26px 22px; box-shadow:var(--shadow); }
.thesis .q{ font-family:var(--font-display); font-size:13.5px; font-weight:600; color:var(--ink-faint); margin:0 0 16px; }
.risk-strip{ display:flex; border-radius:7px; overflow:hidden; border:1px solid var(--line); }
.risk-seg{ flex:1; padding:15px 14px 13px; position:relative; }
.risk-seg.minimal{ background:var(--risk-minimal-tint); } .risk-seg.limited{ background:var(--risk-limited-tint); }
.risk-seg.high{ background:var(--risk-high-tint); flex:1.3; outline:2px solid var(--risk-high); outline-offset:-2px; }
.risk-seg.unacceptable{ background:var(--risk-unacceptable-tint); }
.risk-seg .dot{ width:8px; height:8px; border-radius:50%; display:inline-block; margin-right:6px; }
.minimal .dot{ background:var(--risk-minimal);} .limited .dot{ background:var(--risk-limited);}
.high .dot{ background:var(--risk-high);} .unacceptable .dot{ background:var(--risk-unacceptable);}
.risk-seg .label{ font-family:var(--font-display); font-weight:700; font-size:13px; }
.risk-seg .body{ font-size:12px; color:var(--ink-soft); margin-top:5px; display:block; line-height:1.4; }
.risk-seg.high .label, .risk-seg.high .body{ color:var(--ink); }
@media (max-width:700px){ .risk-strip{ flex-direction:column; } .risk-seg.high{ order:-1; } }
.thesis .note{ font-family:var(--font-mono); font-size:12px; color:var(--ink-faint); margin-top:14px; }
.thesis .note b{ color:var(--risk-high); font-weight:600; }

/* ---------------- section shell ---------------- */
section{ padding:64px 0; border-top:1px solid var(--line); }
section.tight{ padding:48px 0; }
.head{ max-width:64ch; margin-bottom:34px; }
.head .k{ font-family:var(--font-mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--accent-strong); margin:0 0 10px; }
.head h2{ font-family:var(--font-display); font-weight:700; font-size:clamp(24px,3vw,32px); letter-spacing:-.01em; margin:0 0 12px; text-wrap:balance; }
.head p{ font-size:16px; color:var(--ink-soft); margin:0; }

/* framework function strip */
.fn-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:8px; overflow:hidden; }
@media (max-width:760px){ .fn-row{ grid-template-columns:1fr 1fr; } }
.fn-row.cols-5{ grid-template-columns:repeat(5,1fr); }
@media (max-width:900px){ .fn-row.cols-5{ grid-template-columns:1fr 1fr; } }
.fn-cell{ background:var(--surface); padding:22px 20px; }
.fn-cell .tag{ font-family:var(--font-mono); font-size:11.5px; color:var(--accent-strong); letter-spacing:.06em; display:block; margin-bottom:8px; }
.fn-cell h3{ font-family:var(--font-display); font-size:16px; margin:0 0 6px; }
.fn-cell p{ font-size:13.5px; color:var(--ink-soft); margin:0; }
.link-more{ display:inline-flex; align-items:center; gap:6px; margin-top:22px; font-family:var(--font-display); font-size:14px; font-weight:600; color:var(--accent-strong); text-decoration:none; }
.link-more:hover{ text-decoration:underline; }

/* persona / card grids */
.persona-grid, .grid-cards{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
@media (max-width:900px){ .persona-grid, .grid-cards{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .persona-grid, .grid-cards{ grid-template-columns:1fr; } }
.persona, .card{ background:var(--surface); border:1px solid var(--line); border-radius:9px; padding:22px 20px; transition:border-color .15s ease, transform .15s ease; }
.persona:hover, .card.linkable:hover{ border-color:var(--accent); transform:translateY(-2px); }
.persona h3, .card h3{ font-family:var(--font-display); font-size:15.5px; margin:0 0 8px; }
.persona p, .card p{ font-size:14px; color:var(--ink-soft); margin:0 0 12px; }
.persona a, .card a.chase{ font-family:var(--font-mono); font-size:12px; color:var(--accent-strong); text-decoration:none; }
.persona a:hover, .card a.chase:hover{ text-decoration:underline; }
.card .role{ font-family:var(--font-mono); font-size:11.5px; color:var(--accent-strong); letter-spacing:.03em; margin-bottom:8px; display:block; }

/* long-form persona / service detail sections */
.detail{ display:grid; grid-template-columns:.9fr 1.6fr; gap:40px; padding:44px 0; border-top:1px solid var(--line); }
.detail:first-of-type{ border-top:none; }
@media (max-width:800px){ .detail{ grid-template-columns:1fr; gap:16px; } }
.detail .side{ position:sticky; top:90px; align-self:start; }
.detail .side .idx{ font-family:var(--font-mono); font-size:13px; color:var(--accent-strong); display:block; margin-bottom:10px; }
.detail .side h3{ font-family:var(--font-display); font-size:20px; font-weight:700; margin:0; letter-spacing:-.01em; text-wrap:balance; }
.detail .body p{ max-width:66ch; }
.detail .body ul{ padding-left:20px; max-width:62ch; }
.detail .body li{ font-size:15px; color:var(--ink-soft); margin-bottom:8px; }
.pill-row{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.pill{ font-family:var(--font-mono); font-size:11.5px; padding:4px 10px; border-radius:99px; background:var(--accent-tint); color:var(--accent-strong); }

/* engagement path */
.path{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; counter-reset:step; }
@media (max-width:760px){ .path{ grid-template-columns:1fr; } }
.step{ position:relative; padding-top:8px; }
.step::before{ counter-increment:step; content:counter(step,decimal-leading-zero); font-family:var(--font-mono); font-size:13px; color:var(--accent-strong); display:block; margin-bottom:12px; }
.step h3{ font-family:var(--font-display); font-size:17px; margin:0 0 8px; }
.step p{ font-size:14.5px; color:var(--ink-soft); margin:0; }
.path-note{ margin-top:28px; font-size:14px; color:var(--ink-faint); }
.path-note a{ color:var(--accent-strong); text-decoration:underline; }

/* risk tier tags used inline in prose (frameworks / crosswalk pages) */
.tier{ font-family:var(--font-mono); font-size:12px; padding:2px 9px; border-radius:99px; white-space:nowrap; }
.tier.minimal{ background:var(--risk-minimal-tint); color:var(--risk-minimal); }
.tier.limited{ background:var(--risk-limited-tint); color:var(--risk-limited); }
.tier.high{ background:var(--risk-high-tint); color:var(--risk-high); }
.tier.unacceptable{ background:var(--risk-unacceptable-tint); color:var(--risk-unacceptable); }

/* tables (crosswalk, services) */
.tbl-wrap{ overflow-x:auto; margin:22px 0; border:1px solid var(--line); border-radius:8px; }
table{ border-collapse:collapse; width:100%; min-width:600px; background:var(--surface); }
th, td{ text-align:left; padding:13px 16px; border-bottom:1px solid var(--line); font-size:14px; vertical-align:top; }
th{ font-family:var(--font-display); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint); font-weight:600; background:var(--paper); }
tr:last-child td{ border-bottom:none; }

/* trust */
.trust{ display:grid; grid-template-columns:1.1fr .9fr; gap:48px; align-items:start; }
@media (max-width:820px){ .trust{ grid-template-columns:1fr; } }
.trust blockquote{ margin:0; font-size:20px; line-height:1.55; color:var(--ink); text-wrap:balance; }
.trust blockquote footer{ margin-top:16px; font-family:var(--font-display); font-size:13.5px; color:var(--ink-faint); font-style:normal; }
.trust-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:18px; }
.trust-list li{ padding-left:22px; position:relative; font-size:14.5px; color:var(--ink-soft); }
.trust-list li::before{ content:"—"; position:absolute; left:0; color:var(--accent); }

/* lead magnet */
.magnet{ background:var(--accent-tint); border:1px solid var(--line); border-radius:12px; padding:40px; display:grid; grid-template-columns:1.2fr 1fr; gap:32px; align-items:center; }
@media (max-width:760px){ .magnet{ grid-template-columns:1fr; padding:28px; } }
.magnet h2{ font-family:var(--font-display); font-weight:700; font-size:24px; margin:0 0 10px; color:var(--ink); letter-spacing:-0.01em; }
.magnet p{ font-size:15px; color:var(--ink-soft); margin:0; max-width:44ch; }
.magnet form{ display:flex; gap:10px; flex-wrap:wrap; }
.magnet input[type="email"]{ flex:1; min-width:180px; padding:12px 14px; border-radius:6px; border:1px solid var(--line-strong); background:var(--surface); color:var(--ink); font-family:var(--font-body); font-size:14.5px; }
.magnet input[type="email"]::placeholder{ color:var(--ink-faint); }
.magnet .fine{ font-family:var(--font-mono); font-size:11px; color:var(--ink-faint); margin-top:10px; width:100%; }

/* generic forms (contact page) */
.form-grid{ display:grid; gap:18px; max-width:560px; }
.field{ display:flex; flex-direction:column; gap:6px; }
.field label{ font-family:var(--font-display); font-size:13px; font-weight:600; color:var(--ink); }
.field input, .field textarea, .field select{ padding:12px 14px; border-radius:6px; border:1px solid var(--line-strong); background:var(--surface); color:var(--ink); font-family:var(--font-body); font-size:15px; resize:vertical; }
.field textarea{ min-height:120px; }
.field .hint{ font-size:12.5px; color:var(--ink-faint); }

/* callout */
.callout{ border-left:3px solid var(--accent); background:var(--accent-tint); padding:16px 20px; border-radius:0 6px 6px 0; margin:22px 0; }
.callout p{ margin:0; font-size:14.5px; color:var(--ink); max-width:64ch; }
.callout p + p{ margin-top:8px; }
.callout.warn{ border-left-color:var(--risk-limited); background:var(--risk-limited-tint); }

/* prose defaults for long-form pages (blog posts, legal) */
.prose{ max-width:68ch; }
.prose h2{ font-family:var(--font-display); font-size:22px; margin:36px 0 12px; letter-spacing:-.01em; }
.prose h3{ font-family:var(--font-display); font-size:17px; margin:26px 0 10px; }
.prose p{ margin:0 0 16px; }
.prose ul, .prose ol{ padding-left:22px; margin:0 0 16px; }
.prose li{ margin-bottom:8px; }
.prose a{ color:var(--accent-strong); text-decoration:underline; }

/* blog index */
.post-list{ display:flex; flex-direction:column; gap:0; }
.post-row{ display:grid; grid-template-columns:140px 1fr; gap:24px; padding:26px 0; border-top:1px solid var(--line); }
.post-list .post-row:first-child{ border-top:none; }
@media (max-width:600px){ .post-row{ grid-template-columns:1fr; gap:8px; } }
.post-row .date{ font-family:var(--font-mono); font-size:12.5px; color:var(--ink-faint); padding-top:3px; }
.post-row h3{ font-family:var(--font-display); font-size:18px; margin:0 0 8px; }
.post-row h3 a{ text-decoration:none; color:var(--ink); }
.post-row h3 a:hover{ color:var(--accent-strong); }
.post-row p{ font-size:14.5px; color:var(--ink-soft); margin:0; max-width:60ch; }

/* readiness-check quiz */
.quiz{ background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:32px; box-shadow:var(--shadow); }
.quiz-progress{ font-family:var(--font-mono); font-size:12px; color:var(--ink-faint); margin-bottom:18px; }
.quiz-q{ margin-bottom:28px; }
.quiz-q .fn-label{ font-family:var(--font-mono); font-size:11px; color:var(--accent-strong); letter-spacing:.06em; display:block; margin-bottom:8px; }
.quiz-q p{ font-family:var(--font-display); font-size:16px; font-weight:600; margin:0 0 12px; color:var(--ink); }
.quiz-opts{ display:flex; flex-direction:column; gap:8px; }
.quiz-opts label{ display:flex; align-items:center; gap:10px; padding:11px 14px; border:1px solid var(--line); border-radius:6px; font-size:14.5px; cursor:pointer; transition:border-color .15s ease, background .15s ease; }
.quiz-opts label:hover{ border-color:var(--accent); }
.quiz-opts input{ accent-color:var(--accent); }
#quiz-result{ display:none; }
#quiz-result.show{ display:block; }
.score-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:24px 0; }
@media (max-width:640px){ .score-row{ grid-template-columns:1fr 1fr; } }
.score-cell{ background:var(--paper); border:1px solid var(--line); border-radius:8px; padding:16px; text-align:center; }
.score-cell .fn{ font-family:var(--font-mono); font-size:11px; color:var(--accent-strong); letter-spacing:.06em; }
.score-cell .val{ font-family:var(--font-display); font-size:28px; font-weight:700; margin:8px 0 2px; font-variant-numeric:tabular-nums; }
.score-cell .max{ font-size:12px; color:var(--ink-faint); }

/* cta band */
.cta-band{ text-align:left; padding:60px 0 56px; }
.cta-band h2{ font-family:var(--font-display); font-weight:700; font-size:clamp(24px,3.4vw,34px); letter-spacing:-.01em; margin:0 0 10px; max-width:20ch; text-wrap:balance; }
.cta-band p{ color:var(--ink-soft); font-size:16px; margin:0 0 26px; max-width:52ch; }

/* retainer / flagship offering panel (vAI-CRO) */
.retainer-panel{ background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:40px; box-shadow:var(--shadow); }
.badge-flagship{ display:inline-block; font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--accent-strong); background:var(--accent-tint); padding:4px 10px; border-radius:99px; margin-bottom:16px; }
.badge-differentiator{ display:inline-block; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--risk-high); background:var(--risk-high-tint); padding:3px 9px; border-radius:99px; margin-left:10px; vertical-align:middle; white-space:nowrap; }
.retainer-panel h2{ font-family:var(--font-display); font-size:26px; font-weight:700; margin:0 0 12px; letter-spacing:-.01em; text-wrap:balance; }
.retainer-panel > p.lede{ font-size:16px; color:var(--ink-soft); max-width:62ch; margin:0 0 28px; }
.feature-grid{ display:grid; grid-template-columns:1fr 1fr; gap:13px 28px; list-style:none; margin:0 0 30px; padding:0; }
@media (max-width:640px){ .feature-grid{ grid-template-columns:1fr; } }
.feature-grid li{ font-size:14.5px; color:var(--ink); padding-left:24px; position:relative; }
.feature-grid li::before{ content:"✓"; position:absolute; left:0; color:var(--accent-strong); font-weight:700; }
.retainer-foot{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; border-top:1px solid var(--line); padding-top:24px; }
.retainer-foot p{ font-size:13.5px; color:var(--ink-faint); margin:0; max-width:44ch; }

/* primary offering panel (COSO ERM compliance assessment) */
.badge-primary{ display:inline-block; font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--accent-ink); background:var(--accent); padding:5px 12px; border-radius:99px; margin-bottom:16px; }
.offering-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin:28px 0 30px; counter-reset:offer; }
@media (max-width:820px){ .offering-grid{ grid-template-columns:1fr; } }
.offering-cell{ background:var(--paper); border:1px solid var(--line); border-radius:8px; padding:22px 20px; }
.offering-cell .step-num{ font-family:var(--font-mono); font-size:12px; color:var(--accent-strong); letter-spacing:.06em; display:block; margin-bottom:10px; }
.offering-cell h3{ font-family:var(--font-display); font-size:16.5px; margin:0 0 8px; letter-spacing:-.005em; }
.offering-cell p{ font-size:13.8px; color:var(--ink-soft); margin:0 0 12px; }
.offering-cell ul{ padding-left:18px; margin:0; }
.offering-cell li{ font-size:13.2px; color:var(--ink-soft); margin-bottom:6px; }

/* footer */
footer.site{ border-top:1px solid var(--line); padding:44px 0 40px; }
.foot-grid{ display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:32px; margin-bottom:32px; }
@media (max-width:760px){ .foot-grid{ grid-template-columns:1fr 1fr; } }
.foot-grid h4{ font-family:var(--font-display); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint); margin:0 0 14px; }
.foot-grid a{ display:block; font-size:14px; color:var(--ink-soft); text-decoration:none; margin-bottom:10px; }
.foot-grid a:hover{ color:var(--accent-strong); }
.foot-legal{ font-size:12.5px; color:var(--ink-faint); border-top:1px solid var(--line); padding-top:20px; max-width:70ch; }
