/* Orion — the suites.
   The pieces assets/js/suites.js builds: the suite picker, the tier cards,
   the package builder, the comparison table, the add-ons, the bundles and
   the Orion Standard. Everything is set from tokens.css, so the same file
   serves the services page, the pricing page and the suite pages without
   knowing which it is on. Nothing here is smaller than 12px. */

.su-lab{margin:0 0 var(--sp-3);font-size:var(--fs-1);font-weight:var(--fw-semi);
  letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--gold)}
.su-fine{margin:var(--sp-4) 0 0;font-size:var(--fs-2);line-height:var(--lh-body);
  color:var(--text-3);max-width:70ch}
.su-fine a,.su-link,.su-flagship a,.su-unsure a,.su-demo-none a,.su-fail a{color:var(--gold);
  text-decoration:none;border-bottom:var(--line-strong);padding-bottom:1px}
.su-fine a:hover,.su-link:hover,.su-flagship a:hover,.su-unsure a:hover,.su-demo-none a:hover{
  color:var(--gold-bright);border-bottom-color:var(--gold-bright)}
.su-link{display:inline-block;font-size:var(--fs-1);font-weight:var(--fw-semi);
  letter-spacing:var(--ls-caps);text-transform:uppercase;padding-bottom:3px}
.su-fail{margin:0;padding:var(--sp-5) 0;font-size:var(--fs-3);color:var(--text-2)}
.su-none{color:var(--text-3)}

/* ── the question and its nine answers ────────────────────────────────── */
.su-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-3)}
.su-choice{display:flex;flex-direction:column;gap:var(--sp-1);min-width:0;width:100%;
  padding:var(--sp-4) var(--sp-5);text-align:left;cursor:pointer;
  background:rgba(255,255,255,.015);border:var(--line);border-radius:var(--r-md);
  font-family:var(--font-body);color:var(--text-2);
  transition:border-color var(--dur-2) var(--ease),background var(--dur-2) var(--ease)}
.su-choice:hover{background:rgba(255,255,255,.03);border-color:rgba(240,232,213,.22)}
.su-choice.is-on{border-color:var(--gold);background:rgba(201,168,76,.08)}
.su-choice:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.su-choice-n{font-family:var(--font-display);font-size:var(--fs-5);font-weight:var(--fw-semi);
  line-height:var(--lh-snug);color:var(--cream)}
.su-choice.is-on .su-choice-n{color:var(--gold-bright)}
.su-choice-l{font-size:var(--fs-2);line-height:var(--lh-snug);color:var(--text-3)}
.su-unsure{margin:var(--sp-5) 0 0;font-size:var(--fs-3);line-height:var(--lh-body);color:var(--text-2)}

/* ── the chosen suite ─────────────────────────────────────────────────── */
.su-panel{margin-top:var(--sp-7);padding-top:var(--sp-7);border-top:var(--line-strong);
  scroll-margin-top:var(--sp-9)}
.su-suite-h{max-width:68ch}
.su-name{margin:0;font-family:var(--font-display);font-size:var(--fs-7);font-weight:var(--fw-semi);
  line-height:var(--lh-snug);color:var(--cream)}
.su-name:focus{outline:none}
.su-problem{margin:var(--sp-3) 0 var(--sp-4);font-size:var(--fs-4);line-height:var(--lh-body);color:var(--text)}

.su-tiers{margin-top:var(--sp-6);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--sp-4);align-items:stretch}
.su-tier{position:relative;display:flex;flex-direction:column;min-width:0;
  padding:var(--sp-6) var(--sp-5) var(--sp-5);border:var(--line);border-radius:var(--r-md);
  background:rgba(255,255,255,.015)}
.su-tier.is-rec{border-color:var(--gold);background:rgba(201,168,76,.055)}
.su-flag{position:absolute;top:calc(var(--sp-3) * -1);left:var(--sp-5);margin:0;
  padding:3px var(--sp-3);background:var(--gold);color:#0a0a0a;border-radius:var(--r-sm);
  font-size:var(--fs-1);font-weight:var(--fw-bold);letter-spacing:var(--ls-caps);text-transform:uppercase}
