/* General Engine v3 — work into value. Editorial, not theatrical. */
:root { --maxw: 1440px; }
.eyebrow::before { width: 5px; height: 5px; }
.underline-accent { background-size: 100% .045em; }
.btn--solid:hover { background: var(--ink-2); border-color: var(--ink-2); color: var(--paper); }
.on-night .btn--solid:hover { background: var(--paper-2); border-color: var(--paper-2); color: var(--ink); }
.hero--value { padding: 60px 0 24px; overflow: clip; }
.hero--value .hero__intro { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(0,1fr); gap: 48px; align-items: end; }
.hero--value .eyebrow { margin-bottom: 30px; }
.hero--value .display { font-size: clamp(62px,6.6vw,100px); font-stretch: 110%; line-height: .97; text-wrap: initial; }
.hero--value .hero__copy { margin: 0 0 4px; max-width: 460px; }
.hero--value .hero__copy .lede { font-size: 18px; }
.hero--value .actions { gap: 14px 26px; margin-top: 26px; }
.work-composition { margin: 52px auto 0; max-width: 1640px; padding: 0 var(--pad); }
.work-composition__top { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding-bottom: 18px; border-bottom: 1px solid var(--rule-strong); }
.work-composition__top .mono { font-size: 11px; color: var(--muted); }
.work-composition__top .mono strong { color: var(--ink); font-weight: 500; }
.work-composition__body { display: grid; grid-template-columns: minmax(0,1fr) 260px; gap: 38px; align-items: center; }
.work-field { position: relative; min-width: 0; }
.work-field svg { width: 100%; height: auto; aspect-ratio: 1000 / 320; overflow: visible; }
.work-field .construction { fill: none; stroke: var(--rule); stroke-width: 1; }
.work-field .lanes { fill: none; stroke: var(--rule-strong); stroke-width: 1; }
.work-field .core { fill: var(--paper); stroke: var(--ink); stroke-width: 1.3; }
.work-field .core-back { fill: var(--paper-2); stroke: var(--rule-strong); stroke-width: 1; }
.work-field .glyph { fill: var(--paper); stroke: var(--muted); stroke-width: 1; }
.work-field .glyph-line { fill: none; stroke: var(--muted); stroke-width: 1; }
.work-field .signal { stroke: var(--accent); fill: none; stroke-width: 2; }
.work-field .work-unit { transform-box: fill-box; transform-origin: center; }
.work-ledger { margin: 0; padding: 12px 0; }
.work-ledger > div { position: relative; padding: 12px 0 12px 20px; border-bottom: 1px solid var(--rule); }
.work-ledger > div::before { content: ''; position: absolute; left: 0; top: 21px; width: 5px; height: 5px; background: var(--rule-strong); }
.work-ledger > div[data-active]::before { background: var(--accent); }
.work-ledger dt { font-size: 22px; font-weight: 560; letter-spacing: -.025em; line-height: 1.1; }
.work-ledger dd { margin: 5px 0 0; color: var(--muted); font-size: 14px; line-height: 1.4; }
.work-composition__caption { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 8px; color: var(--muted); font-size: 11px; }
.work-composition__caption > span { max-width: 65ch; }
.work-composition .signature__toggle { flex: none; position: static; font-size: 11px; }
.hero--value .hero__datum { position: static; margin-top: 28px; padding-top: 16px; border-top: 1px solid var(--rule); font-size: 11px; }
.stack { padding: 22px 0; }
.stack__label { max-width: 260px; font-size: 11px; line-height: 1.5; }

