/*
 * SOCIAL PROOF BLOCK
 */

.social-proof-block {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
}

.social-proof-block .casestudy-section {
  color: #222222;
  background-color: #FFFFFF;
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  text-wrap: pretty;
}

.social-proof-block .casestudy-section b {
  color: #000000;
}

.social-proof-block .casestudy-section h2 {
  color: #000000;
  font-size: 2.25rem;
  font-weight: 900;
  text-transform: uppercase;
  text-wrap: pretty;
}

.social-proof-block .casestudy-section h3 {
  color: #FF6600;
  font-size: 1.25rem;
  font-weight: bold;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  text-wrap: pretty;
}

.social-proof-block .casestudy-section .casestudy-paragraph {
  text-wrap: pretty;
}

.social-proof-block .casestudy-section .casestudy-feature-card-wrapper {
  height: 100%;
  filter: drop-shadow(0px 2px 5px rgba(0, 0, 0, 0.1));
}

.social-proof-block .casestudy-section .casestudy-feature-card {
  position: relative;
  background-color: #FF6600;
  box-sizing: border-box;
  clip-path: polygon(14px 0, 100% 0, 100% 100%, 0 100%, 0 27px);
}

.social-proof-block .casestudy-section .casestudy-feature-card::before {
  content: "";
  display: block;
  position: absolute;
  top: 2px;
  left: 2px;
  right: 2px;
  bottom: 2px;
  background: #F5F5F5;
  clip-path: polygon(13px 0, 100% 0, 100% 100%, 0 100%, 0 25px);
  -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.1);
  box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.1);
}

.social-proof-block .casestudy-section .casestudy-feature-card .casestudy-feature-card-txt {
  text-wrap: pretty;
  padding: 25px 45px 25px 45px;
}

.social-proof-block .casestudy-section .casestudy-feature-card h6 {
  color: #FF6600;
  font-size: 1.25rem;
  font-weight: bold;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.social-proof-block .casestudy-section .casestudy-feature-card h5 {
  color: #000000;
  font-size: 1.5rem;
  font-weight: bold;
  letter-spacing: 0.025em;
  text-transform: uppercase;
}

.social-proof-block .casestudy-section .casestudy-feature-card blockquote {
  color: #222222;
  font-size: 1.5rem;
  font-weight: bold;
  font-style: italic;
  border-left: 4px solid #FF6600;
  padding-left: 10px;
}

.social-proof-block .casestudy-section .casestudy-feature-card .casestudy-link-wrapper {
  position: absolute;
  right: 0px;
  bottom: 0px;
}

.social-proof-block .casestudy-section .casestudy-feature-card a {
  color: #FFFFFF;
  font-weight: bold;
  font-size: 1.125rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  display: inline-block;
  position: absolute;
  right: -1px;
  bottom: 0px;
  background-color: #FF6600;
  box-shadow: inset 0 2px 5px 0px rgba(0, 0, 0, 0.1);
  --pad-top: 3px;
  --pad-bottom: 2px;
  padding-top: var(--pad-top);
  padding-bottom: var(--pad-bottom);
  padding-right: 10px;
  --total-height: calc(1lh + var(--pad-top) + var(--pad-bottom));
  --dynamic-angle-width: calc(var(--total-height) * (18 / 35));
  padding-left: calc(10px + var(--dynamic-angle-width));
  clip-path: polygon(var(--dynamic-angle-width) 0, 100% 0, 100% 100%, 0 100%);
}

@media(max-width: 767px) {
  .social-proof-block .casestudy-section .casestudy-feature-card a {
    right: 15px;
  }
}

.social-proof-block .casestudy-section .casestudy-feature-card .casestudy-feature-img-container {
  padding: 2px 17px 2px 0px;
}

.social-proof-block .casestudy-section .casestudy-feature-card .casestudy-feature-img-container .casestudy-feature-img {
  margin-right: 2px;
}

.social-proof-block .casestudy-section .casestudy-card-wrapper {
  height: 100%;
  filter: drop-shadow(0px 2px 5px rgba(0, 0, 0, 0.1));
}

.social-proof-block .casestudy-section .casestudy-card {
  font-size: 1rem;
  background-color: #C5C5C5;
  height: 100%;
  position: relative;
  box-sizing: border-box;
  clip-path: polygon(14px 0, 100% 0, 100% 100%, 0 100%, 0 27px);
  -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.1);
  box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.1);
}

.social-proof-block .casestudy-section .casestudy-card::before {
  content: "";
  display: block;
  position: absolute;
  top: 1px;
  left: 1px;
  right: 1px;
  bottom: 1px;
  background: #F5F5F5;
  clip-path: polygon(13.5px 0, 100% 0, 100% 100%, 0 100%, 0 26px);
}

.social-proof-block .casestudy-section .casestudy-card .casestudy-card-txt {
  color: #222222;
  padding: 35px 55px 30px 55px;
  text-wrap: pretty;
  height: 100%;
}

.social-proof-block .casestudy-section .casestudy-card .casestudy-card-txt .casestudy-callout {
  color: #FF6600;
  font-weight: bold;
  font-size: 1.5rem;
  display: inline-block;
  margin-bottom: 1rem;
}

@media(max-width: 991px) {
  .social-proof-block .casestudy-section .casestudy-card .casestudy-card-txt .casestudy-callout {
    font-size: 1.25rem;
  }
}

.social-proof-block .casestudy-section .casestudy-card .casestudy-card-txt p {
  margin-bottom: 0.25rem;
}

.social-proof-block .casestudy-section .casestudy-card a {
  color: #000000;
  font-weight: bold;
  font-size: 0.813rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  display: inline-block;
  position: absolute;
  right: 15px;
  bottom: 0px;
  background-color: #C5C5C5;
  box-shadow: inset 0 2px 5px 0px rgba(0, 0, 0, 0.1);
  --pad-top: 3px;
  --pad-bottom: 2px;
  padding-top: var(--pad-top);
  padding-bottom: var(--pad-bottom);
  padding-right: 10px;
  --total-height: calc(1lh + var(--pad-top) + var(--pad-bottom));
  --dynamic-angle-width: calc(var(--total-height) * (18 / 35));
  padding-left: calc(10px + var(--dynamic-angle-width));
  clip-path: polygon(var(--dynamic-angle-width) 0, 100% 0, 100% 100%, 0 100%);
}

.social-proof-block .casestudy-section .casestudy-card h5 {
  color: #000000;
  font-size: 1.25rem;
  font-weight: bold;
  letter-spacing: 0.025em;
  text-transform: uppercase;
}