/* =========================================================
   ASSEMBLY — assembly.care
   Static build v1. Editorial / document-like.
   No keyframe animations, no JS dependency — robust by design.
   Built on the Assembly design system (design.md).
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Geist:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --paper:        #F6F5F3;
  --paper-2:      #EEEDEA;
  --paper-rule:   #E2E0DA;
  --ink:          #16150F;
  --ink-2:        #3C3A33;
  --ink-3:        #79776D;
  --ink-4:        #ABA99E;

  --accent:       oklch(0.52 0.08 160);
  --accent-deep:  oklch(0.36 0.045 160);

  /* Dark console surface (report previews) */
  --console:        #0E0F0C;
  --console-ink:    #F6F5F3;
  --console-rule:   rgba(246,245,243,0.10);
  --console-rule-2: rgba(246,245,243,0.16);
  --console-mute:   rgba(246,245,243,0.45);
  --signal:         oklch(0.74 0.13 158);

  --serif: 'Instrument Serif', 'Times New Roman', serif;
  --sans:  'Geist', ui-sans-serif, system-ui, sans-serif;
  --mono:  'JetBrains Mono', ui-monospace, monospace;

  --rule:     1px solid var(--paper-rule);
  --rule-ink: 1px solid var(--ink);
  --bar-h:    64px;
  --edge:     clamp(20px, 5vw, 64px);
  --maxw:     1160px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "cv11";
}

/* faint paper grain (static overlay) */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 200;
  background-image: radial-gradient(rgba(20,19,15,0.020) 1px, transparent 1px);
  background-size: 3px 3px;
  opacity: 0.4;
}

::selection { background: var(--accent); color: var(--paper); }

a { color: inherit; }
img, svg { display: block; max-width: 100%; }

.tnum { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* =========================================================
   Top bar
   ========================================================= */
.topbar {
  position: sticky;
  top: 0;
  z-index: 100;
  height: var(--bar-h);
  display: flex;
  align-items: center;
  gap: 32px;
  padding: 0 var(--edge);
  background: var(--paper);
  border-bottom: var(--rule-ink);
}
.wordmark { display: flex; align-items: center; gap: 11px; text-decoration: none; color: var(--ink); }
.wordmark .monogram { width: 17px; height: 21px; color: var(--ink); }
.wordmark .name { font-family: var(--serif); font-size: 23px; letter-spacing: 0.01em; line-height: 1; }

.nav { display: flex; gap: 26px; margin-left: auto; font-size: 13.5px; color: var(--ink-2); }
.nav a { position: relative; text-decoration: none; padding: 4px 0; color: inherit; transition: color 0.15s ease; }
.nav a:hover { color: var(--ink); }
.nav a.active { color: var(--ink); }
.nav a.active::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0;
  height: 1px; background: var(--accent-deep);
}
.nav-cta { margin-left: 4px; }

/* mobile navigation — CSS-only disclosure (checkbox hack, no JS) */
.nav-toggle { display: none; }
.nav-burger { display: none; }
@media (max-width: 940px) {
  .nav-burger {
    display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 44px; height: 44px; margin-left: auto; padding: 11px 10px;
    cursor: pointer; -webkit-tap-highlight-color: transparent;
  }
  .nav-burger span { display: block; width: 100%; height: 1.5px; background: var(--ink); transition: transform 0.22s ease, opacity 0.18s ease; }
  .topbar .nav-cta { display: none; }
  .nav {
    display: flex; flex-direction: column; gap: 0; margin-left: 0; font-size: 16px;
    position: absolute; top: var(--bar-h); left: 0; right: 0;
    background: var(--paper); border-bottom: var(--rule-ink);
    padding: 2px var(--edge) 14px;
    box-shadow: 0 22px 34px -24px rgba(20,19,15,0.55);
    transform: translateY(-10px); opacity: 0; visibility: hidden;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s linear 0.2s;
    max-height: calc(100dvh - var(--bar-h)); overflow-y: auto;
  }
  .nav a { padding: 15px 2px; color: var(--ink-2); border-bottom: var(--rule); }
  .nav a:last-child { border-bottom: none; }
  .nav a.active { color: var(--accent-deep); }
  .nav a.active::after { display: none; }
  .nav-toggle:checked ~ .nav {
    transform: translateY(0); opacity: 1; visibility: visible;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s;
  }
  .nav-toggle:checked ~ .nav-burger span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
  .nav-toggle:checked ~ .nav-burger span:nth-child(2) { opacity: 0; }
  .nav-toggle:checked ~ .nav-burger span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
}

/* =========================================================
   Buttons
   ========================================================= */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  height: 46px; padding: 0 22px;
  font-family: var(--sans); font-size: 14px; letter-spacing: 0.005em;
  color: var(--ink); background: transparent;
  border: 1px solid var(--ink);
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background 0.15s ease, color 0.15s ease;
}
.btn:hover { background: var(--ink); color: var(--paper); }
.btn.primary { background: var(--ink); color: var(--paper); }
.btn.primary:hover { background: var(--ink-2); }
/* Accent (forest) — reserve for the single page-level primary action */
.btn.accent { background: var(--accent-deep); border-color: var(--accent-deep); color: var(--paper); }
.btn.accent:hover { background: var(--accent); border-color: var(--accent); color: var(--paper); }
/* on dark surfaces the accent uses bright forest signal */
.section-ink .btn.accent, .cm-dark .btn.accent, .hh-right .btn.accent, .rpt .btn.accent {
  background: var(--signal); border-color: var(--signal); color: var(--ink);
}
.section-ink .btn.accent:hover, .cm-dark .btn.accent:hover, .hh-right .btn.accent:hover, .rpt .btn.accent:hover {
  background: oklch(0.80 0.13 158); border-color: oklch(0.80 0.13 158); color: var(--ink);
}
.btn .arr { font-family: var(--mono); font-size: 13px; }
.btn.small { height: 38px; padding: 0 15px; font-size: 13px; }

.arrowlink {
  display: inline-flex; align-items: center; gap: 9px;
  text-decoration: none; color: var(--accent-deep); font-size: 15px; width: fit-content;
  border-bottom: 1px solid transparent; transition: border-color 0.15s ease;
}
.arrowlink:hover { border-bottom-color: color-mix(in oklab, var(--accent-deep) 45%, transparent); }
.arrowlink .arr { font-family: var(--mono); }

/* =========================================================
   Typographic primitives
   ========================================================= */
