/* App Concept Blueprint clarity treatment, v191. */
.app-blueprint-price-card {
  border-top: 3px solid #158f91 !important;
}

.app-blueprint-price-card > p b {
  color: #172431 !important;
  -webkit-text-fill-color: #172431 !important;
}

html[data-theme] body.app-service-page .app-blueprint-breakdown,
body.app-service-page .app-blueprint-breakdown {
  position: relative;
  isolation: isolate;
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  padding: clamp(1.4rem, 3vw, 2.2rem);
  overflow: hidden;
  border: 1px solid rgba(19, 63, 73, .24);
  border-radius: 6px;
  background:
    linear-gradient(90deg, #158f91 0 18%, #d9a83f 18% 28%, transparent 28%) top left / 100% 4px no-repeat,
    linear-gradient(145deg, #fffdf8 0%, #f4f8f7 62%, #f4eff9 100%) !important;
  box-shadow: 0 22px 44px rgba(7, 20, 31, .16), inset 0 1px rgba(255, 255, 255, .9) !important;
  color: #172431 !important;
  -webkit-text-fill-color: #172431 !important;
}

html[data-theme] body.app-service-page .app-blueprint-heading,
body.app-service-page .app-blueprint-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(16rem, .8fr);
  column-gap: clamp(1.5rem, 4vw, 4rem);
  align-items: end;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid rgba(23, 36, 49, .16);
}

html[data-theme] body.app-service-page .app-blueprint-heading .eyebrow,
body.app-service-page .app-blueprint-heading .eyebrow {
  grid-column: 1 / -1;
  margin-bottom: .45rem;
  color: #0b6c70 !important;
  -webkit-text-fill-color: #0b6c70 !important;
}

html[data-theme] body.app-service-page .app-blueprint-heading h3,
body.app-service-page .app-blueprint-heading h3 {
  max-width: 19ch;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  line-height: 1.08;
  color: #172431 !important;
  -webkit-text-fill-color: #172431 !important;
  text-shadow: none !important;
}

html[data-theme] body.app-service-page .app-blueprint-heading > p:last-child,
body.app-service-page .app-blueprint-heading > p:last-child {
  margin: 0;
  color: #4a5964 !important;
  -webkit-text-fill-color: #4a5964 !important;
}

.app-blueprint-deliverables {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  padding: 1.35rem 0;
}

html[data-theme] body.app-service-page .app-blueprint-deliverables article,
body.app-service-page .app-blueprint-deliverables article {
  min-width: 0;
  padding: .25rem .85rem .2rem 1rem;
  border-left: 3px solid #158f91;
  background: transparent !important;
  box-shadow: none !important;
  color: #172431 !important;
  -webkit-text-fill-color: #172431 !important;
}

html[data-theme] body.app-service-page .app-blueprint-deliverables span,
body.app-service-page .app-blueprint-deliverables span {
  display: block;
  margin-bottom: .45rem;
  color: #8a5e05 !important;
  -webkit-text-fill-color: #8a5e05 !important;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
}

html[data-theme] body.app-service-page .app-blueprint-deliverables h4,
body.app-service-page .app-blueprint-deliverables h4 {
  margin: 0 0 .35rem;
  color: #172431 !important;
  -webkit-text-fill-color: #172431 !important;
  font-size: 1rem;
  line-height: 1.22;
}

html[data-theme] body.app-service-page .app-blueprint-deliverables p,
body.app-service-page .app-blueprint-deliverables p {
  margin: 0;
  color: #4a5964 !important;
  -webkit-text-fill-color: #4a5964 !important;
  font-size: .9rem;
  line-height: 1.55;
}

html[data-theme] body.app-service-page .app-blueprint-boundary,
body.app-service-page .app-blueprint-boundary {
  margin: 0;
  padding: .9rem 1rem;
  border-left: 4px solid #d9a83f;
  border-radius: 3px;
  background: #142631 !important;
  color: #f8f4ea !important;
  -webkit-text-fill-color: #f8f4ea !important;
  line-height: 1.55;
}

html[data-theme] body.app-service-page .app-blueprint-boundary strong,
body.app-service-page .app-blueprint-boundary strong {
  color: #f7d77b !important;
  -webkit-text-fill-color: #f7d77b !important;
}

html[data-theme] body .service-menu-card#app li small,
body .service-menu-card#app li small {
  display: block;
  margin-top: .35rem;
  color: #4f405f !important;
  -webkit-text-fill-color: #4f405f !important;
  font-size: .82rem;
  font-weight: 600;
  line-height: 1.48;
}

@media (max-width: 900px) {
  .app-blueprint-deliverables {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  html[data-theme] body.app-service-page .app-blueprint-heading,
  body.app-service-page .app-blueprint-heading,
  .app-blueprint-deliverables {
    grid-template-columns: 1fr;
  }

  html[data-theme] body.app-service-page .app-blueprint-heading,
  body.app-service-page .app-blueprint-heading {
    row-gap: .65rem;
  }

  html[data-theme] body.app-service-page .app-blueprint-breakdown,
  body.app-service-page .app-blueprint-breakdown {
    padding: 1.25rem 1rem;
  }
}
