.lede { text-align: left; }
.lede + .lede { margin-top: calc(var(--half) - 2px); }

.services { display: flex; flex-direction: column; gap: calc(1.2 * var(--leading)); }
.service {
  display: flex;
  align-items: flex-start;
  gap: calc(1.2 * var(--leading));
  border: 1px solid var(--color-divider);
  border-radius: var(--radius-sm);
  padding: calc(1.2 * var(--leading)) calc(1.3 * var(--leading));
  background: var(--color-bg);
  transition: border-color .15s;
}
.service:hover { border-color: var(--color-accent-300); }
.service-icon { width: 56px; height: 56px; display: block; flex-shrink: 0; mix-blend-mode: multiply; }
.service h2 {
  font-family: var(--font-heading);
  font-size: 22px;
  margin: 0 0 calc(var(--half) - 4px);
  color: var(--color-accent-800);
  background: color-mix(in srgb, var(--color-accent) 10%, transparent);
  padding: 2px 4px;
  border-radius: 2px;
  display: inline-block;
}
.service p { font-size: 15px; line-height: var(--leading); margin: 0; color: color-mix(in srgb, var(--color-text) 94%, transparent); }

.close-row {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
  gap: var(--leading) clamp(24px, 5vw, 64px);
  align-items: center;
}
.close-figure { margin: 0; width: 100%; max-width: 264px; justify-self: end; }
.close-figure img { display: block; width: 100%; aspect-ratio: 3/4; object-fit: cover; }

@media (max-width: 620px) { .service { flex-direction: column; gap: var(--half); } }
@media (max-width: 760px) { .close-row { grid-template-columns: 1fr; } .close-figure { justify-self: start; max-width: 240px; } }