.su-tier-n{margin:0;font-family:var(--font-display);font-size:var(--fs-6);font-weight:var(--fw-semi);
  line-height:var(--lh-snug);color:var(--cream)}
.su-tier-p{margin:var(--sp-2) 0 0;font-size:var(--fs-2);line-height:var(--lh-body);color:var(--text-3);
  min-height:3.3em}
.su-price{margin:var(--sp-4) 0 0;padding:var(--sp-4) 0;border-top:var(--line);border-bottom:var(--line);
  font-size:var(--fs-2);line-height:var(--lh-snug);color:var(--text-2);font-variant-numeric:tabular-nums}
.su-price b{font-family:var(--font-display);font-size:var(--fs-6);font-weight:var(--fw-semi);
  color:var(--cream);letter-spacing:0}
.su-price-m{white-space:nowrap}
.su-price-m b{font-size:var(--fs-5)}
.su-price-k{color:var(--text-3)}
.su-inc{list-style:none;margin:var(--sp-4) 0 var(--sp-5);padding:0;display:grid;gap:var(--sp-3);flex:1 1 auto;
  align-content:start}
.su-inc li{position:relative;padding-left:var(--sp-5);font-size:var(--fs-2);line-height:var(--lh-body);
  color:var(--text-2)}
.su-inc li::before{content:'';position:absolute;left:0;top:.68em;width:7px;height:1px;background:var(--gold)}
.su-get{align-self:flex-start}
.su-flagship{margin:var(--sp-5) 0 0;padding:var(--sp-4) var(--sp-5);border-left:2px solid var(--gold);
  background:rgba(201,168,76,.05);font-size:var(--fs-3);line-height:var(--lh-body);color:var(--text);
  max-width:70ch}

/* the five systems inside Finance & Reporting */
.su-sys{margin-top:var(--sp-7)}
.su-sys-list{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--sp-3)}
.su-sys-card a{display:flex;flex-direction:column;gap:var(--sp-2);height:100%;min-width:0;
  padding:var(--sp-4);border:var(--line);border-radius:var(--r-md);text-decoration:none;
  background:rgba(255,255,255,.015);transition:border-color var(--dur-2) var(--ease)}
.su-sys-card a:hover{border-color:var(--line-strong-colour)}
.su-sys-card a:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.su-sys-n{font-family:var(--font-display);font-size:var(--fs-5);font-weight:var(--fw-semi);
  line-height:var(--lh-snug);color:var(--cream)}
.su-sys-s{font-size:var(--fs-2);line-height:var(--lh-snug);color:var(--text-3);flex:1 1 auto}
.su-sys-p{font-size:var(--fs-2);color:var(--cream);font-variant-numeric:tabular-nums}
.su-sys-x{font-size:var(--fs-1);line-height:var(--lh-snug);color:var(--text-3)}
.su-sys-go{font-size:var(--fs-1);font-weight:var(--fw-semi);letter-spacing:var(--ls-caps);
  text-transform:uppercase;color:var(--gold)}

/* demo beside add-ons */
.su-extra{margin-top:var(--sp-7);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:var(--sp-7);align-items:start}
.su-demo,.su-addons{min-width:0}
.su-demo-t,.su-demo-none{margin:0 0 var(--sp-4);font-size:var(--fs-3);line-height:var(--lh-body);
  color:var(--text-2);max-width:56ch}

/* tables: add-ons, and the comparison */
.su-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;position:relative}
.su-scroll:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.su-table,.su-cmp{width:100%;border-collapse:collapse;font-size:var(--fs-2);
  font-variant-numeric:tabular-nums}
.su-table th,.su-table td{padding:var(--sp-3) var(--sp-4) var(--sp-3) 0;text-align:left;
  border-bottom:1px solid rgba(240,232,213,.07);color:var(--text-2);vertical-align:top;
  line-height:var(--lh-snug)}
.su-table thead th{font-size:var(--fs-1);font-weight:var(--fw-semi);letter-spacing:var(--ls-caps);
  text-transform:uppercase;color:var(--text-3);border-bottom:var(--line)}
