body[data-case-study="tour-de-suisse-cyclevasion"] .tour-main {
  --tour-rule: rgba(var(--studio-rgb), .19);
  padding-top: clamp(80px, 10vw, 145px);
}
.tour-case {
  color: var(--studio-ink);
}
.tour-intro,
.tour-idea,
.tour-making-head,
.tour-result,
.tour-credits {
  display: grid;
  grid-template-columns: minmax(145px, .43fr) minmax(0, 1.57fr);
  gap: clamp(26px, 6vw, 98px);
  border-top: 1px solid var(--tour-rule);
  padding: clamp(80px, 9vw, 128px) 0;
}
.tour-label {
  margin: 7px 0 0;
  color: var(--studio-muted);
  font-size: 15px;
  font-weight: 560;
}
.tour-case h2,
.tour-case h3,
.tour-case p {
  margin-top: 0;
}
.tour-intro h2,
.tour-idea h2,
.tour-making h2,
.tour-result h2 {
  max-width: 15ch;
  margin-bottom: 36px;
  font-size: clamp(48px, 6.1vw, 86px);
  font-weight: 620;
  line-height: 1.01;
  letter-spacing: -.067em;
  text-wrap: balance;
}
.tour-lead {
  max-width: 44ch;
  margin-bottom: 0;
  color: var(--studio-muted);
  font-size: clamp(20px, 1.85vw, 27px);
  line-height: 1.47;
}
.tour-question {
  display: grid;
  grid-template-columns: minmax(140px, .42fr) minmax(0, 1fr);
  gap: 30px;
  max-width: 880px;
  margin-top: clamp(65px, 8vw, 116px);
  padding: 26px 0;
  border-top: 1px solid var(--tour-rule);
  border-bottom: 1px solid var(--tour-rule);
}
.tour-question span {
  color: var(--studio-muted);
  font-size: 15px;
}
.tour-question p {
  max-width: 32ch;
  margin-bottom: 0;
  font-size: clamp(25px, 3vw, 42px);
  font-weight: 550;
  line-height: 1.16;
  letter-spacing: -.045em;
}
.tour-idea {
  padding-bottom: clamp(105px, 12vw, 170px);
}
.tour-sequence {
  border-top: 1px solid var(--tour-rule);
}
.tour-step {
  display: grid;
  grid-template-columns: minmax(0, 1.14fr) minmax(280px, .86fr);
  gap: clamp(32px, 5vw, 82px);
  align-items: center;
  padding: clamp(70px, 8vw, 118px) 0;
  border-bottom: 1px solid var(--tour-rule);
}
.tour-step:nth-child(even) {
  grid-template-columns: minmax(280px, .86fr) minmax(0, 1.14fr);
}
.tour-step:nth-child(even) figure {
  order: 2;
}
.tour-step figure,
.tour-bts figure {
  margin: 0;
}
.tour-step figure > img,
.tour-film-pair img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}
.tour-film-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.tour-film-pair img {
  height: 100%;
  aspect-ratio: auto;
}
.tour-step figcaption,
.tour-bts-caption {
  margin-top: 13px;
  color: var(--studio-muted);
  font-size: 13px;
  line-height: 1.4;
}
.tour-step-copy {
  max-width: 410px;
}
.tour-step-copy > span {
  display: block;
  margin-bottom: 30px;
  color: var(--studio-accent);
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}
.tour-step-copy h3 {
  max-width: 12ch;
  margin-bottom: 28px;
  font-size: clamp(38px, 4vw, 60px);
  font-weight: 610;
  line-height: 1.04;
  letter-spacing: -.059em;
  text-wrap: balance;
}
.tour-step-copy p {
  max-width: 36ch;
  margin-bottom: 0;
  color: var(--studio-muted);
  font-size: clamp(18px, 1.5vw, 22px);
  line-height: 1.52;
}
.tour-making {
  padding-bottom: clamp(90px, 10vw, 145px);
}
.tour-making-head {
  border-top: 0;
  padding-bottom: clamp(60px, 7vw, 100px);
}
.tour-bts {
  display: grid;
  grid-template-columns: 1.35fr 1fr 1fr;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 12px;
  max-height: 900px;
}
.tour-bts figure:first-child {
  grid-row: span 2;
}
.tour-bts img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 220px;
  object-fit: cover;
}
.tour-bts figure:first-child img {
  object-position: center 55%;
}
.tour-result {
  padding-bottom: clamp(90px, 11vw, 160px);
}
.tour-result a,
.tour-cta a {
  display: inline-flex;
  gap: 12px;
  margin-top: 36px;
  padding-bottom: 12px;
  border-bottom: 1px solid currentColor;
  font-size: 18px;
  font-weight: 560;
  text-decoration: none;
}
.tour-result a:hover,
.tour-cta a:hover {
  color: var(--studio-accent);
}
.tour-result a:focus-visible,
.tour-cta a:focus-visible {
  outline: 2px solid var(--studio-accent);
  outline-offset: 5px;
}
.tour-credits {
  padding: 50px 0 90px;
}
.tour-credits dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 40px;
  margin: 0;
}
.tour-credits dl > div {
  display: grid;
  grid-template-columns: minmax(130px, .7fr) minmax(0, 1.3fr);
  gap: 16px;
  padding: 17px 0;
  border-bottom: 1px solid var(--tour-rule);
  font-size: 16px;
  line-height: 1.45;
}
.tour-credits dt {
  color: var(--studio-muted);
}
.tour-credits dd {
  margin: 0;
}
.tour-cta {
  border-top: 1px solid var(--tour-rule);
  padding: clamp(75px, 9vw, 130px) 0;
}
.tour-cta h2 {
  max-width: 15ch;
  margin-bottom: 0;
  font-size: clamp(48px, 6.1vw, 86px);
  font-weight: 620;
  line-height: 1.01;
  letter-spacing: -.067em;
}
@media (max-width: 900px) {
  .tour-step,
  .tour-step:nth-child(even) {
    grid-template-columns: 1fr;
  }
  .tour-step:nth-child(even) figure {
    order: 0;
  }
  .tour-step-copy {
    max-width: 630px;
  }
}
@media (max-width: 740px) {
  body[data-case-study="tour-de-suisse-cyclevasion"] nav [data-navbg] {
    background: rgba(10, 10, 11, .94) !important;
    opacity: 1 !important;
  }
  html[data-theme="light"] body[data-case-study="tour-de-suisse-cyclevasion"] nav [data-navbg] {
    background: rgba(248, 248, 249, .96) !important;
  }
  body[data-case-study="tour-de-suisse-cyclevasion"] .tour-main {
    padding-top: 45px;
  }
  .tour-intro,
  .tour-idea,
  .tour-making-head,
  .tour-result,
  .tour-credits {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 74px 0;
  }
  .tour-intro h2,
  .tour-idea h2,
  .tour-making h2,
  .tour-result h2,
  .tour-cta h2 {
    margin-bottom: 26px;
    font-size: clamp(42px, 12vw, 66px);
  }
  .tour-question {
    grid-template-columns: 1fr;
    gap: 17px;
    margin-top: 64px;
  }
  .tour-step {
    gap: 30px;
    padding: 67px 0;
  }
  .tour-step-copy > span {
    margin-bottom: 20px;
  }
  .tour-step-copy h3 {
    font-size: clamp(36px, 10vw, 54px);
  }
  .tour-bts {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: none;
    max-height: none;
  }
  .tour-bts figure:first-child {
    grid-row: span 2;
  }
  .tour-bts img {
    min-height: 160px;
    aspect-ratio: 4 / 5;
  }
  .tour-credits dl {
    grid-template-columns: 1fr;
  }
  .tour-cta {
    padding: 80px 0;
  }
}
@media (max-width: 480px) {
  .tour-film-pair {
    gap: 5px;
  }
  .tour-bts {
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }
  .tour-bts figure:first-child {
    grid-row: auto;
  }
  .tour-bts img {
    aspect-ratio: 3 / 4;
    min-height: 0;
  }
  .tour-credits dl > div {
    grid-template-columns: minmax(100px, .75fr) minmax(0, 1.25fr);
  }
}