/* Longhand Advisory — production stylesheet. Built from the frozen design system (light theme only). */

@font-face { font-family: "Schibsted Grotesk"; src: url("/assets/fonts/schibsted-grotesk-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Schibsted Grotesk"; src: url("/assets/fonts/schibsted-grotesk-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Schibsted Grotesk"; src: url("/assets/fonts/schibsted-grotesk-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }

:root {
  --navy: #0E2A47; --ivory: #F7F4EE; --teal: #3F7775; --stone: #D9D2C5; --white: #FFFFFF;
  --surface: #F7F4EE; --surface-raised: #FFFFFF; --surface-sunken: #EFEBE3; --surface-brand: #0E2A47;
  --ink: #0E2A47; --ink-secondary: #3A4A5C; --ink-muted: #5C6670;
  --on-brand: #F7F4EE; --on-brand-muted: #AEB9C6;
  --accent: #3F7775; --accent-text: #346462; --focus: #3F7775;
  --rule: #D9D2C5; --rule-strong: #B9B0A1; --control-border: #8C8478;
  --positive: #2E6B4E; --negative: #A23B2A;
  --chart-1: #0E2A47; --chart-2: #3F7775; --chart-3: #B9B0A1; --chart-grid: #E6E0D5;
  /* Analytical palette: used ONLY inside reports, charts, tables, models and working-asset miniatures.
     navy = actual · teal = forecast/active · slate = budget/comparison · green = favourable/complete
     brick = unfavourable · stone = structure. Not a brand palette. */
  --data-actual: #0E2A47; --data-forecast: #3F7775; --data-forecast-text: #346462; --data-band: rgba(63,119,117,.14);
  --data-budget: #81909D; --data-budget-text: #566572; --data-fav: #2E6B4E; --data-unf: #A23B2A;
  --data-rule: #D9D2C5; --data-grid: #E6E0D5; --data-paper: #FCFBF8;
  --font: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  --gutter: 20px; --container: 1200px; --measure: 68ch;
  --section: 56px;
  color-scheme: light;
}
@media (min-width: 768px) { :root { --gutter: 40px; --section: 80px; } }
@media (min-width: 1024px) { :root { --section: 96px; } }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: var(--surface); color: var(--ink); font: 400 16px/1.6 var(--font); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, svg { display: block; max-width: 100%; }
a { color: var(--accent-text); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--ink); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
p { margin: 0 0 1em; }
ul, ol { margin: 0; padding: 0; }
h1, h2, h3, h4 { margin: 0; font-weight: 600; color: var(--ink); }
table { border-collapse: collapse; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; } }

.skip { position: absolute; left: 8px; top: -60px; background: var(--navy); color: var(--ivory); padding: 10px 14px; z-index: 50; text-decoration: none; font-weight: 500; }
.skip:focus { top: 8px; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.container { max-width: calc(var(--container) + 2 * var(--gutter)); margin: 0 auto; padding: 0 var(--gutter); }
.section { padding: var(--section) 0; border-top: 1px solid var(--rule); }
.section--raised { background: var(--surface-raised); }
.section--first { border-top: 0; }

/* Type */
.eyebrow { font: 600 12px/16px var(--font); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-muted); margin: 0; }
.display { font-size: 38px; line-height: 42px; letter-spacing: -.028em; }
.h1 { font-size: 34px; line-height: 40px; letter-spacing: -.022em; }
.h2 { font-size: 28px; line-height: 34px; letter-spacing: -.018em; }
.h3 { font-size: 19px; line-height: 25px; letter-spacing: -.01em; }
.lede { font-size: 17px; line-height: 26px; color: var(--ink-secondary); max-width: 40em; }
.body-lg { font-size: 17px; line-height: 27px; color: var(--ink-secondary); }
.muted { color: var(--ink-muted); }
.small { font-size: 13px; line-height: 20px; }
.label { font: 600 11px/14px var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); }
@media (min-width: 768px) {
  .display { font-size: 52px; line-height: 56px; }
  .h1 { font-size: 42px; line-height: 48px; letter-spacing: -.02em; }
  .h2 { font-size: 32px; line-height: 38px; }
  .h3 { font-size: 21px; line-height: 28px; }
  .lede { font-size: 20px; line-height: 30px; }
  .body-lg { font-size: 18px; line-height: 28px; }
}
@media (min-width: 1024px) {
  .display { font-size: 60px; line-height: 64px; }
  .h2 { font-size: 40px; line-height: 46px; letter-spacing: -.02em; }
}
.prose { max-width: var(--measure); }
.prose p, .prose li { font-size: 17px; line-height: 28px; color: var(--ink-secondary); }
.prose h2 { font-size: 26px; line-height: 32px; letter-spacing: -.015em; margin: 48px 0 12px; }
.prose h3 { font-size: 20px; line-height: 27px; margin: 32px 0 8px; }
.prose ul, .prose ol { padding-left: 1.2em; margin: 0 0 1em; }
.prose li { margin-bottom: 6px; }
.prose strong { color: var(--ink); font-weight: 600; }

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 20px; font: 500 15px/20px var(--font); border-radius: 2px; border: 1px solid transparent; text-decoration: none; cursor: pointer; transition: background-color .15s ease, border-color .15s ease, color .15s ease; }
.btn--primary { background: var(--ink); color: var(--surface); }
.btn--primary:hover { background: var(--ink-secondary); color: var(--surface); }
.btn--secondary { background: transparent; color: var(--ink); border-color: var(--control-border); }
.btn--secondary:hover { border-color: var(--ink); color: var(--ink); }
.btn--ivory { background: var(--ivory); color: var(--navy); }
.btn--ivory:hover { background: var(--white); color: var(--navy); }
.btn--block { width: 100%; min-height: 48px; font-size: 16px; }
.link { display: inline-flex; align-items: center; min-height: 44px; color: var(--accent-text); text-decoration: underline; text-underline-offset: 4px; font-weight: 500; }
.cta-row { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin-top: 24px; }
.cta-row .btn--primary { width: 100%; min-height: 48px; font-size: 16px; }
@media (min-width: 768px) { .cta-row { flex-direction: row; align-items: center; gap: 24px; margin-top: 32px; } .cta-row .btn--primary { width: auto; min-height: 44px; font-size: 15px; } }

/* Header / navigation */
.site-header { position: sticky; top: 0; z-index: 20; background: var(--surface); border-bottom: 1px solid var(--rule); }
.site-header__bar { display: flex; align-items: center; justify-content: space-between; height: 60px; }
.brand { display: flex; align-items: center; color: var(--ink); text-decoration: none; min-height: 44px; }
.brand svg { height: 18px; width: auto; }
.nav-toggle { text-decoration: none; display: inline-flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; width: 44px; height: 44px; margin-right: -10px; background: none; border: 0; cursor: pointer; }
.nav-toggle span { display: block; width: 20px; height: 1.5px; background: var(--ink); transition: transform .15s ease; }
.nav-toggle[aria-expanded="true"] span:nth-of-type(1) { transform: translateY(3.75px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-of-type(2) { transform: translateY(-3.75px) rotate(-45deg); }
.site-nav { display: none; border-top: 1px solid var(--rule); padding: 8px 0 20px; }
.site-nav.is-open { display: block; }
.site-nav ul { list-style: none; }
.site-nav a { display: flex; align-items: center; min-height: 48px; font: 500 18px/24px var(--font); color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--rule); }
.site-nav a[aria-current="page"] { color: var(--accent-text); }
.site-nav .btn { margin-top: 16px; width: 100%; border-bottom: 0; color: var(--surface); font-size: 16px; min-height: 48px; }
@media (min-width: 1024px) {
  .site-header__bar { height: 76px; }
  .brand svg { height: 22px; }
  .nav-toggle { display: none; }
  .site-header .container { display: flex; align-items: center; justify-content: space-between; }
  .site-nav { display: block; border: 0; padding: 0; }
  .site-nav ul { display: flex; align-items: center; gap: 36px; }
  .site-nav a { min-height: 76px; font-size: 14px; color: var(--ink-secondary); border: 0; box-shadow: none; }
  .site-nav a:hover { color: var(--ink); }
  .site-nav a[aria-current="page"] { color: var(--ink); box-shadow: inset 0 -2px 0 var(--accent); }
  .site-nav .btn { margin: 0 0 0 4px; width: auto; min-height: 40px; font-size: 14px; padding: 8px 14px; background: transparent; color: var(--ink); border: 1px solid var(--control-border); }
  .site-nav .btn:hover { border-color: var(--ink); }
}

/* Hero */
.hero { padding: 40px 0 48px; }
.hero__grid { display: grid; gap: 36px; }
.hero h1 { margin-top: 14px; }
.hero .lede { margin: 16px 0 0; }
@media (min-width: 768px) { .hero { padding: 72px 0 80px; } }
@media (min-width: 1024px) { .hero { padding: 96px 0; } .hero__grid { grid-template-columns: 7fr 5fr; gap: 56px; align-items: center; } }

/* Page header (inner pages) */
.page-head { padding: 40px 0 44px; }
.page-head h1 { margin-top: 12px; max-width: 20ch; }
.page-head .lede { margin: 16px 0 0; }
@media (min-width: 768px) { .page-head { padding: 72px 0 64px; } }
.breadcrumb { font-size: 13px; line-height: 20px; color: var(--ink-muted); margin-bottom: 18px; }
.breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; }
.breadcrumb li + li::before { content: "/"; margin-right: 6px; color: var(--rule-strong); }
.breadcrumb a { color: var(--ink-muted); }

/* Section heads */
.sec-head { display: grid; gap: 12px; margin-bottom: 32px; }
.sec-head .h2 { margin-top: 2px; }
.sec-head p { margin: 0; }
@media (min-width: 1024px) { .sec-head { grid-template-columns: 5fr 7fr; gap: 64px; align-items: end; margin-bottom: 48px; } .sec-head p { max-width: 34em; } }

/* Simplified architecture */
.arch { color: var(--ink); }
.arch__tier { border-top: 1px solid var(--rule-strong); padding-top: 10px; }
.arch__label { font: 600 11px/14px var(--font); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-muted); display: flex; gap: 8px; margin: 0; }
.arch__label b { font-weight: 600; color: var(--accent-text); }
.arch__chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; list-style: none; }
.arch__chips li { font: 500 13px/18px var(--font); color: var(--ink-secondary); border: 1px solid var(--rule-strong); background: var(--surface-raised); padding: 5px 9px; }
.arch__chips--out li { color: var(--ink); border-color: var(--ink); }
.arch__pair { display: grid; grid-template-columns: 1fr; margin-top: 10px; }
.arch__box { border: 1px solid var(--rule-strong); background: var(--surface-raised); padding: 10px 12px; font: 600 14px/18px var(--font); }
.arch__box--fin { border-color: var(--ink); }
.arch__box span { display: block; font: 400 12px/17px var(--font); color: var(--ink-muted); margin-top: 3px; }
.arch__rec { display: flex; align-items: center; gap: 6px; padding: 4px 0 4px 18px; font: 400 11px/14px var(--font); color: var(--ink-muted); }
.arch__rec::before { content: ""; height: 14px; border-left: 1px dashed var(--rule-strong); }
.arch__flow { height: 26px; position: relative; }
.arch__flow::before { content: ""; position: absolute; left: 24px; top: 3px; bottom: 3px; border-left: 2px solid var(--accent); }
.arch__flow::after { content: ""; position: absolute; left: 20px; bottom: 2px; border: 5px solid transparent; border-top-color: var(--accent); border-bottom: 0; }
.arch__auto { margin: 14px 0 0; border: 1px dashed var(--rule-strong); background: var(--surface-sunken); padding: 8px 12px; font: 400 12px/17px var(--font); color: var(--ink-secondary); }
.arch__auto b { font-weight: 600; color: var(--ink); }
@media (min-width: 480px) {
  .arch__pair { grid-template-columns: 1fr auto 1fr; }
  .arch__rec { padding: 0 6px; }
  .arch__rec::before { height: 0; width: 10px; border-left: 0; border-top: 1px dashed var(--rule-strong); }
  .arch__rec::after { content: ""; width: 10px; border-top: 1px dashed var(--rule-strong); }
}