.su-table tbody th{font-weight:var(--fw-medium);color:var(--cream)}
.su-table .num{text-align:right;white-space:nowrap;padding-right:0;padding-left:var(--sp-4)}
.su-td-s{display:block;margin-top:2px;font-weight:var(--fw-regular);color:var(--text-3)}

.su-cmp{min-width:46rem}
.su-cmp th,.su-cmp td{padding:var(--sp-3) var(--sp-4);text-align:left;vertical-align:top;
  border-bottom:1px solid rgba(240,232,213,.07);color:var(--text-2);line-height:var(--lh-snug)}
.su-cmp thead th{font-family:var(--font-display);font-size:var(--fs-5);font-weight:var(--fw-semi);
  color:var(--cream);border-bottom:var(--line-strong);vertical-align:bottom}
.su-cmp tbody th{width:30%;padding-left:0;font-weight:var(--fw-regular);color:var(--text)}
.su-cmp .is-rec{background:rgba(201,168,76,.055)}
.su-cmp thead th.is-rec{color:var(--gold-bright)}
.su-cmp-rec{display:block;margin-top:2px;font-family:var(--font-body);font-size:var(--fs-1);
  font-weight:var(--fw-semi);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--gold)}
.su-cmp-h th{padding:var(--sp-5) 0 var(--sp-2);font-size:var(--fs-1);font-weight:var(--fw-semi);
  letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--gold);border-bottom:var(--line)}
.su-y{color:var(--gold);font-weight:var(--fw-bold)}
.su-n{color:var(--text-3)}

/* ── the Orion Standard ───────────────────────────────────────────────── */
.su-std-first{margin:0 0 var(--sp-6);max-width:60ch;font-family:var(--font-display);font-style:italic;
  font-size:var(--fs-5);line-height:var(--lh-snug);color:var(--gold)}
.su-std-list{list-style:none;counter-reset:std;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));gap:0 var(--sp-7)}
.su-std-list li{counter-increment:std;display:grid;grid-template-columns:auto minmax(0,1fr);
  column-gap:var(--sp-4);padding:var(--sp-5) 0;border-top:var(--line)}
.su-std-list li::before{content:counter(std,decimal-leading-zero);grid-row:1 / span 2;
  font-family:var(--font-display);font-size:var(--fs-5);line-height:1.2;color:var(--gold)}
.su-std-t{font-family:var(--font-display);font-size:var(--fs-5);font-weight:var(--fw-semi);
  line-height:var(--lh-snug);color:var(--cream)}
.su-std-b{grid-column:2;margin-top:var(--sp-2);font-size:var(--fs-2);line-height:var(--lh-body);
  color:var(--text-2)}
.su-std--short .su-std-list{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:var(--sp-5)}

/* ── bundles ──────────────────────────────────────────────────────────── */
.su-bundles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-4)}
.su-bundle{display:flex;flex-direction:column;min-width:0;padding:var(--sp-6);border:var(--line);
  border-radius:var(--r-md);background:rgba(255,255,255,.015)}
.su-bundle.is-business{border-color:var(--line-strong-colour)}
.su-bundle-n{margin:0;font-family:var(--font-display);font-size:var(--fs-7);font-weight:var(--fw-semi);
  line-height:var(--lh-snug);color:var(--cream)}
.su-bundle-s{margin:var(--sp-2) 0 0;font-family:var(--font-display);font-style:italic;font-size:var(--fs-4);
  line-height:var(--lh-snug);color:var(--gold)}
.su-bundle-p{margin:var(--sp-4) 0 0;padding:var(--sp-3) 0;border-top:var(--line);border-bottom:var(--line);
  font-size:var(--fs-2);color:var(--cream)}
.su-bundle .su-fine{margin:0 0 var(--sp-5)}
.su-bundle .btn-ghost{align-self:flex-start;margin-top:auto}
.su-rules{list-style:none;margin:var(--sp-5) 0 0;padding:0;display:grid;gap:var(--sp-2)}
.su-rules li{position:relative;padding-left:var(--sp-5);font-size:var(--fs-3);line-height:var(--lh-body);
  color:var(--text-2)}
.su-rules li::before{content:'';position:absolute;left:0;top:.68em;width:7px;height:1px;background:var(--gold)}

