:root { --lp-ink:#381340; --lp-tint:#f3edf5; }
.lp-page .case-eyebrow,.lp-page .case-meta,.lp-page .results,.lp-page .role-list li,.lp-page .credits p { color:var(--lp-ink); }
.lp-page .role-list li,.lp-page .credits p span { background:var(--lp-tint); }
.lp-page .case-section--tint { background:var(--lp-tint); }
.lp-page blockquote { margin:10px 0 0; padding:0; color:var(--lp-ink); font-size:18px; font-weight:300; line-height:1.8; }
.lp-opportunity { margin-top:0; }
.lp-solution > .case-container,.lp-prototypes > .case-container { display:grid; gap:42px; }
.lp-solution__header { display:grid; gap:30px; }
.lp-solution__header h1 { max-width:1100px; }
.lp-feature,.lp-prototype { display:grid; gap:30px; align-items:center; }
.lp-feature h2,.lp-prototype h2,.lp-system h2 { margin-bottom:10px; }
.lp-feature > img,.lp-prototype > img,.lp-inline { width:100%; }
.lp-feature ul { margin:8px 0 12px; padding-left:18px; }
.lp-decisions { background:var(--lp-ink); }
.lp-decisions .decision-grid li { color:var(--lp-ink); background:var(--lp-tint); }
.lp-system > .case-container { display:grid; gap:42px; }
.lp-system__copy { max-width:700px; }
.lp-ui-grid { display:grid; gap:18px; }
.lp-ui-grid img { width:100%; }
.lp-inline { margin-top:30px; }

@media (min-width:768px) {
  .lp-page blockquote { margin-top:20px; font-size:20px; }
  .lp-solution > .case-container,.lp-prototypes > .case-container { gap:48px; }
  .lp-solution__header { gap:48px; }
  .lp-feature,.lp-prototype { grid-template-columns:1fr 1fr; gap:100px; min-height:424px; }
  .lp-feature > img { width:550px; max-width:100%; justify-self:center; }
  .lp-feature--reverse > img { grid-column:1; grid-row:1; }
  .lp-feature--reverse > div { grid-column:2; grid-row:1; }
  .lp-system > .case-container { gap:100px; }
  .lp-system__copy { margin-inline:auto; }
  .lp-ui-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px; }
  .lp-prototype > img { width:552px; max-width:100%; justify-self:center; }
  .lp-prototype--reverse > div { grid-column:1; grid-row:1; }
  .lp-prototype--reverse > img { grid-column:2; grid-row:1; }
}