/* Infrastructure: field guide with a panoramic Hero, chapters and a survey story. */
.chutuoc-service-design--infrastructure .chutuoc-service-design__hero--field-guide {
  display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: stretch;
  padding-block: 2rem; gap: 0;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__intro--field-guide {
  padding: clamp(1.5rem, 4vw, 3rem); background: #f5f1eb; border-radius: 1rem 0 0 1rem;
  display: flex; flex-direction: column; justify-content: center;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__intro--field-guide .chutuoc-service-design__wrap { width: 100%; max-width: none; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__intro--field-guide h1 { max-width: 16ch; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__image--panorama { margin: 0; min-width: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__image--panorama img {
  width: 100%; height: 100%; min-height: 0; object-fit: cover; border-radius: 0 1rem 1rem 0;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__image--panorama figcaption { padding: .75rem 1rem; background: #f5f1eb; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__problems--field-notes .chutuoc-service-design__items {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__problems--field-notes li { border-left: 3px solid #fb6e2e; padding-left: 1.25rem; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__catalog-grid { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr); gap: 3rem; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__catalog-grid .chutuoc-service-design__wrap,
.chutuoc-service-design--infrastructure .chutuoc-service-design__survey .chutuoc-service-design__wrap { width: 100%; max-width: none; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__offerings--checklist .chutuoc-service-design__offering-clusters {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__offerings--checklist .chutuoc-service-design__offering-cluster {
  position: relative; padding: 0 0 1.5rem 4rem; border-bottom: 1px solid #e6e0d8;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__offerings--checklist .chutuoc-service-design__offering-cluster > h3 > .chutuoc-service-design__cluster-index {
  position: absolute; inset: 0 auto auto 0;
  width: 2.75rem; height: 2.75rem; border-radius: 50%; display: grid; place-items: center;
  border: 1px solid #f4c3ab; background: #fff4ed; color: #a93908; font-weight: 700;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__offering-cluster > h3 { margin-top: 0; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__offering-cluster ul { list-style: none; padding: 0; margin: 0; grid-template-columns: minmax(0, 1fr); }
.chutuoc-service-design--infrastructure .chutuoc-service-design__offering { padding: .8rem 0 .8rem 1.5rem; position: relative; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__offering::before { content: "✓"; position: absolute; left: 0; color: #a93908; font-weight: 700; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__offering-label { font-weight: 600; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__offering p { margin-block: .5rem 0; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__technologies--field-note .chutuoc-service-design__wrap {
  padding: 1.5rem; background: #f5f1eb; border-radius: .5rem; border-top: 3px solid #fb6e2e;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__survey { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3rem; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__process--vertical .chutuoc-service-design__items { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__process--vertical li { position: relative; padding-left: 4rem; padding-bottom: 1.5rem; border-bottom: 1px solid #e6e0d8; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__process--vertical .chutuoc-service-design__index { position: absolute; left: 0; top: 0; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__survey-image { padding-block: clamp(3rem, 7vw, 6rem); align-self: start; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__image--survey { margin: 0; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__image--survey img { display: block; width: 100%; aspect-ratio: .8; object-fit: cover; border-radius: .75rem; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__benefits--handoff .chutuoc-service-design__items {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1.5rem; padding: 2rem;
  background: #f5f1eb; border-radius: .75rem;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__benefits--handoff li { border-top: 2px solid #fb6e2e; padding-top: 1.25rem; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__pricing--survey-sheet .container {
  padding: 2rem; border-radius: .5rem; background: #f5f1eb; border: 1px solid #e6e0d8;
  display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: start; gap: 1.5rem;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__pricing--survey-sheet .chutuoc-service-page__grid { grid-column: 1 / -1; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__pricing--survey-sheet .chutuoc-btn { justify-self: start; }
.chutuoc-service-design--infrastructure .chutuoc-service-design__quote--field-sheet .chutuoc-service-page__quote-grid {
  display: grid; grid-template-columns: minmax(0, 1fr); max-width: 64rem;
  background: #f5f1eb; padding: clamp(1.25rem, 4vw, 3rem); border-radius: .75rem;
}
.chutuoc-service-design--infrastructure .chutuoc-service-design__quote--field-sheet .chutuoc-service-page__quote-intro { max-width: 48rem; }
@media (max-width: 1199px) {
  .chutuoc-service-design--infrastructure .chutuoc-service-design__benefits--handoff .chutuoc-service-design__items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
  .chutuoc-service-design--infrastructure .chutuoc-service-design__hero--field-guide,
  .chutuoc-service-design--infrastructure .chutuoc-service-design__catalog-grid,
  .chutuoc-service-design--infrastructure .chutuoc-service-design__survey { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .chutuoc-service-design--infrastructure .chutuoc-service-design__intro--field-guide { border-radius: 1rem 1rem 0 0; }
  .chutuoc-service-design--infrastructure .chutuoc-service-design__intro--field-guide h1 { max-width: 22ch; }
  .chutuoc-service-design--infrastructure .chutuoc-service-design__image--panorama img { height: auto; aspect-ratio: 1.33; border-radius: 0 0 1rem 1rem; }
  .chutuoc-service-design--infrastructure .chutuoc-service-design__survey-image { padding-block: 0 2rem; }
  .chutuoc-service-design--infrastructure .chutuoc-service-design__image--survey img { aspect-ratio: 1.6; }
}
@media (max-width: 767px) {
  .chutuoc-service-design--infrastructure .chutuoc-service-design__problems--field-notes .chutuoc-service-design__items,
  .chutuoc-service-design--infrastructure .chutuoc-service-design__benefits--handoff .chutuoc-service-design__items,
  .chutuoc-service-design--infrastructure .chutuoc-service-design__pricing--survey-sheet .container { grid-template-columns: minmax(0, 1fr); }
  .chutuoc-service-design--infrastructure .chutuoc-service-design__offerings--checklist .chutuoc-service-design__offering-cluster { padding-left: 3.5rem; }
  .chutuoc-service-design--infrastructure .chutuoc-service-design__benefits--handoff .chutuoc-service-design__items,
  .chutuoc-service-design--infrastructure .chutuoc-service-design__pricing--survey-sheet .container { padding: 1.25rem; }
}