/* Full architecture diagram */
.arch-full__svg { display: none; }
.arch-full__svg .bx { fill: var(--surface-raised); stroke: var(--rule-strong); stroke-width: 1; }
.arch-full__svg .bxh { stroke: var(--ink); }
.arch-full__svg .bt { font: 600 12px var(--font); fill: var(--ink); }
.arch-full__svg .bs { font: 400 10.5px var(--font); fill: var(--ink-muted); }
.arch-full__svg .ch { font: 600 10px var(--font); letter-spacing: .1em; text-transform: uppercase; fill: var(--ink-muted); }
.arch-full__svg .gl { font: 600 9.5px var(--font); letter-spacing: .1em; text-transform: uppercase; fill: var(--accent-text); }
.arch-full__svg .ln { fill: none; stroke: var(--rule-strong); stroke-width: 1; }
.arch-full__svg .lnh { stroke: var(--accent); stroke-width: 2; }
.arch-full__svg .gr { stroke: var(--rule); stroke-width: 1; fill: none; }
.arch-full__svg .rc { stroke: var(--rule-strong); stroke-width: 1; stroke-dasharray: 3 3; }
.arch-full__svg .au { fill: var(--surface-sunken); stroke: var(--rule-strong); stroke-width: 1; stroke-dasharray: 4 3; }
.arch-full__list { display: grid; gap: 16px; }
.arch-full__list section { border-top: 1px solid var(--rule-strong); padding-top: 12px; }
.arch-full__list h3 { font-size: 15px; line-height: 20px; margin-bottom: 6px; }
.arch-full__list p { margin: 0; font-size: 14px; line-height: 21px; color: var(--ink-secondary); }
.arch-full figcaption { font-size: 13px; line-height: 20px; color: var(--ink-muted); margin-top: 14px; max-width: var(--measure); }
@media (min-width: 768px) { .arch-full__svg { display: block; width: 100%; height: auto; } .arch-full__list { display: none; } }

