/* Case study About: white/blue and charcoal/orange variants. */
.cs-about {
  --cs-about-bg: #fff;
  --cs-about-heading: #080b10;
  --cs-about-text: #29364a;
  --cs-about-label: #8b8e96;
  --cs-about-accent: #0785ff;
  padding: 80px 32px;
  background: var(--cs-about-bg);
  color: var(--cs-about-text);
}
.cs-about--variant-2 {
  --cs-about-bg: #191b1d;
  --cs-about-heading: #fff;
  --cs-about-text: #eee;
  --cs-about-label: #fff;
  --cs-about-accent: #ff633f;
}
.cs-about__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(48px, 7vw, 112px); width: 100%; max-width: 1168px; margin: 0 auto; }
.cs-about__copy { min-width: 0; }
.cs-about__title { margin: 0 0 30px; color: var(--cs-about-heading); font-size: clamp(28px, 2.8vw, 38px); line-height: 1.25; font-weight: 700; letter-spacing: -.025em; overflow-wrap: anywhere; }
.cs-about__description { font-size: 15px; line-height: 2.05; overflow-wrap: anywhere; }
.cs-about__description p { margin: 0 0 30px; }
.cs-about__description > :last-child { margin-bottom: 0; }
.cs-about__description a { color: var(--cs-about-accent); text-decoration: underline; }
.cs-about__description ul, .cs-about__description ol { margin: 0 0 24px; padding-left: 22px; }
.cs-about__description ul { list-style: disc; }
.cs-about__description ol { list-style: decimal; }
.cs-about__details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 40px; align-content: start; margin: 0; padding: 86px 0 0; }
.cs-about--variant-2 .cs-about__details { padding-top: 6px; }
.cs-about__detail { min-width: 0; }
.cs-about__detail dt { margin: 0 0 3px; color: var(--cs-about-label); font-size: 16px; line-height: 1.5; font-weight: 600; }
.cs-about__detail dd { margin: 0; color: var(--cs-about-heading); font-size: 14px; line-height: 1.75; font-weight: 600; overflow-wrap: anywhere; }
.cs-about__detail--industry dd, .cs-about__detail .cs-about__cta { color: var(--cs-about-accent); }
.cs-about__cta { text-decoration: none; }
.cs-about__cta:hover { text-decoration: underline; text-underline-offset: 4px; }
.cs-about__cta:focus-visible { outline: 2px solid var(--cs-about-accent); outline-offset: 5px; }
.cs-about__gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; gap: clamp(20px, 3vw, 48px); max-width: 1168px; margin: 64px auto 0; padding: 0; list-style: none; }
.cs-about__gallery-item { min-width: 0; margin: 0; padding: 0; }
.cs-about__gallery-image { display: block; width: 100%; height: auto; object-fit: contain; }
@media (max-width: 900px) {
  .cs-about { padding: 80px 24px; }
  .cs-about__inner { grid-template-columns: 1fr; gap: 36px; }
  .cs-about__details, .cs-about--variant-2 .cs-about__details { padding-top: 0; }
  .cs-about__gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 40px; gap: 28px; }
}
@media (max-width: 480px) {
  .cs-about { padding: 80px 20px; }
  .cs-about__title { margin-bottom: 24px; }
  .cs-about__details { gap: 24px 20px; }
  .cs-about__gallery { gap: 20px; }
}