.label, .sec-num {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--ink-3);
}
.label.accent, .sec-num.accent { color: var(--accent-deep); }

.display { font-family: var(--serif); font-weight: 400; letter-spacing: -0.02em; line-height: 1.0; color: var(--ink); }
.display em { font-style: italic; font-family: var(--serif); color: var(--accent-deep); }

h1.display { font-size: clamp(38px, 5.4vw, 70px); }
h2.display { font-size: clamp(28px, 4vw, 48px); }
h3.display { font-size: clamp(23px, 3vw, 34px); }

.lede { font-size: clamp(17px, 1.5vw, 21px); line-height: 1.5; color: var(--ink-2); font-weight: 300; }
.body p { color: var(--ink-2); font-weight: 300; }
.body p + p { margin-top: 1.1em; }
.body em, .em { font-style: italic; color: var(--accent-deep); font-family: var(--serif); font-size: 1.06em; }

.rule-label { display: flex; align-items: center; gap: 18px; color: var(--ink-3); font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; }
.rule-label::before, .rule-label::after { content: ""; height: 1px; background: var(--paper-rule); flex: 1; }

/* =========================================================
   Layout
   ========================================================= */
main { position: relative; z-index: 2; }
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--edge); }

section { position: relative; border-top: var(--rule); }
section.section-ink { border-top: var(--rule-ink); }
.pad { padding: clamp(56px, 8vw, 116px) 0; }
.pad-sm { padding: clamp(40px, 5vw, 72px) 0; }

.sec-head { display: flex; align-items: baseline; gap: 16px; margin-bottom: clamp(26px, 4vw, 48px); }
.sec-head .sec-num { white-space: nowrap; }
.sec-head .rl { flex: 1; height: 1px; background: var(--paper-rule); align-self: center; }

.split { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); gap: clamp(32px, 6vw, 80px); align-items: start; }
.split.tight { gap: clamp(28px, 4vw, 52px); }
@media (max-width: 820px) { .split { grid-template-columns: 1fr; gap: 28px; } }

/* =========================================================
   Hero
   ========================================================= */
.hero { padding-top: clamp(48px, 8vw, 104px); padding-bottom: clamp(44px, 6vw, 88px); border-top: none; }
.hero .eyebrow { display: inline-flex; align-items: center; gap: 12px; margin-bottom: clamp(24px, 4vw, 38px); }
.hero .eyebrow .pip { width: 6px; height: 6px; background: var(--accent); border-radius: 50%; }
.hero h1 { margin-bottom: clamp(22px, 3vw, 30px); }
.hero .lede { max-width: 56ch; margin-bottom: clamp(28px, 4vw, 38px); }
.cta-row { display: flex; gap: 14px; flex-wrap: wrap; }

/* =========================================================
   Lists
   ========================================================= */
.flowlist { list-style: none; border-top: var(--rule); }
.flowlist li {
  display: grid; grid-template-columns: 22px 1fr; gap: 14px;
  padding: 16px 0; border-bottom: var(--rule);
  color: var(--ink-2); font-weight: 300;
}
.flowlist li .mk { font-family: var(--mono); color: var(--accent-deep); font-size: 13px; }
.flowlist li b { color: var(--ink); font-weight: 500; }
.flowlist li .tag { display: inline-block; margin-left: 8px; font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent-deep); border: 1px solid var(--accent); padding: 2px 6px; vertical-align: middle; }

/* "What we run" definition rows */
.deflist { border-top: var(--rule-ink); }
.deflist .row { display: grid; grid-template-columns: minmax(0, 0.42fr) minmax(0, 1fr); gap: clamp(16px, 3vw, 44px); padding: 22px 0; border-bottom: var(--rule); align-items: baseline; }
.deflist .row .term { font-family: var(--serif); font-size: clamp(20px, 2vw, 26px); line-height: 1.05; letter-spacing: -0.01em; }
.deflist .row .def { color: var(--ink-2); font-weight: 300; }
@media (max-width: 720px) { .deflist .row { grid-template-columns: 1fr; gap: 8px; } }

/* =========================================================
   What We Do — big numbered blocks
   ========================================================= */
.blocks { border-top: var(--rule-ink); }
.block { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 72px); padding: clamp(36px, 5vw, 60px) 0; border-bottom: var(--rule); align-items: start; }
.block .b-head .b-num { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; color: var(--accent-deep); display: block; margin-bottom: 14px; }
.block .b-head h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(26px, 3vw, 38px); letter-spacing: -0.01em; line-height: 1.02; }
.block .b-head .b-sub { color: var(--ink-2); font-weight: 300; margin-top: 16px; max-width: 34ch; }
.block .b-body .lead { color: var(--ink); font-weight: 400; margin-bottom: 4px; }
.block .b-body p.note { color: var(--ink-3); font-weight: 300; font-style: italic; margin-top: 16px; }
@media (max-width: 760px) { .block { grid-template-columns: 1fr; gap: 22px; } }

/* =========================================================
   Results / case studies
   ========================================================= */
.case { padding: clamp(34px, 5vw, 56px) 0; border-bottom: var(--rule); }
.case:first-child { border-top: var(--rule-ink); }
.c-cols { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); gap: clamp(28px, 5vw, 56px); align-items: start; }
@media (max-width: 880px) { .c-cols { grid-template-columns: 1fr; gap: 28px; } }
.case .c-type { display: block; font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 18px; }
.case h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(25px, 3vw, 36px); letter-spacing: -0.01em; line-height: 1.05; margin: 0 0 24px; max-width: 22ch; }
.case .c-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(20px, 4vw, 48px) clamp(28px, 5vw, 64px); }
.case .c-item .k { font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 8px; }
.case .c-item p { color: var(--ink-2); font-weight: 300; }
.case .c-item.result p { color: var(--ink); }
.case .c-item.result .ph { color: var(--accent-deep); font-style: italic; }
.case .c-cta { margin-top: 28px; }
@media (max-width: 640px) { .case .c-grid { grid-template-columns: 1fr; gap: 18px; } }

