/* x1-business-case - /business-case (1001 additional pages). Scoped under .x1-business-case; builds on d29.css. */
.x1-business-case .bc-col-h {font-size: clamp(2rem, 1.35rem + 2.2vw, 3.25rem); margin-bottom: var(--stack-m);}
.x1-business-case .bc-two {align-items: start; row-gap: var(--stack-m);}
.x1-business-case .bc-two > :first-child {grid-column: 1 / span 5;}
.x1-business-case .bc-two > :last-child {grid-column: 7 / span 6;}
.x1-business-case .bc-two .bc-col-h {margin-bottom: 0;}

/* the four measures: a ledger, two by two */
.x1-business-case .bc-measures {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 1rem + 4vw, 6rem); border-top: 1px solid var(--ink);}
.x1-business-case .bc-m {position: relative; padding-block: clamp(2rem, 1.4rem + 1.6vw, 3rem); border-bottom: 1px solid var(--rule); display: grid; align-content: start; gap: 1rem;}
.x1-business-case .bc-m-mark {display: block; width: 2.25rem; height: 3px; background: var(--accent);}
.x1-business-case .bc-m-h {font: 400 clamp(1.625rem, 1.3rem + 1vw, 2.125rem)/1.15 var(--serif); color: var(--ink); letter-spacing: -.015em; text-wrap: balance; max-width: 20ch;}
.x1-business-case .bc-m p {max-width: var(--measure); text-wrap: pretty;}

/* pull line over the photograph */
.x1-business-case .bc-aha {margin: 0;}
.x1-business-case .bc-aha .bleed {object-position: 50% 55%;}
.x1-business-case .bc-aha .quote-big {color: #fff; border-left-color: #F4C77A; max-width: 22ch;}
.x1-business-case .bc-aha + .sec {border-top: 0;}

/* evidence + the report card */
.x1-business-case .bc-top {align-items: start;}
.x1-business-case .bc-block p {max-width: var(--measure); text-wrap: pretty;}
.x1-business-case .bc-block + .bc-block {margin-top: var(--stack-l); padding-top: var(--stack-l); border-top: 1px solid var(--rule);}
.x1-business-case .bc-card {margin: 0; background: var(--surface); border-radius: 12px;
  box-shadow: 0 0 0 1px rgba(0,0,0,.06), 0 18px 48px -12px rgba(20,20,20,.18);
  padding: clamp(1.25rem, .75rem + 1.6vw, 2.25rem); display: grid; gap: clamp(1.25rem, 1rem + 1vw, 2rem);}
.x1-business-case .bc-card-t {font: 400 clamp(1.5rem, 1.25rem + .8vw, 1.875rem)/1.15 var(--serif); color: var(--ink); padding-bottom: 1rem; border-bottom: 1px solid var(--ink);}
.x1-business-case .bc-card-k {display: flex; align-items: center; gap: .55rem; font: 600 var(--fs-eyebrow)/1.4 var(--sans); letter-spacing: var(--track-eyebrow); text-transform: uppercase; color: var(--accent); margin-bottom: .35rem;}
.x1-business-case .bc-dot {width: 9px; height: 9px; border-radius: 50%; flex: none;}
.x1-business-case .bc-dot-m {background: var(--accent);}
.x1-business-case .bc-dot-a {background: transparent; box-shadow: inset 0 0 0 1.5px var(--muted);}
.x1-business-case .bc-card-assume {padding: 1rem 1.1rem 1.1rem; border-radius: 10px; background: var(--tint); border: 1px dashed rgba(0,0,0,.22);}
.x1-business-case .bc-card-assume .bc-card-k {color: var(--muted);}
.x1-business-case .bc-rows {margin: 0; display: grid;}
.x1-business-case .bc-rows > div {display: grid; grid-template-columns: minmax(0, 1fr) minmax(3rem, 7rem); gap: 1rem; align-items: end; padding-block: .8rem; border-top: 1px solid var(--rule);}
.x1-business-case .bc-card-assume .bc-rows > div {border-top-color: rgba(0,0,0,.12);}
.x1-business-case .bc-rows dt {font-size: .9375rem; line-height: 1.35; color: var(--ink);}
.x1-business-case .bc-rows dd {margin: 0 0 .35rem; height: 1px; background: repeating-linear-gradient(90deg, rgba(0,0,0,.28) 0 4px, transparent 4px 8px);}
.x1-business-case .bc-limits {display: flex; flex-wrap: wrap; gap: .45rem; padding-top: 1.1rem; border-top: 1px solid var(--ink);}
.x1-business-case .bc-limits li {font: 500 .8125rem/1.2 var(--sans); color: var(--text); padding: .4rem .7rem; border-radius: 999px; background: var(--tint);}
@media (min-width: 961px){
.x1-business-case .bc-sticky {position: sticky; top: 104px;}
}

/* questions: one centred column */
.x1-business-case .bc-faq > :first-child, .x1-business-case .bc-faq > :last-child {grid-column: 3 / span 8;}
.x1-business-case .bc-faq .eyebrow {margin-bottom: var(--stack-s);}

.x1-business-case .close {border-top: 0;}

@media (max-width: 960px){
.x1-business-case .bc-two > :first-child, .x1-business-case .bc-two > :last-child,
.x1-business-case .bc-faq > :first-child, .x1-business-case .bc-faq > :last-child {grid-column: 1 / -1;}
}
@media (max-width: 720px){
.x1-business-case .bc-measures {grid-template-columns: minmax(0, 1fr);}
}
@media (max-width: 600px){
.x1-business-case .bc-rows > div {grid-template-columns: minmax(0, 1fr) 2.5rem;}
}