/* Inspect the work: one selector, five honest artifacts. All open without JS. */
.engagement { padding: 88px 0; scroll-margin-top: 68px; }
.engagement__intro { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); gap: 22px 100px; align-items: end; }
.engagement__intro .eyebrow { grid-column: 1 / -1; }
.engagement__intro .lede { font-size: 18px; max-width: 46ch; }
.engagement__workspace { margin-top: 44px; }
.engagement__tabs { display: none; }
.engagement-ready .engagement__workspace { display: grid; grid-template-columns: minmax(240px,.42fr) minmax(0,1fr); gap: 54px; align-items: start; }
.engagement-ready .engagement__tabs { display: flex; flex-direction: column; }
.stage-tab { min-height: 76px; display: flex; align-items: center; text-align: left; gap: 18px; padding: 16px 0; border: 0; border-top: 1px solid var(--night-divider); background: transparent; color: var(--night-muted); font: 500 20px/1.2 var(--font); cursor: pointer; }
.stage-tab:last-child { border-bottom: 1px solid var(--night-divider); }
.stage-tab .mono { font-size: 11px; }
.stage-tab > span:last-child { margin-left: auto; opacity: 0; font-size: 20px; }
.stage-tab:hover { color: var(--paper); }
.stage-tab[aria-selected='true'] { color: var(--paper); }
.stage-tab[aria-selected='true'] .mono { color: var(--accent); }
.stage-tab[aria-selected='true'] > span:last-child { opacity: 1; }
.stage-panel { margin-bottom: 48px; }
.stage-panel[hidden] { display: none; }
.engagement-ready .stage-panel { margin: 0; min-height: 555px; }
.stage-panel__intro { margin-bottom: 24px; }
.stage-panel__intro .mono { color: var(--night-muted); margin-bottom: 10px; font-size: 11px; }
.stage-panel__intro h3 { font-size: 32px; font-weight: 550; letter-spacing: -.035em; line-height: 1.1; }
.stage-panel__intro p:last-child { margin-top: 12px; color: var(--night-copy); font-size: 16px; max-width: 66ch; }
.artifact { background: var(--paper); color: var(--ink); padding: 26px 30px; border: 1px solid var(--rule-strong); }
.artifact__head { display: flex; justify-content: space-between; gap: 20px; align-items: start; padding-bottom: 16px; border-bottom: 1px solid var(--ink); }
.artifact__head h4 { font-size: 20px; font-weight: 600; line-height: 1.2; letter-spacing: -.025em; }
.artifact__head .mono { font-size: 11px; color: var(--muted); }
.artifact dl { margin: 4px 0 0; }
.artifact__row { display: grid; grid-template-columns: 140px minmax(0,1fr); gap: 22px; padding: 11px 0; border-bottom: 1px solid var(--rule); }
.artifact dt { font: 11px/1.5 var(--mono); text-transform: uppercase; color: var(--muted); letter-spacing: .035em; }
.artifact dd { margin: 0; font-size: 14px; line-height: 1.45; }
.artifact__foot { font-size: 12px; color: var(--muted); margin-top: 16px; }
.artifact table { width: 100%; border-collapse: collapse; font-size: 14px; margin-top: 8px; }
.artifact th, .artifact td { text-align: left; border-bottom: 1px solid var(--rule); padding: 10px 12px 10px 0; vertical-align: top; font-weight: 400; }
.artifact thead th { font: 11px/1.4 var(--mono); color: var(--muted); text-transform: uppercase; }
.artifact tbody th { font-weight: 550; width: 32%; }
.artifact__route { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin: 22px 0; list-style: none; }
.artifact__route li { border-top: 1px solid var(--rule-strong); padding-top: 12px; font-size: 15px; }
.artifact__route .mono { display: block; margin-bottom: 6px; color: var(--muted); font-size: 11px; }
.artifact__route li:last-child { border-color: var(--accent-ink); }
.engagement__foot { margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--night-divider); display: flex; justify-content: space-between; gap: 24px; color: var(--night-muted); font-size: 13px; }
.engagement__foot .link-arrow { color: var(--paper); flex: none; align-self: start; font-size: 14px; }