/* email capture */
.capture { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.capture input[type="email"] {
  height: 46px; min-width: 260px; flex: 1; padding: 0 16px;
  font-family: var(--sans); font-size: 14px; color: var(--ink);
  background: var(--paper); border: 1px solid var(--ink); outline: none;
}
.capture input[type="email"]::placeholder { color: var(--ink-4); }
.capture input[type="email"]:focus { border-color: var(--accent-deep); }
.consent-line { font-size: 12.5px; color: var(--ink-3); font-weight: 300; margin-top: 12px; max-width: 60ch; }
.privacy-note { margin-top: clamp(32px, 4vw, 48px); font-family: var(--mono); font-size: 10.5px; line-height: 1.6; letter-spacing: 0.02em; color: var(--ink-4); max-width: none; }

/* =========================================================
   How It Works — steps
   ========================================================= */
.steps { border-top: var(--rule); }
.step { display: grid; grid-template-columns: 72px 1fr; gap: clamp(20px, 4vw, 52px); padding: clamp(26px, 4vw, 40px) 0; border-bottom: var(--rule); align-items: start; }
.step .s-mark { display: flex; flex-direction: column; gap: 14px; }
.step .s-icon { width: 30px; height: 30px; color: var(--accent-deep); }
.step .s-icon svg { width: 100%; height: 100%; stroke: currentColor; stroke-width: 1.6; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.step .s-num { font-family: var(--mono); font-size: 11px; letter-spacing: 0.14em; color: var(--ink-3); }
.step h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(23px, 2.6vw, 30px); letter-spacing: -0.01em; margin-bottom: 12px; }
.step p { color: var(--ink-2); font-weight: 300; max-width: 62ch; }
@media (max-width: 640px) { .step { grid-template-columns: 1fr; gap: 12px; } }

/* =========================================================
   Pricing
   ========================================================= */
.diagnostic-band { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; padding: clamp(28px, 4vw, 40px) 0; border-top: var(--rule-ink); border-bottom: var(--rule-ink); }
.diagnostic-band h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(24px, 3vw, 34px); letter-spacing: -0.01em; }
.diagnostic-band p { color: var(--ink-2); font-weight: 300; margin-top: 10px; max-width: 56ch; }
.diagnostic-band .price { font-family: var(--serif); font-size: clamp(28px, 3vw, 40px); white-space: nowrap; }
.diagnostic-band .price small { font-family: var(--mono); font-size: 11px; color: var(--ink-3); display: block; text-transform: uppercase; letter-spacing: 0.1em; margin-top: 6px; }
@media (max-width: 720px) { .diagnostic-band { grid-template-columns: 1fr; } }

.tiers { border-top: var(--rule); }
.tier { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.25fr) auto; gap: clamp(20px, 4vw, 52px); padding: clamp(32px, 4vw, 48px) 0; border-bottom: var(--rule); align-items: start; }
.tier .t-id { display: flex; flex-direction: column; gap: 14px; }
.tier .t-id h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(27px, 3vw, 38px); letter-spacing: -0.01em; line-height: 1; }
.tier .t-id .t-price { font-family: var(--mono); font-size: 14px; color: var(--ink); }
.tier .t-id .badge { font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.13em; text-transform: uppercase; color: var(--accent-deep); border: 1px solid var(--accent); padding: 4px 8px; width: fit-content; }
.tier .t-for { color: var(--ink); font-weight: 400; margin-bottom: 18px; }
.tier .col-label { font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); margin: 14px 0 10px; }
.tier ul { list-style: none; display: grid; gap: 8px; }
.tier ul li { display: grid; grid-template-columns: 16px 1fr; gap: 9px; font-size: 14.5px; color: var(--ink-2); font-weight: 300; }
.tier ul li .mk { font-family: var(--mono); color: var(--accent-deep); font-size: 12px; }
.tier .t-note { font-size: 13px; color: var(--ink-3); font-weight: 300; font-style: italic; margin-top: 18px; }
.tier .t-cta { display: flex; flex-direction: column; gap: 10px; min-width: 180px; }
@media (max-width: 940px) { .tier { grid-template-columns: 1fr; gap: 18px; } .tier .t-cta { min-width: 0; } }

/* =========================================================
   Contact / About
   ========================================================= */
.commitments { display: grid; grid-template-columns: repeat(3, 1fr); border-top: var(--rule-ink); border-left: var(--rule); }
.commitments .cm { border-right: var(--rule); border-bottom: var(--rule); padding: 30px clamp(18px, 2vw, 30px) 36px; }
.commitments .cm .cm-k { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent-deep); }
.commitments .cm h2 { font-family: var(--serif); font-weight: 400; font-size: 22px; margin: 14px 0 10px; }
.commitments .cm p { color: var(--ink-2); font-weight: 300; font-size: 14.5px; }
@media (max-width: 760px) { .commitments { grid-template-columns: 1fr; } }