/* ── the suites as links ──────────────────────────────────────────────── */
.su-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--sp-3)}
.su-links a{display:flex;flex-direction:column;gap:var(--sp-1);height:100%;min-width:0;padding:var(--sp-4) var(--sp-5);
  border:var(--line);border-radius:var(--r-md);text-decoration:none;background:rgba(255,255,255,.015);
  transition:border-color var(--dur-2) var(--ease)}
.su-links a:hover{border-color:var(--line-strong-colour)}
.su-links a:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.su-links-n{font-family:var(--font-display);font-size:var(--fs-5);font-weight:var(--fw-semi);color:var(--cream)}
.su-links-l{font-size:var(--fs-2);line-height:var(--lh-snug);color:var(--text-3);flex:1 1 auto}
.su-links-p{margin-top:var(--sp-2);font-size:var(--fs-2);color:var(--gold);font-variant-numeric:tabular-nums}

/* ── the package builder ──────────────────────────────────────────────── */
.su-b{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:var(--sp-7);align-items:start}
.su-b-list{min-width:0;margin:0;padding:0;border:0;display:grid;gap:0}
.su-b-row{padding:var(--sp-4) 0;border-top:var(--line)}
.su-b-row:last-child{border-bottom:var(--line)}
.su-b-suite{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:var(--sp-4);
  align-items:baseline;cursor:pointer}
.su-b-suite input,.su-b-opt input{width:18px;height:18px;margin:0;accent-color:var(--gold);cursor:pointer;
  transform:translateY(3px)}
.su-b-suite input:focus-visible,.su-b-opt input:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.su-b-suite-n{font-family:var(--font-display);font-size:var(--fs-5);font-weight:var(--fw-semi);
  line-height:var(--lh-snug);color:var(--cream)}
.su-b-suite-l{grid-column:2;font-size:var(--fs-2);line-height:var(--lh-snug);color:var(--text-3)}
.su-b-row.is-on .su-b-suite-n{color:var(--gold-bright)}
.su-b-opts{margin:var(--sp-4) 0 var(--sp-2) calc(18px + var(--sp-4));display:grid;gap:var(--sp-2)}
.su-b-hint{margin:0 0 var(--sp-2);font-size:var(--fs-2);line-height:var(--lh-body);color:var(--text-3)}
.su-b-opt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:var(--sp-3);align-items:baseline;
  padding:var(--sp-3) var(--sp-4);border:var(--line);border-radius:var(--r-sm);cursor:pointer;
  background:rgba(255,255,255,.015)}
.su-b-opt:has(input:checked){border-color:var(--line-strong-colour);background:rgba(201,168,76,.06)}
.su-b-opt-n{font-size:var(--fs-2);font-weight:var(--fw-medium);color:var(--cream);line-height:var(--lh-snug)}
.su-b-opt-p{font-size:var(--fs-2);color:var(--text-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.su-b-rec{margin-left:var(--sp-2);font-size:var(--fs-1);font-weight:var(--fw-semi);letter-spacing:var(--ls-caps);
  text-transform:uppercase;color:var(--gold)}

.su-b-sum{position:sticky;top:calc(var(--sp-9) + var(--sp-2));min-width:0}
.su-b-sum-in{padding:var(--sp-6);border:var(--line-strong);border-radius:var(--r-md);
  background:rgba(13,13,20,.92)}
.su-b-kicker{margin:0 0 var(--sp-4);font-size:var(--fs-1);font-weight:var(--fw-semi);
  letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--gold)}
.su-b-lines{list-style:none;margin:0 0 var(--sp-4);padding:0;display:grid;gap:var(--sp-2)}
.su-b-lines:empty{display:none}
.su-b-lines li{display:flex;justify-content:space-between;gap:var(--sp-4);font-size:var(--fs-2);
  line-height:var(--lh-snug);color:var(--text-2);font-variant-numeric:tabular-nums}
.su-b-lines li span:last-child{text-align:right;white-space:nowrap;color:var(--cream)}
.su-b-lines em{font-style:normal;color:var(--text-3)}
.su-b-lines small{display:block;font-size:var(--fs-1);color:var(--text-3)}
.su-b-fig{margin:0;display:grid;gap:0}
.su-b-fig > div{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--sp-4);
  align-items:baseline;padding:var(--sp-3) 0;border-top:var(--line)}
