/* A static illustration of job states, review needs and shared responsibility. */
.review-holistic{margin-top:32px;padding:28px 0 7px;border-top:1px solid var(--line,#dce0e5);color:var(--ink,#242c38)}
.review-holistic .review-intro{margin-bottom:25px}
.review-holistic .review-intro h3{margin:0;font:700 24px/1.3 Manrope,Arial,sans-serif;letter-spacing:-.6px}
.review-holistic .review-intro>p{margin:7px 0 0;color:var(--body,#59616d);font:400 13px/1.6 Inter,Arial,sans-serif}
.review-holistic .review-scene{display:grid;grid-template-columns:minmax(0,1fr) 52px 132px 52px minmax(0,1fr);align-items:start}
.review-holistic .review-case{position:relative;min-width:0}
.review-holistic .review-case--hold{grid-column:1}
.review-holistic .review-case--invoice{grid-column:5}
.review-holistic .review-folio{position:relative;margin-right:8px}
.review-holistic .review-folio:before{content:'';position:absolute;inset:7px -8px -7px 8px;border:1px solid #dce0e5;background:#f4f5f7}
.review-holistic .review-job-sheet{position:relative;min-height:188px;padding:22px;background:#fff;border:1px solid #c6cfd9;box-shadow:0 9px 18px -18px #242c3870}
.review-holistic .review-job-sheet:after{content:'';position:absolute;top:-1px;right:-1px;width:23px;height:23px;background:linear-gradient(45deg,#e7ebf1 0,#e7ebf1 49%,#fff 50%);clip-path:polygon(0 0,100% 100%,0 100%)}
.review-holistic .review-case-name{margin:0;padding-right:12px;color:var(--body,#59616d);font:500 16px/1.5 Inter,Arial,sans-serif;letter-spacing:-.15px}
.review-holistic .review-held-state{display:flex;align-items:center;gap:18px;min-height:96px;margin-top:17px}
.review-holistic .review-held-state svg{display:block;width:31px;height:43px;flex-shrink:0;fill:var(--blue,#2557d6)}
.review-holistic .review-held-state h4{margin:0;font:700 22px/1.35 Manrope,Arial,sans-serif;letter-spacing:-.45px}
.review-holistic .review-next{display:grid;gap:3px;margin:20px 0 0;padding-left:1px}
.review-holistic .review-next span{color:var(--body,#59616d);font:400 12px/1.6 Inter,Arial,sans-serif}
.review-holistic .review-next strong{color:var(--ink,#242c38);font:600 16px/1.5 Inter,Arial,sans-serif;letter-spacing:-.15px}
.review-holistic .review-connection{position:relative;height:1px;margin-top:88px;background:#b4bfcc}
.review-holistic .review-connection:after{content:'';position:absolute;top:-3px;width:7px;height:7px;border:1px solid #a5b4ca;border-radius:50%;background:#fff}
.review-holistic .review-connection--left{grid-column:2;margin-right:-32px}.review-holistic .review-connection--left:after{left:0}
.review-holistic .review-connection--right{grid-column:4;margin-left:-32px}.review-holistic .review-connection--right:after{right:0}
.review-holistic .review-owner{grid-column:3;text-align:center;padding-top:54px}
.review-holistic .review-owner-mark{display:grid;place-items:center;width:68px;height:68px;margin:auto;border:1px solid #92ace1;border-radius:50%;background:#fff}
.review-holistic .review-owner-mark svg{display:block;width:43px;height:43px;fill:none;stroke:var(--blue,#2557d6);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.review-holistic .review-owner>p{margin:12px 0 0}
.review-holistic .review-owner strong{display:block;font:700 20px/1.3 Manrope,Arial,sans-serif;letter-spacing:-.4px}
.review-holistic .review-owner>p>span{display:block;margin-top:3px;color:var(--body,#59616d);font:400 12px/1.6 Inter,Arial,sans-serif}
.review-holistic .review-completed{display:flex;align-items:center;gap:7px;margin:9px 0 0;color:var(--body,#59616d);font:400 14px/1.6 Inter,Arial,sans-serif}
.review-holistic .review-completed svg{display:block;width:18px;height:18px;flex-shrink:0;fill:none;stroke:var(--blue,#2557d6);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.review-holistic .review-invoice-note{position:relative;display:flex;align-items:center;gap:12px;margin:13px -15px -10px 15px;padding:13px 14px;background:#f5f7fc;border:1px solid #d7deea;border-left:2px solid var(--blue,#2557d6)}
.review-holistic .review-invoice-note>svg{display:block;width:23px;height:30px;flex-shrink:0;fill:none;stroke:#607cae;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.review-holistic .review-invoice-note h4{margin:0;font:700 18px/1.4 Manrope,Arial,sans-serif;letter-spacing:-.3px}
@media(min-width:701px) and (max-width:900px){
 .review-holistic .review-scene{grid-template-columns:minmax(0,1fr) 24px 100px 24px minmax(0,1fr)}
 .review-holistic .review-job-sheet{padding:18px;min-height:188px}.review-holistic .review-case-name{font-size:15px}.review-holistic .review-held-state{gap:12px}.review-holistic .review-held-state h4{font-size:20px}.review-holistic .review-held-state svg{width:26px;height:38px}
 .review-holistic .review-connection--left{margin-right:-20px}.review-holistic .review-connection--right{margin-left:-20px}
 .review-holistic .review-owner-mark{width:60px;height:60px}.review-holistic .review-owner{padding-top:58px}.review-holistic .review-owner strong{font-size:19px}.review-holistic .review-invoice-note{margin-left:0;margin-right:-10px;gap:9px;padding:11px}.review-holistic .review-invoice-note h4{font-size:17px}.review-holistic .review-invoice-note>svg{width:20px;height:27px}
}
@media(max-width:700px){
 .review-holistic{margin-top:28px;padding-top:25px}.review-holistic .review-intro{margin-bottom:21px}.review-holistic .review-intro h3{font-size:24px}.review-holistic .review-intro>p{font-size:13px}
 .review-holistic .review-scene{grid-template-columns:52px minmax(0,1fr);column-gap:18px;row-gap:22px}
 .review-holistic .review-owner{grid-column:1/3;grid-row:1;display:flex;align-items:center;gap:14px;padding:0;text-align:left}
 .review-holistic .review-owner-mark{width:52px;height:52px;flex-shrink:0;margin:0}.review-holistic .review-owner-mark svg{width:34px;height:34px}.review-holistic .review-owner>p{margin:0}.review-holistic .review-owner strong{font-size:20px}.review-holistic .review-owner>p>span{font-size:13px;margin-top:2px}
 .review-holistic .review-connection{display:none}
 .review-holistic .review-case{grid-column:2;grid-row:auto}.review-holistic .review-case--hold{grid-row:2}.review-holistic .review-case--invoice{grid-row:3}
 .review-holistic .review-case:before{content:'';position:absolute;left:-44px;top:-22px;bottom:-22px;width:1px;background:#b4bfcc}
 .review-holistic .review-case--invoice:before{bottom:auto;height:110px}
 .review-holistic .review-case:after{content:'';position:absolute;left:-44px;top:88px;width:44px;height:1px;background:#b4bfcc}
 .review-holistic .review-job-sheet{min-height:160px;padding:18px}.review-holistic .review-case-name{font-size:15px;line-height:1.5}.review-holistic .review-held-state{min-height:78px;margin-top:12px;gap:14px}.review-holistic .review-held-state svg{width:26px;height:36px}.review-holistic .review-held-state h4{font-size:21px}
 .review-holistic .review-next{gap:2px;margin-top:17px}.review-holistic .review-next strong{font-size:16px}.review-holistic .review-next span{font-size:12px}
 .review-holistic .review-completed{font-size:13px;margin-top:8px}.review-holistic .review-invoice-note{margin:11px -10px -8px 0;padding:10px;gap:9px}.review-holistic .review-invoice-note h4{font-size:17px}.review-holistic .review-invoice-note>svg{width:20px;height:27px}
}

/* Isolated illustrative forecast: every selector is namespaced. */
.hh-forecast {
  --hh-fc-ink: var(--ink, #242c38);
  --hh-fc-body: var(--body, #59616d);
  --hh-fc-line: var(--line, #dce0e5);
  --hh-fc-blue: var(--blue, #2557d6);
  --hh-fc-accent: var(--accent-tint, #eff3fc);
  --hh-fc-recorded: #38414d;
  --hh-fc-committed: #b7bfca;
  box-sizing: border-box;
  container-type: inline-size;
  width: 100%;
  max-width: 520px;
  min-width: 0;
  margin: 0;
  padding: 24px 20px 22px;
  border-top: 2px solid var(--hh-fc-ink);
  border-bottom: 1px solid var(--hh-fc-line);
  background: #fff;
  color: var(--hh-fc-ink);
  font-family: Inter, Arial, sans-serif;
}
.hh-forecast *,
.hh-forecast *::before,
.hh-forecast *::after { box-sizing: border-box; }

.hh-forecast .hh-fc__caption {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 4px 14px;
  margin: 0 0 24px;
  color: var(--hh-fc-ink);
  font: 600 12px/1.6 Inter, Arial, sans-serif;
  letter-spacing: 0;
}
.hh-forecast .hh-fc__caption > span + span {
  color: var(--hh-fc-body);
  font-weight: 400;
}
.hh-forecast .hh-fc__totals {
  display: grid;
  grid-template-columns: minmax(0, 1.14fr) minmax(0, .86fr);
  gap: 18px;
  align-items: end;
}
.hh-forecast .hh-fc__totals h3 {
  margin: 0 0 9px;
  color: var(--hh-fc-ink);
  font: 700 16px/1.4 Manrope, Arial, sans-serif;
  letter-spacing: -.3px;
}
.hh-forecast .hh-fc__totals p {
  margin: 0;
  font-family: Inter, Arial, sans-serif;
  font-weight: 600;
  line-height: 1.06;
  letter-spacing: -1.5px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.hh-forecast .hh-fc__forecast p { color: var(--hh-fc-blue); font-size: 36px; }
.hh-forecast .hh-fc__budget { text-align: right; }
.hh-forecast .hh-fc__budget h3 { color: var(--hh-fc-body); }
.hh-forecast .hh-fc__budget p { color: var(--hh-fc-ink); font-size: 27px; letter-spacing: -1px; }
.hh-forecast .hh-fc__comparison {
  margin: 17px 0 0;
  color: var(--hh-fc-body);
  font: 400 14px/1.6 Inter, Arial, sans-serif;
  letter-spacing: 0;
}
.hh-forecast .hh-fc__comparison strong { color: var(--hh-fc-ink); font-weight: 600; }

.hh-forecast .hh-fc__chart { margin: 27px 0 0; }
.hh-forecast .hh-fc__forecast-span {
  position: relative;
  width: 93.75%;
  height: 27px;
  border-top: 1px solid var(--hh-fc-ink);
  color: var(--hh-fc-body);
  font: 400 11px/1.6 Inter, Arial, sans-serif;
  letter-spacing: 0;
}
.hh-forecast .hh-fc__forecast-span::before,
.hh-forecast .hh-fc__forecast-span::after {
  content: '';
  position: absolute;
  top: 0;
  width: 1px;
  height: 7px;
  background: var(--hh-fc-ink);
}
.hh-forecast .hh-fc__forecast-span::before { left: 0; }
.hh-forecast .hh-fc__forecast-span::after { right: 0; }
.hh-forecast .hh-fc__forecast-span span {
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  padding: 0 8px;
  background: #fff;
  white-space: nowrap;
}
.hh-forecast .hh-fc__bar {
  display: grid;
  grid-template-columns: 52.5% 22.5% 18.75% 6.25%;
  height: 47px;
  overflow: hidden;
  border-radius: 3px;
}
.hh-forecast .hh-fc__segment {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  color: #fff;
  font: 600 12px/1 Inter, Arial, sans-serif;
  letter-spacing: -.2px;
  white-space: nowrap;
}
.hh-forecast .hh-fc__segment--recorded { background: var(--hh-fc-recorded); }
.hh-forecast .hh-fc__segment--committed { background: var(--hh-fc-committed); color: var(--hh-fc-ink); }
.hh-forecast .hh-fc__segment--remaining { background: var(--hh-fc-blue); }
.hh-forecast .hh-fc__segment--headroom,
.hh-forecast .hh-fc__key--headroom {
  background: repeating-linear-gradient(135deg, transparent 0, transparent 4px, #c8d0dd 4px, #c8d0dd 5px), var(--hh-fc-accent);
}
.hh-forecast .hh-fc__scale {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 9px;
  color: var(--hh-fc-body);
  font: 400 11px/1.5 Inter, Arial, sans-serif;
  letter-spacing: 0;
}

.hh-forecast .hh-fc__legend {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px 24px;
  margin: 25px 0 0;
  padding: 0;
}
.hh-forecast .hh-fc__legend > div { min-width: 0; }
.hh-forecast .hh-fc__legend dt {
  position: relative;
  min-height: 42px;
  margin: 0;
  padding-left: 19px;
  color: var(--hh-fc-ink);
  font: 600 13px/1.6 Inter, Arial, sans-serif;
  letter-spacing: -.1px;
}
.hh-forecast .hh-fc__key {
  position: absolute;
  top: 5px;
  left: 0;
  width: 11px;
  height: 11px;
  border-radius: 1px;
}
.hh-forecast .hh-fc__key--recorded { background: var(--hh-fc-recorded); }
.hh-forecast .hh-fc__key--committed { background: var(--hh-fc-committed); }
.hh-forecast .hh-fc__key--remaining { background: var(--hh-fc-blue); }
.hh-forecast .hh-fc__key--headroom { border: 1px solid #c8d0dd; }
.hh-forecast .hh-fc__legend dd {
  display: grid;
  gap: 5px;
  margin: 3px 0 0;
  padding-left: 19px;
  color: var(--hh-fc-body);
  font: 400 12px/1.6 Inter, Arial, sans-serif;
  letter-spacing: 0;
}
.hh-forecast .hh-fc__legend dd strong {
  color: var(--hh-fc-ink);
  font: 600 16px/1.4 Inter, Arial, sans-serif;
  letter-spacing: -.25px;
  font-variant-numeric: tabular-nums;
}
.hh-forecast .hh-fc__explanation {
  margin: 22px 0 0;
  padding-top: 16px;
  border-top: 1px solid var(--hh-fc-line);
  color: var(--hh-fc-body);
  font: 400 12px/1.65 Inter, Arial, sans-serif;
  letter-spacing: 0;
}

@container (min-width: 380px) {
  .hh-forecast .hh-fc__forecast p { font-size: 43px; }
  .hh-forecast .hh-fc__budget p { font-size: 30px; }
  .hh-forecast .hh-fc__totals h3 { font-size: 17px; }
  .hh-forecast .hh-fc__bar { height: 50px; }
  .hh-forecast .hh-fc__legend dt { min-height: 21px; font-size: 14px; }
  .hh-forecast .hh-fc__legend dd { font-size: 13px; }
}
@container (max-width: 379px) {
  .hh-forecast .hh-fc__segment:not(.hh-fc__segment--headroom) { font-size: 0; }
}
@container (max-width: 285px) {
  .hh-forecast .hh-fc__forecast p { font-size: 31px; }
  .hh-forecast .hh-fc__budget p { font-size: 24px; }
  .hh-forecast .hh-fc__totals { gap: 12px; }
  .hh-forecast .hh-fc__totals h3 { font-size: 14px; }
  .hh-forecast .hh-fc__legend { column-gap: 18px; }
}