/* A reason to choose us, not a second telling of the process. */
.judgment { padding: 72px 0; }
.judgment__layout { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); gap: 100px; }
.judgment__intro { display: grid; align-content: start; gap: 24px; }
.judgment__points { margin: 0; }
.judgment__points > div { border-top: 1px solid var(--night-divider); padding: 22px 0; }
.judgment__points > div:last-child { padding-bottom: 0; }
.judgment__points dt { font-size: 25px; letter-spacing: -.025em; font-weight: 550; line-height: 1.1; }
.judgment__points dd { margin: 12px 0 0; font-size: 16px; color: var(--night-copy); }
.principles strong em { color: var(--paper); }
.principles strong { font-size: clamp(30px,3.6vw,50px); }
.cell { position: relative; }
.cell.lit, .cell.lit:not([data-o='1']) { background: var(--night-3); border-color: var(--diagram-review-rule); }
.cell.lit::after { content: ''; position: absolute; width: 5px; height: 5px; background: var(--accent); right: 7px; bottom: 7px; }
.cell.lit[data-o='1'] { background: var(--accent); border-color: var(--accent); }
.cell.lit[data-o='1']::after { background: var(--night); }
.pf-col, .pf-row { font-size: 11px; letter-spacing: 0; }
.pf-row { font-family: var(--font); white-space: nowrap; }
.form__status[data-state='ready'] { border-color: var(--ink); }
.contact-email { border-top: 1px solid var(--rule-strong); padding-top: 22px; }
.contact-email .mono { color: var(--muted); font-size: 11px; margin-bottom: 10px; }
.contact-email__row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.contact-email__row a { font-size: 20px; letter-spacing: -.02em; border-bottom: 1px solid var(--rule-strong); overflow-wrap: anywhere; }
.copy-email { display: none; border: 1px solid var(--rule-strong); background: transparent; color: var(--ink); font: 11px/1 var(--mono); text-transform: uppercase; min-height: 44px; padding: 0 14px; cursor: pointer; }
.js .copy-email { display: inline-flex; align-items: center; }
.copy-email:hover { border-color: var(--ink); }
.contact-email__status { font-size: 13px; color: var(--muted); min-height: 20px; margin-top: 8px; }
.form__notice { margin: 0; }
.form__foot .btn { margin-left: auto; }
.form__note { line-height: 1.5; }
.practice-datum { line-height: 1.6; }
.termsheet dt, .steps--sequence .step__n, .steps--sequence .step__out, .footer__base { font-size: 11px; }