/* dark band variant for the commitments */
.cm-dark { background: var(--console); color: var(--console-ink); position: relative; overflow: hidden; border-top: var(--rule-ink); }
.cm-dark::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(var(--console-rule) 1px, transparent 1px), linear-gradient(90deg, var(--console-rule) 1px, transparent 1px);
  background-size: 38px 38px;
  -webkit-mask-image: radial-gradient(130% 120% at 80% 0%, #000 30%, transparent 95%);
  mask-image: radial-gradient(130% 120% at 80% 0%, #000 30%, transparent 95%); }
.cm-dark .wrap { position: relative; z-index: 1; }
.cm-dark .sec-num { color: var(--signal); }
.cm-dark .sec-head .rl { background: var(--console-rule-2); }
.cm-dark .commitments { border-top-color: var(--console-rule-2); border-left-color: var(--console-rule); }
.cm-dark .commitments .cm { border-right-color: var(--console-rule); border-bottom-color: var(--console-rule); }
.cm-dark .commitments .cm .cm-k { color: var(--signal); }
.cm-dark .cm h2 { color: var(--console-ink); }
.cm-dark .cm p { color: var(--console-mute); }

.founder { display: grid; grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.founder .f-id .name { font-family: var(--serif); font-size: clamp(28px, 3.2vw, 40px); font-weight: 400; line-height: 1.02; letter-spacing: -0.01em; }
.founder .f-id .role { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); margin-top: 12px; }
.founder .f-body p { color: var(--ink-2); font-weight: 300; font-size: 17px; }
.founder .f-body p + p { margin-top: 1em; }
.founder .f-body .sign { font-family: var(--serif); font-size: 22px; color: var(--ink); margin-top: 18px; }
@media (max-width: 760px) { .founder { grid-template-columns: 1fr; gap: 22px; } }

.contact-links { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 8px; }

/* =========================================================
   Closer
   ========================================================= */
.closer { text-align: center; padding: clamp(64px, 9vw, 128px) 0; border-top: var(--rule-ink); }
.closer h2 { margin: 0 auto clamp(18px, 3vw, 26px); max-width: 20ch; }
.closer p { color: var(--ink-2); font-weight: 300; max-width: 50ch; margin: 0 auto clamp(28px, 4vw, 38px); font-size: 17px; }
.closer .cta-row { justify-content: center; }

/* =========================================================
   Footer
   ========================================================= */
footer { border-top: var(--rule-ink); background: var(--paper); position: relative; z-index: 2; }
.foot { display: grid; grid-template-columns: 1.8fr 1fr 1fr; gap: 40px; padding: clamp(44px, 6vw, 68px) 0 30px; }
.foot .f-brand .wordmark { margin-bottom: 18px; }
.foot .f-brand p { color: var(--ink-3); font-weight: 300; font-size: 14px; max-width: 34ch; }
.foot .f-col .f-h { font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-4); margin-bottom: 16px; }
.foot .f-col a { display: block; text-decoration: none; color: var(--ink-2); font-size: 14px; padding: 5px 0; width: fit-content; transition: color 0.15s ease; }
.foot .f-col a:hover { color: var(--accent-deep); }
.foot-base { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; padding: 20px 0 40px; border-top: var(--rule); font-family: var(--mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-4); }
.foot-base .foot-link { color: inherit; text-decoration: none; transition: color 0.15s ease; }
.foot-base .foot-link:hover { color: var(--accent-deep); }
@media (max-width: 760px) { .foot { grid-template-columns: 1fr 1fr; gap: 28px; } }

/* =========================================================
   Accessibility — visible focus states
   ========================================================= */
a:focus-visible, button:focus-visible, input:focus-visible, .btn:focus-visible {
  outline: 2px solid var(--accent-deep);
  outline-offset: 3px;
}

/* tabular figures on all prices */
.t-price, .pcard .price, .diagnostic-band .price, .pnetwork .price { font-variant-numeric: tabular-nums; }

/* =========================================================
   What We Do — headline-led blocks (override)
   ========================================================= */
.block .b-head .b-num { font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em; color: var(--accent-deep); display: block; margin-bottom: 16px; }
.block .b-head h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(32px, 4.2vw, 50px); letter-spacing: -0.02em; line-height: 0.98; }
.block .b-head .b-tag { color: var(--ink); font-weight: 400; font-size: clamp(16px, 1.4vw, 18px); margin-top: 18px; max-width: 36ch; }
.block .b-head .b-note { color: var(--ink-3); font-weight: 300; font-size: 14px; font-style: italic; margin-top: 14px; max-width: 40ch; }

