.case-study-pennicanza {
  --pennicanza-red: #ee2c3d;
}

.pennicanza-article {
  background: #fff;
  color: var(--pennicanza-red);
}

.pennicanza-article *,
.pennicanza-article *::before,
.pennicanza-article *::after {
  box-sizing: border-box;
}

.pennicanza-article h1,
.pennicanza-article p,
.pennicanza-article figure {
  margin: 0;
}

.pennicanza-article img,
.pennicanza-article video {
  display: block;
  width: 100%;
}

.pennicanza-copy {
  max-width: 39rem;
  font-size: var(--type-case-copy);
  line-height: var(--leading-case-copy);
}

.pennicanza-copy p + p {
  margin-top: 1.1em;
}

.pennicanza-hero {
  display: grid;
  grid-template-columns: minmax(280px, 5fr) minmax(0, 7fr);
  gap: clamp(52px, 7vw, 116px);
  align-items: start;
  padding: 34px 38px clamp(72px, 8vw, 128px);
}

.pennicanza-hero__copy {
  padding-top: clamp(120px, 14vw, 220px);
}

.pennicanza-hero h1 {
  font-size: var(--type-case-title);
  font-weight: 700;
  line-height: var(--leading-case-title);
  letter-spacing: 0;
}

.pennicanza-hero__intro {
  margin-top: clamp(48px, 5vw, 78px);
}

.pennicanza-hero__media {
  width: min(100%, 760px);
  justify-self: end;
}

.pennicanza-hero__media img {
  height: auto;
  aspect-ratio: 1696 / 2528;
  object-fit: cover;
}

.pennicanza-storyboard {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 0 38px clamp(84px, 9vw, 144px);
}

.pennicanza-storyboard img {
  height: auto;
  aspect-ratio: 2752 / 1536;
  object-fit: cover;
}

.pennicanza-process {
  padding: 0 38px clamp(88px, 10vw, 156px);
}

.pennicanza-process__media,
.pennicanza-process__copy {
  width: min(88%, 1320px);
  margin-inline: auto;
}

.pennicanza-process__media img {
  height: auto;
  aspect-ratio: 2752 / 1536;
  object-fit: cover;
}

.pennicanza-process__copy {
  max-width: 1320px;
  margin-top: clamp(34px, 4vw, 62px);
}

.pennicanza-process__copy p {
  max-width: 70rem;
}

.pennicanza-film {
  padding: 0;
}

.pennicanza-film video {
  width: 100%;
  margin: 0;
  aspect-ratio: 1920 / 1076;
  object-fit: contain;
  background: #000;
}

.case-study-pennicanza .blog-related {
  padding-bottom: 0;
}

@media (min-width: 761px) and (max-width: 1100px) {
  .pennicanza-hero__copy {
    padding-top: 0;
  }
}

@media (max-width: 760px) {
  .pennicanza-hero {
    grid-template-columns: 1fr;
    gap: 40px;
    padding: 62px 20px 84px;
  }

  .pennicanza-hero__copy {
    grid-row: 2;
    padding-top: 40px;
  }

  .pennicanza-hero__media {
    grid-row: 1;
  }

  .pennicanza-hero__intro {
    margin-top: 34px;
  }

  .pennicanza-hero__media {
    width: 100%;
    max-width: none;
  }

  .pennicanza-storyboard {
    grid-template-columns: 1fr;
    gap: 5px;
    padding: 0 20px 84px;
  }

  .pennicanza-process {
    padding-inline: 20px;
    padding-bottom: 82px;
  }

  .pennicanza-process__media,
  .pennicanza-process__copy {
    width: 100%;
  }

  .pennicanza-process__copy {
    margin-top: 28px;
  }
}