/* Controlled correction pass: service scannability and mobile spacing only. */
.service-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e5ebf3;
}

.service-card-meta span {
  color: var(--service-accent, #1d6edc);
}

.service-card-meta small {
  max-width: 190px;
  padding-left: 10px;
  border-left: 3px solid var(--service-accent, #1d6edc);
  color: #52627a;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  text-align: right;
}

.service-hub-card {
  --service-accent: #287bef;
  box-shadow: inset 0 3px 0 var(--service-accent), 0 12px 30px rgba(18, 49, 88, 0.045);
}

.service-card-google-local-visibility { --service-accent: #0873b1; }
.service-card-social-media { --service-accent: #386ecb; }
.service-card-paid-advertising { --service-accent: #174da9; }
.service-card-crm-automation { --service-accent: #19598c; }
.service-card-customer-marketing { --service-accent: #b9820d; }

.service-hub-card > strong {
  color: var(--service-accent);
}

@media (max-width: 600px) {
  .site-shell .section {
    padding-block: 52px;
  }

  .site-shell .section-intro {
    margin-bottom: 28px;
  }

  .site-shell .page-hero {
    padding: 52px 0 42px;
  }

  .site-shell .page-hero p,
  .site-shell .section-intro p {
    font-size: 16px;
  }

  .service-hub-grid,
  .package-grid,
  .website-tier-grid,
  .value-ladder-grid,
  .purchase-standards {
    gap: 14px;
  }

  .service-hub-card,
  .offer-card,
  .package-grid-detailed .package {
    padding: 22px 19px;
  }

  .service-card-meta {
    align-items: flex-start;
  }

  .service-card-meta small {
    max-width: 160px;
  }

  .planner-section {
    padding: 52px 0;
  }

  .planner-grid {
    gap: 26px;
  }

  .planner-proof {
    gap: 8px;
    margin-top: 20px;
  }

  .planner-card {
    padding: 20px;
  }

  .package-paths {
    padding: 28px 0;
  }

  .package-paths .container > div {
    padding: 17px 18px;
  }

  .website-tier-card {
    padding: 20px 18px;
  }

  .tier-visual,
  .tier-authority .tier-visual {
    min-height: 225px;
    margin-bottom: 20px;
  }

  .website-tier-card ul {
    gap: 7px;
    margin-bottom: 20px;
  }

  .value-ladder-grid article,
  .purchase-standards article {
    padding: 20px;
  }

  .package-detail-list {
    margin-bottom: 18px;
  }

  .package-scope-note {
    margin-top: 18px;
  }

  .site-shell .final-cta {
    padding: 52px 0;
  }

  .site-shell .footer {
    padding: 42px 0 22px;
  }
}