/* =========================================================
   Pricing — diagnostic band + tier table + network band
   ========================================================= */
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: var(--rule-ink); border-left: var(--rule); }
.pcard {
  border-right: var(--rule); border-bottom: var(--rule);
  padding: 32px clamp(20px, 2vw, 30px) 28px;
  display: flex; flex-direction: column; min-width: 0;
}
.pcard.featured { background: var(--console); color: var(--console-ink); position: relative; box-shadow: inset 0 3px 0 0 var(--signal); }
.pcard.featured::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(var(--console-rule) 1px, transparent 1px), linear-gradient(90deg, var(--console-rule) 1px, transparent 1px);
  background-size: 34px 34px;
  -webkit-mask-image: radial-gradient(130% 90% at 80% 0%, #000 30%, transparent 92%);
  mask-image: radial-gradient(130% 90% at 80% 0%, #000 30%, transparent 92%); }
.pcard.featured > * { position: relative; }
.pcard.featured .p-name { color: var(--console-ink); }
.pcard.featured .price { color: var(--signal); }
.pcard.featured .price .per { color: var(--console-mute); }
.pcard.featured .badge { color: var(--signal); border-color: color-mix(in oklab, var(--signal) 55%, transparent); }
.pcard.featured .p-for { color: var(--console-mute); border-bottom-color: var(--console-rule-2); }
.pcard.featured .col-label { color: var(--console-mute); }
.pcard.featured ul li { color: rgba(242,237,227,0.82); }
.pcard.featured ul li .mk { color: var(--signal); }
.pcard.featured .p-note { color: rgba(242,237,227,0.42); }
.pcard.featured .p-cta .btn { background: var(--signal); border-color: var(--signal); color: #14130F; }
.pcard.featured .p-cta .btn:hover { background: var(--console-ink); border-color: var(--console-ink); color: #14130F; }
.pcard .p-name { font-family: var(--serif); font-weight: 400; font-size: clamp(25px, 2.4vw, 31px); letter-spacing: -0.01em; line-height: 1; }
.pcard .badge { font-family: var(--mono); font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent-deep); border: 1px solid var(--accent); padding: 4px 7px; width: fit-content; margin-top: 12px; }
.pcard .price { font-family: var(--serif); font-size: clamp(30px, 3vw, 40px); letter-spacing: -0.02em; line-height: 1; margin-top: 18px; }
.pcard .price .per { font-family: var(--mono); font-size: 12px; color: var(--ink-3); letter-spacing: 0.04em; margin-left: 4px; }
.pcard .p-for { color: var(--ink-2); font-weight: 300; font-size: 14px; margin: 16px 0 4px; padding-bottom: 18px; border-bottom: var(--rule); min-height: 64px; }
.pcard .col-label { font-family: var(--mono); font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); margin: 18px 0 10px; }
.pcard ul { list-style: none; display: grid; gap: 8px; }
.pcard ul li { display: grid; grid-template-columns: 15px 1fr; gap: 9px; font-size: 13.5px; color: var(--ink-2); font-weight: 300; line-height: 1.4; }
.pcard ul li .mk { font-family: var(--mono); color: var(--accent-deep); font-size: 11px; }
.pcard .p-note { color: var(--ink-3); font-weight: 300; font-size: 12.5px; font-style: italic; margin-top: 18px; }
.pcard ul.p-cap { margin-top: 14px; }
.pcard .p-cta { margin-top: auto; padding-top: 22px; }
.pcard .p-cta .btn { width: 100%; justify-content: center; }
@media (max-width: 900px) { .pricing-grid { grid-template-columns: 1fr; } .pcard .p-for { min-height: 0; } }

.pnetwork { display: grid; grid-template-columns: minmax(0,0.8fr) minmax(0,1.4fr) auto; gap: clamp(20px,4vw,52px); align-items: center; padding: clamp(28px,3.5vw,40px) 0; border-bottom: var(--rule-ink); }
.pnetwork .n-id .p-name { font-family: var(--serif); font-weight: 400; font-size: clamp(25px,2.6vw,32px); letter-spacing: -0.01em; }
.pnetwork .n-id .price { font-family: var(--mono); font-size: 14px; color: var(--ink); margin-top: 8px; }
.pnetwork .n-id .p-for { color: var(--ink-2); font-weight: 300; font-size: 14px; margin-top: 10px; }
.pnetwork ul { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 24px; }
.pnetwork ul li { display: grid; grid-template-columns: 15px 1fr; gap: 9px; font-size: 14px; color: var(--ink-2); font-weight: 300; }
.pnetwork ul li .mk { font-family: var(--mono); color: var(--accent-deep); font-size: 11px; }
@media (max-width: 820px) { .pnetwork { grid-template-columns: 1fr; gap: 18px; } .pnetwork ul { grid-template-columns: 1fr; } }

/* =========================================================
   How It Works — cycle illustration (CSS-only, no filters)
   ========================================================= */
.cycle-fig { width: 100%; max-width: 680px; margin: 0 auto; }
.cycle-fig svg { width: 100%; height: auto; display: block; overflow: visible; }
.cycle-fig .c-ticks { fill: none; stroke: var(--paper-rule); stroke-width: 5; stroke-dasharray: 1 11; opacity: 0.55; }
.cycle-fig .c-track { fill: none; stroke: var(--paper-rule); stroke-width: 1.5; }
.cycle-fig .c-rotor { fill: none; stroke: var(--accent-deep); stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 130 999; transform-origin: 350px 200px; animation: cyc-spin 8s linear infinite; }
.cycle-fig .c-divider { stroke: var(--paper-rule); stroke-width: 1; stroke-dasharray: 2 6; }
.cycle-fig .c-tail { fill: none; stroke: var(--ink); stroke-width: 1.5; stroke-dasharray: 108; stroke-dashoffset: 0; animation: tail-draw 0.9s ease-out 0.25s both; }
.cycle-fig .c-arrow { fill: var(--ink); opacity: 0; animation: arrow-in 0.3s ease-out 1.05s forwards; }
.cycle-fig .c-node { fill: var(--ink); }
.cycle-fig .c-ring { fill: var(--paper); stroke: var(--accent-deep); stroke-width: 2.5; }
.cycle-fig .c-lbl { font-family: var(--serif); font-size: 26px; fill: var(--ink); }
.cycle-fig .c-sub { font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; fill: var(--ink-3); text-transform: uppercase; }
.cycle-fig .c-centre { font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em; fill: var(--ink-3); text-transform: uppercase; }
.cycle-fig .c-centre-big { font-family: var(--serif); font-size: 38px; fill: var(--accent-deep); }
@keyframes cyc-spin { to { transform: rotate(360deg); } }
@keyframes tail-draw { from { stroke-dashoffset: 108; } to { stroke-dashoffset: 0; } }
@keyframes arrow-in { to { opacity: 1; } }

/* How It Works — full-bleed split hero (paper left, dark cycle right) */
.hiw-hero { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; min-height: clamp(500px, 68vh, 740px); border-bottom: var(--rule-ink); }
.hh-left { display: flex; flex-direction: column; justify-content: center; padding-block: clamp(48px, 7vw, 96px); padding-left: max(var(--edge), calc((100vw - var(--maxw)) / 2)); padding-right: clamp(32px, 4vw, 64px); }
.hh-right { position: relative; overflow: hidden; background: var(--console); color: var(--console-ink); display: flex; flex-direction: column; justify-content: center; padding-block: clamp(36px, 5vw, 64px); padding-right: max(var(--edge), calc((100vw - var(--maxw)) / 2)); padding-left: clamp(30px, 4vw, 56px); }
.hh-right::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(var(--console-rule) 1px, transparent 1px), linear-gradient(90deg, var(--console-rule) 1px, transparent 1px);
  background-size: 38px 38px;
  -webkit-mask-image: radial-gradient(135% 105% at 75% 8%, #000 42%, transparent 100%);
  mask-image: radial-gradient(135% 105% at 75% 8%, #000 42%, transparent 100%); }
.hh-right::after { content: ""; position: absolute; right: -160px; top: -120px; width: 440px; height: 440px; pointer-events: none; background: radial-gradient(circle, oklch(0.62 0.11 158 / 0.16), transparent 60%); }
.hh-right .hh-inner { position: relative; z-index: 1; width: 100%; max-width: 560px; margin: 0 auto; }
.hh-right .label { color: var(--console-mute); }
.hh-right .cycle-fig { max-width: 560px; }

/* dark cycle colours within the right pane */
.hh-right .c-ticks { stroke: rgba(242,237,227,0.18); }
.hh-right .c-track { stroke: rgba(242,237,227,0.14); }
.hh-right .c-rotor { stroke: var(--signal); }
.hh-right .c-divider { stroke: rgba(242,237,227,0.16); }
.hh-right .c-tail { stroke: var(--console-ink); }
.hh-right .c-arrow { fill: var(--console-ink); }
.hh-right .c-node { fill: var(--console-ink); }
.hh-right .c-ring { fill: var(--console); stroke: var(--signal); }
.hh-right .c-lbl { fill: var(--console-ink); }
.hh-right .c-centre { fill: var(--console-mute); }
.hh-right .c-centre-big { fill: var(--signal); }

/* dark dashboard (.rpt) reused directly inside a full-bleed pane */
.hh-right .rpt { background: transparent; border: 0; }
.hh-right .rpt::before, .hh-right .rpt::after { display: none; }
.hh-right .rpt-head { padding-left: 0; padding-right: 0; }
.hh-right .rpt-body { padding-left: 0; padding-right: 0; gap: 18px; }

/* Home hero: give the text side more room than the dashboard */
.home-hero { grid-template-columns: 1.12fr 0.88fr; }
@media (max-width: 860px) { .home-hero { grid-template-columns: 1fr; } }

/* Home dashboard: sequential "read-out" reveal, item by item */
.hh-right .rpt-gauge .side > div { opacity: 0; transform: translateY(6px); animation: rptrise 0.5s ease forwards; }
.hh-right .rpt-gauge .side > div:nth-child(1) { animation-delay: 0.55s; }
.hh-right .rpt-gauge .side > div:nth-child(2) { animation-delay: 0.72s; }
.hh-right .rpt-kpis .kpi { opacity: 0; transform: translateY(6px); animation: rptrise 0.5s ease forwards; }
.hh-right .rpt-kpis .kpi:nth-child(1) { animation-delay: 0.92s; }
.hh-right .rpt-kpis .kpi:nth-child(2) { animation-delay: 1.06s; }
.hh-right .rpt-rows .row:nth-child(1) { animation-delay: 1.55s; }
.hh-right .rpt-rows .row:nth-child(2) { animation-delay: 1.70s; }
.hh-right .rpt-rows .row:nth-child(3) { animation-delay: 1.85s; }
.hh-right .rpt-rows .row:nth-child(4) { animation-delay: 2.00s; }
.hh-right .rpt-rows .row:nth-child(5) { animation-delay: 2.15s; }
.hh-right .rpt-ledger::after { animation-delay: 1.7s; }

/* three mini circular gauges (Home dashboard) */
.mini-gauges { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.minigauge { display: flex; flex-direction: column; align-items: center; text-align: center; }
.minigauge svg { width: 74px; height: 74px; }
.minigauge .mg-bg { fill: none; stroke: rgba(242,237,227,0.10); stroke-width: 6; }
.minigauge .mg-fg { fill: none; stroke: var(--signal); stroke-width: 6; stroke-linecap: round; stroke-dasharray: 201; animation: ringdraw 1.3s var(--ease-out, ease-out) forwards; }
.minigauge .mg-val { font-family: var(--serif); font-size: 15px; fill: var(--console-ink); }
.minigauge .mg-k { font-family: var(--mono); font-size: 8px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--console-mute); margin-top: 9px; line-height: 1.35; max-width: 11ch; }
@keyframes ringdraw { from { stroke-dashoffset: 201; } }
/* stagger the three within the read-out */
.hh-right .minigauge { opacity: 0; transform: translateY(6px); animation: rptrise 0.5s ease forwards; }
.hh-right .mg-a .minigauge:nth-child(1) { animation-delay: 0.50s; }
.hh-right .mg-a .minigauge:nth-child(2) { animation-delay: 0.63s; }
.hh-right .mg-a .minigauge:nth-child(3) { animation-delay: 0.76s; }
.hh-right .mg-b .minigauge:nth-child(1) { animation-delay: 0.98s; }
.hh-right .mg-b .minigauge:nth-child(2) { animation-delay: 1.11s; }
.hh-right .mg-b .minigauge:nth-child(3) { animation-delay: 1.24s; }
.hh-right .mg-a .mg-fg { animation-delay: 0.58s; }
.hh-right .mg-b .mg-fg { animation-delay: 1.06s; }

@media (max-width: 860px) {
  .hiw-hero { grid-template-columns: 1fr; min-height: 0; }
  .hh-left { padding: clamp(40px, 9vw, 72px) var(--edge); }
  .hh-right { padding: clamp(36px, 8vw, 56px) var(--edge); }
}

.cycle-panel { position: relative; }

/* =========================================================
   Contact — details card
   ========================================================= */
.contact-card { border-top: var(--rule-ink); }
.contact-card .crow { display: grid; grid-template-columns: minmax(0,0.34fr) minmax(0,1fr); gap: clamp(16px,3vw,40px); align-items: baseline; padding: 20px 0; border-bottom: var(--rule); }
.contact-card .crow .ck { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); }
.contact-card .crow .cv { font-size: 17px; color: var(--ink); }
.contact-card .crow .cv a { color: var(--accent-deep); text-decoration: none; border-bottom: 1px solid transparent; transition: border-color 0.15s ease; }
.contact-card .crow .cv a:hover { border-bottom-color: color-mix(in oklab, var(--accent-deep) 45%, transparent); }
.contact-card .crow .cv .ph { color: var(--ink-4); font-style: italic; }
@media (max-width: 640px) { .contact-card .crow { grid-template-columns: 1fr; gap: 6px; } }

/* What We Do — headline icons */
.block .b-head .b-icon { width: 30px; height: 30px; color: var(--accent-deep); margin-bottom: 18px; }
.block .b-head .b-icon svg { width: 100%; height: 100%; display: block; stroke: currentColor; stroke-width: 1.6; fill: none; stroke-linecap: round; stroke-linejoin: round; }

/* Results — refined dark report card (dashboard style, subtle motion) */
.rpt { background: var(--console); color: var(--console-ink); border: 1px solid var(--ink); position: relative; overflow: hidden; font-family: var(--mono); }
.rpt::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(var(--console-rule) 1px, transparent 1px), linear-gradient(90deg, var(--console-rule) 1px, transparent 1px);
  background-size: 34px 34px;
  -webkit-mask-image: radial-gradient(135% 100% at 78% 0%, #000 28%, transparent 92%);
  mask-image: radial-gradient(135% 100% at 78% 0%, #000 28%, transparent 92%); }
.rpt::after { content: ""; position: absolute; right: -130px; top: -130px; width: 320px; height: 320px; pointer-events: none; background: radial-gradient(circle, oklch(0.62 0.11 158 / 0.15), transparent 60%); }
.rpt-head { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 16px; border-bottom: 1px solid var(--console-rule-2); font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--console-mute); }
.rpt-head .l { display: inline-flex; align-items: center; gap: 7px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rpt-head .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--signal); flex-shrink: 0; animation: rptpulse 2.2s ease-in-out infinite; }
.rpt-body { position: relative; padding: 16px; display: flex; flex-direction: column; gap: 16px; }
.rpt .cap { font-size: 8.5px; letter-spacing: 0.13em; text-transform: uppercase; color: var(--console-mute); margin-bottom: 11px; }

/* KPI tiles (2×2) */
.rpt-kpis { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--console-rule-2); }
.rpt-kpis .kpi { padding: 13px 14px; border-right: 1px solid var(--console-rule-2); border-top: 1px solid var(--console-rule-2); min-width: 0; }
.rpt-kpis .kpi:nth-child(-n+2) { border-top: 0; }
.rpt-kpis .kpi:nth-child(2n) { border-right: 0; }
.rpt-kpis .kpi .k { font-size: 8.5px; letter-spacing: 0.13em; text-transform: uppercase; color: var(--console-mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rpt-kpis .kpi .v { font-family: var(--serif); font-size: clamp(23px, 2.6vw, 30px); line-height: 1; color: var(--signal); margin-top: 9px; font-variant-numeric: tabular-nums; opacity: 0; transform: translateY(6px); animation: rptrise 0.6s ease forwards; }
.rpt-kpis .kpi .v .u { font-size: 0.5em; color: var(--console-mute); }
.rpt-kpis .kpi .d { font-size: 8.5px; letter-spacing: 0.05em; color: rgba(242,237,227,0.4); margin-top: 7px; }
.rpt-kpis .kpi:nth-child(1) .v { animation-delay: 0.05s; }
.rpt-kpis .kpi:nth-child(2) .v { animation-delay: 0.15s; }
.rpt-kpis .kpi:nth-child(3) .v { animation-delay: 0.25s; }
.rpt-kpis .kpi:nth-child(4) .v { animation-delay: 0.35s; }

/* big stat */
.rpt .stat .k { font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--console-mute); }
.rpt .stat .v { font-family: var(--serif); font-size: clamp(34px, 4.4vw, 46px); line-height: 0.95; color: var(--signal); margin-top: 9px; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.rpt .stat .v .u { font-size: 0.44em; color: var(--console-mute); margin-left: 1px; }

/* mini bar chart */
.rpt .bars { display: flex; align-items: flex-end; gap: 6px; height: 64px; }
.rpt .bars span { flex: 1; background: rgba(242,237,227,0.14); min-width: 0; transform-origin: bottom; transform: scaleY(0); animation: rptbar 0.7s var(--ease-out, ease-out) forwards; }
.rpt .bars span.hi { background: var(--signal); }
.rpt .bars span:nth-child(1){animation-delay:.1s}.rpt .bars span:nth-child(2){animation-delay:.17s}.rpt .bars span:nth-child(3){animation-delay:.24s}.rpt .bars span:nth-child(4){animation-delay:.31s}.rpt .bars span:nth-child(5){animation-delay:.38s}.rpt .bars span:nth-child(6){animation-delay:.45s}

/* tick-marked gauge */
.rpt-gauge { display: grid; grid-template-columns: 116px 1fr; gap: 18px; align-items: center; }
.rpt-gauge svg { width: 116px; height: 116px; }
.rpt-gauge .ticks { fill: none; stroke: rgba(242,237,227,0.22); stroke-width: 7; stroke-dasharray: 1.4 10.4; }
.rpt-gauge .arc-bg { fill: none; stroke: rgba(242,237,227,0.10); stroke-width: 8; }
.rpt-gauge .arc-fg { fill: none; stroke: var(--signal); stroke-width: 8; stroke-linecap: round; stroke-dasharray: 490; stroke-dashoffset: 490; animation: rptgauge 1.5s var(--ease-out, ease-out) 0.25s forwards; }
.rpt-gauge .gtxt { font-family: var(--serif); font-size: 34px; fill: var(--console-ink); }
.rpt-gauge .gsub { font-size: 8px; letter-spacing: 0.16em; text-transform: uppercase; fill: var(--console-mute); }
.rpt-gauge .side { display: grid; gap: 14px; }
.rpt-gauge .side .k { font-size: 8.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--console-mute); }
.rpt-gauge .side .n { font-family: var(--serif); font-size: 24px; color: var(--console-ink); line-height: 1; margin-top: 4px; font-variant-numeric: tabular-nums; }
.rpt-gauge .side .n em { font-style: normal; color: var(--signal); }
.rpt-foot { display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid var(--console-rule-2); padding-top: 13px; font-size: 8.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--console-mute); }
.rpt-foot b { color: var(--console-ink); font-weight: 400; }

/* ledger with scan-line */
.rpt-ledger { position: relative; overflow: hidden; }
.rpt-ledger::after { content: ""; position: absolute; left: 0; right: 0; top: 18px; height: 1px; background: linear-gradient(90deg, transparent, oklch(0.74 0.13 158 / 0.8), transparent); animation: rptscan 5.5s linear 2; pointer-events: none; }
.rpt-rows { display: flex; flex-direction: column; }
.rpt-rows .row { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px dashed var(--console-rule); font-size: 10.5px; opacity: 0; transform: translateY(4px); animation: rptrise 0.5s ease forwards; }
.rpt-rows .row:last-child { border-bottom: 0; }
.rpt-rows .t { color: var(--console-mute); font-variant-numeric: tabular-nums; letter-spacing: 0.04em; }
.rpt-rows .e { color: var(--console-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.rpt-rows .s { font-size: 8.5px; letter-spacing: 0.12em; text-transform: uppercase; }
.rpt-rows .s.ok { color: var(--signal); }
.rpt-rows .s.mut { color: var(--console-mute); }
.rpt-rows .row:nth-child(1){animation-delay:.15s}.rpt-rows .row:nth-child(2){animation-delay:.27s}.rpt-rows .row:nth-child(3){animation-delay:.39s}.rpt-rows .row:nth-child(4){animation-delay:.51s}.rpt-rows .row:nth-child(5){animation-delay:.63s}

/* results dashboard — hero value + ROI strip */
.rpt .rdash-hero .k { font-family: var(--mono); font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--console-mute); }
.rpt .rdash-hero .v { font-family: var(--serif); font-size: clamp(38px, 4.8vw, 54px); line-height: 0.9; color: var(--signal); margin-top: 10px; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; opacity: 0; transform: translateY(6px); animation: rptrise 0.7s ease 0.05s forwards; }
.rpt .rdash-hero .v .u { font-size: 0.42em; color: var(--console-mute); }
.rpt .rdash-hero .s { font-family: var(--mono); font-size: 9px; letter-spacing: 0.05em; color: rgba(242,237,227,0.42); margin-top: 8px; }

.rpt .roi { border-top: 1px solid var(--console-rule-2); padding-top: 16px; }
.rpt .roi-cap { font-family: var(--mono); font-size: 8.5px; letter-spacing: 0.13em; text-transform: uppercase; color: var(--console-mute); margin-bottom: 13px; }
.rpt .roi-row { display: grid; grid-template-columns: 76px 1fr auto; align-items: center; gap: 10px; margin-bottom: 9px; }
.rpt .roi-row .rl { font-family: var(--mono); font-size: 8.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--console-mute); }
.rpt .roi-row .track { height: 8px; background: rgba(242,237,227,0.06); position: relative; overflow: hidden; }
.rpt .roi-row .bar { position: absolute; inset: 0 auto 0 0; height: 100%; transform-origin: left; transform: scaleX(0); animation: roigrow 0.9s var(--ease-out, ease-out) 0.2s forwards; }
.rpt .roi-row .bar.cost { background: rgba(242,237,227,0.26); }
.rpt .roi-row .bar.val { background: var(--signal); }
.rpt .roi-row .rv { font-family: var(--serif); font-size: 16px; color: var(--console-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rpt .roi-row .rv.val { color: var(--signal); }
.rpt .roi-mult { margin-top: 14px; font-family: var(--serif); font-size: clamp(19px, 2.1vw, 24px); color: var(--console-ink); }
.rpt .roi-mult em { font-style: normal; color: var(--signal); font-size: 1.4em; }
.rpt .roi-mult .sub { font-family: var(--mono); font-size: 8.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--console-mute); display: block; margin-top: 5px; }
@keyframes roigrow { to { transform: scaleX(1); } }

@keyframes rptpulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
@keyframes rptrise { to { opacity: 1; transform: none; } }
@keyframes rptbar { to { transform: scaleY(1); } }
@keyframes rptgauge { to { stroke-dashoffset: 29; } }
@keyframes rptscan { 0% { transform: translateY(-12px); opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { transform: translateY(280px); opacity: 0; } }

/* clear CTA footer */
/* report card sits above a standalone CTA button */
.case .c-side { display: flex; flex-direction: column; gap: 14px; }
.case .c-side .btn { width: 100%; justify-content: center; }

/* Home "what we run" — icons matching What We Do */
.deflist .term { display: flex; align-items: center; gap: 13px; }
.deflist .term .ic { width: 26px; height: 26px; color: var(--accent-deep); flex-shrink: 0; }
.deflist .term .ic svg { width: 100%; height: 100%; stroke: currentColor; stroke-width: 1.6; fill: none; stroke-linecap: round; stroke-linejoin: round; }

/* Contact — stacked action buttons */
.contact-actions { display: flex; flex-direction: column; gap: 12px; }
.contact-actions .btn { width: 100%; justify-content: space-between; }

/* Contact — form panel in the hero */
.contact-form-panel { background: var(--paper-2); border: 1px solid var(--paper-rule); padding: clamp(22px, 3vw, 32px); }
.contact-form-panel .cform input, .contact-form-panel .cform textarea { background: var(--paper); }
.contact-form-panel .cform .btn { width: 100%; justify-content: center; margin-top: 6px; }

/* Contact — credibility + logos */
.cred-line { font-family: var(--serif); font-weight: 400; font-size: clamp(18px, 1.9vw, 23px); line-height: 1.32; letter-spacing: -0.005em; color: var(--ink); max-width: 70ch; }
.cred-line em { font-style: italic; color: var(--accent-deep); }
.logogrid { display: flex; flex-wrap: wrap; align-items: center; gap: clamp(26px, 5vw, 52px); margin-top: clamp(24px, 3vw, 34px); }
.logogrid .logo { display: inline-flex; align-items: center; flex-shrink: 0; }
.logogrid .logo img { height: 30px; width: auto; object-fit: contain; filter: brightness(0); opacity: 0.6; transition: opacity 0.15s ease; }
.logogrid .logo:hover img { opacity: 0.9; }
@media (max-width: 640px) { .logogrid { grid-template-columns: 1fr 1fr; } }

/* Contact — form + founder photo */
.cgrid { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,0.9fr); gap: clamp(28px,5vw,64px); align-items: start; }
@media (max-width: 760px) { .cgrid { grid-template-columns: 1fr; gap: 32px; } }
.cform { display: grid; gap: 16px; }
.cform .field { display: grid; gap: 7px; }
.cform label { font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); }
.cform input, .cform textarea { font-family: var(--sans); font-size: 15px; color: var(--ink); background: var(--paper); border: 1px solid var(--ink); padding: 12px 14px; outline: none; width: 100%; }
.cform input:focus, .cform textarea:focus { border-color: var(--accent-deep); }
.cform textarea { resize: vertical; min-height: 130px; }
.cform .btn { width: fit-content; margin-top: 4px; }
.form-status { font-family: var(--mono); font-size: 12px; line-height: 1.5; letter-spacing: 0.02em; margin: 4px 0 0; }
.form-status.ok { color: var(--accent-deep); }
.form-status.err { color: #9a3a2a; }
.founder .f-id .photo { width: 148px; height: 148px; border-radius: 50%; object-fit: cover; object-position: center 22%; border: 1px solid var(--paper-rule); margin-bottom: 24px; }

/* =========================================================
   Phone-level refinements (≤560px)
   ========================================================= */
@media (max-width: 560px) {
  :root { --bar-h: 58px; }
  body { overflow-x: clip; }

  h1.display { font-size: clamp(33px, 9vw, 44px); overflow-wrap: break-word; }
  h2.display { font-size: clamp(26px, 7.6vw, 34px); }
  .lede { font-size: 17px; }
  .hero .lede { max-width: none; }

  /* CTAs: stacked, full-width, comfortably tappable */
  .cta-row { gap: 10px; }
  .cta-row .btn { width: 100%; justify-content: center; }
  .cform .btn { width: 100%; justify-content: center; }

  /* footer: single column with larger tap targets */
  .foot { grid-template-columns: 1fr; gap: 22px; }
  .foot .f-col a { padding: 9px 0; }
  .foot-base { gap: 8px; padding-bottom: 32px; }

  /* dark dashboards: tighten so nothing crowds the screen edge */
  .mini-gauges { gap: 8px; }
  .minigauge svg { width: 64px; height: 64px; }
  .minigauge .mg-k { font-size: 7.5px; }

  /* headline-led blocks + pricing cards */
  .block .b-head h3 { font-size: clamp(30px, 8.6vw, 40px); }
  .pcard { padding: 26px 20px 24px; }

  .closer { padding: clamp(52px, 12vw, 84px) 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .cycle-fig .c-rotor { animation: none; stroke-dasharray: none; opacity: 0.5; }
  .cycle-fig .c-tail { animation: none; stroke-dashoffset: 0; }
  .cycle-fig .c-arrow { animation: none; opacity: 1; }
  .rpt-kpis .kpi .v, .rpt-rows .row { opacity: 1 !important; transform: none !important; }
  .rpt .bars span { transform: scaleY(1) !important; }
  .rpt .roi-row .bar { transform: scaleX(1) !important; }
  .rpt .rdash-hero .v { opacity: 1 !important; transform: none !important; }
  .hh-right .rpt-gauge .side > div, .hh-right .rpt-kpis .kpi, .hh-right .minigauge { opacity: 1 !important; transform: none !important; }
  .rpt-gauge .arc-fg { stroke-dashoffset: 29 !important; }
}

/* =========================================================
   Print (PDF export) — keep paper/ink colours and dark panels
   ========================================================= */
@media print {
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  html { scroll-behavior: auto; }
  body::before { display: none; }
  .topbar { position: static; }
}