/* ============================================================
   SERVICES PAGE — page-specific styles
   ============================================================ */

.services-intro {
  padding: 80px 0 100px;
}

.services-intro__body {
  font-size: 1.1875rem;
  font-weight: 400;
  line-height: 1.72;
  color: var(--text-2);
  max-width: 620px;
}

.services-intro__body + .services-intro__body {
  margin-top: 1.5em;
}

.services-tiers {
  padding: 0 0 120px;
}

.services-tiers__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}

.services-tier {
  padding: 48px 56px;
  border-bottom: 0.5px solid var(--rule);
  border-right: 0.5px solid var(--rule);
}

.services-tier:nth-child(2n) {
  border-right: none;
}

.services-tier:nth-last-child(-n+2) {
  border-bottom: none;
}

.services-tier__n {
  font-family: var(--font-mono);
  font-size: 4.5rem;
  font-weight: 500;
  letter-spacing: -0.04em;
  line-height: 1;
  color: var(--text-4);
  margin-bottom: 20px;
  display: block;
}

.services-tier__h {
  font-size: clamp(1.25rem, 2vw, 1.5rem);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--text-1);
  margin-bottom: 8px;
  line-height: 1.2;
}

.services-tier__eyebrow {
  font-size: 0.875rem;
  font-weight: 400;
  font-style: italic;
  color: var(--text-2);
  margin-bottom: 20px;
}

.services-tier__body {
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.8;
  color: var(--text-2);
}

.services-tier__body + .services-tier__body {
  margin-top: 1.5em;
}

.services-cta {
  padding: 100px 0 140px;
}

.services-cta__h {
  font-size: clamp(2rem, 3.5vw, 2.75rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.08;
  color: var(--text-1);
  margin-bottom: 16px;
}

.services-cta__p {
  font-size: 1.1875rem;
  font-weight: 400;
  line-height: 1.72;
  color: var(--text-2);
  max-width: 520px;
  margin-bottom: 36px;
}

@media (max-width: 768px) {
  .services-tiers__grid { grid-template-columns: 1fr; }
  .services-tier { border-right: none; padding: 36px 0; }
  .services-tier:nth-last-child(-n+2) { border-bottom: 0.5px solid var(--rule); }
  .services-tier:last-child { border-bottom: none; }
}