/* Capabilities */
.caps { list-style: none; position: relative; padding-left: 28px; }
.caps::before { content: ""; position: absolute; left: 5px; top: 6px; bottom: 6px; border-left: 1px solid var(--rule-strong); }
.cap { position: relative; padding-bottom: 28px; }
.cap:last-child { padding-bottom: 0; }
.cap__node { position: absolute; left: -28px; top: 4px; width: 11px; height: 11px; border: 1px solid var(--ink); background: var(--surface); }
.cap__num { font: 500 13px/18px var(--font); color: var(--accent-text); font-variant-numeric: tabular-nums; }
.cap__num span { color: var(--ink-muted); }
.cap h3 { margin: 6px 0 6px; }
.cap h3 a { color: var(--ink); text-decoration: none; }
.cap h3 a:hover { text-decoration: underline; }
.cap p { font-size: 16px; line-height: 25px; color: var(--ink-secondary); margin: 0 0 6px; }
.cap .link { min-height: 36px; font-size: 14px; }
@media (min-width: 1024px) {
  .caps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; padding: 26px 0 0; }
  .caps::before { left: 0; right: 0; top: 5px; bottom: auto; border-left: 0; border-top: 1px solid var(--rule-strong); }
  .cap { padding: 0; }
  .cap__node { left: 0; top: -26px; }
}

