/* Keep a section's heading and primary content together on laptop-height screens. */
@media (min-width:901px){
  .process{min-height:0;padding-top:36px;padding-bottom:42px}
  .process-heading{margin-top:28px}
  .process-heading>p{width:41%;padding-left:4%;margin:0;box-sizing:border-box}
  .process h2{font-size:clamp(42px,4vw,68px);line-height:1.12}
  .brew-stage{min-height:clamp(465px,43vw,560px);margin:12px 0 6px}
  .process-photo{width:60%;max-width:1050px;inset-inline-start:-3%}
  .brew-stage .stage-copy{width:41%;padding-left:4%}
  .stage-copy h3{margin:14px 0}
  .film-preview{width:min(100%,400px);margin-top:22px}
  .stage-tabs button{padding:16px 0}

  .soul{min-height:0;padding-top:36px;padding-bottom:45px}
  .soul .giant{font-size:clamp(140px,18vw,285px);margin:55px 0 0}
  .soul-copy{top:25%;left:51%;right:5%}
  .soul-copy h2{font-size:clamp(38px,3.7vw,55px);line-height:1.12;margin:18px 0 22px}

  .products-collection{padding-top:38px}
  .collection-heading{margin:40px 0 38px}
  .collection-heading-title .eyebrow{margin-bottom:17px}
  .collection-heading h2{font-size:clamp(49px,5vw,78px)}
  .products-compare{padding-top:38px;padding-bottom:72px}
  .compare-heading{margin:48px 0 40px}
  .products-business{padding-top:38px;padding-bottom:85px}
  .products-business .business-grid{padding-top:55px}

  .intro-statement,.intro-steps{padding-top:38px;padding-bottom:72px}
  .intro-statement-grid{padding-top:55px}
  .intro-steps h2{margin:45px 0 42px}
  .intro-step-grid>div{min-height:185px}
  .intro-next{padding-top:85px;padding-bottom:95px}

  .guide-hero+.how-section,.guide-hero~.how-section{padding-top:38px;padding-bottom:72px}
  .guide-hero+.how-section .how-grid,.guide-hero~.how-section .how-grid{padding-top:52px}
  .guide-hero~.how-section .how-steps{padding-top:55px}
  .guide-hero~.how-section .how-steps article{min-height:225px}
  .guide-hero~.how-section .how-steps h3{margin-top:35px}
}
@media (max-width:900px){
  .process{min-height:0}
  .soul{min-height:0}
}

/* On shorter desktop screens, keep each introduction with the content it introduces. */
@media (min-width:901px) and (max-height:850px){
  .process{padding-top:24px;padding-bottom:22px}
  .process .section-top{padding-bottom:17px}
  .process-heading{margin-top:18px}
  .process h2{font-size:clamp(42px,3.7vw,58px)}
  .brew-stage{min-height:425px;margin:8px 0 4px}
  .stage-tabs button{padding:11px 0}

  .discovery{padding-top:28px;padding-bottom:48px}
  .discovery .section-top{padding-bottom:17px}
  .discovery-head{padding:34px 0 30px}
  .discovery-card{height:clamp(365px,31vw,430px)}
  .field-notes{padding:25px 0 20px}
}