.services {
  padding-bottom: clamp(72px, 9vw, 132px);
}

/* Keep these section labels identical to the shared site kicker style. */
.intro > .wrap > .kicker,
.services > .wrap > .kicker {
  font: 10px/1.35 "DM Mono", monospace !important;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* Prevent mobile browsers from selectively enlarging short label text. */
.kicker {
  font-size: 10px !important;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Keep the visible bottoms of the two service-intro texts aligned. */
.services-head > p { margin-bottom: 0; }

/* Match About's column geometry so the copy starts on the same reading edge. */
.services-head {
  grid-template-columns: 1.5fr .7fr;
  gap: min(12vw, 175px);
}

@media (max-width: 720px) {
  .services-head {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}

@media (orientation: portrait) {
  .intro-grid,
  .services-head {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}

/* Phone landscape has a narrower effective viewport than desktop/iPad landscape. */
@media (orientation: landscape) and (max-height: 500px) {
  .services-head > p { transform: translateX(-5.5vw); }
}

/* Match the About section's two-column rhythm in wide mobile/desktop views. */