/* Process: page layout. Shared type, grid and closing CTA live in editorial.css. */
.egg-static .pr-hero {
  padding-block: var(--bsp-gap-section);
}

.egg-static .pr-hero__books {
  grid-column: 1 / 4;
  grid-row: 1;
  align-self: end;
  margin-bottom: .28em;
  font-size: var(--egg-type-hero);
}

.egg-static .pr-hero__books svg {
  display: block;
  width: min(100%, 18.5vw);
  height: auto;
}

.egg-static .pr-hero__title {
  grid-column: 4 / -1;
  grid-row: 1;
  margin: 0;
  color: var(--bsp-ink);
}

.egg-static .pr-hero__intro {
  grid-column: 4 / -1;
  grid-row: 2;
  margin-top: clamp(4.5rem, 9.3vw, 9.3rem);
}

.egg-static .pr-hero__ko {
  margin: 0;
  color: var(--bsp-ink);
  font-size: var(--egg-type-body);
  line-height: 1.8;
}

.egg-static .pr-steps {
  padding-block: clamp(2rem, 4vw, 4rem) clamp(3rem, 6vw, 6rem);
  row-gap: clamp(3rem, 5.1vw, 4.6rem);
}

.egg-static .pr-step:nth-child(3n + 1) {
  grid-column: 4 / 7;
}

.egg-static .pr-step:nth-child(3n + 2) {
  grid-column: 7 / 10;
}

.egg-static .pr-step:nth-child(3n) {
  grid-column: 10 / 13;
}

.egg-static .pr-step__name {
  margin: 0 0 clamp(1.4rem, 2.5vw, 2.3rem);
  color: var(--bsp-ink);
  font-size: clamp(1.3rem, 1.95vw, 1.8rem);
  font-weight: 700;
  letter-spacing: -.01em;
  line-height: 1.2;
}

.egg-static .pr-step__sub {
  margin: 0 0 clamp(1.3rem, 2.2vw, 2rem);
  color: var(--bsp-ink);
  font-size: var(--egg-type-body);
  font-weight: 500;
  line-height: 1.6;
}

.egg-static .pr-step__body {
  margin: 0;
  color: var(--bsp-ink);
  font-size: var(--egg-type-body);
  line-height: 1.78;
}

@media (max-width: 1024px) {
  .egg-static .pr-hero__books {
    grid-column: 1 / 4;
  }

  .egg-static .pr-hero__title,
  .egg-static .pr-hero__intro {
    grid-column: 4 / -1;
  }

  .egg-static .pr-step:nth-child(odd) {
    grid-column: 1 / 7;
  }

  .egg-static .pr-step:nth-child(even) {
    grid-column: 7 / -1;
  }
}

@media (max-width: 720px) {
  .egg-static .pr-hero__title {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  .egg-static .pr-hero__books {
    grid-column: 1 / span 7;
    grid-row: auto;
    order: 3;
    margin: 2.5rem 0 0;
  }

  .egg-static .pr-hero__intro {
    grid-column: 1 / -1;
    grid-row: auto;
    order: 2;
    margin-top: 2.75rem;
  }

  .egg-static .pr-step:nth-child(n) {
    grid-column: 1 / -1;
  }

  .egg-static .pr-steps {
    row-gap: 2.75rem;
  }
}

@media (max-width: 720px) {
  .egg-static .pr-hero__books svg { width: clamp(7rem, 30vw, 10rem); }
  .egg-static .pr-step__name { margin-bottom: var(--egg-space-md); }
  .egg-static .pr-step__sub { margin-bottom: var(--egg-space-md); }
}