/* Works Better v2: approved D2 "Workflow showcase" design. One stylesheet plus fonts.css. System body font. */
:root{
  --paper:#F4F1EA; --paper-2:#EAE5DA; --sheet:#FCFAF4; --char:#1B1D1F; --char-2:#26292C; --char-3:#35393D;
  --orange:#FF6B00; --yellow:#FFC700; --muted:#4F5357; --line:#CFC8B8; --white:#fff; --brass:#7A4B00; --arrow:#C2410C;
  --display:"Barlow Condensed","Barlow Condensed Fallback","Roboto Condensed","Arial Narrow","Helvetica Neue",Arial,sans-serif;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono","DejaVu Sans Mono",Menlo,Consolas,monospace;
  color-scheme:light;
  /* Motion (MOT-5): two curves, three durations; the overshoot is kept for the stamp only. Loops run one second a cycle. */
  --ease-out:cubic-bezier(.2,.7,.2,1); --ease-io:ease-in-out; --ease-stamp:cubic-bezier(.2,1.4,.4,1);
  --d-fast:.15s; --d-med:.3s; --d-slow:.5s; --d-loop:calc(var(--d-slow) * 2);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--paper);color:var(--char);font-family:var(--body);font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
img,svg{max-width:100%;height:auto}
a{color:inherit;text-underline-offset:.18em}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0}
h1,h2{text-wrap:balance}
main:focus{outline:none}
:focus-visible{outline:3px solid var(--char);outline-offset:3px;box-shadow:0 0 0 6px var(--yellow)}
.top :focus-visible,.mbar :focus-visible,.strip :focus-visible,.creds :focus-visible,.card :focus-visible,.show :focus-visible,.site-footer :focus-visible{outline-color:var(--yellow);box-shadow:none}
.sr,.screen-reader-text{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.screen-reader-text:focus{position:fixed;z-index:100;top:12px;left:12px;width:auto;height:auto;margin:0;padding:12px 16px;clip:auto;clip-path:none;background:var(--yellow);color:var(--char);font-weight:700;text-decoration:none}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.hazard{height:10px;background:repeating-linear-gradient(-45deg,var(--yellow) 0 14px,var(--char) 14px 28px)}
.disp{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.02em;line-height:.93}
/* header */
.top{background:var(--char);color:var(--white);position:relative}
.top>.wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:1.45rem;letter-spacing:.01em;min-height:44px}
.logo i,.logo-mark{width:22px;height:22px;background:var(--orange);display:inline-block;clip-path:polygon(0 0,100% 0,100% 70%,70% 100%,0 100%)}
nav.main{display:flex;align-items:center;gap:6px}
nav.main a{text-decoration:none;font-weight:600;font-size:.95rem;padding:10px 12px;min-height:44px;display:inline-flex;align-items:center;border-radius:4px}
nav.main a:hover{background:var(--char-3)}
nav.main a[aria-current="page"],.menu-list a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.3em}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;font-weight:800;text-decoration:none;border:2px solid var(--char);border-radius:4px;font-size:1rem;line-height:1.25;text-align:center;cursor:pointer;font-family:var(--body);background:var(--white);color:var(--char)}
.btn.primary{background:var(--orange);color:var(--char);box-shadow:5px 5px 0 var(--char)}
.btn.dark{background:var(--char);color:var(--white);box-shadow:5px 5px 0 var(--yellow)}
.btn:disabled{background:#d8d3c6;border-color:#8a8579;color:#3c3f42;box-shadow:none;cursor:not-allowed}
@media (prefers-reduced-motion:no-preference){.btn.primary,.btn.dark{transition:transform var(--d-fast),box-shadow var(--d-fast)}}
.btn.primary:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--char)}
.btn.dark:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--yellow)}
.btn[aria-disabled=true],.btn.primary[aria-disabled=true],.btn.dark[aria-disabled=true],.btn.primary[aria-disabled=true]:hover,.btn.dark[aria-disabled=true]:hover{background:#d8d3c6;border-color:#8a8579;color:#3c3f42;box-shadow:none;transform:none;cursor:progress}
.top .btn.primary{border-color:var(--orange);box-shadow:none;padding:8px 18px;min-height:44px}
.top .btn.primary:hover{transform:none;background:#ff8533}
.menu{display:none}
.menu summary{list-style:none;cursor:pointer;min-height:44px;min-width:44px;display:inline-flex;align-items:center;padding:0 12px;border:2px solid var(--char-3);border-radius:4px;font-weight:700}
.menu summary::-webkit-details-marker{display:none}
.menu[open] .menu-list{display:flex}
.menu-list{display:none;position:absolute;left:0;right:0;top:100%;background:var(--char-2);flex-direction:column;padding:8px 24px 16px;z-index:20}
.menu-list a{padding:12px 0;min-height:44px;text-decoration:none;font-weight:600;border-bottom:1px solid var(--char-3);display:flex;align-items:center}
.menu-list a.menu-cta{color:var(--yellow);border-bottom:0}
/* hero */
.hero{padding:52px 0 64px;position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px;opacity:.35;mask-image:linear-gradient(90deg,transparent 35%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 35%,#000 100%);pointer-events:none}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.02fr .98fr;grid-template-rows:auto auto 1fr;grid-template-areas:"text demo" "cta demo" "rest demo";column-gap:48px;align-items:start}
.h-text{grid-area:text}.h-cta{grid-area:cta}.h-rest{grid-area:rest}.h-demo{grid-area:demo}
h1{font-size:clamp(2.3rem,4.5vw,3.85rem);margin:0 0 20px}
h1 mark{background:linear-gradient(var(--orange),var(--orange)) 0 59%/100% 72% no-repeat;color:var(--char);padding:0 .12em;white-space:nowrap;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.sub{font-size:1.08rem;max-width:34em;margin:0 0 20px}
.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 24px;margin-bottom:22px}
.cta-row .link{font-weight:700;padding:10px 0;min-height:44px;display:inline-flex;align-items:center}
.industries{margin:0 0 12px;font-size:.92rem}
.seeall{margin:0}
.micro{font-size:.88rem;color:var(--muted);max-width:34em;margin:0}
/* workflow card (hero + showcase) */
.card{background:var(--char);color:var(--white);border-radius:6px;box-shadow:10px 10px 0 var(--orange);overflow:hidden}
.card .bar{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 18px;border-bottom:1px solid var(--char-3);font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;color:#C9CDD1}
.card .bar b{color:var(--yellow);font-weight:700}
.node{width:44px;height:44px;border-radius:6px;background:var(--char-2);border:2px solid var(--char-3);display:grid;place-items:center;font-family:var(--mono);font-weight:700;font-size:.95rem;color:#C9CDD1;position:relative;z-index:1}
@media (prefers-reduced-motion:no-preference){.node{transition:background var(--d-med),border-color var(--d-med),color var(--d-med)}}
.card .foot{display:flex;flex-wrap:wrap;gap:8px 16px;justify-content:space-between;align-items:center;padding:12px 18px;border-top:1px solid var(--char-3);font-size:.78rem;color:#C9CDD1}
/* works-with strip */
.strip{background:var(--char);color:var(--white);padding:26px 0}
.strip .wrap{display:grid;gap:18px}
.strip .lbl{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:1.35rem;letter-spacing:.02em;color:var(--yellow);margin:0;line-height:1}
/* works with: one row per group, every row on the same column grid (owner review 17 Oct 2026, round 3) */
.ww{display:grid}
.wwg{display:grid;grid-template-columns:11rem minmax(0,1fr);align-items:center;column-gap:24px;padding:12px 0;border-top:1px solid var(--char-3)}
.wwg:last-child{border-bottom:1px solid var(--char-3)}
.wwg-l{margin:0;font-family:var(--mono);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#B8BDC2}
.logos{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px 18px;list-style:none;margin:0;padding:0}
.logos li{display:flex;align-items:center;gap:9px;font-weight:700;font-size:.98rem;line-height:1.2;min-height:34px}
.logos li.txt{padding-left:43px}
.logos img{height:28px;width:auto;display:block}
.logos img.wm{height:20px}
.ww-note{margin:0;font-size:.78rem;color:#B8BDC2}
@media (max-width:1100px){.logos{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:701px) and (max-width:900px){.logos{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* sections */
section{padding:52px 0}
.sec-head{margin-bottom:24px;max-width:50em}
.no{display:inline-block;font-family:var(--mono);font-weight:700;background:var(--char);color:var(--yellow);padding:4px 10px;font-size:.85rem;margin:0 0 14px}
h2.h{font-size:clamp(2.1rem,4.4vw,3.4rem);margin:0}
.intro{margin:12px 0 0;color:var(--muted);font-size:1.05rem}
.strong-link{font-weight:800;min-height:44px;display:inline-flex;align-items:center}
/* showcase */
.show{background:var(--char);color:#fff;border-top:10px solid var(--orange)}
.show .no{background:var(--yellow);color:var(--char)}
.show .intro{color:#D5D8DB}
/* proof cards */
.tick{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--orange);color:var(--char);font-size:.78rem;font-weight:800}
/* problem */
.problem{background:var(--paper-2);border-top:2px solid var(--char);border-bottom:2px solid var(--char)}
.pains{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pain{background:var(--sheet);border:2px solid var(--char);padding:22px;box-shadow:6px 6px 0 var(--char)}
.pain h3{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:1.6rem;line-height:1;margin:0 0 10px;letter-spacing:-.01em}
.pain p{margin:0}
.closing{margin:28px 0 0;font-weight:700;max-width:46em}
/* fee schedule */
.ledger{border-top:5px double var(--char);border-bottom:2px solid var(--char);background:var(--sheet)}
.entry{display:grid;grid-template-columns:56px 1.05fr 1.45fr 190px;gap:10px 28px;padding:28px 22px;border-bottom:1px dotted var(--muted);align-items:start}
.entry:last-child{border-bottom:0}
.entry .rn{font-family:var(--mono);font-weight:700;font-size:.9rem;background:var(--char);color:var(--yellow);padding:3px 0;text-align:center;width:44px}
.entry h3{font-size:2rem;margin:0 0 6px}
.entry .tm{font-family:var(--mono);font-size:.8rem;color:var(--muted);margin:0}
.entry p{margin:0}
.entry .go{margin-top:10px;font-weight:800;min-height:44px;display:inline-flex;align-items:center}
.entry .price{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:700;font-size:2.1rem;letter-spacing:-.04em;text-align:right;margin:0;line-height:1.1}
.entry .price span{background:none;box-shadow:inset 0 -.16em 0 var(--orange);padding:0 2px}
/* how it works */
.how{background:var(--paper-2);border-top:2px solid var(--char);border-bottom:2px solid var(--char)}
.steps{list-style:none;counter-reset:step;margin:0 0 20px;padding:0;max-width:50rem}
.steps li{position:relative;margin-bottom:26px;padding-left:64px}
.steps li::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:0;display:grid;place-items:center;width:44px;height:44px;border-radius:6px;background:var(--char);color:var(--yellow);font-family:var(--mono);font-weight:700}
.steps h3{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:1.6rem;line-height:1.05;margin:0 0 6px;letter-spacing:-.005em}
.steps p{margin:0;max-width:42rem}
/* proof */
.proof{background:var(--paper)}
.pgrid{display:grid;grid-template-columns:1fr 1fr;border:2px solid var(--char);background:var(--paper);box-shadow:8px 8px 0 var(--char)}
.change{padding:30px 30px 26px;border-right:2px dashed var(--char);display:flex;flex-direction:column;gap:6px}
.change .lab{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0;font-weight:700}
.change .b{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(1.7rem,3vw,2.4rem);line-height:1;margin:2px 0 4px;color:var(--muted)}
.change .a{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(2rem,3.4vw,2.9rem);line-height:1;margin:2px 0 4px}
.change .a mark{background:var(--orange);padding:0 .1em}
.arrow{display:flex;align-items:center;gap:14px;margin:12px 0;color:var(--char);font-family:var(--mono);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
.arrow:before,.arrow:after{content:"";flex:1;border-top:2px solid var(--char)}
.rcard{padding:26px 28px;background:var(--sheet)}
.rcard h4{font-size:1.7rem;margin:0 0 4px}
.rcard .meta{font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--brass);font-weight:700;margin:0 0 12px;padding-bottom:10px;border-bottom:2px solid var(--char)}
.checklist{list-style:none;margin:0;padding:0}
.checklist li{display:flex;gap:12px;align-items:center;padding:9px 0;border-bottom:1px dotted var(--muted);font-size:.97rem}
.checklist li .tick{flex:none}
h3.pt{font-size:1.7rem;margin:0 0 6px;line-height:1.05}
.paid{margin:0 0 14px;font-size:.95rem}
.paid b{background:var(--char);color:var(--yellow);font-family:var(--mono);font-size:.75rem;letter-spacing:.07em;text-transform:uppercase;padding:3px 9px;margin-right:8px}
.detail{margin:26px 0 0;max-width:54em}
.notclaimed{margin:16px 0 0;padding:12px 18px;border-left:6px solid var(--orange);background:#fff;max-width:54em;font-size:.95rem}
.mini{background:#fff;border:2px solid var(--char);border-radius:6px;padding:20px}
.mini h3{margin:0 0 8px;font-size:1.5rem}
.mini p{margin:0 0 10px;font-size:.95rem}
.mini p.mute{margin:0;color:var(--muted)}
.links{display:flex;flex-direction:column;font-weight:700}
.links a{min-height:44px;display:inline-flex;align-items:center}
/* credentials */
.creds{background:var(--char);color:#fff;font-family:var(--body);font-size:.92rem;padding:10px 0}
.creds .wrap{display:flex;flex-wrap:wrap;gap:0 28px;align-items:center;justify-content:space-between}
.creds p{margin:0}
.creds a{color:var(--yellow);font-weight:700;min-height:44px;display:inline-flex;align-items:center}
/* prices table */
.table-wrap{overflow-x:auto;margin-block:1rem}
.price-table{width:100%;border-collapse:collapse;background:var(--sheet);border-top:5px double var(--char);border-bottom:2px solid var(--char)}
.price-table th,.price-table td{padding:14px 14px;border-bottom:1px dotted var(--muted);text-align:left;vertical-align:top}
.price-table thead th{border-bottom:2px solid var(--char);font-family:var(--mono);font-size:.76rem;letter-spacing:.06em;text-transform:uppercase}
.price-table tbody th{font-weight:800}
.price-table td{font-family:var(--mono);font-variant-numeric:tabular-nums}
@media (max-width:40rem){
  .price-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .price-table,.price-table tbody,.price-table tr,.price-table th,.price-table td{display:block}
  .price-table tr{padding:12px 14px;border-bottom:1px dotted var(--muted)}
  .price-table th,.price-table td{padding:.1rem 0;border:0}
  .price-table td:last-child{color:var(--muted)}
  .price-table td[data-label]:before{content:attr(data-label);display:block;margin-top:.35rem;font-size:.69rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
}
/* FAQ */
.faqs{background:var(--paper-2);border-top:2px solid var(--char)}
.faq{max-width:52rem;border-top:2px solid var(--char)}
.faq details{border-bottom:1px solid var(--char);background:var(--sheet)}
.faq summary{display:flex;align-items:center;min-height:56px;padding:12px 18px;font-weight:800;cursor:pointer}
.faq details[open] summary{background:var(--yellow)}
.faq details>p{max-width:44rem;padding:14px 18px 4px;margin:0 0 .5rem}
/* FAQs in two newspaper columns on wide screens (owner review 17 Oct 2026): questions run down the left, then the right */
@media (min-width:1001px){.faq{max-width:none;columns:2;column-gap:28px;border-top:0}.faq details{break-inside:avoid;border-top:1px solid var(--char);margin:0 0 -1px}}
/* enquiry */
.enq{background:var(--orange);border-top:2px solid var(--char);border-bottom:2px solid var(--char)}
.enq-head{max-width:46rem;margin-bottom:26px}
.enq-head p{margin:12px 0 0;font-weight:600}
.form{background:var(--sheet);border:2px solid var(--char);box-shadow:8px 8px 0 var(--char);padding:26px;max-width:52rem}
.fine{font-size:.9rem;color:var(--muted);margin:1rem 0 0}
.fine a{display:inline-block;padding-block:.6rem}
/* footer */
.site-footer{background:var(--char);color:#C9CDD1;padding:40px 0 24px;font-size:.92rem}
.site-footer p{margin:0 0 .5rem}
.site-footer a{display:inline-block;padding-block:.55rem;color:#fff}
.site-footer__grid{display:grid;gap:24px}
.site-footer__brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:1.45rem;color:#fff}
.site-footer__legal{margin-top:24px;padding-top:16px;border-top:1px solid var(--char-3)}
.site-footer__legal p{margin:0;color:#B8BDC2}
/* generic templates (page, post, archive, search, 404) */
.section{padding-block:56px}
.prose{max-width:44rem}
.prose>*:last-child{margin-bottom:0}
.prose h2{font-size:1.8rem;margin:1.6em 0 .5em;text-transform:none;font-family:var(--body);font-weight:800;line-height:1.2}
.prose h3{margin:1.4em 0 .4em;font-size:1.25rem}
.prose img{border-radius:4px}
.wb-post .guide-enquiry{display:none}/* legacy in-post enquiry block; single.php adds the CTA and form */
.prose table{border-collapse:collapse;width:100%}
.prose th,.prose td{border:1px solid var(--line);padding:.5rem .75rem;text-align:left}
.prose blockquote{margin:1.5em 0;padding-left:1rem;border-left:4px solid var(--orange);color:var(--muted)}
.page-title{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:-.01em;line-height:1;font-size:clamp(2.2rem,5vw,3.4rem);max-width:30ch;margin-bottom:.5em}
.meta{color:var(--muted);font-size:.9rem}
.post-list{max-width:44rem}
.post-list__item{padding-block:1rem;border-bottom:1px solid var(--line)}
.post-list__item h2{margin-bottom:.2em;font-size:1.5rem;font-family:var(--body);font-weight:800;line-height:1.2}
.post-list__item a{display:inline-block;padding-block:.25rem}
.pagination .nav-links,.post-nav{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;margin-block:2rem}
.pagination a,.pagination span{display:inline-flex;align-items:center;min-height:44px;padding-inline:.5rem}
.post-nav a{display:inline-flex;align-items:center;min-height:44px}
.search-form{display:flex;flex-wrap:wrap;gap:.5rem;margin-block:1rem}
.search-form label{flex:1 1 14rem}
.search-form input[type="search"]{width:100%;min-height:48px;padding:.5rem .75rem;border:2px solid #5b5f64;border-radius:4px;font:inherit}
.search-form input[type="submit"]{min-height:48px;padding:.5rem 1.25rem;border:2px solid var(--char);border-radius:4px;background:var(--orange);color:var(--char);font:inherit;font-weight:800;cursor:pointer}
/* sub pages: breadcrumbs, page head, copy blocks */
.crumbs{margin:0 0 14px;font-family:var(--mono);font-size:.78rem;letter-spacing:.04em}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:0 8px}
.crumbs li+li:before{content:"/";margin-right:8px;color:var(--muted)}
.crumbs a{min-height:44px;min-width:44px;padding:0 4px;display:inline-flex;align-items:center;font-weight:700}
.crumbs [aria-current]{color:var(--muted);font-weight:700}
.phead{padding:24px 0 40px;position:relative;overflow:hidden;border-bottom:2px solid var(--char)}
.phead:before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px;opacity:.35;mask-image:linear-gradient(90deg,transparent 35%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 35%,#000 100%);pointer-events:none}
.phead .wrap{position:relative}
.phead h1{font-size:clamp(2.1rem,4.2vw,3.4rem);max-width:22em}
.phead .sub{max-width:40em}
.trust{font-size:.92rem;color:var(--muted);margin:0;max-width:40em}
.alt{background:var(--paper-2);border-top:2px solid var(--char);border-bottom:2px solid var(--char)}
.copy{max-width:46rem}
.copy>*:last-child{margin-bottom:0}
.bullets{margin:0 0 1em;padding-left:1.25em;max-width:46rem}
.bullets li{margin-bottom:.65em;padding-left:.2em}
.bullets li::marker{color:var(--orange);font-weight:800}
.mini-h{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:1.35rem;line-height:1.05;margin:1.4em 0 .5em}
.offerbox{margin:0 0 26px;border:2px solid var(--char);background:var(--sheet);box-shadow:8px 8px 0 var(--char);max-width:52rem}
.offerbox>div{display:grid;grid-template-columns:13rem 1fr;gap:4px 24px;padding:14px 20px;border-bottom:1px dotted var(--muted)}
.offerbox>div:last-child{border-bottom:0}
.offerbox dt{font-family:var(--mono);font-size:.74rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:700;padding-top:.3em}
.offerbox dd{margin:0;font-weight:700}
.price-table tbody th a{font-weight:800}
.price-table td a,.price-table th a{display:inline-block;padding-block:.5rem}
.works{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:0 0 1.5em}
.works .mini{height:100%}
.cta-sec{padding:56px 0}
.cta-sec.alt{padding:56px 0}
.cta-block{background:var(--char);color:#fff;padding:34px 30px;border-radius:6px;box-shadow:8px 8px 0 var(--orange);max-width:52rem}
.cta-block h2{font-size:clamp(1.9rem,3.6vw,2.8rem);margin:0 0 12px;color:var(--yellow)}
.cta-block p{margin:0 0 14px}
.cta-block .micro{color:#C9CDD1;margin:0}
.cta-block .btn.primary{border-color:var(--orange);box-shadow:none}
.rcard h3{font-size:1.7rem;margin:0 0 4px}
.rcard h3.disp{line-height:.95}
/* enquiry block: email fallback and HubSpot embedded form (scoped to .wb-enquiry) */
.enq-box{max-width:none} /* one full-width box under the heading (owner review 17 Oct 2026, round 3) */
.fallback{border:2px dashed var(--char);padding:20px 22px;background:var(--paper)}
.fb-h{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:1.7rem;line-height:1;margin:0 0 10px}
.fb-note{font-size:.92rem;color:var(--muted);margin:10px 0 0}
.wbf-two{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
.wbf-f{margin:0 0 1.1rem}
.wbf label{display:block;margin-bottom:.35rem;font-weight:700;color:var(--char)}
.wbf-req{font-weight:600;font-size:.9rem;color:var(--muted)}
.wbf input:not([type=checkbox]),.wbf select,.wbf textarea{display:block;width:100%;min-height:48px;padding:.6rem .75rem;border:2px solid #6B6B6B;border-radius:4px;background:#fff;color:var(--char);font:inherit}
.wbf textarea{min-height:8rem;resize:vertical}
.wbf ::placeholder{color:#6B6B6B}
.wbf [aria-invalid=true]{border-color:#8A1C00;box-shadow:inset 4px 0 0 #8A1C00}
.wbf-phone{display:grid;grid-template-columns:8.5rem 1fr;gap:10px}
.wbf-phone .wbf-err{grid-column:1/-1}
.wbf-err{display:block;margin-top:.35rem;color:#8A1C00;font-size:.9rem;font-weight:700}
.wbf-actions{margin:1.4rem 0 0}
.wbf-status{margin:.8rem 0 0;font-weight:700}
.wbf-status:empty,.wbf-ts:empty{display:none}
.wbf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.wbf-done{border:2px solid var(--char);background:var(--paper);padding:20px 22px;margin-bottom:1rem}
.wbf-done:focus{outline:3px solid var(--char);outline-offset:3px}
/* unbilled variations calculator (page-unbilled-variations-calculator.php) */
.uv{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start;max-width:62rem}
.uv-out{background:var(--char);color:#fff;padding:26px 24px;border-radius:6px;box-shadow:8px 8px 0 var(--orange)}
.uv-k{margin:0;font-weight:700;color:#C9CDD1}
.uv-big{font-family:var(--display);font-weight:800;font-size:clamp(2.6rem,6vw,4rem);line-height:1;margin:6px 0 16px;color:var(--yellow)}
.uv-line{margin:0 0 8px}
.uv-out .fine{color:#C9CDD1}
.uv-su{max-width:46rem}
/* job software cost calculator (page-job-software-cost-calculator.php) */
.jsc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:28px;align-items:start;max-width:72rem}
.jsc-out{background:var(--char);color:#fff;padding:22px 20px;border-radius:6px;box-shadow:8px 8px 0 var(--orange);min-width:0}
.jsc-k{margin:0 0 10px;font-weight:700;color:#C9CDD1}
.jsc-out .table-wrap{background:#fff;color:var(--char);border-radius:4px}
.jsc-out .fine{color:#C9CDD1}
.jsc-table .jsc-cost{font-family:var(--display);font-size:1.15rem;white-space:nowrap}
.jsc-table .jsc-more{display:block;margin-top:4px;opacity:.8}
.jsc-check label{display:flex;gap:10px;align-items:flex-start;font-weight:600}
.jsc-check input{width:auto;margin-top:4px}
@media (max-width:860px){.jsc{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){.uv{grid-template-columns:minmax(0,1fr)}}
/* responsive */
@media (max-width:1000px){
  .hero .wrap{grid-template-columns:1fr;grid-template-rows:none;grid-template-areas:"text" "cta" "demo" "rest"}
  .h-demo{margin:6px 0 34px}
  .pgrid,.pains{grid-template-columns:minmax(0,1fr)}
  .change{border-right:0;border-bottom:2px dashed var(--char)}
  .entry{grid-template-columns:44px 1fr 150px}
  .entry .desc{grid-column:1/-1;grid-row:2}
  .entry .price{grid-column:3;grid-row:1;align-self:start}
  nav.main{display:none}
  .menu{display:block}
}
@media (max-width:700px){
  body{font-size:16px}
  .wrap{padding:0 16px}
  main.wrap.section{padding-block:40px}
  .menu-list{padding:8px 16px 16px}
  .hero{padding:26px 0 40px}
  h1{margin-bottom:16px}
  .sub{margin-bottom:18px;font-size:1.02rem}
  section{padding:40px 0}
  .btn.primary,.btn.dark{width:100%}
  .btn.primary{box-shadow:4px 4px 0 var(--char)}
  .card{box-shadow:6px 6px 0 var(--orange)}
  .node{width:40px;height:40px}
  .change,.rcard{padding:22px 16px}
  .form{padding:18px 14px}
  .steps li{padding-left:56px}
  /* compact hero demo: tighter spacing only; every step keeps its full height, so nothing shifts (F13b) */
  .compact .foot{padding:10px 12px}
  .h-demo{margin:18px 0 8px}
  .hero .wrap{grid-template-areas:"text" "cta" "rest" "demo"}
}
@media (max-width:1000px){.works{grid-template-columns:1fr}}
@media (max-width:700px){.offerbox>div{grid-template-columns:1fr;padding:12px 14px}.wbf-two{display:block}.phead{padding:20px 0 40px}.cta-block{padding:24px 18px}}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
/* PR 4/5: build pages, examples, insights, posts, footer lists */
/* Price line under a build page's heading: the price chip on its own line, then the details; no separator left hanging at a line end */
.pstrip{margin:0 0 20px;font-family:var(--mono);font-size:.9rem;letter-spacing:.03em;display:block;line-height:1.7}
.pstrip b{display:table;margin-bottom:4px;background:var(--char);color:var(--yellow);padding:4px 10px;font-size:1rem}
.pstrip>span[aria-hidden]:first-of-type{display:none}
@media (max-width:480px){.pstrip>span[aria-hidden]{display:block;height:0;overflow:hidden}}
.demo-label{margin:0 0 10px;font-size:.88rem;color:var(--muted);border-left:4px solid var(--yellow);padding-left:12px;max-width:46em}
.demo-box .card{box-shadow:8px 8px 0 var(--orange)}
.fitgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px 40px;margin-top:8px}
.fitgrid .mini-h{margin-top:.4em}
.related{margin:30px 0 0;padding-top:16px;border-top:1px dotted var(--muted)}
.related .rel-h{margin:0 0 4px;font-family:var(--mono);font-size:.74rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:700}
.related ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 22px}
.related a{font-weight:700;min-height:44px;display:inline-flex;align-items:center}
.worked tbody th{width:12rem}
.pcard{display:block;padding:22px 24px;border:2px solid var(--char);background:var(--sheet);box-shadow:6px 6px 0 var(--char);margin:0 0 24px;max-width:46rem}
.pcard h3{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(1.5rem,2.6vw,2rem);line-height:1;margin:0 0 6px}
.pcard h3 a{color:inherit;min-height:44px;display:inline-flex;align-items:center}
.pcard .when{margin:0 0 8px;font-family:var(--mono);font-size:.76rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700}
.pcard p{margin:0 0 8px}
.pmeta{margin:0 0 14px;color:var(--muted);font-size:.92rem;font-family:var(--mono)}
.disclose{margin:0 0 6px;font-size:9px;color:var(--muted);max-width:46rem}
.post-body{padding:46px 0 24px}
.post-body .prose{font-size:1.05rem}
.post-body .prose a{font-weight:700}
.prose textarea{display:block;width:100%;max-width:100%;min-height:11rem;margin:.4rem 0 1rem;padding:10px;font:inherit;border:2px solid var(--char);background:var(--sheet)}
.prose label{display:block;font-weight:700}
.site-footer__h{font-family:var(--mono);font-size:.76rem;letter-spacing:.07em;text-transform:uppercase;color:#C9CDD1;margin:0 0 6px}
.site-footer__list{list-style:none;margin:0;padding:0}
.site-footer__list + .site-footer__h{margin-top:24px}
@media (max-width:1000px){.fitgrid{grid-template-columns:1fr}}
@media (max-width:700px){.worked tbody th{width:auto}.pcard{padding:16px;box-shadow:4px 4px 0 var(--char)}}
@media print{
  .top,.site-footer,.btn,.hazard,.mbar,.menu{display:none!important}
  *,*::before,*::after{background:none!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}
  .card,.cta-block,.show,.strip,.pb-price,.cstat,.side-cta,.inext{border:2px solid #000}
  .card,.cta-block,.pcard,.entry,.pain,.app,.faq details{break-inside:avoid}
  .g-bar,.mc-bar{background:#555!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .is-audit .g-bar{background:#000!important}
}
.lc{text-transform:none}
.mbar{display:none}
@media (max-width:700px) and (min-height:501px){
  html{scroll-padding-bottom:84px}
  .mbar{display:block;position:fixed;z-index:40;left:0;right:0;bottom:0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--char);border-top:3px solid var(--yellow)}
  .mbar[hidden]{display:none}
  .mbar .btn{width:100%;min-height:44px;background:var(--orange);border-color:var(--orange)}
}
/* Tools I work with (About, Workflow Audit) */
.tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px 32px;margin:0 0 18px}
.tools dt{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.02em;font-size:1.1rem;margin:0 0 6px;line-height:1.1}
.tools dd{margin:0;line-height:1.5}
.tools+.ww-note{font-size:.85rem;color:var(--muted);margin:0}
.fn{font-size:.88rem;color:var(--muted);margin:.6rem 0 1.6rem;max-width:52em}
.change .a.fact{font-size:1.5rem}
.change .a.fact b{font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;display:block;color:var(--muted)}
.quotes{display:grid;gap:18px;margin:0 0 28px}
.quote{margin:0;border-left:6px solid var(--orange);background:var(--sheet);padding:16px 20px}
.quote blockquote{margin:0 0 8px;font-size:1.15rem;font-weight:600}
.quote blockquote p{margin:0}
.quote figcaption{font-size:.9rem;color:var(--muted)}
.wbf{margin-bottom:1.2rem}
.navdd{position:relative}
.navdd summary{list-style:none;cursor:pointer;font-weight:600;font-size:.95rem;padding:10px 12px;min-height:44px;display:inline-flex;align-items:center;gap:6px;border-radius:4px}
.navdd summary::-webkit-details-marker{display:none}
.navdd summary:after{content:"▾";font-size:.8em}
.navdd summary:hover,.navdd[open] summary{background:var(--char-3)}
.navdd-list{position:absolute;left:0;top:calc(100% + 6px);z-index:30;list-style:none;margin:0;padding:8px 0;min-width:21rem;background:var(--char-2);border:2px solid var(--char-3);border-radius:6px;box-shadow:6px 6px 0 var(--orange)}
.navdd-list a{display:flex!important;width:100%;padding:10px 16px!important;border-radius:0!important}
.menu-sub summary{list-style:none;cursor:pointer;padding:12px 0;min-height:44px;font-weight:600;border-bottom:1px solid var(--char-3);display:flex;align-items:center;justify-content:space-between}
.menu-sub summary::-webkit-details-marker{display:none}
.menu-sub summary:after{content:"▾"}
.menu-sub[open] summary:after{content:"▴"}
.menu-sub-list{display:flex;flex-direction:column;padding-left:14px}
.navdd-list a,.menu-sub-list a{flex-direction:column;align-items:flex-start!important;gap:2px}
.nav-s{font-size:.8rem;font-weight:400;color:#C9CDD1;line-height:1.3}
.nf-builds a{font-weight:700}
@media (min-width:56rem){.site-footer__grid{grid-template-columns:1.2fr 1fr .8fr 1fr 1fr}}
.phead .wrap:has(>.ph-card){display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:center}
.hcard ol{list-style:none;margin:0;padding:8px 18px}
.hcard li{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--char-3)}
.hcard li:last-child{border-bottom:0}
.hcard .n{width:44px;height:44px;border-radius:6px;display:grid;place-items:center;background:var(--orange);color:var(--char);font-family:var(--mono);font-weight:800;font-size:.82rem}
.hcard b{display:block;color:#fff;font-size:1.02rem}
.hcard small{display:block;color:#C9CDD1;font-family:var(--mono);font-size:.74rem;margin-top:2px}
.fcard .n{background:var(--white);position:relative}
.fcard .n img{width:26px;height:26px;object-fit:contain}
.fcard li.ai .n{background:linear-gradient(135deg,#FF6B00,#FFB04C)}
.fcard li.you .n{background:var(--yellow)}
.fcard li:not(:last-child) .n:after{content:"";position:absolute;left:21px;top:44px;width:2px;height:24px;background:var(--orange)}
/* Text sections on wide screens (owner review 17 Oct 2026): heading on the left, text on the right, not one narrow
   column with empty space beside it. Sections with tables, the price box or an FAQ keep the full width. */
@media (min-width:1001px){main>section>.wrap:has(>.sec-head+.copy,>.sec-head+.bullets):not(:has(>.table-wrap,>.offerbox,>.faq,>.card,>.demo-box)){display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);column-gap:56px;align-items:start}
main>section>.wrap:has(>.sec-head+.copy,>.sec-head+.bullets):not(:has(>.table-wrap,>.offerbox,>.faq,>.card,>.demo-box))>*{grid-column:2}
main>section>.wrap:has(>.sec-head+.copy,>.sec-head+.bullets):not(:has(>.table-wrap,>.offerbox,>.faq,>.card,>.demo-box))>.sec-head{grid-column:1;grid-row:1/span 12;margin:0;position:sticky;top:24px}}
.hcard .hfoot{margin:0;padding:10px 18px;border-top:1px solid var(--char-3);font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;color:var(--yellow)}
@media (max-width:1000px){.phead .wrap:has(>.ph-card){grid-template-columns:1fr;gap:28px}}
@media (max-width:700px){.ph-card{display:none}}
/* Home compaction (audit F10, 16 Oct 2026): same content, less height. Desktop: wider hero demo, builds as a 2x2
   ledger, steps and FAQ in columns, enquiry head beside the form. Phones: price beside the build name, tighter strip,
   two-column footer. */
.home main>section{padding:60px 0}
.home .sec-head{margin-bottom:26px}
.entry{padding:20px 22px}
@media (min-width:1001px){.steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 40px;max-width:none}.steps li{margin:0}} /* owner review 17 Oct 2026: use the width */
.faq2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px;max-width:none;align-items:start}
@media (min-width:1001px){
  .hero .wrap{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);column-gap:40px}
  .ledger{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .entry{grid-template-columns:44px minmax(0,1fr) auto;gap:8px 18px}
  .entry:nth-child(odd){border-right:1px dotted var(--muted)}
  .entry:nth-last-child(-n+2){border-bottom:0}
  .entry .desc{grid-column:2/-1}
  .entry .price{grid-column:3;grid-row:1;font-size:1.75rem}
  .entry h3{font-size:1.7rem}
  .wbf-row{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
  .wbf-half{max-width:calc(50% - 11px)}
  .wbf-row .wbf-phone{grid-template-columns:6.5rem 1fr}
}
@media (max-width:1000px){.faq2{grid-template-columns:minmax(0,1fr)}}
@media (max-width:700px){
  .site-footer a{padding-block:.7rem}
  .home main>section{padding:44px 0}
  .strip{padding:20px 0}
  .wwg{grid-template-columns:minmax(0,1fr);row-gap:10px}
  .logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px}
  .logos li{font-size:.95rem;min-height:28px}
  .logos li.txt{padding-left:37px}
  .site-footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .site-footer__grid>:first-child,.site-footer__grid>:last-child{grid-column:1/-1}
  .entry{grid-template-columns:44px minmax(0,1fr) auto}
  .entry .price{grid-column:3;grid-row:1;font-size:1.4rem;text-align:right}
}
@media (max-width:420px){.entry{grid-template-columns:44px minmax(0,1fr)}.entry .price{grid-column:2;grid-row:2;text-align:left}.entry .desc{grid-row:3}}
/* Web review (owner, 24 Oct 2026): the finance-system line in the credentials strip, the A$198 line by the hero demo, payback under each build, the About headshot. */
.creds .creds-fleet{flex-basis:100%;margin:6px 0 0;opacity:.85;font-size:.86rem}
.demo-stat{margin:0 0 10px;font-size:.98rem}
.demo-stat b{background:var(--orange,#ff6a13);color:#111;padding:0 4px}
.ledger .pb{margin:4px 0 0;font-size:.82rem;opacity:.8}
.about-ph{display:block;width:120px;height:120px;border-radius:50%;object-fit:cover;margin:0 0 18px}
/* Setup guides: commands and config files to copy (pre.code), and inline code on the Xero MCP guide */
pre.code{margin:0 0 1.3em;max-width:52rem;padding:14px 16px;overflow-x:auto;background:var(--char);color:#E8EAEC;border-left:6px solid var(--orange);font:.84rem/1.6 var(--mono);white-space:pre;tab-size:2;-webkit-overflow-scrolling:touch}
pre.code code{font:inherit;background:none;padding:0;color:inherit}
pre.code:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
[data-wb-page="xero-mcp"] :not(pre)>code{font-family:var(--mono);font-size:.88em;padding:.08em .35em;background:var(--paper-2);border:1px solid var(--line);overflow-wrap:anywhere}
.price-table.prose td{font-family:var(--body);font-variant-numeric:normal}
@media (max-width:700px){pre.code{font-size:.78rem;padding:12px}}