/* Section surfaces */
.section--paper { background: var(--surface); }

/* What we build: miniature working assets (src/miniatures.py) */
.build { list-style: none; display: grid; gap: 0; }
.build__item { display: grid; grid-template-rows: auto auto auto 1fr; padding: 20px 0 24px; border-top: 1px solid var(--rule-strong); }
.build__art { background: var(--data-paper); border: 1px solid var(--data-rule); padding: 10px 12px; margin-bottom: 14px; }
.build__item .label { margin: 0; }
.build__item h3 { font-size: 19px; line-height: 25px; margin: 4px 0 6px; }
.build__item p { font-size: 16px; line-height: 25px; color: var(--ink-secondary); margin: 0; }
.mini { display: block; width: 100%; height: auto; overflow: visible; }
.mini--narrow { display: none; }
@media (max-width: 559px), (min-width: 768px) and (max-width: 1023px) { .mini--wide { display: none; } .mini--narrow { display: block; } }
.mini text { font-family: var(--font); font-variant-numeric: proportional-nums; fill: var(--data-actual); }
.mini .tn { font-variant-numeric: tabular-nums; }
.mini .row, .mini .num, .mini .bud, .mini .fav, .mini .unf { font-size: 10.5px; font-weight: 400; }
.mini .num, .mini .fav, .mini .unf { font-weight: 500; }
.mini .b { font-weight: 600; }
.mini .lab { font-size: 9px; font-weight: 600; letter-spacing: .09em; fill: var(--ink-muted); }
.mini .hd { font-size: 9px; font-weight: 500; fill: var(--ink-muted); }
.mini .cmp { font-size: 10px; fill: var(--ink-muted); }
.mini .ax { font-size: 9px; fill: var(--ink-muted); }
.mini .sm { font-size: 9.5px; }
.mini .big { font-size: 21px; font-weight: 600; letter-spacing: -.01em; }
.mini .big2 { font-size: 19px; font-weight: 600; letter-spacing: -.01em; }
/* narrow layouts: larger type (>= 10.8px rendered at a 390px viewport) */
.mini .lg { font-size: 12.5px; } .mini .lab.lg, .mini .hd.lg, .mini .ax.lg { font-size: 11px; } .mini .lab-lg { font-size: 10.5px; font-weight: 600; letter-spacing: .08em; fill: var(--ink-muted); }
.mini .cmp.lg { font-size: 12px; }
@media (min-width: 768px) and (max-width: 1023px) { .mini--wide.chart { display: block; } .mini--narrow.chart { display: none; } }
/* semantic text colours */
.mini .nv, .mini .lab.nv, .mini .hd.nv, .mini .lab-lg.nv { fill: var(--data-actual); }
.mini .sl, .mini .hd.sl, .mini .bud { fill: var(--data-budget-text); }
.mini .fc, .mini .lab.fc, .mini .lab-lg.fc { fill: var(--data-forecast-text); }
.mini .fav, .mini .ok-t, .mini .lab.ok-t { fill: var(--data-fav); }
.mini .unf { fill: var(--data-unf); }
/* marks */
.mini .r { stroke: var(--data-rule); stroke-width: 1; } .mini .rn { stroke: var(--data-actual); stroke-width: 1; }
.mini .rd { stroke: var(--data-actual); stroke-width: .8; stroke-dasharray: 2 2; }
.mini .grid { stroke: var(--data-grid); stroke-width: 1; }
.mini .thr { stroke: var(--data-unf); stroke-width: 1.1; stroke-dasharray: 4 3; }
.mini .ok { fill: none; stroke: var(--data-fav); stroke-width: 1.7; stroke-linecap: square; }
.mini .bar-ok { fill: var(--data-fav); } .mini .bar-n { fill: var(--data-actual); } .mini .bar-sl { fill: var(--data-budget); } .mini .bar-fc { fill: var(--data-forecast); }
.mini .band { fill: var(--data-band); }
.mini .ln-n { fill: none; stroke: var(--data-actual); stroke-width: 1.8; } .mini .ln-a { fill: none; stroke: var(--data-forecast); stroke-width: 1.8; }
.mini .ln-sl { fill: none; stroke: var(--data-budget); stroke-width: 1.4; stroke-dasharray: 4 3; }
.mini .dot-n { fill: var(--data-actual); } .mini .dot-a { fill: var(--data-forecast); }
.mini .tile { fill: #FFFFFF; stroke: var(--data-rule); stroke-width: 1; }
.mini .node { fill: #FFFFFF; stroke: var(--data-actual); stroke-width: 1; }
.mini .flow { fill: none; stroke: var(--data-forecast); stroke-width: 1.3; } .mini .ah { fill: var(--data-forecast); }
@media (min-width: 768px) {
  .build { grid-template-columns: repeat(2, 1fr); gap: 0 32px; }
  @supports (grid-template-rows: subgrid) {
    .build__item { grid-row: span 4; grid-template-rows: subgrid; row-gap: 0; }
  }
  .build__item h3 { font-size: 21px; line-height: 28px; margin: 6px 0 6px; }
}
@media (min-width: 1200px) { .build { grid-template-columns: repeat(3, 1fr); } }

/* Management report (src/report.py) */
.report { margin: 0; background: var(--data-paper); border: 1px solid var(--data-rule); padding: 12px; }
.report__bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; align-items: baseline; border-bottom: 1px solid var(--data-actual); padding-bottom: 10px; margin-bottom: 16px; }
.report__bar p { margin: 0; font-size: 16px; line-height: 22px; }
.report__tag { font: 600 11px/14px var(--font) !important; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-secondary); border: 1px solid var(--control-border); padding: 4px 8px; border-radius: 2px; }
.rkpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--data-rule); border: 1px solid var(--data-rule); margin-bottom: 20px; }
.rkpi { background: #FFFFFF; padding: 12px 12px 14px; border-top: 2px solid var(--data-actual); }
.rkpi--fc { border-top-color: var(--data-forecast); }
.rkpi p { margin: 0; }
.rkpi__l { font: 600 11px/14px var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); }
.rkpi__v { font: 600 26px/32px var(--font); letter-spacing: -.02em; color: var(--data-actual); margin-top: 6px !important; }
.rkpi--fc .rkpi__v { color: var(--data-forecast-text); }
.rkpi__d { font-size: 14px; line-height: 20px; color: var(--ink-muted); margin-top: 2px !important; }
.fav { color: var(--data-fav); } .unf { color: var(--data-unf); }
.report__grid { display: grid; gap: 20px; margin-bottom: 20px; }
.report__grid > *, .val-grid > * { min-width: 0; }
.report__side .table-wrap + .table-wrap { margin-top: 16px; }
.report__chart { background: #FFFFFF; border: 1px solid var(--data-rule); padding: 10px 8px 10px; }
@media (min-width: 768px) { .report__chart { padding: 14px 14px 12px; } }
.report__chart .mini { margin-bottom: 8px; }
.legend { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; line-height: 18px; color: var(--ink-secondary); }
.legend i { display: inline-block; width: 14px; height: 0; vertical-align: middle; margin-right: 6px; border-top: 2px solid; }
.legend .k-act { border-color: var(--data-actual); } .legend .k-fc { border-color: var(--data-forecast); }
.legend .k-band { height: 8px; border: 0; background: var(--data-band); } .legend .k-bud { border-top: 2px dashed var(--data-budget); }
.legend .k-bar { height: 8px; width: 8px; border: 0; background: var(--data-budget); } .legend .k-thr { border-top: 2px dashed var(--data-unf); }
.report__comm { border-top: 1px solid var(--data-actual); padding-top: 14px; }
.report__comm h3 { font: 600 11px/14px var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); margin: 0 0 10px; }
.report__comm ol { margin: 0; padding-left: 20px; display: grid; gap: 8px; }
.report__comm li { font-size: 16px; line-height: 25px; color: var(--ink-secondary); max-width: 80ch; }
.report__comm strong { color: var(--ink); }
ol li::marker { font-variant-numeric: normal; }
.fin-table tr.memo td { font-variant-numeric: normal; }
.report__decision { margin: 14px 0 0; padding: 12px 14px; background: #FFFFFF; border-left: 2px solid var(--data-forecast); font-size: 16px; line-height: 25px; color: var(--ink-secondary); max-width: 80ch; }
.report__decision strong { color: var(--ink); }
@media (min-width: 768px) { .report { padding: 24px; } .rkpis { grid-template-columns: repeat(4, 1fr); } .rkpi__v { font-size: 30px; line-height: 36px; } }
@media (min-width: 1024px) { .report__grid { grid-template-columns: 3fr 2fr; gap: 24px; } .report__grid--even { grid-template-columns: 1fr 1fr; } }

/* FP&A scope + valuation */
.scope { display: grid; gap: 24px; }
.scope__col { border-top: 2px solid var(--ink); padding-top: 12px; }
.scope__col ul { list-style: none; margin: 10px 0 0; padding: 0; }
.scope__col li { font-size: 16px; line-height: 24px; color: var(--ink-secondary); padding: 7px 0; border-bottom: 1px solid var(--rule); }
@media (min-width: 768px) { .scope { grid-template-columns: repeat(3, 1fr); gap: 28px; } }
.val-grid { display: grid; gap: 20px; }
@media (min-width: 1024px) { .val-grid { grid-template-columns: 1fr 1fr; gap: 24px; } }
.val-note { font-size: 16px; line-height: 25px; color: var(--ink-secondary); max-width: 80ch; margin: 16px 0 0; }

/* Contact intake */
.intake { display: grid; gap: 24px; }
.intake__q { list-style: none; counter-reset: q; margin: 0; padding: 0; border-top: 1px solid var(--rule-strong); }
.intake__q li { counter-increment: q; padding: 14px 0 14px 36px; border-bottom: 1px solid var(--rule); position: relative; }
.intake__q li::before { content: counter(q, decimal-leading-zero); position: absolute; left: 0; top: 16px; font: 600 12px/16px var(--font); letter-spacing: .08em; color: var(--ink-muted); }
.intake__q h3 { font-size: 18px; line-height: 24px; margin: 0 0 4px; }
.intake__q p { font-size: 16px; line-height: 24px; color: var(--ink-secondary); margin: 0; }
.tags { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 0; padding: 0; }
.tags li { font-size: 15px; line-height: 20px; border: 1px solid var(--rule-strong); padding: 7px 10px; background: var(--data-paper); }
.tags a { color: var(--ink); text-decoration: none; } .tags a:hover { text-decoration: underline; }
.intake__send .btn { width: 100%; min-height: 48px; font-size: 16px; }
.intake__send p { font-size: 15px; line-height: 22px; color: var(--ink-muted); margin: 10px 0 0; }
@media (min-width: 768px) { .intake__send .btn { width: auto; } }

/* Steps */
.steps { list-style: none; display: grid; gap: 0; }
.step { border-top: 2px solid var(--ink); padding: 12px 0 24px; }
.step h3 { margin: 4px 0 6px; }
.step__time { font-size: 14px; line-height: 20px; font-weight: 500; color: var(--data-forecast-text); margin: 4px 0 6px; }
.step__lab { margin: 12px 0 0; }
.step p { font-size: 16px; line-height: 25px; color: var(--ink-secondary); margin: 0; }
.step ul { list-style: none; margin-top: 12px; }
.step li { font-size: 14px; line-height: 21px; color: var(--ink-secondary); padding: 6px 0; border-top: 1px solid var(--rule); }
@media (min-width: 768px) { .steps { grid-template-columns: repeat(3, 1fr); gap: 32px; } .step { padding-bottom: 0; } .step p { font-size: 16px; line-height: 25px; } }

/* Insights */
.insights { list-style: none; display: grid; gap: 0; }
.insight { border-top: 1px solid var(--rule-strong); padding: 14px 0 18px; }
.insight h3 { font-size: 18px; line-height: 24px; margin: 6px 0 6px; }
.insight h3 a { color: var(--ink); text-decoration: none; }
.insight h3 a:hover { text-decoration: underline; }
.insight .status { font-size: 13px; line-height: 18px; color: var(--ink-muted); }
@media (min-width: 768px) { .insights { grid-template-columns: repeat(2, 1fr); gap: 0 32px; } }
@media (min-width: 1024px) { .insights--four { grid-template-columns: repeat(4, 1fr); gap: 28px; } .insight h3 { font-size: 20px; line-height: 26px; } }

/* Service page blocks */
.two-col { display: grid; gap: 24px; }
@media (min-width: 1024px) { .two-col { grid-template-columns: 4fr 8fr; gap: 64px; } }
.col-head .h2 { margin-top: 10px; }
.list-rule { list-style: none; }
.list-rule li { padding: 12px 0; border-top: 1px solid var(--rule); font-size: 16px; line-height: 25px; color: var(--ink-secondary); }
.list-rule li:last-child { border-bottom: 1px solid var(--rule); }
.list-rule strong { color: var(--ink); font-weight: 600; }
.deliverables { list-style: none; display: grid; gap: 0; }
.deliverables li { padding: 14px 0; border-top: 1px solid var(--rule-strong); }
.deliverables h3 { font-size: 17px; line-height: 23px; margin: 0 0 4px; }
.deliverables p { margin: 0; font-size: 16px; line-height: 25px; color: var(--ink-secondary); }
@media (min-width: 768px) { .deliverables { grid-template-columns: repeat(2, 1fr); gap: 0 32px; } }
.connects { list-style: none; display: grid; gap: 0; }
.connects li { padding: 14px 0; border-top: 1px solid var(--rule); }
.connects a { font-weight: 600; color: var(--ink); text-decoration: none; }
.connects a:hover { text-decoration: underline; }
.connects p { margin: 4px 0 0; font-size: 16px; line-height: 25px; color: var(--ink-secondary); }
.callout { border-left: 2px solid var(--accent); background: var(--surface-raised); padding: 16px 18px; margin: 24px 0; max-width: var(--measure); }
.callout p { margin: 0; font-size: 16px; line-height: 25px; color: var(--ink-secondary); }
.callout strong { color: var(--ink); }

/* Financial table + KPI */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--rule); background: var(--surface-raised); }
.fin-table { width: 100%; min-width: 560px; font: 400 13px/20px var(--font); font-variant-numeric: tabular-nums; color: var(--ink-secondary); }
.fin-table caption { text-align: left; font: 600 16px/22px var(--font); color: var(--ink); padding: 14px 12px 6px; }
.fin-table caption span { display: block; font: 400 13px/20px var(--font); color: var(--ink-muted); }
.fin-table th { font: 600 11px/14px var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); background: var(--surface-sunken); padding: 9px 12px; text-align: right; border-bottom: 1px solid var(--rule-strong); }
.fin-table th:first-child, .fin-table td:first-child { text-align: left; white-space: nowrap; }
.fin-table td { padding: 7px 12px; text-align: right; border-bottom: 1px solid var(--rule); }
.fin-table tr.sub td { font-weight: 600; color: var(--ink); border-top: 1px solid var(--rule-strong); }
.fin-table tr.total td { font-weight: 600; color: var(--ink); border-top: 2px solid var(--ink); border-bottom: 0; }
.fin-table td.ind { padding-left: 24px; }
.pos { color: var(--positive); } .neg { color: var(--negative); }
.kpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 16px; }
@media (min-width: 1024px) { .kpis { grid-template-columns: repeat(4, 1fr); gap: 16px; } }
.kpi { background: var(--surface-raised); border-top: 2px solid var(--ink); padding: 14px 16px 16px; }
.kpi--accent { border-top-color: var(--accent); }
.kpi__label { font: 600 11px/14px var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); }
.kpi__value { font: 600 30px/34px var(--font); letter-spacing: -.02em; margin-top: 8px; }
.kpi__delta { font-size: 13px; line-height: 20px; color: var(--ink-muted); margin-top: 4px; }
@media (min-width: 768px) { .kpi__value { font-size: 38px; line-height: 42px; } }
.badge-note { display: inline-block; font: 600 11px/14px var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-secondary); border: 1px solid var(--control-border); padding: 4px 8px; border-radius: 2px; margin-bottom: 14px; }

