@font-face {
  font-family: "Case Geist";
  src: url("/fonts/Case-Geist-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

html.company-os-in-products {
  font-size: clamp(8px, 1.35vw, 10px);
  background: transparent;
}

.rd2.cs-page.cos {
  --ink: #1d2230;
  --cs-mute: #4e586b;
  --gutter: clamp(20px, 5vw, 60px);
  --col-max: 1160px;
  background: #fff;
  color: var(--ink);
  font: 16px/1.55 "Case Geist", sans-serif;
}

.company-os-in-products .rd2.cs-page.cos,
.rd2.cs-page.cos .sc {
  background: transparent;
}

.rd2.cs-page.cos .cs-hero {
  padding-top: 38px;
}

.rd2.cs-page.cos .cs-hero__title {
  font: 650 clamp(27px, 4.3vw, 40px)/1.24 "Case Geist", sans-serif;
  letter-spacing: -.025em;
  text-wrap: pretty;
}

.rd2.cs-page.cos .sc {
  --sc-r: 16px;
  --sc-gap-tm: clamp(60px, 9vw, 128px);
  --sc-gap-mm: clamp(32px, 5vw, 64px);
  --sc-gap-g: var(--sc-gap-tm);
  --sc-gap-head: 24px;
  padding-bottom: 92px;
}

.rd2.cs-page.cos .sc-h,
.rd2.cs-page.cos .sc-ch .sc-cap {
  font: 650 clamp(24px, 2.6vw, 34px)/1.22 "Case Geist", sans-serif;
  letter-spacing: -.025em;
  text-wrap: pretty;
}

.rd2.cs-page.cos .sc-ch .sc-cap,
.rd2.cs-page.cos .sc-ch .sc-rule {
  display: none;
}

.rd2.cs-page.cos .sc-split {
  display: block;
}

.rd2.cs-page.cos .sc-ch .sc-split {
  margin-top: 16px;
}

.rd2.cs-page.cos .sc-body {
  max-width: none;
}

.rd2.cs-page.cos .sc-body > p {
  color: #4e586b;
  font: 400 16px/1.55 "Case Geist", sans-serif;
  letter-spacing: normal;
}

.rd2.cs-page.cos :is(.cs-hm__cap, .sc-capt) {
  margin-top: 12px;
  color: #4e586b;
  font: 400 14px/1.5 "Case Geist", sans-serif;
}

.rd2.cs-page.cos .cs-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  margin-top: 16px;
  padding-bottom: 22px;
}

.rd2.cs-page.cos .cs-meta__i {
  min-height: 0;
  padding-left: 0;
}

.rd2.cs-page.cos .cs-meta__chip {
  display: none;
}

.rd2.cs-page.cos .cs-meta__i dt,
.rd2.cs-page.cos .cs-meta__i dd {
  font-size: 13px;
}



.rd2.cs-page.cos .cs-hm img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
}

.rd2.cs-page.cos .humanely-story h2 {
  margin: 0 0 16px;
  font: 650 clamp(24px, 2.6vw, 34px)/1.22 "Case Geist", sans-serif;
  letter-spacing: -.025em;
}

.rd2.cs-page.cos .humanely-story p,
.rd2.cs-page.cos .humanely-story dd {
  color: var(--cs-mute);
}

.rd2.cs-page.cos .humanely-story p + p {
  margin-top: 12px;
}

.humanely-story-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr));
  gap: 14px;
  margin: 20px 0;
}

.humanely-story-grid > div {
  padding: 18px 20px;
  border-radius: 16px;
  background: #f6f8fc;
}

.humanely-story-grid dt {
  margin-bottom: 6px;
  font-weight: 700;
}

.humanely-story-grid dd {
  margin: 0;
  font-size: 14px;
}

.rd2.cs-page.cos .sc-dev__a {
  object-fit: contain;
  object-position: center;
}

.rd2.cs-page.cos .sc-bs__card {
  padding: clamp(16px, 3vw, 32px);
  border: 1px solid #e3e9f1;
  border-radius: 16px;
  background: #f6f8fc;
}

.rd2.cs-page.cos .sc-bs__title {
  color: var(--ink);
  font: 700 18px/1.25 "Case Geist", sans-serif;
  letter-spacing: -.02em;
  text-transform: none;
}

.rd2.cs-page.cos .sc-bs__fams {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 225px), 1fr));
  gap: 12px;
}

.rd2.cs-page.cos .sc-bs__fam {
  grid-column: auto;
  padding: 14px;
  border-radius: 12px;
  background: #fff;
}

.rd2.cs-page.cos .sc-bs__fam .sc-bs__role {
  display: block;
  min-height: 0;
}

.rd2.cs-page.cos .sc-bs__steps {
  flex-wrap: wrap;
}

.rd2.cs-page.cos .sc-bs__steps li {
  width: 62px;
}

.rd2.cs-page.cos .sc-bs__sw {
  width: 100%;
  height: 36px;
}

.rd2.cs-page.cos .sc-bs__row {
  grid-template-columns: minmax(0, 1fr);
}

.rd2.cs-page.cos .sc-bs__card--icons {
  gap: 20px;
}

.rd2.cs-page.cos .sc-bs__icons {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: clamp(12px, 2.4vw, 26px);
}

.rd2.cs-page.cos .sc-bs__icons li {
  min-height: 42px;
}

.rd2.cs-page.cos .sc-bs__icons svg {
  width: 26px;
  height: 26px;
}

@media (max-width: 560px) {
  .rd2.cs-page.cos .sc-bs__icons {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 360px) {
  .rd2.cs-page.cos .sc-bs__icons {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
