/* ============================================================
   Services page — service card layout
   ============================================================ */

.services-stack { padding: 100px 0; }

.svc-list {
  display: flex;
  flex-direction: column;
  gap: 60px;
}

.svc-card {
  background: var(--orange-soft);
  border: 1px solid rgba(255, 127, 0, 0.18);
  border-radius: 16px;
  padding: 56px 64px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 100px;
  align-items: center;
  transition: box-shadow .25s ease, transform .25s ease;
}
.svc-card:hover {
  box-shadow: 0 18px 50px rgba(255, 127, 0, 0.12);
}
.svc-card.reverse .svc-body { order: 1; }
.svc-card.reverse .svc-image { order: 2; }

.svc-body h2.h2 { margin-bottom: 14px; }
.svc-body > .lede { margin-bottom: 28px; max-width: 640px; }

.svc-sub {
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 16px;
  color: var(--ink);
}

.svc-list-items {
  margin: 0 0 32px;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.svc-list-items li {
  font-size: 16px;
  font-weight: 300;
  color: var(--ink);
  line-height: 1.5;
  position: relative;
  padding-left: 26px;
}
.svc-list-items li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 0 4px rgba(255, 127, 0, 0.15);
}

.svc-image {
  border-radius: 12px;
  overflow: hidden;
  aspect-ratio: 5 / 4;
  background: #f0f0f0;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.08);
}
.svc-image img { width: 100%; height: 100%; object-fit: cover; }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 1100px) {
  .services-stack { padding: 70px 0; }
  .svc-list { gap: 40px; }
  .svc-card {
    grid-template-columns: 1fr;
    gap: 40px;
    padding: 40px 32px;
  }
  .svc-card.reverse .svc-body { order: 0; }
  .svc-card.reverse .svc-image { order: 0; }
  .svc-image { aspect-ratio: 16/10; }
}

@media (max-width: 700px) {
  .svc-card { padding: 28px 22px; gap: 28px; }
  .svc-sub { font-size: 18px; }
  .svc-list-items li { font-size: 14px; padding-left: 22px; }
  .svc-list-items li::before { width: 10px; height: 10px; top: 8px; }
}
