/* 27 Oct 2026: CFO services, About, FAQ and Pricing rebuilt in the new layout. The content blocks keep their
   own class names; this file gives them the new look. Loaded after kw-b.css. */
:root{--crimson:#a30a1f;--surface:#fafaf8;--text:#232323;--text-muted:#4b4b48;--border:#ddd9d1;--text-on-dark:#fafafa;--text-muted-on-dark:#d2cec5;--font-serif:var(--serif);--font-sans:var(--sans)}
.overline{font:600 12px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.on-dark .overline{color:var(--on-dark-muted)}
.lede,.lede-p{font:400 19px/1.6 var(--serif);color:var(--muted);max-width:44em;margin-top:14px}
.sec h2.headline{margin-top:6px}
.sec h3{font:600 24px/1.25 var(--serif)}
details>summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
details>summary::-webkit-details-marker{display:none}
details .pm{font:400 22px/1 var(--sans);color:var(--red);transition:transform .25s}
details[open] .pm{transform:rotate(45deg)}
.page-hero .hero-cta .btn+.btn{background:transparent;color:var(--on-dark);border-color:#6a6b65}

/* CFO services */
.insp-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;margin-top:40px;align-items:start}
.insp-list{list-style:none;padding:0;margin:18px 0 0}
.insp-list li{font:400 17px/1.6 var(--serif);color:var(--muted);padding:18px 0;border-top:1px solid var(--line)}
.insp-list li strong{display:block;font:600 19px/1.35 var(--serif);color:var(--ink);margin-bottom:4px}
.insp-card{background:var(--card);border:1px solid var(--line);border-top:4px solid var(--red);padding:30px}
.insp-card>img{width:44px;height:auto;margin-bottom:14px}
.insp-card p{font:400 17px/1.6 var(--serif);color:var(--muted);margin-top:12px}
.svc-done{font:500 14px/1.55 var(--sans)!important;color:var(--ink)!important;margin-top:16px!important;padding-top:14px;border-top:1px solid var(--line)}
.svc-done b{font-weight:700}
.insp-card details,.svc details{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.insp-card summary,.svc summary{font:600 14px/1.4 var(--sans);letter-spacing:.04em;min-height:32px}
.svc-more{font:400 16px/1.6 var(--serif)!important;color:var(--ink)!important;margin-top:10px}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 8px}
.chips .chip{border-color:var(--line-strong);color:var(--ink);background:var(--card)}
.chips .chip:hover{border-color:var(--ink)}
.chips .chip[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.svc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:28px}
.svc{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-top:4px solid var(--red);padding:28px}
.svc[hidden]{display:none}
.svc-glyph{width:40px;height:auto;margin-bottom:14px}
.svc h3{font:600 24px/1.2 var(--serif)}
.svc-body{font:400 17px/1.6 var(--serif);color:var(--muted);margin-top:10px}
.bound{max-width:860px}
.bound p:not(.lede-p){font:400 18px/1.65 var(--serif);color:var(--muted);margin-top:16px}
#sme{background:var(--stone)} #boundary{background:var(--warm);border-top:1px solid var(--line)}

/* About */
.about-hero .about-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:56px;align-items:start}
.about-hero img{width:100%;aspect-ratio:4/5;object-fit:cover;border:1px solid #3a3b37}
.about-hero .person-cap{font:600 14px/1.4 var(--sans);color:var(--on-dark);margin-top:12px}
.about-hero .person-cap b{display:block}
.about-hero .person-cap{color:var(--on-dark-muted)}
.about-hero .person-cap b{color:var(--on-dark)}
.about-hero h1{font:700 clamp(34px,3.6vw,50px)/1.08 var(--serif);letter-spacing:-.02em;margin-top:14px}
.about-hero .lede{color:var(--on-dark-muted);font-size:20px}
.claude-inline{display:inline-block;width:18px;height:18px;margin-left:6px;vertical-align:-2px}
.claude-inline svg{width:100%;height:100%}
#why{background:var(--dark);color:var(--on-dark)}
#why .headline{color:var(--on-dark)}
.rec-intro{font:400 19px/1.6 var(--serif);color:var(--on-dark-muted);max-width:44em;margin-top:14px}
.rec-list{margin-top:32px;border-top:1px solid #3a3b37}
.rec-item{border-bottom:1px solid #3a3b37;padding:6px 0}
.rec-item summary{font:600 22px/1.3 var(--serif);padding:16px 0}
.rec-body{font:400 17px/1.6 var(--serif);color:var(--on-dark-muted);padding:0 0 20px;max-width:46em}
.rp-frame{margin-bottom:14px}
.rp-list{list-style:none;padding:0;margin:0}
.rp-list li{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-top:1px solid #33342f}
.rp-name{color:var(--on-dark)}
.rp-where{display:block;font:500 13px/1.4 var(--sans);color:var(--on-dark-muted);margin-top:2px}
.rp-val{font:600 17px/1.3 var(--serif);color:var(--on-dark);white-space:nowrap}
.rp-muted{color:var(--on-dark-muted)}
.map-wrap{margin-top:28px;max-width:980px}
.map-wrap svg{width:100%;height:auto;display:block}
.map-wrap svg text{font:600 13px var(--sans);letter-spacing:.06em;fill:var(--ink)}
.map-cities{font:500 14px/1.6 var(--sans);color:var(--muted);margin-top:14px}

/* FAQ */
.faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 48px;margin-top:8px}
.faq-item{border-top:1px solid var(--line);padding:24px 0}
.faq-q{font:600 21px/1.35 var(--serif)!important;margin:0}
.faq-a{font:400 17px/1.65 var(--serif);color:var(--muted);margin-top:10px}
.faq-a a{color:var(--ink)}

/* Pricing */
.p-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:8px}
.p-cell{background:var(--card);border:1px solid var(--line);border-top:4px solid var(--line-strong);padding:28px}
.p-cell.p-start{border-top-color:var(--red)}
.p-name{font:600 12px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.p-price{font:700 30px/1.2 var(--serif);margin-top:10px}
.p-body{font:400 17px/1.6 var(--serif);color:var(--muted);margin-top:12px}
.p-note{font:400 18px/1.65 var(--serif);color:var(--muted);margin-top:32px;max-width:52em}
.p-note strong,.rt-after strong{color:var(--ink)}
.rt-grid{margin-top:56px;padding-top:40px;border-top:1px solid var(--line)}
.rt-block h2{font:700 clamp(26px,2.4vw,34px)/1.15 var(--serif)}
.rt-line{font:400 18px/1.6 var(--serif);color:var(--muted);margin-top:10px}
.tbl-scroll{overflow-x:auto;margin-top:22px;max-width:720px}
.rtable{width:100%;border-collapse:collapse;font:500 16px/1.4 var(--sans)}
.rtable th{font:600 12px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:left;padding:12px 14px;border-bottom:2px solid var(--ink)}
.rtable td{padding:14px;border-bottom:1px solid var(--line)}
.rtable td:last-child,.rtable th:last-child{text-align:right;white-space:nowrap}
.rtable .rt-kw td{background:var(--dark);color:var(--on-dark);font-weight:700}
.rt-after{font:400 17px/1.65 var(--serif);color:var(--muted);margin-top:18px;max-width:52em}

@media (max-width:1100px){.insp-grid,.about-hero .about-grid{grid-template-columns:minmax(0,1fr);gap:32px}.insp-card{position:static}.about-hero img{max-width:320px}}
@media (max-width:760px){.svc-grid,.faq-grid,.p-grid{grid-template-columns:minmax(0,1fr)}.svc,.p-cell,.insp-card{padding:22px}.rp-list li{flex-direction:column;gap:4px}}
.svc.is-hidden{display:none}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
main h2.p-h{font:700 clamp(26px,2.4vw,34px)/1.15 var(--serif);margin:64px 0 14px}
.policy{max-width:860px}

/* 27 Oct 2026: the course pages, their download pages and the TW page keep their own content styles, which were
   written against the old colour names. These map the old names onto the new palette and fonts. */
:root{--surface-dark:var(--dark);--surface-inverse:var(--dark);--surface-warm:var(--warm);--border-on-dark:#3a3b37;
--border-subtle:var(--line);--crimson-text:var(--red-deep);--hover-wash:var(--stone);--hover-border:var(--line-strong);
--whatsapp:#25D366;--fluid:0px;--ease:cubic-bezier(.22,.61,.36,1);--band:72px;
--focus-ring:0 0 0 2px var(--paper),0 0 0 4px var(--ink);--focus-ring-dark:0 0 0 2px var(--dark),0 0 0 4px var(--paper);
--text-secondary:var(--muted);--text-tertiary:var(--muted);
--kw-ink:var(--ink);--kw-black:var(--dark);--kw-red:var(--red);--kw-red-active:var(--red-deep);--kw-paper:var(--paper);
--kw-blue-050:var(--stone);--kw-blue-300:var(--line-strong);--kw-gray-100:var(--line);--kw-gray-200:var(--line);--kw-gray-400:var(--line-strong)}
.sec-warm{background:var(--warm)}
.c-files{padding-left:0;list-style:none}
.page-hero + .sec.sec-warm{padding-top:48px}
.go{display:inline-flex;align-items:center;min-height:24px}
.p-cell{display:flex;flex-direction:column}
.p-cell .tlink{align-self:flex-start;margin-top:auto;padding-top:16px}
#training{background:var(--stone)}
#training .p-grid,#pricing .p-grid{margin-top:28px}
.ai-use{list-style:none;padding:0;margin:18px 0 0;max-width:820px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
.ai-use li{font:400 17px/1.5 var(--serif);color:var(--muted);padding:12px 0 12px 20px;border-top:1px solid var(--line);position:relative}
.ai-use li::before{content:"";position:absolute;left:0;top:21px;width:7px;height:7px;background:var(--red)}
@media (max-width:640px){.ai-use{grid-template-columns:minmax(0,1fr)}}
.q-post{aspect-ratio:4/5;overflow:hidden}
.q-post img{height:100%;object-fit:cover;object-position:top}
/* CFO service cards: each card shares the row lines, so title, text, outcome line and the fold sit level */
@supports (grid-template-rows:subgrid){.svc-grid{grid-auto-rows:auto}.svc{display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:0;align-content:start}.svc>*{align-self:start}}
/* course cards: room for the buttons on two lines in every card, so the prices sit level */
@media (min-width:761px){.courses-grid .offer>.acts{min-height:92px;align-content:flex-start}}
@media (min-width:761px){.p-grid .p-name{min-height:2.8em}}
@media (min-width:761px){.courses-grid .offer>.note-line{margin-top:auto;min-height:3.1em}.courses-grid .offer>p.price{margin-top:18px!important}}
