/* The normalized case-study template is an opt-in compatibility boundary.
   Legacy work-detail selectors still ship for existing portfolio pages, so
   semantic roles are restated here with template scope until those selectors
   can be retired without changing their 48 production consumers. */
.sg-case-study__background {
  position: absolute;
  z-index: -2;
  top: 0;
  right: 0;
  width: 1440px;
  height: 5100px;
  background-color: var(--sg-color-surface-pattern);
  box-shadow: inset 0 1px 63px rgb(0 0 0 / 35%);
  transform: rotate(45deg);
}

.sg-case-study__background--lower {
  top: 53%;
}

.sg-case-study--semantic .sg-type-eyebrow,
.sg-case-study--semantic
  .sg-case-studies--semantic
  .casestudies-item-category.sg-type-eyebrow {
  color: var(--sg-color-accent);
  font-family: var(--sg-font-body);
  font-size: var(--sg-text-eyebrow);
  font-weight: var(--sg-weight-eyebrow);
  letter-spacing: var(--sg-tracking-eyebrow);
  line-height: var(--sg-leading-eyebrow);
  text-transform: uppercase;
}

.sg-case-study--semantic .sg-type-section-title {
  font-family: var(--sg-font-heading);
  font-size: var(--sg-text-section-title);
  font-weight: var(--sg-weight-section-title);
  letter-spacing: var(--sg-tracking-section-title);
  line-height: var(--sg-leading-section-title);
}

.sg-case-study--semantic .sg-type-card-summary > p {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  line-height: inherit;
}

@media (max-width: 767px) {
  .sg-case-study--semantic {
    --sg-leading-page-hero-title: 1.12;
  }

  .sg-case-study__background {
    width: 430px;
    height: 285vw;
  }
}