/* CTA band */
.cta-band { padding: var(--section) 0; background: var(--surface-brand); color: var(--on-brand); }
.cta-band .h2 { color: var(--on-brand); } .cta-band .body-lg { color: var(--on-brand-muted); }
.cta-band .btn--ivory { color: var(--navy); } .cta-band .cta-row .btn { width: 100%; min-height: 48px; font-size: 16px; }
@media (min-width: 768px) { .cta-band .cta-row .btn { width: auto; min-height: 44px; font-size: 15px; } }
.link--on-brand { color: var(--on-brand); } .link--on-brand:hover { color: var(--white); }
.cta-band + .site-footer, main:has(> .cta-band:last-child) + .site-footer { border-top: 1px solid rgba(247,244,238,.16); }
.cta-band__inner { display: grid; gap: 16px; }
.cta-band p { margin: 0; }
@media (min-width: 1024px) { .cta-band__inner { grid-template-columns: 7fr 5fr; align-items: end; gap: 64px; } .cta-band .cta-row { justify-content: flex-end; margin: 0; } }

/* Contact */
.contact-mail { display: inline-block; font: 600 22px/30px var(--font); color: var(--ink); text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; word-break: break-all; }
@media (min-width: 768px) { .contact-mail { font-size: 32px; line-height: 40px; } }

