:root {
  --ink: #f6f7f3;
  --ink2: #e7eef0;
  --panel: #ffffff;
  --cyan: #274153;
  --amber: #e47a3f;
  --text: #243746;
  --muted: #5e707b;
  --line: rgba(39, 65, 83, .16);
  --paper: #f6f7f3;
  --papertext: #243746;
}

body { background: #f6f7f3; color: #243746; }
.wrap { width: min(var(--max), calc(100% - 48px)); }

.hero {
  min-height: 690px;
  background:
    linear-gradient(90deg, rgba(120, 168, 184, .13) 1px, transparent 1px),
    linear-gradient(rgba(120, 168, 184, .13) 1px, transparent 1px),
    #f6f7f3;
  background-size: 42px 42px;
  border-bottom: 0;
}
.hero:before {
  background: linear-gradient(90deg, #f6f7f3 0%, rgba(246,247,243,.96) 58%, rgba(246,247,243,.55) 100%);
}
.hero:after {
  content: '';
  position: absolute;
  top: 78px;
  right: 0;
  width: 31%;
  height: calc(100% - 78px);
  background: #dce8eb;
  border-left: 8px solid #78a8b8;
}
.nav { height: 82px; }
.brand { color: #274153; }
.mark {
  border-color: #274153;
  border-top-color: #e47a3f;
  color: #274153;
  background: #fff;
}
.navlinks a { color: #425866; }
.button {
  border-color: #d56831;
  background: #e47a3f;
  color: #fff;
  border-radius: 5px;
  box-shadow: 0 3px 0 #b9582a;
}
.button:hover { box-shadow: 0 5px 0 #b9582a; }
.button.ghost {
  background: #fff;
  color: #274153;
  border-color: #a9bbc2;
  box-shadow: none;
}
.hero-copy { max-width: 790px; padding: 92px 0 96px; }
.eyebrow { color: #315b70; }
.eyebrow:before { background: #e47a3f; }
h1 { color: #243746; font-size: clamp(46px, 6.5vw, 78px); }
.accent { color: #315f76; text-decoration: underline; text-decoration-color: #e47a3f; text-decoration-thickness: .11em; text-underline-offset: .12em; }
.lede { color: #536773; }
.micro { color: #667a84; }
.signal-row {
  background: #274153;
  border: 0;
  backdrop-filter: none;
}
.signal { color: #dce6ea; border-color: rgba(255,255,255,.18); }
.signal strong { color: #fff; }
.light { background: #f3a174; box-shadow: none; }

section { padding: 102px 0; }
.paper { background: #f6f7f3; }
.kicker { color: #315f76; }
.section-head p { color: #5e707b; }
.problem {
  background: #fff;
  border: 1px solid #d5dfe1;
  border-top: 5px solid #78a8b8;
  border-radius: 4px;
  box-shadow: 0 10px 30px rgba(39,65,83,.06);
}
.problem .num { color: #b9582a; }
.problem p { color: #60717b; }

.engine { background: #e7eef0; color: #243746; }
.engine .section-head p,
.engine .step p { color: #586b76 !important; }
.engine-flow { background: #cbd8dc; border-color: #cbd8dc; border-radius: 5px; }
.step { background: #f9faf7; }
.step span { border-color: #78a8b8; color: #274153; background: #dce8eb; }

.workflow { background: #fff; color: #243746; }
.workflow .section-head p,
.workflow .workcard p { color: #5e707b !important; }
.workcard {
  border-color: #d5dfe1;
  border-radius: 5px;
  background: #f6f7f3;
}
.icon { background: #dce8eb; color: #274153; border-radius: 4px; }
.workcard small { color: #b9582a; }

.offer { background: #eef2ed; }
.offerbox { border-color: #cfdbdd; border-radius: 5px; box-shadow: 0 16px 44px rgba(39,65,83,.08); }
.offer-copy > p { color: #5b6d77; }
.check:before { color: #c56434; }
.offer-side { background: #31566b; }
.offer-side li { color: #e0e9ec; }
.offer-side li:before { border-color: #f3a174; color: #fff; }

.faq { background: #fff; }
summary:after { color: #c56434; }
details p { color: #5c6e78; }

.cta { background: #274153; }
.cta h2 { color: #fff; }
.cta p { color: #d8e3e7; }
.cta .eyebrow { color: #b9d2da; }
.form { border-radius: 5px; box-shadow: 0 18px 50px rgba(20,36,46,.2); }
.form input, .form textarea { background: #fbfcfa; border-color: #bdcbd0; }

.footer { background: #eef2ed; color: #60727c; border-color: #cfdbdd; }

@media (max-width: 850px) {
  .hero:after { width: 18%; opacity: .45; }
  .hero-copy { padding: 74px 0 88px; }
}
@media (max-width: 560px) {
  .wrap { width: min(100% - 28px, var(--max)); }
  .hero { min-height: 710px; }
  .hero:after { display: none; }
  .hero:before { background: rgba(246,247,243,.9); }
  h1 { font-size: 42px; }
}