@media (min-width: 56rem) {
  .split-layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .split-layout--reverse > :first-child {
    order: 2;
  }

  .split-layout--reverse > :last-child {
    order: 1;
  }

  .fertility-basics__grid {
    grid-template-columns: minmax(0, 1.5fr) minmax(18rem, 0.7fr);
  }

  .age-ranges {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .journey-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 75rem) {
  :root {
    --desktop-content-track: min(66.72vw, 80.0625rem);
    --desktop-content-shift: min(2.9vw, 3.5rem);
  }

  body {
    font-size: 1.0625rem;
  }

  .button {
    min-height: 4rem;
    min-width: 26rem;
    padding-inline: 2rem;
    font-size: 1rem;
  }

  .hero .button {
    min-width: 30rem;
  }

  .quiz .button {
    min-width: 28rem;
  }

  .site-header {
    position: absolute;
    inset: 0 0 auto;
    z-index: 5;
    border: 0;
    background: transparent;
  }

  .site-header__inner {
    width: fit-content;
    max-width: calc(100% - 4rem);
    min-height: 0;
    justify-content: flex-start;
    gap: min(2.9167vw, 3.5rem);
    padding-block: min(2.3958vw, 2.875rem) min(0.8333vw, 1rem);
  }

  .brand img {
    width: min(14.0625vw, 16.875rem);
  }

  .site-nav {
    gap: min(1.4583vw, 1.75rem);
  }

  .site-nav a {
    font-size: min(1.2236vw, 1.468375rem);
    line-height: 1.2;
  }

  .hero__inner {
    position: relative;
    width: min(100%, var(--artboard-width));
    height: auto;
    aspect-ratio: 1920 / 852;
    grid-template-columns: 53.65% 46.35%;
    margin-inline: auto;
  }

  .hero__media {
    position: absolute;
    z-index: 0;
    inset: 0;
    background: var(--color-hero-nude);
  }

  .hero__media::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(
      90deg,
      transparent 56%,
      color-mix(in srgb, var(--color-hero-nude) 38%, transparent) 72%,
      var(--color-hero-nude) 96%
    );
    content: "";
    pointer-events: none;
  }

  .hero__media picture,
  .hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .hero__media img {
    object-position: center;
    transform: translateX(-13%);
  }

  .hero__content {
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 1;
    align-self: stretch;
    grid-column: 2;
    max-width: none;
    padding: min(8.0547vw, 9.665625rem) 0 3rem min(2.0833vw, 2.5rem);
  }

  .hero__content h1 {
    max-width: min(28.75vw, 34.5rem);
    margin-bottom: min(2.7604vw, 3.3125rem);
    font-size: min(2.916vw, 3.49923rem);
    line-height: 1.0538;
    text-transform: uppercase;
  }

  .hero__content h1 span {
    max-width: min(30.3125vw, 36.375rem);
    margin-top: 0.3125rem;
    font-size: min(2.34375vw, 2.8125rem);
    line-height: 1.1333;
    text-transform: none;
  }

  .hero__content p {
    max-width: min(30.3125vw, 36.375rem);
    margin-bottom: min(0.6771vw, 0.8125rem);
    font-size: min(1.2236vw, 1.468375rem);
    line-height: 1.2769;
  }

  .hero__content > p:first-of-type {
    margin-bottom: 0;
    font-weight: 400;
  }

  .hero__content .button {
    order: 1;
    min-width: min(25.3125vw, 30.375rem);
    min-height: min(4.4792vw, 5.375rem);
    margin-top: min(2.7083vw, 3.25rem);
    font-size: min(1.6338vw, 1.96056rem);
    font-weight: 400;
  }

  .planning,
  .quiz,
  .fertility-basics,
  .fertility-factors,
  .egg-freezing,
  .timing,
  .journey,
  .fertgroup-presence,
  .final-cta {
    padding-block: 0;
  }

  .planning {
    display: flex;
    min-height: min(55.21vw, 66.25rem);
    align-items: center;
    overflow: hidden;
  }

  .planning .split-layout {
    position: relative;
    display: block;
    width: var(--desktop-content-track);
    max-width: none;
    transform: translateX(var(--desktop-content-shift));
  }

  .planning .section-copy {
    position: relative;
    z-index: 1;
    width: 49.4%;
  }

  .planning h2 {
    margin-bottom: min(2.08vw, 2.5rem);
    color: var(--color-nude-heading);
    font-size: min(3.75vw, 3.75rem);
    line-height: 1;
  }

  .planning h2 span {
    margin-top: 0.4rem;
    font-family: var(--font-display);
    font-weight: 400;
  }

  .planning__card {
    width: 100%;
    min-height: min(26.96vw, 32.375rem);
    padding: min(2.97vw, 3.5625rem) min(3.49vw, 4.1875rem);
  }

  .planning__card p {
    max-width: min(18.26vw, 21.9rem);
    margin-bottom: 0;
    font-size: min(1.25vw, 1.5rem);
    line-height: 1.2;
  }

  .planning__card .statement {
    margin-top: min(2.08vw, 2.5rem);
    font-size: min(2.08vw, 2.5rem);
    line-height: 1.22;
  }

  .planning__visual {
    position: absolute;
    z-index: 2;
    top: min(1.67vw, 2rem);
    left: 42.86%;
    width: 57.14%;
  }

  .planning .media-frame {
    position: relative;
    z-index: 1;
    width: 92.85%;
    max-width: none;
    aspect-ratio: 679.676 / 484.816;
  }

  .planning .media-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .planning__dots {
    position: absolute;
    z-index: 2;
    top: 66.9%;
    right: 0;
    display: block;
    width: 13.1%;
    height: auto;
  }

  .quiz {
    --quiz-section-height: min(50vw, 60rem);

    position: relative;
    min-height: var(--quiz-section-height);
    overflow: hidden;
  }

  .quiz .container {
    position: relative;
    display: flex;
    width: 100%;
    max-width: none;
    min-height: var(--quiz-section-height);
    align-items: stretch;
    overflow: hidden;
  }

  .quiz .section-copy {
    position: relative;
    z-index: 2;
    display: flex;
    width: min(29vw, 34.75rem);
    min-height: var(--quiz-section-height);
    flex-direction: column;
    align-items: flex-start;
    padding-block: min(6vw, 7.2rem) min(4.5vw, 5.4rem);
    margin-left: calc(
      (100% - var(--desktop-content-track)) / 2 + var(--desktop-content-shift)
    );
  }

  .quiz .section-copy > .eyebrow {
    margin-bottom: min(0.3vw, 0.35rem);
    font-size: min(2.4vw, 2.9rem);
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1;
  }

  .quiz h2 {
    max-width: min(29vw, 34.75rem);
    margin-bottom: min(1.9vw, 2.25rem);
    font-size: min(3.8vw, 4.55rem);
    line-height: 1.06;
    letter-spacing: -0.02em;
  }

  .quiz .section-copy > p {
    max-width: min(28vw, 33.5rem);
    margin-bottom: min(0.85vw, 1rem);
    font-size: min(1.15vw, 1.38rem);
    line-height: 1.35;
  }

  .quiz .quiz__lead {
    margin-bottom: min(0.7vw, 0.85rem);
  }

  .quiz .button {
    width: min(25.5vw, 30.6rem);
    min-width: 0;
    padding-inline: min(1.5vw, 1.8rem);
    margin-top: min(1vw, 1.2rem);
    font-size: min(1.6vw, 1.925rem);
    font-weight: 400;
  }

  .quiz .section-copy > .fine-print {
    max-width: min(23vw, 27.5rem);
    margin-top: auto;
    margin-bottom: 0;
    font-size: min(0.88vw, 1.05rem);
    line-height: 1.28;
  }

  .quiz .fine-print strong {
    font-weight: 400;
  }

  .quiz .media-frame {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    background: var(--color-quiz-nude);
  }

  .quiz .media-frame::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(
      90deg,
      var(--color-quiz-nude) 0%,
      var(--color-quiz-nude) 38%,
      color-mix(in srgb, var(--color-quiz-nude) 92%, transparent) 47%,
      color-mix(in srgb, var(--color-quiz-nude) 52%, transparent) 56%,
      transparent 66%
    );
    content: "";
    pointer-events: none;
  }

  .quiz .media-frame img {
    position: absolute;
    top: 0;
    right: 0;
    width: 76.8%;
    max-width: none;
    height: 100%;
    object-fit: cover;
    object-position: right center;
  }

  .fertility-basics {
    position: relative;
    min-height: clamp(44rem, 48.8889vw, 58.6667rem);
    display: flex;
    align-items: center;
    overflow: hidden;
  }

  .fertility-basics::after {
    position: absolute;
    z-index: 0;
    top: clamp(2.75rem, 3.0556vw, 3.6667rem);
    left: calc(50% + clamp(19rem, 21.1111vw, 25.3333rem));
    width: clamp(20rem, 22.2222vw, 26.6667rem);
    aspect-ratio: 1;
    background: url("../assets/images/decor/fertility-ring.png") center / contain no-repeat;
    content: "";
    pointer-events: none;
  }

  .fertility-basics .section-heading {
    max-width: clamp(36rem, 40vw, 48rem);
    margin-left: clamp(2.5rem, 2.7778vw, 3.3333rem);
    margin-bottom: clamp(5.5rem, 6.1111vw, 7.3333rem);
  }

  .fertility-basics .section-heading h2,
  .fertility-factors h2,
  .egg-freezing h2,
  .journey h2 {
    font-size: 3.7rem;
    line-height: 1.03;
  }

  .fertility-basics .section-heading h2 {
    margin-bottom: clamp(1.25rem, 1.3889vw, 1.6667rem);
    font-size: clamp(2.9rem, 3.2222vw, 3.8667rem);
    line-height: 1.04;
  }

  .fertility-basics .section-heading p {
    max-width: 29ch;
    margin-bottom: 0;
    font-size: clamp(1.125rem, 1.25vw, 1.5rem);
    line-height: 1.3;
  }

  .fertility-basics h2 span,
  .fertility-factors h2 span,
  .journey h2 span {
    font-weight: 400;
  }

  .fertility-basics h2 strong {
    font-weight: 700;
  }

  .fertility-basics__grid {
    position: relative;
    z-index: 1;
    grid-template-columns:
      minmax(0, clamp(37rem, 41.1111vw, 49.3333rem))
      minmax(0, clamp(21.5rem, 23.8889vw, 28.6667rem));
    gap: clamp(1rem, 1.1111vw, 1.3333rem);
    align-items: start;
  }

  .fertility-summary {
    display: flex;
    height: clamp(31.375rem, 34.8611vw, 41.8333rem);
    align-self: start;
    flex-direction: column;
    justify-content: flex-start;
    padding:
      clamp(3.5rem, 3.8889vw, 4.6667rem)
      clamp(3.125rem, 3.4722vw, 4.1667rem);
    font-size: clamp(1.05rem, 1.1667vw, 1.4rem);
    line-height: 1.25;
  }

  .fertility-summary__heading {
    margin-bottom: clamp(1.0625rem, 1.1806vw, 1.4167rem);
    font-size: clamp(1.22rem, 1.3556vw, 1.6267rem);
    line-height: 1.2;
  }

  .fertility-summary__heading span {
    display: block;
  }

  .fertility-summary .definition-list {
    gap: clamp(0.75rem, 0.8333vw, 1rem);
    margin-top: 0;
    margin-bottom: clamp(2.25rem, 2.5vw, 3rem);
  }

  .fertility-summary .definition-list > div {
    padding-top: 0;
    border-top: 0;
  }

  .fertility-summary .definition-list dt {
    color: var(--color-gray-main);
    line-height: 1.15;
  }

  .fertility-summary .definition-list dd {
    margin-left: 0;
    line-height: 1.25;
  }

  .fertility-summary > p:last-child {
    margin-bottom: 0;
    font-size: clamp(1.15rem, 1.2778vw, 1.5333rem);
    line-height: 1.14;
  }

  .fertility-summary__copy span {
    display: block;
  }

  .fertility-basics .chart {
    width: 100%;
    max-width: clamp(37rem, 41.1111vw, 49.3333rem);
  }

  .fertility-basics .chart figcaption {
    display: none;
  }

  .fertility-basics .container {
    width: min(100% - 4rem, max(60rem, var(--desktop-content-track)));
  }

  .fertility-factors {
    min-height: auto;
    display: flex;
    align-items: center;
    padding-block:
      clamp(3rem, 4.4444vw, 5.3333rem)
      clamp(4rem, 5.5556vw, 6.6667rem);
  }

  .fertility-factors .split-layout {
    width: min(100% - 4rem, clamp(56rem, 62.2222vw, 74.6667rem));
    grid-template-columns:
      minmax(0, clamp(27rem, 30vw, 36rem))
      minmax(0, clamp(26rem, 28.8889vw, 34.6667rem));
    gap: clamp(3rem, 3.3333vw, 4rem);
    align-items: center;
  }

  .fertility-factors .media-frame {
    width: clamp(27rem, 30vw, 36rem);
    max-width: none;
    padding: 0;
    background: transparent;
  }

  .fertility-factors .factor-list {
    gap: clamp(1.35rem, 1.5vw, 1.8rem);
    margin-top: clamp(2.25rem, 2.5vw, 3rem);
    margin-bottom: clamp(2rem, 2.2222vw, 2.6667rem);
  }

  .fertility-factors h2 {
    color: var(--color-nude-heading-strong);
    font-size: clamp(2.45rem, 2.7222vw, 3.2667rem);
    line-height: 1.02;
  }

  .fertility-factors h2 span {
    font-weight: 300;
  }

  .fertility-factors .factor-list li {
    grid-template-columns: clamp(3rem, 3.3333vw, 4rem) minmax(0, 1fr);
    gap: clamp(1rem, 1.1111vw, 1.3333rem);
  }

  .fertility-factors .factor-list img {
    width: clamp(2.5rem, 2.7778vw, 3.3333rem);
    max-height: clamp(3.75rem, 4.1667vw, 5rem);
  }

  .fertility-factors .factor-list h3 {
    margin-bottom: clamp(0.2rem, 0.2222vw, 0.2667rem);
    font-size: clamp(0.9rem, 1vw, 1.2rem);
  }

  .fertility-factors .factor-list p {
    font-size: clamp(1rem, 1.1111vw, 1.3333rem);
    line-height: 1.35;
  }

  .fertility-factors .statement {
    max-width: clamp(27rem, 30vw, 36rem);
    font-size: clamp(1rem, 1.1111vw, 1.3333rem);
    font-weight: 400;
    line-height: 1.25;
  }

  .egg-freezing {
    min-height: clamp(40.5rem, 56.25vw, 67.5rem);
    display: flex;
    align-items: center;
    padding-block: 0;
  }

  .egg-freezing .split-layout {
    width: var(--desktop-content-track);
    max-width: none;
    grid-template-columns:
      minmax(0, clamp(28.5rem, 31.6667vw, 38rem))
      minmax(0, clamp(30rem, 33.3333vw, 40rem));
    gap: clamp(1.5rem, 1.6667vw, 2rem);
    transform: translateX(var(--desktop-content-shift));
  }

  .egg-freezing .media-frame {
    width: clamp(30rem, 33.3333vw, 40rem);
  }

  .egg-freezing .section-copy > p,
  .fertgroup-presence .section-copy > p {
    font-size: 1.1rem;
    line-height: 1.4;
  }

  .egg-freezing h2 {
    width: clamp(37.5rem, 41.6667vw, 50rem);
    margin-bottom: clamp(1.96875rem, 2.1911vw, 2.6293rem);
    font-size: clamp(2.8373rem, 3.1526vw, 3.7831rem);
    line-height: 1.1434;
    text-wrap: wrap;
  }

  .egg-freezing .section-copy > p {
    margin-bottom: clamp(0.9375rem, 1.0417vw, 1.25rem);
    font-size: clamp(1.1719rem, 1.3021vw, 1.5625rem);
    line-height: 1.2;
  }

  .egg-freezing .section-copy > p:first-of-type {
    font-weight: 700;
  }

  .egg-freezing .section-copy > p:last-of-type {
    margin-bottom: clamp(1.875rem, 2.0833vw, 2.5rem);
  }

  .egg-freezing .button {
    min-width: 0;
    width: clamp(16.6406rem, 18.4896vw, 22.1875rem);
    min-height: clamp(5.71875rem, 6.3508vw, 7.621rem);
    padding: 0 clamp(1.5rem, 1.6667vw, 2rem);
    font-size: clamp(1.4704rem, 1.6338vw, 1.9606rem);
    font-weight: 400;
    line-height: 1.1667;
  }

    .timing {
      height: 50vw;
      min-height: 38rem;
      max-height: 64rem;
      background-color: var(--color-pink-main);
      background-image:
        linear-gradient(
          90deg,
          rgb(201 107 146 / 0%) 36%,
          var(--color-pink-main) 60%
        ),
        url("../assets/images/sections/timing-984.webp");
    background-position: left top, left top;
    background-size: 100% 100%, auto 100%;
    background-repeat: no-repeat;
  }

  .timing .container {
    width: 100%;
    height: 100%;
    min-height: 0;
    grid-template-columns: 1fr;
    gap: 0;
  }

  .timing .timing__media {
    display: none;
  }

  .timing .section-copy {
    align-self: start;
    width: 31rem;
    max-width: calc(41% - 2rem);
    margin-top: clamp(6.5rem, 8vw, 10rem);
    margin-left: 59%;
    padding: 0;
  }

  .timing h2 {
    max-width: 22rem;
    margin-bottom: 1rem;
    font-size: min(3.783rem, 3.1526vw);
    line-height: 1.02;
  }

  .timing .section-copy > p {
    font-size: min(1.5625rem, 1.3021vw);
    line-height: 1.25;
  }

  .timing dd {
    font-size: min(1.3777rem, 1.1481vw);
    line-height: 1.35;
  }

  .timing .section-copy > p:first-of-type {
    max-width: 25rem;
    margin-bottom: 1.75rem;
  }

  .timing h3 {
    margin-bottom: 0.25rem;
    font-size: min(1.868rem, 1.5566vw);
  }

  .timing .age-ranges {
    width: 27rem;
    max-width: 100%;
    gap: 0.75rem 2.5rem;
    margin-bottom: 2rem;
  }

  .timing .age-ranges > div {
    padding-top: 0;
  }

  .timing dt {
    font-size: min(1.3777rem, 1.1481vw);
  }

  .timing .section-copy > p:last-child {
    max-width: 29rem;
    margin-bottom: 0;
  }

  .journey {
    min-height: min(45vw, 54rem);
    display: flex;
    align-items: center;
  }

  .journey .container {
    width: min(73.4vw, var(--container-wide));
  }

  .journey .section-heading {
    max-width: min(34vw, 40.75rem);
    margin-bottom: min(1.98vw, 2.375rem);
  }

  .journey .section-heading h2 {
    margin-bottom: min(1.85vw, 2.25rem);
    font-size: min(3.783rem, 3.1526vw);
    font-weight: 300;
    line-height: 1.07;
  }

  .journey .section-heading h2 strong {
    font-weight: 700;
  }

  .journey .section-heading h2 span {
    font-weight: 300;
  }

  .journey .section-heading p {
    margin-bottom: 0;
    font-size: min(1.868rem, 1.5566vw);
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
  }

  .journey-list {
    grid-template-columns: repeat(5, minmax(0, 216fr)) minmax(0, 249fr);
    gap: min(0.885vw, 1.0625rem);
  }

  .journey-list li {
    display: grid;
    min-height: min(18.646vw, 22.375rem);
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto 1fr;
    gap: min(0.72vw, 0.875rem) min(0.6vw, 0.75rem);
    padding: min(1.1vw, 1.3125rem);
    font-size: min(1.1481vw, 1.3777rem);
    line-height: 1.2;
  }

  .journey-list__number {
    align-self: start;
    margin-bottom: 0;
    font-size: min(3.2146vw, 3.8575rem);
  }

  .journey-list img {
    width: auto;
    height: min(3.4896vw, 4.1875rem);
    align-self: start;
    justify-self: end;
    margin-bottom: 0;
  }

  .journey-list h3,
  .journey-list p {
    grid-column: 1 / -1;
  }

  .journey-list h3 {
    margin-bottom: 0;
    font-size: min(1.1481vw, 1.3777rem);
    line-height: 1.2;
    text-transform: uppercase;
  }

  .journey-list li:nth-child(4) h3 {
    font-size: min(1.0417vw, 1.25rem);
    white-space: nowrap;
  }

  .journey-list li:nth-child(6) h3 {
    font-size: min(1.09375vw, 1.3125rem);
  }

  .journey-list p {
    align-self: start;
    font-size: min(1.1481vw, 1.3777rem);
    line-height: 1.2;
  }

  .fertgroup-presence {
    min-height: min(47vw, 56.4rem);
    display: flex;
    align-items: center;
  }

  .fertgroup-presence .split-layout {
    width: min(100%, var(--artboard-width));
    max-width: none;
    grid-template-columns: min(32.95vw, 39.54rem) minmax(0, 1fr);
    gap: min(6.25vw, 7.5rem);
    padding-right: min(2.1vw, 2.5rem);
    padding-left: min(11.7448vw, 14.09375rem);
  }

  .fertgroup-presence .section-copy {
    z-index: 2;
    width: auto;
    align-self: start;
    margin-top: min(7.5vw, 9rem);
    margin-left: 0;
  }

  .fertgroup-presence .section-logo {
    width: min(14.4vw, 17.28rem);
    margin-bottom: min(0.625vw, 0.75rem);
  }

  .fertgroup-presence h2 {
    margin-bottom: min(1.3vw, 1.56rem);
    font-size: min(2.5982vw, 3.1178rem);
    line-height: 1.2;
  }

  .fertgroup-presence .section-copy p {
    color: #040503;
    font-size: min(1.2331vw, 1.4797rem);
    line-height: 1.2;
  }

  .fertgroup-presence .section-copy p:first-of-type {
    margin-bottom: min(1.1vw, 1.32rem);
  }

  .fertgroup-presence .presence-map {
    width: min(46.875vw, 56.25rem);
    justify-self: start;
  }

  .fertgroup-presence .presence-map picture {
    width: 100%;
    margin: 0;
  }

  .map-legends {
    font-size: 0.7rem;
    line-height: 1.15;
  }

  .map-legends__left,
  .map-legends__right {
    position: absolute;
    display: grid;
    gap: 0.7rem;
  }

  .map-legends__left {
    bottom: 3rem;
    left: 0;
    width: 9.5rem;
  }

  .map-legends__right {
    top: 3rem;
    right: 0;
    width: 8.5rem;
  }

  .final-cta {
    min-height: 0;
    background: #342f2e;
  }

  .final-cta .container {
    width: min(100%, var(--artboard-width));
    min-height: 0;
    aspect-ratio: 1920 / 965;
    display: block;
  }

  .final-cta .media-frame {
    display: block;
  }

  .final-cta .media-frame::after {
    background: linear-gradient(
      90deg,
      #342f2e 0 20%,
      rgb(52 47 46 / 97%) 28%,
      rgb(52 47 46 / 76%) 40%,
      rgb(52 47 46 / 22%) 58%,
      transparent 74%
    );
  }

  .final-cta .media-frame img {
    object-position: center 12%;
    filter: brightness(0.98) saturate(0.96);
    transform: translateX(7.8%);
  }

  .final-cta .section-copy {
    position: absolute;
    top: min(9.4271vw, 11.3125rem);
    left: min(19.53125vw, 23.4375rem);
    width: min(33.75vw, 40.5rem);
    padding: 0;
  }

  .final-cta h2 {
    margin-bottom: min(1.5625vw, 1.875rem);
    font-size: min(3.1526vw, 3.783rem);
    line-height: 1.0408;
  }

  .final-cta .section-copy p {
    margin-bottom: min(0.7292vw, 0.875rem);
    font-size: min(1.3021vw, 1.5625rem);
    line-height: 1.2;
  }

  .final-cta .button,
  .final-cta .button:disabled {
    width: min(22.8125vw, 27.375rem);
    min-height: min(4.375vw, 5.25rem);
    gap: min(0.9375vw, 1.125rem);
    margin-top: min(1.9792vw, 2.375rem);
    padding: min(0.625vw, 0.75rem) min(1.4583vw, 1.75rem);
    font-size: min(1.6338vw, 1.9606rem);
    line-height: 1.17;
  }

  .final-cta .button img {
    width: min(3.125vw, 3.75rem);
  }

  .site-footer {
    position: relative;
    height: min(32.604167vw, 39.125rem);
    min-height: 0;
    padding: 0;
    background: var(--color-ice) url("../assets/images/decor/footer-motif.svg") center / 100% 100% no-repeat;
  }

  .site-footer__inner {
    position: relative;
    width: 100%;
    max-width: none;
    height: 100%;
    padding: 0;
    opacity: 1;
    pointer-events: auto;
  }

  .footer-brand {
    position: absolute;
    top: min(3.65vw, 4.375rem);
    left: min(4.9vw, 5.875rem);
    gap: 0;
  }

  .footer-brand img {
    width: min(19.5833vw, 23.5rem);
  }

  .footer-brand__tagline {
    padding-left: min(0.94vw, 1.125rem);
    font-size: min(1.40625vw, 1.6875rem);
  }

  .social-icons {
    position: absolute;
    top: min(3.65vw, 4.375rem);
    right: min(3vw, 3.5625rem);
    display: grid;
    gap: min(0.55vw, 0.66rem);
  }

  .social-icons img {
    width: min(3.3854vw, 4.0625rem);
    height: min(3.2292vw, 3.875rem);
  }

  .legal-text {
    position: absolute;
    bottom: min(3.125vw, 3.75rem);
    left: 50%;
    width: 90%;
    margin: 0;
    transform: translateX(-50%);
    font-size: min(0.76155vw, 0.913865rem);
    line-height: 1.2;
    white-space: nowrap;
  }

}

