/* service.css — services hub + service pages (shared components live in base.css) */

/* Hub: 4-across service card grid (8 cards = 2 rows) */
.cards-4 {
  margin: var(--panel-gap) var(--panel-inset);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--panel-gap);
}

.cards-4 .pcard h3 { font-size: 1.1rem; }

.cards-4 .pcard__price { font-size: 1.6rem; }

@media (max-width: 1024px) {
  .cards-4 { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
  .cards-4 { grid-template-columns: 1fr; }
}