/* Client Illustrator pages supplied 2026-08-08. Isolated from completed pages. */
.stories-introduction {
  margin-bottom: 70px;
}

.stories-introduction h2 {
  margin: 0 0 30px;
  color: #242424;
  font-size: 25px;
  font-weight: 600;
  letter-spacing: .03em;
  line-height: 1.5;
}

.stories-introduction p {
  margin: 0 0 22px;
  font-size: 16px;
  line-height: 1.8;
}

.story-grid {
  display: grid;
  align-items: start;
}

.story-grid--case-studies {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 22px;
}

.story-card {
  min-width: 0;
  color: #242424;
  text-decoration: none;
}

.story-card--case-studies {
  display: block;
  overflow: hidden;
  border: 1px solid #aaa;
  background: #fff;
}

.story-card--case-studies img {
  display: block;
  width: 100%;
  aspect-ratio: 1.98 / 1;
  object-fit: cover;
}

.story-card__body {
  display: block;
}

.story-card--case-studies .story-card__body {
  min-height: 120px;
  padding: 14px 18px 16px;
}

.story-card strong,
.story-card__body > span {
  display: block;
}

.story-card strong {
  font-size: 17px;
  line-height: 1.5;
}

.story-card__body > span {
  margin-top: 7px;
  line-height: 1.65;
}

