/* Homepage rhythm: section boundaries, then headings, then grouped content.
   Scoped here so shared service-page components keep their existing spacing. */
.pm-home {
  --home-section-space: clamp(88px, 8.75vw, 120px);
  --home-divider-space: 80px;
  --home-heading-space: clamp(48px, 4.5vw, 64px);
}
.pm-home :is(.home-stance, .pain-points, .engineer-role) {
  padding-top: var(--home-section-space);
}
.pm-home :is(.home-stance-shell, .pain-points-shell, .engineer-role-shell) {
  padding-bottom: var(--home-divider-space);
}
.pm-home :is(.home-products, .why-callout, .quote-callout, .story-unified, .cta-glacier) {
  padding-block: var(--home-section-space);
}
.pm-home :is(.engineer-role-heading, .home-products-heading, .quote-callout-head) {
  margin-bottom: var(--home-heading-space);
}
.pm-home .pain-points-shell { row-gap: 48px; }
.pm-home .engineer-role-list li { padding-block: 32px; }
.pm-home .cta-glacier .cta-lead { margin-bottom: 40px; }

@media (max-width: 760px) {
  .pm-home {
    --home-section-space: 72px;
    --home-divider-space: 56px;
    --home-heading-space: 40px;
  }
  .pm-home .home-stance-shell { row-gap: 32px; }
  .pm-home .pain-points-shell { row-gap: 36px; }
  .pm-home .engineer-role-list li { padding-block: 28px; }
  .pm-home .cta-glacier .cta-lead { margin-bottom: 32px; }
}

/* Shorter homepage story: services, proof, process, then enquiry. */
.pm-home .home-products-heading { display: block; }
.pm-home .service-intro-copy { margin-top: 16px; max-width: 58ch; }
.pm-home .home-process { padding-block: var(--home-section-space); }
.home-process-shell {
  max-width: 1160px;
  margin: 0 auto;
  padding-inline: 40px;
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, .65fr);
  align-items: center;
  gap: 80px;
}
.home-process h2 { max-width: 20ch; margin-bottom: 36px; }
.home-process-steps { list-style: none; display: grid; gap: 28px; margin: 0; padding: 0; }
.pm-home #root .home-process-steps h3 { font-size: 20px; font-weight: 400; margin-bottom: 8px; }
.home-process-steps p { max-width: 52ch; color: var(--pm-slate); font-size: 15px; line-height: 1.65; }
.home-process-shell > img { display: block; width: 100%; height: auto; image-rendering: pixelated; }
.pm-home .quote-callout { padding-bottom: 0; }
.pm-home .quote-callout-text {
  font-family: var(--font-body);
  font-size: clamp(20px, 2vw, 24px);
  font-weight: 400;
  line-height: 1.5;
  text-transform: none;
  max-width: 52ch;
  margin-inline: auto;
}
#who-we-are, #what-a-marketing-engineer-does { scroll-margin-top: 100px; }
@media (max-width: 760px) {
  .home-process-shell { grid-template-columns: minmax(0, 1fr); padding-inline: 20px; gap: 32px; }
  .home-process-shell > img { width: min(100%, 220px); margin-inline: auto; }
  .home-process h2 { max-width: 100%; }
}
/* Adjacent light sections share a single visual pause. */
.pm-home .home-process { padding-bottom: calc(var(--home-section-space) / 2); }

/* Four distinct offers share the same anatomy and visual weight. */
.pm-home .home-products-grid { gap: 20px; }
.pm-home #ongoing.product-card { grid-template-columns: 200px minmax(0, 1fr) minmax(240px, 300px); }
.pm-home #ongoing .product-preview { display: flex; }
.pm-home .product-card-actions .btn-primary__label { white-space: nowrap; }
@media (max-width: 960px) {
  .pm-home #ongoing.product-card { grid-template-columns: 160px minmax(0, 1fr); }
  .pm-home #ongoing .product-card-facts { grid-column: 2; }
}
@media (max-width: 760px) {
  .pm-home #ongoing.product-card { grid-template-columns: minmax(0, 1fr); }
  .pm-home #ongoing .product-card-facts { grid-column: auto; }
}