.su-b-fig dt{font-size:var(--fs-1);font-weight:var(--fw-semi);letter-spacing:var(--ls-caps);
  text-transform:uppercase;color:var(--text-3)}
.su-b-fig dd{margin:0;font-family:var(--font-display);font-size:var(--fs-7);font-weight:var(--fw-semi);
  line-height:1.1;color:var(--cream);text-align:right;font-variant-numeric:tabular-nums}
.su-b-fig dd.su-b-note{grid-column:1 / -1;font-family:var(--font-body);font-size:var(--fs-1);
  font-weight:var(--fw-regular);color:var(--text-3);text-align:right}
.su-b-yr dd{font-size:var(--fs-6)}
.su-b-save{margin:var(--sp-4) 0 0;font-size:var(--fs-2);line-height:var(--lh-body);color:var(--gold-bright)}
.su-b-nudge{margin:var(--sp-4) 0 0;padding:var(--sp-3) var(--sp-4);border-left:2px solid var(--gold);
  background:rgba(201,168,76,.06)}
.su-b-nudge p{margin:0;font-size:var(--fs-2);line-height:var(--lh-body);color:var(--text)}
.su-b-cta{display:flex;margin-top:var(--sp-5);text-align:center}
.su-b-fine{margin:var(--sp-3) 0 0;font-size:var(--fs-1);line-height:var(--lh-body);color:var(--text-3)}

/* ── narrower ─────────────────────────────────────────────────────────── */
@media(max-width:1100px){
  .su-sys-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .su-std-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .su-choices,.su-links{grid-template-columns:repeat(2,minmax(0,1fr))}
  .su-tiers{grid-template-columns:minmax(0,1fr);gap:var(--sp-6)}
  .su-tier-p{min-height:0}
  .su-extra{grid-template-columns:minmax(0,1fr);gap:var(--sp-6)}
  .su-bundles{grid-template-columns:minmax(0,1fr)}
  .su-b{grid-template-columns:minmax(0,1fr);gap:var(--sp-5)}
  .su-b-sum{position:static}
}
@media(max-width:620px){
  .su-choices,.su-links,.su-sys-list,.su-std-list,.su-std--short .su-std-list{grid-template-columns:minmax(0,1fr)}
  .su-choice{padding:var(--sp-3) var(--sp-4)}
  .su-b-opt{grid-template-columns:auto minmax(0,1fr)}
  .su-b-opt-p{grid-column:2;white-space:normal}
  .su-b-opts{margin-left:0}
  .su-bundle,.su-b-sum-in{padding:var(--sp-5)}
}
@media(prefers-reduced-motion:reduce){
  .su-choice,.su-sys-card a,.su-links a{transition:none}
}
@media print{
  .su-choices,.su-unsure,.su-get,.su-demo,.su-b-cta{display:none!important}
  .su-tier,.su-bundle,.su-sys-card a{border:1px solid #d9d9d9;background:none;break-inside:avoid}
  .su-flag{background:none;color:#6B5310;border:1px solid #b9a25f;position:static;display:inline-block;margin-bottom:4pt}
}

/* ── a suite's own page (/suites/…), on the spec-page system ──────────── */
.sp-hero--plain{min-height:0;padding:calc(var(--sp-9) + var(--sp-8)) 0 var(--sp-7);
  border-bottom:var(--line)}
.sp-hero--plain .sp-sum{max-width:44ch}
.su-page .sp-section > .su-intro{max-width:64ch;margin-bottom:var(--sp-6)}
.su-std-lead{margin:0 0 var(--sp-5);max-width:26ch;font-family:var(--font-display);font-size:var(--fs-7);
  font-weight:var(--fw-semi);line-height:var(--lh-snug);color:var(--cream)}
.su-page .su-demo-wrap{max-width:46rem}
.su-page .su-addons{max-width:46rem}

/* The header is fixed, so a section scrolled to from a link stops short of it. */
.su-page .sp-section{scroll-margin-top:88px}
@media print{.sp-hero--plain .sp-hero-actions,#enquire .sp-hero-actions{display:none!important}}