/* 1440 × 402 + 48 gap: kicker left 48 / top 104; heading left 272.61 / top 96;
   body left 275 / top 346, 656 wide.
   Kicker position control swaps the --tc-kicker-* / --tc-*-row variables;
   grid-column -2 is the last column, so it works with one or two columns. */
.tc-case.tc-case-campaign {
  --tc-campaign-col: calc(224.61 * var(--u));
  display: grid;
  grid-template-columns: var(--tc-campaign-col) minmax(0, 1fr);
  align-items: start;
  padding: calc(96 * var(--u)) var(--tc-m) calc(48 * var(--u));
  background: var(--tangerine-cream, #fff9f5);
}

.tc-case-campaign .tc-case-campaign__kicker {
  grid-column: var(--tc-kicker-col, 1);
  grid-row: var(--tc-kicker-row, 1);
  margin: 0;
  padding: var(--tc-kicker-pad, calc(8 * var(--u)) 0 0);
  font-size: calc(15 * var(--u));
  line-height: 1.1;
  letter-spacing: -0.06em;
  text-transform: uppercase;
}

.tc-case-campaign .tc-case-campaign__title {
  grid-column: -2;
  grid-row: var(--tc-title-row, 1);
  margin: 0;
  font-size: calc(112 * var(--u));
  font-weight: 400;
  line-height: 0.9;
  letter-spacing: -0.06em;
  text-transform: uppercase;
}

.tc-case-campaign .tc-case-campaign__text {
  grid-column: -2;
  grid-row: var(--tc-text-row, 2);
  display: flex;
  flex-direction: column;
  gap: calc(21 * var(--u));
  width: calc(656 * var(--u));
  max-width: 100%;
  margin: calc(18 * var(--u)) 0 0 calc(2.39 * var(--u));
  font-size: calc(15 * var(--u));
  line-height: calc(21 * var(--u));
}

@media (max-width: 1024px) {
  .tc-case.tc-case-campaign {
    --tc-kicker-col: 1;
    --tc-kicker-row: 1;
    --tc-title-row: 2;
    --tc-text-row: 3;
    --tc-kicker-pad: 0 0 16px;
    grid-template-columns: minmax(0, 1fr);
    padding: 96px var(--tc-m) 48px;
  }

  .tc-case-campaign .tc-case-campaign__kicker {
    font-size: 15px;
  }

  .tc-case-campaign .tc-case-campaign__title {
    font-size: 72px;
  }

  .tc-case-campaign .tc-case-campaign__text {
    gap: 21px;
    width: 100%;
    max-width: 560px;
    margin: 24px 0 0;
    font-size: 15px;
    line-height: 21px;
  }
}

@media (max-width: 767px) {
  .tc-case.tc-case-campaign {
    padding: 64px var(--tc-m) 40px;
  }

  .tc-case-campaign .tc-case-campaign__title {
    font-size: 44px;
  }
}