/* Footer */
.site-footer { background: var(--surface-brand); color: var(--on-brand); padding: 44px 0 28px; }
.site-footer a { color: var(--on-brand); }
.footer__grid { display: grid; gap: 28px; }
.footer__brand svg { width: 150px; height: auto; }
.footer__tag { color: var(--on-brand-muted); font-size: 15px; line-height: 23px; margin: 16px 0 20px; max-width: 28em; }
.footer__mail { display: inline-flex; align-items: center; min-height: 44px; font: 500 16px/22px var(--font); text-underline-offset: 4px; margin-top: 8px; }
.footer__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.footer__cols h2 { font: 600 11px/14px var(--font); letter-spacing: .14em; text-transform: uppercase; color: var(--on-brand-muted); margin: 0 0 8px; }
.footer__cols ul { list-style: none; }
.footer__cols a { display: flex; align-items: center; min-height: 36px; font-size: 15px; line-height: 22px; text-decoration: none; }
.footer__cols a:hover { text-decoration: underline; }
.footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 20px; margin-top: 32px; padding-top: 20px; border-top: 1px solid rgba(247, 244, 238, .18); font-size: 12px; line-height: 18px; color: var(--on-brand-muted); }
.footer__legal a { color: var(--on-brand-muted); }
.footer__legal ul { list-style: none; display: flex; gap: 16px; }
.site-footer :focus-visible { outline-color: var(--ivory); }
@media (min-width: 1024px) {
  .site-footer { padding: 72px 0 40px; }
  .footer__grid { grid-template-columns: 5fr 7fr; gap: 64px; }
  .footer__brand svg { width: 200px; }
  .footer__cols { grid-template-columns: repeat(3, 1fr); }
}

