/* Shared service presentation foundation. Every rule stays inside the five layouts. */
.chutuoc-service-design {
  --chutuoc-service-ink: #23272c;
  --chutuoc-service-muted: #62676d;
  --chutuoc-service-line: #dddcd7;
  --chutuoc-service-paper: #f5f2ec;
  color: var(--chutuoc-service-ink);
  background: #fff;
  overflow-wrap: anywhere;
}
.chutuoc-service-design *, .chutuoc-service-design *::before, .chutuoc-service-design *::after { box-sizing: border-box; }
.chutuoc-service-design__wrap { width: min(1120px, calc(100% - 48px)); margin-inline: auto; }
.chutuoc-service-design__section { padding-block: clamp(44px, 6vw, 88px); }
.chutuoc-service-design__heading { margin-bottom: 32px; }
.chutuoc-service-design h1, .chutuoc-service-design h2, .chutuoc-service-design h3 { color: inherit; text-wrap: balance; }
.chutuoc-service-design h1 { max-width: 22ch; margin: 0 0 24px; font-size: clamp(2rem, 4.3vw, 3rem); line-height: 1.12; letter-spacing: -.035em; }
.chutuoc-service-design h2 { margin: 0; font-size: clamp(1.65rem, 2.7vw, 2rem); line-height: 1.22; letter-spacing: -.025em; }
.chutuoc-service-design h3 { margin: 0 0 12px; font-size: 1.14rem; line-height: 1.4; }
.chutuoc-service-design p { margin: 0 0 16px; line-height: 1.75; }
.chutuoc-service-design__lead { font-size: 1.15rem; max-width: 62ch; }
.chutuoc-service-design__value { color: var(--chutuoc-service-muted); max-width: 68ch; }
.chutuoc-service-design__eyebrow { color: #a43c12; text-transform: uppercase; letter-spacing: .13em; font-size: .75rem; font-weight: 700; }
.chutuoc-service-design__breadcrumb { margin-bottom: 32px; font-size: .79rem; color: var(--chutuoc-service-muted); }
.chutuoc-service-design__breadcrumb ol { display: flex; flex-wrap: wrap; gap: 8px 16px; list-style: none; padding: 0; margin: 0; }
.chutuoc-service-design__breadcrumb li + li::before { content: '/'; margin-right: 12px; color: #96989b; }
.chutuoc-service-design__breadcrumb a { color: inherit; text-decoration: none; }
.chutuoc-service-design__breadcrumb a:hover { text-decoration: underline; }
.chutuoc-service-design__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 24px; margin-top: 28px; }
.chutuoc-service-design__actions a { min-height: 44px; display: inline-flex; align-items: center; }
.chutuoc-service-design #chutuoc-service-title { scroll-margin-top: 104px; }
.chutuoc-service-design__image { margin: 0; min-width: 0; }
.chutuoc-service-design__image img { display: block; width: 100%; height: auto; border-radius: inherit; }
.chutuoc-service-design__image figcaption { margin-top: 8px; font-size: .72rem; color: var(--chutuoc-service-muted); text-align: end; }
.chutuoc-service-design__items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.chutuoc-service-design__items > li { min-width: 0; }
.chutuoc-service-design__index, .chutuoc-service-design__cluster-index { display: block; margin-bottom: 16px; color: #a43c12; font-size: .78rem; font-weight: 700; letter-spacing: .1em; }
.chutuoc-service-design__offering-clusters { display: grid; gap: 32px; }
.chutuoc-service-design__offering-cluster { min-width: 0; }
.chutuoc-service-design__offering-cluster > ul { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; }
.chutuoc-service-design__offering { padding: 18px 0; border-top: 1px solid var(--chutuoc-service-line); min-width: 0; }
.chutuoc-service-design__offering-label { display: block; font-weight: 600; }
.chutuoc-service-design__offering p { margin: 8px 0 0; color: var(--chutuoc-service-muted); font-size: .91rem; }
.chutuoc-service-design__scope-note { border-top: 1px solid var(--chutuoc-service-line); padding-top: 24px; margin-top: 32px; color: var(--chutuoc-service-muted); }
.chutuoc-service-design__scope-note > :last-child { margin-bottom: 0; }
.chutuoc-service-design__step dl { margin: 20px 0 0; padding-top: 16px; border-top: 1px solid var(--chutuoc-service-line); font-size: .85rem; }
.chutuoc-service-design__step dt { font-weight: 600; margin-top: 12px; }
.chutuoc-service-design__step dd { margin: 4px 0 0; color: var(--chutuoc-service-muted); line-height: 1.65; }
.chutuoc-service-design__tags { display: flex; flex-wrap: wrap; gap: 12px; list-style: none; margin: 24px 0 0; padding: 0; }
.chutuoc-service-design__tags li { border: 1px solid var(--chutuoc-service-line); border-radius: 4px; padding: 10px 16px; }
.chutuoc-service-design__faq { margin: 0; }
.chutuoc-service-design__faq > div { padding: 24px 0; border-top: 1px solid var(--chutuoc-service-line); }
.chutuoc-service-design__faq dd { margin: 0; line-height: 1.75; color: var(--chutuoc-service-muted); }
.chutuoc-service-design__faq h3 { font-size: 1.04rem; }
.chutuoc-service-design__cases { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.chutuoc-service-design__cases img { display: block; width: 100%; height: auto; margin-bottom: 20px; }
.chutuoc-service-design__process-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: .88rem; }
.chutuoc-service-design__process-table caption { text-align: start; margin-bottom: 24px; color: var(--chutuoc-service-muted); }
.chutuoc-service-design__process-table th, .chutuoc-service-design__process-table td { text-align: start; vertical-align: top; padding: 20px 16px; border-bottom: 1px solid var(--chutuoc-service-line); line-height: 1.7; }
.chutuoc-service-design__process-table thead { background: var(--chutuoc-service-paper); }
.chutuoc-service-design > .chutuoc-service-page, .chutuoc-service-design .chutuoc-service-page__section { padding-block: clamp(44px, 6vw, 88px); }
.chutuoc-service-design .chutuoc-service-page > .container, .chutuoc-service-design .chutuoc-service-page__section > .container { width: min(1120px, calc(100% - 48px)); max-width: 1120px; padding-inline: 0; }
.chutuoc-service-design .chutuoc-service-page__section h2 { margin-bottom: 24px; }
.chutuoc-service-design .chutuoc-quote__grid { min-width: 0; }
.chutuoc-service-design a:focus-visible, .chutuoc-service-design button:focus-visible, .chutuoc-service-design input:focus-visible, .chutuoc-service-design select:focus-visible, .chutuoc-service-design textarea:focus-visible { outline: 3px solid #95421e; outline-offset: 4px; }
@media (max-width: 767px) {
  .chutuoc-service-design__wrap, .chutuoc-service-design .chutuoc-service-page > .container, .chutuoc-service-design .chutuoc-service-page__section > .container { width: calc(100% - 32px); }
  .chutuoc-service-design__items, .chutuoc-service-design__cases { grid-template-columns: 1fr; }
  .chutuoc-service-design__offering-cluster > ul { grid-template-columns: 1fr; }
  .chutuoc-service-design__actions { gap: 12px 20px; }
  .chutuoc-service-design__process-table thead { position: absolute; clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; }
  .chutuoc-service-design__process-table, .chutuoc-service-design__process-table tbody { display: block; }
  .chutuoc-service-design__process-table caption { display: block; width: 100%; }
  .chutuoc-service-design__process-table tr { display: grid; grid-template-columns: 1fr; border-bottom: 1px solid var(--chutuoc-service-line); padding-block: 20px; }
  .chutuoc-service-design__process-table th, .chutuoc-service-design__process-table td { display: block; border: 0; padding: 8px 0; }
  .chutuoc-service-design__process-table td[data-chutuoc-label]::before { content: attr(data-chutuoc-label); display: block; font-weight: 600; }
}