@media (min-width: 56rem) and (max-width: 74.999rem) {
  .hero__inner {
    width: 100%;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .hero__media,
  .hero__media picture,
  .hero__media img {
    width: 100%;
    height: 100%;
  }

  .hero__media img {
    object-fit: cover;
  }

  .hero__content {
    padding: clamp(4rem, 8vw, 6rem) clamp(2rem, 5vw, 4rem);
  }

  .map-legends {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-5);
    margin-top: var(--space-4);
  }
}

@media (max-width: 74.999rem) {
  .egg-freezing h2 .egg-title-break {
    display: none;
  }

  .site-header {
    position: sticky;
    top: 0;
    z-index: 20;
    background: var(--color-white);
  }

  .site-header__inner {
    display: grid;
    min-height: 5rem;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    padding-block: var(--space-3);
  }

  .site-header nav {
    grid-column: 1 / -1;
  }

  .js .site-header .nav-toggle {
    position: relative;
    z-index: 2;
    display: inline-flex;
  }

  .js .site-header nav {
    position: fixed;
    inset: 5rem 0 0;
    z-index: 1;
    padding: clamp(2rem, 6vw, 4rem) max(1rem, env(safe-area-inset-right)) max(2rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
    overflow-y: auto;
    background: var(--color-white);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-0.5rem);
    transition:
      opacity var(--transition),
      transform var(--transition);
    visibility: hidden;
  }

  .site-header.is-menu-open nav {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
    visibility: visible;
  }

  .site-nav {
    width: min(100%, 36rem);
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    margin-inline: auto;
  }

  .site-nav a {
    display: flex;
    min-height: 3.5rem;
    align-items: center;
    padding-block: var(--space-3);
    border-bottom: var(--border-subtle);
    font-size: var(--text-base);
  }

  body.menu-open {
    overflow: hidden;
  }
}