/* Article template */
.article-head { padding: 40px 0 32px; }
.article-head h1 { margin-top: 12px; max-width: 22ch; }
.article-meta { display: flex; flex-wrap: wrap; gap: 4px 18px; margin-top: 18px; font-size: 13px; line-height: 20px; color: var(--ink-muted); }
.toc { border-top: 1px solid var(--rule-strong); padding-top: 12px; margin-bottom: 32px; max-width: var(--measure); }
.toc ol { padding-left: 1.2em; }
.toc li { font-size: 15px; line-height: 24px; padding: 2px 0; }
.article-body .table-wrap { margin: 24px 0; max-width: 820px; }
.article-body figure { margin: 28px 0; max-width: 820px; }
.article-body figcaption { font-size: 13px; line-height: 20px; color: var(--ink-muted); margin-top: 8px; }

.caps--flat { padding-top: 0; }
@media (min-width: 1024px) { .caps--flat { display: block; padding-left: 28px; } .caps--flat::before { left: 5px; top: 6px; bottom: 6px; right: auto; border-top: 0; border-left: 1px solid var(--rule-strong); } .caps--flat .cap { padding-bottom: 28px; } .caps--flat .cap__node { left: -28px; top: 4px; } }
.mt-12 { margin-top: 12px; } .mt-20 { margin-top: 20px; } .mt-24 { margin-top: 24px; } .mt-28 { margin-top: 28px; } .mt-16 { margin-top: 16px; } .mt-40 { margin-top: 40px; }