.story-card--case-studies .story-card__body > span {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.story-card:hover,
.story-card:focus-visible {
  color: var(--design-red);
}

.story-card:hover img,
.story-card:focus-visible img {
  filter: brightness(.96);
}

.story-grid--voices {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 54px 45px;
}

.story-card--voices {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.story-card--voices img {
  display: block;
  width: 154px;
  height: 154px;
  align-self: center;
  border-radius: 50%;
  object-fit: cover;
}

.story-card--voices .story-card__body {
  margin-top: 16px;
}

.story-card--voices .story-card__body > span {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.information-row__title-line {
  display: flex;
  align-items: center;
  gap: 14px;
}

.information-row__title {
  min-width: 0;
}

.information-row__badge {
  flex: 0 0 auto;
  padding: 5px 10px;
  color: #b52a23;
  border: 1px solid #b52a23;
  background: #fff;
  font-size: 13px;
  line-height: 1.2;
  white-space: nowrap;
}

.security-policy-content {
  max-width: 1048px;
  padding-top: 74px;
  padding-bottom: 150px;
}

.security-policy-content > p:first-child {
  max-width: 790px;
  margin: 0 0 58px;
  font-size: 16px;
  line-height: 1.9;
}

.security-policy-content h2 {
  margin: 48px 0 28px;
}

.security-policy-content h2 + p {
  margin-bottom: 0;
  font-size: 16px;
  line-height: 1.9;
}

.security-policy-signature {
  margin-top: 78px;
  line-height: 1.8;
}

@media screen and (min-width: 1200px) {
  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-information-security-policy,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) :is(.site-main, .site-footer) {
    /* width: 1200px; */
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-information-security-policy,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .site-copyright {
    width: 1200px;
    max-width: 100%;
    margin-right: auto;
    margin-bottom: 9px;
    margin-left: auto;
    height: 63px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-information-security-policy,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .site-footer {
    /* height: 847.49px; */
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-information-security-policy,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .site-brand {
    top: 11px;
    left: 39px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-information-security-policy,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .utility-nav {
    top: 26px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-information-security-policy,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .additional-page-header {
    min-height: 149px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .additional-page-layout {
    padding-top: 53px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .additional-page-main {
    position: relative;
    left: -2px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .additional-page-sidebar {
    position: relative;
    left: 5px;
    width: 235px;
    padding-top: 2px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .design-side-nav__title {
    width: 235px;
    padding: 13px 15px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .design-side-nav {
    width: 235px;
    padding: 8px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .design-side-nav > ul > li + li {
    margin-top: 6px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .design-side-nav > ul > li > a {
    min-height: 49px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .design-side-nav > ul > li > a.is-current {
    min-height: 49px;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .design-side-nav > ul > li > a:not(.is-current) {
    color: #242424;
    background: #fff;
  }

  .columbus-design-reference-page .stories-introduction p {
    line-height: 1.4;
  }

  .columbus-design-reference-case-studies .stories-introduction {
    margin-bottom: 103px;
  }

  .columbus-design-reference-case-studies .story-grid--case-studies {
    width: 735px;
    max-width: none;
    column-gap: 23px;
    row-gap: 23px;
    margin-left: 4px;
  }

  .columbus-design-reference-case-studies .story-card--case-studies:nth-child(n + 5) {
    position: relative;
    top: 2px;
  }

  .columbus-design-reference-case-studies .story-card--case-studies img {
    aspect-ratio: 2.25 / 1;
  }

  .columbus-design-reference-voices .stories-introduction {
    margin-bottom: 61px;
  }

  .columbus-design-reference-voices .story-grid--voices {
    width: 708px;
    max-width: none;
    margin-left: 37px;
    row-gap: 34px;
  }

  .columbus-design-reference-voices .story-card--voices strong {
    font-size: 16px;
  }

  .columbus-design-reference-voices .story-card--voices .story-card__body > span {
    font-size: 13px;
    line-height: 1.55;
  }

  .columbus-design-reference-voices .story-card--voices:nth-child(4) img {
    object-position: 63% center;
  }

  body:is(
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .additional-page-main {
    padding-top: 9px;
  }

  body:is(
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .information-list {
    width: 748px;
    max-width: none;
  }

  .site-main > article {
    min-height: 0;
  }

  body:is(
    .columbus-design-reference-case-studies,
    .columbus-design-reference-voices,
    .columbus-design-reference-news,
    .columbus-design-reference-training-information,
    .columbus-design-reference-other-organizations
  ) .site-footer__to-top {
    top: 85px;
    right: 5px;
  }

  .columbus-design-reference-information-security-policy .site-footer__to-top {
    top: 92px;
    right: 5px;
  }

  .columbus-design-reference-information-security-policy .security-policy-content {
    position: relative;
    left: 3px;
    width: 1036px;
    max-width: none;
    padding-top: 62px;
    padding-bottom: 16px;
  }

  .columbus-design-reference-information-security-policy .security-policy-content > p:first-child {
    margin-bottom: 12px;
    font-size: 14px;
    line-height: 1.6;
  }

  .columbus-design-reference-information-security-policy .security-policy-content h2 {
    display: flex;
    height: 43px;
    align-items: center;
    padding: 0 18px;
    margin: 0 0 24px;
    font-size: 20px;
    line-height: 1.5;
  }

  .columbus-design-reference-information-security-policy .security-policy-content h2 + p {
    margin: 0 0 56px;
    font-size: 14px;
    line-height: 1.8;
  }

  .columbus-design-reference-information-security-policy .security-policy-content h2:nth-of-type(3) + p {
    margin-bottom: 85px;
  }

  .columbus-design-reference-information-security-policy .security-policy-content h2:last-of-type + p {
    margin-bottom: 0;
  }

  .columbus-design-reference-information-security-policy .security-policy-content h2:nth-of-type(4) + p {
    margin-bottom: 53px;
  }

  .columbus-design-reference-information-security-policy .security-policy-signature {
    margin-top: 78px;
    font-size: 14px;
    line-height: 1.8;
  }
}

@media screen and (max-width: 900px) {
  .columbus-design-reference-page .design-page--stories .additional-page-layout,
  .columbus-design-reference-page .design-page--information .additional-page-layout {
    grid-template-columns: minmax(0, 1fr);
    padding-right: 0;
    padding-left: 0;
  }

  .columbus-design-reference-page .design-page--stories .additional-page-sidebar,
  .columbus-design-reference-page .design-page--information .additional-page-sidebar {
    order: 1;
  }

  .stories-introduction {
    margin-bottom: 52px;
  }

  .story-grid--voices {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 46px 32px;
  }

  .security-policy-content {
    padding-top: 60px;
    padding-bottom: 110px;
  }
}

@media screen and (max-width: 620px) {
  .stories-introduction h2 {
    font-size: 23px;
  }

  .story-grid--case-studies,
  .story-grid--voices {
    grid-template-columns: 1fr;
  }

  .story-card--voices {
    width: min(100%, 310px);
    margin: 0 auto;
  }

  .information-row__title-line {
    align-items: flex-start;
    grid-column: 1;
    flex-direction: column;
    gap: 8px;
  }

  .security-policy-content {
    padding-top: 46px;
    padding-bottom: 80px;
  }

  .security-policy-content > p:first-child {
    margin-bottom: 44px;
  }

  .security-policy-content h2 {
    margin-top: 42px;
  }
}

/*
 * Shared footer normalization
 *
 * The footer is a site-wide component. Let subpage content determine its own
 * height instead of preserving artboard-only whitespace, and keep the desktop
 * footer controls aligned with the homepage.
 */
body:not(.home) .site-main > article {
  min-height: 0;
}

@media screen and (min-width: 1200px) {
  body:not(.home) .site-footer__to-top {
    top: 82.21px;
    right: 5.6px;
  }

  body:not(.home) .site-copyright {
    width: 100%;
    max-width: none;
    height: 63.68px;
    margin: 0;
  }
}

@media screen and (max-width: 1199.98px) {
  body:not(.home) .site-copyright {
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 63px;
    margin: 0;
  }
}

/* Client request: taller training rows with the post's featured image. */
.information-row.information-row--training {
  min-height: 148px;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  gap: 10px;
  padding: 24px 3px;
}

.information-row--training .information-row__title-line {
  flex-wrap: wrap;
}

.information-row--training.information-row--with-thumbnail {
  grid-template-columns: 160px minmax(0, 1fr);
  column-gap: 22px;
}

.information-row--training .information-row__thumbnail {
  display: block;
  width: 160px;
  height: 100px;
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: center;
  object-fit: contain;
}

.information-row--with-thumbnail > time,
.information-row--with-thumbnail > .information-row__title-line {
  grid-column: 2;
}

@media screen and (max-width: 620px) {
  .information-row.information-row--training {
    min-height: 136px;
    padding: 18px 3px;
  }

  .information-row--training.information-row--with-thumbnail {
    grid-template-columns: 88px minmax(0, 1fr);
    column-gap: 14px;
  }

  .information-row--training .information-row__thumbnail {
    width: 88px;
    height: 88px;
  }
}
/* Information navigation uses the current-item class on every list page,
   including new pages that do not have a legacy design-reference body class. */
.design-page--information .design-side-nav > ul > li > a:not(.is-current) {
  color: #242424;
  background: #fff;
}