/* Client-directed Services page: static dark image-overlay category cards. */
.services-page-dark {
  background: #030b11;
  color: #e7faf3;
}
.services-page-banner {
  padding: clamp(88px, 13vw, 164px) clamp(24px, 7vw, 108px) clamp(46px, 7vw, 86px);
  background:
    radial-gradient(circle at 85% 0%, rgba(82, 174, 162, 0.22), transparent 38%),
    linear-gradient(180deg, #061a20 0%, #030b11 100%);
  border-bottom: 1px solid rgba(158, 231, 219, 0.22);
  text-align: center;
}
.services-page-banner__eyebrow {
  margin: 0 0 12px;
  color: #9be5d7;
  font-family: "Comfortaa", system-ui, sans-serif;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
.services-page-banner h1 {
  margin: 0;
  color: #effffb;
  font-family: "Comfortaa", system-ui, sans-serif;
  font-size: clamp(2rem, 4vw, 4rem);
  font-weight: 700;
}
.service-category-stack {
  display: grid;
  gap: clamp(22px, 4vw, 56px);
  padding: clamp(28px, 5vw, 80px) clamp(14px, 4vw, 64px) clamp(64px, 9vw, 128px);
}
.service-category-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(151, 233, 218, 0.28);
  border-radius: 26px;
  background-image:
    linear-gradient(105deg, rgba(3, 19, 24, 0.94) 0%, rgba(4, 21, 26, 0.86) 51%, rgba(2, 11, 16, 0.92) 100%),
    var(--category-image);
  background-position: center;
  background-size: cover;
  box-shadow: 0 26px 76px rgba(0, 0, 0, 0.33);
  scroll-margin-top: 104px;
}
.service-category-card::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(99, 211, 193, 0.08), transparent 44%);
  content: "";
  pointer-events: none;
}
.service-category-card__content {
  padding: clamp(28px, 5vw, 72px);
}
.service-category-card h2 {
  max-width: 21ch;
  margin: 0 0 clamp(24px, 4vw, 48px);
  color: #eafff8;
  font-family: "Comfortaa", system-ui, sans-serif;
  font-size: clamp(1.55rem, 3vw, 3.1rem);
  font-weight: 700;
  line-height: 1.16;
  text-shadow: 0 3px 18px rgba(0, 0, 0, 0.72);
}
.service-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(14px, 2vw, 24px);
}
.service-detail-card {
  min-width: 0;
  padding: clamp(20px, 2.3vw, 32px);
  border: 1px solid rgba(193, 250, 239, 0.2);
  border-radius: 18px;
  background: rgba(1, 11, 16, 0.62);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(4px);
}
.service-detail-card h3 {
  margin: 0;
  color: #f0fff9;
  font-family: "Comfortaa", system-ui, sans-serif;
  font-size: clamp(1rem, 1.5vw, 1.35rem);
  font-weight: 700;
  line-height: 1.35;
}
.service-detail-card__pricing {
  margin: 12px 0 14px !important;
  color: #a8f0e1 !important;
  font-family: "Comfortaa", system-ui, sans-serif;
  font-size: clamp(0.8rem, 1.04vw, 0.95rem) !important;
  font-weight: 700;
  line-height: 1.45;
}
.service-detail-card p:not(.service-detail-card__pricing) {
  margin: 0;
  color: rgba(236, 255, 249, 0.9);
  font-size: clamp(0.9rem, 1.08vw, 1.03rem);
  line-height: 1.72;
}
.service-detail-card__book {
  margin-top: 1.35rem;
}
@media (max-width: 800px) {
  .services-page-banner { padding-top: 104px; }
  .service-category-stack { padding-inline: 12px; }
  .service-category-card { border-radius: 18px; }
  .service-category-card__content { padding: 26px 18px; }
  .service-detail-grid { grid-template-columns: 1fr; }
  .service-detail-card { padding: 21px 18px; }
  .service-category-card { background-position: center top; }
}