/* Layout gaps own the space between columns/rows. Gutenberg's flow margins
   must not add to, or replace, that space when a layout stacks. */
:is(.pr-hero-grid, .pr-two-col, .pr-three-col, .pr-services-grid,
    .pr-process-grid, .pr-related-grid, .pr-contact-grid, .pr-footer-top,
    .pr-faq-topic-grid, .pr-studio-hero-grid, .pr-studio-story-grid,
    .pr-studio-values-grid, .pr-project-row, .pr-journal-grid) > * {
  min-width: 0;
}

:is(.pr-contact-grid, .pr-faq-topic-grid, .pr-studio-hero-grid,
    .pr-studio-story-grid, .pr-studio-values-grid,
    .pr-project-row, .pr-journal-grid) > .wp-block-group {
  margin-block: 0;
}

/* Percentage column gutters are intentional. Vertical gutters use lengths so
   tall content cannot inflate them or escape the section's intrinsic height. */
.pr-two-col,
.pr-faq-topic-grid,
.pr-studio-story-grid {
  row-gap: clamp(32px, 4vw, 48px);
}

.pr-contact-grid {
  row-gap: clamp(40px, 6vw, 56px);
}

.pr-footer-top {
  row-gap: clamp(32px, 4vw, 48px);
}

/* Keep the number and all wrapped lines aligned, including on narrow phones. */
.pr-next-steps p:not(.pr-eyebrow) {
  display: grid;
  grid-template-columns: 2ch minmax(0, 1fr);
  column-gap: 16px;
  align-items: baseline;
}

.pr-next-steps strong {
  margin-right: 0;
}

@media (max-width: 900px) {
  .pr-contact-intro {
    margin-bottom: 0;
  }
}

@media (max-width: 520px) {
  /* Leave room for the rotated 404 lettering on the smallest phones. */
  .pr-lost-number {
    font-size: clamp(8.8rem, 45vw, 10.3rem);
  }
}