@media (min-width:1800px) {
  :root { --maxw: 1520px; }
  .hero--value { padding-top: 76px; }
  .hero--value .display { font-size: 112px; }
  .work-composition { margin-top: 62px; }
}
@media (max-width:1100px) {
  .hero--value .hero__intro { grid-template-columns: 1fr; gap: 32px; }
  .hero--value .display { font-size: clamp(64px,8.3vw,92px); }
  .hero--value .hero__copy { display: grid; grid-template-columns: 1.1fr 1fr; gap: 34px; max-width: none; align-items: center; }
  .hero--value .actions { margin: 0; align-content: start; }
  .work-composition__body { grid-template-columns: minmax(0,1fr) 205px; gap: 20px; }
  .engagement__intro, .judgment__layout { gap: 22px 48px; }
  .engagement-ready .engagement__workspace { grid-template-columns: 220px minmax(0,1fr); gap: 30px; }
  .stage-tab { font-size: 18px; gap: 12px; }
  .artifact { padding: 22px; }
  .artifact__row { grid-template-columns: 105px minmax(0,1fr); gap: 16px; }
  .choices { grid-template-columns: 1fr; }
  .choice span { min-height: 64px; }
  .data-hero__layout { grid-template-columns: 1fr; }
  .termsheet { max-width: 720px; }
}
@media (max-width:800px) {
  .hero--value { padding: 36px 0 22px; }
  .hero--value .hero__intro { gap: 26px; }
  .hero--value .eyebrow { font-size: 12px; margin-bottom: 24px; max-width: 34ch; }
  .hero--value .display { font-size: clamp(44px,8.6vw,66px); font-stretch: 104%; }
  .hero--value .hero__copy { display: block; max-width: 580px; }
  .hero--value .hero__copy .lede { font-size: 17px; }
  .hero--value .actions { margin-top: 24px; }
  .work-composition { margin-top: 32px; }
  .work-composition__top { align-items: start; gap: 16px; }
  .work-composition__top .mono { font-size: 12px; }
  .work-composition__top > span:last-child { display: none; }
  .work-composition__body { grid-template-columns: 1fr; gap: 0; }
  .work-field { margin: 16px 0 0; }
  .work-field svg { aspect-ratio: 1000 / 390; }
  .work-ledger { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; padding-top: 0; }
  .work-ledger > div { padding: 14px 0 14px 14px; }
  .work-ledger > div::before { top: 21px; }
  .work-ledger dt { font-size: 23px; }
  .work-ledger dd { font-size: 13px; }
  .work-composition__caption { font-size: 12px; margin-top: 16px; gap: 16px; }
  .work-composition__caption > span { max-width: 34ch; }
  .work-composition .signature__toggle { font-size: 12px; }
  .hero--value .hero__datum { font-size: 12px; margin-top: 24px; }
  .hero__datum span:last-child { display: none; }
  .stack__label { font-size: 12px; max-width: none; }
  .engagement { padding: 52px 0; }
  .engagement__intro { grid-template-columns: 1fr; gap: 20px; }
  .engagement__intro .lede { font-size: 17px; }
  .engagement__workspace { margin-top: 30px; }
  .engagement-ready .engagement__workspace { grid-template-columns: 1fr; gap: 28px; }
  .engagement-ready .engagement__tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
  .stage-tab { min-height: 64px; font-size: 16px; gap: 10px; }
  .stage-tab .mono { font-size: 12px; }
  .stage-tab:last-child { grid-column: 1 / -1; }
  .stage-tab:nth-child(3), .stage-tab:nth-child(4) { border-bottom: 1px solid var(--night-divider); }
  .stage-tab:nth-child(5) { border-top: 0; }
  .stage-tab > span:last-child { font-size: 16px; }
  .engagement-ready .stage-panel { min-height: 0; }
  .stage-panel__intro .mono { font-size: 12px; }
  .stage-panel__intro h3 { font-size: 30px; }
  .artifact { padding: 22px 20px; }
  .artifact__head { flex-wrap: wrap; gap: 10px; }
  .artifact__head .mono { font-size: 12px; }
  .artifact dt, .artifact thead th { font-size: 12px; }
  .artifact__row { grid-template-columns: 1fr; gap: 5px; padding: 12px 0; }
  .artifact dd { font-size: 14px; }
  .artifact__route { grid-template-columns: 1fr 1fr; gap: 20px; }
  .artifact__route .mono { font-size: 12px; }
  .artifact table { font-size: 13px; }
  .artifact th, .artifact td { padding-right: 8px; }
  .engagement__foot { flex-direction: column; gap: 18px; }
  .judgment { padding: 52px 0; }
  .judgment__layout { grid-template-columns: 1fr; gap: 32px; }
  .judgment__points dt { font-size: 25px; }
  .mono, .eyebrow, .practice > .mono, .portfolio figcaption, .practice-datum,
  .steps--sequence .step__n, .steps--sequence .step__out, .termsheet dt, .termsheet__foot,
  .footer__base, .versus dt span, .versus dd span, .usecases thead th, .field label,
  .choice input:checked + span::after, .contact-email .mono, .copy-email { font-size: 12px; }
  .pf-col, .pf-row { font-size: 12px; line-height: 1.3; }
  .portfolio { padding: 22px 14px; }
  .portfolio__grid { grid-template-columns: 58px repeat(4,minmax(0,1fr)); gap: 5px; }
  .contact-email__row a { font-size: 19px; }
  .contact { grid-template-columns: 1fr; }
  .contact__intro { position: static; }
  .form__foot .btn { width: 100%; }
  .choice span { flex-direction: row; }
}
@media (max-width:400px) {
  .hero--value .display { font-size: 44px; }
  .hero--value .actions { flex-direction: column; align-items: stretch; }
  .hero--value .hero__secondary { align-self: start; }
  .work-ledger { gap: 0 14px; }
  .stage-tab { font-size: 15px; gap: 8px; }
  .engagement__tabs { column-gap: 14px !important; }
  .artifact { padding: 20px 16px; }
  .portfolio__grid { grid-template-columns: 52px repeat(4,minmax(0,1fr)); }
}
@media (prefers-reduced-motion:reduce) {
  .work-composition .signature__toggle, .motion-ready .work-composition .signature__toggle { display: none; }
}