@media (max-width: 55.999rem) {
  .container {
    width: min(100% - 1.5rem, var(--container-width));
  }

  .quiz .section-copy > .fine-print {
    margin-top: var(--space-4);
  }

  .fertility-summary .definition-list dd {
    margin-inline-start: 0;
  }

  .timing {
    padding-top: 0;
  }

  .timing .container {
    width: 100%;
    gap: 0;
  }

  .timing .timing__media {
    width: 100%;
  }

  .timing .section-copy {
    padding: clamp(2.5rem, 10vw, 4rem) 0.75rem 0;
  }

  .timing .timing__line {
    display: inline;
  }

  .hero__inner {
    width: 100%;
  }

  .hero__media,
  .hero__media picture {
    width: 100%;
    height: clamp(19rem, 82vw, 21.5rem);
  }

  .hero__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%;
  }

  .hero__content {
    background: linear-gradient(
      90deg,
      #d9e2df 0%,
      #cdbba9 52%,
      var(--color-nude-main) 100%
    );
    color: var(--color-ink);
    padding: clamp(1.75rem, 8vw, 2rem) 1.25rem clamp(2.5rem, 10vw, 3.5rem);
  }

  .hero__content h1 {
    margin-bottom: 1.75rem;
    font-size: clamp(2.25rem, 10.8vw, 2.875rem);
    line-height: 1;
  }

  .hero__content h1 span {
    margin-top: 1rem;
    font-size: clamp(1.375rem, 7vw, 1.875rem);
    line-height: 1.12;
  }

  .hero__content p {
    margin-bottom: 0.75rem;
    font-size: clamp(1rem, 4.35vw, 1.125rem);
    line-height: 1.48;
  }

  .hero__content > p:first-of-type {
    margin-bottom: 0.5rem;
  }

  .hero__content .button {
    order: 0;
    width: 100%;
    min-width: 0;
    align-self: stretch;
    margin-top: 1.25rem;
    padding-inline: 1rem;
    text-align: center;
  }

  .hero__support {
    margin: 1.25rem 0 0;
    font-size: 0.9375rem !important;
    line-height: 1.45 !important;
    text-align: center;
  }

  .section-heading {
    margin-bottom: var(--space-6);
  }

  .factor-list li {
    grid-template-columns: 3.25rem minmax(0, 1fr);
  }

  .factor-list img {
    max-width: 3rem;
  }

  .map-legends {
    display: grid;
    gap: var(--space-5);
    margin-top: var(--space-5);
  }

  .footer-brand {
    grid-template-columns: minmax(0, auto) auto;
    align-items: center;
    gap: clamp(0.75rem, 3vw, 1rem);
    max-width: 100%;
  }

  .footer-brand img {
    width: min(15.5rem, 64vw);
  }

  .footer-brand__tagline {
    padding-top: 0;
    padding-left: clamp(0.625rem, 2.5vw, 0.875rem);
    border-top: 0;
    border-left: 1px solid var(--color-pink-main);
    font-size: clamp(0.95rem, 4.2vw, 1.15rem);
  }

  .button {
    width: 100%;
  }
}

@media (pointer: coarse) {
  .nav-toggle,
  .site-nav a,
  .button {
    min-height: 2.75rem;
  }
}