/* 404 */
.notfound { padding: 80px 0; }

/* Fixes */
figure.arch, figure.arch-full { margin: 0; }
.site-footer .btn--ivory, .site-footer .btn--ivory:hover { color: var(--navy); text-decoration: none; }
.arch-full__svg { max-width: 980px; }

.article-body.prose { max-width: 820px; }
.article-body.prose > p, .article-body.prose > ul, .article-body.prose > ol, .article-body.prose > h2, .article-body.prose > h3, .article-body .callout { max-width: var(--measure); }
.prose .badge-note { font-size: 11px; line-height: 14px; color: var(--ink-secondary); }

/* Report tables: declared after the base .fin-table rules so they take precedence */
.fin-table--report, .fin-table--narrow { background: #FFFFFF; }
.fin-table--narrow { min-width: 0; }
.fin-table th[scope=row] { font: 400 14px/20px var(--font); letter-spacing: 0; text-transform: none; color: var(--ink); background: transparent; text-align: left; padding: 7px 12px; border-bottom: 1px solid var(--data-rule); white-space: nowrap; }
.fin-table th[scope=row].ind { padding-left: 24px; color: var(--ink-secondary); }
.fin-table tr.sub th[scope=row], .fin-table tr.total th[scope=row] { font-weight: 600; }
.fin-table tr.sub th, .fin-table tr.sub td { border-top: 1px solid var(--rule-strong); }
.fin-table tr.total th, .fin-table tr.total td { border-top: 2px solid var(--data-actual); border-bottom: 0; }
.fin-table tr.memo th, .fin-table tr.memo td { color: var(--ink-muted); font-size: 13px; border-bottom: 0; }
.fin-table td.act { color: var(--data-actual); font-weight: 500; } .fin-table td.bud, .fin-table th.bud { color: var(--data-budget-text); }
.fin-table td.fav { color: var(--data-fav); } .fin-table td.unf { color: var(--data-unf); }
.fin-table td.b { font-weight: 600; background: rgba(63,119,117,.08); }
@media (max-width: 559px) {
  .fin-table--report, .fin-table--narrow { min-width: 0; font-size: 13px; }
  .fin-table--report th, .fin-table--report td, .fin-table--narrow th, .fin-table--narrow td { padding-left: 6px; padding-right: 6px; }
  .fin-table th[scope=row] { white-space: normal; font-size: 13px; line-height: 18px; }
  .fin-table th[scope=row].ind { padding-left: 14px; }
  .fin-table--report th:nth-child(5), .fin-table--report td:nth-child(5) { display: none; }
}
.fin-table td { white-space: nowrap; }

/* Mobile report: condensed version below 768px; the full desktop report is unchanged above it */
.report--m { display: none; }
@media (max-width: 767px) {
  .report:not(.report--m) { display: none; }
  .report--m { display: block; }
  .report__stack { display: grid; gap: 16px; margin: 16px 0 20px; }
  .report--m > .table-wrap { margin-top: 4px; }
  .report__more { margin-top: 20px; border-top: 1px solid var(--data-actual); }
  .report__more summary { display: flex; align-items: center; justify-content: space-between; min-height: 48px; padding: 12px 2px; cursor: pointer; list-style: none;
    font: 600 16px/22px var(--font); color: var(--ink); }
  .report__more summary::-webkit-details-marker { display: none; }
  .report__more summary::after { content: "+"; font: 400 22px/1 var(--font); color: var(--ink-muted); }
  .report__more[open] summary::after { content: "\2212"; }
  .report__more-body { display: grid; gap: 16px; padding-top: 4px; }
  .report__more-body .report__stack { margin: 0; }
}
