/* cancer: shared styles or page-specific layout; media order is intentional. */
.cancer-introduction,
.cancer-story {
  padding: calc(var(--section-space) + var(--row-space)) 0;
}
.cancer-introduction .section-title,
.cancer-story .section-title {
  margin-bottom: 30px;
}
.cancer-consult {
  padding: calc(var(--section-space) + var(--row-space)) 0;
  position: relative;
  overflow: clip;
}
.consult-copy {
  max-width: 525px;
  margin: auto;
  text-align: center;
}
.consult-copy > p + p {
  margin-top: 24px;
}
.cancer-consult .rose {
  position: absolute;
}
.cancer-booking {
  padding: 54px 0px;
}
.cancer-booking .frame {
  padding: 47px 60px;
}
.cancer-booking .invitation {
  font-size: 32px;
  line-height: 1.8;
  margin-bottom: 20px;
}
@media (max-width: 980px) {
  .cancer-consult .rose {
    position: static;
    display: block;
  }
  .cancer-booking {
    padding: 110px 0px;
  }
  .cancer-booking .frame {
    padding: 40px 60px;
  }
}
@media (max-width: 767px) {
  .cancer-consult .rose {
    margin-top: 30px;
  }
  .cancer-booking .frame {
    padding: 40px 10px;
  }
  .cancer-story .section-title {
    margin-bottom: 30px;
  }
}
.cancer-introduction {
  padding-bottom: 60px;
}
.cancer-story {
  padding-bottom: 80px;
}
.cancer-consult {
  padding-top: 52px;
  padding-bottom: 79px;
}
.cancer-consult .rose {
  width: 280px;
  transform: rotate(14deg);
  top: 24px;
  left: calc(50% + 228px);
}
.cancer-booking .frame {
  padding-block: 52px;
}
@media (min-width: 981px) and (max-width: 1349px) {
  .cancer-consult {
    padding-top: calc(25px + 2vw);
    padding-bottom: calc(25px + 4vw);
  }
  .cancer-consult .rose {
    width: 21.3vw;
    left: calc(50% + 17vw);
  }
  .cancer-booking {
    padding-block: 4vw;
  }
  .cancer-booking .frame {
    padding-block: calc(25px + 2vw);
  }
}
@media (max-width: 980px) {
  .cancer-consult {
    padding: 55px 0px 0px;
  }
  .cancer-consult .rose {
    width: 5%;
    transform: none;
    margin: 30px auto 0px;
  }
  .cancer-booking .frame {
    padding-block: 90px;
  }
}
@media (max-width: 767px) {
  .cancer-introduction .section-title {
    margin-bottom: 30px;
  }
  .cancer-introduction {
    padding-bottom: 48px;
  }
  .cancer-story {
    padding-bottom: 106px;
  }
  .cancer-consult {
    padding: 55px 0px 0px;
  }
  .cancer-consult .rose {
    width: 100%;
  }
  .cancer-booking .frame {
    padding-block: 50px;
  }
}
@media (min-width: 981px) and (max-width: 1349px) {
  .cancer-introduction .section-title,
  .cancer-story .section-title {
    margin-bottom: 2.75%;
  }
}
@media (min-width: 768px) and (max-width: 980px) {
  .cancer-booking .frame {
    padding-block: 100px;
  }
}
