/* Customer operations: preserve-mode 5 / 3 / 3.
   A real generated scene expresses one employee serving many customers.
   Responsive service copy complements the existing light brand. */
.customer-operations { padding-block: 88px; }
.customer-scene { position: relative; margin: 0; isolation: isolate; background: #f5f5f7; }
.customer-scene-artwork { display: block; width: 100%; height: auto; mix-blend-mode: multiply; }
.customer-services { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 36px; margin-top: 36px; }
.customer-service { min-width: 0; padding: 20px 0 4px; border-top: 2px solid #dfe2e8; color: var(--ink); }
.customer-service h3 { margin: 0 0 12px; font-size: 23px; font-weight: 600; line-height: 1.45; letter-spacing: -.4px; }
.customer-service p { margin: 0; color: #535b68; font-size: 16px; line-height: 1.75; }
@media(max-width:1100px) and (min-width:768px) {
  .customer-services { gap: 28px; }
  .customer-service h3 { font-size: 21px; }
}
@media(max-width:767px) {
  .customer-operations { padding-block: 64px; }
  .customer-services { grid-template-columns: 1fr; gap: 16px; margin-top: 24px; }
  .customer-service { padding-top: 12px; }
  .customer-service h3 { margin-bottom: 6px; font-size: 17px; line-height: 1.5; letter-spacing: 0; }
  .customer-service p { font-size: 14px; line-height: 1.65; }
}